first commit
This commit is contained in:
PC-202306242200\Administrator
182
pages/home/components/Invest/order.vue
Normal file
182
pages/home/components/Invest/order.vue
Normal file
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<view class="order">
|
||||
<z-paging ref="paging" v-model="dataList" @query="queryList">
|
||||
<view style="height: 20rpx"></view>
|
||||
<view style="display: flex; align-items: center; margin: 0 30rpx 30rpx">
|
||||
<view
|
||||
style="font-weight: bold; position: relative; margin-right: 50rpx"
|
||||
:style="{
|
||||
color: purposeType == item.id ? '#333' : '#bbb'
|
||||
}"
|
||||
v-for="(item, index) in tabbar"
|
||||
:key="index"
|
||||
@click="swichMenu(item.id)"
|
||||
>
|
||||
<view style="position: relative; z-index: 9">{{ item.name }}</view>
|
||||
<view
|
||||
v-if="purposeType == item.id"
|
||||
style="width: 72rpx; height: 16rpx; background: #b6d0aa; border-radius: 48rpx 48rpx 48rpx 48rpx; position: absolute; bottom: -5rpx; left: 0"
|
||||
></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="p30">
|
||||
<view class="order_view" v-for="i in dataList" :key="i" @click="navTo(`/pages/order/details?id=${i.id}`)">
|
||||
<view class="order_view_dd">
|
||||
<view>
|
||||
<text style="font-weight: 500">订单号</text>
|
||||
:{{ i.orderNo }}
|
||||
</view>
|
||||
<view>
|
||||
<up-tag size="mini" v-if="i.status == 0" text="待支付" plain></up-tag>
|
||||
<up-tag size="mini" v-if="i.status == -1" text="已取消" type="warning" plain></up-tag>
|
||||
<up-tag size="mini" v-if="i.status == 1" text="支付成功" type="success" plain></up-tag>
|
||||
<up-tag size="mini" v-if="i.status == -2" text="退款" type="error" plain></up-tag>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order_view_info">
|
||||
<image class="order_view_info_img" :src="i.orderGoods.cover" mode="aspectFit"></image>
|
||||
<view class="order_view_info_right">
|
||||
<view class="order_view_info_right_tit">
|
||||
<view style="display: flex; align-items: center">
|
||||
<!-- <up-tag size="mini" :text="i.sourceType == 1 ? '商品' : '套餐'" bgColor="#4874e5" borderColor="#4874e5"></up-tag> -->
|
||||
<view>
|
||||
{{ i.orderGoods.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order_view_info_right_num" style="display: flex; align-items: center; justify-content: space-between">数量:{{ i.num }}</view>
|
||||
<view class="order_view_info_right_mon">
|
||||
订单金额:
|
||||
<text style="color: crimson">￥{{ i.payMoney }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
style="
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-top: 1rpx solid rgba(153, 153, 153, 0.5);
|
||||
margin-top: 15rpx;
|
||||
padding-top: 15rpx;
|
||||
"
|
||||
>
|
||||
<view style="font-size: 28rpx">{{ i.createdAt }}</view>
|
||||
<view>
|
||||
<up-tag size="mini" v-if="i.orderPlatform == 3" text="支付宝" plain></up-tag>
|
||||
<up-tag size="mini" v-if="i.orderPlatform == 2" text="微信" type="success" plain></up-tag>
|
||||
<up-tag size="mini" v-if="i.orderPlatform == 1" text="钱包" type="warning" plain></up-tag>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</z-paging>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue';
|
||||
import { useNav } from '@/hooks/useNav.js';
|
||||
import { onPullDownRefresh, onPageScroll, onReachBottom } from '@dcloudio/uni-app';
|
||||
import { orderPage } from '@/api/api.js';
|
||||
import { timeFormat } from '@/uni_modules/uview-plus';
|
||||
const { navTo } = useNav();
|
||||
|
||||
const paging = ref(null);
|
||||
let dataList = ref([]);
|
||||
|
||||
let dataFrom = reactive({
|
||||
status: 1,
|
||||
businessPayType: '',
|
||||
sourceType: ''
|
||||
});
|
||||
|
||||
let tabbar = [
|
||||
{
|
||||
name: '已支付',
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
name: '待支付',
|
||||
id: 0
|
||||
},
|
||||
{
|
||||
name: '已取消',
|
||||
id: -1
|
||||
}
|
||||
];
|
||||
|
||||
let purposeType = ref(1);
|
||||
|
||||
const swichMenu = (index) => {
|
||||
dataFrom.status = index;
|
||||
paging.value.reload();
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
const queryList = (pageNo, pageSize) => {
|
||||
const params = {
|
||||
current: pageNo,
|
||||
pageSize: pageSize,
|
||||
...dataFrom
|
||||
};
|
||||
|
||||
orderPage(params)
|
||||
.then((res) => {
|
||||
paging.value.complete(res);
|
||||
})
|
||||
.catch((res) => {
|
||||
paging.value.complete(false);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.order {
|
||||
&_view {
|
||||
background: #ffffff;
|
||||
border-radius: 16rpx;
|
||||
padding: 25rpx;
|
||||
margin-bottom: 30rpx;
|
||||
&_info {
|
||||
@include flex;
|
||||
&_img {
|
||||
width: 208rpx;
|
||||
height: 208rpx;
|
||||
margin-right: 15rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
&_right {
|
||||
flex: 1;
|
||||
font-size: 28rpx;
|
||||
color: #232323;
|
||||
&_tit {
|
||||
@include flex($space: space-between);
|
||||
margin-bottom: 15rpx;
|
||||
}
|
||||
&_num {
|
||||
margin-bottom: 15rpx;
|
||||
}
|
||||
&_mon {
|
||||
margin-bottom: 15rpx;
|
||||
text {
|
||||
color: #ff2e24;
|
||||
}
|
||||
}
|
||||
&_time {
|
||||
}
|
||||
}
|
||||
}
|
||||
&_dd {
|
||||
@include flex($space: space-between);
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
color: #232323;
|
||||
margin-bottom: 15rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user