销售提现管理

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

@@ -1,17 +1,18 @@
 <template>
-	<template-page ref="pageRef" :get-list="getList" :table-attributes="tableAttributes" :table-events="tableEvents" :operationColumnWidth="110"
-	  :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="0">待发放</el-radio-button>
-	    	<el-radio-button label="1">已发放</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="110" :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="0">待发放</el-radio-button>
+				<el-radio-button label="1">已发放</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>
@@ -19,47 +20,47 @@
 				<table border="1" style="border-color: #fff;" width="100%" align="center" cellspacing="0" cellpadding="10">
 					<tr>
 						<td class="bold" align="center">提现类型</td>
-						<td>{{formData.type == 1?'销售提现':'服务提现'}}</td>
+						<td>{{ formData.type == 1 ? '销售提现' : '服务提现' }}</td>
 						<td class="bold" align="center">单据编号</td>
-						<td>{{formData.id}}</td>
+						<td>{{ formData.id }}</td>
 						<td class="bold" align="center">所属商户</td>
-						<td>{{formData.companyWechatName}}</td>
+						<td>{{ formData.companyWechatName }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">发放状态</td>
-						<td>{{formData.status == 0?'待发放':formData.status == 1?'已发放':''}}</td>
+						<td>{{ formData.status == 0 ? '待发放' : formData.status == 1 ? '已发放' : '' }}</td>
 						<td class="bold" align="center">师傅姓名</td>
-						<td>{{formData.workerName}}</td>
+						<td>{{ formData.workerName }}</td>
 						<td class="bold" align="center">师傅编号</td>
-						<td>{{formData.workerId}}</td>
+						<td>{{ formData.workerId }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">师傅身份证号</td>
-						<td>{{formData.idcard}}</td>
+						<td>{{ formData.idcard }}</td>
 						<td class="bold" align="center">师傅联系电话</td>
-						<td>{{formData.workerMobile}}</td>
+						<td>{{ formData.workerMobile }}</td>
 						<td class="bold" align="center">申请时间</td>
-						<td>{{formData.createTime}}</td>
+						<td>{{ formData.createTime }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">账户类型</td>
-						<td>{{formData.accountType}}</td>
+						<td>{{ formData.accountType }}</td>
 						<td class="bold" align="center">开户银行</td>
-						<td>{{formData.bank}}</td>
+						<td>{{ formData.bank }}</td>
 						<td class="bold" align="center">开户支行</td>
-						<td>{{formData.subBank}}</td>
+						<td>{{ formData.subBank }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">持卡人</td>
-						<td>{{formData.bankUserName}}</td>
+						<td>{{ formData.bankUserName }}</td>
 						<td class="bold" align="center">银行卡号</td>
-						<td>{{formData.bankNo}}</td>
+						<td>{{ formData.bankNo }}</td>
 						<td class="bold" align="center">提现金额</td>
-						<td>￥{{formData.amount}}</td>
+						<td>￥{{ formData.amount }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center">备注</td>
-						<td colspan="5">{{formData.remark}}</td>
+						<td colspan="5">{{ formData.remark }}</td>
 					</tr>
 					<tr>
 						<td class="bold" align="center"><span style="color: red;">*</span>转账凭证</td>
@@ -88,33 +89,37 @@
 						</tr>
 					</thead>
 					<tbody>
-						<tr v-for="(item,index) in formData.withdrawalOrderItems" :key="index">
-							<td align="center">{{item.id}}</td>
-							<td align="center">{{item.goodsType == 'M'?'辅材':'配件'}}</td>
+						<tr v-for="(item, index) in formData.withdrawalOrderItems" :key="index">
+							<td align="center">{{ item.id }}</td>
+							<td align="center">{{ item.goodsType == 'M' ? '辅材' : '配件' }}</td>
 							<!-- <td align="center">{{item.chargeType=='ACC'?'配件物料':item.chargeType=='SERV'?'服务收费':''}}</td> -->
-							<td align="center">{{item.num}}</td>
+							<td align="center">{{ item.num }}</td>
 							<!-- <td align="center">{{item.goodsAmount}}</td> -->
-							<td align="center">{{item.totalPrice}}</td>
-							<td align="center">{{item.settlementType == 'OWN'?'自有':item.settlementType == 'OUT'?'外购':''}}</td>
-							<td align="center">{{item.workerAmount}}</td>
-							<td align="center">{{item.websitAmount}}</td>
+							<td align="center">{{ item.totalPrice }}</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 style="color: #ffffff;">隐身</td><td></td><td></td><td></td><td></td><td></td><td></td>
 						</tr> -->
 						<tr>
-							<td align="center">总计</td><td></td></td><td>
-							<td align="center">{{totalAmount || 0}}</td><td></td>
-							<td align="center">{{workerAmount || 0}}</td>
-							<td align="center">{{websitAmount || 0}}</td>
+							<td align="center">总计</td>
+							<td></td>
+							</td>
+							<td>
+							<td align="center">{{ totalAmount || 0 }}</td>
+							<td></td>
+							<td align="center">{{ workerAmount || 0 }}</td>
+							<td align="center">{{ websitAmount || 0 }}</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 == 0" type="primary" @click="update(formData.id)">设为已发</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 == 0" type="primary" @click="update(formData.id)">设为已发</el-button>
+			</div>
 		</el-dialog>
 	</template-page>
 </template>
@@ -125,150 +130,157 @@ 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, update } from "@/api/auxiliaryFittings/salesWithdraw";
+import { listPageV2, pageExport, getDetail, update } from "@/api/auxiliaryFittings/salesWithdraw";
+import operation_mixin from '@/components/template/operation_mixin.js'
 export default {
-  components: { TemplatePage, ImageUpload },
-  mixins: [import_mixin],
-  data() {
-    return {
-		// 事件组合
-		optionsEvensGroup: [],
-		// 表格属性
-		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()
+	components: { TemplatePage, ImageUpload },
+	mixins: [import_mixin, operation_mixin],
+	data() {
+		return {
+			// 事件组合
+			optionsEvensGroup: [],
+			// 表格属性
+			tableAttributes: {
+				// 启用勾选列
+				selectColumn: true
+			},
+			// 表格事件
+			tableEvents: {
+				'selection-change': this.selectionChange
+			},
+			// 勾选选中行
+			recordSelected: [],
+			formDialogType: 0,
+			formDialogTitles: ["新增", "编辑", "详情"],
+			formDialog: false,
+			formData: {},
+			status: '',
+			totalAmount: 0,
+			workerAmount: 0,
+			websitAmount: 0
+		}
 	},
-    // 列表请求函数
-	getList(p,cb) {
-	  try {
-	    var pam = JSON.parse(JSON.stringify(p))
-	    if (this.status || this.status >= 0) {
-	      pam.params.push({ "param": "a.status", "compare": "=", "value": this.status })
-	    }
-		cb && cb(pam)
-	    return listPageV2(pam)
-	  } catch (error) {
-	    console.log(error)
-	  }
+	computed: {
+		// 更多参数
+		moreParameters() {
+			return []
+		}
 	},
-    // 列表导出函数
-    exportList: pageExport,
-    // 表格列解析渲染数据更改
-    columnParsing(item, defaultData) {
-		return defaultData
-    },
-    // 监听勾选变化
-    selectionChange(data) {
-      this.recordSelected = data
-    },
+	methods: {
+		// 切换状态
+		changeType(val) {
+			this.$refs.pageRef.refreshList()
+		},
+		// 列表请求函数
+		getList(p, cb) {
+			try {
+				var pam = JSON.parse(JSON.stringify(p))
+				if (this.status || this.status >= 0) {
+					pam.params.push({ "param": "a.status", "compare": "=", "value": this.status })
+				}
+				cb && cb(pam)
+				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.id }).then(res => {
-		      Object.assign(this.formData, res.data,{
-				  certImg:res.data?.certImg ? res.data?.certImg?.split(",").map(item=>({url:item})) : []
-			  })
-			  res.data.withdrawalOrderItems.forEach(item=>{
-			  	this.totalAmount += item.totalPrice
-			  	this.workerAmount += item.workerAmount
-			  	this.websitAmount += item.websitAmount
-			  })
-		      this.formDialogType = 1
-		      this.openForm()
-		    })
-		  }}>查看</el-button>
-		  {row.status == 0? <el-button type="text" onClick={() => {
-		  	this.totalAmount = 0
-		  	this.workerAmount = 0
-		  	this.websitAmount = 0
-		  	getDetail({ id: row.id }).then(res => {
-		  	  Object.assign(this.formData, res.data,{
-				  certImg:res.data?.certImg ? res.data?.certImg?.split(",").map(item=>({url:item})) : []
-			  })
-		  	  res.data.withdrawalOrderItems.forEach(item=>{
-		  	  	this.totalAmount += item.totalPrice
-		  	  	this.workerAmount += item.workerAmount
-		  	  	this.websitAmount += item.websitAmount
-		  	  })
-		  	  this.formDialogType = 1
-		  	  this.openForm()
-		  	})
-		  }}>设为已发</el-button>:null}
-		  
-        </div>
-      )
-    },
-	update(id){
-		if(this.formData.certImg.length == 0){
-			return this.$message.warning('请先上传转账凭证！');
-		}
-		this.$confirm('请确认是否设为已发放, 是否继续?', '提示', {
-			confirmButtonText: '确定',
-			cancelButtonText: '取消',
-			type: 'warning'
-		}).then(() => {
-			update({ id, certImg: this.formData.certImg.map(item=>item.url).join(",") }).then(res => {
-			  if (res.code == 200) {
-			  	this.$message({ type: 'success', message: '设为已发放成功!' })
-				this.formDialog = false
-			  	this.$refs.pageRef.refreshList()
-			  } 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.id }).then(res => {
+							Object.assign(this.formData, res.data, {
+								certImg: res.data?.certImg ? res.data?.certImg?.split(",").map(item => ({ url: item })) : []
+							})
+							res.data.withdrawalOrderItems.forEach(item => {
+								this.totalAmount += item.totalPrice
+								this.workerAmount += item.workerAmount
+								this.websitAmount += item.websitAmount
+							})
+							this.formDialogType = 1
+							this.openForm()
+						})
+					}
+				},
+				setSent: {
+					conditions: ({ row, index, column }) => {
+						return row.status == 0
+					},
+					click: ({ row, index, column }) => {
+						this.totalAmount = 0
+						this.workerAmount = 0
+						this.websitAmount = 0
+						getDetail({ id: row.id }).then(res => {
+							Object.assign(this.formData, res.data, {
+								certImg: res.data?.certImg ? res.data?.certImg?.split(",").map(item => ({ url: item })) : []
+							})
+							res.data.withdrawalOrderItems.forEach(item => {
+								this.totalAmount += item.totalPrice
+								this.workerAmount += item.workerAmount
+								this.websitAmount += item.websitAmount
+							})
+							this.formDialogType = 1
+							this.openForm()
+						})
+					}
+				}
 			})
-		});
-	},
-  }
+		},
+
+		update(id) {
+			if (this.formData.certImg.length == 0) {
+				return this.$message.warning('请先上传转账凭证！');
+			}
+			this.$confirm('请确认是否设为已发放, 是否继续?', '提示', {
+				confirmButtonText: '确定',
+				cancelButtonText: '取消',
+				type: 'warning'
+			}).then(() => {
+				update({ id, certImg: this.formData.certImg.map(item => item.url).join(",") }).then(res => {
+					if (res.code == 200) {
+						this.$message({ type: 'success', message: '设为已发放成功!' })
+						this.formDialog = false
+						this.$refs.pageRef.refreshList()
+					} 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>