Mr.Zhang
2023-10-28 805fcd4d881ac13d0fe9961076ead66a71c20b2d
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<template>
  <TableLayout :permissions="['business:wxbilldetail:query']">
    <!-- 搜索表单 -->
    <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline>
      <el-form-item label="对账日期" prop="name">
        <el-date-picker
          v-model="value1"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :picker-options="pickerOptions"
          format="yyyy-MM-dd" value-format="yyyy-MM-dd HH:mm:ss"
          @change="selectDate"
        ></el-date-picker>
      </el-form-item>
      <section>
        <el-button type="primary" @click="search">搜索</el-button>
        <el-button @click="reset">重置</el-button>
      </section>
    </el-form>
    <!-- 表格和分页 -->
    <template v-slot:table-wrap>
      <el-table
        v-loading="isWorking.search"
        :data="tableData.list"
        :span-method="arraySpanMethod"
        border
      >
        <el-table-column prop="billType" label="订单类型" min-width="100px" align="center">
          <template slot-scope="{row}">
            <div v-if="row.billType=='其中含'" style="text-align: left; color: rgb(246, 156, 32); font-weight: 500;">其中含</div>
            <div v-else>{{ row.billType }}</div>
          </template>
        </el-table-column>
        <el-table-column prop="sumBill" label="订单数量" min-width="100px" align="center"></el-table-column>
        <el-table-column prop="sumTotalFee" label="交易金额" min-width="100px" align="center"></el-table-column>
        <el-table-column prop="sumRefundBill" label="退款笔数" min-width="100px" align="center"></el-table-column>
        <el-table-column prop="sumRefundFee" label="退款金额" min-width="100px" align="center"></el-table-column>
        <el-table-column prop="cmmsAmt" label="手续费" min-width="100px" align="center"></el-table-column>
        <el-table-column prop="total" label="结算金额" min-width="100px" align="center"></el-table-column>
        <!-- v-if="containPermissions(['business:pricingparam:update', 'business:pricingparam:delete'])" -->
        <el-table-column
          
          label="操作"
          min-width="120"
          align="center"
          fixed="right"
        >
          <template slot-scope="scope">
            <template v-if="scope.$index != 2">
              <el-button type="text" @click="$refs.billDetailWindow.open(scope.$index==4?'非自行车收入明细':'对账明细', {type:scope.$index, ...searchForm})">查看明细</el-button>
              <el-button type="text">导出明细</el-button>
            </template>
            <div v-else>-</div>
          </template>
        </el-table-column>
      </el-table>
      
    </template>
    <BillDetailWindow ref="billDetailWindow"/>
  </TableLayout>
</template>
 
<script>
import BaseTable from '@/components/base/BaseTable'
import TableLayout from '@/layouts/TableLayout'
import { fetchList } from '@/api/business/wxBillDetail'
import BillDetailWindow from '@/components/business/BillDetailWindow'
import { formatDateTime } from '@/utils/util'
export default {
  name: 'WxBillDetail',
  extends: BaseTable,
  components: { TableLayout, BillDetailWindow },
  data () {
    return {
      value1: [],
      // 搜索
      searchForm: {
        endDate: '',
        startDate: '',
      },
      pickerOptions: {}
    }
  },
  created () {
    this.config({
      module: '',
      api: '/business/wxBillDetail',
      'field.id': 'id',
      'field.main': 'id'
    })
    this.pickerOptions.disabledDate = (time) => {
        // 一天
      let tempTime = 3600 * 1000 * 24 
      return time.getTime() > new Date() - tempTime
    }
    // let tempTime = new Date().getTime() - 3600 * 1000 * 24 
    // this.searchForm.startDate = formatDateTime(new Date(tempTime), 'yyyy-MM-dd') + ' 00:00:00'
    // this.searchForm.endDate = formatDateTime(new Date(tempTime), 'yyyy-MM-dd') + ' 23:59:59'
    // this.value1 = [this.searchForm.startDate, this.searchForm.endDate]
 
    this.search()
  },
  methods: {
    reset() {
      this.searchForm.startDate = ''
      this.searchForm.endDate = ''
      this.value1 = []
      this.$refs.searchForm.resetFields()
      this.search()
    },
    
    search() {
      fetchList(this.searchForm)
        .then(res => {
          this.tableData.list = [
            { billType: '交易实收', ...res[0], cmmsAmt: (res[0].sumCmmsAmt + res[0].sumRefundCmmsAmt).toFixed(2) },
            { billType: '退款', ...res[1], cmmsAmt: (res[1].sumRefundCmmsAmt + res[1].sumRefundCmmsAmt).toFixed(2) },
            { billType: '总计', ...res[2], cmmsAmt: (res[2].sumCmmsAmt + res[2].sumRefundCmmsAmt).toFixed(2) },
            { billType: '其中含' },
            { billType: '非自行车收入', ...res[3], cmmsAmt: (res[3].sumCmmsAmt + res[3].sumRefundCmmsAmt).toFixed(2) },
          ]
        })
    },
    selectDate(v) {
      this.searchForm.startDate = ''
      this.searchForm.endDate = ''
      if (v) {
        this.searchForm.startDate = v[0]
        this.searchForm.endDate = v[1]
      }
      this.search()
    },
    arraySpanMethod({ row, column, rowIndex, columnIndex }) {
        if (rowIndex == 3) {
          if (columnIndex === 0) {
            return [1,8];
          } else {
            return [0, 0];
          }
        }
      },
  },
}
</script>