Эх сурвалжийг харах

fix: 修改bug,调整页面布局

wuguojie 1 жил өмнө
parent
commit
6ecbbf3e44

+ 6 - 0
src/api/index.ts

@@ -4,6 +4,7 @@ import { ApiInstance } from './type'
 import axios from 'axios'
 // import qs from 'qs'
 import Message from 'vue-m-message'
+import { ElMessage } from 'element-plus'
 // 导入 API 模块
 import appApi from './modules/app'
 import userApi from './modules/user'
@@ -77,6 +78,11 @@ axiosInstance.interceptors.response.use(
           duration: 2000,
         })
         useUserStore().logout()
+      } else if(response.data.code === 400) {
+        ElMessage({
+          message: `${response.data.msg}!!!`,
+          type: 'error',
+        })
       }
     }
     return Promise.resolve(response.data)

+ 4 - 5
src/api/modules/operation.ts

@@ -41,20 +41,19 @@ export interface AddOperation {
   contract?: string,
   applicant?: string,
   salaryTable?: string,
-  leaveTable?: string
+  leaveTable?: string,
 }
 // 列表
 export interface OperationSearch {
-  pages: number,
-  size: number,
   salesman?: string,
   organizationName?: string,
   deptId?: string,
   typeAttr?: string,
   deptName?: string,
-  status?: number,
+  status?: string,
   isEnable?: string,
-  leaderId?: string
+  leaderId?: string,
+  [key: string]: any
 }
 // 银行卡
 export interface AddBankCard {

+ 9 - 7
src/api/modules/user.ts

@@ -1,4 +1,5 @@
 import { ApiInstance } from '../type'
+import { LocationQueryValue } from "vue-router";
 interface LoginData {
   userName: string
   passWord: string
@@ -311,14 +312,14 @@ const userApi = (axiosInstance: ApiInstance) => ({
   AllMemberList: (data: SysRoleVo) => axiosInstance.post('/userInfo/getUser', data, { }),
 
   //成员详情
-  getUserInfo: (params: Request) => axiosInstance.get('/userInfo/getUserInfo', {params}),
+  getUserInfo: (params: { id: string | LocationQueryValue[] }) => axiosInstance.get('/userInfo/getUserInfo', {params}),
 
   //编辑成员
   updateUserInfo: (data: SysRoleVo) => axiosInstance.post('/userInfo/update', data, { }),
 
   //获取是否可以资源转移信息
-  getTransferInfo: (params: Request) => axiosInstance.get('/userInfo/getTransferInfo', {params}),
-  
+  getTransferInfo: (params: { id: string }) => axiosInstance.get('/userInfo/getTransferInfo', {params}),
+
   //资源转移
   transfer: (data: Request) => axiosInstance.post('/userInfo/transfer', data, { }),
 
@@ -333,10 +334,11 @@ const userApi = (axiosInstance: ApiInstance) => ({
 
   //离职
   userQuitApply: (data: {userId:string}) => axiosInstance.post('/userInfo/userQuitApply', data, { }),
-  
-  
-  
-  
+
+  // 获取当前登录用户的信息
+  getCurUserInfo: () => axiosInstance.get('/auth/getUserInfo')
+
+
 })
 
 export default userApi

BIN
src/assets/images/btn-bg.png


BIN
src/assets/images/close.png


BIN
src/assets/images/image.png


BIN
src/assets/images/word.png


+ 37 - 0
src/assets/styles/common/style.scss

@@ -0,0 +1,37 @@
+.m-r-8 {
+  margin-right: 8px;
+}
+.p-w-12 {
+  padding: 0 0 0 12px;
+}
+.bg-F9 {
+  background: #F9F9F9;
+}
+.pad-24{
+  padding: 2px 24px;
+}
+.bg-white{
+  background-color: #ffffff;
+}
+/*
+按钮样式
+is-plain
+*/
+.radius-2px{
+  border-radius: 2px;
+}
+.width-100{
+  width: 100%;
+}
+/*
+布局样式
+*/
+.col-108 {
+  width: 108px;
+}
+.col-210 {
+  width: 210px;
+}
+.col-33 {
+  width: 33%;
+}

+ 20 - 10
src/components/ImgCropper/index.vue

@@ -3,11 +3,12 @@ import 'vue-cropper/dist/index.css'
 import { VueCropper } from 'vue-cropper'
 import {ref,defineEmits} from "vue"
 import api from '@/api'
+import {ElMessage} from "element-plus";
 
 interface Props{
   imgUrl: string;
   imgName:string;
-  
+
 }
 const props = withDefaults(defineProps<Props>(),{
   imgUrl:'',
@@ -17,7 +18,7 @@ const props = withDefaults(defineProps<Props>(),{
 const emit = defineEmits(['uploadImg']);
 const cropper = ref<InstanceType<typeof VueCropper>>()
 const inputRef = ref<HTMLInputElement>()
-  
+
 const loading = ref<boolean>(false)
 const isReady = ref<boolean>(false)
 // vue-cropper的基本配置
@@ -61,7 +62,7 @@ const realTime = () => {
 }
 // 初始化
 const imgLoad = (msg: string) => {
-  
+
   if (msg === 'success') {
     isReady.value = true
   }
@@ -108,7 +109,7 @@ const rotateRight = () => {
 const imgUpload = () => {
   //获取截图的blob数据
   // console.log(cropper.value)
-  
+
   // console.log(cropper.value.scaleImg)
 
   cropper.value.getCropBlob(async (data: File) => {
@@ -116,18 +117,27 @@ const imgUpload = () => {
     const files = new File([data],img.value?.name || props.imgName,{
       type:data.type
     }); // 声明formData数据类型
- 
-   
+
+
     formData.append('file',files)
     // console.log(img.value.size)
     // console.log(data)
     // params.append("file", );
-  
+
     api.areaApi.fileUpload(formData).then((res: any) => {
-      
+
         if (res.code === 200) {
           // console.log(res)
+          ElMessage({
+            message: '上传成功',
+            type: 'success'
+          })
           emit("uploadImg", res.data);
+        } else {
+          ElMessage({
+            message: res.msg,
+            type: 'warning'
+          })
         }
     });
     // 上传到服务器
@@ -143,7 +153,7 @@ const selectClick = () => {
     <div class="w-[800px] h-[300px]">
       <div class="w-[800px] h-[300px] flex items-center justify-between">
         <!-- 给组件固定宽高 -->
-        <div class="h-[300px] w-[510px]" style="display: 300px; width: 500px">
+        <div class="h-[300px] w-[510px]" style="width: 500px">
           <VueCropper
             ref="cropper"
             :img="option.img"
@@ -205,4 +215,4 @@ const selectClick = () => {
     </div>
   </div>
 </template>
-<style scoped lang="scss"></style>
+<style scoped lang="scss"></style>

+ 1 - 1
src/components/Table/index.vue

@@ -205,7 +205,7 @@ const selectChange = (value: any[]) => {
   :deep(.cell) {
     display: flex;
     align-items: center;
-    justify-content: center;
+    justify-content: flex-start;
   }
   .table-title-btn {
     margin-bottom: 20px;

+ 15 - 11
src/store/modules/user.ts

@@ -18,6 +18,7 @@ const useUserStore = defineStore(
     const avatar = ref(localStorage.avatar ?? '')
     const permissions = ref<string[]>([])
     const staticRouter=ref<string[]>([])
+    let userInfo = ref({})
     const isLogin = computed(() => {
       if (token.value) {
         return true
@@ -32,20 +33,23 @@ const useUserStore = defineStore(
       system: string
       captchaId: number
     }) {
-        const res = await api.userApi.login(data)
-        
-        localStorage.setItem('userName', data.userName)
-        localStorage.setItem('token', res.data)
-        userName.value = data.userName
-        token.value = res.data
-        avatar.value = 'https://fantastic-admin.hurui.me/logo.png'
+      const res = await api.userApi.login(data)
+
+      localStorage.setItem('userName', data.userName)
+      localStorage.setItem('token', res.data)
+      userName.value = data.userName
+      token.value = res.data
+      avatar.value = 'https://fantastic-admin.hurui.me/logo.png'
+      const result = await api.userApi.getCurUserInfo()
+      localStorage.setItem('userDeptId', result.data.deptId)
+      userInfo.value = result.data
     }
     //获取运营交付菜单
     async function getMenu(codeItem) {
         const res = await api.menuApi.getTenantConfig({...codeItem})
-        
-      
-    
+
+
+
        if(res.code===200){
         // staticRouter.value=JSON.parse(res.data.sysConfig)
         localStorage.setItem("menu",res.data.sysConfig)
@@ -96,7 +100,7 @@ const useUserStore = defineStore(
       getPermissions,
       editPassword,
       getMenu,
-      
+      userInfo
     }
   },
 )

+ 10 - 2
src/views/contentManagement/advertisement.vue

@@ -50,7 +50,7 @@
             <!-- <el-button type="primary" @click="add(ruleFormRef)">
               <el-icon><Plus /></el-icon>添加机构</el-button
             > -->
-            <el-button @click="router.push({ path: '/content/advertisement/advertisementEdit' })">
+            <el-button @click="handleAdd">
               <el-icon><Position /></el-icon>发布新的广告图
             </el-button>
           </div>
@@ -252,6 +252,15 @@ const userPageInfo = {
   total: 0,
   show: true,
 };
+// 新增
+const handleAdd = () => {
+  router.push({
+    path: '/content/advertisement/advertisementEdit',
+    query: {
+      total: pageInfo.total
+    }
+  })
+}
 //分页列表功能
 const getList = (item: PageInfo) => {
   pageInfo.pageNum = item.pageNum;
@@ -310,7 +319,6 @@ function editor(item: any) {
 }
 
 function del(item: any) {
-
   ElMessageBox.confirm("确认要删除当前数据吗?", "提示", {
     confirmButtonText: "确认",
     cancelButtonText: "取消",

+ 4 - 4
src/views/contentManagement/message.vue

@@ -4,16 +4,16 @@
       <el-form label-position="left" label-width="auto">
         <el-row :gutter="24">
           <el-col :span="6">
-            <el-form-item label="成员信息">
+            <el-form-item label="消息内容">
               <el-input
                 v-model="form.searchValue"
-                placeholder="输入成员信息查找"
+                placeholder="输入消息标题,内容"
                 :prefix-icon="Search"
               />
             </el-form-item>
           </el-col>
           <el-col :span="6">
-            <el-form-item label="归属机构">
+            <el-form-item label="发布机构">
               <el-cascader
                 clearable
                 style="width: 100%"
@@ -37,7 +37,7 @@
         :tableData="tableData"
         :columns="columns"
         :showIndex="false"
-        :showSelect="true"
+        :showSelect="false"
         :showOperation="true"
         :pageInfo="pageInfo"
         @getList="getList"

+ 38 - 16
src/views/contentManagement/modules/addAdvertisement.vue

@@ -33,7 +33,7 @@
       </el-row>
       <el-row :gutter="24">
         <el-col :span="9">
-          <el-form-item label="URL" prop="">
+          <el-form-item label="URL" prop="url">
             <el-input v-model="ruleForm.url" clearable style="width: 400px" />
           </el-form-item>
         </el-col>
@@ -45,7 +45,6 @@
             </el-radio-group>
           </el-form-item>
         </el-col>
-
       </el-row>
 
       <el-form-item label="广告图" prop="image">
@@ -77,13 +76,13 @@
 
 <script setup lang="ts">
 import { ref, reactive, onMounted } from "vue";
-import {ElMessage} from "element-plus"
+import {ElMessage, ElMessageBox} from "element-plus"
 import type { ComponentSize, FormInstance, FormRules, } from "element-plus";
 import api from "@/api";
 import router from "@/router";
-import { useRoute } from "vue-router";
-
+import { useRoute, useRouter } from "vue-router";
 
+const myRouter = useRouter()
 
 
 function uploadImg(file:any){
@@ -127,6 +126,8 @@ onMounted(() => {
         imgName.value=res.data.uploadFiles.fileName
       }
     })
+  } else {
+    ruleForm.orgId = localStorage.getItem('userDeptId')
   }
 });
 
@@ -154,6 +155,13 @@ const rules = reactive<FormRules<RuleForm>>({
       trigger: "change",
     },
   ],
+  url: [
+    {
+      pattern: /^(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/,
+      message: '请填写正确的URL地址',
+      trigger: 'change'
+    }
+  ],
   image: [
     {
       required: true,
@@ -193,18 +201,29 @@ const submitForm = async (formEl: FormInstance | undefined) => {
           }
         })
       }else{
-        api.advertisementApi.posterAdd({
-          ...ruleForm,
-          orgId:orgId.value
-        }).then(res=>{
-          if(res.code===200){
-            ElMessage.success(res.msg)
-            router.back()
-          }
-        })
+        if(route.query?.total&&route.query?.total >=5) {
+          ElMessageBox({
+            title: '温馨提示',
+            message: '当前已有5条广告图,添加时会将时间排序最晚的数据进行替换,是否继续保存?',
+            type: 'warning',
+            showCancelButton: true,
+            confirmButtonText: '继续保存',
+            cancelButtonText: '取消',
+          }).then((action) => {
+            if(action === 'confirm') {
+              api.advertisementApi.posterAdd({
+                ...ruleForm,
+                orgId:orgId.value
+              }).then(res=>{
+                if(res.code===200){
+                  ElMessage.success(res.msg)
+                  router.back()
+                }
+              })
+            }
+          })
+        }
       }
-
-
     }
   });
 };
@@ -212,6 +231,9 @@ const submitForm = async (formEl: FormInstance | undefined) => {
 const resetForm = (formEl: FormInstance | undefined) => {
   if (!formEl) return;
   formEl.resetFields();
+  myRouter.push({
+    path: '/content/advertisement'
+  })
 };
 
 //机构列表

+ 7 - 1
src/views/contentManagement/modules/addMessage.vue

@@ -78,6 +78,7 @@ import type { ComponentSize, FormInstance, FormRules, } from "element-plus";
 import api from "@/api";
 import router from "@/router";
 import { useRoute, useRouter } from "vue-router";
+import useUserStore from "@/store/modules/user.ts";
 
 interface RuleForm {
   title: string;
@@ -97,7 +98,7 @@ const route=useRoute()
 const myRouter = useRouter()
 onMounted(() => {
   getInstitutionList(); //机构列表
-  console.log(route)
+  // const userInfo = useUserStore()
   if(route.query?.id){
     api.contentApi.noticeGet({id:route.query?.id}).then(res=>{
 
@@ -112,6 +113,8 @@ onMounted(() => {
 
       }
     })
+  } else {
+    ruleForm.sendDeptId = localStorage.getItem('userDeptId')
   }
 });
 
@@ -242,4 +245,7 @@ function getID(json:any, id:string) {
   padding: 15px;
   box-sizing: border-box;
 }
+:deep(.el-form-item.is-error .el-input__validateIcon) {
+  display: none;
+}
 </style>

+ 181 - 26
src/views/operationManagement/modules/addOperation.vue

@@ -134,10 +134,25 @@
                 <span style="color: #f56c6c">*</span>身份证(人像面)
               </template>
               <el-upload action="" v-if="!IDCardFront" :auto-upload="false" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 1)">
-                <el-button link type="primary">上传</el-button>
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
-                <div class="fileName">{{ IDCardFrontName }}</div>
+                <div class="file-box">
+                  <div class="btn-top">
+                    <img class="image-close" @click="deleteImage(1)" src="@/assets/images/close.png" />
+<!--                    <el-icon class="btn-icon"><Delete /></el-icon>-->
+                  </div>
+                  <img class="file-img" :src="IDCardFront" />
+                  <div class="btn-bottom">
+                    <el-upload class="width-50" :show-file-list="false" :auto-upload="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 1)" style="display: flex; align-items: center; justify-content: center; color: white">
+                      <el-icon><Upload /></el-icon>重新上传
+                    </el-upload>
+                    <div class="width-50" style="display: flex; align-items: center; justify-content: center; color: white; cursor:pointer;" @click="downloadImage(1)">
+                      <el-icon><Download /></el-icon>下载资料
+                    </div>
+                  </div>
+                </div>
+<!--                <div class="fileName">{{ IDCardFrontName }}</div>
                 <div class="fileBtn">
                   <el-upload :show-file-list="false" :auto-upload="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 1)" style="display: flex; align-items: center">
                     <el-icon class="btn-icon"><Upload /></el-icon>
@@ -145,7 +160,7 @@
                   <el-icon class="btn-icon" @click="imageView(1)"><View /></el-icon>
                   <el-icon class="btn-icon" @click="downloadImage(1)"><Download /></el-icon>
                   <el-icon class="btn-icon" @click="deleteImage(1)"><Delete /></el-icon>
-                </div>
+                </div>-->
               </div>
             </el-form-item>
             <el-form-item prop="IDCardBack" label-width="150">
@@ -153,10 +168,25 @@
                 <span style="color: #f56c6c">*</span>身份证(国徽面)
               </template>
               <el-upload v-if="!IDCardBack" :auto-upload="false"  :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 2)">
-                <el-button link type="primary">上传</el-button>
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
-                <div class="fileName">{{ IDCardBackName }}</div>
+                <div class="file-box">
+                  <div class="btn-top">
+                    <img class="image-close" @click="deleteImage(2)" src="@/assets/images/close.png" />
+                    <!--                    <el-icon class="btn-icon"><Delete /></el-icon>-->
+                  </div>
+                  <img class="file-img" :src="IDCardBack" />
+                  <div class="btn-bottom">
+                    <el-upload class="width-50" :show-file-list="false" :auto-upload="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 2)" style="display: flex; align-items: center; justify-content: center; color: white">
+                      <el-icon><Upload /></el-icon>重新上传
+                    </el-upload>
+                    <div class="width-50" style="display: flex; align-items: center; justify-content: center; color: white; cursor:pointer;" @click="downloadImage(2)">
+                      <el-icon><Download /></el-icon>下载资料
+                    </div>
+                  </div>
+                </div>
+<!--                <div class="fileName">{{ IDCardBackName }}</div>
                 <div class="fileBtn">
                   <el-upload :auto-upload="false" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 2)" style="display: flex; align-items: center">
                     <el-icon class="btn-icon"><Upload /></el-icon>
@@ -164,15 +194,30 @@
                   <el-icon class="btn-icon" @click="imageView(2)"><View /></el-icon>
                   <el-icon class="btn-icon" @click="downloadImage(2)"><Download /></el-icon>
                   <el-icon class="btn-icon" @click="deleteImage(2)"><Delete /></el-icon>
-                </div>
+                </div>-->
               </div>
             </el-form-item>
             <el-form-item prop="" label="展业资格证" label-width="150">
               <el-upload :auto-upload="false" v-if="!certification"  :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 3)">
-                <el-button link type="primary">上传</el-button>
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
-                <div class="fileName">{{ certificationName }}</div>
+                <div class="file-box">
+                  <div class="btn-top">
+                    <img class="image-close" @click="deleteImage(3)" src="@/assets/images/close.png" />
+                    <!--                    <el-icon class="btn-icon"><Delete /></el-icon>-->
+                  </div>
+                  <img class="file-img" :src="certification" />
+                  <div class="btn-bottom">
+                    <el-upload class="width-50" :show-file-list="false" :auto-upload="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 3)" style="display: flex; align-items: center; justify-content: center; color: white">
+                      <el-icon><Upload /></el-icon>重新上传
+                    </el-upload>
+                    <div class="width-50" style="display: flex; align-items: center; justify-content: center; color: white; cursor:pointer;" @click="downloadImage(3)">
+                      <el-icon><Download /></el-icon>下载资料
+                    </div>
+                  </div>
+                </div>
+<!--                <div class="fileName">{{ certificationName }}</div>
                 <div class="fileBtn">
                   <el-upload :auto-upload="false" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 3)" style="display: flex; align-items: center">
                     <el-icon class="btn-icon"><Upload /></el-icon>
@@ -180,7 +225,7 @@
                   <el-icon class="btn-icon" @click="imageView(3)"><View /></el-icon>
                   <el-icon class="btn-icon" @click="downloadImage(3)"><Download /></el-icon>
                   <el-icon class="btn-icon" @click="deleteImage(3)"><Delete /></el-icon>
-                </div>
+                </div>-->
               </div>
             </el-form-item>
           </template>
@@ -376,13 +421,14 @@
         <el-descriptions-item>
           <template #default>
             <el-form-item prop="" label="劳动合同" label-width="150">
-              <el-upload v-if="!contract" :auto-upload="false" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 4)">
-                <el-button link type="primary">上传</el-button>
+              <el-upload v-if="!contract" :auto-upload="false" :show-file-list="false" accept=".png, .jpg, .jpeg, .pdf, .doc, .docx" @change="uploadImage($event, 4)">
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
+                <img style="width: 40px; height: 40px" :src="contractName.includes('.png') || contractName.includes('.jpg') || contractName.includes('.jpeg')?image:contractName.includes('.pdf')?pdf:contractName.includes('.doc') || contractName.includes('.docx')?word:''" />
                 <div class="fileName">{{ contractName }}</div>
                 <div class="fileBtn">
-                  <el-upload :auto-upload="false" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 4)" style="display: flex; align-items: center">
+                  <el-upload :auto-upload="false" :show-file-list="false" accept=".png, .jpg, .jpeg, .pdf, .doc, .docx" @change="uploadImage($event, 4)" style="display: flex; align-items: center">
                     <el-icon class="btn-icon"><Upload /></el-icon>
                   </el-upload>
                   <el-icon class="btn-icon" @click="imageView(4)"><View /></el-icon>
@@ -392,13 +438,14 @@
               </div>
             </el-form-item>
             <el-form-item prop="" label="应聘表" label-width="150">
-              <el-upload v-if="!applicant" :auto-upload="false" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 5)">
-                <el-button link type="primary">上传</el-button>
+              <el-upload v-if="!applicant" :auto-upload="false" :show-file-list="false" accept=".png, .jpg, .jpeg, .pdf, .doc, .docx" @change="uploadImage($event, 5)">
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
+                <img style="width: 40px; height: 40px" :src="applicantName.includes('.png') || applicantName.includes('.jpg') || applicantName.includes('.jpeg')?image:applicantName.includes('.pdf')?pdf:applicantName.includes('.doc') || applicantName.includes('.docx')?word:''" />
                 <div class="fileName">{{ applicantName }}</div>
                 <div class="fileBtn">
-                  <el-upload :auto-upload="false"  :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 5)" style="display: flex; align-items: center">
+                  <el-upload :auto-upload="false"  :show-file-list="false" accept=".png, .jpg, .jpeg, .pdf, .doc, .docx" @change="uploadImage($event, 5)" style="display: flex; align-items: center">
                     <el-icon class="btn-icon"><Upload /></el-icon>
                   </el-upload>
                   <el-icon class="btn-icon" @click="imageView(5)"><View /></el-icon>
@@ -408,13 +455,14 @@
               </div>
             </el-form-item>
             <el-form-item prop="" label="定薪表" label-width="150">
-              <el-upload :auto-upload="false" v-if="!decidePay"  :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 6)">
-                <el-button link type="primary">上传</el-button>
+              <el-upload :auto-upload="false" v-if="!decidePay"  :show-file-list="false" accept=".png, .jpg, .jpeg, .pdf, .doc, .docx" @change="uploadImage($event, 6)">
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
+                <img style="width: 40px; height: 40px" :src="decidePayName.includes('.png') || decidePayName.includes('.jpg') || decidePayName.includes('.jpeg')?image:decidePayName.includes('.pdf')?pdf:decidePayName.includes('.doc') || decidePayName.includes('.docx')?word:''" />
                 <div class="fileName">{{ decidePayName }}</div>
                 <div class="fileBtn">
-                  <el-upload :auto-upload="false"  :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 6)" style="display: flex; align-items: center">
+                  <el-upload :auto-upload="false"  :show-file-list="false" accept=".png, .jpg, .jpeg, .pdf, .doc, .docx" @change="uploadImage($event, 6)" style="display: flex; align-items: center">
                     <el-icon class="btn-icon"><Upload /></el-icon>
                   </el-upload>
                   <el-icon class="btn-icon" @click="imageView(6)"><View /></el-icon>
@@ -424,13 +472,14 @@
               </div>
             </el-form-item>
             <el-form-item prop="" label="离职表" label-width="150">
-              <el-upload :auto-upload="false" v-if="!dimission"  :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 7)">
-                <el-button link type="primary">上传</el-button>
+              <el-upload :auto-upload="false" v-if="!dimission"  :show-file-list="false" accept=".png, .jpg, .jpeg, .pdf, .doc, .docx" @change="uploadImage($event, 7)">
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
+                <img style="width: 40px; height: 40px" :src="dimissionName.includes('.png') || dimissionName.includes('.jpg') || dimissionName.includes('.jpeg')?image:dimissionName.includes('.pdf')?pdf:dimissionName.includes('.doc') || dimissionName.includes('.docx')?word:''" />
                 <div class="fileName">{{ dimissionName }}</div>
                 <div class="fileBtn">
-                  <el-upload :auto-upload="false"  :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 7)" style="display: flex; align-items: center">
+                  <el-upload :auto-upload="false"  :show-file-list="false" accept=".png, .jpg, .jpeg, .pdf, .doc, .docx" @change="uploadImage($event, 7)" style="display: flex; align-items: center">
                     <el-icon class="btn-icon"><Upload /></el-icon>
                   </el-upload>
                   <el-icon class="btn-icon" @click="imageView(7)"><View /></el-icon>
@@ -460,6 +509,9 @@ import type { FormRules, FormInstance } from "element-plus";
 import { Plus } from '@element-plus/icons-vue'
 import api from "@/api";
 import { ElMessage } from "element-plus";
+import image from '@/assets/images/image.png'
+import word from '@/assets/images/word.png'
+import pdf from '@/assets/images/pdf.png'
 
 interface OperationFormProps extends AddOperation {
   organization: string
@@ -714,6 +766,67 @@ const initEditData = (id, ids) => {
   }
 }
 
+// 新增数据初始化
+const initAddData = () => {
+  operationForm.value = {
+    typeAttr: '',
+    deptId: '',
+    name: '',
+    mobile: '',
+    identity: '',
+    identityTimeStart: '',
+    identityTimeEnd: '',
+    leaderId: '',
+    referrerId: '',
+    sex: '',
+    birthday: '',
+    nations: '',
+    koseki: '',
+    maritalStatus: '',
+    politicsStatus: '',
+    health: '',
+    province: '',
+    city: '',
+    district: '',
+    liveAddress: '',
+    postalCode: '',
+    education: '',
+    graduationTime: '',
+    school: '',
+    isComputer: '',
+    emergencyContactName: '',
+    emergencyContactTel: '',
+    salary: '',
+    salaryLevel: '',
+    bankCardId: '',
+    bankName: '',
+    sfz1: '',
+    sfz2: '',
+    qualification: '',
+    contract: '',
+    applicant: '',
+    salaryTable: '',
+    leaveTable: '',
+    organizationId: '',
+    organization: '',
+    leaderNumber: '',
+    referrerNumber: '',
+    address: [],
+  }
+  IDCardFrontName.value = ''
+  IDCardFront.value = ''
+  IDCardBackName.value = ''
+  IDCardBack.value = ''
+  certificationName.value = ''
+  certification.value = ''
+  contractName.value = ''
+  contract.value = ''
+  applicantName.value = ''
+  applicant.value = ''
+  decidePayName.value = ''
+  decidePay.value = ''
+}
+
 // 上传接口
 let postUrl = ref(`${import.meta.env.VITE_APP_API_BASEURL}/file/upload`)
 // 上传图片
@@ -803,6 +916,7 @@ const imageView = (type) => {
 
 // 图片下载
 const download = (url, name) => {
+  alert(1)
   let image = new Image();
   // 解决跨域 Canvas 污染问题
   image.setAttribute("crossOrigin", "anonymous");
@@ -1164,7 +1278,8 @@ onMounted(() => {
 
 defineExpose({
   initEditData,
-  operationForm
+  operationForm,
+  initAddData
 })
 
 
@@ -1175,12 +1290,12 @@ defineExpose({
   display: flex;
   align-items: center;
   justify-content: flex-start;
-  padding: 2px 20px;
+  //padding: 2px 20px;
   border-radius: 5px;
   margin: 0 10px;
-  &:hover{
-    background: #ccc;
-  }
+  //&:hover{
+  //  background: #ccc;
+  //}
   .fileName{
     width: 200px;
     overflow: hidden;
@@ -1199,6 +1314,46 @@ defineExpose({
       }
     }
   }
+
+  .file-box{
+    position: relative;
+    .btn-top{
+      width: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+      position: absolute;
+      top: 0;
+      left: 0;
+      .image-close{
+        display: block;
+        width: 12px;
+        height: 12px;
+      }
+    }
+    .file-img{
+      display: block;
+      width: 208px;
+      height: 130px;
+      border-radius: 5px;
+    }
+    .btn-bottom{
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      z-index: 1000;
+      display: flex;
+      align-items: center;
+      height: 24px;
+      width: 100%;
+      background: url("@/assets/images/btn-bg.png") no-repeat;
+      background-size: 100% 100%;
+      .width-50{
+        width: 50%;
+      }
+    }
+  }
+
 }
 .image-view{
   position: absolute;

+ 32 - 24
src/views/operationManagement/operation.vue

@@ -1,10 +1,10 @@
 <template>
-  <div class="operation">
+  <div class="operation pad-24">
     <el-form
       class="operationForm"
       ref="OperationRef"
       :model="form"
-      label-width="auto"
+      label-width="70"
     >
       <el-row :gutter="20">
         <el-col :span="8">
@@ -67,26 +67,28 @@
             <el-input clearable v-model="form.leaderId" placeholder="管理人姓名、工号"></el-input>
           </el-form-item>
         </el-col>
-        <el-col :span="8">
-          <el-button type="primary" @click="search()">查询</el-button>
-          <el-button type="primary" plain @click="reset()">重置</el-button>
+        <el-col :span="16" class="span-justify">
+          <el-button class="radius-2px" type="primary" @click="search()">查询</el-button>
+          <el-button class="radius-2px" plain @click="reset()">重置</el-button>
         </el-col>
       </el-row>
     </el-form>
-    <el-row :gutter="20" style="margin: 20px 0" flex>
-      <el-col :span="3" style="display: flex">
-        <el-checkbox @change="selectAll" v-model="selectAllValue"></el-checkbox>&nbsp;
-        <el-select class="select-all" placeholder="全选" v-model="selectType" style="width: 120px" @change="selectTypeChange">
-          <el-option key="all" value="all" label="选中所有数据"></el-option>
+    <el-row :gutter="8" style="margin: 20px 0" flex>
+      <span class="flex col-210 m-r-8 bg-F9">
+        <el-checkbox class="p-w-12" @change="selectAll" v-model="selectAllValue"></el-checkbox>&nbsp;
+        <el-select class="select-all width-100" placeholder="全选" v-model="selectType" @change="selectTypeChange">
+          <el-option key="all" value="all" :label="`选中所有数据${total}条`"></el-option>
           <el-option key="cur" value="cur" label="选中本页数据"></el-option>
         </el-select>
-      </el-col>
-      <el-col :span="2">
-        <el-button type="primary" icon="plus" @click="addNumber">添加成员</el-button>
-      </el-col>
-      <el-col :span="2">
-        <el-dropdown trigger="click" placement="bottom" @command="dropdownCommand">
-          <el-button>批量管理</el-button>
+      </span>
+      <div class="col-108 m-r-8">
+        <el-button class="radius-2px width-100" type="primary" icon="plus" @click="addNumber">添加成员</el-button>
+      </div>
+      <span class="col-108 m-r-8">
+        <el-dropdown class="width-100" trigger="click" placement="bottom" @command="dropdownCommand">
+          <el-button class="radius-2px width-100">
+            批量管理&nbsp;&nbsp;<el-icon><ArrowDown /></el-icon>
+          </el-button>
           <template #dropdown>
             <el-dropdown-menu>
               <el-dropdown-item command="启用">启用</el-dropdown-item>
@@ -96,12 +98,12 @@
             </el-dropdown-menu>
           </template>
         </el-dropdown>
-      </el-col>
+      </span>
     </el-row>
     <el-table
       :data="tableData"
       ref="operationListRef"
-      height="460"
+      height="536"
       @selection-change="handleSelectionChange"
     >
       <el-table-column type="selection" width="55"></el-table-column>
@@ -150,7 +152,7 @@
         </template>
       </el-table-column>
     </el-table>
-    <div style="display: flex; justify-content: center; margin-top: 15px">
+    <div style="display: flex; justify-content: flex-end; margin-top: 15px">
       <el-pagination
         v-model:current-page="currentPage"
         v-model:page-size="pageSize"
@@ -374,7 +376,7 @@ const selectAll = (type: boolean) => {
   }
 }
 // 表格组件中的勾选
-const handleSelectionChange = (row: TableDataProps) => {
+const handleSelectionChange = (row: any) => {
   selectedList.value = row
 }
 // 全选类型改变
@@ -640,6 +642,9 @@ const tableDataCommand = (scope, e) => {
 const addNumber = () => {
   dialogShow.value = true
   title.value = '添加'
+  nextTick(() => {
+    AddOperationRef.value.initAddData()
+  })
 }
 // 添加/编辑业务员弹框
 let dialogShow = ref(false)
@@ -671,13 +676,16 @@ onMounted(() => {
 </script>
 
 <style scoped lang="scss">
+@import "@/assets/styles/common/style.scss";
 .operation{
   margin: 0 20px;
+  background: white;
   .operationForm{
     margin: 20px 0;
-  }
-  .formItem{
-    width: 350px;
+    .span-justify{
+      display: flex;
+      justify-content: flex-end;
+    }
   }
   :deep(.select-all .el-select__wrapper){
     box-shadow: none;

+ 58 - 33
src/views/operationManagement/operationDetail.vue

@@ -19,11 +19,11 @@
               <span class="allName">{{ dataDetail?.name }}</span>
             </el-col>
             <el-col :span="12" style="display: flex; justify-content: flex-end">
-              <el-button plain @click="checkPass" v-if="dataDetail?.status == 0 ||dataDetail?.status == 1 ||dataDetail?.status == 2 ||dataDetail?.status == 3 ">审核通过</el-button>
-              <el-button plain @click="checkNotPass" v-if="dataDetail?.status != 5&&dataDetail?.status != 6&&dataDetail?.status != 7&&dataDetail?.status != 8">审核不通过</el-button>
-              <el-button plain @click="editDetail">编辑</el-button>&nbsp;
+              <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 plain>更多</el-button>
+                <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>
@@ -36,29 +36,45 @@
             </el-col>
           </el-row>
         </template>
-        <el-descriptions-item label="工号:">{{ dataDetail?.userId }}</el-descriptions-item>
-        <el-descriptions-item label="所属机构:">{{ dataDetail?.deptName }}</el-descriptions-item>
-        <el-descriptions-item label="状态:">{{  dataDetail?.status == '0'?'待认证': dataDetail?.status == '1'?'已认证': dataDetail?.status == '2'?'待提交资料': dataDetail?.status == '3'?'已入职':'' }}</el-descriptions-item>
-        <el-descriptions-item label="类型:">{{  dataDetail?.typeAttr == '6'?'个代': dataDetail?.typeAttr == '8'?'渠道': dataDetail?.typeAttr == '5'?'团队': dataDetail?.typeAttr == '7'?'电销组': '' }}</el-descriptions-item>
-        <el-descriptions-item label="所属团队:">{{ dataDetail?.organizationName }}</el-descriptions-item>
-        <el-descriptions-item label="创建人:">{{ dataDetail?.updateBy }}</el-descriptions-item>
-        <el-descriptions-item label="创建时间:">{{ dataDetail?.updateTime }}</el-descriptions-item>
+        <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%">{{  dataDetail?.status == '0'?'待认证': dataDetail?.status == '1'?'已认证': dataDetail?.status == '2'?'待提交资料': dataDetail?.status == '3'?'已入职':'' }}</el-descriptions-item>
+        <el-descriptions-item label="类型:" width="33%">{{  dataDetail?.typeAttr == '6'?'个代': dataDetail?.typeAttr == '8'?'渠道': dataDetail?.typeAttr == '5'?'团队': dataDetail?.typeAttr == '7'?'电销组': '' }}</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?.updateTime }}</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">
+        <el-tab-pane label="基本信息" name="msg" style="padding: 0 24px">
           <div class="other">
             <el-descriptions title="个人信息">
-              <el-descriptions-item label="姓名:">{{ dataDetail?.name }}</el-descriptions-item>
-              <el-descriptions-item label="手机号:">{{ dataDetail?.mobile }}</el-descriptions-item>
-              <el-descriptions-item label="证件号:">{{ dataDetail?.identity }}</el-descriptions-item>
-              <el-descriptions-item label="证件有效期始:">{{ dataDetail?.identityTimeStart }}</el-descriptions-item>
-              <el-descriptions-item label="证件有效期止:">{{ dataDetail?.identityTimeEnd }}</el-descriptions-item>
+              <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="管理人:">{{ dataDetail?.leaderName }}</el-descriptions-item>
-              <el-descriptions-item label="管理人工号:">{{ dataDetail?.leaderId }}</el-descriptions-item>
-              <el-descriptions-item label="推荐人:">{{ dataDetail?.referrerName }}</el-descriptions-item>
-              <el-descriptions-item label="推荐人工号:">{{ dataDetail?.referrerId }}</el-descriptions-item>
+              <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>
+                </template>
+              </el-descriptions-item>
             </el-descriptions>
             <el-descriptions title="银行卡信息">
               <el-descriptions-item>
@@ -98,10 +114,10 @@
                 </template>
               </el-descriptions-item>
             </el-descriptions>
-            <el-button icon="plus" style="margin-left: 20px" @click="addBankCard">添加银行卡</el-button>
+            <el-button class="bg-white" plain type="primary" icon="plus" style="width: 100%; border-radius: 2px" @click="addBankCard">添加银行卡</el-button>
           </div>
         </el-tab-pane>
-        <el-tab-pane label="资料附件" name="file">
+        <el-tab-pane label="资料附件" name="file" style="padding: 0 24px">
           <div class="other">
             <el-descriptions title="资料附件">
               <el-descriptions-item>
@@ -487,34 +503,35 @@ onMounted(() => {
 <style scoped lang="scss">
 .detail{
   margin: 0 10px;
+  height: calc(100vh - 120px);
+  background-color: white;
   .state{
-    border: 1px solid rgba(255,0,0,.3);
+    border: 1px solid #FF4545;
     border-radius: 10px;
     padding: 10px 20px;
-    background: #FFEFEE;
+    background: #FFF4F4;
     display: flex;
     margin: 5px 0;
+    font-weight: 400;
+    color: #333333;
     h3{
-      font-weight: 500;
+      font-size: 16px;
       margin: 0 0 10px;
       color: rgba(0,0,0,.64);
     }
     p{
+      font-size: 14px;
       margin: 10px 0;
-      color: #888;
     }
   }
   .info{
     background: white;
-    padding: 5px 10px;
-    margin: 5px 0;
+    padding: 24px;
+    margin: 10px 0;
     border-radius: 10px;
     :deep(.el-descriptions__title) {
       width: 100%;
     }
-    :deep(.el-descriptions__body) {
-      padding-left: 60px;
-    }
     :deep(.el-tabs__nav-wrap) {
       padding: 0 25px;
     }
@@ -531,7 +548,6 @@ onMounted(() => {
       color: white;
       font-size: 18px;
       margin-right: 10px;
-      margin-left: 20px;
     }
     .allName{
       font-size: 14px;
@@ -585,6 +601,12 @@ onMounted(() => {
       }
     }
   }
+  .message{
+    background: white;
+    :deep(.el-tabs__nav-scroll) {
+      padding: 24px 0 0 24px;
+    }
+  }
   .image-box{
     display: flex;
     align-content: center;
@@ -594,5 +616,8 @@ onMounted(() => {
       height: 200px;
     }
   }
+  :deep(.el-table th.el-table__cell) {
+    background-color: #F7F7F9;
+  }
 }
 </style>

+ 117 - 27
src/views/personnel/modules/addOperation.vue

@@ -35,7 +35,7 @@
 
                   <el-select
                     v-model="operationForm.roleIds"
-                    placeholder="请选择性别"
+                    placeholder="请选择角色"
                     multiple
                   >
                     <el-option
@@ -417,10 +417,25 @@
                 accept=".png, .jpg, .jpeg"
                 @change="uploadImage($event, 1)"
               >
-                <el-button link type="primary">上传</el-button>
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
-                <div class="fileName">{{ IDCardFrontName }}</div>
+                <div class="file-box">
+                  <div class="btn-top">
+                    <img class="image-close" @click="deleteImage(1)" src="@/assets/images/close.png" />
+                    <!--                    <el-icon class="btn-icon"><Delete /></el-icon>-->
+                  </div>
+                  <img class="file-img" :src="IDCardFront" />
+                  <div class="btn-bottom">
+                    <el-upload class="width-50" :show-file-list="false" :auto-upload="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 1)" style="display: flex; align-items: center; justify-content: center; color: white">
+                      <el-icon><Upload /></el-icon>重新上传
+                    </el-upload>
+                    <div class="width-50" style="display: flex; align-items: center; justify-content: center; color: white; cursor:pointer;" @click="downloadImage(1)">
+                      <el-icon><Download /></el-icon>下载资料
+                    </div>
+                  </div>
+                </div>
+<!--                <div class="fileName">{{ IDCardFrontName }}</div>
                 <div class="fileBtn">
                   <el-upload
                     :auto-upload="false"
@@ -437,7 +452,7 @@
                   /></el-icon>
                   <el-icon class="btn-icon" @click="downloadImage(1)"><Download /></el-icon>
                   <el-icon class="btn-icon" @click="deleteImage(1)"><Delete /></el-icon>
-                </div>
+                </div>-->
               </div>
             </el-form-item>
             <el-form-item
@@ -454,10 +469,25 @@
                 accept=".png, .jpg, .jpeg"
                 @change="uploadImage($event, 2)"
               >
-                <el-button link type="primary">上传</el-button>
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
-                <div class="fileName">{{ IDCardBackName }}</div>
+                <div class="file-box">
+                  <div class="btn-top">
+                    <img class="image-close" @click="deleteImage(2)" src="@/assets/images/close.png" />
+                    <!--                    <el-icon class="btn-icon"><Delete /></el-icon>-->
+                  </div>
+                  <img class="file-img" :src="IDCardBack" />
+                  <div class="btn-bottom">
+                    <el-upload class="width-50" :show-file-list="false" :auto-upload="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 2)" style="display: flex; align-items: center; justify-content: center; color: white">
+                      <el-icon><Upload /></el-icon>重新上传
+                    </el-upload>
+                    <div class="width-50" style="display: flex; align-items: center; justify-content: center; color: white; cursor:pointer;" @click="downloadImage(2)">
+                      <el-icon><Download /></el-icon>下载资料
+                    </div>
+                  </div>
+                </div>
+<!--                <div class="fileName">{{ IDCardBackName }}</div>
                 <div class="fileBtn">
                   <el-upload
                     :auto-upload="false"
@@ -474,7 +504,7 @@
                   /></el-icon>
                   <el-icon class="btn-icon" @click="downloadImage(2)"><Download /></el-icon>
                   <el-icon class="btn-icon" @click="deleteImage(2)"><Delete /></el-icon>
-                </div>
+                </div>-->
               </div>
             </el-form-item>
             <el-form-item
@@ -491,10 +521,25 @@
                 accept=".png, .jpg, .jpeg"
                 @change="uploadImage($event, 3)"
               >
-                <el-button link type="primary">上传</el-button>
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
-                <div class="fileName">{{ bankName }}</div>
+                <div class="file-box">
+                  <div class="btn-top">
+                    <img class="image-close" @click="deleteImage(3)" src="@/assets/images/close.png" />
+                    <!--                    <el-icon class="btn-icon"><Delete /></el-icon>-->
+                  </div>
+                  <img class="file-img" :src="bankSize" />
+                  <div class="btn-bottom">
+                    <el-upload class="width-50" :show-file-list="false" :auto-upload="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 3)" style="display: flex; align-items: center; justify-content: center; color: white">
+                      <el-icon><Upload /></el-icon>重新上传
+                    </el-upload>
+                    <div class="width-50" style="display: flex; align-items: center; justify-content: center; color: white; cursor:pointer;" @click="downloadImage(3)">
+                      <el-icon><Download /></el-icon>下载资料
+                    </div>
+                  </div>
+                </div>
+<!--                <div class="fileName">{{ bankName }}</div>
                 <div class="fileBtn">
                   <el-upload
                     :auto-upload="false"
@@ -511,7 +556,7 @@
                   /></el-icon>
                   <el-icon class="btn-icon" @click="downloadImage(3)"><Download /></el-icon>
                   <el-icon class="btn-icon" @click="deleteImage(3)"><Delete /></el-icon>
-                </div>
+                </div>-->
               </div>
             </el-form-item>
             <el-form-item
@@ -525,19 +570,20 @@
                 v-if="!contract"
                 action="#"
                 :show-file-list="false"
-                accept=".png, .jpg, .jpeg"
+                accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
                 @change="uploadImage($event, 4)"
               >
-                <el-button link type="primary">上传</el-button>
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
+                <img style="width: 40px; height: 40px" :src="contractName.includes('.png') || contractName.includes('.jpg') || contractName.includes('.jpeg')?image:contractName.includes('.pdf')?pdf:contractName.includes('.doc') || contractName.includes('.docx')?word:''" />
                 <div class="fileName">{{ contractName }}</div>
                 <div class="fileBtn">
                   <el-upload
                     :auto-upload="false"
                     action="#"
                     :show-file-list="false"
-                    accept=".png, .jpg, .jpeg"
+                    accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
                     @change="uploadImage($event, 4)"
                     style="display: flex; align-items: center"
                   >
@@ -562,19 +608,20 @@
                 v-if="!applicant"
                 action="#"
                 :show-file-list="false"
-                accept=".png, .jpg, .jpeg"
+                accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
                 @change="uploadImage($event, 5)"
               >
-                <el-button link type="primary">上传</el-button>
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
+                <img style="width: 40px; height: 40px" :src="applicantName.includes('.png') || applicantName.includes('.jpg') || applicantName.includes('.jpeg')?image:applicantName.includes('.pdf')?pdf:applicantName.includes('.doc') || applicantName.includes('.docx')?word:''" />
                 <div class="fileName">{{ applicantName }}</div>
                 <div class="fileBtn">
                   <el-upload
                     :auto-upload="false"
                     action="#"
                     :show-file-list="false"
-                    accept=".png, .jpg, .jpeg"
+                    accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
                     @change="uploadImage($event, 5)"
                     style="display: flex; align-items: center"
                   >
@@ -599,19 +646,20 @@
                 v-if="!decidePay"
                 action="#"
                 :show-file-list="false"
-                accept=".png, .jpg, .jpeg"
+                accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
                 @change="uploadImage($event, 6)"
               >
-                <el-button link type="primary">上传</el-button>
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
+                <img style="width: 40px; height: 40px" :src="decidePayName.includes('.png') || decidePayName.includes('.jpg') || decidePayName.includes('.jpeg')?image:decidePayName.includes('.pdf')?pdf:decidePayName.includes('.doc') || decidePayName.includes('.docx')?word:''" />
                 <div class="fileName">{{ decidePayName }}</div>
                 <div class="fileBtn">
                   <el-upload
                     :auto-upload="false"
                     action="#"
                     :show-file-list="false"
-                    accept=".png, .jpg, .jpeg"
+                    accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
                     @change="uploadImage($event, 6)"
                     style="display: flex; align-items: center"
                   >
@@ -636,19 +684,20 @@
                 v-if="!dimission"
                 action="#"
                 :show-file-list="false"
-                accept=".png, .jpg, .jpeg"
+                accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
                 @change="uploadImage($event, 7)"
               >
-                <el-button link type="primary">上传</el-button>
+                <el-button link type="primary" icon="Upload">上传</el-button>
               </el-upload>
               <div class="fileInfo" v-else>
+                <img style="width: 40px; height: 40px" :src="dimissionName.includes('.png') || dimissionName.includes('.jpg') || dimissionName.includes('.jpeg')?image:dimissionName.includes('.pdf')?pdf:dimissionName.includes('.doc') || dimissionName.includes('.docx')?word:''" />
                 <div class="fileName">{{ dimissionName }}</div>
                 <div class="fileBtn">
                   <el-upload
                     :auto-upload="false"
                     action="#"
                     :show-file-list="false"
-                    accept=".png, .jpg, .jpeg"
+                    accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
                     @change="uploadImage($event, 7)"
                     style="display: flex; align-items: center"
                   >
@@ -686,6 +735,9 @@ import api from "@/api";
 import { ElMessage } from "element-plus";
 import { getDictItems } from "@/api/dict";
 import { useRoute,useRouter } from "vue-router";
+import image from "@/assets/images/image.png";
+import pdf from "@/assets/images/pdf.png";
+import word from "@/assets/images/word.png";
 
 interface dictType {
   value: string;
@@ -1173,7 +1225,7 @@ const onSubmit = async (OperationFormRef: FormInstance, type: number) => {
         typeAttr:2,
         sfz1:sfz1.value,
         sfz2:sfz2.value,
-        bankCard:bankCard.value,
+        // bankCard:bankCard.value,
         contract:contractId.value,
         applicant:applicantId.value,
         salaryTable:salaryTable.value,
@@ -1243,12 +1295,12 @@ function getRoleList() {
   display: flex;
   align-items: center;
   justify-content: flex-start;
-  padding: 2px 20px;
+  //padding: 2px 20px;
   border-radius: 5px;
   margin: 0 10px;
-  &:hover {
-    background: #ccc;
-  }
+  //&:hover {
+  //  background: #ccc;
+  //}
   .fileName {
     width: 200px;
     overflow: hidden;
@@ -1267,6 +1319,44 @@ function getRoleList() {
       }
     }
   }
+  .file-box{
+    position: relative;
+    .btn-top{
+      width: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+      position: absolute;
+      top: 0;
+      left: 0;
+      .image-close{
+        display: block;
+        width: 12px;
+        height: 12px;
+      }
+    }
+    .file-img{
+      display: block;
+      width: 208px;
+      height: 130px;
+      border-radius: 5px;
+    }
+    .btn-bottom{
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      z-index: 1000;
+      display: flex;
+      align-items: center;
+      height: 24px;
+      width: 100%;
+      background: url("@/assets/images/btn-bg.png") no-repeat;
+      background-size: 100% 100%;
+      .width-50{
+        width: 50%;
+      }
+    }
+  }
 }
 .image-view {
   position: absolute;

+ 4 - 0
src/views/personnel/roleManagement.vue

@@ -429,6 +429,7 @@ const dataMarkChange = () => {
   deptIds.value = [];
   disabledTree(deptTreeData.value, roleInfo.deptId);
   roleInfo.deptIds = deptIds.value;
+  console.log(123, roleInfo.deptIds)
   if (deptIds.value.length == 0) {
     deptTree.value!.setCheckedKeys([], false);
   } else {
@@ -489,6 +490,9 @@ function disabledTree(list: any[], id: string) {
 
       //
     } else {
+      if(id && list[i].id === id) {
+        deptIds.value.push(list[i].id);
+      }
       list[i].disabled = false;
     }
     // console.log(list[i].disabled)

+ 11 - 11
src/views/representative/detail.vue

@@ -13,10 +13,10 @@
         </el-col>
         <el-col :span="4" v-show="operationForm.status=='4'">
           <el-button type="primary" @click="toExamine(operationForm, 'success')">审核通过</el-button>
-          
+
             <el-button type="primary" @click="toExamine(operationForm, 'error')"> 审核驳回 </el-button>
-           
-          
+
+
         </el-col>
       </el-row>
       <el-row :gutter="24">
@@ -596,8 +596,8 @@
         </div>
       </template>
     </el-dialog>
-    
-  
+
+
   </div>
 </template>
 
@@ -652,9 +652,9 @@ onMounted(async () => {
   });
   api.userApi
     .getUserInfo({
-      id: route.query.id || "",
+        id: route.query.id || "",
     })
-    .then((res: any) => {
+      .then((res: any) => {
       console.log(res);
       if (res.code === 200) {
         operationForm.value = res.data;
@@ -731,7 +731,7 @@ let operationForm = ref<OperationFormProps>({
   bankName: "",
 });
 
- 
+
 // 身份证人像面
 let IDCardFrontName = ref("");
 let IDCardFront = ref("");
@@ -790,10 +790,10 @@ const toExamine = (item: any, type: string) => {
           .then((res: any) => {
             if (res.code == 200) {
               ElMessage.success("操作成功");
-              
+
             } else {
               ElMessage.error(res.msg);
-              
+
             }
           });
       })
@@ -843,7 +843,7 @@ function confirm() {
     .then((res: any) => {
       if (res.code == 200) {
         ElMessage.success("操作成功");
-        
+
         dialogVisible.value = false;
       }
     });