zhuce
/
lilishop-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

运营后台-售后列表，售后状态展示优化

master
pikachu1995@126.com 2023-07-05 11:42:25 +08:00
parent 8dbd5429f0
commit 44558d9072
3 changed files with 109 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
manager/src/views/order/after-order/afterSaleOrder.vue
View File

@ -27,23 +27,6 @@
style="width: 200px" style="width: 200px"
/> />
</Form-item> </Form-item>
<Form-item label="售后状态">
<Select
v-model="searchForm.serviceStatus"
placeholder="全部"
clearable
style="width: 200px"
>
<Option value="APPLY">申请售后</Option>
<Option value="PASS">通过售后</Option>
<Option value="REFUSE">拒绝售后</Option>
<Option value="BUYER_RETURN">买家退货，待卖家收货</Option>
<Option value="SELLER_CONFIRM">卖家确认收货</Option>
<Option value="SELLER_TERMINATION">卖家终止售后</Option>
<Option value="BUYER_CANCEL">买家取消售后</Option>
<Option value="COMPLETE">完成售后</Option>
</Select>
</Form-item>
<Form-item label="申请时间"> <Form-item label="申请时间">
<DatePicker <DatePicker
v-model="selectDate" v-model="selectDate"
@ -93,6 +76,13 @@
> >
</Form> </Form>
</Row> </Row>
<div class="order-tab">
<div v-for="(item,index) in serviceStatus" :key="index" :class="{'current': currentStatus === item.value}" @click="serviceStatusClick(item)">
{{item.title}}
</div>
</div>
<Table <Table
:loading="loading" :loading="loading"
border border
@ -305,6 +295,18 @@ export default {
], ],
data: [], // 表单数据 data: [], // 表单数据
total: 0, // 表单数据总数 total: 0, // 表单数据总数
serviceStatus: [
{title: '全部', value: ''},
{title: '申请售后', value: 'APPLY'},
{title: '通过售后', value: 'PASS'},
{title: '拒绝售后', value: 'REFUSE'},
{title: '待收货', value: 'BUYER_RETURN'},
{title: '确认收货', value: 'SELLER_CONFIRM'},
{title: '完成售后', value: 'COMPLETE'},
{title: '卖家终止售后', value: 'SELLER_TERMINATION'},
{title: '买家取消售后', value: 'BUYER_CANCEL'}
],
currentStatus: ''
}; };
}, },
methods: { methods: {
@ -349,7 +351,7 @@ export default {
this.total = this.data.length; this.total = this.data.length;
this.loading = false; this.loading = false;
}, },
// 跳转订单详情 // 跳转售后详情
detail(v) { detail(v) {
let sn = v.sn; let sn = v.sn;
this.$router.push({ this.$router.push({
@ -357,9 +359,39 @@ export default {
query: { sn: sn }, query: { sn: sn },
}); });
}, },
// 售后筛选
serviceStatusClick(item) {
this.currentStatus = item.value;
this.searchForm.serviceStatus = item.value;
this.getDataList();
},
}, },
mounted() { mounted() {
this.init(); this.init();
}, },
}; };
</script> </script>
<style lang="scss" scoped>
.order-tab {
width: 950px;
height: 36px;
display: flex;
align-items: center;
justify-content: space-between;
background-color: #f0f0f0;
padding: 0 10px;
margin: 10px 20px 10px 0;
div {
text-align: center;
padding: 4px 12px;
border-radius: 4px;
cursor: pointer;
}
.current {
background-color: #ffffff;
}
}
</style>

65
manager/src/views/order/order/fictitiousOrderList.vue
View File

@ -9,16 +9,16 @@
<Form-item label="会员名称" prop="buyerName"> <Form-item label="会员名称" prop="buyerName">
<Input type="text" v-model="searchForm.buyerName" placeholder="请输入会员名称" clearable style="width: 200px" /> <Input type="text" v-model="searchForm.buyerName" placeholder="请输入会员名称" clearable style="width: 200px" />
</Form-item> </Form-item>
<Form-item label="订单状态" prop="orderStatus"> <!-- <Form-item label="订单状态" prop="orderStatus">-->
<Select v-model="searchForm.orderStatus" placeholder="请选择" clearable style="width: 200px"> <!-- <Select v-model="searchForm.orderStatus" placeholder="请选择" clearable style="width: 200px">-->
<Option value="NEW">新订单</Option> <!-- <Option value="NEW">新订单</Option>-->
<Option value="CONFIRM">已确认</Option> <!-- <Option value="CONFIRM">已确认</Option>-->
<Option value="TAKE">待核验</Option> <!-- <Option value="TAKE">待核验</Option>-->
<Option value="COMPLETE">已完成</Option> <!-- <Option value="COMPLETE">已完成</Option>-->
<Option value="WAIT_PINTUAN">待成团</Option> <!-- <Option value="WAIT_PINTUAN">待成团</Option>-->
<Option value="CANCELLED">已取消</Option> <!-- <Option value="CANCELLED">已取消</Option>-->
</Select> <!-- </Select>-->
</Form-item> <!-- </Form-item>-->
<Form-item label="下单时间"> <Form-item label="下单时间">
<DatePicker v-model="selectDate" type="datetimerange" format="yyyy-MM-dd" clearable <DatePicker v-model="selectDate" type="datetimerange" format="yyyy-MM-dd" clearable
@on-change="selectDateRange" placeholder="选择起始时间" style="width: 200px"></DatePicker> @on-change="selectDateRange" placeholder="选择起始时间" style="width: 200px"></DatePicker>
@ -27,6 +27,13 @@
</Form> </Form>
</Row> </Row>
<div class="order-tab">
<div v-for="(item,index) in orderStatus" :key="index" :class="{'current': currentStatus === item.value}" @click="orderStatusClick(item)">
{{item.title}}
</div>
</div>
<Table :loading="loading" border :columns="columns" :data="data" ref="table" class="mt_10" sortable="custom" <Table :loading="loading" border :columns="columns" :data="data" ref="table" class="mt_10" sortable="custom"
@on-sort-change="changeSort"></Table> @on-sort-change="changeSort"></Table>
<Row type="flex" justify="end" class="mt_10"> <Row type="flex" justify="end" class="mt_10">
@ -178,6 +185,15 @@ export default {
], ],
data: [], // 表单数据 data: [], // 表单数据
total: 0, // 表单数据总数 total: 0, // 表单数据总数
orderStatus: [
{title: '全部', value: ''},
{title: '未付款', value: 'UNPAID'},
{title: '已付款', value: 'PAID'},
{title: '待核验', value: 'TAKE'},
{title: '已完成', value: 'COMPLETED'},
{title: '已取消', value: 'CANCELLED'},
],
currentStatus: ''
}; };
}, },
methods: { methods: {
@ -259,9 +275,38 @@ export default {
}); });
}, },
// 订单筛选
orderStatusClick(item) {
this.currentStatus = item.value;
this.searchForm.orderStatus = item.value;
this.getDataList();
},
}, },
mounted () { mounted () {
this.init(); this.init();
}, },
}; };
</script> </script>
<style lang="scss" scoped>
.order-tab {
margin: 10px 20px 10px 0;
width: 950px;
height: 36px;
display: flex;
align-items: center;
justify-content: space-between;
background-color: #f0f0f0;
padding: 0 10px;
div {
text-align: center;
padding: 4px 12px;
border-radius: 4px;
cursor: pointer;
}
.current {
background-color: #ffffff;
}
}
</style>

8
manager/src/views/order/order/orderList.vue
View File

@ -91,7 +91,7 @@
</div> </div>
<div class="order-tab"> <div class="order-tab">
<div v-for="(item,index) in order_status" :key="index" :class="{'current': current_status === item.value}" @click="orderStatusClick(item)"> <div v-for="(item,index) in orderStatus" :key="index" :class="{'current': currentStatus === item.value}" @click="orderStatusClick(item)">
{{item.title}} {{item.title}}
</div> </div>
</div> </div>
@ -323,7 +323,7 @@ export default {
], ],
data: [], // 表单数据 data: [], // 表单数据
total: 0, // 表单数据总数 total: 0, // 表单数据总数
order_status: [ orderStatus: [
{title: '全部', value: ''}, {title: '全部', value: ''},
{title: '未付款', value: 'UNPAID'}, {title: '未付款', value: 'UNPAID'},
{title: '已付款', value: 'PAID'}, {title: '已付款', value: 'PAID'},
@ -335,7 +335,7 @@ export default {
{title: '已取消', value: 'CANCELLED'}, {title: '已取消', value: 'CANCELLED'},
], ],
current_status: '' currentStatus: ''
}; };
}, },
methods: { methods: {
@ -407,7 +407,7 @@ export default {
}, },
// 订单筛选 // 订单筛选
orderStatusClick(item) { orderStatusClick(item) {
this.current_status = item.value; this.currentStatus = item.value;
this.searchForm.orderStatus = item.value; this.searchForm.orderStatus = item.value;
this.getDataList(); this.getDataList();
}, },