|
|
@@ -0,0 +1,204 @@
|
|
|
+<!--
|
|
|
+ PC 跨天售后影响：筛售后创建时间，按原单账单日 payTime 汇总日/月金额。
|
|
|
+ 接口 /stat-kd/next-day-affect；只计挂上 xhGhsOrder 的已通过跨天售后。
|
|
|
+-->
|
|
|
+<template>
|
|
|
+ <div class="shop-list">
|
|
|
+ <div class="toolbar">
|
|
|
+ <span class="toolbar-label">售后创建时间</span>
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ :type="searchTime === 'sinceUpgrade' ? 'primary' : 'default'"
|
|
|
+ @click="querySinceUpgrade"
|
|
|
+ >自系统升级以来</el-button>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="currentDateList"
|
|
|
+ type="daterange"
|
|
|
+ align="right"
|
|
|
+ unlink-panels
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ :picker-options="pickerOptions"
|
|
|
+ size="mini"
|
|
|
+ style="margin-left:12px;"
|
|
|
+ @change="getDate"
|
|
|
+ >
|
|
|
+ </el-date-picker>
|
|
|
+ <el-button type="primary" size="mini" style="margin-left:12px;" @click="loadData">查询</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="total-line">所选售后创建期内，影响原单合计 ¥{{ formatNum(totalAmount) }}</div>
|
|
|
+ <div class="tables">
|
|
|
+ <div class="table-block">
|
|
|
+ <div class="table-title">按原单日期</div>
|
|
|
+ <el-table :data="dayList" border size="small" empty-text="该创建期内没有跨天售后">
|
|
|
+ <el-table-column prop="day" label="原单日期" align="center"></el-table-column>
|
|
|
+ <el-table-column label="影响金额" align="center">
|
|
|
+ <template slot-scope="scope">¥{{ formatNum(scope.row.amount) }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ <div class="table-block">
|
|
|
+ <div class="table-title">按原单月份</div>
|
|
|
+ <el-table :data="monthList" border size="small" empty-text="该创建期内没有跨天售后">
|
|
|
+ <el-table-column prop="month" label="原单月份" align="center"></el-table-column>
|
|
|
+ <el-table-column label="影响金额" align="center">
|
|
|
+ <template slot-scope="scope">¥{{ formatNum(scope.row.amount) }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ pickerOptions: {
|
|
|
+ shortcuts: [{
|
|
|
+ text: '最近一周',
|
|
|
+ onClick(picker) {
|
|
|
+ const end = new Date();
|
|
|
+ const start = new Date();
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
|
|
|
+ picker.$emit('pick', [start, end]);
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ text: '最近一个月',
|
|
|
+ onClick(picker) {
|
|
|
+ const end = new Date();
|
|
|
+ const start = new Date();
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
|
|
|
+ picker.$emit('pick', [start, end]);
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ text: '最近三个月',
|
|
|
+ onClick(picker) {
|
|
|
+ const end = new Date();
|
|
|
+ const start = new Date();
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
|
|
|
+ picker.$emit('pick', [start, end]);
|
|
|
+ }
|
|
|
+ }, {
|
|
|
+ text: '自系统升级以来',
|
|
|
+ onClick(picker) {
|
|
|
+ // 跨天售后从 2026-08-18 上线，查到当天
|
|
|
+ picker.$emit('pick', [new Date(2026, 7, 18), new Date()]);
|
|
|
+ }
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ currentDateList: '',
|
|
|
+ startTime: '',
|
|
|
+ endTime: '',
|
|
|
+ searchTime: 'today',
|
|
|
+ dayList: [],
|
|
|
+ monthList: [],
|
|
|
+ totalAmount: 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.setDefaultRange(30)
|
|
|
+ this.loadData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /** 数字展示：不用 truthy，避免 0 被当成空 */
|
|
|
+ formatNum(val) {
|
|
|
+ const n = parseFloat(val);
|
|
|
+ return isNaN(n) ? 0 : n;
|
|
|
+ },
|
|
|
+ /** 默认最近 N 天，方便一进来就能对账 */
|
|
|
+ setDefaultRange(days) {
|
|
|
+ const end = new Date()
|
|
|
+ const start = new Date()
|
|
|
+ start.setTime(start.getTime() - 3600 * 1000 * 24 * days)
|
|
|
+ this.currentDateList = [this.formatDate(start), this.formatDate(end)]
|
|
|
+ this.searchTime = 'custom'
|
|
|
+ this.startTime = this.currentDateList[0]
|
|
|
+ this.endTime = this.currentDateList[1]
|
|
|
+ },
|
|
|
+ /** 查询参数：searchTime/startTime/endTime 筛售后 addTime */
|
|
|
+ queryParams() {
|
|
|
+ return {
|
|
|
+ searchTime: this.searchTime,
|
|
|
+ startTime: this.startTime,
|
|
|
+ endTime: this.endTime
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /** 自系统升级以来：售后创建从 2026-08-18 到当前 */
|
|
|
+ querySinceUpgrade() {
|
|
|
+ this.searchTime = 'sinceUpgrade'
|
|
|
+ this.startTime = '2026-08-18'
|
|
|
+ this.endTime = this.formatDate(new Date())
|
|
|
+ this.currentDateList = [this.startTime, this.endTime]
|
|
|
+ this.loadData()
|
|
|
+ },
|
|
|
+ formatDate(d) {
|
|
|
+ const y = d.getFullYear()
|
|
|
+ const m = ('0' + (d.getMonth() + 1)).slice(-2)
|
|
|
+ const day = ('0' + d.getDate()).slice(-2)
|
|
|
+ return y + '-' + m + '-' + day
|
|
|
+ },
|
|
|
+ getDate() {
|
|
|
+ if (!this.currentDateList || this.currentDateList.length < 2) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.startTime = this.currentDateList[0]
|
|
|
+ this.endTime = this.currentDateList[1]
|
|
|
+ // 选了 2026-08-18 到今天时，与「自系统升级以来」同一口径
|
|
|
+ const today = this.formatDate(new Date())
|
|
|
+ this.searchTime = (this.startTime === '2026-08-18' && this.endTime === today) ? 'sinceUpgrade' : 'custom'
|
|
|
+ this.loadData()
|
|
|
+ },
|
|
|
+ /** 拉取日/月汇总 */
|
|
|
+ loadData() {
|
|
|
+ this.$service.statKd.getNextDayAffect(this.queryParams()).then((res) => {
|
|
|
+ this.dayList = res.dayList || []
|
|
|
+ this.monthList = res.monthList || []
|
|
|
+ this.totalAmount = this.formatNum(res.totalAmount)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="stylus" scoped>
|
|
|
+.shop-list {
|
|
|
+ height: 100%;
|
|
|
+ padding: 16px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: auto;
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+.toolbar {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.toolbar-label {
|
|
|
+ margin-right: 10px;
|
|
|
+ font-size: 13px;
|
|
|
+ color: #606266;
|
|
|
+}
|
|
|
+.total-line {
|
|
|
+ margin-top: 16px;
|
|
|
+ font-size: 15px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+.tables {
|
|
|
+ display: flex;
|
|
|
+ margin-top: 16px;
|
|
|
+}
|
|
|
+.table-block {
|
|
|
+ flex: 1;
|
|
|
+ min-width: 0;
|
|
|
+ margin-left: 16px;
|
|
|
+}
|
|
|
+.table-block:first-child {
|
|
|
+ margin-left: 0;
|
|
|
+}
|
|
|
+.table-title {
|
|
|
+ margin-bottom: 8px;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+</style>
|
