You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
542 lines
10 KiB
542 lines
10 KiB
<template>
|
|
<view>
|
|
<view class="head-info">
|
|
<!-- 搜索 -->
|
|
<view class="searchContent">
|
|
<u-input v-model="order_no" placeholder="输入订单编号" />
|
|
<u-icon name="search" @click="getOrderList(1)" class="search"></u-icon>
|
|
</view>
|
|
</view>
|
|
<!-- 分类列表 -->
|
|
<view class="container">
|
|
<view class="classify-list">
|
|
<view class="list" :class="{'action':classifyShow == -1}" @click="onClassify(-1)">
|
|
<text>全部</text>
|
|
<text class="line" v-show="classifyShow == -1"></text>
|
|
</view>
|
|
<view class="list" v-for="(item,index) in classList" :class="{'action':classifyShow==index}"
|
|
@click="onClassify(index)" :key="index">
|
|
<text>{{item.name}}</text>
|
|
<text class="line" v-show="classifyShow==index"></text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="shopContent">
|
|
<view class="shopItem" v-for="(item,index) in goodsList" :key="index" @click="openPage(2,index,item)">
|
|
<view class="orderInfo">
|
|
<text>订单号：{{item.order_no}}</text>
|
|
<text class="statusText" style="color: #FF6813;">{{item.order_status_text}}</text>
|
|
</view>
|
|
<view class="shopItemInfo">
|
|
<image :src="item.recovery_image"></image>
|
|
<view class="priceCon">
|
|
<view class="a">名称：{{item.recovery_name}}</view>
|
|
<view class="a" v-if="item.brand">品牌：{{item.brand}}</view>
|
|
<view class="b">
|
|
<text class="num"></text>
|
|
<view class="priceText">
|
|
<text style="font-size: 26upx;">¥</text>
|
|
<text>{{item.expect_price}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="remark">
|
|
<view class="remarkTitle">
|
|
联系电话:{{item.mobile}}
|
|
</view>
|
|
<view class="remarkContent" v-if="item.remake">
|
|
{{item.remake}}
|
|
</view>
|
|
</view>
|
|
<view class="btnGroup">
|
|
<view class="btn info" v-if="item.is_cancel==1 && (item.order_status == 10)"
|
|
@click.stop="openPage(3,index,item)">修改订单</view>
|
|
<view class="btn info" v-if="item.is_cancel==1 && (item.order_status == 10)"
|
|
@click.stop="openPage(1,index,item)">取消订单</view>
|
|
<view class="btn info" v-if="item.is_success==1 && (item.order_status == 20)"
|
|
@click.stop="openPage(4,index,item)">完成</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view style="margin-top: 260rpx;">
|
|
<u-empty text="暂无信息" v-if="total == 0" mode="list"></u-empty>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import * as newFunApi from '@/api/newFun'
|
|
export default {
|
|
data() {
|
|
return {
|
|
searchText: '',
|
|
classifyShow: -1,
|
|
classList: [],
|
|
goodsList: [],
|
|
sourceIndex: 0,
|
|
payIndex: 0,
|
|
startTime: null,
|
|
endTime: null,
|
|
total: 1,
|
|
order_no: "",
|
|
pageNum: 1,
|
|
}
|
|
},
|
|
onLoad(o) {
|
|
if (o.type) {
|
|
console.log(o.type)
|
|
this.classifyShow = o.type - 1
|
|
}
|
|
},
|
|
onShow() {
|
|
this.getList(1);
|
|
},
|
|
onPullDownRefresh() {
|
|
this.pageNum = 1;
|
|
this.goodsList = [];
|
|
this.getList();
|
|
setTimeout(() => {
|
|
uni.stopPullDownRefresh();
|
|
}, 1000)
|
|
},
|
|
onReachBottom() {
|
|
if (this.goodsList.length <= this.total) {
|
|
this.pageNum++;
|
|
this.getList();
|
|
}
|
|
},
|
|
methods: {
|
|
openPage(i, index, a) {
|
|
const that = this;
|
|
if (i == 1) {
|
|
uni.showModal({
|
|
title: "温馨提示",
|
|
content: "是否取消该订单？",
|
|
confirmColor: "#F21A1C",
|
|
complete(res) {
|
|
if (res.confirm) {
|
|
that.toDel(index, a.order_id);
|
|
}
|
|
}
|
|
})
|
|
}
|
|
if (i == 2) {
|
|
uni.navigateTo({
|
|
url: '/pages/news/recycling/order?recovery_id=' + a.recovery_id + '&order_id=' + a.order_id
|
|
})
|
|
}
|
|
if (i == 3) {
|
|
uni.navigateTo({
|
|
url: '/pages/news/recycling/confirm1?order_id=' + a.order_id + '&tabIndex=' + (a
|
|
.recovery_type == 10 ? 1 : a.recovery_type == 20 ? 0 : 2) + '&source=2'
|
|
})
|
|
}
|
|
if (i == 4) {
|
|
uni.showModal({
|
|
title: "温馨提示",
|
|
content: "是否完成该订单？",
|
|
confirmColor: "#F21A1C",
|
|
complete(res) {
|
|
if (res.confirm) {
|
|
that.toComplete(index, a.order_id);
|
|
}
|
|
}
|
|
})
|
|
}
|
|
},
|
|
//完成订单
|
|
async toComplete(index, order_id) {
|
|
const {
|
|
status,
|
|
message,
|
|
data
|
|
} = await newFunApi.completeOrder({
|
|
order_id
|
|
});
|
|
if (status == 200) {
|
|
uni.showToast({
|
|
title: "完成成功"
|
|
})
|
|
this.getList(1)
|
|
}
|
|
},
|
|
//取消订单
|
|
async toDel(index, order_id) {
|
|
const {
|
|
status,
|
|
message,
|
|
data
|
|
} = await newFunApi.cancelOrder({
|
|
order_id
|
|
});
|
|
if (status == 200) {
|
|
uni.showToast({
|
|
title: "取消成功"
|
|
})
|
|
this.classifyShow = 2
|
|
this.getOrderList(1)
|
|
}
|
|
},
|
|
/**
|
|
* 获取列表
|
|
*/
|
|
async getList() {
|
|
let {
|
|
status,
|
|
message,
|
|
data
|
|
} = await newFunApi.orderStatus({});
|
|
if (status == 200) {
|
|
this.classList = data.list
|
|
this.getOrderList();
|
|
}
|
|
},
|
|
/**
|
|
* 获取商品列表
|
|
*/
|
|
async getOrderList(type) {
|
|
uni.showLoading({
|
|
title: "加载中"
|
|
})
|
|
if (type == 1) {
|
|
this.pageNum = 1;
|
|
this.goodsList = []
|
|
}
|
|
let {
|
|
status,
|
|
message,
|
|
data
|
|
} = await newFunApi.orderList({
|
|
order_no: this.order_no,
|
|
page: this.pageNum,
|
|
order_status: (this.classList.length > 0) ? (this.classifyShow >= 0 ? this.classList[this
|
|
.classifyShow].value : '') : ""
|
|
});
|
|
if (status == 200) {
|
|
uni.hideLoading();
|
|
this.goodsList = this.goodsList.concat(data.list)
|
|
this.total = data.total
|
|
}
|
|
},
|
|
onClassify(index) {
|
|
this.classifyShow = index;
|
|
this.pageNum = 1;
|
|
this.goodsList = []
|
|
this.getOrderList();
|
|
},
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
page {
|
|
background-color: #F7F8FA;
|
|
min-height: 100%;
|
|
}
|
|
|
|
.nolist {
|
|
width: 100%;
|
|
display: block;
|
|
margin: 0 auto;
|
|
text-align: center;
|
|
padding: 150rpx 50rpx;
|
|
|
|
image {
|
|
width: 388rpx;
|
|
height: 378rpx;
|
|
}
|
|
|
|
.txt {
|
|
font-size: 32rpx;
|
|
margin-top: 20rpx;
|
|
font-weight: 500;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
.head-info {
|
|
|
|
padding: 22upx 20upx;
|
|
|
|
.searchContent {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
position: relative;
|
|
padding: 0 30rpx;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
background-color: #fff;
|
|
border-radius: 80rpx;
|
|
|
|
::v-deep .uni-input-placeholder {
|
|
margin-left: 20upx;
|
|
z-index: 10;
|
|
}
|
|
|
|
input {
|
|
margin-left: 60rpx;
|
|
flex: 1;
|
|
}
|
|
|
|
.search {
|
|
position: absolute;
|
|
top: 20upx;
|
|
left: 26upx;
|
|
z-index: 9;
|
|
}
|
|
|
|
::v-deep .u-input {
|
|
flex: 1;
|
|
width: 500rpx;
|
|
margin-left: 40upx;
|
|
}
|
|
|
|
::v-deep .uni-input-input {
|
|
|
|
background: #FFFFFF;
|
|
border-radius: 30px 30px 30px 30px;
|
|
opacity: 1;
|
|
padding-left: 20upx;
|
|
width: calc(100% - 80upx);
|
|
|
|
}
|
|
|
|
.filter {
|
|
display: flex;
|
|
width: 100upx;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
image {
|
|
width: 34upx;
|
|
height: auto;
|
|
}
|
|
|
|
text {
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #616161;
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.container {
|
|
background-color: #fff;
|
|
}
|
|
|
|
.classify-list {
|
|
white-space: nowrap;
|
|
width: 100%;
|
|
height: 100rpx;
|
|
overflow-x: auto;
|
|
overflow-y: hidden;
|
|
|
|
.list {
|
|
position: relative;
|
|
display: inline-block;
|
|
width: 25%;
|
|
height: 100%;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
|
|
text {
|
|
font-size: 28rpx;
|
|
color: #3B3B3B;
|
|
|
|
}
|
|
|
|
.line {
|
|
position: absolute;
|
|
left: 50%;
|
|
bottom: 10rpx;
|
|
// width: 60%;
|
|
// height: 8rpx;
|
|
background: linear-gradient(to right, #f8f893, #fe9d00);
|
|
// border-radius: 10rpx;
|
|
transform: translate(-50%, 0);
|
|
|
|
width: 60upx;
|
|
height: 8upx;
|
|
background: #FF6257;
|
|
border-radius: 29px 29px 29px 29px;
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.action {
|
|
text {
|
|
font-size: 32rpx;
|
|
opacity: 1;
|
|
}
|
|
}
|
|
}
|
|
|
|
.shopContent {
|
|
|
|
overflow: hidden;
|
|
|
|
.shopItem {
|
|
margin-bottom: 14upx;
|
|
padding: 36upx;
|
|
background-color: #fff;
|
|
|
|
.orderInfo {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
text {
|
|
font-size: 28upx;
|
|
color: #707070;
|
|
|
|
}
|
|
}
|
|
|
|
.shopItemInfo {
|
|
display: flex;
|
|
margin-top: 40upx;
|
|
|
|
image {
|
|
width: 180upx;
|
|
height: 180upx;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.priceCon {
|
|
flex: 1;
|
|
overflow: hidden;
|
|
|
|
.a {
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
height: 50rpx;
|
|
color: #3B3B3B;
|
|
overflow: hidden;
|
|
margin-left: 40upx;
|
|
}
|
|
|
|
.b {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
justify-content: space-between;
|
|
margin-left: 40upx;
|
|
margin-top: 40rpx;
|
|
}
|
|
|
|
.num {
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #1E1E1E;
|
|
|
|
}
|
|
|
|
.priceText {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
text {
|
|
font-size: 32upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #F21A1C;
|
|
font-weight: bold;
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
.totalNum {
|
|
text-align: right;
|
|
margin-top: 70upx;
|
|
|
|
text:first-child {
|
|
font-size: 24upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #B7B7B7;
|
|
|
|
}
|
|
|
|
text:nth-child(2) {
|
|
font-size: 32upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #3B3B3B;
|
|
margin: 0 10upx;
|
|
|
|
}
|
|
|
|
text:nth-child(3) {
|
|
font-size: 32upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 600;
|
|
color: #F21A1C;
|
|
|
|
}
|
|
}
|
|
|
|
.remark {
|
|
background: #F8F8F8;
|
|
border-radius: 0px 0px 0px 0px;
|
|
opacity: 1;
|
|
padding: 20upx;
|
|
margin-top: 20upx;
|
|
|
|
.remarkTitle {
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #3B3B3B;
|
|
|
|
}
|
|
|
|
.remarkContent {
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #939393;
|
|
margin-top: 8upx;
|
|
}
|
|
}
|
|
|
|
.btnGroup {
|
|
display: flex;
|
|
margin-top: 28upx;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-end;
|
|
|
|
.btn {
|
|
width: 180upx;
|
|
height: 56upx;
|
|
background: #FFFFFF;
|
|
border-radius: 50px 50px 50px 50px;
|
|
opacity: 1;
|
|
font-size: 14px;
|
|
line-height: 56upx;
|
|
text-align: center;
|
|
margin-left: 12upx;
|
|
}
|
|
|
|
.info {
|
|
border: 1px solid #9F9F9F;
|
|
color: #8B8B8B;
|
|
|
|
}
|
|
|
|
.primary {
|
|
border: 1px solid #F63116;
|
|
color: #F83F11;
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
|