9 changed files with 610 additions and 20 deletions
@ -0,0 +1,187 @@ |
|||
<style lang="less" scoped> |
|||
.withdraw-record-owner { |
|||
margin-bottom: 12px; |
|||
} |
|||
</style> |
|||
<template> |
|||
<Modal :title="title" v-model="visible" :mask-closable="false" :width="1100"> |
|||
<div class="withdraw-record-owner"> |
|||
<span>{{ ownerLabel }}:{{ ownerName }}</span> |
|||
</div> |
|||
<Table :loading="loading" border :columns="columns" :data="data" :size="tableSize"></Table> |
|||
<Row type="flex" justify="end" class="page"> |
|||
<Page :current="searchForm.pageNum" :total="total" :page-size="searchForm.pageSize" |
|||
@on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" |
|||
size="small" show-total show-elevator show-sizer></Page> |
|||
</Row> |
|||
<div slot="footer"> |
|||
<Button type="text" @click="visible = false">关闭</Button> |
|||
</div> |
|||
</Modal> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
getReturnCommissionPage |
|||
} from "@/api/app"; |
|||
|
|||
export default { |
|||
name: "WithdrawRecordModal", |
|||
props: { |
|||
tableSize: { |
|||
type: String, |
|||
default: "default" |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
visible: false, |
|||
loading: false, |
|||
ownerType: "", |
|||
ownerInfo: {}, |
|||
searchForm: { |
|||
shopId: "", |
|||
workerId: "", |
|||
pageNum: 1, |
|||
pageSize: 10 |
|||
}, |
|||
data: [], |
|||
total: 0, |
|||
columns: [ |
|||
{ |
|||
type: "index", |
|||
width: 60, |
|||
align: "center" |
|||
}, |
|||
{ |
|||
title: "提现时间", |
|||
key: "createTime", |
|||
minWidth: 170, |
|||
render: (h, params) => h("span", this.displayValue(params.row.createTime)) |
|||
}, |
|||
{ |
|||
title: "提现金额(元)", |
|||
key: "commission", |
|||
minWidth: 130, |
|||
render: (h, params) => h("span", this.formatAmount(params.row.commission)) |
|||
}, |
|||
{ |
|||
title: "提现状态", |
|||
key: "status", |
|||
minWidth: 110, |
|||
render: (h, params) => { |
|||
const status = this.formatStatus(params.row.status); |
|||
return h("Tag", { |
|||
props: { |
|||
color: status.color |
|||
} |
|||
}, status.text); |
|||
} |
|||
}, |
|||
{ |
|||
title: "支付宝姓名", |
|||
key: "aliName", |
|||
minWidth: 130, |
|||
render: (h, params) => h("span", this.displayValue(params.row.aliName)) |
|||
}, |
|||
{ |
|||
title: "支付宝账号", |
|||
key: "aliAccount", |
|||
minWidth: 170, |
|||
render: (h, params) => h("span", this.displayValue(params.row.aliAccount)) |
|||
}, |
|||
{ |
|||
title: "备注", |
|||
key: "remark", |
|||
minWidth: 180, |
|||
render: (h, params) => h("span", this.displayValue(params.row.remark)) |
|||
}, |
|||
{ |
|||
title: "失败原因", |
|||
key: "failMessage", |
|||
minWidth: 180, |
|||
render: (h, params) => h("span", this.displayValue(params.row.failMessage)) |
|||
} |
|||
] |
|||
}; |
|||
}, |
|||
computed: { |
|||
title() { |
|||
return this.ownerLabel + "提现记录"; |
|||
}, |
|||
ownerLabel() { |
|||
return this.ownerType === "worker" ? "配送员" : "店铺"; |
|||
}, |
|||
ownerName() { |
|||
if (this.ownerType === "worker") { |
|||
return this.ownerInfo.workerName || "-"; |
|||
} |
|||
return this.ownerInfo.shopName || "-"; |
|||
} |
|||
}, |
|||
methods: { |
|||
open(row, ownerType) { |
|||
this.ownerType = ownerType; |
|||
this.ownerInfo = row || {}; |
|||
this.searchForm = { |
|||
shopId: ownerType === "shop" ? (this.ownerInfo.id || this.ownerInfo.shopId || "") : "", |
|||
workerId: ownerType === "worker" ? (this.ownerInfo.workerId || this.ownerInfo.id || "") : "", |
|||
pageNum: 1, |
|||
pageSize: 10 |
|||
}; |
|||
this.visible = true; |
|||
this.getDataList(); |
|||
}, |
|||
getDataList() { |
|||
this.loading = true; |
|||
getReturnCommissionPage(this.searchForm).then((res) => { |
|||
if (res.success) { |
|||
const result = res.result || {}; |
|||
this.data = result.records || result.content || []; |
|||
this.total = Number(result.total || result.totalElements) || 0; |
|||
if (this.data.length == 0 && this.searchForm.pageNum > 1) { |
|||
this.searchForm.pageNum -= 1; |
|||
this.getDataList(); |
|||
} |
|||
} |
|||
}).finally(() => { |
|||
this.loading = false; |
|||
}); |
|||
}, |
|||
changePage(v) { |
|||
this.searchForm.pageNum = v; |
|||
this.getDataList(); |
|||
}, |
|||
changePageSize(v) { |
|||
this.searchForm.pageNum = 1; |
|||
this.searchForm.pageSize = v; |
|||
this.getDataList(); |
|||
}, |
|||
displayValue(v) { |
|||
return v === null || v === undefined || v === "" ? "-" : v; |
|||
}, |
|||
formatAmount(v) { |
|||
const number = Number(v); |
|||
return isNaN(number) ? "0.00" : number.toFixed(2); |
|||
}, |
|||
formatStatus(v) { |
|||
if (v == "1") { |
|||
return { |
|||
text: "提现成功", |
|||
color: "green" |
|||
}; |
|||
} |
|||
if (v == "2") { |
|||
return { |
|||
text: "提现失败", |
|||
color: "red" |
|||
}; |
|||
} |
|||
return { |
|||
text: "审核中", |
|||
color: "orange" |
|||
}; |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
Loading…
Reference in new issue