|
|
@@ -1,363 +1,18 @@
|
|
|
<template>
|
|
|
- <scroll-view
|
|
|
- style="background-color: #f4f7ff"
|
|
|
- class="scroll-Y"
|
|
|
- id="slideview"
|
|
|
- scroll-y
|
|
|
- lower-threshold="50"
|
|
|
- scroll-top="0"
|
|
|
- scroll-left="0"
|
|
|
- scroll-with-animation="false"
|
|
|
- enable-back-to-top="false"
|
|
|
- @scrolltolower="bindscrolltolower"
|
|
|
- >
|
|
|
- <div>
|
|
|
- <!-- <LoginDom></LoginDom> -->
|
|
|
- <div
|
|
|
- :class="['choice_card', index === 0 && 'mt30']"
|
|
|
- v-for="(item, index) in list"
|
|
|
- :key="index"
|
|
|
- @click="toDetail(item.orderno)"
|
|
|
- >
|
|
|
- <div class="carno-box">
|
|
|
- <div class="carno">{{ item.carno }}</div>
|
|
|
- <div class="servicefee">{{ (item.servicefee / 100) | currency }}</div>
|
|
|
- </div>
|
|
|
- <uni-view class="choice_card_index">{{ item.parkname }} </uni-view>
|
|
|
- <uni-view class="choice_card_index orderno-box">
|
|
|
- <div class="orderno">订单号 : {{ item.orderno }}</div>
|
|
|
- <van-icon name="arrow" />
|
|
|
- </uni-view>
|
|
|
- <uni-view class="choice_card_index">
|
|
|
- <uni-view>入场时间 : {{ item.entertime }}</uni-view>
|
|
|
- </uni-view>
|
|
|
- <uni-view class="choice_card_index mb0 pb0">
|
|
|
- <uni-view>停车时长 : {{ item.serviceMin | parkingTime }}</uni-view>
|
|
|
- <uni-view :class="['status-box', item.payStatus !== 1 && 'other']">
|
|
|
- {{
|
|
|
- item.refundStatus === 1
|
|
|
- ? '已退款'
|
|
|
- : item.payStatus === 1
|
|
|
- ? '支付成功'
|
|
|
- : '支付失败'
|
|
|
- }}
|
|
|
- </uni-view>
|
|
|
- </uni-view>
|
|
|
- </div>
|
|
|
- <uni-view class="notice-info">
|
|
|
- <uni-view
|
|
|
- >{{ list.length === 4 ? '查看更多' : '没有更多数据了' }}
|
|
|
- </uni-view>
|
|
|
- </uni-view>
|
|
|
- </div>
|
|
|
- </scroll-view>
|
|
|
+ <div>
|
|
|
+ <component :is="componentName"></component>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-// const app = getApp()
|
|
|
-import uni from '@/utils/uniHooks';
|
|
|
-import LoginDom from '@/components/Login/Login.vue';
|
|
|
-import { wxToLoginCallback } from '@/utils/index';
|
|
|
-
|
|
|
-const app = {};
|
|
|
-let canloading = true;
|
|
|
-let pageNum = 1;
|
|
|
-import moment from 'moment';
|
|
|
-// import authorize from '@/components/authorize/authorize.vue';
|
|
|
-import { mapState } from 'vuex';
|
|
|
-// import {data as mockData} from './list'
|
|
|
-
|
|
|
+import officeBlueCom from './components/officeBlue/parkingFeeList.vue';
|
|
|
+import baseParkingFeeCom from './components/base/parkingFeeList.vue';
|
|
|
+import baseMixins from './mixins/base'
|
|
|
export default {
|
|
|
- // components: {
|
|
|
- // // authorize,
|
|
|
- // },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- list: [],
|
|
|
- };
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapState({
|
|
|
- mallId: (state) => state.mallId,
|
|
|
- openId: (state) => state.openid,
|
|
|
- member: (state) => state.member,
|
|
|
- }),
|
|
|
- },
|
|
|
- components: { LoginDom },
|
|
|
- mounted() {
|
|
|
- setTimeout(() => {
|
|
|
- uni.setNavigationBarTitle({
|
|
|
- title: '缴费记录',
|
|
|
- });
|
|
|
- }, 300);
|
|
|
- this.list = [];
|
|
|
- // 重新获取数据
|
|
|
- canloading = true;
|
|
|
- pageNum = 1;
|
|
|
- const member = uni.getStorageSync('member');
|
|
|
- if (member) {
|
|
|
- this.loadData();
|
|
|
- } else {
|
|
|
- wxToLoginCallback('parkingFeeList', (options) => {
|
|
|
- console.log(229, options);
|
|
|
- if ( options?.noLoginParkingFeeWebView === 'fail' ) {
|
|
|
- this.loadData();
|
|
|
- } else {
|
|
|
- this.$router.back(-1)
|
|
|
- }
|
|
|
- });
|
|
|
- /* // 前往登录
|
|
|
- window.toWXSendMsg({
|
|
|
- type: 'toLogin',
|
|
|
- options: {
|
|
|
- path: 'parkingFeeList',
|
|
|
- },
|
|
|
- });
|
|
|
- window.subscribe('callback', (options) => {
|
|
|
- // resolve(options);
|
|
|
- console.log(110, options);
|
|
|
- if (options.isReload) {
|
|
|
- window.location.reload();
|
|
|
- } else {
|
|
|
- this.loadData();
|
|
|
- }
|
|
|
- });*/
|
|
|
- // 登录的回调
|
|
|
- // this.loadData()
|
|
|
- /*this.$refs.authorize.login("/pages/parkingFee/parkingFee", () => {
|
|
|
- this.loadData()
|
|
|
- });*/
|
|
|
- }
|
|
|
- },
|
|
|
- // mounted() {
|
|
|
- // console.log(123, this.$route)
|
|
|
- // },
|
|
|
- // onReachBottom: function() {
|
|
|
- // console.log('canloading', canloading)
|
|
|
- // if (canloading) {
|
|
|
- // pageNum++
|
|
|
- // this.loadData()
|
|
|
- // }
|
|
|
- // },
|
|
|
- filters: {
|
|
|
- parkingTime(val) {
|
|
|
- const days = parseInt(val / 60 / 24);
|
|
|
- const hours = parseInt((val / 60) % 24);
|
|
|
- const minutes = parseInt(val % 60);
|
|
|
- if (days > 0) {
|
|
|
- return `${days}天 ${hours}小时 ${minutes}分钟`;
|
|
|
- }
|
|
|
- if (hours > 0) {
|
|
|
- return `${hours}小时 ${minutes}分钟`;
|
|
|
- }
|
|
|
- return `${minutes}分钟`;
|
|
|
- },
|
|
|
- },
|
|
|
- methods: {
|
|
|
- bindscrolltolower: function () {
|
|
|
- if (canloading) {
|
|
|
- pageNum++;
|
|
|
- this.loadData();
|
|
|
- }
|
|
|
- },
|
|
|
- // 获取停车记录
|
|
|
- loadData: function () {
|
|
|
- canloading = false;
|
|
|
- const params = {
|
|
|
- mallid: this.mallId,
|
|
|
- vipcode: this.member?.vipcode,
|
|
|
- openId: this.openId,
|
|
|
- page: pageNum || 1,
|
|
|
- pageSize: 4,
|
|
|
- };
|
|
|
- uni.showLoading({
|
|
|
- title: '加载中',
|
|
|
- });
|
|
|
- this.$md(params);
|
|
|
- uni.request({
|
|
|
- url: this.$baseURL + 'api/1.0/park/parkOrderList',
|
|
|
- data: params,
|
|
|
- method: 'POST',
|
|
|
- header: JSON.parse(uni.getStorageSync('handleUser')),
|
|
|
- success: (res) => {
|
|
|
- uni.hideLoading();
|
|
|
- if (res.data.code !== 0) {
|
|
|
- uni.showToast({
|
|
|
- title: res.data.msg,
|
|
|
- duration: 2000,
|
|
|
- icon: 'none',
|
|
|
- });
|
|
|
- this.initPage();
|
|
|
- } else {
|
|
|
- // 合并数据
|
|
|
- const records = res.data.data || [];
|
|
|
- if (records.length) {
|
|
|
- const list = this.list;
|
|
|
- this.list = [...list, ...records];
|
|
|
- } else {
|
|
|
- this.initPage();
|
|
|
- }
|
|
|
- // this.list = mockData.data
|
|
|
- }
|
|
|
- canloading = true;
|
|
|
- },
|
|
|
- fail: (err) => {
|
|
|
- uni.hideLoading();
|
|
|
- canloading = true;
|
|
|
- this.initPage();
|
|
|
- uni.showToast({
|
|
|
- title: res.data.msg,
|
|
|
- duration: 2000,
|
|
|
- icon: 'none',
|
|
|
- });
|
|
|
- },
|
|
|
- });
|
|
|
- },
|
|
|
- // 页码复原
|
|
|
- initPage: function () {
|
|
|
- pageNum--;
|
|
|
- if (pageNum <= 0) {
|
|
|
- pageNum = 0;
|
|
|
- }
|
|
|
- },
|
|
|
- // 查看详情
|
|
|
- toDetail(orderno) {
|
|
|
- this.$router.push({
|
|
|
- path: 'parkingFeeDetailSuccess?orderNo=' + orderno,
|
|
|
- });
|
|
|
- },
|
|
|
+ mixins:[baseMixins],
|
|
|
+ components: {
|
|
|
+ officeBlueCom,
|
|
|
+ baseParkingFeeCom,
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
-
|
|
|
-<style lang="less" scoped>
|
|
|
-.scroll-Y {
|
|
|
- width: 100%;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- height: 100vh;
|
|
|
- background: #f2f2f2;
|
|
|
-}
|
|
|
-
|
|
|
-.wrap {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- width: 100%;
|
|
|
-}
|
|
|
-
|
|
|
-.parkingFeeList-item {
|
|
|
- background: #fff;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- margin-top: 8px;
|
|
|
-
|
|
|
- .item {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- padding: 30px 36px;
|
|
|
- box-sizing: border-box;
|
|
|
-
|
|
|
- span {
|
|
|
- font-size: 16px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .item-bottom {
|
|
|
- border-top: 1px solid #f2f2f2;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- padding: 0px 36px;
|
|
|
- box-sizing: border-box;
|
|
|
- padding-top: 8px;
|
|
|
-
|
|
|
- uni-view {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- }
|
|
|
-
|
|
|
- span {
|
|
|
- color: #999;
|
|
|
- font-size: 14px;
|
|
|
- margin-bottom: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.choice_card {
|
|
|
- width: calc(100% - 120px);
|
|
|
- margin-left: 30px;
|
|
|
- // margin-top: 30px;
|
|
|
- margin-bottom: 30px;
|
|
|
- padding: 30px;
|
|
|
- // border-radius: 20px;
|
|
|
- position: relative;
|
|
|
- background-color: #fafbff;
|
|
|
- border-radius: 4px;
|
|
|
- border: 1px solid #d8dae0;
|
|
|
- &.mt30 {
|
|
|
- margin-top: 30px;
|
|
|
- }
|
|
|
- .carno-box {
|
|
|
- display: flex;
|
|
|
- padding-bottom: 18px;
|
|
|
- border-bottom: 1px solid #d8dae0;
|
|
|
- justify-content: space-between;
|
|
|
- margin-bottom: 20px;
|
|
|
- .carno {
|
|
|
- font-size: 36px;
|
|
|
- color: #333333;
|
|
|
- font-weight: 600;
|
|
|
- line-height: 50px;
|
|
|
- }
|
|
|
- .servicefee {
|
|
|
- font-size: 30px;
|
|
|
- font-weight: 600;
|
|
|
- color: #333333;
|
|
|
- line-height: 42px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .choice_card_index {
|
|
|
- font-size: 28px;
|
|
|
- font-weight: 400;
|
|
|
- color: #999999;
|
|
|
- line-height: 40px;
|
|
|
- margin-bottom: 12px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- &.mt0 {
|
|
|
- margin-top: 0;
|
|
|
- }
|
|
|
- &.mb0 {
|
|
|
- margin-bottom: 0;
|
|
|
- }
|
|
|
- &.pb0 {
|
|
|
- padding-bottom: 0;
|
|
|
- }
|
|
|
- .status-box {
|
|
|
- font-size: 30px;
|
|
|
- font-weight: 400;
|
|
|
- color: #064c8a;
|
|
|
- line-height: 42px;
|
|
|
- &.other {
|
|
|
- color: #999999;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .orderno-box {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.notice-info {
|
|
|
- text-align: center;
|
|
|
- color: #b5b3b3;
|
|
|
- padding-bottom: 30px;
|
|
|
-
|
|
|
- uni-view {
|
|
|
- margin-bottom: -7px;
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|
John-Hong