MrShi
10 小时以前 e50954f0708ecbbc672352102ae3b24279d40cc1
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
147
148
149
150
151
152
153
154
155
156
<template>
  <TableLayout :permissions="['business:withdrawalorders:query']">
    <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline>
      <el-form-item label="门店名称" prop="shopName">
        <el-input v-model="searchForm.shopName" clearable placeholder="请输入门店名称" @keypress.enter.native="search"></el-input>
      </el-form-item>
      <el-form-item label="申请时间" prop="createTime1">
        <el-date-picker type="daterange" v-model="searchForm.createTime1" clearable value-format="yyyy-MM-dd"
                        range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" @change="handleDateChange" />
      </el-form-item>
      <el-form-item label="审批状态" prop="status">
        <el-select v-model="searchForm.status" clearable placeholder="请选择状态" @change="search">
          <el-option label="提现申请中" :value="0"></el-option>
          <el-option label="提现成功" :value="1"></el-option>
          <el-option label="提现失败" :value="2"></el-option>
        </el-select>
      </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>
      <div class="total-amount">
        <span>累计提现:¥{{ totalAmount }}</span>
      </div>
      <el-table
        :height="tableHeightNew"
        v-loading="isWorking.search"
        :data="tableData.list"
        stripe
      >
        <el-table-column prop="shopName" label="门店名称" min-width="120px"></el-table-column>
        <el-table-column prop="linkName" label="门店联系人" min-width="100px"></el-table-column>
        <el-table-column prop="amount" label="提现金额(元)" min-width="120px">
          <template slot-scope="{row}">
            <span class="amount">¥{{ row.amount / 100 }}</span>
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="申请时间" min-width="160px"></el-table-column>
        <el-table-column label="审核状态" min-width="100px">
          <template slot-scope="{row}">
            <span :style="{ color: getStatusColor(row.status) }">
              {{ getStatusText(row.status) }}
            </span>
          </template>
        </el-table-column>
        <el-table-column label="操作" min-width="100" fixed="right">
          <template slot-scope="{row}">
            <el-button type="text" @click="handleView(row)">查看</el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        @size-change="handleSizeChange"
        @current-change="handlePageChange"
        :pagination="tableData.pagination"
      ></pagination>
    </template>
    <OperaWithdrawDetailWindow ref="operaWithdrawDetailWindow" @success="search" />
  </TableLayout>
</template>
 
<script>
import BaseTable from '@/components/base/BaseTable'
import TableLayout from '@/layouts/TableLayout'
import Pagination from '@/components/common/Pagination'
import OperaWithdrawDetailWindow from '@/components/business/OperaWithdrawDetailWindow'
import { fetchList, getTotalAmount } from '@/api/business/shopWithdraw'
 
export default {
  name: 'ShopWithdrawList',
  extends: BaseTable,
  components: { TableLayout, Pagination, OperaWithdrawDetailWindow },
  data () {
    return {
      totalAmount: '0.00',
      searchForm: {
        shopName: '',
        createTime1: '',
        createStartTime: '',
        createEndTime: '',
        status: ''
      }
    }
  },
  created () {
    this.config({
      api: '/business/shopWithdraw',
      'field.id': 'id'
    })
    this.loadTotalAmount()
    this.search()
  },
  methods: {
    loadTotalAmount () {
      getTotalAmount({
        capacity: 99999,
        pageNum: 1,
        model: {
          shopName: this.searchForm.shopName,
          createStartTime: this.searchForm.createStartTime,
          createEndTime: this.searchForm.createEndTime,
          status: this.searchForm.status
        }
      }).then(res => {
        this.totalAmount = res / 100 || '0.00'
      }).catch(e => {
        this.$tip.apiFailed(e)
      })
    },
    getStatusText (status) {
      const map = { 0: '提现申请中', 1: '提现成功', 2: '提现失败' }
      return map[status] || '-'
    },
    getStatusColor (status) {
      const map = { 0: '#E6A23C', 1: '#67C23A', 2: '#F56C6C' }
      return map[status] || '#606266'
    },
    handleDateChange (val) {
      this.searchForm.createStartTime = val ? val[0] : ''
      this.searchForm.createEndTime = val ? val[1] : ''
      this.search()
    },
    reset () {
      this.searchForm = {
        shopName: '',
        createTime1: '',
        createStartTime: '',
        createEndTime: '',
        auditStatus: ''
      }
      this.search()
    },
    handleView (row) {
      this.$refs.operaWithdrawDetailWindow.open('提现详情', row)
    }
  }
}
</script>
 
<style scoped>
.total-amount {
  padding: 15px 20px;
  background: #f5f7fa;
  border-radius: 8px;
  margin-bottom: 15px;
  font-size: 16px;
  font-weight: bold;
  color: #303133;
}
.amount {
  color: #f56c6c;
  font-weight: bold;
}
</style>