|
|
|
|
<template>
|
|
|
|
|
<view>
|
|
|
|
|
<view class="filter">
|
|
|
|
|
<uni-search-bar class="search" radius="30" placeholder="请输入订单号、内容" v-model="keyword" clearButton="auto" cancelButton="none" />
|
|
|
|
|
<uni-icons class="icon" custom-prefix="iconfont" type="icon-filter" size="22" color="#007eff" @click="popup = true"></uni-icons>
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
<template v-if="list.length">
|
|
|
|
|
<view class="list">
|
|
|
|
|
<uni-swipe-action>
|
|
|
|
|
<uni-swipe-action-item
|
|
|
|
|
v-for="item in list"
|
|
|
|
|
:threshold="0"
|
|
|
|
|
:right-options="delOption"
|
|
|
|
|
:disabled="!auth('订单管理:删除')"
|
|
|
|
|
@click="del(item)"
|
|
|
|
|
>
|
|
|
|
|
<view class="item" @click="toDetail(item)">
|
|
|
|
|
<view class="c-name">{{ item.orderNumber }}</view>
|
|
|
|
|
<view class="info">
|
|
|
|
|
<view class="left">
|
|
|
|
|
<view v-if="curTab" class="line">
|
|
|
|
|
<text class="name">商务经理：</text>
|
|
|
|
|
<text class="val">{{ item.businessManagerName }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="line">
|
|
|
|
|
<text class="name">客户名称：</text>
|
|
|
|
|
<text class="val">{{ item.customerName }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="line">
|
|
|
|
|
<text class="name">订单金额：</text>
|
|
|
|
|
<text class="val">{{ item.orderAmount }}元</text>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="line">
|
|
|
|
|
<text class="name">订单内容：</text>
|
|
|
|
|
<view class="val ell-wrap">
|
|
|
|
|
<view :class="{ell: !item.toggle}">{{ item.orderContent }}</view>
|
|
|
|
|
<view v-if="item.orderContent.length > 14" class="toggle" @click.stop="toggle(item)">{{ item.toggle ? '收起' : '展开' }}</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view class="line">
|
|
|
|
|
<text class="name">下单日期：</text>
|
|
|
|
|
<text class="val">{{ item.createTime }}</text>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
<view :class="['type', 'type' + item.orderStatus]">
|
|
|
|
|
{{ filterData[0].data.find(e => e.value === item.orderStatus).title }}
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</view>
|
|
|
|
|
</uni-swipe-action-item>
|
|
|
|
|
</uni-swipe-action>
|
|
|
|
|
</view>
|
|
|
|
|
<uni-load-more :status="status" />
|
|
|
|
|
</template>
|
|
|
|
|
<empty v-else></empty>
|
|
|
|
|
|
|
|
|
|
<uni-icons v-if="auth('订单管理:新建订单')" class="plus" type="plus-filled" size="60" color="#007eff" @click="$util.to(`../orderDetail/orderDetail?customerId=${customerId}`)"></uni-icons>
|
|
|
|
|
<filter-popup :data="filterData" :form.sync="filterForm" v-model="popup" title="全部筛选" height="1104rpx" @finsh="subFinsh"></filter-popup>
|
|
|
|
|
</view>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import { list, del } from '@/apis/modules/order.js'
|
|
|
|
|
export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
customerId: '',
|
|
|
|
|
customerName: '',
|
|
|
|
|
popup: false,
|
|
|
|
|
//筛选表单数据
|
|
|
|
|
filterData: [
|
|
|
|
|
{
|
|
|
|
|
children: false,//是否有子项
|
|
|
|
|
title: "订单状态",
|
|
|
|
|
key: "orderStatus", //键名 接收对象名字
|
|
|
|
|
keyValue: "value", //获取的值是哪个
|
|
|
|
|
isRadio: true, //是否单选 否则多选
|
|
|
|
|
data: [
|
|
|
|
|
{
|
|
|
|
|
title: "待发货",
|
|
|
|
|
value: 0
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
title: "已完成",
|
|
|
|
|
value: 1
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
}
|
|
|
|
|
],
|
|
|
|
|
reachBottom: 0, // 是否是上拉加载。0->否,1->是,-1->加载完所有数据
|
|
|
|
|
status: 'more', // 上拉加载状态 more|loading|noMore
|
|
|
|
|
filterForm: {},
|
|
|
|
|
searchTimer: null,
|
|
|
|
|
orderStatus: '',
|
|
|
|
|
keyword: '',
|
|
|
|
|
list: [],
|
|
|
|
|
page: 1,
|
|
|
|
|
pageSize: 10,
|
|
|
|
|
delOption: [{
|
|
|
|
|
text: '删除',
|
|
|
|
|
style: {
|
|
|
|
|
backgroundColor: '#F56C6C'
|
|
|
|
|
}
|
|
|
|
|
}]
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
keyword () {
|
|
|
|
|
clearTimeout(this.searchTimer)
|
|
|
|
|
this.searchTimer = setTimeout(() => {
|
|
|
|
|
this.initList()
|
|
|
|
|
}, 500)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 上拉加载
|
|
|
|
|
onReachBottom() {
|
|
|
|
|
if (this.reachBottom >= 0) {
|
|
|
|
|
this.reachBottom = 1
|
|
|
|
|
this.status = 'loading'
|
|
|
|
|
this.getList()
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 下拉刷新
|
|
|
|
|
onPullDownRefresh() {
|
|
|
|
|
this.getList()
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
uni.stopPullDownRefresh()
|
|
|
|
|
}, 1500)
|
|
|
|
|
},
|
|
|
|
|
onShow() {
|
|
|
|
|
const pages = getCurrentPages()
|
|
|
|
|
const { options } = pages[pages.length - 1]
|
|
|
|
|
this.customerId = options.customerId
|
|
|
|
|
this.customerName = options.name
|
|
|
|
|
this.initList()
|
|
|
|
|
// 清除订单缓存
|
|
|
|
|
try {
|
|
|
|
|
uni.removeStorageSync('courses')
|
|
|
|
|
uni.removeStorageSync('orderEdited')
|
|
|
|
|
} catch (e) {}
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
getList() {
|
|
|
|
|
uni.showLoading({
|
|
|
|
|
title: '加载中'
|
|
|
|
|
})
|
|
|
|
|
const team = uni.getStorageSync('team')
|
|
|
|
|
const { orderStatus } = this
|
|
|
|
|
list({
|
|
|
|
|
orderStatus: orderStatus === '' ? null : orderStatus,
|
|
|
|
|
pageNo: this.page,
|
|
|
|
|
pageSize: this.pageSize,
|
|
|
|
|
customerName: this.customerName
|
|
|
|
|
}).then(({ orderPage }) => {
|
|
|
|
|
const { orders } = orderPage
|
|
|
|
|
orders.map(e => {
|
|
|
|
|
e.toggle = e.orderContent.length < 14 // 超过了14个字才需要显示展开按钮
|
|
|
|
|
})
|
|
|
|
|
this.list = this.reachBottom > 0 ? [...this.list, ...orders] : orders
|
|
|
|
|
console.log(11, this.list)
|
|
|
|
|
this.page++ // 每次获取了数据后page+1
|
|
|
|
|
const noMore = this.list.length === orderPage.total // 是否加载完所有数据
|
|
|
|
|
this.status = noMore ? 'noMore' : 'more' // 加载完了则设置为noMore
|
|
|
|
|
this.reachBottom = noMore ? -1 : 0 // 加载完了则设置为-1
|
|
|
|
|
uni.hideLoading()
|
|
|
|
|
}).catch(e => {
|
|
|
|
|
uni.hideLoading()
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
initList() {
|
|
|
|
|
this.page = 1
|
|
|
|
|
this.reachBottom = 0
|
|
|
|
|
this.getList()
|
|
|
|
|
},
|
|
|
|
|
// 展开
|
|
|
|
|
toggle(item) {
|
|
|
|
|
item.toggle = !item.toggle
|
|
|
|
|
},
|
|
|
|
|
// 筛选确定回调
|
|
|
|
|
subFinsh(val) {
|
|
|
|
|
const { orderStatus } = val
|
|
|
|
|
this.orderStatus = orderStatus.length ? orderStatus[0] : ''
|
|
|
|
|
this.initList()
|
|
|
|
|
},
|
|
|
|
|
// 跳转详情
|
|
|
|
|
toDetail(item) {
|
|
|
|
|
this.$util.to(`../orderDetail/orderDetail?orderId=${item.orderId}&show=1`)
|
|
|
|
|
},
|
|
|
|
|
// 删除
|
|
|
|
|
del(e) {
|
|
|
|
|
const that = this
|
|
|
|
|
uni.showModal({
|
|
|
|
|
title: '提示',
|
|
|
|
|
content: '确定要删除吗？',
|
|
|
|
|
success(res) {
|
|
|
|
|
if (res.confirm) {
|
|
|
|
|
del({
|
|
|
|
|
ids: [e.orderId]
|
|
|
|
|
}).then(res => {
|
|
|
|
|
that.$util.sucMsg('删除成功')
|
|
|
|
|
that.getList()
|
|
|
|
|
}).catch(res => {})
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
|
|
.list {
|
|
|
|
|
margin-top: 20rpx;
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
.item {
|
|
|
|
|
padding: 20rpx 40rpx;
|
|
|
|
|
border-bottom: 1px solid #f1f1f1;
|
|
|
|
|
}
|
|
|
|
|
.c-name {
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
color: #333;
|
|
|
|
|
}
|
|
|
|
|
.info {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-top: 10rpx;
|
|
|
|
|
}
|
|
|
|
|
.left {
|
|
|
|
|
max-width: 70%;
|
|
|
|
|
}
|
|
|
|
|
.line {
|
|
|
|
|
display: flex;
|
|
|
|
|
padding: 10rpx 0;
|
|
|
|
|
}
|
|
|
|
|
.name {
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
color: #999;
|
|
|
|
|
}
|
|
|
|
|
.val {
|
|
|
|
|
max-width: 88%;
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
color: #333;
|
|
|
|
|
}
|
|
|
|
|
.ell {
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
}
|
|
|
|
|
.toggle {
|
|
|
|
|
margin-top: 10rpx;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
font-size: 24rpx;
|
|
|
|
|
color: #0e92ef;
|
|
|
|
|
}
|
|
|
|
|
.type {
|
|
|
|
|
margin-left: 20rpx;
|
|
|
|
|
font-size: 28rpx;
|
|
|
|
|
color: #ff7b2d;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
}
|
|
|
|
|
.type1 {
|
|
|
|
|
color: #bdbdbd;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
