财务中心-应付账款提现申请增加领取后直接付款弹窗

src/views/payCredit/index.vue

@@ -60,7 +60,8 @@
             <span>提现金额总计: {{ totalAmount || 0 }}</span>
           </el-col>
         </el-form>
-        <el-table :data="firstData4" height="calc(100% - 218px)" style="width: 100%; margin-top: 20px;" highlight-current-row>
+        <el-table :data="firstData4" height="calc(100% - 218px)" style="width: 100%; margin-top: 20px;"
+          highlight-current-row>
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="mobile" label="业务员工号"></el-table-column>
           <el-table-column prop="attrType" label="业务员类型">
@@ -150,7 +151,8 @@
             <span>提现金额总计: {{ totalAmount || 0 }}</span>
           </el-col>
         </el-form>
-        <el-table :data="firstData1" height="calc(100% - 218px)" style="width: 100%; margin-top: 20px;" highlight-current-row>
+        <el-table :data="firstData1" height="calc(100% - 218px)" style="width: 100%; margin-top: 20px;"
+          highlight-current-row>
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="mobile" label="业务员工号"></el-table-column>
           <el-table-column prop="attrType" label="业务员类型">
@@ -249,7 +251,8 @@
             <span>提现金额总计: {{ totalAmount || 0 }}</span>
           </el-col>
         </el-form>
-        <el-table :data="firstData2" height="calc(100% - 218px)" style="width: 100%; margin-top: 20px;" highlight-current-row>
+        <el-table :data="firstData2" height="calc(100% - 218px)" style="width: 100%; margin-top: 20px;"
+          highlight-current-row>
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="mobile" label="业务员工号"></el-table-column>
           <el-table-column prop="attrType" label="业务员类型">
@@ -336,7 +339,8 @@
             <span>提现金额总计: {{ totalAmount || 0 }}</span>
           </el-col>
         </el-form>
-        <el-table :data="firstData3" height="calc(100% - 218px)" style="width: 100%; margin-top: 20px;" highlight-current-row>
+        <el-table :data="firstData3" height="calc(100% - 218px)" style="width: 100%; margin-top: 20px;"
+          highlight-current-row>
           <el-table-column prop="name" label="业务员"></el-table-column>
           <el-table-column prop="mobile" label="业务员工号"></el-table-column>
           <el-table-column prop="attrType" label="业务员类型">
@@ -378,17 +382,17 @@
           </el-upload>
         </el-form-item>
         <el-form-item prop="accountName" label="付款账户">
-          <el-input placeholder="请填入"  v-model="drawForm.accountName"  @click="payAccount" :readonly="true" clearable />
+          <el-input placeholder="请填入" v-model="drawForm.accountName" @click="payAccount" :readonly="true" clearable />
         </el-form-item>
       </el-form>
       <template #footer>
-        <el-popconfirm class="box-item" title="确定放弃付款？" placement="top" @confirm="handleConfirm">
+        <!-- <el-popconfirm class="box-item" title="确定放弃付款？" placement="top" @confirm="handleConfirm">
           <template #reference>
             <el-button plain>退回任务</el-button>
           </template>
-        </el-popconfirm>
+  </el-popconfirm> -->
         <el-button class="border-[#0083FF] color-[#0083FF]" plain @click="handleCancelVerifyAmount">取消</el-button>
-        <el-button type="primary" @click="handleVerifyAmount">确定</el-button>
+        <el-button type="primary" @click="handleVerifyAmount(DrawRef)">确定</el-button>
       </template>
     </el-dialog>
     <el-dialog :close-on-click-modal="false" v-model="payAccountShow" title="付款账户" width="800">
@@ -400,8 +404,9 @@
           <el-button type="primary" @click="accountSearch">查询</el-button>
         </el-col>
       </el-row>
-      <el-table ref="AccountRef" row-key="id" style="margin: 24px 0; max-height: 400px" @current-change="handleCurrentChange" @row-dblclick="handleSelectedRow"
-        :data="accountData" highlight-current-row>
+      <el-table ref="AccountRef" row-key="id" style="margin: 24px 0; max-height: 400px"
+        @current-change="handleCurrentChange" @row-dblclick="handleSelectedRow" :data="accountData"
+        highlight-current-row>
         <el-table-column prop="bankCardNum" label="银行卡号"></el-table-column>
         <el-table-column prop="bankNum" label="开户行"></el-table-column>
         <el-table-column prop="bankCardNum" label="开户行号"></el-table-column>
@@ -421,10 +426,9 @@
 
 <script setup lang="ts">
 import api from '@/api'
-import { ElMessage } from "element-plus";
-
+import { ElMessage, FormInstance } from "element-plus";
+const DrawRef = ref<FormInstance>()
 let AccountRef = ref()
-let accountNameRef = ref()
 let RefusePopover = ref()
 const type = ref('3')
 let activeName = ref('3')
@@ -517,6 +521,7 @@ const handleDraw = (row) => {
             initData('2')
             initData('3')
             drawForm.value.id = row.id
+            drawShow.value = true
           } else {
 
           }
@@ -630,10 +635,10 @@ let payAccountShow = ref(false)
 let account = ref('')
 let accountData = ref([])
 let selectItem = ref(null)
-const handleCurrentChange = ( row:any) => {
+const handleCurrentChange = (row: any) => {
   selectItem.value = row
-    AccountRef.value.clearSelection()
-    AccountRef.value.toggleRowSelection(row);
+  AccountRef.value.clearSelection()
+  AccountRef.value.toggleRowSelection(row);
 }
 const handleSelectedRow = (row: any) => {
   selectItem.value = row
@@ -676,22 +681,31 @@ const handleCancelVerifyAmount = () => {
   }
   drawShow.value = false
 }
-const handleVerifyAmount = () => {
-  api.financeApi.verifyAmount({
-    id: drawForm.value.id,
-    voucherId: drawForm.value.voucherId,
-    picId: drawForm.value.picId,
-    cardId: drawForm.value.accountId,
-  }).then((res: any) => {
-    if (res.code == 200) {
-      ElMessage({
-        message: res.msg,
-        type: 'success'
+const handleVerifyAmount = async (formRef: FormInstance | undefined) => {
+  if (!formRef) return
+  await formRef.validate((valid) => {
+    if (valid) {
+      api.financeApi.verifyAmount({
+        id: drawForm.value.id,
+        voucherId: drawForm.value.voucherId,
+        picId: drawForm.value.picId,
+        cardId: drawForm.value.accountId,
+      }).then((res: any) => {
+        if (res.code == 200) {
+          ElMessage({
+            message: res.msg,
+            type: 'success'
+          })
+          drawShow.value = false
+          initData('0')
+          initData('1')
+          initData('2')
+          initData('3')
+        }
       })
-      drawShow.value = false
-      initData(activeName.value)
     }
   })
+
 }
 const handleConfirm = () => {
   api.financeApi.amountAuditCancel(drawForm.value.id).then((res: any) => {
@@ -792,11 +806,13 @@ onMounted(() => {
 :deep(.el-badge__content--danger) {
   background-color: #D40000;
 }
+
 :deep(.el-upload-dragger) {
   padding: unset;
   border: unset;
   border-radius: unset;
 }
+
 /* 自定义表格点击高亮颜色 */
 :deep(.el-table__body tr.current-row > td) {
   background-color: #c1e8fa !important;

src/views/payCredit/myTask.vue

@@ -249,7 +249,7 @@
           </template>
         </el-popconfirm>
         <el-button class="border-[#0083FF] color-[#0083FF]" plain @click="handleCancelVerifyAmount">取消</el-button>
-        <el-button type="primary" @click="handleVerifyAmount">确定</el-button>
+        <el-button type="primary" @click="handleVerifyAmount(DrawRef)">确定</el-button>
       </template>
     </el-dialog>
     <el-dialog :close-on-click-modal="false" v-model="payAccountShow" title="付款账户" width="800">
@@ -282,8 +282,9 @@
 
 <script setup lang="ts">
 import api from '@/api'
-import { ElMessage } from 'element-plus'
+import { ElMessage, FormInstance } from 'element-plus'
 let AccountRef = ref()
+const DrawRef = ref<FormInstance>()
 
 const refuseReason = ref('')
 let activeName = ref('0')
@@ -348,6 +349,7 @@ let drawRules = ref({
   picId: [{ required: true, trigger: "change", message: "请输入" }]
 })
 const handlePay = (row) => {
+  console.log(row)
   drawForm.value = {
     voucherId: '',
     picId: '',
@@ -443,24 +445,30 @@ const handleCancelVerifyAmount = () => {
   }
   drawShow.value = false
 }
-const handleVerifyAmount = () => {
-  api.financeApi.verifyAmount({
-    id: drawForm.value.id,
-    voucherId: drawForm.value.voucherId,
-    picId: drawForm.value.picId,
-    cardId: drawForm.value.accountId,
-  }).then((res: any) => {
-    if (res.code == 200) {
-      ElMessage({
-        message: res.msg,
-        type: 'success'
+const handleVerifyAmount = async (formRef: FormInstance | undefined) => {
+  if (!formRef) return
+  await formRef.validate((valid) => {
+    if (valid) {
+      api.financeApi.verifyAmount({
+        id: drawForm.value.id,
+        voucherId: drawForm.value.voucherId,
+        picId: drawForm.value.picId,
+        cardId: drawForm.value.accountId,
+      }).then((res: any) => {
+        if (res.code == 200) {
+          ElMessage({
+            message: res.msg,
+            type: 'success'
+          })
+          drawShow.value = false
+          initData('0')
+          initData('1')
+          initData('2')
+        }
       })
-      drawShow.value = false
-      initData('0')
-      initData('1')
-      initData('2')
     }
   })
+
 }
 
 
@@ -580,6 +588,7 @@ onMounted(() => {
   display: flex;
   justify-content: flex-end;
 }
+
 :deep(.el-badge__content.is-fixed) {
   right: calc(var(--el-badge-size) / 2 - 10px);
   top: 50%;