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

【类 型】：factor 统计模块重新设计 未完成

Browse Source 
【原  因】：
【过  程】：
【影  响】：
This commit is contained in:
tk 2024-07-30 22:52:23 +08:00
parent 61bfc7d455
commit 77d52d9304
2 changed files with 212 additions and 194 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -80,7 +80,7 @@ export async function questAss (id, type, val) {
* @description: 获取订单列表
* @param {*} orderSerch 搜索条件
*/
export async function getOrderList (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)

404
src/views/layout/components/main/order/stat.vue
View File

@ -9,7 +9,7 @@
<!-- 统计标签 -->
<el-row :gutter="10" class="m-t-20">
<!-- 日统计标签 -->
<el-col :span="8">
<!-- <el-col :span="8">
<div class="dayStatBox rad4 flex p-10 column">
<el-date-picker class="w-100" v-model="dayTime" align="right" type="date" placeholder="今日"
:picker-options="dayPickerOptions" />
@ -45,9 +45,9 @@
</div>
</div>
</div>
</el-col>
</el-col> -->
<!-- 月统计标签 -->
<el-col :span="8">
<!-- <el-col :span="8">
<div class="monthStatBox rad4 flex p-10 column">
<el-date-picker class="w-100" v-model="monthTime" align="right" type="month" placeholder="本月"
:picker-options="monthPickerOptions" />
@ -83,9 +83,9 @@
</div>
</div>
</div>
</el-col>
</el-col> -->
<!-- 年统计标签 -->
<el-col :span="8">
<!-- <el-col :span="8">
<div class="yearStatBox rad4 flex p-10 column">
<el-date-picker class="w-100" v-model="yearTime" align="right" type="year" placeholder="本年"
:picker-options="yearPickerOptions" />
@ -121,220 +121,238 @@
</div>
</div>
</div>
</el-col>
</el-col> -->
</el-row>
</div>
</template>
<script>
import SelectionShopId from '@/components/SelectionShopId.vue'
// import { formatPrice } from '@/utils'
import { getOrderList } from '@/utils/api/table'
export default {
name: 'Stat',
data () {
return {
shop_id: '', // 搜索条件 商铺id
// 日选择器
dayPickerOptions: {
disabledDate (time) {
return time.getTime() > Date.now()
},
shortcuts: [{
text: '今天',
onClick (picker) {
const start = new Date()
start.setHours(0, 0, 0, 0)
picker.$emit('pick', start)
}
}, {
text: '昨天',
onClick (picker) {
const start = new Date()
start.setDate(start.getDate() - 1)
start.setHours(0, 0, 0, 0)
picker.$emit('pick', start)
}
}, {
text: '前日',
onClick (picker) {
const start = new Date()
start.setDate(start.getDate() - 2)
start.setHours(0, 0, 0, 0)
picker.$emit('pick', start)
}
}]
},
dayTime: new Date(), // 默认值为今天
dayOrderList: [] // 日统计 订单列表
// // 日选择器
// dayPickerOptions: {
// disabledDate (time) {
// return time.getTime() > Date.now()
// },
// shortcuts: [{
// text: '今天',
// onClick (picker) {
// const start = new Date()
// start.setHours(0, 0, 0, 0)
// picker.$emit('pick', start)
// }
// }, {
// text: '昨天',
// onClick (picker) {
// const start = new Date()
// start.setDate(start.getDate() - 1)
// start.setHours(0, 0, 0, 0)
// picker.$emit('pick', start)
// }
// }, {
// text: '前日',
// onClick (picker) {
// const start = new Date()
// start.setDate(start.getDate() - 2)
// start.setHours(0, 0, 0, 0)
// picker.$emit('pick', start)
// }
// }]
// },
// dayTime: new Date(), // 默认值为今天
monthPickerOptions: {
disabledDate (time) {
return time.getTime() > Date.now()
},
shortcuts: [{
text: '本月',
onClick (picker) {
const start = new Date()
start.setDate(1)
start.setHours(0, 0, 0, 0)
picker.$emit('pick', start)
}
}, {
text: '上月',
onClick (picker) {
const start = new Date()
start.setMonth(start.getMonth() - 1)
start.setDate(1)
start.setHours(0, 0, 0, 0)
picker.$emit('pick', start)
}
}, {
text: '前月',
onClick (picker) {
const start = new Date()
start.setMonth(start.getMonth() - 2)
start.setDate(1)
start.setHours(0, 0, 0, 0)
picker.$emit('pick', start)
}
}]
},
monthTime: new Date(), // 默认值为本月
yearPickerOptions: {
disabledDate (time) {
return time.getTime() > Date.now()
},
shortcuts: [{
text: '本年',
onClick (picker) {
const start = new Date()
start.setMonth(0)
start.setDate(1)
start.setHours(0, 0, 0, 0)
picker.$emit('pick', start)
}
}, {
text: '去年',
onClick (picker) {
const start = new Date()
start.setFullYear(start.getFullYear() - 1)
start.setMonth(0)
start.setDate(1)
start.setHours(0, 0, 0, 0)
picker.$emit('pick', start)
}
}, {
text: '前年',
onClick (picker) {
const start = new Date()
start.setFullYear(start.getFullYear() - 2)
start.setMonth(0)
start.setDate(1)
start.setHours(0, 0, 0, 0)
picker.$emit('pick', start)
}
}]
},
yearTime: new Date() // 默认值为本年
// monthPickerOptions: {
// disabledDate (time) {
// return time.getTime() > Date.now()
// },
// shortcuts: [{
// text: '本月',
// onClick (picker) {
// const start = new Date()
// start.setDate(1)
// start.setHours(0, 0, 0, 0)
// picker.$emit('pick', start)
// }
// }, {
// text: '上月',
// onClick (picker) {
// const start = new Date()
// start.setMonth(start.getMonth() - 1)
// start.setDate(1)
// start.setHours(0, 0, 0, 0)
// picker.$emit('pick', start)
// }
// }, {
// text: '前月',
// onClick (picker) {
// const start = new Date()
// start.setMonth(start.getMonth() - 2)
// start.setDate(1)
// start.setHours(0, 0, 0, 0)
// picker.$emit('pick', start)
// }
// }]
// },
// monthTime: new Date(), // 默认值为本月
// yearPickerOptions: {
// disabledDate (time) {
// return time.getTime() > Date.now()
// },
// shortcuts: [{
// text: '本年',
// onClick (picker) {
// const start = new Date()
// start.setMonth(0)
// start.setDate(1)
// start.setHours(0, 0, 0, 0)
// picker.$emit('pick', start)
// }
// }, {
// text: '去年',
// onClick (picker) {
// const start = new Date()
// start.setFullYear(start.getFullYear() - 1)
// start.setMonth(0)
// start.setDate(1)
// start.setHours(0, 0, 0, 0)
// picker.$emit('pick', start)
// }
// }, {
// text: '前年',
// onClick (picker) {
// const start = new Date()
// start.setFullYear(start.getFullYear() - 2)
// start.setMonth(0)
// start.setDate(1)
// start.setHours(0, 0, 0, 0)
// picker.$emit('pick', start)
// }
// }]
// },
// yearTime: new Date() // 默认值为本年
}
},
components: {
SelectionShopId
},
computed: {
// 日统计 订单列表
dayOrderList () {
return this.$store.state.orderList.filter(item => Number(item.order_time) > Number(this.dayTimestamps.start) && Number(item.order_time) < Number(this.dayTimestamps.end))
},
// 月统计 订单列表
monthOrderList () {
return this.$store.state.orderList.filter(item => Number(item.order_time) > Number(this.monthTimestamps.start) && Number(item.order_time) < Number(this.monthTimestamps.end))
},
// 年统计 订单列表
yearOrderList () {
return this.$store.state.orderList.filter(item => Number(item.order_time) > Number(this.yearTimestamps.start) && Number(item.order_time) < Number(this.yearTimestamps.end))
},
/**
* @description: 搜索条件 集合
*/
orderSerch () {
return this.$store.getters['app/getOrderSerch']
}
// // 月统计 订单列表
// monthOrderList () {
// return this.$store.state.orderList.filter(item => Number(item.order_time) > Number(this.monthTimestamps.start) && Number(item.order_time) < Number(this.monthTimestamps.end))
// },
// // 年统计 订单列表
// yearOrderList () {
// return this.$store.state.orderList.filter(item => Number(item.order_time) > Number(this.yearTimestamps.start) && Number(item.order_time) < Number(this.yearTimestamps.end))
// },
// 过滤出 日 收款订单 包括已付款 和 已完成
dayPaid () {
return this.dayOrderList.filter(item => item.main_status === '已付款' || item.main_status === '已完成')
},
// 日收款订单 营业额总和
dayPaidTotal () {
return this.dayPaid.reduce((total, item) => total + Number(item.total_price), 0).toFixed(2)
},
// 过滤出 日 退款付点单
dayRefund () {
return this.dayOrderList.filter(item => item.main_status === '已退款')
},
// 日收款订单 退款额总和
dayRefundTotal () {
return this.dayRefund.reduce((total, item) => total + Number(item.refund_price), 0).toFixed(2)
},
// 日 统计组件 起始 结束时间戳
dayTimestamps () {
if (!this.dayTime) {
return { start: null, end: null }
}
const start = new Date(this.dayTime)
start.setHours(0, 0, 0, 0)
const end = new Date(this.dayTime)
end.setHours(23, 59, 59, 999)
return {
start: Math.floor(start.getTime() / 1000), // 转换为秒
end: Math.floor(end.getTime() / 1000) // 转换为秒
}
},
// 月 统计组件 起始 结束时间戳
monthTimestamps () {
if (!this.monthTime) {
return { start: null, end: null }
}
const start = new Date(this.monthTime)
start.setDate(1)
start.setHours(0, 0, 0, 0)
const end = new Date(this.monthTime)
end.setMonth(end.getMonth() + 1)
end.setDate(0)
end.setHours(23, 59, 59, 999)
return {
start: Math.floor(start.getTime() / 1000), // 转换为秒
end: Math.floor(end.getTime() / 1000) // 转换为秒
}
},
// 年 统计组件 起始 结束时间戳
yearTimestamps () {
if (!this.yearTime) {
return { start: null, end: null }
}
const start = new Date(this.yearTime)
start.setMonth(0)
start.setDate(1)
start.setHours(0, 0, 0, 0)
const end = new Date(this.yearTime)
end.setMonth(11)
end.setDate(31)
end.setHours(23, 59, 59, 999)
return {
start: Math.floor(start.getTime() / 1000), // 转换为秒
end: Math.floor(end.getTime() / 1000) // 转换为秒
// dayPaid () {
// return this.dayOrderList.filter(item => item.main_status === '已付款' || item.main_status === '已完成')
// },
// // 日收款订单 营业额总和
// dayPaidTotal () {
// return this.dayPaid.reduce((total, item) => total + Number(item.total_price), 0).toFixed(2)
// },
// // 过滤出 日 退款付点单
// dayRefund () {
// return this.dayOrderList.filter(item => item.main_status === '已退款')
// },
// // 日收款订单 退款额总和
// dayRefundTotal () {
// return this.dayRefund.reduce((total, item) => total + Number(item.refund_price), 0).toFixed(2)
// },
// // 日 统计组件 起始 结束时间戳
// dayTimestamps () {
// if (!this.dayTime) {
// return { start: null, end: null }
// }
// const start = new Date(this.dayTime)
// start.setHours(0, 0, 0, 0)
// const end = new Date(this.dayTime)
// end.setHours(23, 59, 59, 999)
// return {
// start: Math.floor(start.getTime() / 1000), // 转换为秒
// end: Math.floor(end.getTime() / 1000) // 转换为秒
// }
// }
// // 月 统计组件 起始 结束时间戳
// monthTimestamps () {
// if (!this.monthTime) {
// return { start: null, end: null }
// }
// const start = new Date(this.monthTime)
// start.setDate(1)
// start.setHours(0, 0, 0, 0)
// const end = new Date(this.monthTime)
// end.setMonth(end.getMonth() + 1)
// end.setDate(0)
// end.setHours(23, 59, 59, 999)
// return {
// start: Math.floor(start.getTime() / 1000), // 转换为秒
// end: Math.floor(end.getTime() / 1000) // 转换为秒
// }
// },
// // 年 统计组件 起始 结束时间戳
// yearTimestamps () {
// if (!this.yearTime) {
// return { start: null, end: null }
// }
// const start = new Date(this.yearTime)
// start.setMonth(0)
// start.setDate(1)
// start.setHours(0, 0, 0, 0)
// const end = new Date(this.yearTime)
// end.setMonth(11)
// end.setDate(31)
// end.setHours(23, 59, 59, 999)
// return {
// start: Math.floor(start.getTime() / 1000), // 转换为秒
// end: Math.floor(end.getTime() / 1000) // 转换为秒
// }
// }
},
methods: {
async getDayOrderList (orderSerch) {
const res = await getOrderList(orderSerch)
if (res.data.status === 1) {
this.dayOrderList = res.data.orderList
} else {
this.$message.error('获取日订单列表失败')
}
}
},
methods: {},
watch: {
monthTimestamps (val) {
console.log(val)
},
dayTimestamps (val) {
console.log(val)
},
dayPaid (val) {
console.log(val)
},
yearOrderList (val) {
console.log(val)
}
// monthTimestamps (val) {
// console.log(val)
// },
// dayTimestamps (val) {
// console.log(val)
// },
// dayPaid (val) {
// console.log(val)
// },
// yearOrderList (val) {
// console.log(val)
// }
},
created () {
this.getDayOrderList(this.orderSerch)
setTimeout(() => {
console.error(this.dayOrderList)
}, 3000)
}
}
</script>