|
@@ -1,12 +1,8 @@
|
|
<template>
|
|
<template>
|
|
<view class="container-view">
|
|
<view class="container-view">
|
|
- <view class="top-bg" >
|
|
|
|
- <navBar name="我的套餐" bgColor="transparent"></navBar>
|
|
|
|
- <!-- <view class="flex-row" :style="'height:'+navabarHeight+'px;'">
|
|
|
|
- <view class="flex-row" @tap="bindReturnView"><img class="return-view" src="https://qiniu.bms16.com/FnHXbzly7aXi8zLghrTU5BZdwH5_" /></view>
|
|
|
|
- <text class="top-text">我的套餐</text>
|
|
|
|
- </view> -->
|
|
|
|
-
|
|
|
|
|
|
+ <view class="top-bg">
|
|
|
|
+ <Navigation :scroll='scrollTop'></Navigation>
|
|
|
|
+ <view :style="{height: `calc(${statusBarHeight}px + 100px)`}"></view>
|
|
<view class="package-card flex-row flex-between">
|
|
<view class="package-card flex-row flex-between">
|
|
<view class="flex-row flex-column" style="align-items: flex-start;">
|
|
<view class="flex-row flex-column" style="align-items: flex-start;">
|
|
<view class="left-first flex-row">
|
|
<view class="left-first flex-row">
|
|
@@ -25,22 +21,6 @@
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="box-view">
|
|
<view class="box-view">
|
|
- <!-- <view class="package-card flex-row flex-between">
|
|
|
|
- <view class="flex-row flex-column" style="align-items: flex-start;">
|
|
|
|
- <view class="left-first flex-row">
|
|
|
|
- <view>小米 Su7</view>
|
|
|
|
- <img class="left-img" src="https://qiniu.bms16.com/Fpf25Lkkrx05pvLw08mksVQKAQWf" />
|
|
|
|
- </view>
|
|
|
|
- <view class="left-second flex-row">
|
|
|
|
- <view style="margin-right: 32rpx;">适用电池:<text>48v20Ah</text></view>
|
|
|
|
- <view>押金:<text>$5.0</text></view>
|
|
|
|
- </view>
|
|
|
|
- <view class="left-third">
|
|
|
|
- <view>卡号:<text>2024110202578</text></view>
|
|
|
|
- </view>
|
|
|
|
- </view>
|
|
|
|
- <img class="card-right" src="https://qiniu.bms16.com/FuOJQxzypa-NginyHGdsWlzwnB8z" />
|
|
|
|
- </view> -->
|
|
|
|
<view class="package-view" v-for="item in hireOrderList">
|
|
<view class="package-view" v-for="item in hireOrderList">
|
|
<view class="top-view flex-row flex-between">
|
|
<view class="top-view flex-row flex-between">
|
|
<view class="top-title" v-if="item.package_type == 1">
|
|
<view class="top-title" v-if="item.package_type == 1">
|
|
@@ -63,7 +43,8 @@
|
|
<view v-if="item.package_type != 2" class="package-item" style="margin-bottom: 32rpx;">
|
|
<view v-if="item.package_type != 2" class="package-item" style="margin-bottom: 32rpx;">
|
|
<view class="item-title">有效时长</view>
|
|
<view class="item-title">有效时长</view>
|
|
<view class="item-info">
|
|
<view class="item-info">
|
|
- {{calculateRemainingDays(item.expire_time)}}<text style="color: #9FA7B7;">/{{item.total_day}}天</text>
|
|
|
|
|
|
+ {{calculateRemainingDays(item.expire_time)}}<text
|
|
|
|
+ style="color: #9FA7B7;">/{{item.total_day}}天</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-if="item.package_type == 1" class="package-item">
|
|
<view v-if="item.package_type == 1" class="package-item">
|
|
@@ -85,29 +66,47 @@
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</template>
|
|
<script module="tools" lang="wxs" src="@/pages/common/wxs/tools.wxs"></script>
|
|
<script module="tools" lang="wxs" src="@/pages/common/wxs/tools.wxs"></script>
|
|
- <script module="tools" lang="sjs" src="@/pages/common/wxs/tools.sjs"></script>
|
|
|
|
|
|
+<script module="tools" lang="sjs" src="@/pages/common/wxs/tools.sjs"></script>
|
|
<script>
|
|
<script>
|
|
var config = require('../../common/config_gyq.js');
|
|
var config = require('../../common/config_gyq.js');
|
|
var common = require('../../common/common.js');
|
|
var common = require('../../common/common.js');
|
|
var http = require('../../common/request.js');
|
|
var http = require('../../common/request.js');
|
|
var storage = require('../../common/storage.js');
|
|
var storage = require('../../common/storage.js');
|
|
const dayjs = require('dayjs');
|
|
const dayjs = require('dayjs');
|
|
- import { getRemainingTime } from '../../utils/util.js';
|
|
|
|
|
|
+ import {
|
|
|
|
+ getRemainingTime
|
|
|
|
+ } from '../../utils/util.js';
|
|
export default {
|
|
export default {
|
|
components: {
|
|
components: {
|
|
-
|
|
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ onPageScroll(e) {
|
|
|
|
+ this.scrollTop = e.scrollTop
|
|
},
|
|
},
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
- hireOrderList:[],
|
|
|
|
|
|
+ hireOrderList: [],
|
|
page: 1,
|
|
page: 1,
|
|
limit: 10,
|
|
limit: 10,
|
|
- car_info:{},
|
|
|
|
|
|
+ car_info: {},
|
|
// statusBarHeight: 0,
|
|
// statusBarHeight: 0,
|
|
// navabarHeight: 0,
|
|
// navabarHeight: 0,
|
|
- packageList: [
|
|
|
|
- {ctime: '2024-04-04 16:15',total_duration: 30,efficient_day: 24,change_rate: 6,total_times: 10,status:1},
|
|
|
|
- {ctime: '2024-04-04 16:15',total_duration: 30,efficient_day: 24,change_rate: 6,total_times: 10,status:2},
|
|
|
|
|
|
+ packageList: [{
|
|
|
|
+ ctime: '2024-04-04 16:15',
|
|
|
|
+ total_duration: 30,
|
|
|
|
+ efficient_day: 24,
|
|
|
|
+ change_rate: 6,
|
|
|
|
+ total_times: 10,
|
|
|
|
+ status: 1
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ ctime: '2024-04-04 16:15',
|
|
|
|
+ total_duration: 30,
|
|
|
|
+ efficient_day: 24,
|
|
|
|
+ change_rate: 6,
|
|
|
|
+ total_times: 10,
|
|
|
|
+ status: 2
|
|
|
|
+ },
|
|
]
|
|
]
|
|
};
|
|
};
|
|
},
|
|
},
|
|
@@ -132,33 +131,33 @@
|
|
* 生命周期函数--监听页面显示
|
|
* 生命周期函数--监听页面显示
|
|
*/
|
|
*/
|
|
onShow: function() {
|
|
onShow: function() {
|
|
-
|
|
|
|
|
|
+
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
- calculateRemainingDays(expirationDate) {
|
|
|
|
- // 获取当前时间
|
|
|
|
- const now = dayjs();
|
|
|
|
- // 解析到期时间
|
|
|
|
- const endDate = dayjs(expirationDate);
|
|
|
|
- // 计算剩余天数
|
|
|
|
- const remainingDays = endDate.diff(now, 'day');
|
|
|
|
- return remainingDays || 0;
|
|
|
|
|
|
+ calculateRemainingDays(expirationDate) {
|
|
|
|
+ // 获取当前时间
|
|
|
|
+ const now = dayjs();
|
|
|
|
+ // 解析到期时间
|
|
|
|
+ const endDate = dayjs(expirationDate);
|
|
|
|
+ // 计算剩余天数
|
|
|
|
+ const remainingDays = endDate.diff(now, 'day');
|
|
|
|
+ return remainingDays || 0;
|
|
},
|
|
},
|
|
- srcFn(){
|
|
|
|
|
|
+ srcFn() {
|
|
uni.navigateTo({
|
|
uni.navigateTo({
|
|
url: `/pages/batteryPackage/batteryPackage`
|
|
url: `/pages/batteryPackage/batteryPackage`
|
|
})
|
|
})
|
|
},
|
|
},
|
|
- validDurationFn(start,end){
|
|
|
|
- return getRemainingTime(start,end)
|
|
|
|
|
|
+ validDurationFn(start, end) {
|
|
|
|
+ return getRemainingTime(start, end)
|
|
},
|
|
},
|
|
- async listFn(){
|
|
|
|
|
|
+ async listFn() {
|
|
let {
|
|
let {
|
|
data
|
|
data
|
|
} = await http.postApi(config.API_FLK_EXCHANGE_PACKAGE_ORDER_LIST, {
|
|
} = await http.postApi(config.API_FLK_EXCHANGE_PACKAGE_ORDER_LIST, {
|
|
page: this.page,
|
|
page: this.page,
|
|
- pay_status:2,
|
|
|
|
- car_sn:this.car_info.car_sn,
|
|
|
|
|
|
+ pay_status: 2,
|
|
|
|
+ car_sn: this.car_info.car_sn,
|
|
limit: this.limit,
|
|
limit: this.limit,
|
|
})
|
|
})
|
|
if (data.code == 200) {
|
|
if (data.code == 200) {
|
|
@@ -178,7 +177,8 @@
|
|
|
|
|
|
<style>
|
|
<style>
|
|
@import './package.css';
|
|
@import './package.css';
|
|
- .packageBtn{
|
|
|
|
|
|
+
|
|
|
|
+ .packageBtn {
|
|
width: 686rpx;
|
|
width: 686rpx;
|
|
height: 80rpx;
|
|
height: 80rpx;
|
|
background: #060809;
|
|
background: #060809;
|