From 304c10975eb1d73b3932a54084a6bd97960bf33e Mon Sep 17 00:00:00 2001
From: jjLv <1981429112@qq.com>
Date: Sat, 14 Sep 2024 12:13:18 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BA=BA=E5=91=98=E6=96=87=E4=BB=B6=E4=B8=8A?=
 =?UTF-8?q?=E4=BC=A0=E5=B1=95=E7=A4=BA=E6=85=A2=EF=BC=8C=E4=BB=A5=E5=8F=8A?=
 =?UTF-8?q?bug=E9=97=AE=E9=A2=98=E8=A7=A3=E5=86=B3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/base/staff.js          |    9 +
 src/views/base/staff/index.vue | 2353 ++++++++++++++++----------------
 2 files changed, 1191 insertions(+), 1171 deletions(-)

diff --git a/src/api/base/staff.js b/src/api/base/staff.js
index 7bcefe6..c8c442e 100644
--- a/src/api/base/staff.js
+++ b/src/api/base/staff.js
@@ -44,6 +44,15 @@ export function getPersonInfo(data) {
     })
 }
 
+// 文件地址详情
+export function getFileUrl(data) {
+    return request({
+        url: '/bracelet/person/getFileUrl',
+        method: 'post',
+        data: data
+    })
+}
+
 //证书详情
 export function getCertificate(memberId) {
     return request({
diff --git a/src/views/base/staff/index.vue b/src/views/base/staff/index.vue
index 36411cc..5d852cf 100644
--- a/src/views/base/staff/index.vue
+++ b/src/views/base/staff/index.vue
@@ -1,1205 +1,1216 @@
 <template>
-    <div class="app-container">
-      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-        <el-form-item label="姓名" prop="name">
-          <el-input
-            v-model="queryParams.name"
-            placeholder="请输入姓名"
-            clearable
-            @keyup.enter.native="handleQuery"
-            maxlength="30"
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="姓名" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入姓名"
+          clearable
+          @keyup.enter.native="handleQuery"
+          maxlength="30"
+        />
+      </el-form-item>
+      <el-form-item label="性别" prop="sex">
+        <el-select v-model="queryParams.sex" placeholder="性别" clearable>
+          <el-option
+            v-for="dict in dict.type.sys_user_sex"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
           />
-        </el-form-item>
-        <el-form-item label="性别" prop="sex">
-          <el-select v-model="queryParams.sex" placeholder="性别" clearable>
-            <el-option
-              v-for="dict in dict.type.sys_user_sex"
-              :key="dict.value"
-              :label="dict.label"
-              :value="dict.value"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-        </el-form-item>
-      </el-form>
-  
-      <el-row :gutter="10" class="mb8">
-        <el-col :span="1.5">
-          <el-button
-            type="primary"
-            plain
-            icon="el-icon-plus"
-            size="mini"
-            @click="handleAdd"
-            v-hasPermi="['basic:person:add']"
-          >新增人员</el-button>
-        </el-col>
-        <el-col :span="1.5">
-          <el-button
-            type="warning"
-            plain
-            icon="el-icon-download"
-            size="mini"
-            @click="handleExport"
-            v-hasPermi="['basic:person:export']"
-          >导出</el-button>
-        </el-col>
-        <el-col :span="1.5">
-          <el-button
-            type="info"
-            plain
-            icon="el-icon-upload"
-            size="mini"
-            @click="handleImport"
-            v-hasPermi="['basic:person:excelUpload']"
-          >导入人员</el-button>
-        </el-col>
-        <el-col :span="1.5">
-          <el-button
-            type="success"
-            plain
-            icon="el-icon-download"
-            size="mini"
-            @click="handleFile"
-          >模板下载</el-button>
-        </el-col>
-        
-        <!-- <el-col :span="1.5">
-          <el-button
-            type="success"
-            plain
-            icon="el-icon-edit"
-            size="mini"
-            :disabled="single"
-            @click="handleUpdate"
-            v-hasPermi="['basic:person:edit']"
-          >修改</el-button>
-        </el-col>
-        <el-col :span="1.5">
-          <el-button
-            type="danger"
-            plain
-            icon="el-icon-delete"
-            size="mini"
-            :disabled="multiple"
-            @click="handleDelete"
-            v-hasPermi="['basic:person:del']"
-          >删除</el-button>
-        </el-col>
-         -->
-        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-      </el-row>
-  
-      <el-table v-loading="loading" :data="postList" @selection-change="handleSelectionChange">
-        <el-table-column type="selection" width="55" align="center" />
-        <el-table-column label="序号" align="center" width="80" type="index">
-            <template slot-scope="scope">
-              <span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
-            </template>
-          </el-table-column>
-        <el-table-column label="姓名" align="center" prop="name" sortable/>
-        <el-table-column label="性别" align="center" prop="sex" width="80" sortable>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['basic:person:add']"
+        >新增人员</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['basic:person:export']"
+        >导出</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="info"
+          plain
+          icon="el-icon-upload"
+          size="mini"
+          @click="handleImport"
+          v-hasPermi="['basic:person:excelUpload']"
+        >导入人员</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-download"
+          size="mini"
+          @click="handleFile"
+        >模板下载</el-button>
+      </el-col>
+      
+      <!-- <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['basic:person:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['basic:person:del']"
+        >删除</el-button>
+      </el-col>
+       -->
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="postList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="序号" align="center" width="80" type="index">
           <template slot-scope="scope">
-                <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex"/>
-            </template>
-        </el-table-column>
-        <el-table-column label="身份证号" align="center" prop="idCard" width="200" sortable/>
-        <el-table-column label="电话" align="center" prop="phone" sortable/>
-        <el-table-column label="岗位" align="center" prop="post" />
-        <el-table-column label="是否推送人脸库" align="center" prop="post">
-          <template slot-scope="scope">
-               <div v-if="scope.row.isPush==0">未推送</div> 
-               <div v-if="scope.row.isPush==1">已推送</div> 
+            <span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="安全帽编号" align="center" prop="aqmCode" />
-        <el-table-column label="马甲编号" align="center" prop="mjCode" />
-        <el-table-column label="人脸信息" align="center" prop="filePath">
-            <template slot-scope="scope">
-                <div @click="openImg(scope.row.base64Url)"
-                    style="color: #02a7f0; cursor: pointer"
-                    >
-                    <img :src="scope.row.base64Url" style="width: 100px;height: 100px;">
-                </div>
-            </template>
-        </el-table-column> 
-        <el-table-column label="证书" align="center" prop="certificateNum" sortable>
+      <el-table-column label="姓名" align="center" prop="name" sortable/>
+      <el-table-column label="性别" align="center" prop="sex" width="80" sortable>
+        <template slot-scope="scope">
+              <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex"/>
+          </template>
+      </el-table-column>
+      <el-table-column label="身份证号" align="center" prop="idCard" width="200" sortable/>
+      <el-table-column label="电话" align="center" prop="phone" sortable/>
+      <el-table-column label="岗位" align="center" prop="post" />
+      <el-table-column label="是否推送人脸库" align="center" prop="post">
+        <template slot-scope="scope">
+             <div v-if="scope.row.isPush==0">未推送</div> 
+             <div v-if="scope.row.isPush==1">已推送</div> 
+        </template>
+      </el-table-column>
+      <el-table-column label="安全帽编号" align="center" prop="aqmCode" />
+      <el-table-column label="马甲编号" align="center" prop="mjCode" />
+      <el-table-column label="人脸信息" align="center" prop="filePath">
           <template slot-scope="scope">
-              <div @click="openCertificate(scope.row)" style="color: #02a7f0; cursor: pointer">
-                {{ scope.row.certificateNum}}
+              <div @click="openImg(scope.row.base64Url)"
+                  style="color: #02a7f0; cursor: pointer"
+                  >
+                  <img :src="scope.row.base64Url" style="width: 100px;height: 100px;">
               </div>
           </template>
-        </el-table-column> 
-        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="250">
-          <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="text"
-              icon="el-icon-edit"
-              @click="handleUpdate(scope.row)"
-              v-hasPermi="['basic:person:edit']"
-            >修改</el-button>
-            <el-button
-              size="mini"
-              type="text"
-              icon="el-icon-delete"
-              @click="handleDelete(scope.row)"
-              v-hasPermi="['basic:person:del']"
-            >删除</el-button>
-            <el-button
-              size="mini"
-              type="text"
-              icon="el-icon-edit"
-              v-if="scope.row.isPush == 0"
-              @click="pushFace(scope.row)"
-              v-hasPermi="['basic:person:push']"
-            >推送</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-  
-      <pagination
-        v-show="total>0"
-        :total="total"
-        :page.sync="queryParams.pageNum"
-        :limit.sync="queryParams.pageSize"
-        @pagination="getList"
-      />
-      
-      <!-- 证书弹窗 -->
-      <el-dialog :title="title" :visible.sync="showCertificate" width="70%" append-to-body>
-        <el-form ref="certificateForm" :model="certificateForm" label-width="100px">
+      </el-table-column> 
+      <el-table-column label="证书" align="center" prop="certificateNum" sortable>
+        <template slot-scope="scope">
+            <div @click="openCertificate(scope.row)" style="color: #02a7f0; cursor: pointer">
+              {{ scope.row.certificateNum}}
+            </div>
+        </template>
+      </el-table-column> 
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="250">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['basic:person:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['basic:person:del']"
+          >删除</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            v-if="scope.row.isPush == 0"
+            @click="pushFace(scope.row)"
+            v-hasPermi="['basic:person:push']"
+          >推送</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+    
+    <!-- 证书弹窗 -->
+    <el-dialog :title="title" :visible.sync="showCertificate" width="70%" append-to-body>
+      <el-form ref="certificateForm" :model="certificateForm" label-width="100px">
+        <!-- 文件格式下载，图片格式预览 -->
+        <el-form-item label="高处作业证">
+          <el-upload
+              class = "upload-demo"
+              action="#" 
+              :file-list="highImgList"
+              :key="uploadKey"
+              :show-file-list="true"
+              :auto-upload="false"
+              list-type="picture-card"
+              accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
+              :on-change="handleChangeHighImgList"
+              :class="{ disabled: uploadDisabled }"
+              :on-preview="picturePreview"
+              :on-remove="handleRemoveHighImgList"
+          >
           <!-- 文件格式下载，图片格式预览 -->
-          <el-form-item label="高处作业证">
-            <el-upload
-                class = "upload-demo"
-                action="#" 
-                :file-list="highImgList"
-                :show-file-list="true"
-                :auto-upload="false"
-                list-type="picture-card"
-                accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
-                :on-change="handleChangeHighImgList"
-                :class="{ disabled: uploadDisabled }"
-                :on-preview="picturePreview"
-                :on-remove="handleRemoveHighImgList"
-            >
-            <!-- 文件格式下载，图片格式预览 -->
-            <div slot="file" slot-scope="{file}">
-                <img v-if="isImage(file)" class="el-upload-list__item-thumbnail"  :src="file.url" alt="">
-                <div v-else class="picture-card-container" >
-                  <img class="picture-card" :src="urlTemp" alt="">
-                  <p class="file-name">{{ file.name }}</p>
-                </div>
-                <!-- <img v-else class="el-upload-list__item-thumbnail" :src="urlTemp" alt="">
-                <p class=""file-name>{{ file.name }}</p> -->
-                <!-- <div class="file-overlay">
-                  <p class="file-name">{{ file.name }}</p>
-                </div> -->
-                <!-- <p>{{ file.name }}</p> -->
-                <span class="el-upload-list__item-actions">
-                  <span v-if="updataIf(file)" class="el-upload-list__item-delete" @click="handleDownload(file)">
-                  <i class="el-icon-download" />
-                  </span>
-                  <span v-else class="el-upload-list__item-preview" @click="picturePreview(file)">
-                  <i class="el-icon-zoom-in" />
-                  </span>
-                  <span class="el-upload-list__item-delete" @click="handleRemoveHighImgList(file)">
-                  <i class="el-icon-delete" />
-                  </span>
+          <div slot="file" slot-scope="{file}">
+              <img v-if="isImage(file)" class="el-upload-list__item-thumbnail"  :src="file.url" alt="">
+              <div v-else class="picture-card-container" >
+                <img class="picture-card" :src="urlTemp" alt="">
+                <p class="file-name">{{ file.name }}</p>
+              </div>
+              <!-- <img v-else class="el-upload-list__item-thumbnail" :src="urlTemp" alt="">
+              <p class=""file-name>{{ file.name }}</p> -->
+              <!-- <div class="file-overlay">
+                <p class="file-name">{{ file.name }}</p>
+              </div> -->
+              <!-- <p>{{ file.name }}</p> -->
+              <span class="el-upload-list__item-actions">
+                <span v-if="updataIf(file)" class="el-upload-list__item-delete" @click="handleDownload(file)">
+                <i class="el-icon-download" />
                 </span>
-               
-            </div>
-
-
-                <i class="el-icon-plus avatar-uploader-icon" ></i>
-                <!-- <div  slot="tip" class="el-upload__tip">只能上传jpg/png/jpeg/pdf/doc/docx文件，且不超过10Mb</div> -->
-            </el-upload>
-          </el-form-item>
-          <el-form-item label="电工作业证">
-            <el-upload
-                class = "upload-demo"
-                action="#"
-                :file-list="electricianImgList"
-                :show-file-list="true"
-                :auto-upload="false"
-                list-type="picture-card"
-                accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
-                :on-change="handleChangeElectricianImgList"
-                :class="{ disabled: uploadDisabled }"
-                :on-preview="picturePreview"
-                :on-remove="handleRemoveElectricianImgList"
-            >
-
-             <!-- 文件格式下载，图片格式预览 -->
-             <div slot="file" slot-scope="{file}">
-                <img v-if="isImage(file)" class="el-upload-list__item-thumbnail"  :src="file.url" alt="">
-                <div v-else class="picture-card-container" >
-                  <img class="picture-card" :src="urlTemp" alt="">
-                  <p class="file-name">{{ file.name }}</p>
-                </div>
-                <span class="el-upload-list__item-actions">
-                  <span v-if="updataIf(file)" class="el-upload-list__item-delete" @click="handleDownload(file)">
-                  <i class="el-icon-download" />
-                  </span>
-                  <span v-else class="el-upload-list__item-preview" @click="picturePreview(file)">
-                  <i class="el-icon-zoom-in" />
-                  </span>
-                  <span class="el-upload-list__item-delete" @click="handleRemoveElectricianImgList(file)">
-                  <i class="el-icon-delete" />
-                  </span>
+                <span v-else class="el-upload-list__item-preview" @click="picturePreview(file)">
+                <i class="el-icon-zoom-in" />
                 </span>
-            </div>
-
-                <i class="el-icon-plus avatar-uploader-icon" ></i>
-            </el-upload>
-          </el-form-item>
-          <el-form-item label="其他作业证">
-            <el-upload
-                class = "upload-demo"
-                action="#"
-                :file-list="elseImgList"
-                :show-file-list="true"
-                :auto-upload="false"
-                list-type="picture-card"
-                accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
-                :on-change="handleChangeElseImgList"
-                :class="{ disabled: uploadDisabled }"
-                :on-preview="picturePreview"
-                :on-remove="handleRemoveElseImgList"
-            >
-             <!-- 文件格式下载，图片格式预览 -->
-             <div slot="file" slot-scope="{file}">
-                <img v-if="isImage(file)" class="el-upload-list__item-thumbnail"  :src="file.url" alt="">
-                <div v-else class="picture-card-container" >
-                  <img class="picture-card" :src="urlTemp" alt="">
-                  <p class="file-name">{{ file.name }}</p>
-                </div>
-                <span class="el-upload-list__item-actions">
-                  <span v-if="updataIf(file)" class="el-upload-list__item-delete" @click="handleDownload(file)">
-                  <i class="el-icon-download" />
-                  </span>
-                  <span v-else class="el-upload-list__item-preview" @click="picturePreview(file)">
-                  <i class="el-icon-zoom-in" />
-                  </span>
-                  <span class="el-upload-list__item-delete" @click="handleRemoveElseImgList(file)">
-                  <i class="el-icon-delete" />
-                  </span>
+                <span class="el-upload-list__item-delete" @click="handleRemoveHighImgList(file)">
+                <i class="el-icon-delete" />
                 </span>
-            </div>
-                <i  class="el-icon-plus avatar-uploader-icon"></i>
-            </el-upload>
-          </el-form-item>
-        </el-form>
-        <div slot="footer" class="dialog-footer">
-          <el-button type="primary" @click="submitCertificate">确 定</el-button>
-          <el-button @click="cancelCertificate">取 消</el-button>
-        </div>
-      </el-dialog>
-
-      <!-- 添加或修改人员对话框 -->
-      <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body @close="cancel">
-        <el-form ref="form" :model="form" :rules="rules" label-width="100px">
-          <el-form-item label="人员姓名" prop="name">
-            <el-input v-model="form.name" placeholder="请输入人员名称" maxlength="20"/>
-          </el-form-item>
-          <el-form-item label="人员性别" prop="sex">
-            <el-select v-model="form.sex" placeholder="请选择人员性别" clearable style="width: 100%;">
-            <el-option
-              v-for="dict in dict.type.sys_user_sex"
-              :key="dict.value"
-              :label="dict.label"
-              :value="dict.value"
-            />
-          </el-select>
-          </el-form-item>
-          <el-form-item label="身份证号" prop="idCard">
-            <el-input v-model="form.idCard" placeholder="请输入人员身份证号" maxlength="18"/>
-          </el-form-item>
-          <el-form-item label="手机号" prop="phone">
-            <el-input v-model="form.phone" placeholder="请输入人员手机号" maxlength="11"/>
-          </el-form-item>
-          <el-form-item label="安全帽编号" prop="aqmCode">
-            <el-input v-model="form.aqmCode" placeholder="请输入安全帽编号" maxlength="10"/>
-          </el-form-item>
-          <el-form-item label="马甲编号" prop="mjCode">
-            <el-input v-model="form.mjCode" placeholder="请输入马甲编号" maxlength="10"/>
-          </el-form-item>
-          <el-form-item label="人员岗位" prop="post">
-            <el-select v-model="form.post" placeholder="请选择人员岗位" clearable style="width: 100%;">
-            <el-option
-              v-for="dict in dict.type.post_type"
-              :key="dict.value"
-              :label="dict.label"
-              :value="dict.value"
-            />
-          </el-select>
-          </el-form-item>
-          <el-form-item label="人脸照片" prop="fileName">
-            <el-upload
-                action="#"
-                :limit="1"
-                :file-list="fileList"
-                :show-file-list="true"
-                :auto-upload="false"
-                list-type="picture-card"
-                accept=".png, .jpg, .jpeg"
-                :on-change="handleChange"
-                :class="{ disabled: uploadDisabled }"
-                :on-preview="picturePreview"
-                :on-remove="handleRemove"
-            >
-                <i
-                    class="el-icon-plus avatar-uploader-icon"
-                ></i>
-            </el-upload>
-          </el-form-item>
-        </el-form>
-        <div slot="footer" class="dialog-footer">
-          <el-button type="primary" @click="submitForm" :loading="isSubmit">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </el-dialog>
-
-       <!-- 用户导入对话框 -->
-      <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
-        <el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
-          :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
-          :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
-          <i class="el-icon-upload"></i>
-          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
-          <div class="el-upload__tip text-center" slot="tip">
-            <!-- <div class="el-upload__tip" slot="tip">
-              <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的用户数据
-            </div> -->
-            <span>仅允许导入xls、xlsx格式文件。</span>
-            <!-- <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;"
-              @click="importTemplate">下载模板</el-link> -->
-          </div>
-        </el-upload>
-        <div slot="footer" class="dialog-footer">
-          <el-button type="primary" @click="submitFileForm">确 定</el-button>
-          <el-button @click="upload.open = false">取 消</el-button>
-        </div>
-      </el-dialog>
-
-      <!-- 图片查看弹窗 -->
-      <el-dialog :visible.sync="dialogVisible">
-        <img width="100%" height="650px" :src="dialogImageUrl"  />
-      </el-dialog>
-    </div>
-  </template>
-  
-  <script>
-  import { listPerson, addPerson, editPerson, getPersonInfo, delPerson, exportPerson, personFile,getCertificate,updateCertificate,pushFace} from "@/api/base/staff";
-  import { downloadFile,downloadFileData } from '@/utils/download'
-  import { getToken } from '@/utils/auth'
-  import uploadFile from '../../components/uploadFile.vue'
-  export default {
-    name: "Post",
-    dicts: ['sys_normal_disable','sys_user_sex','post_type'],
-    components: {
-			uploadFile
-		},
-    data() {
-      return {
-        // 遮罩层
-        loading: true,
-        isSubmit: false,
-        // 选中数组
-        ids: [],
-        // 非单个禁用
-        single: true,
-        // 非多个禁用
-        multiple: true,
-        // 显示搜索条件
-        showSearch: true,
-        // 总条数
-        total: 0,
-        // 人员表格数据
-        postList: [],
-        // 弹出层标题
-        title: "",
-        // 是否显示弹出层
-        open: false,
-        // 查询参数
-        queryParams: {
-          pageNum: 1,
-          pageSize: 10,
-          name: undefined,
-          sex: undefined,
-          roleCode: this.$store.getters.roleCode,
-          departId: this.$store.getters.departId,
-          teamId: this.$store.getters.teamId,
-        },
-        showCertificate:false,
-        memberId:"",
-
-        accept:'.png, .jpg, .jpeg, .pdf, .doc, .docx',
-        highImgList: [],
-        electricianImgList: [],
-        elseImgList: [],
-        // 表单参数
-        form: {},
-        //图片上传
-        fileList: [],
-        //证书上传
-        certificateForm: {}, 
-        // 人员岗位
-        postTypeArr: [],
-        delHighFileIdList: [],
-        delElectFileIdList: [],
-        delElseFileIdList: [],
-        //图片查看弹窗
-        dialogImageUrl: '',
-        dialogVisible: false,
-        // 用户导入参数
-        upload: {
-          // 是否显示弹出层（用户导入）
-          open: false,
-          // 弹出层标题（用户导入）
-          title: "",
-          // 是否禁用上传
-          isUploading: false,
-          // 是否更新已经存在的用户数据
-          updateSupport: 0,
-          // 设置上传的请求头部
-          headers: { Authorization: "Bearer " + getToken() },
-          // 上传的地址
-          url: process.env.VUE_APP_BASE_API + "/bracelet/person/excelUpload"
-        },
-        // 表单校验
-        rules: {
-          name: [
-            { required: true, message: "人员姓名不能为空", trigger: "blur" }
-          ],
-          sex: [
-            { required: true, message: "人员性别不能为空", trigger: "blur" }
-          ],
-          idCard: [
-            { required: true, message: "身份证号码不能为空", trigger: "blur" },
-            {
-              pattern: /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/,
-              message: "请输入正确的身份证号码",
-              trigger: "blur"
-            }
-          ],
-          phone: [
-            { required: true, message: "手机号不能为空", trigger: "blur" },
-            {
-              pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
-              message: "请输入正确的手机号码",
-              trigger: "blur"
-            }
-          ],
-          // aqmCode: [
-          //   { required: true, message: "安全帽编号不能为空", trigger: "blur" }
-          // ],
-          // mjCode: [
-          //   { required: true, message: "马甲编号不能为空", trigger: "blur" }
-          // ],
-          post: [
-            { required: true, message: "人员岗位不能为空", trigger: "blur" }
-          ],
-          // fileName: [
-          //   { required: true, message: "人脸图片不能为空", trigger: "change" }
-          // ],
-          fileName: [
-            {
-                  required: true,
-                  validator: this.fileMustUpload,
-                  trigger: "change",
-            },
-          ],
-        }
-      };
-    },
-    computed: {
-     
-        //图片上传1张后，隐藏上传框
-        uploadDisabled() {
-            return this.fileList.length > 0
-        },
-    },
-    created() {
-      this.getList();
-    },
-    methods: {
-        // base64转blob
-        base64ToBlob(code) {
-          let parts = code.split(";base64,");
-          let contentType = parts[0].split(":")[1];
-          let raw = window.atob(parts[1]);
-          let rawLength = raw.length;
-          let uInt8Array = new Uint8Array(rawLength);
-          for (let i = 0; i < rawLength; ++i) {
-            uInt8Array[i] = raw.charCodeAt(i);
-          }
-          return new Blob([uInt8Array], { type: contentType });
-        },
-
-        isImage(file){
-            this.urlTemp = require('@/assets/file.png');
-            if(this.updataIf(file)){
-                return false
-          }else{
-            return true
-          }
-        },
-      // 判断文件类型,图片预览，文件下载
-       updataIf(e) {
-                if (e.fileName) {
-                    if (e.fileName.split('.')[1] === 'png' || e.fileName.split('.')[1] === 'jpeg' || e.fileName.split('.')[1] === 'jpg') {
-                        return false
-                    } else {
-                    return true
-                    }
-                } else {
-                    if (e.name.split('.')[1] === 'png' || e.name.split('.')[1] === 'jpeg' || e.name.split('.')[1] === 'jpg') {
-                        return false
-                    } else {
-                        return true
-                    }
-                }
-            },
-      handleDownload(file) {
-        console.log(file.url)
-        if(file.status === 'ready'){
-                downloadFile({ fileName: file.name, fileData: file.raw, fileType: 'application/vnd.ms-excel;charset=utf-8' })
-        }else if(file.status === 'success'){
-                downloadFileData({ fileName: file.name,fileUrl:file.url })
-        }
-      },
-      //上传组件-图片查看
-      picturePreview(file) {
-        this.dialogImageUrl = file.url;
-        if(file.name.split('.')[1] === 'doc'||file.name.split('.')[1] === 'docx'||file.name.split('.')[1] === 'pdf'){
-          const windowName = file.name;
-          window.open(file.url,windowName)
-        }else{
-          this.dialogVisible = true
-        }
-      },
-       //自定义人脸图片必填校验
-       fileMustUpload(rule, value, callback) {
-          if (this.form.fileName == '') {
-            // 未上传文件
-            callback("请上传人脸图片");
-          }
-          callback();//不要忘记写这个callback
-        },
-        /** 查询人员列表 */
-        getList() {
-            this.loading = true;
-            listPerson(this.queryParams).then(response => {
-              this.postList = response.rows;
-              this.total = response.total;
-              this.loading = false;
-            });
-        },
-        // 取消按钮
-        cancel() {
-            this.open = false;
-            this.fileList=[];
-            this.reset();
-        },
-        // 表单重置
-        reset() {
-            this.form = {};
-            this.resetForm("form");
-        },
-        /** 搜索按钮操作 */
-        handleQuery() {
-            this.queryParams.pageNum = 1;
-            this.getList();
-        },
-        /** 重置按钮操作 */
-        resetQuery() {
-            this.resetForm("queryForm");
-            this.handleQuery();
-        },
-        // 多选框选中数据
-        handleSelectionChange(selection) {
-            this.ids = selection.map(item => item.id)
-            this.single = selection.length!=1
-            this.multiple = !selection.length
-        },
-        /** 新增按钮操作 */
-        handleAdd() {
-            this.fileList = []
-            this.reset();
-            this.open = true;
-            this.title = "添加人员";
-        },
-        // 图片上传
-        handleChange(file, fileList) {
-            // console.log(file)
-            this.form.fileName = file.name;
-            this.$refs["form"].clearValidate()
-            this.fileList = fileList;
-        },
-        handleChangeHighImgList(file, fileList) {
-          console.log(fileList.length)
-          if(fileList.length > 5){
-            this.$message.warning('最多上传5张图片')
-            fileList = fileList.filter(item => {
-                return item.uid != file.uid
-            })
-          }
-            const fileListTemp = fileList.filter(item => {
-                        return item.uid != file.uid
-                    });
-                
-            if(!(file.name.split('.')[1] === 'doc'||file.name.split('.')[1] === 'docx'||file.name.split('.')[1] === 'pdf' || file.name.split('.')[1] === 'png' || file.name.split('.')[1] === 'jpg' || file.name.split('.')[1] === 'jpeg')){
-                this.$message.warning('文件格式不正确')
-                fileList = fileList.filter(item => {
-                    return item.uid != file.uid
-                })
-            }
-            if(file.size > 1024 * 1024 * 10){
-                    this.$message.warning('文件大小不能超过10Mb')
-                    fileList = fileList.filter(item => {
-                        return item.uid != file.uid
-                    })
-                }
-            if(file.name.length > 40){
-                    this.$message.warning('文件名长度不能超过40个字符')
-                    fileList = fileList.filter(item => {
-                        return item.uid != file.uid
-                    })
-                }
-            if(fileListTemp.some(item =>item.name === file.name)){
-                    this.$message.warning('文件名重复')
-                    fileList = fileList.filter(item => {
-                        return item.uid != file.uid
-                    })
-                }
-                fileList.forEach(file=>{
-                    if(file.name.split('.')[1] === 'doc'||file.name.split('.')[1] === 'docx'||file.name.split('.')[1] === 'pdf'){
-                        this.urlTemp = require('../../../assets/file.png');
-                    
-                    }
-                  }),
-            this.highImgList = fileList;
-        },
-        handleChangeElectricianImgList(file, fileList) {
-          const fileListTemp = fileList.filter(item => {
-                        return item.uid != file.uid
-                    });
-            if(fileList.length > 5){
-            this.$message.warning('最多上传5张图片')
-            fileList = fileList.filter(item => {
-                return item.uid != file.uid
-            })
-          }
-            if(!(file.name.split('.')[1] === 'doc'||file.name.split('.')[1] === 'docx'||file.name.split('.')[1] === 'pdf' || file.name.split('.')[1] === 'png' || file.name.split('.')[1] === 'jpg' || file.name.split('.')[1] === 'jpeg')){
-                this.$message.warning('文件格式不正确')
-                fileList = fileList.filter(item => {
-                    return item.uid != file.uid
-                })
-            }
-            if(file.size > 1024 * 1024 * 10){
-                    this.$message.warning('文件大小不能超过10Mb')
-                    fileList = fileList.filter(item => {
-                        return item.uid != file.uid
-                    })
-                }
-            if(file.name.length > 40){
-                    this.$message.warning('文件名长度不能超过40个字符')
-                    fileList = fileList.filter(item => {
-                        return item.uid != file.uid
-                    })
-                }
-            if(fileListTemp.some(item =>item.name === file.name)){
-                    this.$message.warning('文件名重复')
-                    fileList = fileList.filter(item => {
-                        return item.uid != file.uid
-                    })
-                }
-                fileList.forEach(file=>{
-                    if(file.name.split('.')[1] === 'doc'||file.name.split('.')[1] === 'docx'||file.name.split('.')[1] === 'pdf'){
-                        this.urlTemp = require('../../../assets/file.png');
-                    
-                    }
-                  }),
-            this.electricianImgList = fileList;
-        },
-        handleChangeElseImgList(file, fileList) {
-          const fileListTemp = fileList.filter(item => {
-                        return item.uid != file.uid
-                    });
-            if(fileList.length > 5){
-            this.$message.warning('最多上传5张图片')
-            fileList = fileList.filter(item => {
-                return item.uid != file.uid
-            })
-          }
-            if(!(file.name.split('.')[1] === 'doc'||file.name.split('.')[1] === 'docx'||file.name.split('.')[1] === 'pdf' || file.name.split('.')[1] === 'png' || file.name.split('.')[1] === 'jpg' || file.name.split('.')[1] === 'jpeg')){
-                this.$message.warning('文件格式不正确')
-                fileList = fileList.filter(item => {
-                    return item.uid != file.uid
-                })
-            }
-            if(file.size > 1024 * 1024 * 10){
-                    this.$message.warning('文件大小不能超过10Mb')
-                    fileList = fileList.filter(item => {
-                        return item.uid != file.uid
-                    })
-                }
-            if(file.name.length > 40){
-                    this.$message.warning('文件名长度不能超过40个字符')
-                    fileList = fileList.filter(item => {
-                        return item.uid != file.uid
-                    })
-                }
-            if(fileListTemp.some(item =>item.name === file.name)){
-                    this.$message.warning('文件名重复')
-                    fileList = fileList.filter(item => {
-                        return item.uid != file.uid
-                    })
-                }
-                fileList.forEach(file=>{
-                    if(file.name.split('.')[1] === 'doc'||file.name.split('.')[1] === 'docx'||file.name.split('.')[1] === 'pdf'){
-                        this.urlTemp = require('../../../assets/file.png');
-                    
-                    }
-                  }),
-            this.elseImgList = fileList;
-        },
-        //图片删除
-        handleRemove(file, fileList) {
-            let sum = 0
-            this.fileList.forEach((item, index) => {
-                if (item.uid == file.uid) {
-                  if(!item?.hasOwnProperty('raw')) {
-                    this.form.delFiles = this.form.filePath;
-                  }
-                  sum = index;
-                }
-            })
-            this.fileList.splice(sum, 1)
-            this.form.fileName = '';
-        },
-        handleRemoveHighImgList(file, fileList) {
-            let sum = 0
-            this.highImgList.forEach((item, index) => {
-                if (item.uid == file.uid) {
-                    sum = index
-                }
-            })
-            this.delHighFileIdList.push(this.highImgList[sum].fileId)
-            this.highImgList.splice(sum, 1)
-        },
-        handleRemoveElectricianImgList(file, fileList) {
-            let sum = 0
-            this.electricianImgList.forEach((item, index) => {
-                if (item.uid == file.uid) {
-                    sum = index
-                }
-            })
-            this.delElectFileIdList.push(this.electricianImgList[sum].fileId)
-            this.electricianImgList.splice(sum, 1)
-        },
-        handleRemoveElseImgList(file, fileList) {
-            let sum = 0
-            this.elseImgList.forEach((item, index) => {
-                if (item.uid == file.uid) {
-                    sum = index
-                }
-            })
-            this.delElseFileIdList.push(this.elseImgList[sum].fileId)
-            this.elseImgList.splice(sum, 1)
-        },
-        //列表-图片查看
-        openImg(url) {
-            this.dialogImageUrl = url
-            this.dialogVisible = true
-        },
-
-        /** 修改按钮操作 */
-        handleUpdate(row) {
-            this.reset();
-            const id = row.id
-            this.fileList=[];
-            getPersonInfo({id:id}).then(response => {
-              this.form = response.data;
-              this.$set(this.form,'sex',response.data.sex+'')
-              this.fileList.push({
-                name: response.data.fileId,
-                url: response.data.base64Url,
-              })
-              //触发校验
-              this.form.fileName = response.data.fileId;
-                this.open = true;
-                this.title = "修改人员";
+              </span>
              
-            });
-        },
-        /** 提交按钮 */
-        submitForm() { 
-            this.$refs["form"].validate(valid => {
-            if (valid) {
-                if (this.form.id != undefined) {
-                  //base64地址别传后台，过长
-                  this.form.base64Url = '';
-                  const reqData = new FormData()
-                  reqData.append('params', JSON.stringify(this.form))
-                  const { file } = this.getFileData()
-                  file.forEach(item => {
-                    reqData.append('file', item)
-                  })
-                  this.isSubmit=true;
-                  editPerson(reqData).then(response => {
-                    if(response.code==200){
-                      this.$modal.msgSuccess("修改成功");
-                      this.open = false;
-                      this.fileList=[];
-                      this.getList();
-                      this.isSubmit=false;
-                    }else{
-                      this.isSubmit=false;
-                    }
-                  }).catch(res=>{
-                    this.isSubmit=false;
+          </div>
+
+
+              <i class="el-icon-plus avatar-uploader-icon" ></i>
+              <!-- <div  slot="tip" class="el-upload__tip">只能上传jpg/png/jpeg/pdf/doc/docx文件，且不超过10Mb</div> -->
+          </el-upload>
+        </el-form-item>
+        <el-form-item label="电工作业证">
+          <el-upload
+              class = "upload-demo"
+              action="#"
+              :file-list="electricianImgList"
+              :key="uploadKey"
+              :show-file-list="true"
+              :auto-upload="false"
+              list-type="picture-card"
+              accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
+              :on-change="handleChangeElectricianImgList"
+              :class="{ disabled: uploadDisabled }"
+              :on-preview="picturePreview"
+              :on-remove="handleRemoveElectricianImgList"
+          >
+
+           <!-- 文件格式下载，图片格式预览 -->
+           <div slot="file" slot-scope="{file}">
+              <img v-if="isImage(file)" class="el-upload-list__item-thumbnail"  :src="file.url" alt="">
+              <div v-else class="picture-card-container" >
+                <img class="picture-card" :src="urlTemp" alt="">
+                <p class="file-name">{{ file.name }}</p>
+              </div>
+              <span class="el-upload-list__item-actions">
+                <span v-if="updataIf(file)" class="el-upload-list__item-delete" @click="handleDownload(file)">
+                <i class="el-icon-download" />
+                </span>
+                <span v-else class="el-upload-list__item-preview" @click="picturePreview(file)">
+                <i class="el-icon-zoom-in" />
+                </span>
+                <span class="el-upload-list__item-delete" @click="handleRemoveElectricianImgList(file)">
+                <i class="el-icon-delete" />
+                </span>
+              </span>
+          </div>
+
+              <i class="el-icon-plus avatar-uploader-icon" ></i>
+          </el-upload>
+        </el-form-item>
+        <el-form-item label="其他作业证">
+          <el-upload
+              class = "upload-demo"
+              action="#"
+              :file-list="elseImgList"
+              :key="uploadKey"
+              :show-file-list="true"
+              :auto-upload="false"
+              list-type="picture-card"
+              accept=".png, .jpg, .jpeg, .pdf, .doc, .docx"
+              :on-change="handleChangeElseImgList"
+              :class="{ disabled: uploadDisabled }"
+              :on-preview="picturePreview"
+              :on-remove="handleRemoveElseImgList"
+          >
+           <!-- 文件格式下载，图片格式预览 -->
+           <div slot="file" slot-scope="{file}">
+              <img v-if="isImage(file)" class="el-upload-list__item-thumbnail"  :src="file.url" alt="">
+              <div v-else class="picture-card-container" >
+                <img class="picture-card" :src="urlTemp" alt="">
+                <p class="file-name">{{ file.name }}</p>
+              </div>
+              <span class="el-upload-list__item-actions">
+                <span v-if="updataIf(file)" class="el-upload-list__item-delete" @click="handleDownload(file)">
+                <i class="el-icon-download" />
+                </span>
+                <span v-else class="el-upload-list__item-preview" @click="picturePreview(file)">
+                <i class="el-icon-zoom-in" />
+                </span>
+                <span class="el-upload-list__item-delete" @click="handleRemoveElseImgList(file)">
+                <i class="el-icon-delete" />
+                </span>
+              </span>
+          </div>
+              <i  class="el-icon-plus avatar-uploader-icon"></i>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitCertificate">确 定</el-button>
+        <el-button @click="cancelCertificate">取 消</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 添加或修改人员对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body @close="cancel">
+      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+        <el-form-item label="人员姓名" prop="name">
+          <el-input v-model="form.name" placeholder="请输入人员名称" maxlength="20"/>
+        </el-form-item>
+        <el-form-item label="人员性别" prop="sex">
+          <el-select v-model="form.sex" placeholder="请选择人员性别" clearable style="width: 100%;">
+          <el-option
+            v-for="dict in dict.type.sys_user_sex"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+        </el-form-item>
+        <el-form-item label="身份证号" prop="idCard">
+          <el-input v-model="form.idCard" placeholder="请输入人员身份证号" maxlength="18"/>
+        </el-form-item>
+        <el-form-item label="手机号" prop="phone">
+          <el-input v-model="form.phone" placeholder="请输入人员手机号" maxlength="11"/>
+        </el-form-item>
+        <el-form-item label="安全帽编号" prop="aqmCode">
+          <el-input v-model="form.aqmCode" placeholder="请输入安全帽编号" maxlength="10"/>
+        </el-form-item>
+        <el-form-item label="马甲编号" prop="mjCode">
+          <el-input v-model="form.mjCode" placeholder="请输入马甲编号" maxlength="10"/>
+        </el-form-item>
+        <el-form-item label="人员岗位" prop="post">
+          <el-select v-model="form.post" placeholder="请选择人员岗位" clearable style="width: 100%;">
+          <el-option
+            v-for="dict in dict.type.post_type"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+        </el-form-item>
+        <el-form-item label="人脸照片" prop="fileName">
+          <el-upload
+              action="#"
+              :limit="1"
+              :file-list="fileList"
+              :show-file-list="true"
+              :auto-upload="false"
+              list-type="picture-card"
+              accept=".png, .jpg, .jpeg"
+              :on-change="handleChange"
+              :class="{ disabled: uploadDisabled }"
+              :on-preview="picturePreview"
+              :on-remove="handleRemove"
+          >
+              <i
+                  class="el-icon-plus avatar-uploader-icon"
+              ></i>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm" :loading="isSubmit">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+
+     <!-- 用户导入对话框 -->
+    <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
+      <el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
+        :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
+        :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
+        <i class="el-icon-upload"></i>
+        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+        <div class="el-upload__tip text-center" slot="tip">
+          <!-- <div class="el-upload__tip" slot="tip">
+            <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的用户数据
+          </div> -->
+          <span>仅允许导入xls、xlsx格式文件。</span>
+          <!-- <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;"
+            @click="importTemplate">下载模板</el-link> -->
+        </div>
+      </el-upload>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitFileForm">确 定</el-button>
+        <el-button @click="upload.open = false">取 消</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 图片查看弹窗 -->
+    <el-dialog :visible.sync="dialogVisible">
+      <img width="100%" height="650px" :src="dialogImageUrl"  />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listPerson, addPerson, editPerson, getPersonInfo, delPerson, exportPerson, personFile,getCertificate,updateCertificate,pushFace,getFileUrl} from "@/api/base/staff";
+import { downloadFile,downloadFileData } from '@/utils/download'
+import { getToken } from '@/utils/auth'
+import uploadFile from '../../components/uploadFile.vue'
+export default {
+  name: "Post",
+  dicts: ['sys_normal_disable','sys_user_sex','post_type'],
+  components: {
+    uploadFile
+  },
+  data() {
+    return {
+      uploadKey: Date.now(),
+      // 遮罩层
+      loading: true,
+      isSubmit: false,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 人员表格数据
+      postList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        name: undefined,
+        sex: undefined,
+        roleCode: this.$store.getters.roleCode,
+        departId: this.$store.getters.departId,
+        teamId: this.$store.getters.teamId,
+      },
+      showCertificate:false,
+      memberId:"",
+
+      accept:'.png, .jpg, .jpeg, .pdf, .doc, .docx',
+      highImgList: [],
+      electricianImgList: [],
+      elseImgList: [],
+      // 表单参数
+      form: {},
+      //图片上传
+      fileList: [],
+      //证书上传
+      certificateForm: {}, 
+      // 人员岗位
+      postTypeArr: [],
+      delHighFileIdList: [],
+      delElectFileIdList: [],
+      delElseFileIdList: [],
+      //图片查看弹窗
+      dialogImageUrl: '',
+      dialogVisible: false,
+      // 用户导入参数
+      upload: {
+        // 是否显示弹出层（用户导入）
+        open: false,
+        // 弹出层标题（用户导入）
+        title: "",
+        // 是否禁用上传
+        isUploading: false,
+        // 是否更新已经存在的用户数据
+        updateSupport: 0,
+        // 设置上传的请求头部
+        headers: { Authorization: "Bearer " + getToken() },
+        // 上传的地址
+        url: process.env.VUE_APP_BASE_API + "/bracelet/person/excelUpload"
+      },
+      // 表单校验
+      rules: {
+        name: [
+          { required: true, message: "人员姓名不能为空", trigger: "blur" }
+        ],
+        sex: [
+          { required: true, message: "人员性别不能为空", trigger: "blur" }
+        ],
+        idCard: [
+          { required: true, message: "身份证号码不能为空", trigger: "blur" },
+          {
+            pattern: /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/,
+            message: "请输入正确的身份证号码",
+            trigger: "blur"
+          }
+        ],
+        phone: [
+          { required: true, message: "手机号不能为空", trigger: "blur" },
+          {
+            pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
+            message: "请输入正确的手机号码",
+            trigger: "blur"
+          }
+        ],
+        // aqmCode: [
+        //   { required: true, message: "安全帽编号不能为空", trigger: "blur" }
+        // ],
+        // mjCode: [
+        //   { required: true, message: "马甲编号不能为空", trigger: "blur" }
+        // ],
+        post: [
+          { required: true, message: "人员岗位不能为空", trigger: "blur" }
+        ],
+        // fileName: [
+        //   { required: true, message: "人脸图片不能为空", trigger: "change" }
+        // ],
+        fileName: [
+          {
+                required: true,
+                validator: this.fileMustUpload,
+                trigger: "change",
+          },
+        ],
+      }
+    };
+  },
+  computed: {
+   
+      //图片上传1张后，隐藏上传框
+      uploadDisabled() {
+          return this.fileList.length > 0
+      },
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+      // base64转blob
+      base64ToBlob(code) {
+        let parts = code.split(";base64,");
+        let contentType = parts[0].split(":")[1];
+        let raw = window.atob(parts[1]);
+        let rawLength = raw.length;
+        let uInt8Array = new Uint8Array(rawLength);
+        for (let i = 0; i < rawLength; ++i) {
+          uInt8Array[i] = raw.charCodeAt(i);
+        }
+        return new Blob([uInt8Array], { type: contentType });
+      },
+
+      isImage(file){
+          this.urlTemp = require('@/assets/file.png');
+          if(this.updataIf(file)){
+              return false
+        }else{
+          return true
+        }
+      },
+    // 判断文件类型,图片预览，文件下载
+     updataIf(e) {
+              if (e.fileName) {
+                const parts = e.fileName.split('.');
+                const extension = parts.pop();
+                  if (extension === 'png' || extension === 'jpeg' || extension === 'jpg') {
+                      return false
+                  } else {
+                  return true
+                  }
+              } else {
+                const parts = e.name.split('.');
+                const extension = parts.pop();
+                  if (extension === 'png' || extension === 'jpeg' || extension === 'jpg') {
+                      return false
+                  } else {
+                      return true
+                  }
+              }
+          },
+    handleDownload(file) {
+      console.log(file)
+      if(file.status === 'ready'){
+              downloadFile({ fileName: file.name, fileData: file.raw, fileType: 'application/vnd.ms-excel;charset=utf-8' })
+      }else if(file.status === 'success'){
+              getFileUrl({ filePath: file.fileId }).then(response => {
+                  downloadFileData({ fileName: file.name,fileUrl: URL.createObjectURL(this.base64ToBlob(response.data.bast64Image)) })
+              })
+              // downloadFileData({ fileName: file.name,fileUrl:file.url })
+      }
+    },
+    //上传组件-图片查看
+    picturePreview(file) {
+      this.dialogImageUrl = file.url;
+      const parts = file.name.split('.');
+      const extension = parts.pop();
+      if(extension === 'doc'||extension === 'docx'||extension === 'pdf'){
+        const windowName = file.name;
+        window.open(file.url,windowName)
+      }else{
+        this.dialogVisible = true
+      }
+    },
+     //自定义人脸图片必填校验
+     fileMustUpload(rule, value, callback) {
+        if (this.form.fileName == '') {
+          // 未上传文件
+          callback("请上传人脸图片");
+        }
+        callback();//不要忘记写这个callback
+      },
+      /** 查询人员列表 */
+      getList() {
+          this.loading = true;
+          listPerson(this.queryParams).then(response => {
+            this.postList = response.rows;
+            this.total = response.total;
+            this.loading = false;
+          });
+      },
+      // 取消按钮
+      cancel() {
+          this.open = false;
+          this.fileList=[];
+          this.reset();
+      },
+      // 表单重置
+      reset() {
+          this.form = {};
+          this.resetForm("form");
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+          this.queryParams.pageNum = 1;
+          this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+          this.resetForm("queryForm");
+          this.handleQuery();
+      },
+      // 多选框选中数据
+      handleSelectionChange(selection) {
+          this.ids = selection.map(item => item.id)
+          this.single = selection.length!=1
+          this.multiple = !selection.length
+      },
+      /** 新增按钮操作 */
+      handleAdd() {
+          this.fileList = []
+          this.reset();
+          this.open = true;
+          this.title = "添加人员";
+      },
+      // 图片上传
+      handleChange(file, fileList) {
+          // console.log(file)
+          this.form.fileName = file.name;
+          this.$refs["form"].clearValidate()
+          this.fileList = fileList;
+      },
+      handleChangeHighImgList(file, fileList) {
+        const fileListTemp = fileList.filter(item => {
+                      return item.uid != file.uid
                   });
-                } else {
-                  
-                  const reqData = new FormData()
-                  reqData.append('params', JSON.stringify(this.form))
-                  const { file } = this.getFileData()
-                  file.forEach(item => {
-                    reqData.append('file', item)
+        const parts = file.name.split('.');
+        const extension = parts.pop();
+        if(fileList.length > 5){
+          this.$message.warning('最多上传5张证书')
+          fileList = fileList.filter(item => {
+              return item.uid != file.uid
+          })
+        }else if(!(extension === 'doc'||extension === 'docx'||extension === 'pdf' || extension === 'png' || extension === 'jpg' || extension === 'jpeg')){
+              this.$message.warning('文件格式不正确')
+              fileList = fileList.filter(item => {
+                  return item.uid != file.uid
+              })
+        }else if(file.size > 1024 * 1024 * 10){
+                  this.$message.warning('文件大小不能超过10Mb')
+                  fileList = fileList.filter(item => {
+                      return item.uid != file.uid
                   })
-                  this.isSubmit=true;
-                  addPerson(reqData).then(response => {
-                    if(response.code==200){
-                      this.$modal.msgSuccess("新增成功");
-                      this.open = false;
-                      this.fileList=[];
-                      this.getList();
-                      this.isSubmit=false;
-                    }else{
-                      this.isSubmit=false;
-                    }
-                  }).catch(res=>{
-                    this.isSubmit=false;
-                  });;
+        }else if(file.name.length > 40){
+                  this.$message.warning('文件名长度不能超过40个字符')
+                  fileList = fileList.filter(item => {
+                      return item.uid != file.uid
+                  })
+        }else if(fileListTemp.some(item =>item.name === file.name)){
+                  this.$message.warning('文件名重复')
+                  fileList = fileList.filter(item => {
+                      return item.uid != file.uid
+                  })
+        }
+        fileList.forEach(file=>{
+                  if(extension === 'doc'||extension === 'docx'||extension === 'pdf'){
+                      this.urlTemp = require('../../../assets/file.png');
+                  
+                  }
+        }),
+        this.highImgList = fileList;
+      },
+      handleChangeElectricianImgList(file, fileList) {
+        const fileListTemp = fileList.filter(item => {
+                      return item.uid != file.uid
+                  });
+        const parts = file.name.split('.');
+        const extension = parts.pop();
+          if(fileList.length > 5){
+          this.$message.warning('最多上传5张证书')
+          fileList = fileList.filter(item => {
+              return item.uid != file.uid
+          })
+        }else if(!(extension === 'doc'||extension === 'docx'||extension === 'pdf' || extension === 'png' || extension === 'jpg' || extension === 'jpeg')){
+              this.$message.warning('文件格式不正确')
+              fileList = fileList.filter(item => {
+                  return item.uid != file.uid
+              })
+        }else if(file.size > 1024 * 1024 * 10){
+                  this.$message.warning('文件大小不能超过10Mb')
+                  fileList = fileList.filter(item => {
+                      return item.uid != file.uid
+                  })
+        }else if(file.name.length > 40){
+                  this.$message.warning('文件名长度不能超过40个字符')
+                  fileList = fileList.filter(item => {
+                      return item.uid != file.uid
+                  })
+        }else if(fileListTemp.some(item =>item.name === file.name)){
+                  this.$message.warning('文件名重复')
+                  fileList = fileList.filter(item => {
+                      return item.uid != file.uid
+                  })
+        }
+        fileList.forEach(file=>{
+                  if(extension === 'doc'||extension === 'docx'||extension === 'pdf'){
+                      this.urlTemp = require('../../../assets/file.png');
+                  
+                  }
+        }),
+        this.electricianImgList = fileList;
+      },
+      handleChangeElseImgList(file, fileList) {
+        const fileListTemp = fileList.filter(item => {
+                      return item.uid != file.uid
+                  });
+        const parts = file.name.split('.');
+        const extension = parts.pop();
+        if(fileList.length > 5){
+          this.$message.warning('最多上传5张证书')
+          fileList = fileList.filter(item => {
+              return item.uid != file.uid
+          })
+        }else if(!(extension === 'doc'||extension === 'docx'||extension === 'pdf' || extension === 'png' || extension === 'jpg' || extension === 'jpeg')){
+              this.$message.warning('文件格式不正确')
+              fileList = fileList.filter(item => {
+                  return item.uid != file.uid
+              })
+        }else if(file.size > 1024 * 1024 * 10){
+                  this.$message.warning('文件大小不能超过10Mb')
+                  fileList = fileList.filter(item => {
+                      return item.uid != file.uid
+                  })
+        }else if(file.name.length > 40){
+                  this.$message.warning('文件名长度不能超过40个字符')
+                  fileList = fileList.filter(item => {
+                      return item.uid != file.uid
+                  })
+        }else if(fileListTemp.some(item =>item.name === file.name)){
+                  this.$message.warning('文件名重复')
+                  fileList = fileList.filter(item => {
+                      return item.uid != file.uid
+                  })
+        }
+        fileList.forEach(file=>{
+                  if(extension === 'doc'||extension === 'docx'||extension === 'pdf'){
+                      this.urlTemp = require('../../../assets/file.png');
+                  
+                  }
+        }),
+        this.elseImgList = fileList;
+      },
+      //图片删除
+      handleRemove(file, fileList) {
+          let sum = 0
+          this.fileList.forEach((item, index) => {
+              if (item.uid == file.uid) {
+                if(!item?.hasOwnProperty('raw')) {
+                  this.form.delFiles = this.form.filePath;
                 }
-            }
-            });
-        },
-
-        //提交时循环fileList 获取raw文件
-        getFileData() {
-          const file = []
-          this.fileList.forEach(item => {
-            if (item?.hasOwnProperty('raw')) {
-              file.push(item.raw)
-            }
+                sum = index;
+              }
           })
-          return { file }
-        },
-
-        //提交时循环highImgList获取raw文件
-        getHighImgListFileData() {
-          const highfile = []
-          this.highImgList.forEach(item => {
-            if (item?.hasOwnProperty('size')) {
-              highfile.push(item.raw)
-            }
+          this.fileList.splice(sum, 1)
+          this.form.fileName = '';
+      },
+      handleRemoveHighImgList(file, fileList) {
+          let sum = 0
+          this.highImgList.forEach((item, index) => {
+              if (item.uid == file.uid) {
+                  sum = index
+              }
           })
-          console.log(highfile)
-          return { highfile }
-        },
-
-        //提交时循环electricianImgList获取raw文件
-        getElectricianImgListFileData() {
-          const electfile = []
-          this.electricianImgList.forEach(item => {
-            if (item?.hasOwnProperty('size')) {
-              electfile.push(item.raw)
-            }
+          this.delHighFileIdList.push(this.highImgList[sum].fileId)
+          this.highImgList.splice(sum, 1)
+      },
+      handleRemoveElectricianImgList(file, fileList) {
+          let sum = 0
+          this.electricianImgList.forEach((item, index) => {
+              if (item.uid == file.uid) {
+                  sum = index
+              }
           })
-          return { electfile }
-        },
+          this.delElectFileIdList.push(this.electricianImgList[sum].fileId)
+          this.electricianImgList.splice(sum, 1)
+      },
+      handleRemoveElseImgList(file, fileList) {
+          let sum = 0
+          this.elseImgList.forEach((item, index) => {
+              if (item.uid == file.uid) {
+                  sum = index
+              }
+          })
+          this.delElseFileIdList.push(this.elseImgList[sum].fileId)
+          this.elseImgList.splice(sum, 1)
+      },
+      //列表-图片查看
+      openImg(url) {
+          this.dialogImageUrl = url
+          this.dialogVisible = true
+      },
 
-        //提交时循环elseImgList获取raw文件
-        getElseImgListFileData() {
-        const elsefile = []
-        this.elseImgList.forEach(item => {
-          if (item?.hasOwnProperty('size')) {
-            elsefile.push(item.raw)
+      /** 修改按钮操作 */
+      handleUpdate(row) {
+          this.reset();
+          const id = row.id
+          this.fileList=[];
+          getPersonInfo({id:id}).then(response => {
+            this.form = response.data;
+            this.$set(this.form,'sex',response.data.sex+'')
+            this.fileList.push({
+              name: response.data.fileId,
+              url: response.data.base64Url,
+            })
+            //触发校验
+            this.form.fileName = response.data.fileId;
+              this.open = true;
+              this.title = "修改人员";
+           
+          });
+      },
+      /** 提交按钮 */
+      submitForm() { 
+          this.$refs["form"].validate(valid => {
+          if (valid) {
+              if (this.form.id != undefined) {
+                //base64地址别传后台，过长
+                this.form.base64Url = '';
+                const reqData = new FormData()
+                reqData.append('params', JSON.stringify(this.form))
+                const { file } = this.getFileData()
+                file.forEach(item => {
+                  reqData.append('file', item)
+                })
+                this.isSubmit=true;
+                editPerson(reqData).then(response => {
+                  if(response.code==200){
+                    this.$modal.msgSuccess("修改成功");
+                    this.open = false;
+                    this.fileList=[];
+                    this.getList();
+                    this.isSubmit=false;
+                  }else{
+                    this.isSubmit=false;
+                  }
+                }).catch(res=>{
+                  this.isSubmit=false;
+                });
+              } else {
+                
+                const reqData = new FormData()
+                reqData.append('params', JSON.stringify(this.form))
+                const { file } = this.getFileData()
+                file.forEach(item => {
+                  reqData.append('file', item)
+                })
+                this.isSubmit=true;
+                addPerson(reqData).then(response => {
+                  if(response.code==200){
+                    this.$modal.msgSuccess("新增成功");
+                    this.open = false;
+                    this.fileList=[];
+                    this.getList();
+                    this.isSubmit=false;
+                  }else{
+                    this.isSubmit=false;
+                  }
+                }).catch(res=>{
+                  this.isSubmit=false;
+                });;
+              }
+          }
+          });
+      },
+
+      //提交时循环fileList 获取raw文件
+      getFileData() {
+        const file = []
+        this.fileList.forEach(item => {
+          if (item?.hasOwnProperty('raw')) {
+            file.push(item.raw)
           }
         })
-        return { elsefile }
+        return { file }
       },
 
-        /** 删除按钮操作 */
-        handleDelete(row) {
-            console.log(row)
-            const param = {
-              id:row.id,
-              fileId:row.fileId,
-              filePath:row.filePath,
-              teamId:row.teamId,
-            }
-            this.$modal.confirm('是否确认删除人员姓名为"' + row.name + '"的数据项？').then(function() {
-              return delPerson(param);
-            }).then(() => {
-              this.getList();
-              this.$modal.msgSuccess("删除成功");
-            }).catch(() => {});
-        },
-        // 推送人脸照片至人脸库
-        pushFace(row){
+      //提交时循环highImgList获取raw文件
+      getHighImgListFileData() {
+        const highfile = []
+        this.highImgList.forEach(item => {
+          if (item?.hasOwnProperty('size')) {
+            highfile.push(item.raw)
+          }
+        })
+        console.log(highfile)
+        return { highfile }
+      },
+
+      //提交时循环electricianImgList获取raw文件
+      getElectricianImgListFileData() {
+        const electfile = []
+        this.electricianImgList.forEach(item => {
+          if (item?.hasOwnProperty('size')) {
+            electfile.push(item.raw)
+          }
+        })
+        return { electfile }
+      },
+
+      //提交时循环elseImgList获取raw文件
+      getElseImgListFileData() {
+      const elsefile = []
+      this.elseImgList.forEach(item => {
+        if (item?.hasOwnProperty('size')) {
+          elsefile.push(item.raw)
+        }
+      })
+      return { elsefile }
+    },
+
+      /** 删除按钮操作 */
+      handleDelete(row) {
           console.log(row)
           const param = {
-              id:row.id,
-              filePath:row.filePath
-            }
-            this.$modal.confirm('是否确认推送姓名为"' + row.name + '"的数据项？').then(function() {
-              return pushFace(param);
-            }).then((res) => {
-              this.getList();
-              this.$modal.msgSuccess("推送成功");
-            });
-        },
-        /** 导出按钮操作 */
-        handleExport() {
-          exportPerson(this.queryParams).then(res => {
-            downloadFile({ fileName: `人员_${new Date().getTime()}.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' })
-          })
-        },
-        //模板下载
-        handleFile(){
-          personFile().then(res => {
-            downloadFile({ fileName: `人员模板.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' })
-          })
-        },
-        /** 导入按钮操作 */
-        handleImport() {
-          this.upload.title = "人员导入";
-          this.upload.open = true;
-        },
-        // 文件上传中处理
-        handleFileUploadProgress(event, file, fileList) {
-          this.upload.isUploading = true;
-        },
-        // 文件上传成功处理
-        handleFileSuccess(response, file, fileList) {
-          this.upload.open = false;
-          this.upload.isUploading = false;
-          this.$refs.upload.clearFiles();
-          this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
-          this.getList();
-        },
-        // 提交上传文件
-        submitFileForm() {
-          this.$refs.upload.submit();
-        },
-        //打开证书上传
-        openCertificate(row){
-          this.title = "证书上传";
-          this.memberId = row.id;
-          this.highImgList = [];
-          this.electricianImgList = [];
-          this.elseImgList = [];
-          this.delHighFileIdList=[];
-          this.delElectFileIdList=[];
-          this.delElseFileIdList=[];
-          // this.showCertificate = true;
-          getCertificate(this.memberId).then(response => {
-            response.data.highImgList.forEach(item => {
-              if(item.fileType==0)
-            {
-              this.highImgList.push({
-                  fileId: item.filePath,
-                  raw:item.bast64Image,
-                  url: URL.createObjectURL(this.base64ToBlob(item.bast64Image)),
-                  name: item.fileName,
-                })
-                console.log(this.highImgList)
-            }else{
-              this.highImgList.push({
-                  fileId: item.filePath,
-                  raw:item.bast64Image,
-                  url: item.bast64Image,
-                  name: item.fileName,               
-                })
-            }
-              });
-            response.data.electricianImgList.forEach(item => {
-              if(item.fileType==0)
-              {
-                this.electricianImgList.push({
-                  fileId: item.filePath,
-                  raw:item.bast64Image,
-                  url: URL.createObjectURL(this.base64ToBlob(item.bast64Image)),
-                  name: item.fileName
-                })
-              }else{
-                this.electricianImgList.push({
-                  fileId: item.filePath,
-                  raw:item.bast64Image,
-                  url: item.bast64Image,
-                  name: item.fileName
-                })
-              }
-
-              });
-            response.data.elseImgList.forEach(item => {
-              if(item.fileType==0)
-              {
-                this.elseImgList.push({
-                  fileId: item.filePath,
-                  raw:item.bast64Image,
-                  url: URL.createObjectURL(this.base64ToBlob(item.bast64Image)),
-                  name: item.fileName
-                })
-              }else{
-                this.elseImgList.push({
-                  fileId: item.filePath,
-                  raw:item.bast64Image,
-                  url: item.bast64Image,
-                  name: item.fileName
-                })
-              }
-              });
-                this.showCertificate = true;
-
+            id:row.id,
+            fileId:row.fileId,
+            filePath:row.filePath,
+            teamId:row.teamId,
+          }
+          this.$modal.confirm('是否确认删除人员姓名为"' + row.name + '"的数据项？').then(function() {
+            return delPerson(param);
+          }).then(() => {
+            this.getList();
+            this.$modal.msgSuccess("删除成功");
+          }).catch(() => {});
+      },
+      // 推送人脸照片至人脸库
+      pushFace(row){
+        console.log(row)
+        const param = {
+            id:row.id,
+            filePath:row.filePath
+          }
+          this.$modal.confirm('是否确认推送姓名为"' + row.name + '"的数据项？').then(function() {
+            return pushFace(param);
+          }).then((res) => {
+            this.getList();
+            this.$modal.msgSuccess("推送成功");
           });
-        },
+      },
+      /** 导出按钮操作 */
+      handleExport() {
+        exportPerson(this.queryParams).then(res => {
+          downloadFile({ fileName: `人员_${new Date().getTime()}.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' })
+        })
+      },
+      //模板下载
+      handleFile(){
+        personFile().then(res => {
+          downloadFile({ fileName: `人员模板.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' })
+        })
+      },
+      /** 导入按钮操作 */
+      handleImport() {
+        this.upload.title = "人员导入";
+        this.upload.open = true;
+      },
+      // 文件上传中处理
+      handleFileUploadProgress(event, file, fileList) {
+        this.upload.isUploading = true;
+      },
+      // 文件上传成功处理
+      handleFileSuccess(response, file, fileList) {
+        this.upload.open = false;
+        this.upload.isUploading = false;
+        this.$refs.upload.clearFiles();
+        this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
+        this.getList();
+      },
+      // 提交上传文件
+      submitFileForm() {
+        this.$refs.upload.submit();
+      },
+      //打开证书上传
+      openCertificate(row){
+        this.title = "证书上传";
+        this.memberId = row.id;
+        this.highImgList = [];
+        this.electricianImgList = [];
+        this.elseImgList = [];
+        this.delHighFileIdList=[];
+        this.delElectFileIdList=[];
+        this.delElseFileIdList=[];
+        this.uploadKey = Date.now();
+        // this.showCertificate = true;
+        getCertificate(this.memberId).then(response => {
+          response.data.highImgList.forEach(item => {
+            if(item.fileType==0)
+          {
+            this.highImgList.push({
+                fileId: item.filePath,
+                raw:item.bast64Image,
+                url: item.bast64Image == null ? '' : URL.createObjectURL(this.base64ToBlob(item.bast64Image)),
+                name: item.fileName,
+              })
+              console.log(this.highImgList)
+          }else{
+            this.highImgList.push({
+                fileId: item.filePath,
+                raw:item.bast64Image,
+                url: item.bast64Image,
+                name: item.fileName,               
+              })
+          }
+            });
+          response.data.electricianImgList.forEach(item => {
+            if(item.fileType==0)
+            {
+              this.electricianImgList.push({
+                fileId: item.filePath,
+                raw:item.bast64Image,
+                url: item.bast64Image == null ? '' : URL.createObjectURL(this.base64ToBlob(item.bast64Image)),
+                name: item.fileName
+              })
+            }else{
+              this.electricianImgList.push({
+                fileId: item.filePath,
+                raw:item.bast64Image,
+                url: item.bast64Image,
+                name: item.fileName
+              })
+            }
 
-        //关闭证书上传
-        cancelCertificate(){
-          this.highImgList = []
-          this.electricianImgList = []
-          this.elseImgList = []
-          this.showCertificate = false;
-        },
-        //提交证书上传
-        submitCertificate(){
-          this.$refs["certificateForm"].validate(valid => {
-        if (valid) {
-            const reqData = new FormData();
-            this.certificateForm.delHighFileIdList = this.delHighFileIdList;
-            this.certificateForm.delElectFileIdList = this.delElectFileIdList;
-            this.certificateForm.delElseFileIdList = this.delElseFileIdList;
-            this.delHighFileIdList.forEach(item => {
-              reqData.append('delHighFileIdList', item)
             });
-            this.delElectFileIdList.forEach(item => {
-              reqData.append('delElectFileIdList', item)
+          response.data.elseImgList.forEach(item => {
+            if(item.fileType==0)
+            {
+              this.elseImgList.push({
+                fileId: item.filePath,
+                raw:item.bast64Image,
+                url: item.bast64Image == null ? '' : URL.createObjectURL(this.base64ToBlob(item.bast64Image)),
+                name: item.fileName
+              })
+            }else{
+              this.elseImgList.push({
+                fileId: item.filePath,
+                raw:item.bast64Image,
+                url: item.bast64Image,
+                name: item.fileName
+              })
+            }
             });
-            this.delElseFileIdList.forEach(item => {
-              reqData.append('delElseFileIdList', item)
-            });
-            const { highfile } = this.getHighImgListFileData();
-            const { electfile } = this.getElectricianImgListFileData();
-            const { elsefile } = this.getElseImgListFileData();
-            reqData.append('id', this.memberId);
-            highfile.forEach(item => {
-              reqData.append('highfile', item)
-            })
-            electfile.forEach(item => {
-              reqData.append('electfile', item)
-            })
-            elsefile.forEach(item => {
-              reqData.append('elsefile', item)
-            })
-            updateCertificate(reqData).then(response => {
-              this.$modal.msgSuccess("修改证书成功");
-              this.showCertificate = false;
-              this.highImgList=[];
-              this.electricianImgList=[];
-              this.elseImgList=[];
-              this.delHighFileIdList=[];
-              this.delElectFileIdList=[];
-              this.delElseFileIdList=[];
-              this.getList();
-            });
-        }
-      });
+              this.showCertificate = true;
 
-          this.showCertificate = false;
-        },
-  
-    }
-  };
-  </script>
+        });
+      },
 
-  <style lang="scss" scoped>
-  ::v-deep.el-table .fixed-width .el-button--mini {
-      width: 60px !important;
-      margin-bottom: 10px;
-  }
-  //隐藏图片上传框的css
-  ::v-deep.disabled {
-      .el-upload--picture-card {
-          display: none;
+      //关闭证书上传
+      cancelCertificate(){
+        this.highImgList = []
+        this.electricianImgList = []
+        this.elseImgList = []
+        this.showCertificate = false;
+        this.uploadKey = Date.now();
+      },
+      //提交证书上传
+      submitCertificate(){
+        this.$refs["certificateForm"].validate(valid => {
+      if (valid) {
+          const reqData = new FormData();
+          this.certificateForm.delHighFileIdList = this.delHighFileIdList;
+          this.certificateForm.delElectFileIdList = this.delElectFileIdList;
+          this.certificateForm.delElseFileIdList = this.delElseFileIdList;
+          this.delHighFileIdList.forEach(item => {
+            reqData.append('delHighFileIdList', item)
+          });
+          this.delElectFileIdList.forEach(item => {
+            reqData.append('delElectFileIdList', item)
+          });
+          this.delElseFileIdList.forEach(item => {
+            reqData.append('delElseFileIdList', item)
+          });
+          const { highfile } = this.getHighImgListFileData();
+          const { electfile } = this.getElectricianImgListFileData();
+          const { elsefile } = this.getElseImgListFileData();
+          reqData.append('id', this.memberId);
+          highfile.forEach(item => {
+            reqData.append('highfile', item)
+          })
+          electfile.forEach(item => {
+            reqData.append('electfile', item)
+          })
+          elsefile.forEach(item => {
+            reqData.append('elsefile', item)
+          })
+          updateCertificate(reqData).then(response => {
+            this.$modal.msgSuccess("修改证书成功");
+            this.showCertificate = false;
+            this.highImgList=[];
+            this.electricianImgList=[];
+            this.elseImgList=[];
+            this.delHighFileIdList=[];
+            this.delElectFileIdList=[];
+            this.delElseFileIdList=[];
+            this.getList();
+          });
       }
-  }
-  ::v-deep .el-upload-list--picture-card{
-    display: flex;
-  }
-  ::v-deep .el-upload-list__item {
-    margin-bottom: 20px;
-    overflow: revert;
-  }
-  ::v-deep .el-upload-list__item-actions{
-    overflow:hidden; 
-  }
-  .upload-demo{
-    display: flex;
-  }
-  .el-upload-list__item-thumbnail{
-    height: 145px!important;
-  }
-  .picture-card-container{
-    width: 100%;
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    position: relative;
-  }
-  .picture-card{
-    width: 100%;
-    height: 100%;
-    object-fit:cover;
-    justify-content: center;
-    // border: 1px solid  #ddd;
-    // border-radius: 4px;
-  }
-  .file-name{
-    width: 90%;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    position: absolute;
-    bottom: -35px;
-    margin-top: 8px;
-    text-align: center;
-    font-size: 12px;
-    color:#333;
-    z-index: 999999;
-  }
-  .file-overlay{
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: rgba(0, 0, 0, 0.5);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    color: #fff;
-    font-size: 20px;
-  }
+    });
 
-  
-  </style>
\ No newline at end of file
+        this.showCertificate = false;
+        this.uploadKey = Date.now();
+      },
+
+  },
+  // mounted(){
+  //   this.uploadKey = Date.now();
+  // }
+};
+</script>
+
+<style lang="scss" scoped>
+::v-deep.el-table .fixed-width .el-button--mini {
+    width: 60px !important;
+    margin-bottom: 10px;
+}
+//隐藏图片上传框的css
+::v-deep.disabled {
+    .el-upload--picture-card {
+        display: none;
+    }
+}
+::v-deep .el-upload-list--picture-card{
+  display: flex;
+}
+::v-deep .el-upload-list__item {
+  margin-bottom: 20px;
+  overflow: revert;
+}
+::v-deep .el-upload-list__item-actions{
+  overflow:hidden; 
+}
+.upload-demo{
+  display: flex;
+}
+.el-upload-list__item-thumbnail{
+  height: 145px!important;
+}
+.picture-card-container{
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  position: relative;
+}
+.picture-card{
+  width: 100%;
+  height: 100%;
+  object-fit:cover;
+  justify-content: center;
+  // border: 1px solid  #ddd;
+  // border-radius: 4px;
+}
+.file-name{
+  width: 90%;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  position: absolute;
+  bottom: -35px;
+  margin-top: 8px;
+  text-align: center;
+  font-size: 12px;
+  color:#333;
+  z-index: 999999;
+}
+.file-overlay{
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #fff;
+  font-size: 20px;
+}
+
+
+</style>
\ No newline at end of file