|
@@ -1,46 +1,32 @@
|
|
|
<template>
|
|
<template>
|
|
|
<view class="container">
|
|
<view class="container">
|
|
|
- <scroll-view scroll-y="true" class="orders-scroll1" v-for="(item,index) in state.orderList" :key="index">
|
|
|
|
|
- <view class="wrapper">
|
|
|
|
|
- <view class="order-list">
|
|
|
|
|
- <view class="order">
|
|
|
|
|
-
|
|
|
|
|
- <view class="header">
|
|
|
|
|
- <view class="flex-fill font-size-medium"></view>
|
|
|
|
|
- <view class="status">
|
|
|
|
|
- <view>
|
|
|
|
|
- 未支付
|
|
|
|
|
|
|
+ <scroll-view scroll-y="true" class="orders-scroll1">
|
|
|
|
|
+ <uv-list>
|
|
|
|
|
+ <uv-list-item
|
|
|
|
|
+ clickable show-arrow v-for="(item,index) in state.orderList" :key="index" @click="handleClickDetail(item)">
|
|
|
|
|
+ <template #default>
|
|
|
|
|
+ <view class="wallet-item">
|
|
|
|
|
+ <view class="wallet-item_header">
|
|
|
|
|
+ <view class="flex-inline">
|
|
|
|
|
+ <text class="wallet-item_header-type">洗车消费</text>
|
|
|
|
|
+ <uv-tags class="ml10" style="margin-left: 10px;" size="mini" plain
|
|
|
|
|
+ :type="item.payStatus==0?'primary':(item.payStatus==1?'success':'error')"
|
|
|
|
|
+ :text="fmtDictName('Order.pay', item.payStatus)"></uv-tags>
|
|
|
|
|
+
|
|
|
|
|
+<!-- <uv-tags class="ml10" style="margin-left: 10px;" size="mini" plain
|
|
|
|
|
+ :type="item.orderStatus==0?'primary':(item.orderStatus==1?'success':'error')"
|
|
|
|
|
+ :text="fmtDictName('Order.status', item.orderStatus)"></uv-tags>-->
|
|
|
</view>
|
|
</view>
|
|
|
-
|
|
|
|
|
- <uv-icon name="arrow-right" size="16"></uv-icon>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="images">
|
|
|
|
|
- <image src="/static/mock/zhuti.jpg"></image>
|
|
|
|
|
- <view class="good_name">{{ item.name }}</view>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="info">
|
|
|
|
|
- <view class="left">
|
|
|
|
|
- <view>订单编号:{{ item.number }}</view>
|
|
|
|
|
- <view>下单时间:{{ item.time }}</view>
|
|
|
|
|
|
|
+ <text class="wallet-item_header-amt">{{ (item.amount / 100).toFixed(2) }}元</text>
|
|
|
</view>
|
|
</view>
|
|
|
- <view class="right">¥{{ item.money }}</view>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="action" style="text-align: right;">
|
|
|
|
|
- <uv-button plain type="primary" size="mini">{{ item.payment }}</uv-button>
|
|
|
|
|
- <view class="ml10">
|
|
|
|
|
- <uv-button type="error" size="mini" class="ml10" style="margin-left: 10px;">{{ item.delete }}</uv-button>
|
|
|
|
|
|
|
+ <view class="wallet-item_body">
|
|
|
|
|
+ <text class="wallet-item_body-order">{{ item.orderId }}</text>
|
|
|
|
|
+ <text class="wallet-item_body-time">{{ fmtDateTime(item.createTime) }}</text>
|
|
|
</view>
|
|
</view>
|
|
|
- <!-- <view class="button button_pay"
|
|
|
|
|
- style="width: 36px;text-align:center;font-size: 10px;">{{ item.payment }}
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="button button_del" hover-class="none"
|
|
|
|
|
- style="width: 25px;text-align:center;font-size: 10px;">{{ item.delete }}
|
|
|
|
|
- </view>-->
|
|
|
|
|
</view>
|
|
</view>
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </uv-list-item>
|
|
|
|
|
+ </uv-list>
|
|
|
</scroll-view>
|
|
</scroll-view>
|
|
|
<!-- <login-bar class="w100 text-center"></login-bar>-->
|
|
<!-- <login-bar class="w100 text-center"></login-bar>-->
|
|
|
<!-- <tab-bar :index="3"/>-->
|
|
<!-- <tab-bar :index="3"/>-->
|
|
@@ -49,44 +35,23 @@
|
|
|
|
|
|
|
|
<script lang="ts" setup>
|
|
<script lang="ts" setup>
|
|
|
import {reactive} from 'vue'
|
|
import {reactive} from 'vue'
|
|
|
-import {onHide, onShow} from "@dcloudio/uni-app";
|
|
|
|
|
-import TabBar from "@/components/tab-bar/index.vue";
|
|
|
|
|
-import LoginBar from "@/components/login-bar/index.vue";
|
|
|
|
|
|
|
+import {onHide, onShow, onPullDownRefresh, onReachBottom,} from "@dcloudio/uni-app";
|
|
|
|
|
+import {get} from "@/utils/https";
|
|
|
|
|
+import {fmtDictName, fmtDateTime} from "@/utils/common";
|
|
|
|
|
|
|
|
const initState = () => ({
|
|
const initState = () => ({
|
|
|
- orderList: [{
|
|
|
|
|
- name: "菌满堂野生菌火锅",
|
|
|
|
|
- number: "DB23473207638761",
|
|
|
|
|
- time: "2021-11-23 14:02:00",
|
|
|
|
|
- money: "239.20",
|
|
|
|
|
- payment: "去支付",
|
|
|
|
|
- delete: "删除"
|
|
|
|
|
|
|
+ orderList: [],
|
|
|
|
|
+ query: {
|
|
|
|
|
+ pageNum: 1,
|
|
|
|
|
+ pageSize: 10
|
|
|
},
|
|
},
|
|
|
- {
|
|
|
|
|
-
|
|
|
|
|
- name: "菌满堂野生菌火锅",
|
|
|
|
|
- number: "DB23473207638761",
|
|
|
|
|
- time: "2021-11-23 14:02:00",
|
|
|
|
|
- money: "239.20",
|
|
|
|
|
- payment: "去支付",
|
|
|
|
|
- delete: "删除"
|
|
|
|
|
- },
|
|
|
|
|
- {
|
|
|
|
|
-
|
|
|
|
|
- name: "菌满堂野生菌火锅",
|
|
|
|
|
- number: "DB23473207638761",
|
|
|
|
|
- time: "2021-11-23 14:02:00",
|
|
|
|
|
- money: "239.20",
|
|
|
|
|
- payment: "去支付",
|
|
|
|
|
- delete: "删除"
|
|
|
|
|
- }
|
|
|
|
|
- ]
|
|
|
|
|
|
|
+ hasNext: false
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
const state = reactive(initState())
|
|
const state = reactive(initState())
|
|
|
|
|
|
|
|
onShow(() => {
|
|
onShow(() => {
|
|
|
- uni.setNavigationBarTitle({title: '我的订单'})
|
|
|
|
|
|
|
+ uni.setNavigationBarTitle({title: '洗车订单'})
|
|
|
let gd = getApp<any>().globalData;
|
|
let gd = getApp<any>().globalData;
|
|
|
if (!gd.token) {
|
|
if (!gd.token) {
|
|
|
console.error(gd)
|
|
console.error(gd)
|
|
@@ -99,10 +64,37 @@ onHide(() => {
|
|
|
Object.assign(state, initState());
|
|
Object.assign(state, initState());
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
|
|
+onPullDownRefresh(() => {
|
|
|
|
|
+ setTimeout(function () {
|
|
|
|
|
+ state.query.pageNum = 1;
|
|
|
|
|
+ loadOrderList()
|
|
|
|
|
+ }, 100);
|
|
|
|
|
+})
|
|
|
|
|
+
|
|
|
|
|
+onReachBottom(() => {
|
|
|
|
|
+ if (state.hasNext) {
|
|
|
|
|
+ state.query.pageNum++
|
|
|
|
|
+ loadOrderList()
|
|
|
|
|
+ }
|
|
|
|
|
+})
|
|
|
|
|
+
|
|
|
const loadOrderList = () => {
|
|
const loadOrderList = () => {
|
|
|
//load order list
|
|
//load order list
|
|
|
|
|
+ get(`/wash-order/listMyWashOrder`, state.query).then((res: any) => {
|
|
|
|
|
+ state.orderList = res.list;
|
|
|
|
|
+ state.hasNext = res.list.length == state.query.pageSize
|
|
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
|
|
+ }).catch(e => {
|
|
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
|
|
+ })
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+const handleClickDetail = (orderDetail: any) => {
|
|
|
|
|
+ uni.navigateTo({
|
|
|
|
|
+ url: `/pages-order/detail/index?id=${orderDetail.id}&type=3&orderNo=${orderDetail.orderId}`,
|
|
|
|
|
+ });
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
@@ -110,6 +102,51 @@ const loadOrderList = () => {
|
|
|
background-color: #f6f6f6;
|
|
background-color: #f6f6f6;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+.wallet-item {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: column;
|
|
|
|
|
+ padding: 14rpx;
|
|
|
|
|
+ border-radius: 8rpx;
|
|
|
|
|
+ margin: 10rpx 16 prx 10rpx 10rpx;
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ &_header {
|
|
|
|
|
+ display: inline-flex;
|
|
|
|
|
+ flex-wrap: nowrap;
|
|
|
|
|
+ justify-content: space-between;
|
|
|
|
|
+
|
|
|
|
|
+ &-type {
|
|
|
|
|
+ font-weight: 500;
|
|
|
|
|
+ font-size: 14px;
|
|
|
|
|
+ margin-right: 15rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ &-status {
|
|
|
|
|
+ font-size: 12px;
|
|
|
|
|
+ margin-left: 6px;
|
|
|
|
|
+ border: 1px solid $uni-color-primary;
|
|
|
|
|
+ border-radius: 2rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ &-amt {
|
|
|
|
|
+ font-weight: 500;
|
|
|
|
|
+ font-size: 17px;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ &_body {
|
|
|
|
|
+ padding: 10rpx 0;
|
|
|
|
|
+ display: inline-flex;
|
|
|
|
|
+ justify-content: space-between;
|
|
|
|
|
+
|
|
|
|
|
+ &-order, &-time {
|
|
|
|
|
+ font-size: 12px;
|
|
|
|
|
+ color: $uni-color-subtitle
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
.font-size-lg {
|
|
.font-size-lg {
|
|
|
border: none;
|
|
border: none;
|
|
|
background-color: var(--theme_color);
|
|
background-color: var(--theme_color);
|