Food/food
3
0
Fork 0
Code Issues 60 Pull Requests Actions Packages Projects Releases Wiki Activity

【类 型】：refactor

Browse Source 
【主	题】：订单模块 重构
【描	述】：
	[原因]：订单页面 销售统计页面 数据请求 在加载页面时再请求 对应条件数据
	[过程]：
	[影响]：
【结	束】

# 类型 包含:
# feat：新功能（feature）
# fix：修补bug
# docs：文档（documentation）
# style： 格式（不影响代码运行的变动）
# refactor：重构（即不是新增功能，也不是修改bug的代码变动）
# test：增加测试
# chore：构建过程或辅助工具的变动
This commit is contained in:
tk 2024-07-01 21:08:03 +08:00
parent b92d305678
commit 9e36a0bd1c
7 changed files with 92 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/DatePickerOrder.vue
View File

@ -91,6 +91,7 @@ export default {
new Date(new Date().setHours(0, 0, 0, 0)).getTime(),
new Date(new Date().setHours(23, 59, 59, 999)).getTime()
]
this.$store.commit('app/setOrderSerch', { start_time: startTime, end_time: endTime })
} else {
this.value = [
new Date(startTime * 1000),

9
src/components/SelectionMainStatus.vue
View File

@ -1,5 +1,5 @@
<template>
<el-select class="w-100" v-model="value" multiple placeholder="订单状态过滤：可多选过滤条件（空置显示全部状态订单）">
<el-select class="w-100" v-model="value" multiple placeholder="订单状态：可多选，空显示全部">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
@ -10,9 +10,6 @@ export default {
data () {
return {
options: [{
value: '已取消',
label: '已取消'
}, {
value: '未付款',
label: '未付款'
}, {
@ -25,12 +22,12 @@ export default {
value: '已完成',
label: '已完成'
}],
value: this.$store.getters['app/getOrderSerch'].status
value: this.$store.getters['app/getOrderSerch'].main_status
}
},
watch: {
value (val) {
this.$store.commit('app/setOrderSerch', { status: val })
this.$store.commit('app/setOrderSerch', { main_status: val })
}
}
}

9
src/components/SelectionRefundStatus.vue
View File

@ -1,5 +1,6 @@
<template>
<el-select class="w-100" v-model="value" multiple placeholder="退款状态过滤：可多选过滤条件（空置显示全部状态订单）">
<el-select class="w-100" v-model="value" multiple placeholder="退款状态：可多选，空显示全部">
<template slot="prepend">Http://</template>
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
@ -20,17 +21,17 @@ export default {
label: '同意买家申请'
}, {
value: '主动退',
label: '商家主动退款'
label: '卖家主动退款'
}, {
value: '拒绝退',
label: '拒绝退款'
}],
value: this.$store.getters['app/getOrderSerch'].back
value: this.$store.getters['app/getOrderSerch'].refund_status
}
},
watch: {
value (val) {
this.$store.commit('app/setOrderSerch', { back: val })
this.$store.commit('app/setOrderSerch', { refund_status: val })
}
}
}

25
src/components/SelectionShipmentStatus.vue
View File

@ -1,5 +1,5 @@
<template>
<el-select class="w-100" v-model="value" multiple placeholder="订单状态过滤：可多选过滤条件（空置显示全部状态订单）">
<el-select class="w-100" v-model="value" multiple placeholder="执行状态：可多选，空显示全部">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
@ -10,27 +10,24 @@ export default {
data () {
return {
options: [{
value: '已取消',
label: '已取消'
value: '未接单',
label: '未接单'
}, {
value: '未付款',
label: '未付款'
value: '已接单',
label: '已接单'
}, {
value: '已付款',
label: '已付款'
value: '已发货',
label: '已发货'
}, {
value: '已退款',
label: '已退款'
}, {
value: '已完成',
label: '已完成'
value: '已送达',
label: '已送达'
}],
value: this.$store.getters['app/getOrderSerch'].status
value: this.$store.getters['app/getOrderSerch'].shipment_status
}
},
watch: {
value (val) {
this.$store.commit('app/setOrderSerch', { status: val })
this.$store.commit('app/setOrderSerch', { shipment_status: val })
}
}
}

5
src/store/modules/app.js
View File

@ -66,8 +66,9 @@ const getters = {
// 获取订单页面搜索条件
getOrderSerch (state) {
const defaultValues = {
start_time: '', // 搜索条件 起始时间
end_time: '', // 搜索条件 结束时间
shop_id: '', // 搜索条件 商铺id
start_time: Math.floor(new Date(new Date().setHours(0, 0, 0, 0)).getTime() / 1000), // 搜索条件 起始时间 默认为今天凌晨0点
end_time: Math.floor(new Date(new Date().setHours(23, 59, 59, 999)).getTime() / 1000), // 搜索条件 结束时间 默认为今天23点59分59秒
main_status: [], // 搜索条件 主状态
shipment_status: [], // 搜索条件 执行状态
refund_status: [], // 搜索条件 退款状态

32
src/utils/api/table.js
View File

@ -26,11 +26,11 @@ export async function apiCrosFrequency (params) {
* @param {*} val 修改字段的值
*/
export function questAss (id, state, val) {
const data = new URLSearchParams()// post对象参数 转成 字符串连接
data.append('id', id)
data.append('state', state)
data.append('val', val)
api.post('questAss', data).then(res => {
const params = new URLSearchParams()// post对象参数 转成 字符串连接
params.append('id', id)
params.append('state', state)
params.append('val', val)
api.post('questAss', params).then(res => {
if (res.data.status === 1) {
Message.success(res.data.msg)
store.dispatch('fetchPaidOrderList')// 更新订单列表
@ -40,6 +40,28 @@ export function questAss (id, state, val) {
}
})
}
/**
* @description: 获取订单列表
* @param {*} orderSerch 搜索条件
*/
export async function getOrderList (orderSerch) {
const params = new URLSearchParams()// post对象参数 转成 字符串连接
params.append('shop_id', orderSerch.shop_id)
params.append('start_time', orderSerch.start_time)
params.append('end_time', orderSerch.end_time)
params.append('main_status', orderSerch.main_status)
params.append('shipment_status', orderSerch.shipment_status)
params.append('refund_status', orderSerch.refund_status)
params.append('search', orderSerch.search)
// 发送退款请求
const res = await api.post('getOrderList', params, 'Admin')
if (res.data.status === 1) {
Message.success('成功获取订单列表')
} else {
Message.error('获取订单列表失败')
}
return res
}
/**
* @description: 退款函数

118
src/views/layout/components/main/order/index.vue
View File

@ -6,23 +6,26 @@
<SelectionShopId class="w-100" v-model="shop_id" :allSel="true" />
</el-col>
<el-col :span="8">
<DatePickerOrder class="w-100" :startDate="startDate" :endDate="endDate" />
<DatePickerOrder class="w-100" />
</el-col>
<el-col :span="12">
<SearchOrder class="w-100" />
</el-col>
</el-row>
<el-row :gutter="15">
<el-col :span="12">
<SelectionOrderStatus />
<el-col :span="8">
<SelectionMainStatus />
</el-col>
<el-col :span="12">
<SelectionOrderBack />
<el-col :span="8">
<SelectionShipmentStatus />
</el-col>
<el-col :span="8">
<SelectionRefundStatus />
</el-col>
</el-row>
<!-- 订单列表 -->
<!-- <el-table class="m-t-20 w-100" ref="myTable"
:data="orderListArr.slice((currentPage - 1) * pageSize, currentPage * pageSize)" border tooltip-effect="dark">
:data="orderList.slice((currentPage - 1) * pageSize, currentPage * pageSize)" border tooltip-effect="dark">
<el-table-column align="center" type="selection" width="40">
</el-table-column>
<el-table-column align="center" prop="id" label="id" width="50">
@ -49,7 +52,7 @@
</el-table> -->
<!-- 分页 -->
<!-- <el-pagination class="m-t-20" layout="prev, pager, next" :current-page.sync="currentPage" :page-size="pageSize"
:total="orderListArr.length">
:total="orderList.length">
</el-pagination> -->
</div>
</template>
@ -57,9 +60,11 @@
<script>
import { countSelIdArr, parseTime } from '@/utils'
import { getOrderList } from '@/utils/api/table'
import SelectionShopId from '@/components/SelectionShopId'
import SelectionOrderStatus from '@/components/SelectionOrderStatus'
import SelectionOrderBack from '@/components/SelectionOrderBack'
import SelectionMainStatus from '@/components/SelectionMainStatus'
import SelectionShipmentStatus from '@/components/SelectionShipmentStatus'
import SelectionRefundStatus from '@/components/SelectionRefundStatus'
import DatePickerOrder from '@/components/DatePickerOrder'
import SearchOrder from '@/components/SearchOrder'
@ -74,85 +79,46 @@ export default {
},
components: {
SelectionShopId,
SelectionOrderStatus,
SelectionOrderBack,
SelectionMainStatus,
SelectionShipmentStatus,
SelectionRefundStatus,
DatePickerOrder,
SearchOrder
},
computed: {
startDate () {
return Math.floor(new Date(new Date().setHours(0, 0, 0, 0)).getTime() / 1000)
/**
* @description: 订单列表
*/
orderList () {
return []
},
endDate () {
return Math.floor(new Date(new Date().setHours(23, 59, 59, 999)).getTime() / 1000)
/**
* @description: 搜索条件 集合
*/
orderSerch () {
return this.$store.getters['app/getOrderSerch']
}
// 获取订单列表
// orderList () {
// return this.$store.state.orderList
// },
// // 获取搜索条件 对象(从缓存拿 缓存没有从本地拿 也没有 给对象的所有搜索属性空值)
// orderSerch () {
// return this.$store.getters['app/getOrderSerch']
// },
// // 过滤订单列表组
// orderListArr () {
// if (this.orderList.length > 0) {
// let filteredList = this.orderList
// // 过滤shop_id
// if (this.shop_id !== '') {
// filteredList = filteredList.filter(order => order.shop_id === this.shop_id)
// }
// // 过滤时间
// if (this.orderSerch.start_time !== '' && this.orderSerch.end_time !== '') {
// const startTime = parseInt(this.orderSerch.start_time)
// const endTime = parseInt(this.orderSerch.end_time)
// filteredList = filteredList.filter(order => {
// const orderTime = parseInt(order.addtime)
// return startTime < orderTime && orderTime < endTime
// })
// }
// // 过滤订单状态
// if (this.orderSerch.status.length > 0) {
// filteredList = filteredList.filter(order => {
// // 检查订单状态是否在this.status数组中
// return this.orderSerch.status.includes(order.status)
// })
// }
// // 过滤订单状态
// if (this.orderSerch.back.length > 0) {
// filteredList = filteredList.filter(order => {
// // 检查订单状态是否在this.status数组中
// return this.orderSerch.back.includes(order.back)
// })
// }
// // 搜索条件过滤
// if (this.orderSerch.search[1] !== '') {
// filteredList = filteredList.filter(order => {
// if (this.orderSerch.search[0] === 'orderId') {
// return order.order_sn.indexOf(this.orderSerch.search[1]) >= 0
// } else if (this.orderSerch.search[0] === 'name') {
// return order.receiver.indexOf(this.orderSerch.search[1]) >= 0
// } else if (this.orderSerch.search[0] === 'tel') {
// return order.tel.indexOf(this.orderSerch.search[1]) >= 0
// } else if (this.orderSerch.search[0] === 'remark') {
// return order.remark.indexOf(this.orderSerch.search[1]) >= 0
// } else if (this.orderSerch.search[0] === 'desc') {
// return order.describe.indexOf(this.orderSerch.search[1]) >= 0
// }
// })
// }
// return filteredList
// } else {
// return []
// }
// }
},
methods: {
countSelIdArr
countSelIdArr,
/**
* @description: 根据 缓存的搜索条件 获取订单列表
*/
async getOrderList (orderSerch) {
const res = await getOrderList(orderSerch)
console.log(res)
}
},
watch: {
// shop_id (val) {
// this.$store.commit('app/setOrderSerch', { shop_id: val })
// },
orderSerch (val) {
this.getOrderList(val)
}
},
created () {
},
filters: {
countSelIdArr,