初始化

This commit is contained in:
魏啾
2024-03-21 15:43:18 +08:00
parent 08c5d22de6
commit fab2d5f480
534 changed files with 76501 additions and 1 deletions

921
pages/mall/order/index.vue Normal file
View File

@@ -0,0 +1,921 @@
<template>
<view class="content" :style="[theme]">
<view class="onecontent">
<view class="flex-start">
<view class="onecontent_oen flex-start">
<input class="onecontent_oen_input" type="text" v-model="like" placeholder="搜索订单/商家名/商品名">
<text class="onecontent_oen_text" @click="init_fn">搜索</text>
</view>
<view class="onecontent_oen_right flex-start" v-if="style_type != 2" @click="showpicker = true">
<image class="onecontent_oen_rightimage" src="@/static/screen.png" mode="aspectFill"></image>
<view class="onecontent_oen_rightimageview">筛选</view>
</view>
</view>
<view class="onecontent_tow flex-between">
<view ref="uTabs" class="onecontent_tow_item flex-colum" v-for="(item,index) in swipercurrentdata"
:key="index" @click="orderswitch(index)">
<view :class="swiperCurrent == index?'onecontent_tow_itemtexts':'onecontent_tow_itemtext'">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="towcontent">
<swiper :current="swiperCurrent" @animationfinish="animationfinish" :style="{height:height}">
<swiper-item v-for="(item,index) in list_" :key="index">
<scroll-view scroll-y style="width: 100%;" :style="{height:height}" @scrolltolower="lower">
<view class="towcontentitem" v-for="(item1,index1) in list_[index].data" :key="index1"
@click="eeInfo(item1)">
<view class="towcontentitemone flex-between">
<text class="towcontentitemone_one">{{item1.store_title}}</text>
<view class="towcontentitemone_tow flex-start">
<!-- <image class="towcontentitemone_towimage"
:src="item.store_avatar"
mode="aspectFill">
</image> -->
<text v-if="item1.status == 0">待付款</text>
<text v-if="item1.status == 1">待发货</text>
<text v-if="item1.status == 2">待收货</text>
<text v-if="item1.status == 3">已收货/评价</text>
<text v-if="item1.status == 4">退款中 </text>
<text v-if="item1.status == 5">退款成功</text>
<text v-if="item1.status == 6">取消订单</text>
<!-- <text v-if="item1.status == 7">已退款</text>-->
<text v-if="item1.status == 7">已拒绝</text>
</view>
</view>
<view class="towcontentitemtow flex-start" v-for="(item2,index) in item1.goods"
:key="item2.id">
<image class="towcontentitemtow_imge" :src="item2.img" mode="aspectFill"></image>
<view class="towcontentitemtow_one flex-colum-start">
<text class="towcontentitemtow_one_one">{{item2.title}}</text>
<text class="towcontentitemtow_one_tow">
<text style="font-size:28rpx;">¥</text>{{item2.spec}}</text>
<text class="towcontentitemtow_one_there">
×{{item2.number}}
</text>
<view class="towcontentitemtow_one_four">
{{item2.goods_price}}
</view>
</view>
<!-- <view class="towcontentitemtow_tow">
{{item1.number}}
</view> -->
</view>
<view class="towcontentitemthere_text_iitem">
{{item1.number}}件商品 合计:<text>{{item1.goods_total_price}}</text>
</view>
<view class="towcontentitemthere">
<view v-if="item1.status == 0"
class="towcontentitemthereitem towcontentitemthereitem_tow"
@click.stop="orderordercancel(item1)">
取消订单
</view>
<view v-if="item1.status == 1 || item1.status == 2 || item1.status == 3"
class="towcontentitemthereitem towcontentitemthereitem_tow"
@click.stop="orderordercancelrefund(item1)">
申请售后
</view>
<view v-if="item1.status == 4 || item1.status == 5"
class="towcontentitemthereitem towcontentitemthereitem_tow"
@click.stop="applylrefund(item1)">
查看退款
</view>
<view class="towcontentitemthereitem towcontentitemthereitem_tow"
v-if="item1.status == 3 || item1.status == 5" @click.stop="orderorderdelete(item1)">
删除订单
</view>
<!-- <view class="towcontentitemthereitem towcontentitemthereitem_there">
待服务
</view> -->
<view class="towcontentitemthereitem towcontentitemthereitem_one"
v-if="item1.status == 0" @click.stop="overlayshowclick(item1)">
去付款
</view>
</view>
<u-overlay :show="overlayshow" @click.stop="overlayshow = false" opacity='0.1'>
<view class="warp">
<view class="rect flex-colum" @tap.stop>
<view class="rectone">
确定{{clickoverlayshowtext}}?
</view>
<view class="recttow flex-between">
<view class="recttow_one" @click="cancelOrder(item.status)">
确定
</view>
<view class="recttow_tow" @click="overlayshow = false">
取消
</view>
</view>
</view>
</view>
</u-overlay>
</view>
<view v-if="list_[index].data.length == 0 && list_[index].is_end == true" class="flex-colum"
style="margin-bottom: 10rpx;">
<image style="margin-top:100rpx;" class="" :src="bgnothave" mode="widthFix">
</image>
</view>
<u-loadmore :status="form.status" />
</scroll-view>
</swiper-item>
</swiper>
</view>
<u-picker :show="showpicker" :columns="columns" keyName="label" @cancel='showpicker = false'
@confirm='confirmpicker'></u-picker>
</view>
</template>
<script>
export default {
data() {
return {
showpicker: false,
style_type: uni.cache.get('loginuser').style_type,
columns: [
[{
label: '店铺订单',
// 其他属性值
id: 1
// ...
}, {
label: '商城订单',
id: 2
}]
],
bgnothave: uni.getStorageSync('bgnothave'),
height: "",
// 因为内部的滑动机制限制请将tabs组件和swiper组件的current用不同变量赋值
current: 0, // tabs组件的current值表示当前活动的tab选项
swiperCurrent: 0, // swiper组件的current值表示当前那个swiper-item是活动的
overlayshow: false,
list_: {
list1: { //全部
data: [],
page: 1,
is_end: false,
},
list2: { //代付款
data: [],
page: 1,
is_end: false,
},
list3: { //待服务
data: [],
page: 1,
is_end: false,
},
list4: { //已完成
data: [],
page: 1,
is_end: false,
},
list5: { //退款
data: [],
page: 1,
is_end: false,
}
},
like: '', //备注
clickoverlayshowtext: "",
swipercurrentdata: [{
name: '全部'
}, {
name: '待付款'
}, {
name: '待发货'
}, {
name: '待收货'
}, {
name: '已收货/退款售后'
}],
form: {
status: 'loadmore',
},
}
},
onLoad(e) {
this.swiperCurrent = e.e;
},
onShow() {
this.init_fn();
},
computed: {
HeighTpadding() {
return this.$store.getters.is_BarHeight.bottompadding
},
theme() {
return this.$store.getters.theme
},
},
mounted() {
//#ifdef MP-WEIXIN || H5
var query = uni.createSelectorQuery().in(this).select('.onecontent')
query.boundingClientRect(ele => {
var that = this;
uni.getSystemInfo({
success(res) {
that.height = (res.windowHeight - ele.height - (that.HeighTpadding / 2)) +
"px";
that = null;
}
})
}).exec();
//#endif
//#ifdef MP-ALIPAY
my.createSelectorQuery().selectAll('.onecontent').boundingClientRect().exec(ele => {
var nodeData = ele[0]
var that = this;
that.height = (nodeData.height) + "px";
uni.getSystemInfo({
success(res) {
that.height = (res.windowHeight - nodeData.height - (that.HeighTpadding / 2)) +
"px";
that = null;
}
})
})
//#endif
},
methods: {
confirmpicker(e) {
if (e.value[0].label == '店铺订单') {
uni.redirectTo({
url: '/pages/my/order/index?e=0'
})
} else {
uni.redirectTo({
url: '/pages/mall/order/index?e=0'
})
}
},
init_fn() {
this.list_ = {
list1: { //全部
data: [],
page: 1,
is_end: false,
},
list2: { //代付款
data: [],
page: 1,
is_end: false,
},
list3: { //待发货
data: [],
page: 1,
is_end: false,
},
list4: { //已完成
data: [],
page: 1,
is_end: false,
},
list5: { //退款
data: [],
page: 1,
is_end: false,
}
}
for (let i = 0; i <= 4; i++) {
this.get_order_list(i);
}
},
async get_order_list(i) {
console.log(i, 2233)
this.form.status = 'loading';
let page = null; //页数
let order_type = 10;
switch (i) {
case 0:
order_type = 10; //全部
page = this.list_.list1.page;
break;
case 1:
order_type = 0; //待付款
page = this.list_.list2.page;
break;
case 2:
order_type = 1; //待发货
page = this.list_.list3.page;
break;
case 3:
order_type = 2; //2待收货
page = this.list_.list4.page;
break;
case 4:
order_type = 3; // 4 3已收货/退款售后
page = this.list_.list5.page;
break;
}
let res = await this.api.shoppingorderlist({
type: order_type,
page: page,
like: this.like
})
// let res = []
// res.data.forEach(item=>{//计算待支付订单剩余时间
// if(item.order_type==0){
// item.timeDiff=(new Date(item.estimate_close_at).getTime() -new Date().getTime())/1000;
// }
// })
switch (order_type) {
case 10:
this.paging(res, this.list_.list1)
break;
case 0:
this.paging(res, this.list_.list2)
break;
case 1:
this.paging(res, this.list_.list3)
break;
case 2:
this.paging(res, this.list_.list4)
break;
case 3:
this.paging(res, this.list_.list5)
break;
}
uni.hideLoading();
},
paging(res, list) {
if (res.length == 0) {
this.form.status = 'nomore';
list.is_end = true;
return false;
} else {
this.form.status = 'loading';
list.page = list.page + 1;
setTimeout(() => {
list.data = [...list.data, ...res];
if (res.length != 10) {
list.is_end = true;
this.form.status = 'nomore';
} else {
this.form.status = 'loading';
}
this.$forceUpdate();
}, 500)
}
},
async overlayshowclick(e) {
uni.pro.navigateTo('mall/confirm', {
type: 3, // 1购物车 2商品详情页
order_id: e.id,
// goods_id:this.goods_id, //商品ID 商品详情页来源时必填
// car_id:'', //购物车ID 1,2 购物车来源时必填
// number:this.numberbox, //商品详情页来源时必填
// spec:this.lsitform.id, //规格 商品详情页来源时必填
// address_id: '', //地址ID 可以为空(为空时返回默认地址)
})
// uni.pro.navigateTo('mall/confirm', {
// order_id: e.id
// })
console.log(e)
// let res = await this.api.paygetpayparams({
// order_id: e.order_id
// }) //判断是否支付成功
// console.log(res)
// if (res.data.pay_status == 0) {
// // #ifdef MP-WEIXIN
// uni.requestPayment({
// provider: 'wxpay', //支付类型-固定值
// partnerid: res.data.pay_data.payAppId, // 微信支付商户号
// timeStamp: res.data.pay_data.payTimeStamp, // 时间戳(单位:秒)
// nonceStr: res.data.pay_data.paynonceStr, // 随机字符串
// package: res.data.pay_data.payPackage, // 固定值
// signType: res.data.pay_data.paySignType, //固定值
// paySign: res.data.pay_data.paySign, //签名
// success: (res) => {
// console.log(res,'11111111')
// uni.showToast({
// title: "支付成功"
// })
// uni.redirectTo({
// url: "/pages/order/ordersuccess?id=" + e.order_id,
// });
// },
// fail: (err) => {
// uni.showToast({
// icon: 'none',
// title: '支付失败'
// })
// console.log('fail:' + JSON.stringify(err));
// }
// });
// // #endif
// } else {
// console.log(res,'22222')
// uni.redirectTo({
// url: "/pages/order/ordersuccess?id=" + e.order_id,
// });
// }
},
lower() {
switch (this.current) {
case 0:
this.onReachBottom_fn(this.list_.list1)
break;
case 1:
this.onReachBottom_fn(this.list_.list2)
break;
case 2:
this.onReachBottom_fn(this.list_.list3)
break;
case 3:
this.onReachBottom_fn(this.list_.list4)
break;
case 4:
this.onReachBottom_fn(this.list_.list5)
break;
}
},
onReachBottom_fn(list) {
if (!list.is_end) {
this.get_order_list(this.current);
} else {
this.form.status = 'nomore';
}
},
// tabs通知swiper切换
orderswitch(index) {
try {
switch (index) {
case 0:
if (this.list_list1.data.length < 10) {
this.form.status = 'nomore';
}
break;
case 1:
if (this.list_.list2.data.length < 10) {
this.form.status = 'nomore';
}
break;
case 2:
if (this.list_.list3.data.length < 10) {
this.form.status = 'nomore';
}
break;
case 3:
if (this.list_.list4.data.length < 10) {
this.form.status = 'nomore';
}
break;
case 4:
if (this.list_.list5.data.length < 10) {
this.form.status = 'nomore';
}
break;
}
} catch (e) {
//TODO handle the exception
}
this.swiperCurrent = index;
},
animationfinish(e) {
let current = e.detail.current;
try {
switch (current) {
case 0:
if (this.list_list1.data.length < 10) {
this.form.status = 'nomore';
}
break;
case 1:
if (this.list_.list2.data.length < 10) {
this.form.status = 'nomore';
}
break;
case 2:
if (this.list_.list3.data.length < 10) {
this.form.status = 'nomore';
}
break;
case 3:
if (this.list_.list4.data.length < 10) {
this.form.status = 'nomore';
}
break;
case 4:
if (this.list_.list5.data.length < 10) {
this.form.status = 'nomore';
}
break;
}
} catch (e) {
//TODO handle the exception
}
this.swiperCurrent = current;
this.current = current;
},
orderordercancel(item) { //取消订单
uni.showModal({
content: '确定取消订单吗?',
confirmColor: '#f55850',
cancelColor: '#333333',
success: async (resdata) => {
console.log(resdata)
if (resdata.confirm) {
let res = await this.api.shoppingorderordercancel({
order_id: item.id
})
this.init_fn()
}
}
})
},
orderordercancelrefund(item) { //取消订单去退款
uni.pro.navigateTo('mall/order/refund', {
id: item.id
})
},
applylrefund(item) {
uni.pro.navigateTo('mall/order/applylrefund', {
id: item.id
})
},
orderorderdelete(item) {
uni.showModal({
content: '确定删除订单吗?',
confirmColor: '#f55850',
cancelColor: '#333333',
success: async (resdata) => {
if (resdata.confirm) {
let res = await this.api.shoppingorderorderorderdelete({
order_id: item.id
})
}
this.init_fn()
}
})
},
async cancelOrder(item) { //取消订单
console.log(item)
// let res
// switch (this.clickoverlayshowtext) {
// case '取消订单':
// if (item.status == 0) {
// res = await this.api.orderordercancel({
// order_id: item.id
// })
// } else {
// uni.pro.navigateTo('mall/order/orderInfo', {
// id: e,
// e: e
// })
// }
// break;
// case '删除订单':
// res = await this.api.orderorderdelete({
// order_id: item.id
// })
// break;
// }
// this.overlayshow = false
// this.init_fn()
},
eeInfo(e) { //查看订单详情
uni.pro.navigateTo('mall/order/orderInfo', {
id: e.id
})
},
}
}
</script>
<style lang="scss">
page {
background: #F6F6F6;
}
.content {
.onecontent {
width: 100%;
background: #FFFFFF;
padding: 10rpx 28rpx;
.flex-start {
flex-wrap: nowrap;
.onecontent_oen {
margin: 0 auto;
flex: auto;
height: 70rpx;
border-radius: 36rpx;
border: 1rpx solid var(--bg-color-button);
padding-right: 8rpx;
.onecontent_oen_input {
padding-left: 32rpx;
flex: 1;
}
.onecontent_oen_text {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
text-align: center;
line-height: 56rpx;
width: 116rpx;
height: 56rpx;
background: var(--bg-color-button);
border-radius: 36rpx;
}
}
.onecontent_oen_right {
margin-left: 26rpx;
.onecontent_oen_rightimage {
width: 17.9rpx;
height: 19.34rpx;
}
.onecontent_oen_rightimageview {
text-align: center;
width: 56rpx;
margin-left: 10rpx;
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
}
}
}
.onecontent_tow {
padding: 32rpx 0 32rpx 0;
width: 100%;
.onecontent_tow_item {
position: relative;
.onecontent_tow_itemtexts {
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #333333;
}
.onecontent_tow_itemtext {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
}
.onecontent_tow_itemtexts::after {
content: '';
position: absolute;
bottom: -10rpx;
left: 50%;
transform: translateX(-50%);
width: 19.33rpx;
height: 6.66rpx;
background: url(https://ointmentweapp.oss-cn-beijing.aliyuncs.com/image/my/order/order1.png) no-repeat;
background-size: 100% 100%;
}
}
}
}
.towcontent {
padding: 0 28rpx;
.flex-colum_image {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
text {
margin-top: 30rpx;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #666666;
}
}
.towcontentitem {
margin-top: 32rpx;
padding: 24rpx;
width: 100%;
background: #FFFFFF;
border-radius: 12rpx;
.towcontentitemone {
padding-bottom: 16rpx;
border-bottom: 1px solid #F6F6F6;
.towcontentitemone_one {
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 28rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #333333;
}
.towcontentitemone_tow {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
.towcontentitemone_towimage {
margin-right: 10rpx;
width: 24rpx;
height: 24rpx;
}
}
}
.towcontentitemtow {
position: relative;
padding: 22rpx 0;
border-bottom: 1px solid #F6F6F6;
.towcontentitemtow_imge {
width: 144rpx;
height: 144rpx;
background: #666666;
border-radius: 12rpx;
}
.towcontentitemtow_one {
margin-left: 32rpx;
width: 60%;
.towcontentitemtow_one_one {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
}
.towcontentitemtow_one_tow {
margin-top: 10rpx;
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #999999;
}
.towcontentitemtow_one_there {
margin-top: 32rpx;
font-size: 28rpx;
font-family: Roboto-Bold, Roboto;
font-weight: bold;
color: #333333;
}
.towcontentitemtow_one_four {
font-size: 28rpx;
font-family: Roboto-Bold, Roboto;
font-weight: bold;
color: #333333;
position: absolute;
bottom: 22rpx;
right: 0;
}
}
.towcontentitemtow_tow {
position: absolute;
bottom: 32rpx;
right: 0;
font-size: 28rpx;
font-family: Roboto-Regular, Roboto;
font-weight: 400;
color: #999999;
}
}
.towcontentitemthere_text_iitem {
width: 100%;
margin-top: 16rpx;
font-size: 24rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: 500;
color: #333333;
text {
font-size: 28rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #333333;
}
}
.towcontentitemthere {
width: 100%;
margin-top: 16rpx;
display: flex;
justify-content: flex-end;
align-items: center;
flex-wrap: wrap;
.towcontentitemthereitem {
margin-left: 24rpx;
padding: 8rpx 32rpx;
font-size: 28rpx;
border-radius: 28rpx;
}
.towcontentitemthereitem_one {
background: var(--bg-color-button);
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
.towcontentitemthereitem_tow {
background: #F6F6F6;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #999999;
}
.towcontentitemthereitem_there {
background: var(--bg-color-buttonone);
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
.towcontentitemthereitem_therecak {
background: var(--chakabackground);
border: 1px solid var(--chakaborder);
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: var(--chakacolor);
}
}
}
}
.warp {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
.rect {
padding: 40rpx 68rpx;
width: 480rpx;
background: #FFFFFF;
border-radius: 42rpx;
.rectone {
font-size: 32rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #333333;
}
.recttow {
width: 100%;
margin-top: 32rpx;
.recttow_one {
padding: 8rpx 40rpx;
background: #FFFFFF;
border-radius: 26rpx;
border: 2rpx solid #999999;
font-size: 28rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
}
.recttow_tow {
padding: 8rpx 40rpx;
background: #333333;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #FFFFFF;
border-radius: 26rpx;
}
}
}
}
}
</style>