stage：发薪账户、合作机构合同展示

src/views/business/salaryAccount/taxSignComponent.vue

@@ -6,7 +6,8 @@
       </el-form-item>
       <el-form-item label="签约状态" prop="signStatus">
         <el-select v-model="queryParams.signStatus" placeholder="请选择签约状态" clearable @change="handleQuery">
-          <el-option v-for="dict in dict.type.tax_labor_sign_status" :key="dict.value" :label="dict.label" :value="dict.value" />
+          <el-option v-for="dict in dict.type.tax_labor_sign_status" :key="dict.value" :label="dict.label"
+            :value="dict.value" />
         </el-select>
       </el-form-item>
       <el-form-item>
@@ -16,36 +17,31 @@
     </el-form>
 
     <el-table v-loading="loading" :data="unitInfoList">
-      <el-table-column type="selection" width="55" align="center"/>
-      <el-table-column label="代发企业" align="center" prop="unitName" fixed/>
-      <el-table-column label="机构代码" align="center" prop="unitCode" fixed/>
-      <el-table-column label="所属地址" align="center" prop="address"/>
-      <el-table-column label="所属行业" align="center" prop="sectorDictDataVal"/>
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="代发企业" align="center" prop="unitName" fixed />
+      <el-table-column label="机构代码" align="center" prop="unitCode" fixed />
+      <el-table-column label="所属地址" align="center" prop="address" />
+      <el-table-column label="所属行业" align="center" prop="sectorDictDataVal" />
       <el-table-column label="可开票类型" align="center" prop="invoiceTypes">
         <template slot-scope="scope">
-          <dict-tag style="margin-top: 3px" v-for="(item, index) in scope.row.invoiceTypes.split(',')"
-                    :options="dict.type.tax_invoice_type" :value="item"
-          />
+          <dict-tag style="margin-top: 3px" v-for="(item, index) in scope.row.invoiceTypes.split(',')" :key="index"
+            :options="dict.type.tax_invoice_type" :value="item" />
         </template>
       </el-table-column>
-      <el-table-column label="月开票额度" align="center" prop="invoiceLimit"/>
-      <el-table-column label="联系人" align="center" prop="legalPersonName"/>
-      <el-table-column label="联系电话" align="center" prop="legalPersonMobile"/>
+      <el-table-column label="月开票额度" align="center" prop="invoiceLimit" />
+      <el-table-column label="联系人" align="center" prop="legalPersonName" />
+      <el-table-column label="联系电话" align="center" prop="legalPersonMobile" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="toSign(scope.row)"
-            v-hasPermi="['business:laborSign:add']"
-          >签约
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="toSign(scope.row)"
+            v-hasPermi="['business:laborSign:add']">签约
           </el-button>
         </template>
       </el-table-column>
     </el-table>
     <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
-                @pagination="getList" />
+      @pagination="getList" />
+
     <!-- 签约申请 -->
     <el-dialog title="签约申请" :visible.sync="signPanel" width="500px" append-to-body>
       <el-form ref="signForm" :model="signForm" :rules="signFormRules" label-width="80px">
@@ -54,8 +50,7 @@
         </el-form-item>
         <el-form-item label="签约主体" prop="inviterName">
           <el-select v-model="signForm.inviterId" clearable placeholder="请选择发薪主体">
-            <el-option v-for="item in payerCompanyArr" :key="item.id" :label="item.companyName"
-                       :value="item.id">
+            <el-option v-for="item in payerCompanyArr" :key="item.id" :label="item.companyName" :value="item.id">
             </el-option>
           </el-select>
         </el-form-item>
@@ -65,6 +60,16 @@
         <el-button @click="signPanel = false">取 消</el-button>
       </div>
     </el-dialog>
+    <!-- 点击签约后查看合同 -->
+    <el-dialog title="签约合同" :visible.sync="signContractPanelVisible" append-to-body width="45%" center>
+      <iframe
+        src="http://admin.xinruit.com/stage-api/profile/upload/2025/04/17/2c90b129-f55c-48a7-9e13-86b48b3354ab.pdf"
+        frameborder="0" style="width: 100%;height:500px"></iframe>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="signContractPaneSubmit">确 定</el-button>
+        <el-button @click="signContractPanelCancel">取 消</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -107,7 +112,10 @@ export default {
         inviterId: [
           { required: true, message: "签约主体不能为空", trigger: "blur" }
         ],
-      }
+      },
+      /**查看签约合同参数 */
+      signContractPanelVisible: false,
+      toSignData: {}
     };
   },
   created() {
@@ -150,18 +158,28 @@ export default {
         this.signForm.taxUnitId = row.id
         this.signForm.taxUnitName = row.unitName
         this.signPanel = true
-      }).catch(() => {});
+      }).catch(() => { });
     },
-    submitSignForm() {
+    signContractPaneSubmit() {
       addLaborSign(this.signForm).then(resp => {
         if (200 === resp.code) {
           this.$modal.msgSuccess("操作成功！");
-          this.getList()
+          this.signContractPanelVisible = false;
+          this.signPanel = false
+          this.$emit('submitSignContract')
         }
-      }).finally(() => {
+      }).catch(() => {
+        this.signContractPanelVisible = false;
         this.signPanel = false
       })
+    },
+
+    signContractPanelCancel() {
+      this.signContractPanelVisible = false;
+    },
+    submitSignForm() {
+      this.signContractPanelVisible = true
     }
-  }
+  },
 };
 </script>

src/views/business/taxUnit/signList.vue

@@ -2,24 +2,16 @@
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px">
       <el-form-item label="企业名称" prop="inviterName">
-        <el-input
-          v-model="queryParams.inviterName"
-          placeholder="请输入合作企业名称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
+        <el-input v-model="queryParams.inviterName" placeholder="请输入合作企业名称" clearable
+          @keyup.enter.native="handleQuery" />
       </el-form-item>
       <el-form-item label="代发企业" prop="taxUnitName">
-        <el-input
-          v-model="queryParams.taxUnitName"
-          placeholder="请输入信用代码"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
+        <el-input v-model="queryParams.taxUnitName" placeholder="请输入信用代码" clearable @keyup.enter.native="handleQuery" />
       </el-form-item>
       <el-form-item label="签约状态" prop="signStatus">
         <el-select v-model="queryParams.signStatus" placeholder="请选择签约状态" clearable @change="handleQuery">
-          <el-option v-for="dict in dict.type.tax_labor_sign_status" :key="dict.value" :label="dict.label" :value="dict.value" />
+          <el-option v-for="dict in dict.type.tax_labor_sign_status" :key="dict.value" :label="dict.label"
+            :value="dict.value" />
         </el-select>
       </el-form-item>
       <el-form-item>
@@ -30,16 +22,16 @@
 
     <el-table v-loading="loading" :data="tableData">
       <el-table-column label="签约企业" align="center">
-        <el-table-column label="企业名称" align="center" prop="inviterName" fixed/>
-        <el-table-column label="机构代码" align="center" prop="inviterCode" fixed/>
-        <el-table-column label="联系人" align="center" prop="inviterUserName"/>
-        <el-table-column label="联系电话" align="center" prop="inviterUserMobile"/>
+        <el-table-column label="企业名称" align="center" prop="inviterName" fixed />
+        <el-table-column label="机构代码" align="center" prop="inviterCode" fixed />
+        <el-table-column label="联系人" align="center" prop="inviterUserName" />
+        <el-table-column label="联系电话" align="center" prop="inviterUserMobile" />
       </el-table-column>
       <el-table-column label="代发企业" align="center">
-        <el-table-column label="企业名称" align="center" prop="taxUnitName"/>
-        <el-table-column label="机构代码" align="center" prop="taxUnitCode"/>
-        <el-table-column label="联系人" align="center" prop="taxUnitUserName"/>
-        <el-table-column label="联系电话" align="center" prop="taxUnitUserMobile"/>
+        <el-table-column label="企业名称" align="center" prop="taxUnitName" />
+        <el-table-column label="机构代码" align="center" prop="taxUnitCode" />
+        <el-table-column label="联系人" align="center" prop="taxUnitUserName" />
+        <el-table-column label="联系电话" align="center" prop="taxUnitUserMobile" />
       </el-table-column>
       <el-table-column label="签约状态" align="center" prop="signStatus">
         <template slot-scope="scope">
@@ -48,35 +40,28 @@
       </el-table-column>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="doAgree(scope.row)"
-            v-if="scope.row.signStatus && 1 === scope.row.signStatus"
-            v-hasPermi="['business:laborSign:add']"
-          >签约合约
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="doAgree(scope.row)"
+            v-if="scope.row.signStatus && 1 === scope.row.signStatus" v-hasPermi="['business:laborSign:add']">签约合约
           </el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-lollipop"
-            @click="givePayAcc(scope.row)"
+          <el-button size="mini" type="text" icon="el-icon-lollipop" @click="givePayAcc(scope.row)"
             v-if="scope.row.signStatus && 2 === scope.row.signStatus && !scope.row.payAccNo"
-            v-hasPermi="['business:unitInfo:add']"
-          >分配账户
+            v-hasPermi="['business:unitInfo:add']">分配账户
           </el-button>
         </template>
       </el-table-column>
     </el-table>
-
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
+    <!-- 点击签约后查看合同 -->
+    <el-dialog title="签约合同" :visible.sync="doAgreePanelVisible" width="58%" center>
+      <iframe
+        src="http://admin.xinruit.com/stage-api/profile/upload/2025/04/17/2c90b129-f55c-48a7-9e13-86b48b3354ab.pdf"
+        frameborder="0" style="width: 100%;height:600px"></iframe>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="doAgreePanelSubmit">确 定</el-button>
+        <el-button @click="doAgreePanelCancel">取 消</el-button>
+      </div>
+    </el-dialog>
+    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+      @pagination="getList" />
   </div>
 </template>
 
@@ -102,8 +87,13 @@ export default {
         pageNum: 1,
         pageSize: 10,
         inviterName: null,
-        taxUnitName: null
-      }
+        taxUnitName: null,
+
+      },
+      /** 合同查看弹窗 */
+      doAgreeData: {},
+      /** 合同查看弹窗 */
+      doAgreePanelVisible: false,
     }
   },
   created() {
@@ -136,18 +126,26 @@ export default {
       }, `unitInfo_${new Date().getTime()}.xlsx`)
     },
     doAgree(row) {
-      this.$confirm(`确认签订与${row.inviterName}的合约吗？`, '操作提示', {
+      this.doAgreeData = row
+      this.doAgreePanelVisible = true
+    },
+    doAgreePanelSubmit() {
+      this.$confirm(`确认签订与${doAgreeData.inviterName}的合约吗？`, '操作提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
       }).then(() => {
-        agreeSign(row.id).then(resp => {
+        agreeSign(doAgreeData.id).then(resp => {
           if (200 === resp.code) {
             this.$modal.msgSuccess("操作成功")
+            this.doAgreePanelVisible = false
             this.getList()
           }
         })
-      }).catch(() => {});
+      }).catch(() => { });
+    },
+    doAgreePanelCancel() {
+      this.doAgreePanelVisible = false
     },
     givePayAcc(row) {
       this.$confirm(`确认给[${row.inviterName}]分配付款专户吗？`, '操作提示', {
@@ -173,7 +171,7 @@ export default {
             }
           }
         })
-      }).catch(() => {});
+      }).catch(() => { });
     }
   }
 }