合伙人bug

src/views/partnerManagement/partner.vue

@@ -260,7 +260,7 @@ const detailPartner = (item: any) => {
   router.push({
     path: '/PartnerManagement/partnerDetail',
     query: {
-      userId: item.userId,
+      id: item.userId,
     }
   })
 }

src/views/partnerManagement/partnerDetail.vue

@@ -1,179 +1,233 @@
 <template>
-  <div class="detail">
-    <div class="state" v-if="dataDetail?.status == 5">
-      <el-icon :size="20" style="color: red; margin: 3px 10px 0 0;">
-        <CircleClose />
-      </el-icon>
-      <div>
-        <h3>审核不通过</h3>
-        <p>{{ dataDetail?.approvalOpinion }}如有问题，请联系审核人员或者拨打客服电话400-400-400。</p>
-        <el-button link type="primary" @click="editDetail">修改并重提交</el-button>
+  <PageMain class="vh100">
+    <div class="flex flex-col h-[calc(100%+40px)] bg-[#f5f8ff] m-[-1.5rem_-1.5rem] overflow-hidden">
+      <div class="state-box" v-if="dataDetail?.status === 5">
+        <div class="state">
+          <el-icon :size="20" style="color: red; margin: 3px 10px 0 0;">
+            <CircleClose />
+          </el-icon>
+          <div>
+            <h3>审核不通过</h3>
+            <p>{{ dataDetail?.approvalOpinion }}如有问题，请联系审核人员或者拨打客服电话400-400-400。</p>
+            <el-button link type="primary" @click="editDetail">修改并重提交</el-button>
+          </div>
+        </div>
       </div>
-    </div>
-    <div class="info">
-      <el-descriptions>
-        <template #title>
-          <el-row :gutter="20" flex justify="space-between">
-            <el-col :span="12" style="display: flex; align-items: center;">
-              <span class="firstName">{{ initName(dataDetail?.name) }}</span>
-              <span class="allName">{{ dataDetail?.name }}</span>
-            </el-col>
-          </el-row>
-        </template>
-        <el-descriptions-item label="工号：" width="33%">{{ dataDetail?.userId }}</el-descriptions-item>
-        <el-descriptions-item label="所属机构：" width="33%">{{ dataDetail?.deptName }}</el-descriptions-item>
-        <el-descriptions-item label="状态：" width="33%">{{  statusMap(dataDetail?.status)}}</el-descriptions-item>
-        <el-descriptions-item label="合伙人等级" width="33%">{{ gradeMap(dataDetail?.gradeList) }}</el-descriptions-item>
-        <el-descriptions-item label="类型：" width="33%">{{ typeAttrMap(dataDetail?.partnerTypeAttr) }}</el-descriptions-item>
-        <el-descriptions-item label="创建人：" width="33%">{{ dataDetail?.updateBy }}</el-descriptions-item>
-        <el-descriptions-item label="创建时间：" width="33%">{{ dataDetail?.createTime }}</el-descriptions-item>
-      </el-descriptions>
-    </div>
-    <div class="message">
-      <el-tabs v-model="activeName" class="demo-tabs" @tab-click="(tab) => { activeName = tab }">
-        <el-tab-pane label="基本信息" name="msg" style="padding: 0 24px">
-          <div class="other">
-            <el-descriptions title="个人信息">
-              <el-descriptions-item label="姓名：" width="33%">{{ dataDetail?.name }}</el-descriptions-item>
-              <el-descriptions-item label="手机号：" width="33%">{{ dataDetail?.mobile }}</el-descriptions-item>
-              <el-descriptions-item label="证件号：" width="33%">{{ dataDetail?.identity }}</el-descriptions-item>
-              <el-descriptions-item label="证件有效期始：" width="33%">{{ dataDetail?.identityTimeStart }}</el-descriptions-item>
-              <el-descriptions-item label="证件有效期止：" width="33%">{{ dataDetail?.identityTimeEnd }}</el-descriptions-item>
-            </el-descriptions>
-            <el-descriptions title="其他信息">
-              <el-descriptions-item>
-                <template #default>
-                  <el-row :gutter="20">
-                    <el-col :span="12" class="mb-5">
-                      管理人：{{ dataDetail?.leaderName }}
-                    </el-col>
-                    <el-col :span="12" class="mb-5">
-                      管理人工号：{{ dataDetail?.leaderId }}
-                    </el-col>
-                    <el-col :span="12" class="mb-5">
-                      推荐人：{{ dataDetail?.referrerName }}
-                    </el-col>
-                    <el-col :span="12" class="mb-5">
-                      推荐人工号：{{ dataDetail?.referrerId }}
-                    </el-col>
-                  </el-row>
+      <div class="bg-[#f5f8ff]" :class="dataDetail?.status !== 5 ? 'h-full' : 'h-[calc(100%-105px)]'">
+        <div class="info">
+          <div class="flex items-start justify-between">
+            <div class="flex items-center">
+              <el-avatar :size="100" src="">
+                <div class="bg-[#00a0f4] w-full h-full line-height-100px font-size-48px">
+                  {{ initName(dataDetail?.name) }}
+                </div>
+              </el-avatar>
+              <div class="flex flex-col items-start justify-center m-l-16px">
+                <div class="font-size-20px line-height-[1] color-[#333] font-600 m-b-12px">
+                  {{ dataDetail?.name }}
+                </div>
+                <el-tag class="m-t-12px" :type="setStatusObj(dataDetail?.status)?.type">{{
+                  setStatusObj(dataDetail?.status)?.label }}</el-tag>
+              </div>
+            </div>
+            <div class="flex">
+              <el-button class="bg-white" style="border-radius: 2px" plain type="primary" @click="checkPass"
+                v-if="dataDetail?.status == 0 || dataDetail?.status == 1 || dataDetail?.status == 2 || dataDetail?.status == 3">审核通过</el-button>
+              <el-button class="bg-white" style="border-radius: 2px" plain type="primary" @click="checkNotPass"
+                v-if="dataDetail?.status != 5 && dataDetail?.status != 6 && dataDetail?.status != 7 && dataDetail?.status != 8">审核不通过</el-button>
+              <el-button class="bg-white" style="border-radius: 2px" plain type="primary"
+                @click="editDetail">编辑</el-button>&nbsp;
+              <el-dropdown trigger="click" @command="handleCommand">
+                <el-button class="bg-white" style="border-radius: 2px" plain type="primary">更多</el-button>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item command="启用">启用</el-dropdown-item>
+                    <el-dropdown-item command="禁用">禁用</el-dropdown-item>
+                    <el-dropdown-item command="删除">删除</el-dropdown-item>
+                    <el-dropdown-item command="分配管理人">分配管理人</el-dropdown-item>
+                  </el-dropdown-menu>
                 </template>
-              </el-descriptions-item>
-            </el-descriptions>
-            <el-descriptions title="银行卡信息">
-              <el-descriptions-item>
-                <template #default>
-                  <el-table
-                    :data="dataDetail?.bankCardList"
-                    height="200"
-                  >
-                    <el-table-column prop="name" label="姓名"></el-table-column>
-                    <el-table-column prop="bankName" label="开户行">
-                      <template #default="scope">
-                        {{ bankCardChange(bankOption, scope.row.bankName) }}
-                      </template>
-                    </el-table-column>
-                    <el-table-column prop="bankCardNumber" label="卡号"></el-table-column>
-                    <el-table-column prop="bankAddress" label="开户支行"></el-table-column>
-                    <el-table-column prop="auditStatus" label="审核状态">
-                      <template #default="scope">
-                        {{ scope.row.auditStatus == '0'?'未审核':scope.row.auditStatus == '1'?'审核通过':scope.row.auditStatus == '2'?'审核驳回':''}}
-                      </template>
-                    </el-table-column>
-                    <el-table-column prop="" label="身份证件照片">
-                      <template #default="scope">
-<!--                        <img class="cardImage" :src="dataDetail?.fileList.length>0?dataDetail?.fileList?.[0].fileUrl:''">-->
-                          {{ dataDetail?.fileList.length>0?`${dataDetail?.fileList?.length}张`: '暂无' }}
-                      </template>
-                    </el-table-column>
-                    <el-table-column prop="cardFile" label="银行卡照片">
-                      <template #default="scope">
-<!--                        <img class="cardImage" :src="scope.row.cardFile">-->
-                          {{ scope.row.cardFileUrl?`1张`: '暂无' }}
-                      </template>
-                    </el-table-column>
-                    <el-table-column label="操作">
-                      <template #default="scope">
-                        <a style="color: #409EFF; cursor: pointer" @click="editBankCard(scope.row)">详情</a>
-                      </template>
-                    </el-table-column>
-                  </el-table>
-                </template>
-              </el-descriptions-item>
-            </el-descriptions>
-            <el-button class="bg-white" plain type="primary" icon="plus" style="width: 100%; border-radius: 2px" @click="addBankCard">添加银行卡</el-button>
+              </el-dropdown>
+            </div>
           </div>
-        </el-tab-pane>
-        <el-tab-pane label="资料附件" name="file" style="padding: 0 24px">
-          <div class="other">
-            <el-descriptions title="资料附件">
-              <el-descriptions-item>
-                <template #default>
-                  <div class="fileItem" v-if="imageChangeName('sfz1')">
-                    <span class="label">身份证（人像面）</span>
-                    <div class="fileName">
-                      <span class="file-name">{{ imageChangeName('sfz1') }}</span>
-                      <el-icon class="file-icon" @click="imageView('sfz1')"><View/></el-icon>
+          <el-descriptions class="m-t-18px">
+            <el-descriptions-item label="工号：" width="33%">{{ dataDetail?.userId }}</el-descriptions-item>
+            <el-descriptions-item label="所属机构：" width="33%">{{ dataDetail?.deptName }}</el-descriptions-item>
+            <el-descriptions-item label="类型：" width="33%">{{ typeAttrMap(dataDetail?.typeAttr) }}</el-descriptions-item>
+            <el-descriptions-item label="合伙人等级：" width="33%">{{ gradeMap(dataDetail?.gradeList) }}</el-descriptions-item>
+            <el-descriptions-item label="所属团队：" width="33%">{{ dataDetail?.organizationName }}</el-descriptions-item>
+            <el-descriptions-item label="创建人：" width="33%">{{ dataDetail?.updateBy }}</el-descriptions-item>
+            <el-descriptions-item label="创建时间：" width="33%">{{ dataDetail?.createTime }}</el-descriptions-item>
+          </el-descriptions>
+        </div>
+        <div class="message h-[calc(100%-224px)]">
+          <el-tabs v-model="activeName" class="demo-tabs h-full" @tab-click="(tab) => { activeName = tab }">
+            <el-tab-pane label="基本信息" name="msg" class=" h-full overflow-auto" style="padding: 0 24px">
+              <el-descriptions title="个人信息">
+                <el-descriptions-item label="姓名：" width="33%">{{ dataDetail?.name }}</el-descriptions-item>
+                <el-descriptions-item label="手机号：" width="33%">{{ dataDetail?.mobile }}</el-descriptions-item>
+                <el-descriptions-item label="证件号：" width="33%">{{ dataDetail?.identity }}</el-descriptions-item>
+                <el-descriptions-item label="证件有效期始：" width="33%">{{ dataDetail?.identityTimeStart
+                  }}</el-descriptions-item>
+                <el-descriptions-item label="证件有效期止：" width="33%">{{ dataDetail?.identityTimeEnd
+                  }}</el-descriptions-item>
+              </el-descriptions>
+              <el-descriptions title="其他信息">
+                <el-descriptions-item label="管理人：" width="33%">{{ dataDetail?.leaderName }}</el-descriptions-item>
+                <el-descriptions-item label="管理人工号：" width="33%">{{ dataDetail?.leaderId }}</el-descriptions-item>
+                <el-descriptions-item label="推荐人：" width="33%">{{ dataDetail?.referrerName }}</el-descriptions-item>
+                <el-descriptions-item label="推荐人工号：" width="33%">{{ dataDetail?.referrerId }}</el-descriptions-item>
+              </el-descriptions>
+              <el-descriptions title="银行卡信息">
+                <el-descriptions-item>
+                  <template #default>
+                    <el-table :data="dataDetail?.bankCardList" height="300">
+                      <el-table-column prop="name" label="姓名"></el-table-column>
+                      <el-table-column prop="bankName" label="开户行"></el-table-column>
+                      <el-table-column prop="bankCardNumber" label="卡号"></el-table-column>
+                      <el-table-column prop="bankAddress" label="开户支行"></el-table-column>
+                      <el-table-column prop="auditStatus" label="审核状态">
+                        <template #default="scope">
+                          {{ scope.row.auditStatus == '0' ? '未审核' : scope.row.auditStatus == '1' ? '审核通过' :
+                            scope.row.auditStatus
+                              == '2' ? '审核驳回' : '' }}
+                        </template>
+                      </el-table-column>
+                      <el-table-column label="操作">
+                        <template #default="scope">
+                          <el-button link type="primary" @click="editBankCard(scope.row)">详情</el-button>
+                        </template>
+                      </el-table-column>
+                    </el-table>
+                  </template>
+                </el-descriptions-item>
+              </el-descriptions>
+              <el-button class="bg-white" plain type="primary" icon="plus" style="width: 100%; border-radius: 2px"
+                @click="addBankCard">添加银行卡</el-button>
+            </el-tab-pane>
+            <el-tab-pane label="资料附件" name="file" class=" h-full overflow-auto" style="padding: 0 24px">
+              <el-descriptions title="资料附件">
+                <el-descriptions-item>
+                  <template #default>
+                    <div class="fileItem" v-if="imageChangeName('sfz1')">
+                      <span class="label">身份证（人像面）</span>
+                      <div class="fileName">
+                        <span class="file-name">{{ imageChangeName('sfz1') }}</span>
+                        <el-icon class="file-icon" @click="imageView('sfz1')">
+                          <View />
+                        </el-icon>
+                        <el-icon class="file-icon" @click="downloadImage('sfz1')">
+                          <Download />
+                        </el-icon>
+                      </div>
                     </div>
-                  </div>
-                  <div class="fileItem" v-if="imageChangeName('sfz2')">
-                    <span class="label">身份证（国徽面）</span>
-                    <div class="fileName">
-                      <span class="file-name">{{ imageChangeName('sfz2') }}</span>
-                      <el-icon class="file-icon" @click="imageView('sfz2')"><View /></el-icon>
+                    <div class="fileItem" v-if="imageChangeName('sfz2')">
+                      <span class="label">身份证（国徽面）</span>
+                      <div class="fileName">
+                        <span class="file-name">{{ imageChangeName('sfz2') }}</span>
+                        <el-icon class="file-icon" @click="imageView('sfz2')">
+                          <View />
+                        </el-icon>
+                        <el-icon class="file-icon" @click="downloadImage('sfz2')">
+                          <Download />
+                        </el-icon>
+                      </div>
                     </div>
-                  </div>
-                  <div class="fileItem" v-if="imageChangeName('qualification')">
-                    <span class="label">展业资格证</span>
-                    <div class="fileName">
-                      <span class="file-name">{{ imageChangeName('qualification') }}</span>
-                      <el-icon class="file-icon" @click="imageView('qualification')"><View /></el-icon>
+                    <div class="fileItem" v-if="imageChangeName('qualification')">
+                      <span class="label">展业资格证</span>
+                      <div class="fileName">
+                        <span class="file-name">{{ imageChangeName('qualification') }}</span>
+                        <el-icon class="file-icon" @click="imageView('qualification')">
+                          <View />
+                        </el-icon>
+                        <el-icon class="file-icon" @click="downloadImage('qualification')">
+                          <Download />
+                        </el-icon>
+                      </div>
                     </div>
-                  </div>
-                </template>
-              </el-descriptions-item>
-            </el-descriptions>
-          </div>
-        </el-tab-pane>
-      </el-tabs>
+
+                    <div class="fileItem" v-if="imageChangeName('contract')">
+                      <span class="label">劳动合同</span>
+                      <div class="fileName">
+                        <span class="file-name">{{ imageChangeName('contract') }}</span>
+                        <el-icon class="file-icon" @click="imageView('contract')">
+                          <View />
+                        </el-icon>
+                        <el-icon class="file-icon" @click="downloadImage('contract')">
+                          <Download />
+                        </el-icon>
+                      </div>
+                    </div>
+                    <div class="fileItem" v-if="imageChangeName('applicant')">
+                      <span class="label">应聘表</span>
+                      <div class="fileName">
+                        <span class="file-name">{{ imageChangeName('applicant') }}</span>
+                        <el-icon class="file-icon" @click="imageView('applicant')">
+                          <View />
+                        </el-icon>
+                        <el-icon class="file-icon" @click="downloadImage('applicant')">
+                          <Download />
+                        </el-icon>
+                      </div>
+                    </div>
+                    <div class="fileItem" v-if="imageChangeName('salaryTable')">
+                      <span class="label">定薪表</span>
+                      <div class="fileName">
+                        <span class="file-name">{{ imageChangeName('salaryTable') }}</span>
+                        <el-icon class="file-icon" @click="imageView('salaryTable')">
+                          <View />
+                        </el-icon>
+                        <el-icon class="file-icon" @click="downloadImage('salaryTable')">
+                          <Download />
+                        </el-icon>
+                      </div>
+                    </div>
+                    <div class="fileItem" v-if="imageChangeName('leaveTable')">
+                      <span class="label">离职表</span>
+                      <div class="fileName">
+                        <span class="file-name">{{ imageChangeName('leaveTable') }}</span>
+                        <el-icon class="file-icon" @click="imageView('leaveTable')">
+                          <View />
+                        </el-icon>
+                        <el-icon class="file-icon" @click="downloadImage('leaveTable')">
+                          <Download />
+                        </el-icon>
+                      </div>
+                    </div>
+                  </template>
+                </el-descriptions-item>
+              </el-descriptions>
+            </el-tab-pane>
+          </el-tabs>
+        </div>
+      </div>
     </div>
-    <el-dialog
-      v-model="bankCardDialogShow"
-      :title="bankTitle"
-      width="500"
-    >
-      <addCard @closeDialog="closeAddBankCard" :userInfo="bankCardInfo"></addCard>
-    </el-dialog>
-    <el-dialog
-      v-model="dialogShow"
-      title="编辑"
-      width="1000"
-    >
-      <addOperation ref="AddOperationRef" @closeDialog="closeAddOperation"></addOperation>
+    <el-dialog v-model="bankCardDialogShow" :title="bankTitle" width="500">
+      <addCard v-if="bankCardDialogShow" @closeDialog="closeAddBankCard" :userInfo="bankCardInfo"></addCard>
     </el-dialog>
-    <el-dialog
-      v-model="allocationShow"
-      title="分配管理人"
-      width="800"
-    >
+    <el-dialog v-model="allocationShow" title="分配管理人" width="800">
       <allocation ref="AllocationRef" @closeDialog="closeAllocation"></allocation>
     </el-dialog>
     <el-image-viewer v-if="imageShow" :url-list="[imageUrl]" @close="imageShow = false" />
-  </div>
+    <el-dialog title="文件预览" v-model="fileShow">
+      <vue-office-docx :src="fileUrl" style="height: 600px; margin: 0; padding: 0"></vue-office-docx>
+    </el-dialog>
+  </PageMain>
 </template>
 
 <script setup lang="ts">
-import {nextTick, ref} from 'vue'
+import { nextTick, ref } from 'vue'
+import addCard from './modules/addCard.vue'
 import pinyin from "js-pinyin";
 import { ElMessage, ElMessageBox } from 'element-plus'
 import Allocation from "@/views/operationManagement/modules/allocation.vue";
 import { useRoute, useRouter } from 'vue-router'
-import addCard from './modules/addCard.vue'
 import api from '@/api'
-import {OperationIsEnable} from "@/api/modules/operation.ts";
-import router from "@/router";
+import { OperationIsEnable } from "@/api/modules/operation.ts";
+import VueOfficeDocx from "@vue-office/docx";
+import { getDictItems } from "@/api/dict";
+
 
-let AddOperationRef = ref(null)
 const AllocationRef = ref(null)
 
 let myRouter = useRouter()
@@ -190,12 +244,12 @@ const handleCommand = (e) => {
         showCancelButton: true,
         confirmButtonText: '确定',
         cancelButtonText: '取消',
-      }).then(( action ) => {
-        if(action === 'confirm') {
+      }).then((action) => {
+        if (action === 'confirm') {
           let ids = [myRoute.query.id]
           operationDel(ids)
         }
-      }).catch(( action ) => {
+      }).catch((action) => {
 
       })
       break;
@@ -207,8 +261,8 @@ const handleCommand = (e) => {
         showCancelButton: true,
         confirmButtonText: '确定',
         cancelButtonText: '取消',
-      }).then(( action ) => {
-        if(action === 'confirm') {
+      }).then((action) => {
+        if (action === 'confirm') {
           let data = {
             ids: [myRoute.query.ids],
             isEnable: 1,
@@ -216,7 +270,7 @@ const handleCommand = (e) => {
           }
           operationIsEnable(data)
         }
-      }).catch(( action ) => {
+      }).catch((action) => {
 
       })
       break;
@@ -228,8 +282,8 @@ const handleCommand = (e) => {
         showCancelButton: true,
         confirmButtonText: '确定',
         cancelButtonText: '取消',
-      }).then(( action ) => {
-        if(action === 'confirm'){
+      }).then((action) => {
+        if (action === 'confirm') {
           let data = {
             ids: [myRoute.query.ids],
             isEnable: 0,
@@ -237,7 +291,7 @@ const handleCommand = (e) => {
           }
           operationIsEnable(data)
         }
-      }).catch(( action ) => {
+      }).catch((action) => {
 
       })
       break;
@@ -270,7 +324,7 @@ const statusMap = (value: any) => {
   return map[value]
 }
 //人员类型匹配
-const typeAttrMap=(value)=>{
+const typeAttrMap = (value) => {
   const map = {
     "1": '前线人员',
     "2": '后线人员',
@@ -278,21 +332,36 @@ const typeAttrMap=(value)=>{
     "4": '工作是管理员',
     "5": '团队',
     "6": '个代',
-    "7": '电销',
-    "8": '渠道',
+    "7": '渠道',
+    "8": '电销',
   }
   return map[value]
 }
-// 合伙人等级匹配
 const gradeMap = (value: any) => {
-  if(value == null) {
+  if (value == null) {
     return '未知'
-  }else{
+  } else {
     return value
-        .map((gradeId: any) => userGradeList.value.find((item: any) => item.grade == gradeId)?.gradeName || gradeId)
-        .join(',') || '未知';
+      .map((gradeId: any) => userGradeList.value.find((item: any) => item.grade == gradeId)?.gradeName || gradeId)
+      .join(',') || '未知';
   }
 }
+interface dictType {
+  value: string;
+  id: string;
+  label: string;
+
+  [property: string]: any;
+}
+const statusList = ref<dictType[]>([]);
+
+const setStatusObj = (status: number) => {
+  let type = "info";
+  if ([2, 5, 8].includes(status)) type = "danger";
+  if ([6].includes(status)) type = "primary";
+  const obj = statusList.value.find((v) => Number(v.value) === status);
+  return { ...obj, type };
+};
 
 // 银行卡列表数据
 // let tableData = ref([])
@@ -308,43 +377,49 @@ let bankCardDialogShow = ref(false)
 // 添加银行卡
 const addBankCard = () => {
   bankTitle.value = '添加银行卡'
-  bankCardDialogShow.value = true
   bankCardInfo.value = {
-    userJzgInfoId: dataDetail.value.id,
-    name: dataDetail.value.name,
+    userJzgInfoId: dataDetail.value?.id || '',
+    name: dataDetail.value?.name || '',
     isRead: false
   }
+  bankCardDialogShow.value = true
+
 }
 // 编辑银行卡
-const editBankCard = (row) => {
+const editBankCard = (row: any) => {
   bankTitle.value = '查看银行卡'
-  bankCardDialogShow.value = true
   bankCardInfo.value = {
     userJzgInfoId: dataDetail.value.id,
     name: dataDetail.value.name,
-    bankName: row.bankName,
-    bankCardNumber: row.bankCardNumber,
-    bankAddress: row.bankAddress,
-    attachment: row.cardFile,
-    imageUrl: row.cardFile,
-    isRead: true
+    isRead: true,
+    DetailInfo: row || {}
   }
+  bankCardDialogShow.value = true
+
 }
 // 关闭添加银行卡弹框
 const closeAddBankCard = (type: string) => {
-  if(type == '确定') {
+  if (type == '确定') {
     initDetail()
   }
   bankCardDialogShow.value = false
 }
-
+//获取合伙人等级
+let userGradeList = ref()
+const getGradeOptions = () => {
+  api.partnerApi.queryGradeName().then((res: any) => {
+    if (res.code === 200) {
+      userGradeList.value = res.data;
+    }
+  })
+}
 // 删除
 const operationDel = (id: string[]) => {
   api.operationApi.operationDelete({
     ids: id,
     getAll: 0
   }).then(res => {
-    if(res?.code == 200) {
+    if (res?.code == 200) {
       ElMessage({
         message: res.msg,
         type: 'success'
@@ -363,7 +438,7 @@ const operationDel = (id: string[]) => {
 // 启用/禁用
 const operationIsEnable = (data: OperationIsEnable) => {
   api.operationApi.operationIsEnable(data).then(res => {
-    if(res?.code == 200) {
+    if (res?.code == 200) {
       ElMessage({
         message: res.msg,
         type: 'success'
@@ -381,7 +456,7 @@ const operationIsEnable = (data: OperationIsEnable) => {
 // 审核通过
 const checkPass = () => {
   api.operationApi.salesmanAuthSuccess({ userInfoId: dataDetail.value.id }).then(res => {
-    if(res.code == 200) {
+    if (res.code == 200) {
       ElMessage({
         message: res.msg,
         type: 'success',
@@ -405,13 +480,13 @@ const checkNotPass = () => {
     showCancelButton: true,
     confirmButtonText: '确定',
     cancelButtonText: '取消',
-  }).then(({ value, action } ) => {
-    if(action == 'confirm') {
+  }).then(({ value, action }) => {
+    if (action == 'confirm') {
       api.operationApi.salesmanAuthFailed({
         userInfoId: dataDetail.value.id,
         approvalOpinion: value
       }).then(res => {
-        if(res.code == 200) {
+        if (res.code == 200) {
           ElMessage({
             message: res.msg,
             type: 'success',
@@ -425,7 +500,7 @@ const checkNotPass = () => {
         }
       })
     }
-  }).catch(( action ) => {
+  }).catch((action) => {
 
   })
 }
@@ -433,13 +508,17 @@ const checkNotPass = () => {
 // 编辑/修改
 let dialogShow = ref(false)
 const editDetail = () => {
-  dialogShow.value = true
-  nextTick(() => {
-    AddOperationRef.value.initEditData(dataDetail.value.userId, dataDetail.value.id)
+  myRouter.push({
+    path: '/operationManagement/operation/addOperation',
+    query: {
+      id: dataDetail.value.userId,
+      ids: dataDetail.value.id,
+      type: 'edit'
+    }
   })
 }
 const closeAddOperation = (text: string) => {
-  if(text == '确定') {
+  if (text == '确定') {
     initDetail()
   }
   dialogShow.value = false
@@ -447,33 +526,200 @@ const closeAddOperation = (text: string) => {
 
 // 附件转换
 const imageChangeName = (type) => {
-  if(dataDetail.value&&dataDetail.value.fileList.length>0) {
+  if (dataDetail.value && dataDetail.value.fileList.length > 0) {
     let obj = dataDetail.value.fileList.find(item => item.fileType === type)
     return obj?.fileName
   }
 }
 const imageChangeUrl = (type) => {
-  if(dataDetail.value.fileList.length>0) {
+  if (dataDetail.value.fileList.length > 0) {
     let obj = dataDetail.value.fileList.find(item => item.fileType == type)
     return obj?.fileUrl
   }
 }
-
+// 身份证人像面
+let IDCardFrontName = ref("");
+let IDCardFront = ref("");
+// 身份证国徽面
+let IDCardBackName = ref("");
+let IDCardBack = ref("");
+// 展业资格证
+let businessLicenseName = ref("");
+let businessLicense = ref("");
+// 劳务合同
+let contractName = ref("");
+let contract = ref("");
+// 应聘表
+let applicantName = ref("");
+let applicant = ref("");
+// 定薪表
+let decidePayName = ref("");
+let decidePay = ref("");
+// 离职表
+let dimissionName = ref("");
+let dimission = ref("");
 // 预览
 let imageUrl = ref('')
 let imageShow = ref(false)
-const imageView = (type) => {
-  imageUrl.value = imageChangeUrl(type)
-  imageShow.value = true
+const imageView = (type: string) => {
+  switch (type) {
+    case "sfz1":
+      imageShow.value = true;
+      imageUrl.value = IDCardFront.value;
+      break;
+    case "sfz2":
+      imageShow.value = true;
+      imageUrl.value = IDCardBack.value;
+      break;
+    case "qualification":
+      imageShow.value = true;
+      imageUrl.value = businessLicense.value;
+      break;
+    case "contract":
+      imageUrl.value = contract.value;
+      nextTick(() => {
+        // loadPdf(contract.value)
+        if (contract.value.includes('.pdf')) {
+          window.open(contract.value, '_blank')
+        } else if (contract.value.includes('.doc') || contract.value.includes('.docx')) {
+          fileShow.value = true
+          nextTick(() => {
+            filePreview(contract.value)
+          })
+        } else if (contract.value.includes('.jpg') || contract.value.includes('.jpeg') || contract.value.includes('.png')) {
+          imageShow.value = true
+        }
+      })
+      break;
+    case "applicant":
+      imageUrl.value = applicant.value;
+      nextTick(() => {
+        // loadPdf(applicant.value)
+        if (applicant.value.includes('.pdf')) {
+          window.open(applicant.value, '_blank')
+        } else if (applicant.value.includes('.doc') || applicant.value.includes('.docx')) {
+          fileShow.value = true
+          filePreview(applicant.value)
+        } else if (applicant.value.includes('.jpg') || applicant.value.includes('.jpeg') || applicant.value.includes('.png')) {
+          imageShow.value = true
+        }
+      })
+      break;
+    case "salaryTable":
+      imageUrl.value = decidePay.value;
+      nextTick(() => {
+        // loadPdf(decidePay.value)
+        if (decidePay.value.includes('.pdf')) {
+          window.open(decidePay.value, '_blank')
+        } else if (decidePay.value.includes('.doc') || decidePay.value.includes('.docx')) {
+          fileShow.value = true
+          filePreview(decidePay.value)
+        } else if (decidePay.value.includes('.jpg') || decidePay.value.includes('.jpeg') || decidePay.value.includes('.png')) {
+          imageShow.value = true
+        }
+      })
+      break;
+    case "leaveTable":
+      imageUrl.value = dimission.value;
+      nextTick(() => {
+        // loadPdf(dimission.value)
+        if (dimission.value.includes('.pdf')) {
+          window.open(dimission.value, '_blank')
+        } else if (dimission.value.includes('.doc') || dimission.value.includes('.docx')) {
+          fileShow.value = true
+          filePreview(dimission.value)
+        } else if (dimission.value.includes('.jpg') || dimission.value.includes('.jpeg') || dimission.value.includes('.png')) {
+          imageShow.value = true
+        }
+      })
+      break;
+  }
+};
+const downloadImage = (type: string) => {
+  switch (type) {
+    case "sfz1":
+      download(IDCardFront.value, IDCardFrontName.value)
+      break;
+    case "sfz2":
+      download(IDCardBack.value, IDCardBackName.value)
+      break;
+    case "qualification":
+      download(businessLicense.value, businessLicenseName.value)
+      break;
+    case "contract":
+      download(contract.value, contractName.value)
+      break;
+    case "applicant":
+      download(applicant.value, applicantName.value)
+      break;
+    case "salaryTable":
+      download(decidePay.value, decidePayName.value)
+      break;
+    case "leaveTable":
+      download(dimission.value, dimissionName.value)
+      break;
+  }
 }
+// 图片下载
+const download = (url, name) => {
+  let a_link = document.createElement('a')
+  fetch(url).then((res) => res.blob())
+    .then((blob) => {
+      // 将链接地址字符内容转变成blob地址
+      a_link.href = URL.createObjectURL(blob)
+      console.log(a_link.href)
+      a_link.download = name //下载的文件的名字
+      document.body.appendChild(a_link)
+      a_link.click()
+    })
 
+}
+let fileShow = ref(false)
+let fileUrl = ref('')
+const filePreview = (file) => {
+  nextTick(() => {
+    fileUrl.value = file
+  })
+}
 // 详情
 let dataDetail = ref(null)
 const initDetail = () => {
-  let id = myRoute.query?.userId
-  api.operationApi.operationDetail(id).then(res => {
-    if(res?.code == 200) {
+  let id = myRoute.query?.id
+  api.operationApi.operationDetail(id).then((res: any) => {
+    if (res?.code == 200) {
       dataDetail.value = res.data
+      res.data.fileList.map((item: any) => {
+        switch (item.fileType) {
+          case "sfz1":
+            IDCardFrontName.value = item.fileName;
+            IDCardFront.value = item.fileUrl;
+            break;
+          case "sfz2":
+            IDCardBackName.value = item.fileName;
+            IDCardBack.value = item.fileUrl;
+            break;
+          case "qualification":
+            businessLicenseName.value = item.fileName;
+            businessLicense.value = item.fileUrl;
+            break;
+          case "contract":
+            contractName.value = item.fileName;
+            contract.value = item.fileUrl;
+            break;
+          case "applicant":
+            applicantName.value = item.fileName;
+            applicant.value = item.fileUrl;
+            break
+          case "salaryTable":
+            decidePayName.value = item.fileName;
+            decidePay.value = item.fileUrl;
+            break;
+          case "leaveTable":
+            dimissionName.value = item.fileName;
+            dimission.value = item.fileUrl;
+            break;
+        }
+      })
     } else {
       ElMessage({
         message: res.msg,
@@ -486,8 +732,8 @@ const initDetail = () => {
 // 初始化银行数据
 let bankOption = ref([])
 const initBankCard = () => {
-  api.commonApi.personInfo('bank_info').then(res => {
-    if(res.code == 200) {
+  api.commonApi.personInfo('bank_info').then((res: any) => {
+    if (res?.code == 200) {
       bankOption.value = res.data
     } else {
       ElMessage({
@@ -497,150 +743,171 @@ const initBankCard = () => {
     }
   })
 }
-// 转换
-const bankCardChange = (list, code) => {
-  if(code&&list.length>0) {
-    let obj = list.find(item => item.id == code)
-    return obj.label
-  }
-}
+
 
 // 名字转换首字母
-const initName = (name) => {
-  return name?pinyin.getFullChars(name).substring(0, 1):''
+const initName = (name: string) => {
+  return name ? pinyin.getFullChars(name).substring(0, 1) : ''
 }
 
-onMounted(() => {
+onMounted(async () => {
   initDetail()
   initBankCard()
   getGradeOptions()
+  statusList.value = await getDictItems({ dictCode: "person_status" });
 })
-// 获取人员等级列表
-let userGradeList = ref()
-const getGradeOptions = () => {
-  api.partnerApi.queryGradeName().then((res: any) => {
-    if (res.code === 200) {
-      userGradeList.value = res.data;
-    }
-  })
-}
+
 </script>
 
 <style scoped lang="scss">
-.detail{
-  margin: 0 10px;
-  height: calc(100vh - 120px);
-  background-color: white;
-  overflow-y: auto;
-  .state{
-    border: 1px solid #FF4545;
-    border-radius: 10px;
+.state-box {
+  padding-bottom: 10px;
+  background-color: #f5f8ff;
+
+  .state {
+    border: 1px solid #ff4545;
+    border-radius: 4px;
     padding: 10px 20px;
-    background: #FFF4F4;
+    background: #fff4f4;
     display: flex;
-    margin: 5px 0;
     font-weight: 400;
     color: #333333;
-    h3{
+
+    h3 {
       font-size: 16px;
       margin: 0 0 10px;
-      color: rgba(0,0,0,.64);
+      color: rgba(0, 0, 0, 0.64);
     }
-    p{
+
+    p {
       font-size: 14px;
       margin: 10px 0;
     }
   }
-  .info{
-    background: white;
-    padding: 24px;
+}
+
+:deep(.el-tabs__nav-scroll) {
+  padding-left: 24px;
+}
+
+:deep(.el-tabs__item.is-top) {
+  font-size: 18px;
+  height: 60px;
+}
+
+.info {
+  background: white;
+  padding: 24px 24px 0;
+  margin-bottom: 10px;
+  border-radius: 6px;
+
+  :deep(.el-descriptions__title) {
+    width: 100%;
+  }
+
+  :deep(.el-tabs__nav-wrap) {
+    padding: 0 25px;
+  }
+
+  :deep(.el-tabs__item) {
+    font-size: 18px;
+  }
+
+  .firstName {
+    width: 30px;
+    height: 30px;
+    text-align: center;
+    line-height: 30px;
+    border-radius: 15px;
+    background: #409EFF;
+    color: white;
+    font-size: 18px;
+    margin-right: 10px;
+  }
+
+  .allName {
+    font-size: 14px;
+  }
+}
+
+.message {
+  background: white;
+
+  .fileItem {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
     margin: 10px 0;
-    border-radius: 10px;
-    :deep(.el-descriptions__title) {
-      width: 100%;
-    }
-    :deep(.el-tabs__nav-wrap) {
-      padding: 0 25px;
-    }
-    :deep(.el-tabs__item) {
-      font-size: 18px;
+
+    .label {
+      width: 200px;
     }
-    .firstName{
-      width: 30px;
-      height: 30px;
-      text-align: center;
+
+    .fileName {
+      width: calc(100% - 500px);
       line-height: 30px;
-      border-radius: 15px;
-      background: #409EFF;
-      color: white;
-      font-size: 18px;
-      margin-right: 10px;
-    }
-    .allName{
-      font-size: 14px;
-    }
-  }
-  .message{
-    background: white;
-    :deep(.el-tabs__nav-scroll) {
-      padding: 24px 0 0 24px;
-    }
-    .other{
-      .fileItem{
+      display: flex;
+      align-items: center;
+      padding: 0 20px;
+
+      &:hover {
+        background: #ccc;
+      }
+
+      .file-name {
+        width: 200px;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        margin-right: 20px;
+      }
+
+      .file-icon {
         display: flex;
         justify-content: flex-start;
         align-items: center;
-        margin: 10px 0;
-        .label{
-          width: 200px;
-        }
-        .fileName{
-          width: calc(100% - 500px);
-          line-height: 30px;
-          display: flex;
-          align-items: center;
-          padding: 0 20px;
-          &:hover{
-            background: #ccc;
-          }
-          .file-name{
-            width: 200px;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            white-space: nowrap;
-            margin-right: 20px;
-          }
-          .file-icon{
-            display: flex;
-            justify-content: flex-start;
-            align-items: center;
-            height: 30px;
-            cursor: pointer;
-            &:hover{
-              color: #00a0f4;
-            }
-          }
-        }
-      }
-      .cardImage{
-        display: block;
-        width: 80px;
-        height: 80px;
-        border-radius: 5px;
-      }
-      :deep(.el-descriptions__title) {
-        padding-left: 20px;
+        height: 30px;
+        margin-left: 10px;
         font-size: 16px;
+        cursor: pointer;
+
+        &:hover {
+          color: #00a0f4;
+        }
       }
     }
   }
-  .image-box{
-    display: flex;
-    align-content: center;
-    justify-content: center;
+
+  .cardImage {
+    display: block;
+    width: 80px;
+    height: 80px;
+    border-radius: 5px;
   }
-  :deep(.el-table th.el-table__cell) {
-    background-color: #F7F7F9;
+
+  :deep(.el-descriptions__title) {
+    padding-left: 20px;
+    font-size: 16px;
   }
 }
+
+.image-box {
+  display: flex;
+  align-content: center;
+  justify-content: center;
+
+}
+
+:deep(.el-table th.el-table__cell) {
+  background-color: #F7F7F9;
+}
+
+:deep(.vue-office-docx-main) {
+  height: 600px;
+  overflow-y: auto;
+}
+
+:deep(.docx-wrapper) {
+  background: white;
+}
 </style>

src/views/representative/partnerReview.vue

@@ -53,6 +53,8 @@
 import { ref, reactive, onBeforeMount } from 'vue'
 import { ElMessage } from 'element-plus'
 import api from '@/api'
+import router from '@/router'
+
 // 页面加载时获取机构列表
 onBeforeMount(() => {
   getGradeOptions();//获取合伙人等级s
@@ -162,8 +164,12 @@ const rejectReason = (item: any) => {
 }
 // 详情
 const details = (item: any) => {
-  OperationVisible.value = true;
-  id.value = item.id;
+  router.push({
+    path: '/PartnerManagement/partnerDetail',
+    query: {
+      id: item.userId,
+    }
+  })
 }
 // 批量审核
 const selectionChange = (value: any[]) => {