first commit

pages/order/index.vue

@@ -0,0 +1,155 @@
+<template>
+	<view class="xkl-com-bg">
+		<view style="height: 20rpx;"></view>
+		<u-subsection :list="tabData.list" keyName="name" :current="tabData.current"
+			@change="sectionChange"></u-subsection>
+		<view style="height: 20rpx;"></view>
+		<view v-if="!orderItems.length" style="padding: 30rpx;background-color: #ffffff;border-radius: 10rpx;">
+			<u-empty mode="list"></u-empty>
+		</view>
+		<view v-else>
+			<view
+				style="background-color: #ffffff;color: #666666;padding: 30rpx;font-size: 28rpx; margin-bottom: 20rpx;border-radius: 16rpx;"
+				v-for="(item,index) in orderItems" :key="index" :url="`/pages/goods/detail?id=${item.id}`">
+				<view class="u-flex u-flex-between" style="font-size: 30rpx;">
+					<view>订单号：{{item.order_no}}</view>
+					<u-tag :text="config.pay_type[item.pay_type]" v-if="item.pay_type!=0" :name="config.pay_type[item.pay_type]" plain
+						type="warning"></u-tag>
+				</view>
+				<view style="height: 20rpx;"></view>
+				<view class="u-flex">
+					<u--image width="220rpx" height="220rpx" :src="item.goods.cover[0]" radius="16rpx"></u--image>
+					<view style="padding: 0 20rpx;">
+						<view>{{item.goods.name}}</view>
+						<view style="height: 14rpx;"></view>
+						<view>数量：{{item.num}}</view>
+						<view style="height: 14rpx;"></view>
+						<view>订单金额：<text style="color: #FF1A1A;">￥{{item.pay_money}}</text></view>
+						<view style="height: 14rpx;"></view>
+						<view v-if="item.goods.integral > 0">赠送积分：{{item.goods.integral}}</view>
+					</view>
+				</view>
+				<u-divider></u-divider>
+				<view class="u-flex u-flex-between">
+					<view>{{item.created_at}}</view>
+					<view>
+						<u-tag :text="config.status[item.status]" plain type="success"></u-tag>
+					</view>
+				</view>
+			</view>
+		</view>
+		<u-loadmore :status="loadStatus" />
+		<view style="height: 500rpx;"></view>
+	</view>
+</template>
+
+<script>
+	let self;
+	export default {
+		data() {
+			return {
+				tabData: {
+					list: [{
+						name: '待付款',
+						status: 0,
+					}, {
+						name: '待生效',
+						status: 1,
+					}, {
+						name: '已生效',
+						status: 2,
+					}, ],
+					current: 2
+				},
+				orderItems: [],
+				search: {
+					status: 2,
+					page: 1
+				},
+				page: {
+					current: 0,
+					last_page: 1
+				},
+				loadStatus: 'loadmore',
+				config: null
+			}
+		},
+		mounted() {
+
+		},
+		onLoad(option) {
+			self = this;
+			if (option && option.status) {
+				self.search.status = 1;
+			}
+			
+			self.getOrderItems();
+			
+		},
+		onShow() {
+
+		},
+		
+		
+
+		
+		
+		onReachBottom() {
+			if (!self.pageStatus()) {
+				return;
+			}
+			self.loadStatus = 'loading';
+			self.search.page = ++self.search.page;
+
+			self.getOrderItems();
+		},
+		async onPullDownRefresh() {
+			self.search.page = 1;
+			self.orderItems = [];
+
+			await self.getOrderItems();
+			uni.stopPullDownRefresh();
+		},
+		methods: {
+			convertToCustomArray(obj) {
+			    const keys = Object.keys(obj);
+			    return keys.map(key => ({
+			        name: obj[key],
+			        status: parseInt(key, 10)
+			    }));
+			},
+			sectionChange(index) {
+				self.search.status = self.tabData.list[index].status;
+				self.tabData.current = index;
+				self.orderItems = [];
+				self.getOrderItems();
+			},
+			pageStatus() {
+				self.loadStatus = 'loadmore';
+				if (self.search.page >= self.page.last_page) {
+					self.loadStatus = 'nomore';
+					return false;
+				}
+				return true;
+			},
+			getOrderItems() {
+				self.$http.post('/shop/v10/order/items', self.search).then(({
+					data,
+					success
+				}) => {
+					if (success) {
+						self.orderItems = self.orderItems.concat(data.items.data);
+						self.config = data.config;
+						self.page.last_page = data.items.last_page;
+						// self.tabData.list = this.convertToCustomArray(data.config.status)
+						self.pageStatus();
+					}
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+
+</style>