结算管理

src/views/auxiliaryFittings/settleAccountManagement/settleAccount/index.vue

@@ -1,19 +1,20 @@
 <template>
-	<template-page ref="pageRef" :get-list="getList" :table-attributes="tableAttributes" :table-events="tableEvents" :operationColumnWidth="120"
-	  :options-evens-group="optionsEvensGroup" :moreParameters="moreParameters" :column-parsing="columnParsing"
-	  :operation="operation" :exportList="exportList">
-	  
-	  <div slot="moreSearch">
-	    <el-radio-group v-model="status" size="mini" @change="changeType">
-	    	<el-radio-button label="">全部</el-radio-button>
-	    	<el-radio-button label="WAIT">待结算</el-radio-button>
-	    	<el-radio-button label="WAIT_ING">可提现</el-radio-button>
-			<el-radio-button label="ING">提现中</el-radio-button>
-			<el-radio-button label="OVER">已提现</el-radio-button>
-	    </el-radio-group>
-	    <br><br>
-	  </div>
-		<el-dialog title="详情" width="80%" :modal="true" :visible.sync="formDialog" :show-close="true" :close-on-click-modal="false" :modal-append-to-body="false" @close="formDialog = false;formData = {}">
+	<template-page ref="pageRef" :get-list="getList" :table-attributes="tableAttributes" :table-events="tableEvents"
+		:operationColumnWidth="120" :options-evens-group="optionsEvensGroup" :moreParameters="moreParameters"
+		:column-parsing="columnParsing" :operation="operation()" :exportList="exportList">
+
+		<div slot="moreSearch">
+			<el-radio-group v-model="status" size="mini" @change="changeType">
+				<el-radio-button label="">全部</el-radio-button>
+				<el-radio-button label="WAIT">待结算</el-radio-button>
+				<el-radio-button label="WAIT_ING">可提现</el-radio-button>
+				<el-radio-button label="ING">提现中</el-radio-button>
+				<el-radio-button label="OVER">已提现</el-radio-button>
+			</el-radio-group>
+			<br><br>
+		</div>
+		<el-dialog title="详情" width="80%" :modal="true" :visible.sync="formDialog" :show-close="true"
+			:close-on-click-modal="false" :modal-append-to-body="false" @close="formDialog = false; formData = {}">
 			<el-card class="box-card">
 				<div slot="header" class="clearfix">
 					<span>基础信息</span>
@@ -21,81 +22,83 @@
 				<table border="1" style="border-color: #fff;" width="100%" align="center" cellspacing="0" cellpadding="10">
 					<tr>
 						<td class="bold" align="center">所属商户</td>
-						<td>{{formData.companyWechatName}}</td>
+						<td>{{ formData.companyWechatName }}</td>
 						<td class="bold" align="center">关联工单号</td>
-						<td>{{formData.workerOrderId}}</td>
+						<td>{{ formData.workerOrderId }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">结算单号</td>
-						<td>{{formData.settlementOrderId}}</td>
+						<td>{{ formData.settlementOrderId }}</td>
 						<td class="bold" align="center">工单品牌</td>
-						<td>{{formData.brand}}</td>
+						<td>{{ formData.brand }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">客户姓名</td>
-						<td>{{formData.userName}}</td>
+						<td>{{ formData.userName }}</td>
 						<td class="bold" align="center">客户电话</td>
-						<td>{{formData.userMobile}}</td>
+						<td>{{ formData.userMobile }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">师傅姓名</td>
-						<td>{{formData.workerName}}</td>
+						<td>{{ formData.workerName }}</td>
 						<td class="bold" align="center">师傅身份证号</td>
-						<td>{{formData.identity}}</td>
+						<td>{{ formData.identity }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">师傅联系电话</td>
-						<td>{{formData.workerMobile}}</td>
+						<td>{{ formData.workerMobile }}</td>
 						<td class="bold" align="center">订单金额</td>
-						<td>{{formData.totalAmount}}</td>
+						<td>{{ formData.totalAmount }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">销售类型</td>
-						<td>{{formData.settlementType == 'OWN'?'自由':formData.settlementType == 'OUT'?'外购':''}}</td>
+						<td>{{ formData.settlementType == 'OWN' ? '自由' : formData.settlementType == 'OUT' ? '外购' : '' }}</td>
 						<td class="bold" align="center">创建人</td>
-						<td>{{formData.createBy}}</td>
+						<td>{{ formData.createBy }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">创建时间</td>
-						<td>{{formData.createTime}}</td>
+						<td>{{ formData.createTime }}</td>
 						<td class="bold" align="center">支付状态</td>
-						<td>{{formData.payStatus == 'CANCEL'?'取消':formData.payStatus == 'PAID'?'已支付':formData.payStatus == 'WAIT'?'待支付':''}}</td>
+						<td>{{ formData.payStatus == 'CANCEL' ? '取消' : formData.payStatus == 'PAID' ? '已支付' : formData.payStatus ==
+							'WAIT' ? '待支付' : '' }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">支付订单号</td>
-						<td>{{formData.orderId}}</td>
+						<td>{{ formData.orderId }}</td>
 						<td class="bold" align="center">支付时间</td>
-						<td>{{formData.payTime}}</td>
+						<td>{{ formData.payTime }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">分账单号</td>
-						<td>{{formData.settlementOrderId}}</td>
+						<td>{{ formData.settlementOrderId }}</td>
 						<td class="bold" align="center">分账状态</td>
-						<td>{{formData.status == 'WAIT'?'待结算':formData.status == 'WAIT_ING'?'可提现':formData.status == 'ING'?'提现中':formData.status == 'OVER'?'已提现':''}}</td>
+						<td>{{ formData.status == 'WAIT' ? '待结算' : formData.status == 'WAIT_ING' ? '可提现' : formData.status ==
+							'ING' ? '提现中' : formData.status == 'OVER' ? '已提现' : '' }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">分账金额</td>
-						<td>{{formData.amount}}</td>
+						<td>{{ formData.amount }}</td>
 						<td class="bold" align="center">分账时间</td>
-						<td>{{formData.settlementTime}}</td>
+						<td>{{ formData.settlementTime }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">师傅分账金额</td>
-						<td>{{formData.workerAmount}}</td>
+						<td>{{ formData.workerAmount }}</td>
 						<td class="bold" align="center">师傅分账金额手续费</td>
-						<td>{{formData.workerProceAmount}}</td>
+						<td>{{ formData.workerProceAmount }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">商户分账金额</td>
-						<td>{{formData.websitAmount}}</td>
+						<td>{{ formData.websitAmount }}</td>
 						<td class="bold" align="center">商户分账金额手续费</td>
-						<td>{{formData.websitProceAmount}}</td>
+						<td>{{ formData.websitProceAmount }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">操作人</td>
-						<td>{{formData.updateBy}}</td>
+						<td>{{ formData.updateBy }}</td>
 						<td class="bold" align="center">操作时间</td>
-						<td>{{formData.updateTime}}</td>
+						<td>{{ formData.updateTime }}</td>
 					</tr>
 				</table>
 			</el-card>
@@ -117,33 +120,40 @@
 						</tr>
 					</thead>
 					<tbody>
-						<tr v-for="(item,index) in formData.settlementOrderItemList" :key="index">
-							<td align="center">{{item.goodsName}}</td>
-							<td align="center">{{item.chargeType=='ACC'?(item.goodsType == 'M'?'辅材':'配件')+'物料':item.chargeType=='SERV'?'服务收费':''}}</td>
-							<td align="center">{{item.num}}</td>
-							<td align="center">{{item.goodsAmount}}</td>
-							<td align="center">{{item.totalAmount}}</td>
-							<td align="center">{{item.settlementType == 'OWN'?'自有':item.settlementType == 'OUT'?'外购':''}}</td>
-							<td align="center">{{item.workerAmount}}</td>
-							<td align="center">{{item.websitAmount}}</td>
+						<tr v-for="(item, index) in formData.settlementOrderItemList" :key="index">
+							<td align="center">{{ item.goodsName }}</td>
+							<td align="center">{{ item.chargeType == 'ACC' ? (item.goodsType ==
+								'M' ? '辅材' : '配件') + '物料' : item.chargeType == 'SERV' ? '服务收费' : '' }}</td>
+							<td align="center">{{ item.num }}</td>
+							<td align="center">{{ item.goodsAmount }}</td>
+							<td align="center">{{ item.totalAmount }}</td>
+							<td align="center">{{ item.settlementType == 'OWN' ? '自有' : item.settlementType == 'OUT' ? '外购' : '' }}</td>
+							<td align="center">{{ item.workerAmount }}</td>
+							<td align="center">{{ item.websitAmount }}</td>
 						</tr>
 						<!-- <tr>
 							<td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td>
 						</tr> -->
 						<tr>
-							<td align="center">总计</td><td></td><td></td><td></td>
-							<td align="center">{{totalAmount}}</td><td></td>
-							<td align="center">{{workerAmount}}</td>
-							<td align="center">{{websitAmount}}</td>
+							<td align="center">总计</td>
+							<td></td>
+							<td></td>
+							<td></td>
+							<td align="center">{{ totalAmount }}</td>
+							<td></td>
+							<td align="center">{{ workerAmount }}</td>
+							<td align="center">{{ websitAmount }}</td>
 						</tr>
 					</tbody>
 				</table>
 			</el-card>
-		  <div slot="footer" class="dialog-footer">
-			<el-button size="mini" @click="formDialog = false;formData = {}">取 消</el-button>
-			<el-button size="mini" v-if="formData.status == 'WAIT'" type="primary" @click="settleAccounts(formData.settlementOrderId)">确认结算</el-button>
-			<el-button size="mini" v-if="formData.status == 'WAIT_ING'" type="primary" @click="withdraw(formData.settlementOrderId)">确认提现</el-button>
-		  </div>
+			<div slot="footer" class="dialog-footer">
+				<el-button size="mini" @click="formDialog = false; formData = {}">取 消</el-button>
+				<el-button size="mini" v-if="formData.status == 'WAIT'" type="primary"
+					@click="settleAccounts(formData.settlementOrderId)">确认结算</el-button>
+				<el-button size="mini" v-if="formData.status == 'WAIT_ING'" type="primary"
+					@click="withdraw(formData.settlementOrderId)">确认提现</el-button>
+			</div>
 		</el-dialog>
 	</template-page>
 </template>
@@ -154,202 +164,211 @@ import import_mixin from '@/components/template/import_mixin.js'
 import ImageUpload from '@/components/file-upload'
 import { downloadFiles } from '@/utils/util'
 import { required, mobileRequired, mobile, httpUrl, email } from '@/components/template/rules_verify.js'
-import { listPageV2,pageExport, getDetail, refund, settleAccounts, withdraw } from "@/api/auxiliaryFittings/settleAccount";
+import { listPageV2, pageExport, getDetail, refund, settleAccounts, withdraw } from "@/api/auxiliaryFittings/settleAccount";
+import operation_mixin from '@/components/template/operation_mixin.js'
 export default {
-  components: { TemplatePage, ImageUpload },
-  mixins: [import_mixin],
-  data() {
-    return {
+	components: { TemplatePage, ImageUpload },
+	mixins: [import_mixin, operation_mixin],
+	data() {
+		return {
+			// 表格属性
+			tableAttributes: {
+				// 启用勾选列
+				selectColumn: true
+			},
+			// 表格事件
+			tableEvents: {
+				'selection-change': this.selectionChange
+			},
+			// 勾选选中行
+			recordSelected: [],
+			formDialogType: 0,
+			formDialogTitles: ["新增", "编辑", "详情"],
+			formDialog: false,
+			formData: {},
+			status: '',
+			totalAmount: 0,
+			workerAmount: 0,
+			websitAmount: 0,
+		}
+	},
+	computed: {
 		// 事件组合
-		optionsEvensGroup: [
-			[
+		optionsEvensGroup() {
+			return [
 				[
-					{
-						name: '批量结算',
-						click: ()=>{
-							this.batchSettleAccounts()
+					[
+						this.optionsEvensAuth("bulkSettlement", {
+							click: this.batchSettleAccounts
 						}
-					}
-				]
-			],
-			[
-				[
-					{
-						name: '批量提现',
-						click: ()=>{
-							this.batchWithdraw()
+						),
+					],
+					[
+						this.optionsEvensAuth("bulkWithdrawal", {
+							click: this.batchWithdraw
 						}
-					}
+						),
+					],
 				]
-			],
-		],
-		// 表格属性
-		tableAttributes: {
-			// 启用勾选列
-			selectColumn: true
-		},
-		// 表格事件
-		tableEvents: {
-			'selection-change': this.selectionChange
+			]
 		},
-		// 勾选选中行
-		recordSelected: [],
-		formDialogType: 0,
-		formDialogTitles: ["新增","编辑", "详情"],
-		formDialog: false,
-		formData: {},
-		status: '',
-		totalAmount: 0,
-		workerAmount: 0,
-		websitAmount: 0,
-    }
-  },
-  computed: {
-    // 更多参数
-    moreParameters() {
-      return []
-    }
-  },
-  methods: {
-	// 切换状态
-	changeType(val) {
-	  this.$refs.pageRef.refreshList()
-	},
-    // 列表请求函数
-	getList(p) {
-	  try {
-	    var pam = JSON.parse(JSON.stringify(p))
-	    if (this.status) {
-	      pam.params.push({ "param": "a.status", "compare": "=", "value": this.status })
-	    }
-	    return listPageV2(pam)
-	  } catch (error) {
-	    console.log(error)
-	  }
+		// 更多参数
+		moreParameters() {
+			return []
+		}
 	},
-    // 列表导出函数
-    exportList: pageExport,
-    // 表格列解析渲染数据更改
-    columnParsing(item, defaultData) {
-		return defaultData
-    },
-    // 监听勾选变化
-    selectionChange(data) {
-      this.recordSelected = data
-    },
+	methods: {
+		// 切换状态
+		changeType(val) {
+			this.$refs.pageRef.refreshList()
+		},
+		// 列表请求函数
+		getList(p) {
+			try {
+				var pam = JSON.parse(JSON.stringify(p))
+				if (this.status) {
+					pam.params.push({ "param": "a.status", "compare": "=", "value": this.status })
+				}
+				return listPageV2(pam)
+			} catch (error) {
+				console.log(error)
+			}
+		},
+		// 列表导出函数
+		exportList: pageExport,
+		// 表格列解析渲染数据更改
+		columnParsing(item, defaultData) {
+			return defaultData
+		},
+		// 监听勾选变化
+		selectionChange(data) {
+			this.recordSelected = data
+		},
 		openForm() {
-		  this.formDialog = true;
+			this.formDialog = true;
 		},
 		formCancel() {
-		  this.$refs.formRef.$refs.inlineForm.clearValidate()
-		  this.$data.formData = this.$options.data().formData
-		  this.formDialog = false
+			this.$refs.formRef.$refs.inlineForm.clearValidate()
+			this.$data.formData = this.$options.data().formData
+			this.formDialog = false
 		},
-    // 表格操作列
-    operation(h, { row, index, column }) {
-      return (
-        <div class='operation-btns'>
-		  <el-button type="text" onClick={() => {
-			this.totalAmount = 0
-			this.workerAmount = 0
-			this.websitAmount = 0
-		    getDetail({ id: row.settlementOrderId }).then(res => {
-		      Object.assign(this.formData, res.data)
-			  res.data.settlementOrderItemList.forEach(item=>{
-				  this.totalAmount += (item.totalAmount*100 +  this.totalAmount*100)/100
-				  this.workerAmount = (item.workerAmount*100 +  this.workerAmount*100)/100
-				  this.websitAmount += (item.websitAmount*100 +  this.websitAmount*100)/100
-			  })
-		      this.formDialogType = 1
-		      this.openForm()
-		    })
-		  }}>查看</el-button>
-		  {row.totalAmount > 0? <el-button type="text" onClick={() => {
-		  	this.$confirm('请确认是否退款, 是否继续?', '提示', {
-		  		confirmButtonText: '确定',
-		  		cancelButtonText: '取消',
-		  		type: 'warning'
-		  	}).then(() => {
-		  		refund({ id: row.settlementOrderId }).then(res => {
-		  		  if (res.code == 200) {
-		  		  	this.$message({ type: 'success', message: '退款成功!' })
-		  		  	this.$refs.pageRef.refreshList()
-		  		  } else {
-		  		  	this.$message.error(res.msg);
-		  		  }
-		  		})
-		  	});
-		  }}>退款</el-button>:null}
-		  {row.status == 'WAIT'? <el-button type="text" onClick={() => {
-		  	this.settleAccounts(row.settlementOrderId)
-		  }}>结算</el-button>:null}
-		  {row.status == 'WAIT_ING'? <el-button type="text" onClick={() => {
-		  	this.withdraw(row.settlementOrderId)
-		  }}>提现</el-button>:null}
-        </div>
-      )
-    },
-	batchSettleAccounts(){
-		if(this.recordSelected.length == 0){
-			return this.$message.warning('请至少勾选一条数据！');
-		}
-		this.settleAccounts(this.recordSelected.map(item=>{return item.settlementOrderId}).join(','))
-	},
-	settleAccounts(id){
-		this.$confirm(`请确认是否结算选中数据, 是否继续?`, '提示', {
-			confirmButtonText: '确定',
-			cancelButtonText: '取消',
-			type: 'warning'
-		}).then(() => {
-			settleAccounts({
-				id
-			}).then(res => {
-				if (res.code == 200) {
-					this.$message({ type: 'success', message: `结算成功!` })
-					this.$refs.pageRef.refreshList()
-					this.formDialog = false
-				} else {
-					this.$message.error(res.msg);
-				}
-			})
-		});
-	},
-	batchWithdraw(){
-		if(this.recordSelected.length == 0){
-			return this.$message.warning('请至少勾选一条数据！');
-		}
-		this.withdraw(this.recordSelected.map(item=>{return item.settlementOrderId}).join(','))
-	},
-	withdraw(id){
-		this.$confirm(`请确认是否提现选中数据, 是否继续?`, '提示', {
-			confirmButtonText: '确定',
-			cancelButtonText: '取消',
-			type: 'warning'
-		}).then(() => {
-			withdraw({
-				id
-			}).then(res => {
-				if (res.code == 200) {
-					this.$message({ type: 'success', message: `提现成功!` })
-					this.$refs.pageRef.refreshList()
-					this.formDialog = false
-				} else {
-					this.$message.error(res.msg);
-				}
+
+		operation() {
+			return this.operationBtn({
+				detail: {
+					click: ({ row, index, column }) => {
+						this.totalAmount = 0
+						this.workerAmount = 0
+						this.websitAmount = 0
+						getDetail({ id: row.settlementOrderId }).then(res => {
+							Object.assign(this.formData, res.data)
+							res.data.settlementOrderItemList.forEach(item => {
+								this.totalAmount += (item.totalAmount * 100 + this.totalAmount * 100) / 100
+								this.workerAmount = (item.workerAmount * 100 + this.workerAmount * 100) / 100
+								this.websitAmount += (item.websitAmount * 100 + this.websitAmount * 100) / 100
+							})
+							this.formDialogType = 1
+							this.openForm()
+						})
+					}
+				},
+				refund: {
+					prompt: "请确认是否退款, 是否继续?",
+					conditions: ({ row, index, column }) => {
+						return row.totalAmount > 0
+					},
+					click: ({ row, index, column }) => {
+						refund({ id: row.settlementOrderId }).then(res => {
+							if (res.code == 200) {
+								this.$message({ type: 'success', message: '退款成功!' })
+								this.$refs.pageRef.refreshList()
+							} else {
+								this.$message.error(res.msg);
+							}
+						})
+					}
+				},
+				settlement: {
+					conditions: ({ row, index, column }) => {
+						return row.status == 'WAIT'
+					},
+					click: ({ row, index, column }) => {
+						this.settleAccounts(row.settlementOrderId)
+					}
+				},
+				withdraw: {
+					conditions: ({ row, index, column }) => {
+						return row.status == 'WAIT_ING'
+					},
+					click: ({ row, index, column }) => {
+						this.withdraw(row.settlementOrderId)
+					}
+				},
 			})
-		});
-	},
-  }
+		},
+
+		batchSettleAccounts() {
+			if (this.recordSelected.length == 0) {
+				return this.$message.warning('请至少勾选一条数据！');
+			}
+			this.settleAccounts(this.recordSelected.map(item => { return item.settlementOrderId }).join(','))
+		},
+		settleAccounts(id) {
+			this.$confirm(`请确认是否结算选中数据, 是否继续?`, '提示', {
+				confirmButtonText: '确定',
+				cancelButtonText: '取消',
+				type: 'warning'
+			}).then(() => {
+				settleAccounts({
+					id
+				}).then(res => {
+					if (res.code == 200) {
+						this.$message({ type: 'success', message: `结算成功!` })
+						this.$refs.pageRef.refreshList()
+						this.formDialog = false
+					} else {
+						this.$message.error(res.msg);
+					}
+				})
+			});
+		},
+		batchWithdraw() {
+			if (this.recordSelected.length == 0) {
+				return this.$message.warning('请至少勾选一条数据！');
+			}
+			this.withdraw(this.recordSelected.map(item => { return item.settlementOrderId }).join(','))
+		},
+		withdraw(id) {
+			this.$confirm(`请确认是否提现选中数据, 是否继续?`, '提示', {
+				confirmButtonText: '确定',
+				cancelButtonText: '取消',
+				type: 'warning'
+			}).then(() => {
+				withdraw({
+					id
+				}).then(res => {
+					if (res.code == 200) {
+						this.$message({ type: 'success', message: `提现成功!` })
+						this.$refs.pageRef.refreshList()
+						this.formDialog = false
+					} else {
+						this.$message.error(res.msg);
+					}
+				})
+			});
+		},
+	}
 }
 </script>
 
 <style lang="scss" scoped>
-	.tab{
-		padding: 20px 20px 0 20px;
-	}
-	.bold{
-		width: 160px;
-		font-weight: bold;
-		background-color: #f0f0f0;
-	}
+.tab {
+	padding: 20px 20px 0 20px;
+}
+
+.bold {
+	width: 160px;
+	font-weight: bold;
+	background-color: #f0f0f0;
+}
 </style>