'2022-2-23'

.env.development

@@ -2,10 +2,12 @@ ENV = 'development'
 
 # 接口地址
 # VUE_APP_BASE_API  = 'http://localhost:8000'
-VUE_APP_BASE_API  = 'https://safe.c-icc.cn:8035'
+# VUE_APP_BASE_API  = 'https://safe.c-icc.cn:8035'
 # VUE_APP_BASE_API = 'http://localhost:8000'
 # VUE_APP_BASE_API = 'https://192.168.3.188:8035'
 # VUE_APP_BASE_API  = 'http://39.102.232.151:8030'
+# VUE_APP_BASE_API = 'https://8.143.198.78:8035'
+VUE_APP_BASE_API = 'https://www.kuangshanzhixing.cn:8035'
 VUE_APP_WS_API = 'ws://localhost:8000'
 
 # 是否启用 babel-plugin-dynamic-import-node插件

.env.production

@@ -3,6 +3,8 @@ ENV = 'production'
 # 如果使用 Nginx 代理后端接口，那么此处需要改为 '/'，文件查看 Docker 部署篇，Nginx 配置
 # 接口地址，注意协议，如果你没有配置 ssl，需要将 https 改为 http
 # VUE_APP_BASE_API  = 'http://localhost:8000'
-VUE_APP_BASE_API  = 'https://safe.c-icc.cn:8035'
+# VUE_APP_BASE_API  = 'https://safe.c-icc.cn:8035'
+# VUE_APP_BASE_API = 'https://8.143.198.78:8035'
+VUE_APP_BASE_API = 'https://www.kuangshanzhixing.cn:8035'
 # 如果接口是 http 形式， wss 需要改为 ws
 VUE_APP_WS_API = 'wss://el-admin.xin'

package.json

@@ -46,6 +46,7 @@
     "echarts-gl": "^1.1.1",
     "echarts-wordcloud": "^1.1.3",
     "element-ui": "^2.13.2",
+    "ezuikit-js": "^0.3.0",
     "file-saver": "1.3.8",
     "fuse.js": "3.4.4",
     "js-beautify": "^1.10.2",

public/rep.css

@@ -3,10 +3,10 @@
   border: 1px solid #010823;
   background: #010823;
 }
-.el-popper[x-placement^=bottom] .popper__arrow::after {
-  border-bottom-color:black;
+.el-popper[x-placement^="bottom"] .popper__arrow::after {
+  border-bottom-color: black;
 }
-.el-popper[x-placement^=bottom] .popper__arrow {
+.el-popper[x-placement^="bottom"] .popper__arrow {
   border-bottom-color: black;
 }
 .el-picker-panel__icon-btn {
@@ -25,11 +25,14 @@
 }
 .el-select-dropdown__item {
   color: #fff;
-  background-color:#010823!important;
+  background-color: #010823 !important;
 }
 .el-select-dropdown__item.selected {
-  background-color:#03507E!important;
+  background-color: #03507e !important;
 }
 .el-select-dropdown__item:hover {
-  background-color:#03507E!important;
-}
+  background-color: #03507e !important;
+}
\ No newline at end of file
+/* .el-image-viewer__actions {
+  display: none;
+} */

src/api/certify.js

@@ -33,3 +33,15 @@ export function analyzeCertify(params) {
     params
   })
 }
+
+
+/**
+ * 删除证书  enterpriseCertificate:del
+ */
+export function deleteEnterCertify(data) {
+  return request({
+    url: '/api/enterpriseCertificate',
+    method: 'delete',
+    data
+  })
+}
\ No newline at end of file

src/api/course.js

@@ -107,10 +107,11 @@ export function updateCourse(data, updateFunc) {
  * pid 课程id
  * 修改课时
  */
-export function updateLesson(data) {
+export function updateLesson(data, updateFunc) {
   return requestFile({
     url: 'api/onlineTraining/updateLesson',
     method: 'POST',
+    onUploadProgress: updateFunc,
     data
   })
 }

src/api/home.js

+import request from '@/utils/request'
+import requestFile from '@/utils/requestfile'
+import qs from 'qs'
+
+export function homePageAnalyze() {
+  return request({
+    url: 'api/homePage/analyze',
+    method: 'get'
+  })
+}

src/api/industry.js

@@ -555,10 +555,45 @@ export function deleteRiskStandingBookType(ids) {
   })
 }
 
+/**
+ * 后台获取企业风险数量
+ */
+export function getriskNumAnalysisBackend(companyId) {
+  return request({
+    url: 'api/thRisk/countRisk',
+    method: 'GET',
+    params: {
+      companyId
+    }
+  })
+}
+
 // 获取企业风险数量统计
 export function getriskNumAnalysis(companyId) {
-  return request({
-    url: 'api/thRiskNumAnalysis',
+  // return new Promise((resolve) => {
+  //   resolve({
+  //     content: [
+  //       {
+  //         rnaLevel: '重大风险',
+  //         rnaNum: 0
+  //       },
+  //       {
+  //         rnaLevel: '较大风险',
+  //         rnaNum: 0
+  //       },
+  //       {
+  //         rnaLevel: '一般风险',
+  //         rnaNum: 0
+  //       },
+  //       {
+  //         rnaLevel: '低风险',
+  //         rnaNum: 0
+  //       }
+  //     ]
+  //   })
+  // })
+  return request({
+    url: 'api/thRisk/countByCompanyId',
     method: 'GET',
     params: {
       companyId
@@ -808,7 +843,7 @@ export function countEachLevelRiskNum(county, dimTwoIndustries, town) {
 export function rankHdNum(currentSelectOption, curArg, level, startTime, endTime) {
   let queryString = ''
   if (currentSelectOption === 1) {
-    queryString = qs.stringify({
+    queryString = stringify({
       town: curArg,
       level,
       startTime,
@@ -1298,6 +1333,21 @@ export function verifyEnterpriseManager(userId) {
   })
 }
 
+/**
+ * 发布通知公告
+ * companyIds: [],
+ * noticeContent: "string",
+ * noticeTitle: "string"
+ */
+
+export function publishNotice(data) {
+  return request({
+    url: 'api/notice',
+    method: 'post',
+    data
+  })
+}
+
 /**
  * 
  */

src/api/secFound.js

+import request from '@/utils/request'
+
+/**
+ * 企业安全所属分类、检查内容管理
+ */
+
+/**
+ * 查询服务: 企业安全所属分类、检查内容 enterpriseSafetyInspectionContent:list
+ * params: {
+ *  level: 层级1: 所属分类  2: 检查内容
+ *  page:  页码(0...N)
+ *  pid
+ *  size  每页显示的数目
+ *  sort  以下列格式排序标准: property[,asc | desc]。默认排序顺序为升序。支持多种排序条件: 如: id,asc
+ * }
+ */
+
+export function getEnterpriseSafetyInspectionContent(params) {
+  return request({
+    url: 'api/enterpriseSafetyInspectionContent',
+    method: 'get',
+    params
+  })
+}
+
+/**
+ * id
+ * level  层级 1: 所属分类  2:检查内容
+ * name   string 类别 /所属分类/检查内容
+ * pid    integer($int32)
+ * type   string  类别[安全资料类|现场检查类] 
+ */
+
+export function postEnterpriseSafetyInspectionContent(data) {
+  return request({
+    url: 'api/enterpriseSafetyInspectionContent',
+    method: 'post',
+    data
+  })
+}
+
+/**
+ * id
+ * level  层级 1: 所属分类  2:检查内容
+ * name   string 类别 /所属分类/检查内容
+ * pid    integer($int32)
+ * type   string  类别[安全资料类|现场检查类] 
+ */
+export function putEnterpriseSafetyInspectionContent(data) {
+  return request({
+    url: 'api/enterpriseSafetyInspectionContent',
+    method: 'put',
+    data
+  })
+}
+
+/**
+ * [
+ *  {
+ *    id: 0,
+ *    level: 0
+ *  }
+ * ]
+ */
+export function deleteEnterpriseSafetyInspectionContent(data) {
+  return request({
+    url: 'api/enterpriseSafetyInspectionContent',
+    method: 'delete',
+    data
+  })
+}
+
+/**
+ * 企业安全发现问题管理
+ */
+
+/**
+ * inspectionContentId
+ * page
+ * size
+ * sort
+ * 
+ * enterpriseSafetyMatter:list
+ */
+export function getEnterpriseSafetyMatter(params) {
+  return request({
+    url: 'api/enterpriseSafetyMatter',
+    method: 'get',
+    params
+  })
+}
+
+/**
+ * basis     检查依据
+ * id        id
+ * inspectionContentId  检查内容id
+ * name       问题名称
+ * suggestion 整改建议
+ */
+export function postEnterpriseSafetyMatter(data) {
+  return request({
+    url: 'api/enterpriseSafetyMatter',
+    method: 'post',
+    data
+  })
+}
+
+/**
+ * basis   检查依据
+ * id     id
+ * inspectionContentId 检查内容
+ * name   问题名称
+ * suggestion   整改建议
+ */
+export function putEnterpriseSafetyMatter(data) {
+  return request({
+    url: 'api/enterpriseSafetyMatter',
+    method: 'put',
+    data
+  })
+}
+
+/**
+ * []
+ */
+export function deleteEnterpriseSafetyMatter(data) {
+  return request({
+    url: 'api/enterpriseSafetyMatter',
+    method: 'delete',
+    data
+  })
+}
+
+/**
+ * 查询企业安全信息
+ */
+export function findMattsByEnterpriseId(enterpriseId) {
+  return request({
+    url: 'api/enterpriseSafetyMatter/findByEnterpriseId',
+    method: 'get',
+    params: {
+      enterpriseId
+    }
+  })
+}
+
+/**
+ * 预览企业安全管理模板
+ */
+
+export function previewTemplate() {
+  return request({
+    url: 'api/enterpriseSafetyMatter/previewTemplate',
+    method: 'get'
+  })
+}
+
+/**
+ * 企业安全管理评星
+ */
+export function enterSafetyMatterStar(enterpriseId) {
+  // return request({
+  //   url: 'api/enterpriseSafetyMatter/star',
+  //   method: 'get',
+  //   params: {
+  //     enterpriseId
+  //   }
+  // })
+  return new Promise((resolve) => {
+    resolve(4)
+  })
+}
+
+/**
+ * 获取所有待审核隐患
+ */
+export function getAllDangerToVerify(params) {
+  return request({
+    url: 'api/hiddenDangerToVerify',
+    method: 'get',
+    params
+  })
+}
+
+/**
+ * 待审核隐患修改
+ */
+export function verifyDanger(params) {
+  return request({
+    url: 'api/hiddenDangerToVerify/verify',
+    method: 'get',
+    params
+  })
+}

src/api/teachManage.js

@@ -16,13 +16,14 @@ export function getLawList(page, size, startTime, endTime, publisher, keyword) {
     }
   })
 }
-export function postLaw(lawPublisher, lawTitle, thLawChapterDtoList) {
+export function postLaw(lawPublisher, lawTitle, lawDate, thLawChapterDtoList) {
   return request({
     url: 'api/thLaw',
     method: 'POST',
     data: {
       lawPublisher,
       lawTitle,
+      lawDate,
       thLawChapterDtoList
     }
   })

src/api/test.js

@@ -67,7 +67,7 @@ export function deleteExamLibraryCategory(data) {
  */
 export function getExamLibrary(params) {
   return request({
-    url: 'api/onlineExamLibrary',
+    url: 'api/onlineExamLibrary/page',
     method: 'get',
     params
   })
@@ -112,3 +112,214 @@ export function deleteExamLibrary(data) {
     data
   })
 }
+
+/**
+ * difficulty 难度
+ * exclusiveIds 排除的题目 id
+ * libraryId 题库id
+ * page
+ * question 题干
+ * size 每页显示的题目
+ * sort 默认排序顺序为升序
+ * type 单选题|多选题|判断题
+ * 获取在线考试题
+ */
+export function getOnlineExamSubject(params) {
+  const queryString = qs.stringify(params, {
+    indices: false
+  })
+  console.log(params, queryString)
+  return request({
+    url: 'api/onlineExamSubject?' + queryString,
+    method: 'GET'
+  })
+}
+
+/**
+ * analysis 答案分析
+ * answer 答案[A|B|C|D] 多选题 A、B 判断题[对|错]
+ * difficulty 难度[简单|一般|困难]
+ * id id
+ * libraryId 题库id
+ * optiona 选项A
+ * optionb 选项B
+ * optionc 选项C
+ * optiond 选项d
+ * question 题干
+ * type 类型[单选题|多选题|判断题]
+ * 添加在线考试题
+ */
+export function postOnlineExamSubject(data) {
+  return request({
+    url: 'api/onlineExamSubject',
+    method: 'POST',
+    data
+  })
+}
+
+/**
+ * analysis 答案分析
+ * answer 答案 单选题[A|B|C|D] 多选题 A、B 判断题 [对|错]
+ * difficulty 难度 [简单|一般|困难]
+ * id  id
+ * libraryId  题库id
+ * optiona  选项A
+ * optionb  选项B
+ * optionc  选项C
+ * optiond  选项D
+ * question 题干
+ * type     类型[单选题|多选题|判断题]
+ * 修改在线考试题
+ */
+export function putOnlineExamSubject(data) {
+  return request({
+    url: 'api/onlineExamSubject',
+    method: 'PUT',
+    data
+  })
+}
+
+/**
+ * 删除在线考试题
+ */
+export function deleteOnlineExamSubject(data) {
+  return request({
+    url: 'api/onlineExamSubject',
+    method: 'DELETE',
+    data
+  })
+}
+
+/**
+ * ids   []
+ * 删除试卷
+ */
+export function deleteExamPaper(data) {
+  return request({
+    url: 'api/onlineExamPaper',
+    method: 'delete',
+    data
+  })
+}
+
+/**
+ * page  页码(0...N)
+ * paperId  试卷Id
+ * size  每页显示的数目
+ * sort
+ * type [单选题|多选题|判断题]
+ * 在线考试： 查询题目
+ */
+export function findPaperSubject(params) {
+  return request({
+    url: 'api/onlineExamPaper/findSubject',
+    method: 'get',
+    params
+  })
+}
+
+
+/**
+ * name: 试卷名称
+ * page: 页码
+ * size: 每页显示的数目
+ * sort: 以下列格式排序标准: property[,asc|desc]
+ * 在线考试： 查询试卷
+ */
+export function findPagePager(data) {
+  return request({
+    url: 'api/onlineExamPaper/page',
+    method: 'get',
+    data
+  })
+}
+
+/**
+ * {
+ *  addJudgementIds: [
+ *    "paperId": 0,
+ *    "subjectId": 0
+ *  ],
+ *  addMultipleChoiceIds: [
+ *    "paperId": 0,
+ *    "subjectId": 0
+ *  ],
+ *  addSingleChoiceIds: [
+ *    "pagerId": 0,
+ *    "subjectId": 0
+ *  ],
+ *  deleteJudgementIds: [
+ *    "pagerId": 0,
+ *    "subjectId": 0
+ *  ],
+ *  deleteMultipleChoiceIds: [
+ *    "paperId": 0,
+ *    "subjectId": 0
+ *  ],
+ *  deleteSingleChoiceIds: [
+ *    "paperId": 0,
+ *    "subjectId": 0
+ *  ],
+ *  paperId: 0
+ * }
+ * 智能组卷后手动编辑保存
+ * */
+export function savePaperAfterAutomatically(data) {
+  return request({
+    url: 'api/onlineExamPaper/saveAfterAutomatically',
+    method: 'post',
+    data
+  })
+}
+
+/**
+ * name
+ * description
+ * judgmentNum: 0
+ * judgmentScore: 0
+ * libraryIds: [],
+ * mode: 生成方式 随机|简单|一般|困难
+ * multipleChoiceNum: 0
+ * multipleChoiceScore: 0
+ * singleChoiceNum 单选题数量
+ * singleChoiceScore 单选题分值
+ * status 状态   [已发布|已关闭] 默认已关闭
+ * 智能组卷
+ */
+export function savePaperAutomatically(data) {
+  return request({
+    url: 'api/onlineExamPaper/saveAutomatically',
+    method: 'post',
+    data
+  })
+}
+
+/**
+ * name
+ * description
+ * status [已关闭|已发布]
+ * libraryIds: []
+ * addJudgementIds: []
+ * addMultipleChoiceIds: []
+ * addSingleChoiceIds: []
+ * singleChoiceScore
+ * multipleChoiceScore
+ * judgmentScore
+ * 手动组卷
+ */
+
+export function saveManully(data) {
+  return request({
+    url: 'api/onlineExamPaper/saveManually',
+    method: 'post',
+    data
+  })
+}
+
+export function changePaperStatus(data) {
+  return request({
+    url: 'api/onlineExamPaper/changeStatus',
+    method: 'put',
+    data
+  })
+}
\ No newline at end of file

src/api/trainimage.js

@@ -106,14 +106,25 @@ export function getAllIndustry(params) {
   })
 }
 
+/**
+ * 安全教育培训统计
+ */
+export function analyzeSafetyEducation(params) {
+  return request({
+    url: 'api/trainImage/analyzeSafetyEducation',
+    method: 'get',
+    params
+  })
+}
 
 /**
  * 查询已参加培训的企业
  */
-export function findTrainEnterprise() {
+export function findTrainEnterprise(params) {
   return request({
     url: 'api/trainImage/findTrainEnterprise',
-    method: 'get'
+    method: 'get',
+    params
   })
 }
 

src/components/openezuijs/index.vue

+<template>
+  <div class="hello-ezuikit-js" style="width: 100%;height:100%;padding: 35px;">
+    <div id="ope-video-container" style="width:90%;height:90%"></div>
+  </div>
+</template>
+
+<script>
+import EZUIKit from "ezuikit-js";
+import axios from "axios";
+const service = axios.create({});
+export default {
+  name: "HelloWorld",
+  props: {
+    msg: String
+  },
+  mounted: async () => {
+    console.group("mounted 组件挂载完毕状态===============》");
+    let result = null;
+    // await getMonitor().then(res => {
+    //   result = res[0];
+    //   // const player = new EZUIKit.EZUIKitPlayer({
+    //   //   autoplay: true,
+    //   //   id: "ope-video-container",
+    //   //   accessToken:
+    //   //     "at.3bvmj4ycamlgdwgw1ig1jruma0wpohl6-48zifyb39c-13t5am6-yukyi86mz" ||
+    //   //     res[0].appsecret,
+    //   //   url: "ezopen://open.ys7.com/203751922/1.live" || res[0].channel,
+    //   //   template: "simple" // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版；
+    //   //   // 视频上方头部控件
+    //   //   //header: ["capturePicture", "save", "zoom"], // 如果templete参数不为simple,该字段将被覆盖
+    //   //   //plugin: ['talk'],                       // 加载插件，talk-对讲
+    //   //   // 视频下方底部控件
+    //   //   // footer: ["talk", "broadcast", "hd", "fullScreen"], // 如果template参数不为simple,该字段将被覆盖
+    //   //   // audio: 1, // 是否默认开启声音 0 - 关闭 1 - 开启
+    //   //   // openSoundCallBack: data => console.log("开启声音回调", data),
+    //   //   // closeSoundCallBack: data => console.log("关闭声音回调", data),
+    //   //   // startSaveCallBack: data => console.log("开始录像回调", data),
+    //   //   // stopSaveCallBack: data => console.log("录像回调", data),
+    //   //   // capturePictureCallBack: data => console.log("截图成功回调", data),
+    //   //   // fullScreenCallBack: data => console.log("全屏回调", data),
+    //   //   // getOSDTimeCallBack: data => console.log("获取OSDTime回调", data),
+    //   //   // width: 600,
+    //   //   // height: 400
+    //   // });
+    //   // player.play();
+    // });
+
+    // let dataJson = "appKey=" + result.appkey + "&appSecret=" + result.appsecret;
+    // service.defaults.headers["Content-Type"] =
+    //   "application/x-www-form-urlencoded; charset=UTF-8";
+    // let result2 = null;
+    // await service
+    //   .post("https://open.ys7.com/api/lapp/token/get", dataJson)
+    //   .then(res1 => {
+    //     console.log(res1, "service post");
+    //     result2 = res1;
+    //   });
+    // if (result2.data.code === "200") {
+    //   const player = new EZUIKit.EZUIKitPlayer({
+    //     autoplay: true,
+    //     id: "ope-video-container",
+    //     accessToken: result2.data.data.accessToken,
+    //     url: `ezopen://open.ys7.com/${result.mid}/${result.channel}`,
+    //     template: "simple", // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版；
+    //     // footer: ["fullScreen"],
+    //     // 视频上方头部控件
+    //     // header: ["capturePicture", "save", "zoom"] // 如果templete参数不为simple,该字段将被覆盖
+    //     // plugin: ['talk'],                       // 加载插件，talk-对讲
+    //     // 视频下方底部控件
+    //     // footer: ["talk", "broadcast", "hd", "fullScreen"], // 如果template参数不为simple,该字段将被覆盖
+    //     // audio: 1, // 是否默认开启声音 0 - 关闭 1 - 开启
+    //     // openSoundCallBack: data => console.log("开启声音回调", data),
+    //     // closeSoundCallBack: data => console.log("关闭声音回调", data),
+    //     // startSaveCallBack: data => console.log("开始录像回调", data),
+    //     // stopSaveCallBack: data => console.log("录像回调", data),
+    //     // capturePictureCallBack: data => console.log("截图成功回调", data),
+    //     // fullScreenCallBack: data => console.log("全屏回调", data),
+    //     // getOSDTimeCallBack: data => console.log("获取OSDTime回调", data),
+    //     // width: 600,
+    //     // height: 400
+    //   });
+    //   player.play();
+    // }
+    // console.log("player", player);
+    // setTimeout(()=>{
+    //   player.stop(); // 方法调用示例，10秒后关闭视频
+    // },10000)
+  },
+  methods: {}
+};
+</script>
+<style lang="scss" scoped>
+.hello-ezuikit-js {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.ope-video-container {
+  width: 96%;
+  height: 70%;
+}
+</style>

src/router/routers.js

@@ -72,6 +72,8 @@ const trainimageenter = () => import('../views/trainimage/index.vue')
 const trainimg = () => import('../views/trainimage/trainimg.vue')
 const trainstatistics = () => import('../views/trainimage/statistics.vue')
 
+const hdverify = () => import('../views/hiddendanger/hdverify.vue')
+
 Vue.use(Router)
 
 export const constantRouterMap = [
@@ -297,6 +299,13 @@ export const constantRouterMap = [
         meta: { title: '隐患管理' },
         hidden: true
       },
+      {
+        path: 'hidedanger/verify',
+        component: hdverify,
+        name: '隐患审核',
+        meta: { title: '隐患审核' },
+        hidden: true
+      },
       {
         path: 'hidedanger/vocabulary',
         component: vocabulary,
@@ -716,6 +725,18 @@ export const constantRouterMap = [
         name: '在线考试',
         meta: { title: '在线考试' }
       },
+      {
+        path: 'maketesterauto',
+        component: () => import('../views/exam/maketesterauto.vue'),
+        name: '智能组卷',
+        meta: { title: '智能组卷' }
+      },
+      {
+        path: 'maketestersave/:name',
+        component: () => import('../views/exam/maketesterautosave.vue'),
+        name: '智能组卷后保存',
+        meta: { title: '智能组卷后保存' }
+      },
       {
         path: 'manage/:name',
         component: manage,

src/store/getters.js

@@ -23,6 +23,7 @@ const getters = {
   sidebarRouters: state => state.permission.sidebarRouters,
   curLawItem: state => state.law.curLawItem,
   curAdviceItem: state => state.advice.curAdviceItem,
-  course: state => state.course.course
+  course: state => state.course.course,
+  subject: state => state.tester.subject
 }
 export default getters

src/store/modules/tester.js

+const tester = {
+  state: {
+    subject: []
+  },
+  mutations: {
+    SET_SUBJECT: (state, subject) => {
+      state.subject = [...subject]
+    }
+  },
+  actions: {
+    // 设置试卷题目
+    setSubjects({ commit }, subject) {
+      commit('SET_SUBJECT', subject)
+    }
+  }
+}
+
+export default tester
\ No newline at end of file

src/utils/monitorconfig.js

+export default [
+  {
+    isMonitor: true,
+    riskId: 1956,
+    appKey: "ad5ce203b2a7432cb771c0005f3257bd",
+    appSecret: "39f36e1cb37ef981bb52820f50ed779f",
+    filename: "1.hd.live",
+    devNumber: "G96386473"
+  },
+  {
+    isMonitor: true,
+    riskId: 1957,
+    appKey: "ad5ce203b2a7432cb771c0005f3257bd",
+    appSecret: "39f36e1cb37ef981bb52820f50ed779f",
+    filename: "2.hd.live",
+    devNumber: "G96386473"
+  },
+  {
+    isMonitor: true,
+    riskId: 1958,
+    appKey: "ad5ce203b2a7432cb771c0005f3257bd",
+    appSecret: "39f36e1cb37ef981bb52820f50ed779f",
+    filename: "3.hd.live",
+    devNumber: "G96386473"
+  },
+  {
+    isMonitor: true,
+    riskId: 1959,
+    appKey: "ad5ce203b2a7432cb771c0005f3257bd",
+    appSecret: "39f36e1cb37ef981bb52820f50ed779f",
+    filename: "4.hd.live",
+    devNumber: "G96386473"
+  },
+  {
+    isMonitor: true,
+    riskId: 1960,
+    appKey: "ad5ce203b2a7432cb771c0005f3257bd",
+    appSecret: "39f36e1cb37ef981bb52820f50ed779f",
+    filename: "5.hd.live",
+    devNumber: "G96386473"
+  },
+  {
+    isMonitor: true,
+    riskId: 1961,
+    appKey: "ad5ce203b2a7432cb771c0005f3257bd",
+    appSecret: "39f36e1cb37ef981bb52820f50ed779f",
+    filename: "6.hd.live",
+    devNumber: "G96386473"
+  },
+  {
+    isMonitor: true,
+    riskId: 63,
+    appKey: "90174687eb6c4d4184a38940d5117382",
+    appSecret: "734efd3233ce3e6d3e087d093be84924",
+    filename: "6.live",
+    devNumber: "797723880"
+  },
+  {
+    isMonitor: true,
+    riskId: 53,
+    appKey: "f0b1cb6115fb4862be8479e3fe02a1c7",
+    appSecret: "37bdc8da580a8c10c2c4964b86764007",
+    filename: "7.hd.live",
+    devNumber: "102186935"
+  },
+  {
+    isMonitor: true,
+    riskId: 58,
+    appKey: "f0b1cb6115fb4862be8479e3fe02a1c7",
+    appSecret: "37bdc8da580a8c10c2c4964b86764007",
+    filename: "2.hd.live",
+    devNumber: "755529214"
+  },
+  {
+    isMonitor: true,
+    riskId: 108,
+    appKey: "ad5ce203b2a7432cb771c0005f3257bd",
+    appSecret: "39f36e1cb37ef981bb52820f50ed779f",
+    filename: "5.hd.live",
+    devNumber: "C07694100"
+  },
+  {
+    isMonitor: true,
+    riskId: 165,
+    appKey: "69af1b5a89c54536a111da46b5b48c59",
+    appSecret: "1f23dc385ed328d383a685e2d231c0cd",
+    filename: "6.hd.live",
+    devNumber: "126043484"
+  },
+  {
+    isMonitor: true,
+    riskId: 1939,
+    appKey: "ad5ce203b2a7432cb771c0005f3257bd",
+    appSecret: "39f36e1cb37ef981bb52820f50ed779f",
+    filename: "3.hd.live",
+    devNumber: "249046082"
+  },
+  {
+    isMonitor: true,
+    riskId: 1964,
+    appKey: "ad5ce203b2a7432cb771c0005f3257bd",
+    appSecret: "39f36e1cb37ef981bb52820f50ed779f",
+    filename: "1.hd.live",
+    devNumber: "C51248243"
+  }
+]
\ No newline at end of file

src/views/addinfo.vue

 <template>
   <div class="addinfo-wrapper">
-    <el-form ref="formenterinfo1" :rules="formenterinforules" :model="formenterinfo" label-width="180px">
+    <el-form
+      ref="formenterinfo1"
+      :rules="formenterinforules"
+      :model="formenterinfo"
+      label-width="180px"
+    >
       <el-row>
         <el-col :span="12">
           <el-form-item label="企业名称:" prop="companyName">
@@ -9,7 +14,10 @@
         </el-col>
         <el-col :span="12">
           <el-form-item label="企业状态:" prop="companyStatus">
-            <el-select v-model="formenterinfo.companyStatus" placeholder="请选择企业状态">
+            <el-select
+              v-model="formenterinfo.companyStatus"
+              placeholder="请选择企业状态"
+            >
               <el-option label="正常生产" value="正常生产" />
               <el-option label="停产企业" value="停产企业" />
               <el-option label="已经注销" value="已经注销" />
@@ -22,7 +30,10 @@
       <el-row>
         <el-col :span="12">
           <el-form-item label="行业类型:" prop="companyIndustryName">
-            <el-select v-model="formenterinfo.companyIndustryName" placeholder="请选择行业类型">
+            <el-select
+              v-model="formenterinfo.companyIndustryName"
+              placeholder="请选择行业类型"
+            >
               <!-- <el-option label="危化品生产" value="hcpro" />
               <el-option label="危化品生产 (含储存经营)" value="hcprosm" />
               <el-option label="危化品使用" value="uohc" />
@@ -36,7 +47,12 @@
               <el-option label="化工设备加工" value="ce" />
               <el-option label="橡胶、农膜和塑料制品业" value="rplastic" />
               <el-option label="其他行业" value="other" /> -->
-              <el-option v-for="(item, index) in industryNames" :key="index" :label="item.industryName" :value="item.industryName" />
+              <el-option
+                v-for="(item, index) in industryNames"
+                :key="index"
+                :label="item.industryName"
+                :value="item.industryName"
+              />
             </el-select>
           </el-form-item>
         </el-col>
@@ -50,13 +66,41 @@
         </el-col>
       </el-row>
       <el-form-item label="国民行业类型" prop="companyDimTwoIndustryName">
-        <el-select v-model="curNationIndusLevel1" @change="nationInduschangelevel1">
-          <el-option v-for="(item, index) in nationindusNames" :key="index" :label="item.name" :value="item.name" />
+        <el-select
+          v-model="curNationIndusLevel1"
+          @change="nationInduschangelevel1"
+        >
+          <el-option
+            v-for="(item, index) in nationindusNames"
+            :key="index"
+            :label="item.name"
+            :value="item.name"
+          />
         </el-select>
-        <el-select v-if="nationindusSecondNames.length > 0" v-model="curNationIndusLevel2" @change="nationInduschangelevel2">
-          <el-option v-for="(item, index) in nationindusSecondNames" :key="index" :label="item.name" :value="item.name" />
+        <el-select
+          v-if="nationindusSecondNames.length > 0"
+          v-model="curNationIndusLevel2"
+          @change="nationInduschangelevel2"
+        >
+          <el-option
+            v-for="(item, index) in nationindusSecondNames"
+            :key="index"
+            :label="item.name"
+            :value="item.name"
+          />
         </el-select>
       </el-form-item>
+      <el-form-item label="企业属性">
+        <el-checkbox v-model="formenterinfo.isSafetyDirector"
+          >是否有安全负责人</el-checkbox
+        >
+        <el-checkbox v-model="formenterinfo.isResponsibility"
+          >是否落实责任清单</el-checkbox
+        >
+        <el-checkbox v-model="formenterinfo.isSecurity"
+          >是否是安全标准化企业</el-checkbox
+        >
+      </el-form-item>
       <el-row>
         <el-col :span="12">
           <el-form-item label="统一社会信用代码:" prop="companyCode">
@@ -79,19 +123,60 @@
           <el-option label="辛店镇" value="town6" />
         </el-select> -->
         <el-select v-model="region1model" @change="region1schange">
-          <el-option v-for="(item, index) in regionlevel1" :key="index" :label="item.name" :value="item.areaCode" />
+          <el-option
+            v-for="(item, index) in regionlevel1"
+            :key="index"
+            :label="item.name"
+            :value="item.areaCode"
+          />
         </el-select>
-        <el-select v-if="regionlevel2.length > 0" v-model="region2model" @change="region2schange">
-          <el-option v-for="(item, index) in regionlevel2" :key="index" :label="item.name" :value="item.areaCode" />
+        <el-select
+          v-if="regionlevel2.length > 0"
+          v-model="region2model"
+          @change="region2schange"
+        >
+          <el-option
+            v-for="(item, index) in regionlevel2"
+            :key="index"
+            :label="item.name"
+            :value="item.areaCode"
+          />
         </el-select>
-        <el-select v-if="regionlevel3.length > 0" v-model="region3model" @change="region3schange">
-          <el-option v-for="(item, index) in regionlevel3" :key="index" :label="item.name" :value="item.areaCode" />
+        <el-select
+          v-if="regionlevel3.length > 0"
+          v-model="region3model"
+          @change="region3schange"
+        >
+          <el-option
+            v-for="(item, index) in regionlevel3"
+            :key="index"
+            :label="item.name"
+            :value="item.areaCode"
+          />
         </el-select>
-        <el-select v-if="regionlevel4.length > 0" v-model="region4model" @change="region4schange">
-          <el-option v-for="(item, index) in regionlevel4" :key="index" :label="item.name" :value="item.areaCode" />
+        <el-select
+          v-if="regionlevel4.length > 0"
+          v-model="region4model"
+          @change="region4schange"
+        >
+          <el-option
+            v-for="(item, index) in regionlevel4"
+            :key="index"
+            :label="item.name"
+            :value="item.areaCode"
+          />
         </el-select>
-        <el-select v-if="regionlevel5.length > 0" v-model="region5model" @change="region5schange">
-          <el-option v-for="(item, index) in regionlevel5" :key="index" :label="item.name" :value="item.areaCode" />
+        <el-select
+          v-if="regionlevel5.length > 0"
+          v-model="region5model"
+          @change="region5schange"
+        >
+          <el-option
+            v-for="(item, index) in regionlevel5"
+            :key="index"
+            :label="item.name"
+            :value="item.areaCode"
+          />
         </el-select>
       </el-form-item>
       <el-form-item label="值班电话" prop="dutytel">
@@ -128,7 +213,10 @@
         <el-input v-model="formenterinfo.companyCommunicationAddr" />
       </el-form-item>
       <el-form-item label="经营范围">
-        <el-input v-model="formenterinfo.companyBusinessNature" type="textarea" />
+        <el-input
+          v-model="formenterinfo.companyBusinessNature"
+          type="textarea"
+        />
       </el-form-item>
       <el-form-item label="原料">
         <el-input v-model="formenterinfo.companyRawMaterial" />
@@ -147,15 +235,31 @@
         </el-row> -->
         <el-row>
           <el-col :span="8">
-            <el-input v-model="tochoosecomregion" size="mini" placeholder="请输入公司名称或公司所在地" />
+            <el-input
+              v-model="tochoosecomregion"
+              size="mini"
+              placeholder="请输入公司名称或公司所在地"
+            />
           </el-col>
           <el-col :span="16">
-            <el-button size="mini" type="primary" @click="searchcom">搜索</el-button>
+            <el-button size="mini" type="primary" @click="searchcom"
+              >搜索</el-button
+            >
           </el-col>
         </el-row>
         <el-row>
-          <el-select v-if="companyregions.length > 0" v-model="comrealpos" style="width:20%;" @change="comrealposselect">
-            <el-option v-for="(item, index) in companyregions" :key="index" :label="item.name + '-' + item.address" :value="item.location.lng + ',' + item.location.lat" />
+          <el-select
+            v-if="companyregions.length > 0"
+            v-model="comrealpos"
+            style="width:20%;"
+            @change="comrealposselect"
+          >
+            <el-option
+              v-for="(item, index) in companyregions"
+              :key="index"
+              :label="item.name + '-' + item.address"
+              :value="item.location.lng + ',' + item.location.lat"
+            />
           </el-select>
         </el-row>
       </el-form-item>
@@ -176,72 +280,81 @@
 </template>
 
 <script>
-import { getindustry, getAllProvince, findAreaByCode, addCompanyInfo, findDimindustry } from '../api/industry'
+import {
+  getindustry,
+  getAllProvince,
+  findAreaByCode,
+  addCompanyInfo,
+  findDimindustry
+} from "../api/industry";
 export default {
   data() {
     return {
       formenterinfo: {
-        companyName: '',
-        companyStatus: '正常生产',
-        companyIndustryName: '一般化工行业',
-        companyChemical: '0',
-        companyCode: '',
-        companyPeople: '',
-        companyDutyTel: '',
-        companyChargePer: '',
-        companyChargeTel: '',
-        companySecurityPer: '',
-        companySecurityTel: '',
-        companyIntroduction: '',
-        companyCommunicationAddr: '',
-        companyBusinessNature: '',
-        companyRawMaterial: '',
-        companyMainProduct: '',
-        companyLng: '',
-        companyLat: '',
-        companyProvince: '',
-        companyCity: '',
-        companyCounty: '',
-        companyCommunity: '',
-        companyTown: '',
-        companyDimOneIndustryName: '',
-        companyDimTwoIndustryName: ''
+        companyName: "",
+        companyStatus: "正常生产",
+        companyIndustryName: "一般化工行业",
+        companyChemical: "0",
+        companyCode: "",
+        companyPeople: "",
+        companyDutyTel: "",
+        companyChargePer: "",
+        companyChargeTel: "",
+        companySecurityPer: "",
+        companySecurityTel: "",
+        companyIntroduction: "",
+        companyCommunicationAddr: "",
+        companyBusinessNature: "",
+        companyRawMaterial: "",
+        companyMainProduct: "",
+        companyLng: "",
+        companyLat: "",
+        companyProvince: "",
+        companyCity: "",
+        companyCounty: "",
+        companyCommunity: "",
+        companyTown: "",
+        companyDimOneIndustryName: "",
+        companyDimTwoIndustryName: "",
+        isResponsibility: false,
+        isSecurity: false,
+        isSafetyDirector: false
       },
       formenterinforules: {
         companyName: [
-          { required: true, message: '请输入企业名称', trigger: 'blur' },
-          { min: 2, message: '长度须大于2个字符', trigger: 'blur' }
+          { required: true, message: "请输入企业名称", trigger: "blur" },
+          { min: 2, message: "长度须大于2个字符", trigger: "blur" }
         ],
         companyCounty: [
-          { required: true, message: '请输入地址', trigger: 'change' }
+          { required: true, message: "请输入地址", trigger: "change" }
         ],
         companyCode: [
-          { required: true, message: '请输入统一社会信用代码', trigger: 'blur' }
+          { required: true, message: "请输入统一社会信用代码", trigger: "blur" }
         ],
         companyIndustryName: [
-          { required: true, message: '请输入行业类型', trigger: 'blur' }
+          { required: true, message: "请输入行业类型", trigger: "blur" }
         ],
         companyChargePer: [
-          { required: true, message: '请输入主要负责人', trigger: 'blur' },
-          { min: 1, message: '长度须大于1个字符', trigger: 'blur' }
+          { required: true, message: "请输入主要负责人", trigger: "blur" },
+          { min: 1, message: "长度须大于1个字符", trigger: "blur" }
         ],
         companyChargeTel: [
-          { required: true, message: '请输入主要负责人电话', trigger: 'blur' },
-          { min: 1, message: '长度须大于1个字符', trigger: 'blur' }
+          { required: true, message: "请输入主要负责人电话", trigger: "blur" },
+          { min: 1, message: "长度须大于1个字符", trigger: "blur" }
         ],
         companyDimTwoIndustryName: [
-          { required: true, message: '请输入国民经济行业', trigger: 'change' }
+          { required: true, message: "请输入国民经济行业", trigger: "change" }
         ]
       },
       // 当前输入的地点
-      tochoosepos: '',
+      tochoosepos: "",
       map: null,
       industryNames: [],
-      region1model: '',
-      region2model: '',
-      region3model: '',
-      region4model: '',
-      region5model: '',
+      region1model: "",
+      region2model: "",
+      region3model: "",
+      region4model: "",
+      region5model: "",
       regionlevel1: [],
       regionlevel2: [],
       regionlevel3: [],
@@ -249,115 +362,129 @@ export default {
       regionlevel5: [],
       companyregions: [],
       // input选择的坐标
-      tochoosecomregion: '',
+      tochoosecomregion: "",
       // 公司选择的坐标
-      comrealpos: '',
+      comrealpos: "",
       // 5个当前地点的总计
-      completeposname: '',
+      completeposname: "",
       // 国民经济行业第一级别列表
       nationindusNames: [],
       // 国民经济行业第二级别列表
       nationindusSecondNames: [],
       // 当前选择的国民经济行业第一级别
-      curNationIndusLevel1: '',
+      curNationIndusLevel1: "",
       // 当前选择的国民经济行业第二级别
-      curNationIndusLevel2: ''
-    }
+      curNationIndusLevel2: ""
+    };
   },
   mounted() {
     // 获取行业信息
     getindustry().then(res => {
-      this.industryNames = [...res.content]
-    })
+      this.industryNames = [...res.content];
+    });
     // 获取所有省份信息
     getAllProvince().then(res => {
-      this.regionlevel1 = [...res]
-    })
+      this.regionlevel1 = [...res];
+    });
     // 在这里画地图
-    const AMap = window.AMap || {}
-    const satellite = new AMap.TileLayer.Satellite()
-    const roadNet = new AMap.TileLayer.RoadNet()
-    this.map = new AMap.Map('submitformmap', {
+    const AMap = window.AMap || {};
+    const satellite = new AMap.TileLayer.Satellite();
+    const roadNet = new AMap.TileLayer.RoadNet();
+    this.map = new AMap.Map("submitformmap", {
       resizeEnable: true, // 是否监控地图容器尺寸变化
       zoom: 16, // 初始化地图层级
       center: [122.086287, 37.493758],
-      layers: [
-        satellite,
-        roadNet
-      ]
-    })
+      layers: [satellite, roadNet]
+    });
     const marker = new AMap.Marker({
-      icon: 'https://webapi.amap.com/theme/v1.3/markers/n/mark_r.png',
+      icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_r.png",
       position: [122.086287, 37.493758],
       // anchor: 'bottom-center'
       offset: new AMap.Pixel(-10, -31),
       zIndex: 100
-    })
-    this.marker = marker
-    this.map.on('mousemove', (e) => {
-      document.querySelector('.submitmousepos').innerHTML = e.lnglat.getLng() + ',' + e.lnglat.getLat()
-    })
-    document.querySelector('.submitoriginpos').innerHTML = '122.086287, 37.493758'
+    });
+    this.marker = marker;
+    this.map.on("mousemove", e => {
+      document.querySelector(".submitmousepos").innerHTML =
+        e.lnglat.getLng() + "," + e.lnglat.getLat();
+    });
+    document.querySelector(".submitoriginpos").innerHTML =
+      "122.086287, 37.493758";
     // this.formenterinfo.companyLng = '122.086287'
     // this.formenterinfo.companyLat = '37.493758'
-    this.map.add(marker)
-    this.map.on('click', (e) => {
-      document.querySelector('.submitoriginpos').innerHTML = e.lnglat.getLng() + ',' + e.lnglat.getLat()
+    this.map.add(marker);
+    this.map.on("click", e => {
+      document.querySelector(".submitoriginpos").innerHTML =
+        e.lnglat.getLng() + "," + e.lnglat.getLat();
       // document.querySelector('.submitoriginpos').innerHTML = '122.086287, 37.493758'
       // map.remove(marker)
       // marker = new AMap.Marker({
 
       // })
-      this.map.setCenter([e.lnglat.getLng(), e.lnglat.getLat()])
-      marker.setPosition(e.lnglat)
-      this.formenterinfo.companyLng = '' + e.lnglat.getLng()
-      this.formenterinfo.companyLat = '' + e.lnglat.getLat()
-      AMap.plugin('AMap.Geocoder', () => {
+      this.map.setCenter([e.lnglat.getLng(), e.lnglat.getLat()]);
+      marker.setPosition(e.lnglat);
+      this.formenterinfo.companyLng = "" + e.lnglat.getLng();
+      this.formenterinfo.companyLat = "" + e.lnglat.getLat();
+      AMap.plugin("AMap.Geocoder", () => {
         // 在这里面获取到点击经纬度的所对应的地理信息
         const geocoder = new AMap.Geocoder({
           radius: 1000
-        })
+        });
         geocoder.getAddress(e.lnglat, (status, result) => {
-          if (status === 'complete' && result && result.info === 'OK' && result.regeocode) {
+          if (
+            status === "complete" &&
+            result &&
+            result.info === "OK" &&
+            result.regeocode
+          ) {
             /**
              * result.regeocode.addressComponent.province
              * result.regeocode.addressComponent.city
              * result.regeocode.addressComponent.district
              */
-            this.setRegionSelect(result.regeocode.addressComponent.province, result.regeocode.addressComponent.city, result.regeocode.addressComponent.district)
-            this.comrealpos = result.regeocode.formattedAddress
-            this.tochoosecomregion = this.comrealpos
-            AMap.plugin('AMap.PlaceSearch', () => {
-              const placesearch = new AMap.PlaceSearch({})
+            this.setRegionSelect(
+              result.regeocode.addressComponent.province,
+              result.regeocode.addressComponent.city,
+              result.regeocode.addressComponent.district
+            );
+            this.comrealpos = result.regeocode.formattedAddress;
+            this.tochoosecomregion = this.comrealpos;
+            AMap.plugin("AMap.PlaceSearch", () => {
+              const placesearch = new AMap.PlaceSearch({});
               placesearch.search(this.comrealpos, (status, result) => {
-                if (status === 'complete' && result.info === 'OK' && result.poiList.pois && result.poiList.pois.length > 0) {
-                  this.companyregions = [...result.poiList.pois]
+                if (
+                  status === "complete" &&
+                  result.info === "OK" &&
+                  result.poiList.pois &&
+                  result.poiList.pois.length > 0
+                ) {
+                  this.companyregions = [...result.poiList.pois];
                 }
-              })
-            })
+              });
+            });
           }
-        })
-      })
-    })
+        });
+      });
+    });
     // 获取国民行业信息
     findDimindustry().then(res => {
       // console.log(res, 'res')
-      this.nationindusNames = [...res]
-    })
-    this.searchPosPro('威海市经济技术开发区')
-    this.setRegionSelect('山东省', '威海市', '威海经济技术开发区')
-    this.formenterinfo.companyLng = '122.086287'
-    this.formenterinfo.companyLat = '37.493758'
+      this.nationindusNames = [...res];
+    });
+    this.searchPosPro("威海市经济技术开发区");
+    this.setRegionSelect("山东省", "威海市", "威海经济技术开发区");
+    this.formenterinfo.companyLng = "122.086287";
+    this.formenterinfo.companyLat = "37.493758";
   },
   methods: {
     searchpos() {
       // const AMap = window.AMap || {}
-      const tochoosepos = this.tochoosepos
+      const tochoosepos = this.tochoosepos;
       // const map = this.map || {}
-      if (tochoosepos === '') {
-        return
+      if (tochoosepos === "") {
+        return;
       }
-      if (tochoosepos !== '') {
+      if (tochoosepos !== "") {
         // AMap.plugin('AMap.DistrictSearch', function() {
         //   // 创建行政区查询对象
         //   const district = new AMap.DistrictSearch({
@@ -391,280 +518,328 @@ export default {
     searchcom() {
       // 搜索公司
       // companyregions
-      const AMap = window.AMap || {}
-      const tochoosecomregion = this.tochoosecomregion
+      const AMap = window.AMap || {};
+      const tochoosecomregion = this.tochoosecomregion;
       // const map = this.map || {}
-      if (tochoosecomregion === '') {
-        return
+      if (tochoosecomregion === "") {
+        return;
       }
-      if (tochoosecomregion !== '') {
-        AMap.plugin('AMap.PlaceSearch', () => {
+      if (tochoosecomregion !== "") {
+        AMap.plugin("AMap.PlaceSearch", () => {
           // 查询公司地点
           const placesearch = new AMap.PlaceSearch({
             // map: map
-          })
+          });
           placesearch.search(tochoosecomregion, (status, result) => {
-            if (status === 'complete' && result.info === 'OK' && result.poiList.pois && result.poiList.pois.length > 0) {
-              this.companyregions = [...result.poiList.pois]
+            if (
+              status === "complete" &&
+              result.info === "OK" &&
+              result.poiList.pois &&
+              result.poiList.pois.length > 0
+            ) {
+              this.companyregions = [...result.poiList.pois];
             }
-          })
-        })
+          });
+        });
       }
     },
     region1schange() {
       // 根据region1model选择区域
       // this.regionlevel2 =
       findAreaByCode(Number(this.region1model), 1).then(res => {
-        this.regionlevel2 = [...res]
-      })
+        this.regionlevel2 = [...res];
+      });
       this.completeposname = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
-      this.tochoosecomregion = this.completeposname
-      this.searchPosPro(this.tochoosecomregion)
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
+      this.tochoosecomregion = this.completeposname;
+      this.searchPosPro(this.tochoosecomregion);
       this.formenterinfo.companyProvince = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
     },
     region2schange() {
       findAreaByCode(Number(this.region2model), 2).then(res => {
-        this.regionlevel3 = [...res]
-      })
+        this.regionlevel3 = [...res];
+      });
       this.completeposname = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
       this.completeposname += this.regionlevel2.filter(item => {
-        return item.areaCode === Number(this.region2model)
-      })[0].name
-      this.tochoosecomregion = this.completeposname
-      this.searchPosPro(this.tochoosecomregion)
+        return item.areaCode === Number(this.region2model);
+      })[0].name;
+      this.tochoosecomregion = this.completeposname;
+      this.searchPosPro(this.tochoosecomregion);
       this.formenterinfo.companyCity = this.regionlevel2.filter(item => {
-        return item.areaCode === Number(this.region2model)
-      })[0].name
+        return item.areaCode === Number(this.region2model);
+      })[0].name;
     },
     region3schange() {
       findAreaByCode(Number(this.region3model), 3).then(res => {
-        this.regionlevel4 = [...res]
-      })
+        this.regionlevel4 = [...res];
+      });
       this.completeposname = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
       this.completeposname += this.regionlevel2.filter(item => {
-        return item.areaCode === Number(this.region2model)
-      })[0].name
+        return item.areaCode === Number(this.region2model);
+      })[0].name;
       this.completeposname += this.regionlevel3.filter(item => {
-        return item.areaCode === Number(this.region3model)
-      })[0].name
-      this.tochoosecomregion = this.completeposname
-      this.searchPosPro(this.tochoosecomregion)
+        return item.areaCode === Number(this.region3model);
+      })[0].name;
+      this.tochoosecomregion = this.completeposname;
+      this.searchPosPro(this.tochoosecomregion);
       this.formenterinfo.companyCounty = this.regionlevel3.filter(item => {
-        return item.areaCode === Number(this.region3model)
-      })[0].name
+        return item.areaCode === Number(this.region3model);
+      })[0].name;
     },
     region4schange() {
       findAreaByCode(Number(this.region4model), 4).then(res => {
-        this.regionlevel5 = [...res]
-      })
+        this.regionlevel5 = [...res];
+      });
       this.completeposname = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
       this.completeposname += this.regionlevel2.filter(item => {
-        return item.areaCode === Number(this.region2model)
-      })[0].name
+        return item.areaCode === Number(this.region2model);
+      })[0].name;
       this.completeposname += this.regionlevel3.filter(item => {
-        return item.areaCode === Number(this.region3model)
-      })[0].name
+        return item.areaCode === Number(this.region3model);
+      })[0].name;
       this.completeposname += this.regionlevel4.filter(item => {
-        return item.areaCode === Number(this.region4model)
-      })[0].name
-      this.tochoosecomregion = this.completeposname
-      this.searchPosPro(this.tochoosecomregion)
+        return item.areaCode === Number(this.region4model);
+      })[0].name;
+      this.tochoosecomregion = this.completeposname;
+      this.searchPosPro(this.tochoosecomregion);
       this.formenterinfo.companyCommunity = this.regionlevel4.filter(item => {
-        return item.areaCode === Number(this.region4model)
-      })[0].name
+        return item.areaCode === Number(this.region4model);
+      })[0].name;
     },
     region5schange() {
       this.completeposname = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
       this.completeposname += this.regionlevel2.filter(item => {
-        return item.areaCode === Number(this.region2model)
-      })[0].name
+        return item.areaCode === Number(this.region2model);
+      })[0].name;
       this.completeposname += this.regionlevel3.filter(item => {
-        return item.areaCode === Number(this.region3model)
-      })[0].name
+        return item.areaCode === Number(this.region3model);
+      })[0].name;
       this.completeposname += this.regionlevel4.filter(item => {
-        return item.areaCode === Number(this.region4model)
-      })[0].name
+        return item.areaCode === Number(this.region4model);
+      })[0].name;
       this.completeposname += this.regionlevel5.filter(item => {
-        return item.areaCode === Number(this.region5model)
-      })[0].name
-      this.tochoosecomregion = this.completeposname
-      this.searchPosPro(this.tochoosecomregion)
+        return item.areaCode === Number(this.region5model);
+      })[0].name;
+      this.tochoosecomregion = this.completeposname;
+      this.searchPosPro(this.tochoosecomregion);
       this.formenterinfo.companyTown = this.regionlevel5.filter(item => {
-        return item.areaCode === Number(this.region5model)
-      })[0].name
+        return item.areaCode === Number(this.region5model);
+      })[0].name;
     },
     // 获取公司选中的位置，差一个定位中心
     comrealposselect(e) {
-      const AMap = window.AMap || {}
-      this.formenterinfo.companyLng = this.comrealpos.split(',')[0]
-      this.formenterinfo.companyLat = this.comrealpos.split(',')[1]
-      this.map.setCenter([Number(this.comrealpos.split(',')[0]), Number(this.comrealpos.split(',')[1])])
-      this.marker.setPosition(new AMap.LngLat(Number(this.comrealpos.split(',')[0]), Number(this.comrealpos.split(',')[1])))
-      document.querySelector('.submitoriginpos').innerHTML = this.comrealpos
+      const AMap = window.AMap || {};
+      this.formenterinfo.companyLng = this.comrealpos.split(",")[0];
+      this.formenterinfo.companyLat = this.comrealpos.split(",")[1];
+      this.map.setCenter([
+        Number(this.comrealpos.split(",")[0]),
+        Number(this.comrealpos.split(",")[1])
+      ]);
+      this.marker.setPosition(
+        new AMap.LngLat(
+          Number(this.comrealpos.split(",")[0]),
+          Number(this.comrealpos.split(",")[1])
+        )
+      );
+      document.querySelector(".submitoriginpos").innerHTML = this.comrealpos;
     },
     // 一个专门查询的方法
     searchPosPro(tochoosecomregion) {
       // 搜索公司
       // companyregions
-      const AMap = window.AMap || {}
+      const AMap = window.AMap || {};
       // const tochoosecomregion = this.tochoosecomregion
       // const map = this.map || {}
-      if (tochoosecomregion === '') {
-        return
+      if (tochoosecomregion === "") {
+        return;
       }
-      if (tochoosecomregion !== '') {
-        AMap.plugin('AMap.PlaceSearch', () => {
+      if (tochoosecomregion !== "") {
+        AMap.plugin("AMap.PlaceSearch", () => {
           // 查询公司地点
           const placesearch = new AMap.PlaceSearch({
             // map: this.map
-          })
+          });
           placesearch.search(tochoosecomregion, (status, result) => {
-            if (status === 'complete' && result.info === 'OK' && result.poiList.pois && result.poiList.pois.length > 0) {
-              this.companyregions = [...result.poiList.pois]
+            if (
+              status === "complete" &&
+              result.info === "OK" &&
+              result.poiList.pois &&
+              result.poiList.pois.length > 0
+            ) {
+              this.companyregions = [...result.poiList.pois];
               if (this.companyregions.length > 0) {
-                this.comrealpos = this.companyregions[0].location.lng + ',' + this.companyregions[0].location.lat
-                this.marker.setPosition(new AMap.LngLat(Number(this.comrealpos.split(',')[0]), Number(this.comrealpos.split(',')[1])))
-                this.map.setCenter(new AMap.LngLat(Number(this.comrealpos.split(',')[0]), Number(this.comrealpos.split(',')[1])))
-                this.formenterinfo.companyLng = this.comrealpos.split(',')[0]
-                this.formenterinfo.companyLat = this.comrealpos.split(',')[1]
+                this.comrealpos =
+                  this.companyregions[0].location.lng +
+                  "," +
+                  this.companyregions[0].location.lat;
+                this.marker.setPosition(
+                  new AMap.LngLat(
+                    Number(this.comrealpos.split(",")[0]),
+                    Number(this.comrealpos.split(",")[1])
+                  )
+                );
+                this.map.setCenter(
+                  new AMap.LngLat(
+                    Number(this.comrealpos.split(",")[0]),
+                    Number(this.comrealpos.split(",")[1])
+                  )
+                );
+                this.formenterinfo.companyLng = this.comrealpos.split(",")[0];
+                this.formenterinfo.companyLat = this.comrealpos.split(",")[1];
               }
             }
-          })
-        })
+          });
+        });
       }
     },
     // 提交表单
     submitlittleform() {
       // 转换数字
-      const testNum = Number(this.formenterinfo.companyPeople)
-      console.log(testNum, '是否汇报异常')
+      const testNum = Number(this.formenterinfo.companyPeople);
+      console.log(testNum, "是否汇报异常");
       if (isNaN(testNum)) {
-        this.$confirm('请输入正确的企业人数', '提示', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning'
-        }).then(() => {}, () => {})
-        return
+        this.$confirm("请输入正确的企业人数", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(() => {}, () => {});
+        return;
       }
-      this.$refs.formenterinfo1.validate((valid) => {
+      this.$refs.formenterinfo1.validate(valid => {
         if (valid) {
           // 在这里判断this.formenterinfo
           // this.formenterinfo.com
           // let isFormValid = false
-          if (this.formenterinfo.companyLng === '') {
-            this.$message.error('请填写经纬度')
-            return
+          if (this.formenterinfo.companyLng === "") {
+            this.$message.error("请填写经纬度");
+            return;
           }
-          if (this.formenterinfo.companyLat === '') {
-            this.$message.error('请填写经纬度')
-            return
+          if (this.formenterinfo.companyLat === "") {
+            this.$message.error("请填写经纬度");
+            return;
           }
-          addCompanyInfo(this.formenterinfo).then(res => {
-            this.$message({
-              showClose: true,
-              message: '提交成功',
-              type: 'success'
-            })
-          }, () => {
-            this.$message({
-              showClose: true,
-              message: '提交失败',
-              type: 'error'
-            })
-          })
+          addCompanyInfo(this.formenterinfo).then(
+            res => {
+              this.$message({
+                showClose: true,
+                message: "提交成功",
+                type: "success"
+              });
+            },
+            () => {
+              this.$message({
+                showClose: true,
+                message: "提交失败",
+                type: "error"
+              });
+            }
+          );
         } else {
           this.$message({
-            message: '请传入正确信息',
-            type: 'warning'
-          })
+            message: "请传入正确信息",
+            type: "warning"
+          });
         }
-      })
+      });
     },
     // 根据省市区设置
     async setRegionSelect(province, city, district) {
-      if (this.formenterinfo.companyProvince === province && this.formenterinfo.companyCity === city && this.formenterinfo.companyCounty === district) {
-        console.log('')
+      if (
+        this.formenterinfo.companyProvince === province &&
+        this.formenterinfo.companyCity === city &&
+        this.formenterinfo.companyCounty === district
+      ) {
+        console.log("");
       } else {
-        this.regionlevel4 = []
-        this.regionlevel5 = []
-        this.region4model = ''
-        this.region5model = ''
+        this.regionlevel4 = [];
+        this.regionlevel5 = [];
+        this.region4model = "";
+        this.region5model = "";
         // 获取所有省份信息
         await getAllProvince().then(res => {
-          this.regionlevel1 = [...res]
-        })
-        const areaCode1 = this.regionlevel1.filter(item => item.name === province)[0].areaCode
+          this.regionlevel1 = [...res];
+        });
+        const areaCode1 = this.regionlevel1.filter(
+          item => item.name === province
+        )[0].areaCode;
         await findAreaByCode(areaCode1, 1).then(res => {
-          this.regionlevel2 = [...res]
-        })
-        const areaCode2 = this.regionlevel2.filter(item => item.name === city)[0].areaCode
+          this.regionlevel2 = [...res];
+        });
+        const areaCode2 = this.regionlevel2.filter(
+          item => item.name === city
+        )[0].areaCode;
         await findAreaByCode(areaCode2, 2).then(res => {
-          this.regionlevel3 = [...res]
-        })
-        const areaCode3 = this.regionlevel3.filter(item => item.name === district)[0].areaCode
+          this.regionlevel3 = [...res];
+        });
+        const areaCode3 = this.regionlevel3.filter(
+          item => item.name === district
+        )[0].areaCode;
         await findAreaByCode(areaCode3, 3).then(res => {
-          this.regionlevel4 = [...res]
-        })
-        this.region1model = areaCode1
-        this.region2model = areaCode2
-        this.region3model = areaCode3
-        this.formenterinfo.companyProvince = province
-        this.formenterinfo.companyCity = city
-        this.formenterinfo.companyCounty = district
-        this.formenterinfo.companyCommunity = ''
-        this.formenterinfo.companyTown = ''
+          this.regionlevel4 = [...res];
+        });
+        this.region1model = areaCode1;
+        this.region2model = areaCode2;
+        this.region3model = areaCode3;
+        this.formenterinfo.companyProvince = province;
+        this.formenterinfo.companyCity = city;
+        this.formenterinfo.companyCounty = district;
+        this.formenterinfo.companyCommunity = "";
+        this.formenterinfo.companyTown = "";
       }
     },
     // 选择当前的国民第一行业
     nationInduschangelevel1() {
       // 动态获取国民第二行业
       // nationindusSecondNames
-      findDimindustry(this.nationindusNames.filter(item => item.name === this.curNationIndusLevel1)[0].industryId).then(res => {
-        this.nationindusSecondNames = [...res]
-      })
-      this.formenterinfo.companyDimOneIndustryName = this.curNationIndusLevel1
+      findDimindustry(
+        this.nationindusNames.filter(
+          item => item.name === this.curNationIndusLevel1
+        )[0].industryId
+      ).then(res => {
+        this.nationindusSecondNames = [...res];
+      });
+      this.formenterinfo.companyDimOneIndustryName = this.curNationIndusLevel1;
     },
     // 选择当前的国民第二行业
     nationInduschangelevel2() {
       // 改变当前的国民第二行业
-      this.formenterinfo.companyDimTwoIndustryName = this.curNationIndusLevel2
+      this.formenterinfo.companyDimTwoIndustryName = this.curNationIndusLevel2;
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
-  .addinfo-wrapper {
-    padding: 26px;
-    .submitbtnwrapper {
+.addinfo-wrapper {
+  padding: 26px;
+  .submitbtnwrapper {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-end;
+    margin-right: 20px;
+  }
+  .submit-map-wrapper {
+    margin-left: 180px;
+    margin-right: 20px;
+    #submitformmap {
+      width: 100%;
+      height: 450px;
+    }
+    .pos-info-wrapper {
       display: flex;
       flex-direction: row;
-      justify-content: flex-end;
-      margin-right: 20px;
-    }
-    .submit-map-wrapper {
-      margin-left: 180px;
-      margin-right: 20px;
-      #submitformmap {
-        width: 100%;
-        height: 450px;
-      }
-      .pos-info-wrapper {
-        display: flex;
-        flex-direction: row;
-      }
     }
   }
+}
 </style>

src/views/advice/addadvice.vue

 <template>
   <div class="total-wrapper">
-    <el-form
-      ref="addform"
-      :model="formInfo"
-      :rules="rules"
-    >
+    <el-form ref="addform" :model="formInfo" :rules="rules">
       <el-form-item label="通知通告标题" :label-width="'120px'" prop="title">
-        <el-input v-model="formInfo.title" :maxlength="50" style="width: 500px" />
+        <el-input
+          v-model="formInfo.title"
+          :maxlength="50"
+          style="width: 500px"
+        />
       </el-form-item>
       <el-form-item label="通知公司" :label-width="'120px'" prop="depart">
         <el-select
@@ -17,12 +17,14 @@
           reserve-keyword
           placeholder="请输入关键词"
           :remote-method="remoteFetchMethod"
-          :loading="fetchLoading">
+          :loading="fetchLoading"
+        >
           <el-option
             v-for="item in companys"
             :key="item.companyId"
             :label="item.companyName"
-            :value="item.companyId">
+            :value="item.companyId"
+          >
           </el-option>
         </el-select>
       </el-form-item>
@@ -48,159 +50,166 @@
     <div class="pulish-wrapper">
       <el-button type="info" @click="clearContent">清空</el-button>
       <el-button type="success" @click="saveStorage">保存</el-button>
-      <el-button type="primary" @click="publishLaw" v-loading="publishLoading">发布</el-button>
+      <el-button type="primary" @click="publishLaw" v-loading="publishLoading"
+        >发布</el-button
+      >
     </div>
   </div>
 </template>
 
 <script>
-import { getAllCompanyInfo } from '@/api/industry.js'
-import { postNotice } from '@/api/opeAdvice.js'
-import Editor from '@tinymce/tinymce-vue'
+import { getAllCompanyInfo } from "@/api/industry.js";
+import { postNotice } from "@/api/opeAdvice.js";
+import Editor from "@tinymce/tinymce-vue";
 export default {
   components: {
-    'editor': Editor
+    editor: Editor
   },
   data() {
     return {
       formInfo: {
-        title: '',
-        depart: '',
-        time: '',
-        content: ''
+        title: "",
+        depart: "",
+        time: "",
+        content: ""
       },
       rules: {
         title: [
           {
             required: true,
-            message: '请输入标题',
-            trigger: 'blur'
+            message: "请输入标题",
+            trigger: "blur"
           }
         ],
         depart: [
           {
             required: true,
-            message: '请选择通知公司',
-            trigger: 'change'
+            message: "请选择通知公司",
+            trigger: "change"
           }
-        ],
+        ]
       },
       // 经法局列表
       departList: [
         {
-          value: '经发局（应急局）',
-          label: '经发局（应急局）'
+          value: "经发局（应急局）",
+          label: "经发局（应急局）"
         },
         {
-          value: '建设局',
-          label: '建设局'
+          value: "建设局",
+          label: "建设局"
         },
         {
-          value: '市场监督管理局',
-          label: '市场监督管理局'
+          value: "市场监督管理局",
+          label: "市场监督管理局"
         },
         {
-          value: '生态环境局',
-          label: '生态环境局'
+          value: "生态环境局",
+          label: "生态环境局"
         },
         {
-          value: '商务局',
-          label: '商务局'
+          value: "商务局",
+          label: "商务局"
         }
       ],
       companys: [],
       fetchLoading: false,
       publishLoading: false
-    }
+    };
   },
   mounted() {
-    const curLawItem = localStorage.getItem('curAdviceItem')
+    const curLawItem = localStorage.getItem("curAdviceItem");
     if (curLawItem) {
       // localStorage.setItem('curLawItem', )
-      this.formInfo = { ...JSON.parse(curLawItem) }
+      this.formInfo = { ...JSON.parse(curLawItem) };
     }
   },
   methods: {
     publishLaw() {
       // 校验
-      this.$refs.addform.validate((valid) => {
+      this.$refs.addform.validate(valid => {
         if (valid) {
           // 发布
           // 调用 axios
           // 调用 localStorage 的removeItem()方法去掉 curLawItem
-          this.publishLoading = true
+          this.publishLoading = true;
           postNotice({
             companyIds: this.formInfo.depart,
             noticeContent: this.formInfo.content,
             noticeTitle: this.formInfo.title
-          }).then(res => {
-            this.$message({
-              type: 'success',
-              message: '添加成功'
-            })
-            this.publishLoading = false
-            localStorage.removeItem('curAdviceItem')
-          }).catch(() => {
-            this.$message.error('添加失败')
-            this.publishLoading = false
           })
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.publishLoading = false;
+              localStorage.removeItem("curAdviceItem");
+            })
+            .catch(() => {
+              this.$message.error("添加失败");
+              this.publishLoading = false;
+            });
         } else {
-          this.$message.error('请输入信息')
+          this.$message.error("请输入信息");
         }
-      })
+      });
     },
     clearContent() {
-      this.formInfo.title = ''
-      this.formInfo.depart = ''
-      this.formInfo.time = ''
-      this.formInfo.content = ''
+      this.formInfo.title = "";
+      this.formInfo.depart = "";
+      this.formInfo.time = "";
+      this.formInfo.content = "";
       // 调用 localStorage 的removeItem()方法去掉 curLawItem
-      localStorage.removeItem('curAdviceItem')
+      localStorage.removeItem("curAdviceItem");
     },
     saveStorage() {
       //
       // localStorage.getItem
-      localStorage.setItem('curAdviceItem', JSON.stringify(this.formInfo))
+      localStorage.setItem("curAdviceItem", JSON.stringify(this.formInfo));
     },
     remoteFetchMethod(query) {
-      if (query !== '') {
+      if (query !== "") {
         this.fetchLoading = true;
         getAllCompanyInfo({
           page: 0,
           size: 10,
           companyName: query
-        }).then(res => {
-          this.companys = [...res.content]
-          this.fetchLoading = false
-          this.formInfo = {
-            title: '',
-            depart: '',
-            time: '',
-            content: ''
+        }).then(
+          res => {
+            this.companys = [...res.content];
+            this.fetchLoading = false;
+            this.formInfo = {
+              title: "",
+              depart: "",
+              time: "",
+              content: ""
+            };
+          },
+          () => {
+            this.fetchLoading = false;
           }
-        },() => {
-          this.fetchLoading = false
-        })
+        );
       } else {
-        this.companys = []
+        this.companys = [];
       }
     }
   }
-}
+};
 </script>
 
-<style lang="scss">
-  .editor-wrapper {
-    padding: 10px 20px;
-  }
-  .pulish-wrapper {
-    margin-top: 20px;
-    display: flex;
-    justify-content: flex-end;
-    margin-right: 20px;
-    margin-bottom: 10px;
-  }
-  .total-wrapper {
-    padding: 20px;
-  }
+<style lang="scss" scoped>
+.editor-wrapper {
+  padding: 10px 20px;
+}
+.pulish-wrapper {
+  margin-top: 20px;
+  display: flex;
+  justify-content: flex-end;
+  margin-right: 20px;
+  margin-bottom: 10px;
+}
+.total-wrapper {
+  padding: 20px;
+}
 </style>

src/views/advice/editadvice.vue

 <template>
   <div class="total-wrapper">
-    <el-form
-      ref="addform"
-      :model="formInfo"
-      :rules="rules"
-    >
+    <el-form ref="addform" :model="formInfo" :rules="rules">
       <el-form-item label="通知通告标题" :label-width="'120px'" prop="title">
-        <el-input v-model="formInfo.title" :maxlength="50" style="width: 500px" />
+        <el-input
+          v-model="formInfo.title"
+          :maxlength="50"
+          style="width: 500px"
+        />
       </el-form-item>
-      
+
       <!-- <el-form-item label="发布部门" :label-width="'120px'" prop="depart">
         <el-input v-model="formInfo.depart" :maxlength="50" style="width: 500px" />
         <el-select v-model="formInfo.depart" placeholder="请选择部门">
@@ -53,117 +53,125 @@
 </template>
 
 <script>
-import Editor from '@tinymce/tinymce-vue'
-import { putNotice } from '@/api/opeAdvice.js'
+import Editor from "@tinymce/tinymce-vue";
+import { putNotice } from "@/api/opeAdvice.js";
 export default {
   components: {
-    'editor': Editor
+    editor: Editor
   },
   data() {
     return {
       formInfo: {
-        title: '',
-        depart: '',
-        time: '',
-        content: ''
+        title: "",
+        depart: "",
+        time: "",
+        content: ""
       },
       rules: {
         title: [
           {
             required: true,
-            message: '请输入标题',
-            trigger: 'blur'
+            message: "请输入标题",
+            trigger: "blur"
           }
         ]
       },
       // 经法局列表
       departList: [
         {
-          value: '经发局（应急局）',
-          label: '经发局（应急局）'
+          value: "经发局（应急局）",
+          label: "经发局（应急局）"
         },
         {
-          value: '建设局',
-          label: '建设局'
+          value: "建设局",
+          label: "建设局"
         },
         {
-          value: '市场监督管理局',
-          label: '市场监督管理局'
+          value: "市场监督管理局",
+          label: "市场监督管理局"
         },
         {
-          value: '生态环境局',
-          label: '生态环境局'
+          value: "生态环境局",
+          label: "生态环境局"
         },
         {
-          value: '商务局',
-          label: '商务局'
+          value: "商务局",
+          label: "商务局"
         }
       ]
-    }
+    };
   },
   mounted() {
-    const curLawItem = localStorage.getItem('curAdviceItem1')
+    const curLawItem = localStorage.getItem("curAdviceItem1");
     if (curLawItem) {
       // localStorage.setItem('curLawItem', )
-      this.formInfo = { ...JSON.parse(curLawItem) }
+      this.formInfo = { ...JSON.parse(curLawItem) };
     } else {
-      console.log(this.$store.getters.curAdviceItem, 'this.$store.getters.curAdviceItem')
-      this.formInfo = { ...this.$store.getters.curAdviceItem }
+      console.log(
+        this.$store.getters.curAdviceItem,
+        "this.$store.getters.curAdviceItem"
+      );
+      this.formInfo = { ...this.$store.getters.curAdviceItem };
     }
   },
   methods: {
     publishLaw() {
       // 校验
-      this.$refs.addform.validate((valid) => {
+      this.$refs.addform.validate(valid => {
         if (valid) {
           // 发布
           // 调用 axios
           // 调用 localStorage 的removeItem()方法去掉 curLawItem
-          putNotice({...this.formInfo, noticeTitle: this.formInfo.title,noticeContent: this.formInfo.content})
-          .then(res => {
-            console.log(res, 'putNotice')
-            this.$message({
-              type: 'success',
-              message: '修改成功'
-            })
-            localStorage.removeItem('curAdviceItem1')
-            window.history.back()
-          }).catch(() => {
-            this.$message.error('修改失败')
+          putNotice({
+            ...this.formInfo,
+            noticeTitle: this.formInfo.title,
+            noticeContent: this.formInfo.content
           })
+            .then(res => {
+              console.log(res, "putNotice");
+              this.$message({
+                type: "success",
+                message: "修改成功"
+              });
+              localStorage.removeItem("curAdviceItem1");
+              window.history.back();
+            })
+            .catch(() => {
+              this.$message.error("修改失败");
+            });
         } else {
-          this.$message.error('请输入信息')
+          this.$message.error("请输入信息");
         }
-      })
+      });
     },
     clearContent() {
-      this.formInfo.title = ''
-      this.formInfo.depart = ''
-      this.formInfo.time = ''
-      this.formInfo.content = ''
+      this.formInfo.title = "";
+      this.formInfo.depart = "";
+      this.formInfo.time = "";
+      this.formInfo.content = "";
       // 调用 localStorage 的removeItem()方法去掉 curLawItem
-      localStorage.removeItem('curAdviceItem1')
+      localStorage.removeItem("curAdviceItem1");
     },
     saveStorage() {
       //
       // localStorage.getItem
-      localStorage.setItem('curAdviceItem1', JSON.stringify(this.formInfo))
+      localStorage.setItem("curAdviceItem1", JSON.stringify(this.formInfo));
     }
   }
-}
+};
 </script>
 
-<style lang="scss">
-  .editor-wrapper {
-    padding: 10px 20px;
-  }
-  .pulish-wrapper {
-    margin-top: 20px;
-    display: flex;
-    justify-content: flex-end;
-    margin-right: 20px;
-  }
-  .total-wrapper {
-    padding: 30px;
-  }
+<style lang="scss" scoped>
+.editor-wrapper {
+  padding: 10px 20px;
+}
+.pulish-wrapper {
+  margin-top: 20px;
+  display: flex;
+  justify-content: flex-end;
+  margin-right: 20px;
+}
+.total-wrapper {
+  padding: 30px;
+}
 </style>

src/views/advice/index.vue

@@ -2,8 +2,12 @@
   <div class="total-wrpaper">
     <div class="tool-wrapper">
       <el-button type="primary" @click="addDialogShow">新增</el-button>
-      <el-button :disabled="isEditable" type="warning" @click="editAdvices">编辑</el-button>
-      <el-button :disabled="isDeleteable" type="danger" @click="deleteAdvices">删除</el-button>
+      <el-button :disabled="isEditable" type="warning" @click="editAdvices"
+        >编辑</el-button
+      >
+      <el-button :disabled="isDeleteable" type="danger" @click="deleteAdvices"
+        >删除</el-button
+      >
     </div>
     <div class="table-wrapper">
       <el-table
@@ -12,23 +16,10 @@
         border
         @selection-change="handleSelectionChange"
       >
-        <el-table-column
-          type="selection"
-          width="55"
-        />
-        <el-table-column
-          prop="title"
-          label="标题"
-          width="780"
-        />
-        <el-table-column
-          prop="depart"
-          label="发布人"
-        />
-        <el-table-column
-          prop="time"
-          label="发布时间"
-        />
+        <el-table-column type="selection" width="55" />
+        <el-table-column prop="title" label="标题" width="780" />
+        <el-table-column prop="depart" label="发布人" />
+        <el-table-column prop="time" label="发布时间" />
       </el-table>
       <el-pagination
         :current-page="currentPage"
@@ -44,15 +35,19 @@
 </template>
 
 <script>
-import { getNotice, postNotice, putNotice, deleteNotice} from '@/api/opeAdvice.js'
+import {
+  getNotice,
+  postNotice,
+  putNotice,
+  deleteNotice
+} from "@/api/opeAdvice.js";
 export default {
   data() {
     return {
-      tableData: [
-      ],
-      inputDate: '',
-      keyword: '',
-      publishPerson: '',
+      tableData: [],
+      inputDate: "",
+      keyword: "",
+      publishPerson: "",
       multipleSelection: [],
       isEditable: true,
       isDeleteable: true,
@@ -60,32 +55,32 @@ export default {
       addDialogFormVisible: false,
       // form
       formInfo: {
-        title: '',
-        depart: '',
-        time: '',
-        content: ''
+        title: "",
+        depart: "",
+        time: "",
+        content: ""
       },
       // 经发局列表
       departList: [
         {
-          value: '经发局（应急局）',
-          label: '经发局（应急局）'
+          value: "经发局（应急局）",
+          label: "经发局（应急局）"
         },
         {
-          value: '建设局',
-          label: '建设局'
+          value: "建设局",
+          label: "建设局"
         },
         {
-          value: '市场监督管理局',
-          label: '市场监督管理局'
+          value: "市场监督管理局",
+          label: "市场监督管理局"
         },
         {
-          value: '生态环境局',
-          label: '生态环境局'
+          value: "生态环境局",
+          label: "生态环境局"
         },
         {
-          value: '商务局',
-          label: '商务局'
+          value: "商务局",
+          label: "商务局"
         }
       ],
       // 规则
@@ -99,50 +94,50 @@ export default {
         title: [
           {
             required: true,
-            message: '请输入标题',
-            trigger: 'blur'
+            message: "请输入标题",
+            trigger: "blur"
           }
         ],
         depart: [
           {
             required: true,
-            message: '请选择经管部门',
-            trigger: 'change'
+            message: "请选择经管部门",
+            trigger: "change"
           }
         ],
         time: [
           {
             required: true,
-            message: '请选择发布时间',
-            trigger: 'change'
+            message: "请选择发布时间",
+            trigger: "change"
           }
         ],
         content: [
           {
             required: true,
-            message: '请输入内容',
-            trigger: 'blur'
+            message: "请输入内容",
+            trigger: "blur"
           }
         ]
       },
       currentPage: 1,
       curPageSize: 10,
       totalColumn: 40
-    }
+    };
   },
   mounted() {
-    this.initAllNotices()
+    this.initAllNotices();
   },
   methods: {
     handleSelectionChange(val) {
-      this.multipleSelection = val
-      this.isEditable = true
-      this.isDeleteable = true
+      this.multipleSelection = val;
+      this.isEditable = true;
+      this.isDeleteable = true;
       if (this.multipleSelection.length === 1) {
-        this.isEditable = false
+        this.isEditable = false;
       }
       if (this.multipleSelection.length > 0) {
-        this.isDeleteable = false
+        this.isDeleteable = false;
       }
     },
     // 显示增加对话框
@@ -153,41 +148,45 @@ export default {
       // this.formInfo.content = ''
       // this.addDialogFormVisible = true
       this.$router.push({
-        path: '/train/advice/addadvice'
-      })
+        path: "/train/advice/addadvice"
+      });
     },
     // 发布通知通告
     publishAdvice() {
-      this.$refs['addform'].validate((valid) => {
+      this.$refs["addform"].validate(valid => {
         if (valid) {
           // 发布
         } else {
-          this.$message.error('请输入信息')
+          this.$message.error("请输入信息");
         }
-      })
+      });
     },
     // 编辑通知通告
     editAdvices() {
       // console.log(this.multipleSelection, '当前选择的通知通告')
       // console.log(this.$store.advice.curAdviceItem, 'this.$store.advice.curAdviceItem')
-      this.$store.dispatch('setAdviceItem', this.multipleSelection[0]).then(() => {
-        this.$router.push({
-          path: '/train/advice/editadvice'
-        })
-      })
+      this.$store
+        .dispatch("setAdviceItem", this.multipleSelection[0])
+        .then(() => {
+          this.$router.push({
+            path: "/train/advice/editadvice"
+          });
+        });
     },
     // 删除通知通告
     deleteAdvices() {
-      deleteNotice(this.multipleSelection.map(item => item.noticeId))
-      .then(res => {
-        this.$message({
-          type: 'success',
-          message: '删除成功'
-        })
-        this.initAllNotices()
-      }, () => {
-        this.$message.error('删除失败')
-      })
+      deleteNotice(this.multipleSelection.map(item => item.noticeId)).then(
+        res => {
+          this.$message({
+            type: "success",
+            message: "删除成功"
+          });
+          this.initAllNotices();
+        },
+        () => {
+          this.$message.error("删除失败");
+        }
+      );
     },
     // 搜索通知通告
     searchAdvice() {
@@ -195,59 +194,57 @@ export default {
     },
     handleSizeChange(val) {
       // 每页多少条
-      this.curPageSize = val
+      this.curPageSize = val;
     },
     handleCurrentChange(val) {
       // 当前是多少页
-      this.currentPage = val
+      this.currentPage = val;
     },
     initAllNotices() {
       getNotice({
         page: this.currentPage - 1,
         size: this.curPageSize,
-        sort: 'noticeId,desc'
-      }).then(res => {
-        console.log(res, 'getNotice initALlNotices')
-        res.content.forEach(item => {
-          item.title = item.noticeTitle
-          item.depart = item.noticePublisher
-          item.time = item.updateTime
-          item.content = item.noticeContent
+        sort: "noticeId,desc"
+      })
+        .then(res => {
+          console.log(res, "getNotice initALlNotices");
+          res.content.forEach(item => {
+            item.title = item.noticeTitle;
+            item.depart = item.noticePublisher;
+            item.time = item.updateTime;
+            item.content = item.noticeContent;
+          });
+          this.tableData = [...res.content];
+          this.totalColumn = res.totalElements;
         })
-        this.tableData = [...res.content]
-      }).catch(() => {})
+        .catch(() => {});
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-  .total-wrpaper {
-    margin: 30px auto;
-    width: 80%;
-    box-shadow: 0 0 9px 1px #eee;
-    border-radius: 20px;
-    padding: 20px;
-    .tool-wrapper {
-      width: 80%;
-      margin: 30px auto;
-      box-shadow: 0 0 9px 1px #eee;
-      border-radius: 10px;
-      padding: 10px;
-    }
-    .law-search-wrapper {
-      width: 80%;
-      margin: 30px auto;
-      box-shadow: 0 0 9px 1px #eee;
-      border-radius: 10px;
-      padding: 10px;
-    }
-    .table-wrapper {
-      width: 80%;
-      margin: 30px auto;
-      box-shadow: 0 0 9px 1px #eee;
-      border-radius: 15px;
-      padding: 15px;
-    }
+.total-wrpaper {
+  margin: 10px 10px;
+  border-radius: 5px;
+  padding: 10px;
+  .tool-wrapper {
+    margin: 10px 10px;
+    border-radius: 5px;
+    padding: 10px;
+    background: #fff;
   }
+  .law-search-wrapper {
+    margin: 10px 10px;
+    border-radius: 5px;
+    padding: 10px;
+    background: #fff;
+  }
+  .table-wrapper {
+    margin: 10px 10px;
+    border-radius: 5px;
+    padding: 10px;
+    background: #fff;
+  }
+}
 </style>

src/views/cerl/index.vue

@@ -6,13 +6,20 @@
           <el-input v-model="enterinfoByRisk" placeholder="请输入企业名称" />
         </el-col>
         <el-col :span="10">
-          <el-button type="success" size="mini" @click="searchEnterInfo">搜索</el-button>
+          <el-button type="success" size="mini" @click="searchEnterInfo"
+            >搜索</el-button
+          >
         </el-col>
         <el-col :span="8">
           <div class="import-file-security-wrapper">
             <label class="import-file-security">
               导入
-              <input ref="filesecurity" type="file" hidden @change="realImportSecurityFile">
+              <input
+                ref="filesecurity"
+                type="file"
+                hidden
+                @change="realImportSecurityFile"
+              />
             </label>
           </div>
         </el-col>
@@ -23,24 +30,17 @@
       :data="enterrisk"
       style="width: 100%"
     >
-      <el-table-column
-        label="企业名称"
-        prop="companyName"
-      />
-      <el-table-column
-        label="企业负责人"
-        prop="companyChargePer"
-      />
-      <el-table-column
-        label="操作"
-      >
+      <el-table-column label="企业名称" prop="companyName" />
+      <el-table-column label="企业负责人" prop="companyChargePer" />
+      <el-table-column label="操作">
         <template slot-scope="scope1">
           <div class="tools-risk-upload-wrapper">
             <el-button
               size="mini"
               type="primary"
               @click="showEnterRisk($event, scope1.$index, scope1.row)"
-            >显示生产经营单位全员安全生产责任清单</el-button>
+              >显示生产经营单位全员安全生产责任清单</el-button
+            >
           </div>
         </template>
       </el-table-column>
@@ -58,16 +58,15 @@
 </template>
 
 <script>
-import axiosFile from '@/utils/requestfile.js'
-import { getAllCompanyInfo } from '../../api/industry.js'
+import axiosFile from "@/utils/requestfile.js";
+import { getAllCompanyInfo } from "../../api/industry.js";
 export default {
   data() {
     return {
       // 企业信息
-      enterinfoByRisk: '',
+      enterinfoByRisk: "",
       // 企业风险
-      enterrisk: [
-      ],
+      enterrisk: [],
       // 是否显示提示框
       isShowAlert: false,
       // 总的个数
@@ -78,171 +77,178 @@ export default {
       currentPageDegree: 10,
       // 当前是否在加载数据
       isLoadingRiskEnter: false
-    }
+    };
   },
   mounted() {
-    this.initEnterInfoRisk()
+    this.initEnterInfoRisk();
   },
   methods: {
     // 初始化企业信息
     async initEnterInfoRisk() {
-      let replaceArray = []
+      let replaceArray = [];
       await getAllCompanyInfo({
         page: this.currentPage - 1,
         size: this.currentPageDegree,
         companyName: this.enterinfoByRisk
       }).then(res => {
-        this.totalElement = res.totalElements
-        replaceArray = [...res.content]
-        replaceArray = replaceArray.sort((a, b) => a.companyId - b.companyId)
-        this.enterrisk = [...replaceArray]
-      })
+        this.totalElement = res.totalElements;
+        replaceArray = [...res.content];
+        replaceArray = replaceArray.sort((a, b) => a.companyId - b.companyId);
+        this.enterrisk = [...replaceArray];
+      });
     },
     // 显示企业详细风险
     showEnterRisk(event, index, row) {
-      console.log(event, index, row)
+      console.log(event, index, row);
       // 跳转到企业风险情况页面
-      this.$router.push(
-        {
-          path: '/security/cerl/editcerl/' + row.companyId + '&' + row.companyName
-        }
-      )
+      this.$router.push({
+        path: "/security/cerl/editcerl/" + row.companyId + "&" + row.companyName
+      });
     },
     // 搜索企业信息
     searchEnterInfo() {
-      this.initEnterInfoRisk()
+      this.initEnterInfoRisk();
     },
     // 导入风险弹出框
     importRisk($event, index, row) {
       if (this.isShowAlert === false) {
-        $event.stopPropagation()
-        $event.preventDefault()
-        this.$alert('请先将文件另存为97-2003(xls)格式', '请注意', {
-          confirmButtonText: '确定',
+        $event.stopPropagation();
+        $event.preventDefault();
+        this.$alert("请先将文件另存为97-2003(xls)格式", "请注意", {
+          confirmButtonText: "确定",
           callback: action => {
-            console.log(action, 'helloworld')
-            this.isShowAlert = true
-            $event.target.click()
+            console.log(action, "helloworld");
+            this.isShowAlert = true;
+            $event.target.click();
             setTimeout(() => {
-              this.isShowAlert = false
-            }, 0)
+              this.isShowAlert = false;
+            }, 0);
           }
-        })
+        });
       }
     },
     // 导入风险文件
     realImportRisk(index, row) {
-      console.log(index, row, '导入风险文件')
+      console.log(index, row, "导入风险文件");
       // 调用提交按钮
       // const formdata = new FormData()
-      console.log(this.$refs['file' + index].files, 'files')
-      console.log(axiosFile, 'helloworld')
-      const formdata = new FormData()
-      formdata.append('companyId', row.companyId)
-      for (let i = 0; i < this.$refs['file' + index].files.length; i++) {
-        formdata.append('files', this.$refs['file' + index].files[i])
+      console.log(this.$refs["file" + index].files, "files");
+      console.log(axiosFile, "helloworld");
+      const formdata = new FormData();
+      formdata.append("companyId", row.companyId);
+      for (let i = 0; i < this.$refs["file" + index].files.length; i++) {
+        formdata.append("files", this.$refs["file" + index].files[i]);
       }
-      if (this.$refs['file' + index].files.length === 0) {
-        return
+      if (this.$refs["file" + index].files.length === 0) {
+        return;
       }
-      console.log(this.$refs['file' + index].files, 'hellworld, to justify yourself believer and behavior')
+      console.log(
+        this.$refs["file" + index].files,
+        "hellworld, to justify yourself believer and behavior"
+      );
       axiosFile({
-        url: '/api/thRisk/importExcel',
-        method: 'POST',
+        url: "/api/thRisk/importExcel",
+        method: "POST",
         data: formdata
       }).then(res => {
-        this.$message({
-          message: '上传成功',
-          type: 'success'
-        }, () => {
-          this.$message.error('上传失败')
-        })
-      })
+        this.$message(
+          {
+            message: "上传成功",
+            type: "success"
+          },
+          () => {
+            this.$message.error("上传失败");
+          }
+        );
+      });
     },
     // 每页条数
     handleSizeChangeRisk(val) {
-      this.currentPageDegree = val
+      this.currentPageDegree = val;
     },
     // 当前页码改变
     handleCurrentChangeRisk(val) {
       // 去请求数据 改变data
-      this.currentPage = val
-      this.initEnterInfoRisk()
+      this.currentPage = val;
+      this.initEnterInfoRisk();
     },
     // 真正导入安全检查文件
     realImportSecurityFile() {
-      if (this.$refs['filesecurity'].files.length > 0) {
+      if (this.$refs["filesecurity"].files.length > 0) {
         // console.log(this.$refs['filesecurity'])
-        this.isLoadingRiskEnter = true
-        const formData = new FormData()
-        formData.append('file', this.$refs['filesecurity'].files[0])
+        this.isLoadingRiskEnter = true;
+        const formData = new FormData();
+        formData.append("file", this.$refs["filesecurity"].files[0]);
         axiosFile({
-          url: '/api/thCompanyEntityResponseList/batchImportCERL',
-          method: 'POST',
+          url: "/api/thCompanyEntityResponseList/batchImportCERL",
+          method: "POST",
           data: formData
-        }).then(res => {
-          this.$message({
-            message: '上传成功',
-            type: 'success'
-          })
-          this.isLoadingRiskEnter = false
-        }, () => {
-          this.$message.error('上传失败')
-          this.isLoadingRiskEnter = false
-        })
+        }).then(
+          res => {
+            this.$message({
+              message: "上传成功",
+              type: "success"
+            });
+            this.isLoadingRiskEnter = false;
+          },
+          () => {
+            this.$message.error("上传失败");
+            this.isLoadingRiskEnter = false;
+          }
+        );
       }
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
-  .riskmanager-wrapper {
-    padding: 20px;
-    .tools-risk-upload-wrapper {
-      display: flex;
-      align-items: center;
-      .import-file-risk-wrapper {
-        display: inline-block;
-        margin: 0 20px;
-        .import-file-risk {
-          color: white;
-          border-radius: 3px;
-          background-color: #1890ff;
-          /* display: inline-block; */
-          text-align: center;
-          width: 56px;
-          height: 28px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          &:hover {
-            /* color: #46a6ff; */
-            /* border-color: #badeff; */
-            background-color: #46a6ff;
-          }
+.riskmanager-wrapper {
+  padding: 10px;
+  .tools-risk-upload-wrapper {
+    display: flex;
+    align-items: center;
+    .import-file-risk-wrapper {
+      display: inline-block;
+      margin: 0 20px;
+      .import-file-risk {
+        color: white;
+        border-radius: 3px;
+        background-color: #1890ff;
+        /* display: inline-block; */
+        text-align: center;
+        width: 56px;
+        height: 28px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        &:hover {
+          /* color: #46a6ff; */
+          /* border-color: #badeff; */
+          background-color: #46a6ff;
         }
       }
     }
   }
-  .import-file-security-wrapper {
-    display: inline-block;
-    margin: 0 20px;
-    .import-file-security {
-      color:white;
-      border-radius: 3px;
-      background-color: 3px;
-      background-color: #1890ff;
-      text-align: center;
-      width: 56px;
-      height: 28px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      font-size: 14px;
-      &:hover {
-        background-color: #46a6ff;
-      }
+}
+.import-file-security-wrapper {
+  display: inline-block;
+  margin: 0 20px;
+  .import-file-security {
+    color: white;
+    border-radius: 3px;
+    background-color: 3px;
+    background-color: #1890ff;
+    text-align: center;
+    width: 56px;
+    height: 28px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 14px;
+    &:hover {
+      background-color: #46a6ff;
     }
   }
+}
 </style>

src/views/changeinfo.vue

@@ -6,11 +6,19 @@
           <el-input v-model="enterSearchInfo" placeholder="请输入企业信息" />
         </el-col>
         <el-col :span="5">
-          &nbsp;&nbsp;<el-button type="success" @click="searchEnterprise">搜索</el-button>
+          &nbsp;&nbsp;<el-button type="success" @click="searchEnterprise"
+            >搜索</el-button
+          >
         </el-col>
         <el-col :span="8">
           <div style="display: flex">
-            <el-button type="primary"  @click="exportEnters" v-loading="isExportLoading" :disabled="isExportLoading">导出</el-button>
+            <el-button
+              type="primary"
+              @click="exportEnters"
+              v-loading="isExportLoading"
+              :disabled="isExportLoading"
+              >导出</el-button
+            >
             <!-- <el-progress style="flex-grow: 1;margin-left: 20px;margin-top: 10px;" :percentage="curExportProgress" status="success"></el-progress> -->
           </div>
         </el-col>
@@ -18,45 +26,39 @@
           <div class="import-file-risk-wrapper" @click="importEnter">
             <label class="import-file-risk">
               导入
-              <input ref="fileuploadEnter" type="file" multiple hidden @change="realImportEnter">
+              <input
+                ref="fileuploadEnter"
+                type="file"
+                multiple
+                hidden
+                @change="realImportEnter"
+              />
             </label>
           </div>
         </el-col>
       </el-row>
     </div>
-    <el-table
-      v-loading="isEnterloading"
-      :data="coms"
-      style="width: 100%"
-    >
-      <el-table-column
-        prop="companyName"
-        label="企业名称"
-      />
-      <el-table-column
-        prop="companyStatus"
-        label="企业状态"
-      />
-      <el-table-column
-        prop="companyIndustryName"
-        label="行业类型"
-      />
-      <el-table-column
-        prop="companyCounty"
-        label="所属区域"
-      />
-      <el-table-column
-        prop="companyChargePer"
-        label="主要负责人"
-      />
-      <el-table-column
-        prop="companyChargeTel"
-        label="联系电话"
-      />
+    <el-table v-loading="isEnterloading" :data="coms" style="width: 100%">
+      <el-table-column prop="companyName" label="企业名称" />
+      <el-table-column prop="companyStatus" label="企业状态" />
+      <el-table-column prop="companyIndustryName" label="行业类型" />
+      <el-table-column prop="companyCounty" label="所属区域" />
+      <el-table-column prop="companyChargePer" label="主要负责人" />
+      <el-table-column prop="companyChargeTel" label="联系电话" />
       <el-table-column>
         <template slot-scope="scope">
-          <el-button size="mini" type="warning" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
-          <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
+          <el-button
+            size="mini"
+            type="warning"
+            @click="handleEdit(scope.$index, scope.row)"
+            >编辑</el-button
+          >
+          <el-button
+            size="mini"
+            type="danger"
+            @click="handleDelete(scope.$index, scope.row)"
+            >删除</el-button
+          >
         </template>
       </el-table-column>
     </el-table>
@@ -75,7 +77,12 @@
       width="60%"
       @opened="openDialog"
     >
-      <el-form ref="formenterinfo1" :rules="formenterinforules" :model="formenterinfo" label-width="180px">
+      <el-form
+        ref="formenterinfo1"
+        :rules="formenterinforules"
+        :model="formenterinfo"
+        label-width="180px"
+      >
         <el-row>
           <el-col :span="12">
             <el-form-item label="企业名称:" prop="companyName">
@@ -84,7 +91,10 @@
           </el-col>
           <el-col :span="12">
             <el-form-item label="企业状态:" prop="companyStatus">
-              <el-select v-model="formenterinfo.companyStatus" placeholder="请选择企业状态">
+              <el-select
+                v-model="formenterinfo.companyStatus"
+                placeholder="请选择企业状态"
+              >
                 <el-option label="正常生产" value="正常生产" />
                 <el-option label="停产企业" value="停产企业" />
                 <el-option label="已经注销" value="已经注销" />
@@ -97,8 +107,16 @@
         <el-row>
           <el-col :span="12">
             <el-form-item label="行业类型:" prop="companyIndustryName">
-              <el-select v-model="formenterinfo.companyIndustryName" placeholder="请选择行业类型">
-                <el-option v-for="(item, index) in industryNames" :key="index" :label="item.industryName" :value="item.industryName" />
+              <el-select
+                v-model="formenterinfo.companyIndustryName"
+                placeholder="请选择行业类型"
+              >
+                <el-option
+                  v-for="(item, index) in industryNames"
+                  :key="index"
+                  :label="item.industryName"
+                  :value="item.industryName"
+                />
               </el-select>
             </el-form-item>
           </el-col>
@@ -112,13 +130,41 @@
           </el-col>
         </el-row>
         <el-form-item label="国民行业类型" prop="companyDimTwoIndustryName">
-          <el-select v-model="curNationIndusLevel1" @change="nationInduschangelevel1">
-            <el-option v-for="(item, index) in nationindusNames" :key="index" :label="item.name" :value="item.name" />
+          <el-select
+            v-model="curNationIndusLevel1"
+            @change="nationInduschangelevel1"
+          >
+            <el-option
+              v-for="(item, index) in nationindusNames"
+              :key="index"
+              :label="item.name"
+              :value="item.name"
+            />
           </el-select>
-          <el-select v-if="nationindusSecondNames.length > 0" v-model="curNationIndusLevel2" @change="nationInduschangelevel2">
-            <el-option v-for="(item, index) in nationindusSecondNames" :key="index" :label="item.name" :value="item.name" />
+          <el-select
+            v-if="nationindusSecondNames.length > 0"
+            v-model="curNationIndusLevel2"
+            @change="nationInduschangelevel2"
+          >
+            <el-option
+              v-for="(item, index) in nationindusSecondNames"
+              :key="index"
+              :label="item.name"
+              :value="item.name"
+            />
           </el-select>
         </el-form-item>
+        <el-form-item label="企业属性">
+          <el-checkbox v-model="formenterinfo.isSafetyDirector"
+            >是否有安全负责人</el-checkbox
+          >
+          <el-checkbox v-model="formenterinfo.isResponsibility"
+            >是否落实责任清单</el-checkbox
+          >
+          <el-checkbox v-model="formenterinfo.isSecurity"
+            >是否是安全标准化企业</el-checkbox
+          >
+        </el-form-item>
         <el-row>
           <el-col :span="12">
             <el-form-item label="统一社会信用代码:" prop="companyCode">
@@ -133,19 +179,60 @@
         </el-row>
         <el-form-item label="所属地区" prop="companyCounty">
           <el-select v-model="region1model" @change="region1schange">
-            <el-option v-for="(item, index) in regionlevel1" :key="index" :label="item.name" :value="item.areaCode" />
+            <el-option
+              v-for="(item, index) in regionlevel1"
+              :key="index"
+              :label="item.name"
+              :value="item.areaCode"
+            />
           </el-select>
-          <el-select v-if="regionlevel2.length > 0" v-model="region2model" @change="region2schange">
-            <el-option v-for="(item, index) in regionlevel2" :key="index" :label="item.name" :value="item.areaCode" />
+          <el-select
+            v-if="regionlevel2.length > 0"
+            v-model="region2model"
+            @change="region2schange"
+          >
+            <el-option
+              v-for="(item, index) in regionlevel2"
+              :key="index"
+              :label="item.name"
+              :value="item.areaCode"
+            />
           </el-select>
-          <el-select v-if="regionlevel3.length > 0" v-model="region3model" @change="region3schange">
-            <el-option v-for="(item, index) in regionlevel3" :key="index" :label="item.name" :value="item.areaCode" />
+          <el-select
+            v-if="regionlevel3.length > 0"
+            v-model="region3model"
+            @change="region3schange"
+          >
+            <el-option
+              v-for="(item, index) in regionlevel3"
+              :key="index"
+              :label="item.name"
+              :value="item.areaCode"
+            />
           </el-select>
-          <el-select v-if="regionlevel4.length > 0" v-model="region4model" @change="region4schange">
-            <el-option v-for="(item, index) in regionlevel4" :key="index" :label="item.name" :value="item.areaCode" />
+          <el-select
+            v-if="regionlevel4.length > 0"
+            v-model="region4model"
+            @change="region4schange"
+          >
+            <el-option
+              v-for="(item, index) in regionlevel4"
+              :key="index"
+              :label="item.name"
+              :value="item.areaCode"
+            />
           </el-select>
-          <el-select v-if="regionlevel5.length > 0" v-model="region5model" @change="region5schange">
-            <el-option v-for="(item, index) in regionlevel5" :key="index" :label="item.name" :value="item.areaCode" />
+          <el-select
+            v-if="regionlevel5.length > 0"
+            v-model="region5model"
+            @change="region5schange"
+          >
+            <el-option
+              v-for="(item, index) in regionlevel5"
+              :key="index"
+              :label="item.name"
+              :value="item.areaCode"
+            />
           </el-select>
         </el-form-item>
         <el-form-item label="值班电话" prop="dutytel">
@@ -176,13 +263,19 @@
           </el-col>
         </el-row>
         <el-form-item label="企业简介">
-          <el-input v-model="formenterinfo.companyIntroduction" type="textarea" />
+          <el-input
+            v-model="formenterinfo.companyIntroduction"
+            type="textarea"
+          />
         </el-form-item>
         <el-form-item label="通讯地址">
           <el-input v-model="formenterinfo.companyCommunicationAddr" />
         </el-form-item>
         <el-form-item label="经营范围">
-          <el-input v-model="formenterinfo.companyBusinessNature" type="textarea" />
+          <el-input
+            v-model="formenterinfo.companyBusinessNature"
+            type="textarea"
+          />
         </el-form-item>
         <el-form-item label="原料">
           <el-input v-model="formenterinfo.companyRawMaterial" />
@@ -193,15 +286,31 @@
         <el-form-item label="地理坐标">
           <el-row>
             <el-col :span="8">
-              <el-input v-model="tochoosecomregion" size="mini" placeholder="请输入公司名称或公司所在地" />
+              <el-input
+                v-model="tochoosecomregion"
+                size="mini"
+                placeholder="请输入公司名称或公司所在地"
+              />
             </el-col>
             <el-col :span="16">
-              <el-button size="mini" type="primary" @click="searchcom">搜索</el-button>
+              <el-button size="mini" type="primary" @click="searchcom"
+                >搜索</el-button
+              >
             </el-col>
           </el-row>
           <el-row>
-            <el-select v-if="companyregions.length > 0" v-model="comrealpos" style="width: 40%;" @change="comrealposselect">
-              <el-option v-for="(item, index) in companyregions" :key="index" :label="item.name + '-' + item.address" :value="item.location.lng + ',' + item.location.lat" />
+            <el-select
+              v-if="companyregions.length > 0"
+              v-model="comrealpos"
+              style="width: 40%;"
+              @change="comrealposselect"
+            >
+              <el-option
+                v-for="(item, index) in companyregions"
+                :key="index"
+                :label="item.name + '-' + item.address"
+                :value="item.location.lng + ',' + item.location.lat"
+              />
             </el-select>
           </el-row>
         </el-form-item>
@@ -223,9 +332,19 @@
 </template>
 
 <script>
-import axiosFile from '@/utils/requestfile.js'
-import axios from 'axios'
-import { getindustry, getAllProvince, findAreaByCode, findCompanyCounty, findAllByCompanyCounty, changeCompanyInfo, deleteCompanyInfo, findDimindustry, getAllCompanyInfo } from '../api/industry'
+import axiosFile from "@/utils/requestfile.js";
+import axios from "axios";
+import {
+  getindustry,
+  getAllProvince,
+  findAreaByCode,
+  findCompanyCounty,
+  findAllByCompanyCounty,
+  changeCompanyInfo,
+  deleteCompanyInfo,
+  findDimindustry,
+  getAllCompanyInfo
+} from "../api/industry";
 export default {
   data() {
     return {
@@ -236,74 +355,81 @@ export default {
       // 当前企业总数
       curSumDegree: 0,
       // 查询企业信息
-      enterSearchInfo: '',
+      enterSearchInfo: "",
       // 所有企业
       coms: [],
       comsreplace: [],
       dialogVisible: false,
       formenterinfo: {
-        companyName: '',
-        companyStatus: '正常生产',
-        companyIndustryName: '一般化工行业',
-        companyChemical: '1',
-        companyCode: '',
-        companyPeople: '',
-        companyDutyTel: '',
-        companyChargePer: '',
-        companyChargeTel: '',
-        companySecurityPer: '',
-        companySecurityTel: '',
-        companyIntroduction: '',
-        companyCommunicationAddr: '',
-        companyBusinessNature: '',
-        companyRawMaterial: '',
-        companyMainProduct: '',
-        companyLng: '',
-        companyLat: '',
-        companyProvince: '',
-        companyCity: '',
-        companyCounty: '',
-        companyCommunity: '',
-        companyTown: '',
-        companyEnclosureAddr: 'aaa',
-        companyDimOneIndustryName: '',
-        companyDimTwoIndustryName: ''
+        companyName: "",
+        companyStatus: "正常生产",
+        companyIndustryName: "一般化工行业",
+        companyChemical: "1",
+        companyCode: "",
+        companyPeople: "",
+        companyDutyTel: "",
+        companyChargePer: "",
+        companyChargeTel: "",
+        companySecurityPer: "",
+        companySecurityTel: "",
+        companyIntroduction: "",
+        companyCommunicationAddr: "",
+        companyBusinessNature: "",
+        companyRawMaterial: "",
+        companyMainProduct: "",
+        companyLng: "",
+        companyLat: "",
+        companyProvince: "",
+        companyCity: "",
+        companyCounty: "",
+        companyCommunity: "",
+        companyTown: "",
+        companyEnclosureAddr: "aaa",
+        companyDimOneIndustryName: "",
+        companyDimTwoIndustryName: "",
+        isResponsibility: false,
+        isSecurity: false,
+        isSafetyDirector: false
       },
       formenterinforules: {
         companyName: [
-          { required: true, message: '请输入企业名称', trigger: 'blur' },
-          { min: 2, message: '长度须大于2个字符', trigger: 'blur' }
+          { required: true, message: "请输入企业名称", trigger: "blur" },
+          { min: 2, message: "长度须大于2个字符", trigger: "blur" }
         ],
         companyCounty: [
-          { required: true, message: '请输入地址', trigger: 'change' }
+          { required: true, message: "请输入地址", trigger: "change" }
         ],
         companyIndustryName: [
-          { required: true, message: '请输入行业类型', trigger: 'blur' }
+          { required: true, message: "请输入行业类型", trigger: "blur" }
         ],
         companyChargePer: [
-          { required: true, message: '请输入主要负责人', trigger: 'blur' },
-          { min: 1, message: '长度须大于1个字符', trigger: 'blur' }
+          { required: true, message: "请输入主要负责人", trigger: "blur" },
+          { min: 1, message: "长度须大于1个字符", trigger: "blur" }
         ],
         companyChargeTel: [
-          { required: true, message: '请输入主要负责人电话', trigger: 'blur' },
-          { min: 1, message: '长度须大于1个字符', trigger: 'blur' }
+          { required: true, message: "请输入主要负责人电话", trigger: "blur" },
+          { min: 1, message: "长度须大于1个字符", trigger: "blur" }
         ],
         companyDimTwoIndustryName: [
-          { required: true, message: '请输入国民经济行业类型', trigger: 'change' }
+          {
+            required: true,
+            message: "请输入国民经济行业类型",
+            trigger: "change"
+          }
         ],
         companyCode: [
-          { required: true, message: '请输入统一信用代码', trigger: 'blur' }
+          { required: true, message: "请输入统一信用代码", trigger: "blur" }
         ]
       },
       // 当前输入的地点
-      tochoosepos: '',
+      tochoosepos: "",
       map: null,
       industryNames: [],
-      region1model: '',
-      region2model: '',
-      region3model: '',
-      region4model: '',
-      region5model: '',
+      region1model: "",
+      region2model: "",
+      region3model: "",
+      region4model: "",
+      region5model: "",
       regionlevel1: [],
       regionlevel2: [],
       regionlevel3: [],
@@ -311,19 +437,19 @@ export default {
       regionlevel5: [],
       companyregions: [],
       // input选择的坐标
-      tochoosecomregion: '',
+      tochoosecomregion: "",
       // 公司选择的坐标
-      comrealpos: '',
+      comrealpos: "",
       // 5个当前地点的总计
-      completeposname: '',
+      completeposname: "",
       // 国民经济行业第一级别列表
       nationindusNames: [],
       // 国民经济行业第二级别列表
       nationindusSecondNames: [],
       // 当前选择的国民经济行业第一级别
-      curNationIndusLevel1: '',
+      curNationIndusLevel1: "",
       // 当前选择的国民经济行业第二级别
-      curNationIndusLevel2: '',
+      curNationIndusLevel2: "",
       // 当前是否正在加载
       isEnterloading: false,
       // 是否显示提示框
@@ -331,506 +457,620 @@ export default {
       curExportProgress: 0,
       isExportLoading: false,
       curExportTimer: null
-    }
+    };
   },
   mounted() {
     // this.getAllInfo()
-    this.getAllInfo2()
+    this.getAllInfo2();
     getindustry().then(res => {
-      this.industryNames = [...res.content]
-    })
+      this.industryNames = [...res.content];
+    });
   },
   methods: {
     async getAllInfo() {
-      let county = []
+      let county = [];
       await findCompanyCounty().then(res => {
-        county = [...res]
-      })
-      const countryComArr = []
-      const promiseArray = []
-      county.forEach((item) => {
+        county = [...res];
+      });
+      const countryComArr = [];
+      const promiseArray = [];
+      county.forEach(item => {
         const promise1 = findAllByCompanyCounty(item).then(res => {
           // countryComArr.push(res)
           // Array.prototype.push.apply(countryComArr, ...item)
           for (const item1 of res) {
-            countryComArr.push(item1)
+            countryComArr.push(item1);
           }
-        })
-        promiseArray.push(promise1)
-      })
+        });
+        promiseArray.push(promise1);
+      });
       Promise.all(promiseArray).then(res => {
-        this.coms = [...countryComArr]
-      })
+        this.coms = [...countryComArr];
+      });
     },
     async getAllInfo2() {
-      this.isEnterloading = true
+      this.isEnterloading = true;
       await getAllCompanyInfo({
         page: this.curPageDegree - 1,
         size: this.curPageSum
-      }).then(res => {
-        this.curSumDegree = res.totalElements
-        this.coms = [...res.content]
-        this.isEnterloading = false
-      }, () => {
-        this.isEnterloading = false
-      })
+      }).then(
+        res => {
+          this.curSumDegree = res.totalElements;
+          this.coms = [...res.content];
+          this.isEnterloading = false;
+        },
+        () => {
+          this.isEnterloading = false;
+        }
+      );
     },
     handleEdit(index, row) {
       // 编辑
-      this.formenterinfo = { ...row }
+      this.formenterinfo = { ...row };
       // console.log(typeof this.formenterinfo.companyChemical, 'dfdffdfdfdfdfdfdfdfdfdfdf')
-      this.formenterinfo.companyChemical = this.formenterinfo.companyChemical + ''
-      this.dialogVisible = true
+      this.formenterinfo.companyChemical =
+        this.formenterinfo.companyChemical + "";
+      this.dialogVisible = true;
     },
     handleDelete(index, row) {
-      this.$confirm('此操作将删除企业相关信息, 是否继续?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        // 删除
-        this.isEnterloading = true
-        deleteCompanyInfo(row.companyId).then(res => {
-          this.$message({
-            type: 'success',
-            message: '删除成功'
-          })
-          this.isEnterloading = false
-          this.getAllInfo2()
-        }, () => {
-          this.isEnterloading = false
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
-        })
+      this.$confirm("此操作将删除企业相关信息, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          // 删除
+          this.isEnterloading = true;
+          deleteCompanyInfo(row.companyId).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+              this.isEnterloading = false;
+              this.getAllInfo2();
+            },
+            () => {
+              this.isEnterloading = false;
+            }
+          );
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
     async openDialog() {
-      this.nationindusNames = []
+      this.nationindusNames = [];
       // console.log(this.nationindusNames, '好奇1')
       // 初始化国民经济行业
-      setTimeout(async() => {
+      setTimeout(async () => {
         await findDimindustry().then(res => {
-          this.nationindusNames = [...res]
-          this.curNationIndusLevel1 = this.formenterinfo.companyDimOneIndustryName
-          console.log(res, '国民第一经济行业1111111')
-        })
+          this.nationindusNames = [...res];
+          this.curNationIndusLevel1 = this.formenterinfo.companyDimOneIndustryName;
+          console.log(res, "国民第一经济行业1111111");
+        });
         // 初始化国民第二经济行业
-        if (this.curNationIndusLevel1 !== '') {
-          this.formenterinfo.companyDimOneIndustryName = this.curNationIndusLevel1
-          await findDimindustry(this.nationindusNames.filter(item => item.name === this.curNationIndusLevel1)[0].industryId).then(res => {
-            this.nationindusSecondNames = [...res]
-            this.curNationIndusLevel2 = this.formenterinfo.companyDimTwoIndustryName
-            console.log(res, '国民第二经济行业1111111')
-          })
+        if (this.curNationIndusLevel1 !== "") {
+          this.formenterinfo.companyDimOneIndustryName = this.curNationIndusLevel1;
+          await findDimindustry(
+            this.nationindusNames.filter(
+              item => item.name === this.curNationIndusLevel1
+            )[0].industryId
+          ).then(res => {
+            this.nationindusSecondNames = [...res];
+            this.curNationIndusLevel2 = this.formenterinfo.companyDimTwoIndustryName;
+            console.log(res, "国民第二经济行业1111111");
+          });
         }
-      }, 1)
+      }, 1);
       // 获取所有省份信息
-      setTimeout(async() => {
+      setTimeout(async () => {
         await getAllProvince().then(res => {
-          this.regionlevel1 = [...res]
-        })
-        const areaCode1 = this.regionlevel1.filter(item => item.name === this.formenterinfo.companyProvince)[0].areaCode
+          this.regionlevel1 = [...res];
+        });
+        const areaCode1 = this.regionlevel1.filter(
+          item => item.name === this.formenterinfo.companyProvince
+        )[0].areaCode;
         await findAreaByCode(areaCode1, 1).then(res => {
-          this.regionlevel2 = [...res]
-        })
-        const areaCode2 = this.regionlevel2.filter(item => item.name === this.formenterinfo.companyCity)[0].areaCode
+          this.regionlevel2 = [...res];
+        });
+        const areaCode2 = this.regionlevel2.filter(
+          item => item.name === this.formenterinfo.companyCity
+        )[0].areaCode;
         await findAreaByCode(areaCode2, 2).then(res => {
-          this.regionlevel3 = [...res]
-        })
-        const areaCode3 = this.regionlevel3.filter(item => item.name === this.formenterinfo.companyCounty || (item.name === '威海经济技术开发区' && this.formenterinfo.companyCounty === '经济技术开发区'))[0].areaCode
+          this.regionlevel3 = [...res];
+        });
+        const areaCode3 = this.regionlevel3.filter(
+          item =>
+            item.name === this.formenterinfo.companyCounty ||
+            (item.name === "威海经济技术开发区" &&
+              this.formenterinfo.companyCounty === "经济技术开发区")
+        )[0].areaCode;
         await findAreaByCode(areaCode3, 3).then(res => {
-          this.regionlevel4 = [...res]
-        })
-        let areaCode4 = ''
+          this.regionlevel4 = [...res];
+        });
+        let areaCode4 = "";
         if (this.formenterinfo.companyCommunity) {
-          areaCode4 = this.regionlevel4.filter(item => item.name === this.formenterinfo.companyCommunity)[0].areaCode
+          areaCode4 = this.regionlevel4.filter(
+            item => item.name === this.formenterinfo.companyCommunity
+          )[0].areaCode;
           await findAreaByCode(areaCode4, 4).then(res => {
-            this.regionlevel5 = [...res]
-          })
+            this.regionlevel5 = [...res];
+          });
         }
-        let areaCode5 = ''
+        let areaCode5 = "";
         if (this.formenterinfo.companyTown) {
-          areaCode5 = this.regionlevel5.filter(item => item.name === this.formenterinfo.companyTown)[0].areaCode
+          areaCode5 = this.regionlevel5.filter(
+            item => item.name === this.formenterinfo.companyTown
+          )[0].areaCode;
         }
-        this.region1model = areaCode1
-        this.region2model = areaCode2
-        this.region3model = areaCode3
-        this.region4model = areaCode4
-        this.region5model = areaCode5
-      })
-      this.tochoosecomregion = this.formenterinfo.companyProvince + this.formenterinfo.companyCity + this.formenterinfo.companyCounty + this.formenterinfo.companyCommunity + this.formenterinfo.companyTown
+        this.region1model = areaCode1;
+        this.region2model = areaCode2;
+        this.region3model = areaCode3;
+        this.region4model = areaCode4;
+        this.region5model = areaCode5;
+      });
+      this.tochoosecomregion =
+        this.formenterinfo.companyProvince +
+        this.formenterinfo.companyCity +
+        this.formenterinfo.companyCounty +
+        this.formenterinfo.companyCommunity +
+        this.formenterinfo.companyTown;
       // 在这里画地图
-      const AMap = window.AMap || {}
-      const satellite = new AMap.TileLayer.Satellite()
-      const roadNet = new AMap.TileLayer.RoadNet()
-      this.map = new AMap.Map('submitformmap', {
+      const AMap = window.AMap || {};
+      const satellite = new AMap.TileLayer.Satellite();
+      const roadNet = new AMap.TileLayer.RoadNet();
+      this.map = new AMap.Map("submitformmap", {
         resizeEnable: true, // 是否监控地图容器尺寸变化
         zoom: 16, // 初始化地图层级
-        center: [Number(this.formenterinfo.companyLng), Number(this.formenterinfo.companyLat)],
-        layers: [
-          satellite,
-          roadNet
-        ]
-      })
+        center: [
+          Number(this.formenterinfo.companyLng),
+          Number(this.formenterinfo.companyLat)
+        ],
+        layers: [satellite, roadNet]
+      });
       const marker = new AMap.Marker({
-        icon: 'https://webapi.amap.com/theme/v1.3/markers/n/mark_r.png',
-        position: [Number(this.formenterinfo.companyLng), Number(this.formenterinfo.companyLat)],
+        icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_r.png",
+        position: [
+          Number(this.formenterinfo.companyLng),
+          Number(this.formenterinfo.companyLat)
+        ],
         // anchor: 'bottom-center'
         offset: new AMap.Pixel(-10, -31)
-      })
-      this.marker = marker
-      this.map.on('mousemove', (e) => {
-        document.querySelector('.submitmousepos').innerHTML = e.lnglat.getLng() + ',' + e.lnglat.getLat()
-      })
-      document.querySelector('.submitoriginpos').innerHTML = this.formenterinfo.companyLng + ',' + this.formenterinfo.companyLat
+      });
+      this.marker = marker;
+      this.map.on("mousemove", e => {
+        document.querySelector(".submitmousepos").innerHTML =
+          e.lnglat.getLng() + "," + e.lnglat.getLat();
+      });
+      document.querySelector(".submitoriginpos").innerHTML =
+        this.formenterinfo.companyLng + "," + this.formenterinfo.companyLat;
       // this.formenterinfo.companyLng = '122.086287'
       // this.formenterinfo.companyLat = '37.493758'
-      this.map.add(marker)
-      this.map.on('click', (e) => {
-        document.querySelector('.submitoriginpos').innerHTML = e.lnglat.getLng() + ',' + e.lnglat.getLat()
+      this.map.add(marker);
+      this.map.on("click", e => {
+        document.querySelector(".submitoriginpos").innerHTML =
+          e.lnglat.getLng() + "," + e.lnglat.getLat();
         // document.querySelector('.submitoriginpos').innerHTML = '122.086287, 37.493758'
         // map.remove(marker)
         // marker = new AMap.Marker({
 
         // })
-        this.map.setCenter([e.lnglat.getLng(), e.lnglat.getLat()])
-        marker.setPosition(e.lnglat)
-        this.formenterinfo.companyLng = '' + e.lnglat.getLng()
-        this.formenterinfo.companyLat = '' + e.lnglat.getLat()
-        AMap.plugin('AMap.Geocoder', () => {
-        // 在这里面获取到点击经纬度的所对应的地理信息
+        this.map.setCenter([e.lnglat.getLng(), e.lnglat.getLat()]);
+        marker.setPosition(e.lnglat);
+        this.formenterinfo.companyLng = "" + e.lnglat.getLng();
+        this.formenterinfo.companyLat = "" + e.lnglat.getLat();
+        AMap.plugin("AMap.Geocoder", () => {
+          // 在这里面获取到点击经纬度的所对应的地理信息
           const geocoder = new AMap.Geocoder({
             radius: 1000
-          })
+          });
           geocoder.getAddress(e.lnglat, (status, result) => {
-            if (status === 'complete' && result && result.info === 'OK' && result.regeocode) {
-              this.setRegionSelect(result.regeocode.addressComponent.province, result.regeocode.addressComponent.city, result.regeocode.addressComponent.district)
-              this.comrealpos = result.regeocode.formattedAddress
-              this.tochoosecomregion = this.comrealpos
-              AMap.plugin('AMap.PlaceSearch', () => {
-                const placesearch = new AMap.PlaceSearch({})
+            if (
+              status === "complete" &&
+              result &&
+              result.info === "OK" &&
+              result.regeocode
+            ) {
+              this.setRegionSelect(
+                result.regeocode.addressComponent.province,
+                result.regeocode.addressComponent.city,
+                result.regeocode.addressComponent.district
+              );
+              this.comrealpos = result.regeocode.formattedAddress;
+              this.tochoosecomregion = this.comrealpos;
+              AMap.plugin("AMap.PlaceSearch", () => {
+                const placesearch = new AMap.PlaceSearch({});
                 placesearch.search(this.comrealpos, (status, result) => {
-                  if (status === 'complete' && result.info === 'OK' && result.poiList.pois && result.poiList.pois.length > 0) {
-                    this.companyregions = [...result.poiList.pois]
+                  if (
+                    status === "complete" &&
+                    result.info === "OK" &&
+                    result.poiList.pois &&
+                    result.poiList.pois.length > 0
+                  ) {
+                    this.companyregions = [...result.poiList.pois];
                   }
-                })
-              })
+                });
+              });
             }
-          })
-        })
-      })
-      AMap.plugin('AMap.Geocoder', () => {
-      // 在这里面获取到点击经纬度的所对应的地理信息
+          });
+        });
+      });
+      AMap.plugin("AMap.Geocoder", () => {
+        // 在这里面获取到点击经纬度的所对应的地理信息
         const geocoder = new AMap.Geocoder({
           radius: 1000
-        })
-        geocoder.getAddress(new AMap.LngLat(Number(this.formenterinfo.companyLng), Number(this.formenterinfo.companyLat)), (status, result) => {
-          if (status === 'complete' && result && result.info === 'OK' && result.regeocode) {
-            this.comrealpos = result.regeocode.formattedAddress
-            AMap.plugin('AMap.PlaceSearch', () => {
-            // 查询公司地点
-              const placesearch = new AMap.PlaceSearch({})
-              placesearch.search(this.comrealpos, (status, result) => {
-                if (status === 'complete' && result.info === 'OK' && result.poiList.pois && result.poiList.pois.length > 0) {
-                  this.companyregions = [...result.poiList.pois]
-                }
-              })
-            })
+        });
+        geocoder.getAddress(
+          new AMap.LngLat(
+            Number(this.formenterinfo.companyLng),
+            Number(this.formenterinfo.companyLat)
+          ),
+          (status, result) => {
+            if (
+              status === "complete" &&
+              result &&
+              result.info === "OK" &&
+              result.regeocode
+            ) {
+              this.comrealpos = result.regeocode.formattedAddress;
+              AMap.plugin("AMap.PlaceSearch", () => {
+                // 查询公司地点
+                const placesearch = new AMap.PlaceSearch({});
+                placesearch.search(this.comrealpos, (status, result) => {
+                  if (
+                    status === "complete" &&
+                    result.info === "OK" &&
+                    result.poiList.pois &&
+                    result.poiList.pois.length > 0
+                  ) {
+                    this.companyregions = [...result.poiList.pois];
+                  }
+                });
+              });
+            }
           }
-        })
-      })
+        );
+      });
     },
     searchpos() {
       // const AMap = window.AMap || {}
-      const tochoosepos = this.tochoosepos
+      const tochoosepos = this.tochoosepos;
       // const map = this.map || {}
-      if (tochoosepos === '') {
-        return
+      if (tochoosepos === "") {
+        return;
       }
-      if (tochoosepos !== '') {
-
+      if (tochoosepos !== "") {
       }
     },
     searchcom() {
       // 搜索公司
       // companyregions
-      const AMap = window.AMap || {}
-      const tochoosecomregion = this.tochoosecomregion
+      const AMap = window.AMap || {};
+      const tochoosecomregion = this.tochoosecomregion;
       // const map = this.map || {}
-      if (tochoosecomregion === '') {
-        return
+      if (tochoosecomregion === "") {
+        return;
       }
-      if (tochoosecomregion !== '') {
-        AMap.plugin('AMap.PlaceSearch', () => {
+      if (tochoosecomregion !== "") {
+        AMap.plugin("AMap.PlaceSearch", () => {
           // 查询公司地点
           const placesearch = new AMap.PlaceSearch({
             // map: map
-          })
+          });
           placesearch.search(tochoosecomregion, (status, result) => {
-            if (status === 'complete' && result.info === 'OK' && result.poiList.pois && result.poiList.pois.length > 0) {
-              this.companyregions = [...result.poiList.pois]
+            if (
+              status === "complete" &&
+              result.info === "OK" &&
+              result.poiList.pois &&
+              result.poiList.pois.length > 0
+            ) {
+              this.companyregions = [...result.poiList.pois];
               // console.log(this.companyregions, 'this.companyregions, this.companyregions, this.companyregions')
             }
-          })
-        })
+          });
+        });
       }
     },
     region1schange() {
       // 根据region1model选择区域
       // this.regionlevel2 =
       findAreaByCode(Number(this.region1model), 1).then(res => {
-        this.regionlevel2 = [...res]
-      })
+        this.regionlevel2 = [...res];
+      });
       this.completeposname = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
-      this.tochoosecomregion = this.completeposname
-      this.searchPosPro(this.tochoosecomregion)
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
+      this.tochoosecomregion = this.completeposname;
+      this.searchPosPro(this.tochoosecomregion);
       this.formenterinfo.companyProvince = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
     },
     region2schange() {
       findAreaByCode(Number(this.region2model), 2).then(res => {
-        this.regionlevel3 = [...res]
-      })
+        this.regionlevel3 = [...res];
+      });
       this.completeposname = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
       this.completeposname += this.regionlevel2.filter(item => {
-        return item.areaCode === Number(this.region2model)
-      })[0].name
-      this.tochoosecomregion = this.completeposname
-      this.searchPosPro(this.tochoosecomregion)
+        return item.areaCode === Number(this.region2model);
+      })[0].name;
+      this.tochoosecomregion = this.completeposname;
+      this.searchPosPro(this.tochoosecomregion);
       this.formenterinfo.companyCity = this.regionlevel2.filter(item => {
-        return item.areaCode === Number(this.region2model)
-      })[0].name
+        return item.areaCode === Number(this.region2model);
+      })[0].name;
     },
     region3schange() {
       findAreaByCode(Number(this.region3model), 3).then(res => {
-        this.regionlevel4 = [...res]
-      })
+        this.regionlevel4 = [...res];
+      });
       this.completeposname = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
       this.completeposname += this.regionlevel2.filter(item => {
-        return item.areaCode === Number(this.region2model)
-      })[0].name
+        return item.areaCode === Number(this.region2model);
+      })[0].name;
       this.completeposname += this.regionlevel3.filter(item => {
-        return item.areaCode === Number(this.region3model)
-      })[0].name
-      this.tochoosecomregion = this.completeposname
-      this.searchPosPro(this.tochoosecomregion)
+        return item.areaCode === Number(this.region3model);
+      })[0].name;
+      this.tochoosecomregion = this.completeposname;
+      this.searchPosPro(this.tochoosecomregion);
       this.formenterinfo.companyCounty = this.regionlevel3.filter(item => {
-        return item.areaCode === Number(this.region3model)
-      })[0].name
+        return item.areaCode === Number(this.region3model);
+      })[0].name;
     },
     region4schange() {
       findAreaByCode(Number(this.region4model), 4).then(res => {
-        this.regionlevel5 = [...res]
-      })
+        this.regionlevel5 = [...res];
+      });
       this.completeposname = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
       this.completeposname += this.regionlevel2.filter(item => {
-        return item.areaCode === Number(this.region2model)
-      })[0].name
+        return item.areaCode === Number(this.region2model);
+      })[0].name;
       this.completeposname += this.regionlevel3.filter(item => {
-        return item.areaCode === Number(this.region3model)
-      })[0].name
+        return item.areaCode === Number(this.region3model);
+      })[0].name;
       this.completeposname += this.regionlevel4.filter(item => {
-        return item.areaCode === Number(this.region4model)
-      })[0].name
-      this.tochoosecomregion = this.completeposname
-      this.searchPosPro(this.tochoosecomregion)
+        return item.areaCode === Number(this.region4model);
+      })[0].name;
+      this.tochoosecomregion = this.completeposname;
+      this.searchPosPro(this.tochoosecomregion);
       this.formenterinfo.companyCommunity = this.regionlevel4.filter(item => {
-        return item.areaCode === Number(this.region4model)
-      })[0].name
+        return item.areaCode === Number(this.region4model);
+      })[0].name;
     },
     region5schange() {
       this.completeposname = this.regionlevel1.filter(item => {
-        return item.areaCode === Number(this.region1model)
-      })[0].name
+        return item.areaCode === Number(this.region1model);
+      })[0].name;
       this.completeposname += this.regionlevel2.filter(item => {
-        return item.areaCode === Number(this.region2model)
-      })[0].name
+        return item.areaCode === Number(this.region2model);
+      })[0].name;
       this.completeposname += this.regionlevel3.filter(item => {
-        return item.areaCode === Number(this.region3model)
-      })[0].name
+        return item.areaCode === Number(this.region3model);
+      })[0].name;
       this.completeposname += this.regionlevel4.filter(item => {
-        return item.areaCode === Number(this.region4model)
-      })[0].name
+        return item.areaCode === Number(this.region4model);
+      })[0].name;
       this.completeposname += this.regionlevel5.filter(item => {
-        return item.areaCode === Number(this.region5model)
-      })[0].name
-      this.tochoosecomregion = this.completeposname
-      this.searchPosPro(this.tochoosecomregion)
+        return item.areaCode === Number(this.region5model);
+      })[0].name;
+      this.tochoosecomregion = this.completeposname;
+      this.searchPosPro(this.tochoosecomregion);
       this.formenterinfo.companyTown = this.regionlevel5.filter(item => {
-        return item.areaCode === Number(this.region5model)
-      })[0].name
+        return item.areaCode === Number(this.region5model);
+      })[0].name;
     },
     // 获取公司选中的位置，差一个定位中心
     comrealposselect(e) {
-      console.log(this.comrealpos, 'what happen')
-      const AMap = window.AMap || {}
-      this.formenterinfo.companyLng = this.comrealpos.split(',')[0]
-      this.formenterinfo.companyLat = this.comrealpos.split(',')[1]
-      this.map.setCenter([Number(this.comrealpos.split(',')[0]), Number(this.comrealpos.split(',')[1])])
-      this.marker.setPosition(new AMap.LngLat(Number(this.comrealpos.split(',')[0]), Number(this.comrealpos.split(',')[1])))
-      document.querySelector('.submitoriginpos').innerHTML = this.comrealpos
+      console.log(this.comrealpos, "what happen");
+      const AMap = window.AMap || {};
+      this.formenterinfo.companyLng = this.comrealpos.split(",")[0];
+      this.formenterinfo.companyLat = this.comrealpos.split(",")[1];
+      this.map.setCenter([
+        Number(this.comrealpos.split(",")[0]),
+        Number(this.comrealpos.split(",")[1])
+      ]);
+      this.marker.setPosition(
+        new AMap.LngLat(
+          Number(this.comrealpos.split(",")[0]),
+          Number(this.comrealpos.split(",")[1])
+        )
+      );
+      document.querySelector(".submitoriginpos").innerHTML = this.comrealpos;
     },
     // 获取公司的位置
     // 一个专门查询的方法
     clickComPos(item) {
-      console.log(item, '别出问题啊啊 啊啊啊啊 啊啊啊啊啊啊啊')
+      console.log(item, "别出问题啊啊 啊啊啊啊 啊啊啊啊啊啊啊");
     },
     searchPosPro(tochoosecomregion, isToCenter) {
       // 搜索公司
       // companyregions
-      const AMap = window.AMap || {}
+      const AMap = window.AMap || {};
       // const tochoosecomregion = this.tochoosecomregion
       // const map = this.map || {}
-      if (tochoosecomregion === '') {
-        return
+      if (tochoosecomregion === "") {
+        return;
       }
-      if (tochoosecomregion !== '') {
-        AMap.plugin('AMap.PlaceSearch', () => {
+      if (tochoosecomregion !== "") {
+        AMap.plugin("AMap.PlaceSearch", () => {
           // 查询公司地点
           const placesearch = new AMap.PlaceSearch({
             // map: this.map
-          })
+          });
           placesearch.search(tochoosecomregion, (status, result) => {
-            if (status === 'complete' && result.info === 'OK' && result.poiList.pois && result.poiList.pois.length > 0) {
-              this.companyregions = [...result.poiList.pois]
+            if (
+              status === "complete" &&
+              result.info === "OK" &&
+              result.poiList.pois &&
+              result.poiList.pois.length > 0
+            ) {
+              this.companyregions = [...result.poiList.pois];
               if (this.companyregions.length > 0) {
-                this.comrealpos = this.companyregions[0].location.lng + ',' + this.companyregions[0].location.lat
-                this.marker.setPosition(new AMap.LngLat(Number(this.comrealpos.split(',')[0]), Number(this.comrealpos.split(',')[1])))
+                this.comrealpos =
+                  this.companyregions[0].location.lng +
+                  "," +
+                  this.companyregions[0].location.lat;
+                this.marker.setPosition(
+                  new AMap.LngLat(
+                    Number(this.comrealpos.split(",")[0]),
+                    Number(this.comrealpos.split(",")[1])
+                  )
+                );
                 if (typeof isToCenter === undefined) {
-                  this.map.setCenter(new AMap.LngLat(Number(this.comrealpos.split(',')[0]), Number(this.comrealpos.split(',')[1])))
-                  this.formenterinfo.companyLng = this.comrealpos.split(',')[0]
-                  this.formenterinfo.companyLat = this.comrealpos.split(',')[1]
+                  this.map.setCenter(
+                    new AMap.LngLat(
+                      Number(this.comrealpos.split(",")[0]),
+                      Number(this.comrealpos.split(",")[1])
+                    )
+                  );
+                  this.formenterinfo.companyLng = this.comrealpos.split(",")[0];
+                  this.formenterinfo.companyLat = this.comrealpos.split(",")[1];
                 }
               }
             }
-          })
-        })
+          });
+        });
       }
     },
     submitlittleform() {
-      this.$refs.formenterinfo1.validate((valid) => {
+      this.$refs.formenterinfo1.validate(valid => {
         if (valid) {
           // 在这里判断this.formenterinfo
           // this.formenterinfo.com
           // let isFormValid = false
-          if (this.formenterinfo.companyLng === '') {
-            this.$message.error('请填写经纬度')
-            return
+          if (this.formenterinfo.companyLng === "") {
+            this.$message.error("请填写经纬度");
+            return;
           }
-          if (this.formenterinfo.companyLat === '') {
-            this.$message.error('请填写经纬度')
-            return
+          if (this.formenterinfo.companyLat === "") {
+            this.$message.error("请填写经纬度");
+            return;
           }
-          changeCompanyInfo(this.formenterinfo).then(res => {
-            this.$message({
-              showClose: true,
-              message: '编辑成功',
-              type: 'success'
-            })
-            this.getAllInfo2()
-          }, () => {
-            this.$message({
-              showClose: true,
-              message: '编辑失败',
-              type: 'error'
-            })
-          })
-          this.dialogVisible = false
+          changeCompanyInfo(this.formenterinfo).then(
+            res => {
+              this.$message({
+                showClose: true,
+                message: "编辑成功",
+                type: "success"
+              });
+              this.getAllInfo2();
+            },
+            () => {
+              this.$message({
+                showClose: true,
+                message: "编辑失败",
+                type: "error"
+              });
+            }
+          );
+          this.dialogVisible = false;
         } else {
           this.$message({
-            message: '请传入正确数值',
-            type: 'warning'
-          })
+            message: "请传入正确数值",
+            type: "warning"
+          });
         }
-      })
+      });
     },
     // 根据省市区设置
     async setRegionSelect(province, city, district) {
-      if (this.formenterinfo.companyProvince === province && this.formenterinfo.companyCity === city && this.formenterinfo.companyCounty === district) {
-        console.log('')
+      if (
+        this.formenterinfo.companyProvince === province &&
+        this.formenterinfo.companyCity === city &&
+        this.formenterinfo.companyCounty === district
+      ) {
+        console.log("");
       } else {
-        this.regionlevel4 = []
-        this.regionlevel5 = []
-        this.region4model = ''
-        this.region5model = ''
+        this.regionlevel4 = [];
+        this.regionlevel5 = [];
+        this.region4model = "";
+        this.region5model = "";
         // 获取所有省份信息
         await getAllProvince().then(res => {
-          this.regionlevel1 = [...res]
-        })
-        const areaCode1 = this.regionlevel1.filter(item => item.name === province)[0].areaCode
+          this.regionlevel1 = [...res];
+        });
+        const areaCode1 = this.regionlevel1.filter(
+          item => item.name === province
+        )[0].areaCode;
         await findAreaByCode(areaCode1, 1).then(res => {
-          this.regionlevel2 = [...res]
-        })
-        const areaCode2 = this.regionlevel2.filter(item => item.name === city)[0].areaCode
+          this.regionlevel2 = [...res];
+        });
+        const areaCode2 = this.regionlevel2.filter(
+          item => item.name === city
+        )[0].areaCode;
         await findAreaByCode(areaCode2, 2).then(res => {
-          this.regionlevel3 = [...res]
-        })
-        const areaCode3 = this.regionlevel3.filter(item => item.name === district)[0].areaCode
+          this.regionlevel3 = [...res];
+        });
+        const areaCode3 = this.regionlevel3.filter(
+          item => item.name === district
+        )[0].areaCode;
         await findAreaByCode(areaCode3, 3).then(res => {
-          this.regionlevel4 = [...res]
-        })
-        this.region1model = areaCode1
-        this.region2model = areaCode2
-        this.region3model = areaCode3
-        this.formenterinfo.companyProvince = province
-        this.formenterinfo.companyCity = city
-        this.formenterinfo.companyCounty = district
-        this.formenterinfo.companyCommunity = ''
-        this.formenterinfo.companyTown = ''
+          this.regionlevel4 = [...res];
+        });
+        this.region1model = areaCode1;
+        this.region2model = areaCode2;
+        this.region3model = areaCode3;
+        this.formenterinfo.companyProvince = province;
+        this.formenterinfo.companyCity = city;
+        this.formenterinfo.companyCounty = district;
+        this.formenterinfo.companyCommunity = "";
+        this.formenterinfo.companyTown = "";
       }
     },
     // 选择当前的国民第一行业
     nationInduschangelevel1() {
       // 动态获取国民第二行业
       // nationindusSecondNames
-      findDimindustry(this.nationindusNames.filter(item => item.name === this.curNationIndusLevel1)[0].industryId).then(res => {
+      findDimindustry(
+        this.nationindusNames.filter(
+          item => item.name === this.curNationIndusLevel1
+        )[0].industryId
+      ).then(res => {
         // console.log(res, '国民第二行业')
-        this.nationindusSecondNames = [...res]
-      })
-      this.formenterinfo.companyDimOneIndustryName = this.curNationIndusLevel1
+        this.nationindusSecondNames = [...res];
+      });
+      this.formenterinfo.companyDimOneIndustryName = this.curNationIndusLevel1;
     },
     // 选择当前的国民第二行业
     nationInduschangelevel2() {
       // 改变当前的国民第二行业
       // console.log(this.curNationIndusLevel2, '当前的第二行业')
-      this.formenterinfo.companyDimTwoIndustryName = this.curNationIndusLevel2
+      this.formenterinfo.companyDimTwoIndustryName = this.curNationIndusLevel2;
     },
     // 一页内的个数变化
     handleSizeChange(val) {
       // console.log(`每页${val}条`)
-      this.curPageSum = val
+      this.curPageSum = val;
       getAllCompanyInfo({
         page: this.curPageDegree,
         size: this.curPageSum
       }).then(res => {
-        this.curSumDegree = res.totalElements
-        this.coms = [...res.content]
-      })
+        this.curSumDegree = res.totalElements;
+        this.coms = [...res.content];
+      });
     },
     // 当前页码变化
     handleCurrentChange(val) {
       // console.log(`当前第几页: ${val}`)
-      this.curPageDegree = val
+      this.curPageDegree = val;
       // 去查询结果
       getAllCompanyInfo({
         page: this.curPageDegree - 1,
         size: this.curPageSum
       }).then(res => {
-        this.curSumDegree = res.totalElements
-        this.coms = [...res.content]
-      })
+        this.curSumDegree = res.totalElements;
+        this.coms = [...res.content];
+      });
     },
     // 模糊搜索企业
     searchEnterprise() {
@@ -840,9 +1080,9 @@ export default {
         size: this.curPageSum,
         companyName: this.enterSearchInfo
       }).then(res => {
-        this.curSumDegree = res.totalElements
-        this.coms = [...res.content]
-      })
+        this.curSumDegree = res.totalElements;
+        this.coms = [...res.content];
+      });
     },
     // 导入企业信息
     importEnter($event) {
@@ -864,77 +1104,80 @@ export default {
     },
     // 导入企业信息
     realImportEnter(index, row) {
-      console.log(index, row, '导入风险文件')
+      console.log(index, row, "导入风险文件");
       // 调用提交按钮
       // console.log(this.$refs['fileuploadEnter'].files, 'helloworld helloworld helloworld helloworld')
-      if (this.$refs['fileuploadEnter'].files.length === 0) {
-        return
+      if (this.$refs["fileuploadEnter"].files.length === 0) {
+        return;
       }
-      const formdata = new FormData()
-      for (let i = 0; i < this.$refs['fileuploadEnter'].files.length; i++) {
-        formdata.append('files', this.$refs['fileuploadEnter'].files[i])
+      const formdata = new FormData();
+      for (let i = 0; i < this.$refs["fileuploadEnter"].files.length; i++) {
+        formdata.append("files", this.$refs["fileuploadEnter"].files[i]);
       }
-      this.isEnterloading = true
+      this.isEnterloading = true;
       axiosFile({
-        url: '/api/thCompany/batchImportCompany',
-        method: 'POST',
+        url: "/api/thCompany/batchImportCompany",
+        method: "POST",
         data: formdata
-      }).then(res => {
-        this.$message({
-          message: '上传成功',
-          type: 'success'
-        })
-        this.getAllInfo2()
-      }, () => {
-        this.$message.error('上传失败')
-        this.isEnterloading = false
-      })
+      }).then(
+        res => {
+          this.$message({
+            message: "上传成功",
+            type: "success"
+          });
+          this.getAllInfo2();
+        },
+        () => {
+          this.$message.error("上传失败");
+          this.isEnterloading = false;
+        }
+      );
     },
     exportStatus() {
       axios({
-        url: process.env.VUE_APP_BASE_API + '/api/thCompany/export',
-        method: 'get',
-        responseType: 'blob',
+        url: process.env.VUE_APP_BASE_API + "/api/thCompany/export",
+        method: "get",
+        responseType: "blob",
         params: {
           hdStatus: 1
         }
-      }).then((response) => {
-        const url = window.URL.createObjectURL(new Blob([response.data]))
-        const link = document.createElement('a')
-        link.href = url
-        link.setAttribute('download', 'export.xls')
-        document.body.appendChild(link)
-        link.click()
-        link.remove()
-        window.URL.revokeObjectURL(link.href)
-      })
+      }).then(response => {
+        const url = window.URL.createObjectURL(new Blob([response.data]));
+        const link = document.createElement("a");
+        link.href = url;
+        link.setAttribute("download", "export.xls");
+        document.body.appendChild(link);
+        link.click();
+        link.remove();
+        window.URL.revokeObjectURL(link.href);
+      });
     },
     exportNoStatus() {
       axios({
-        url: process.env.VUE_APP_BASE_API + '/api/thCompany/export',
-        method: 'get',
-        responseType: 'blob',
+        url: process.env.VUE_APP_BASE_API + "/api/thCompany/export",
+        method: "get",
+        responseType: "blob",
         params: {
           hdStatus: 0
         }
-      }).then((response) => {
-        const url = window.URL.createObjectURL(new Blob([response.data]))
-        const link = document.createElement('a')
-        link.href = url
-        link.setAttribute('download', 'export.xls')
-        document.body.appendChild(link)
-        link.click()
-        link.remove()
-        window.URL.revokeObjectURL(link.href)
-      })
+      }).then(response => {
+        const url = window.URL.createObjectURL(new Blob([response.data]));
+        const link = document.createElement("a");
+        link.href = url;
+        link.setAttribute("download", "export.xls");
+        document.body.appendChild(link);
+        link.click();
+        link.remove();
+        window.URL.revokeObjectURL(link.href);
+      });
     },
     exportEnters() {
       // this.isExportLoading = true
       axios({
-        url: process.env.VUE_APP_BASE_API + '/api/thCompany/export',
-        method: 'get',
-        responseType: 'blob',
-        onDownloadProgress: (progressEvent) => {
+        url: process.env.VUE_APP_BASE_API + "/api/thCompany/export",
+        method: "get",
+        responseType: "blob",
+        onDownloadProgress: progressEvent => {
           // this.isExportLoading = true
           // if (this.curExportTimer) {
           //   clearTimeout(this.curExportTimer)
@@ -944,68 +1187,67 @@ export default {
           //     clearTimeout(this.curExportTimer)
           //   }, 1000)
           // }
-          
         }
-      }).then((response) => {
-        const url = window.URL.createObjectURL(new Blob([response.data]))
-        const link = document.createElement('a')
-        link.href = url
-        link.setAttribute('download', 'export.xls')
-        document.body.appendChild(link)
-        link.click()
-        link.remove()
-        window.URL.revokeObjectURL(link.href)
-      })
+      }).then(response => {
+        const url = window.URL.createObjectURL(new Blob([response.data]));
+        const link = document.createElement("a");
+        link.href = url;
+        link.setAttribute("download", "export.xls");
+        document.body.appendChild(link);
+        link.click();
+        link.remove();
+        window.URL.revokeObjectURL(link.href);
+      });
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
-  .changeinfo-wrapper {
-    padding: 30px;
-    .el-search-wrapper {
-      font-size: 16px;
-    }
+.changeinfo-wrapper {
+  padding: 30px;
+  .el-search-wrapper {
+    font-size: 16px;
   }
-  .submitbtnwrapper {
+}
+.submitbtnwrapper {
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-end;
+  margin-right: 20px;
+}
+.submit-map-wrapper {
+  margin-left: 180px;
+  margin-right: 20px;
+  #submitformmap {
+    width: 100%;
+    height: 450px;
+  }
+  .pos-info-wrapper {
     display: flex;
     flex-direction: row;
-    justify-content: flex-end;
-    margin-right: 20px;
-  }
-  .submit-map-wrapper {
-    margin-left: 180px;
-    margin-right: 20px;
-    #submitformmap {
-      width: 100%;
-      height: 450px;
-    }
-    .pos-info-wrapper {
-      display: flex;
-      flex-direction: row;
-    }
   }
-  .import-file-risk-wrapper {
-    display: inline-block;
-    margin: 0 20px;
-    .import-file-risk {
-      color: white;
-      border-radius: 3px;
-      background-color: #1890ff;
-      text-align: center;
-      width: 56px;
-      height: 28px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      font-size: 14px;
-      &:hover {
-        background-color: #46a6ff;
-      }
+}
+.import-file-risk-wrapper {
+  display: inline-block;
+  margin: 0 20px;
+  .import-file-risk {
+    color: white;
+    border-radius: 3px;
+    background-color: #1890ff;
+    text-align: center;
+    width: 56px;
+    height: 28px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 14px;
+    &:hover {
+      background-color: #46a6ff;
     }
   }
-  /* .import-file-risk-wrapper {
+}
+/* .import-file-risk-wrapper {
     display: inline-block;
     margin: 0 20px;
     .import-file-risk {

src/views/components/coursetype.vue

 <template>
   <div class="course-outer-wrapper">
-    <div class="course-wrapper" :style="{paddingLeft: coursetypes.level * 20 + 'px'}">
+    <div
+      class="course-wrapper"
+      :style="{ paddingLeft: coursetypes.level * 20 + 'px' }"
+    >
       <div style="display: flex;">
         <div v-if="coursetypes.children && coursetypes.children.length > 0">
-          <div v-if="coursetypes.isShow" class="down-triangle" @click="coursetypes.isShow = false" />
-          <div v-else class="right-triangle" @click="coursetypes.isShow = true" />
+          <div
+            v-if="coursetypes.isShow"
+            class="down-triangle"
+            @click="coursetypes.isShow = false"
+          />
+          <div
+            v-else
+            class="right-triangle"
+            @click="coursetypes.isShow = true"
+          />
         </div>
         <div v-else style="width: 20px;" />
         <div>{{ coursetypes.name }}</div>
       </div>
       <div style="display: flex;">
-        <el-button type="primary" icon="el-icon-edit" size="mini" @click="editCourseName">编辑</el-button>
-        <el-button type="primary" icon="el-icon-plus" size="mini" @click="editChildType">添加子分类</el-button>
+        <el-button
+          type="primary"
+          icon="el-icon-edit"
+          size="mini"
+          @click="editCourseName"
+          >编辑</el-button
+        >
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="editChildType"
+          >添加子分类</el-button
+        >
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          size="mini"
+          @click="deleteChildType"
+          >删除子分类</el-button
+        >
       </div>
     </div>
-    <coursetype v-for="item in coursetypes.children" v-show="coursetypes.isShow" :coursetypes="item" :refresh="refresh" />
-    <el-dialog
-      title="编辑课程分类名称"
-      :visible.sync="editNameShow"
-    >
+    <coursetype
+      v-for="item in coursetypes.children"
+      v-show="coursetypes.isShow"
+      :coursetypes="item"
+      :refresh="refresh"
+    />
+    <el-dialog title="编辑课程分类名称" :visible.sync="editNameShow">
       <el-form
         v-if="editNameShow"
         ref="editform"
@@ -26,20 +58,14 @@
         label-width="120px"
         :rules="rules"
       >
-        <el-form-item
-          prop="title"
-          label="课程名称"
-        >
+        <el-form-item prop="title" label="课程名称">
           <el-input v-model="editFormInfo.title" />
         </el-form-item>
-        <el-form-item
-          prop="description"
-          label="描述"
-        >
+        <el-form-item prop="description" label="描述">
           <el-input
             v-model="editFormInfo.description"
             type="textarea"
-            :autosize="{ minRows: 2, maxRows: 4}"
+            :autosize="{ minRows: 2, maxRows: 4 }"
             placeholder="请输入内容"
           />
         </el-form-item>
@@ -49,10 +75,7 @@
         <el-button type="primary" @click="submitEditFormInfo">提交</el-button>
       </div>
     </el-dialog>
-    <el-dialog
-      title="添加子类"
-      :visible.sync="addTypeShow"
-    >
+    <el-dialog title="添加子类" :visible.sync="addTypeShow">
       <el-form
         v-if="addTypeShow"
         ref="addform"
@@ -60,16 +83,10 @@
         label-width="120px"
         :rules="addTypeRules"
       >
-        <el-form-item
-          prop="type"
-          label="类别名称:"
-        >
+        <el-form-item prop="type" label="类别名称:">
           <el-input v-model="addTypeFormInfo.type" />
         </el-form-item>
-        <el-form-item
-          prop="description"
-          label="类别描述"
-        >
+        <el-form-item prop="description" label="类别描述">
           <el-input
             v-model="addTypeFormInfo.description"
             type="textarea"
@@ -84,18 +101,18 @@
       </div>
     </el-dialog>
   </div>
-
 </template>
 
 <script>
 import {
   postOnlineTrainingCategory,
-  putOnlineTrainingCategory
-} from '@/api/coursecategory.js'
+  putOnlineTrainingCategory,
+  deleteOnlineTrainingCategory
+} from "@/api/coursecategory.js";
 export default {
-  name: 'Coursetype',
+  name: "Coursetype",
   components: {
-    coursetype: () => import('./coursetype.vue')
+    coursetype: () => import("./coursetype.vue")
   },
   props: {
     coursetypes: {
@@ -104,11 +121,11 @@ export default {
       default: function() {
         return {
           id: 1,
-          name: 'aa',
+          name: "aa",
           children: [
             {
               id: 2,
-              name: 'bb',
+              name: "bb",
               children: [],
               isShow: false,
               level: 2
@@ -117,7 +134,7 @@ export default {
           isShow: false,
           level: 1,
           pid: null
-        }
+        };
       }
     },
     refresh: {
@@ -138,92 +155,136 @@ export default {
         title: [
           {
             required: true,
-            message: '请输入课程名称',
-            trigger: 'blur'
+            message: "请输入课程名称",
+            trigger: "blur"
           }
         ]
       },
       addTypeShow: false,
       addTypeFormInfo: {
-        type: '',
-        description: '',
+        type: "",
+        description: "",
         pid: -1
       },
       addTypeRules: {
-        type: [
-          { required: true, message: '请输入类别名称', trigger: 'blur' }
-        ]
+        type: [{ required: true, message: "请输入类别名称", trigger: "blur" }]
       }
-    }
+    };
   },
   methods: {
     editCourseName() {
-      this.editNameShow = true
+      this.editNameShow = true;
       this.editFormInfo = {
         title: this.coursetypes.name,
         description: this.coursetypes.description,
         id: this.coursetypes.id,
         pid: this.coursetypes.pid
-      }
+      };
     },
     editChildType() {
-      this.addTypeShow = true
-      this.addTypeFormInfo.type = ''
-      this.addTypeFormInfo.description = ''
-      this.addTypeFormInfo.pid = this.coursetypes.id
+      this.addTypeShow = true;
+      this.addTypeFormInfo.type = "";
+      this.addTypeFormInfo.description = "";
+      this.addTypeFormInfo.pid = this.coursetypes.id;
+    },
+    deleteChildType() {
+      console.log(
+        this.coursetypes,
+        "deleteChildType deleteChildType deleteChildType deleteChildType"
+      );
+      console.log(this.refresh, "this.refresh");
+      const toRemoveArr = [];
+      function recursive(toDeleteArr) {
+        for (let i = 0; i < toDeleteArr.length; i++) {
+          toRemoveArr.push(toDeleteArr[i].id);
+          if (toDeleteArr[i].children.length > 0) {
+            recursive(toDeleteArr[i].children);
+          }
+        }
+      }
+      recursive([this.coursetypes]);
+      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          deleteOnlineTrainingCategory(toRemoveArr).then(
+            () => {
+              this.$message({
+                type: "success",
+                message: "删除成功!"
+              });
+              this.refresh();
+            },
+            () => {
+              this.$message.error("删除失败");
+            }
+          );
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
     submitEditFormInfo() {
-      this.$refs.editform.validate((valid) => {
+      this.$refs.editform.validate(valid => {
         if (valid) {
           const data = {
             name: this.editFormInfo.title,
             description: this.editFormInfo.description,
             id: this.editFormInfo.id,
             pid: this.editFormInfo.pid
-          }
-          putOnlineTrainingCategory(data).then(res => {
-            this.$message({
-              type: 'success',
-              message: '修改成功'
+          };
+          putOnlineTrainingCategory(data)
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "修改成功"
+              });
+              this.refresh();
+              this.editNameShow = false;
             })
-            this.refresh()
-            this.editNameShow = false
-          }).catch(() => {
-            this.$message.error('修改失败')
-          })
+            .catch(() => {
+              this.$message.error("修改失败");
+            });
         }
-      })
+      });
     },
     cancelAddType() {
-      this.addTypeShow = false
+      this.addTypeShow = false;
     },
     submitAddType() {
-      this.$refs.addform.validate((valid) => {
+      this.$refs.addform.validate(valid => {
         if (valid) {
           const data = {
             name: this.addTypeFormInfo.type,
             description: this.addTypeFormInfo.description,
             pid: this.addTypeFormInfo.pid
-          }
-          postOnlineTrainingCategory(data).then(res => {
-            this.addTypeShow = false
-            this.$message({
-              type: 'success',
-              message: '添加成功'
+          };
+          postOnlineTrainingCategory(data)
+            .then(res => {
+              this.addTypeShow = false;
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.refresh();
             })
-            this.refresh()
-          }).catch(() => {
-            this.$message.error('添加失败')
-          })
+            .catch(() => {
+              this.$message.error("添加失败");
+            });
         }
-      })
+      });
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
-.course-wrapper{
+.course-wrapper {
   display: flex;
   justify-content: space-between;
   height: 50px;
@@ -231,20 +292,20 @@ export default {
   align-items: center;
   margin: 0px 10px;
 }
-  .down-triangle {
-    width: 20px;
-    height: 20px;
-    background-image: url('../../assets/home/下三角.png');
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    cursor: pointer;
-  }
-  .right-triangle {
-    width: 20px;
-    height: 20px;
-    background-image: url('../../assets/home/右三角.png');
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    cursor: pointer;
-  }
+.down-triangle {
+  width: 20px;
+  height: 20px;
+  background-image: url("../../assets/home/下三角.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  cursor: pointer;
+}
+.right-triangle {
+  width: 20px;
+  height: 20px;
+  background-image: url("../../assets/home/右三角.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  cursor: pointer;
+}
 </style>

src/views/components/openezuikitjs.vue

+<template>
+  <div
+    class="hello-ezuikit-js"
+    style="width: 100%;height:100%;padding: 35px;display: flex; justify-content: center;"
+  >
+    <div
+      ref="monitordom"
+      id="ope-video-container"
+      style="width:90%;height:90%"
+    ></div>
+  </div>
+</template>
+
+<script>
+import EZUIKit from "ezuikit-js";
+import axios from "axios";
+const service = axios.create({});
+export default {
+  name: "HelloWorld",
+  props: {
+    msg: String,
+    appKey: String,
+    appSecret: String,
+    filename: String,
+    devNumber: String
+  },
+  async mounted() {
+    console.group("mounted 组件挂载完毕状态===============》");
+
+    // let result = null;
+
+    let dataJson = "appKey=" + this.appKey + "&appSecret=" + this.appSecret;
+    service.defaults.headers["Content-Type"] =
+      "application/x-www-form-urlencoded; charset=UTF-8";
+    let result2 = null;
+    await service
+      .post("https://open.ys7.com/api/lapp/token/get", dataJson)
+      .then(res1 => {
+        console.log(res1, "service post");
+        result2 = res1;
+      });
+    if (result2.data.code === "200") {
+      const iframeText = this.getIframeText(
+        "ysOpenDevice",
+        this.devNumber,
+        this.filename,
+        result2.data.data.accessToken
+      );
+      this.$refs.monitordom.innerHTML = iframeText;
+      // this.$refs.monitordom.innerHTML = `<iframe  src="https://open.ys7.com/ezopen/h5/iframe_se?url=ezopen://open.ys7.com/${
+      //   this.devNumber
+      // }/${this.filename}&autoplay=1&audio=1&accessToken=${
+      //   result2.data.data.accessToken
+      // }&templete=2"id="'${"ysOpenDevice"}'" width="100%" height="100%" frameborder="no" border="0" allowfullscreen> </iframe>`;
+      // const player = new EZUIKit.EZUIKitPlayer({
+      //   autoplay: true,
+      //   id: "ope-video-container",
+      //   accessToken: result2.data.data.accessToken,
+      //   url: `ezopen://open.ys7.com/${this.devNumber}/${this.filename}`,
+      //   template: "simple" // simple - 极简版;standard-标准版;security - 安防版(预览回放);voice-语音版；
+      //   // footer: ["fullScreen"],
+      //   // 视频上方头部控件
+      //   // header: ["capturePicture", "save", "zoom"] // 如果templete参数不为simple,该字段将被覆盖
+      //   // plugin: ['talk'],                       // 加载插件，talk-对讲
+      //   // 视频下方底部控件
+      //   // footer: ["talk", "broadcast", "hd", "fullScreen"], // 如果template参数不为simple,该字段将被覆盖
+      //   // audio: 1, // 是否默认开启声音 0 - 关闭 1 - 开启
+      //   // openSoundCallBack: data => console.log("开启声音回调", data),
+      //   // closeSoundCallBack: data => console.log("关闭声音回调", data),
+      //   // startSaveCallBack: data => console.log("开始录像回调", data),
+      //   // stopSaveCallBack: data => console.log("录像回调", data),
+      //   // capturePictureCallBack: data => console.log("截图成功回调", data),
+      //   // fullScreenCallBack: data => console.log("全屏回调", data),
+      //   // getOSDTimeCallBack: data => console.log("获取OSDTime回调", data),
+      //   // width: 600,
+      //   // height: 400
+      // });
+      // player.play();
+    }
+    // console.log("player", player);
+    // setTimeout(()=>{
+    //   player.stop(); // 方法调用示例，10秒后关闭视频
+    // },10000)
+  },
+  methods: {
+    getIframeText(idName, filename, devNumber, accessToken) {
+      return (
+        '<iframe  src="https://open.ys7.com/ezopen/h5/iframe_se?url=ezopen://open.ys7.com/' +
+        devNumber +
+        "/" +
+        filename +
+        "&autoplay=1&audio=1&accessToken=" +
+        accessToken +
+        '&templete=2" id="' +
+        idName +
+        '" width="100%" height="100%" frameborder="no" border="0" allowfullscreen> </iframe>'
+      );
+    }
+  },
+  getAccessToken(appKey, appSecret) {
+    var dataJson = "appKey=" + appKey + "&appSecret=" + appSecret;
+    var request = axios.create({});
+    request.defaults.headers["Content-Type"] =
+      "application/x-www-form-urlencoded; charset=UTF-8";
+    return request
+      .post("https://open.ys7.com/api/lapp/token/get", dataJson)
+      .then(res => {
+        var data = res.data || {};
+        if (data["code"] == "200") {
+          return data["data"]["accessToken"];
+        } else {
+          return null;
+        }
+      })
+      .catch(err => {
+        console.log(err);
+        return err;
+      });
+  }
+};
+</script>
+<style lang="scss" scoped>
+.hello-ezuikit-js {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.ope-video-container {
+  width: 96%;
+  height: 70%;
+}
+</style>

src/views/dashboard/PanelGroup.vue

@@ -7,9 +7,14 @@
         </div>
         <div class="card-panel-description">
           <div class="card-panel-text">
-            New Visits
+            已登记企业数量
           </div>
-          <count-to :start-val="0" :end-val="102400" :duration="2600" class="card-panel-num" />
+          <count-to
+            :start-val="0"
+            :end-val="enterpriseNum"
+            :duration="2600"
+            class="card-panel-num"
+          />
         </div>
       </div>
     </el-col>
@@ -20,9 +25,14 @@
         </div>
         <div class="card-panel-description">
           <div class="card-panel-text">
-            Messages
+            已经注册人数
           </div>
-          <count-to :start-val="0" :end-val="81212" :duration="3000" class="card-panel-num" />
+          <count-to
+            :start-val="0"
+            :end-val="enterprisePeopleNum"
+            :duration="3000"
+            class="card-panel-num"
+          />
         </div>
       </div>
     </el-col>
@@ -33,9 +43,14 @@
         </div>
         <div class="card-panel-description">
           <div class="card-panel-text">
-            Purchases
+            已参与在线培训人数
           </div>
-          <count-to :start-val="0" :end-val="9280" :duration="3200" class="card-panel-num" />
+          <count-to
+            :start-val="0"
+            :end-val="trainPeopleNum"
+            :duration="3200"
+            class="card-panel-num"
+          />
         </div>
       </div>
     </el-col>
@@ -46,9 +61,14 @@
         </div>
         <div class="card-panel-description">
           <div class="card-panel-text">
-            Shoppings
+            已上传企业证书的企业数量
           </div>
-          <count-to :start-val="0" :end-val="13600" :duration="3600" class="card-panel-num" />
+          <count-to
+            :start-val="0"
+            :end-val="uploadedCertEnterpriseNum"
+            :duration="3600"
+            class="card-panel-num"
+          />
         </div>
       </div>
     </el-col>
@@ -56,18 +76,35 @@
 </template>
 
 <script>
-import CountTo from 'vue-count-to'
+import { homePageAnalyze } from "@/api/home.js";
+import CountTo from "vue-count-to";
 
 export default {
   components: {
     CountTo
   },
+  data() {
+    return {
+      enterpriseNum: 0,
+      enterprisePeopleNum: 0,
+      trainPeopleNum: 0,
+      uploadedCertEnterpriseNum: 0
+    };
+  },
   methods: {
     handleSetLineChartData(type) {
-      this.$emit('handleSetLineChartData', type)
+      this.$emit("handleSetLineChartData", type);
     }
+  },
+  mounted() {
+    homePageAnalyze().then(res => {
+      this.enterpriseNum = res.enterpriseNum;
+      this.enterprisePeopleNum = res.enterprisePeopleNum;
+      this.trainPeopleNum = res.trainPeopleNum;
+      this.uploadedCertEnterpriseNum = res.uploadedCertEnterpriseNum;
+    });
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
@@ -86,8 +123,8 @@ export default {
     overflow: hidden;
     color: #666;
     background: #fff;
-    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
-    border-color: rgba(0, 0, 0, .05);
+    box-shadow: 4px 4px 40px rgba(0, 0, 0, 0.05);
+    border-color: rgba(0, 0, 0, 0.05);
 
     &:hover {
       .card-panel-icon-wrapper {
@@ -107,7 +144,7 @@ export default {
       }
 
       .icon-shopping {
-        background: #34bfa3
+        background: #34bfa3;
       }
     }
 
@@ -124,7 +161,7 @@ export default {
     }
 
     .icon-shopping {
-      color: #34bfa3
+      color: #34bfa3;
     }
 
     .card-panel-icon-wrapper {
@@ -160,7 +197,7 @@ export default {
   }
 }
 
-@media (max-width:550px) {
+@media (max-width: 550px) {
   .card-panel-description {
     display: none;
   }

src/views/enterSafeManag/hdtype.vue

 <template>
-  <div class="hd-type-wrapper">
-    <div class="hd-type-tools-wrapper">
-      <el-button type="primary" @click="createHdType">新增</el-button>
-      <el-button type="warning" :disabled="isEditHdTypeEnable" @click="editHdType">编辑</el-button>
-      <el-button type="danger" :disabled="isDelHdTypeEnable" @click="delHdType">删除</el-button>
+  <div class="hd-info-wrapper">
+    <div class="hd-type-add-wrapper">
+      <el-button type="primary" @click="addHdTypeDialogShow"
+        >新增安全类别</el-button
+      >
+    </div>
+    <div
+      style="display: flex;align-items: center;"
+      @click.stop="totalData.isDataCheckShow = !totalData.isDataCheckShow"
+    >
+      <div
+        class="triangle-wrapper"
+        style="margin-right: 15px;margin-left: 10px;"
+      >
+        <div v-if="totalData.isDataCheckShow">
+          <svg
+            viewBox="0 0 1024 1024"
+            version="1.1"
+            xmlns="http://www.w3.org/2000/svg"
+            p-id="3183"
+            xmlns:xlink="http://www.w3.org/1999/xlink"
+            width="32"
+            height="32"
+          >
+            <path
+              d="M913.536524 551.447587H116.910163c-23.637854 0-42.977915-19.340062-42.977916-42.977916s19.340062-42.977915 42.977916-42.977915h796.626361c23.637854 0 42.977915 19.340062 42.977916 42.977915s-19.340062 42.977915-42.977916 42.977916z"
+              p-id="3184"
+            ></path>
+          </svg>
+        </div>
+        <div v-else>
+          <svg
+            viewBox="0 0 1024 1024"
+            xmlns="http://www.w3.org/2000/svg"
+            width="32"
+            height="32"
+            xmlns:xlink="http://www.w3.org/1999/xlink"
+          >
+            <path
+              d="M426.666667 426.666667H85.546667A85.418667 85.418667 0 0 0 0 512c0 47.445333 38.314667 85.333333 85.546667 85.333333H426.666667v341.12c0 47.274667 38.186667 85.546667 85.333333 85.546667 47.445333 0 85.333333-38.314667 85.333333-85.546667V597.333333h341.12A85.418667 85.418667 0 0 0 1024 512c0-47.445333-38.314667-85.333333-85.546667-85.333333H597.333333V85.546667A85.418667 85.418667 0 0 0 512 0c-47.445333 0-85.333333 38.314667-85.333333 85.546667V426.666667z"
+              fill="#2c2c2c"
+            ></path>
+          </svg>
+        </div>
+      </div>
+      <h2>安全资料检查类</h2>
+    </div>
+    <div
+      class="hd-type-wrapper"
+      v-show="totalData.isDataCheckShow"
+      v-for="(item, index) in totalData.datacheck"
+    >
+      <div
+        class="hd-type-tools-wrapper"
+        @click.stop="item.isShow = !item.isShow"
+      >
+        <div class="hd-type-triangle-name-wrapper">
+          <div class="triangle-wrapper">
+            <div v-if="item.isShow">
+              <svg
+                viewBox="0 0 1024 1024"
+                version="1.1"
+                xmlns="http://www.w3.org/2000/svg"
+                p-id="3183"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+                width="26"
+                height="26"
+              >
+                <path
+                  d="M913.536524 551.447587H116.910163c-23.637854 0-42.977915-19.340062-42.977916-42.977916s19.340062-42.977915 42.977916-42.977915h796.626361c23.637854 0 42.977915 19.340062 42.977916 42.977915s-19.340062 42.977915-42.977916 42.977916z"
+                  p-id="3184"
+                ></path>
+              </svg>
+            </div>
+            <div v-else>
+              <svg
+                viewBox="0 0 1024 1024"
+                xmlns="http://www.w3.org/2000/svg"
+                width="26"
+                height="26"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+              >
+                <path
+                  d="M426.666667 426.666667H85.546667A85.418667 85.418667 0 0 0 0 512c0 47.445333 38.314667 85.333333 85.546667 85.333333H426.666667v341.12c0 47.274667 38.186667 85.546667 85.333333 85.546667 47.445333 0 85.333333-38.314667 85.333333-85.546667V597.333333h341.12A85.418667 85.418667 0 0 0 1024 512c0-47.445333-38.314667-85.333333-85.546667-85.333333H597.333333V85.546667A85.418667 85.418667 0 0 0 512 0c-47.445333 0-85.333333 38.314667-85.333333 85.546667V426.666667z"
+                  fill="#2c2c2c"
+                ></path>
+              </svg>
+            </div>
+          </div>
+          <div class="hd-type-name">
+            <span style="">安全类别：</span><span>{{ item.type }}</span>
+          </div>
+        </div>
+        <div class="hd-type-tool-wrapper">
+          <el-button
+            type="warning"
+            @click.stop="editHdTypeDialogShow(item, '安全资料类')"
+            >编辑</el-button
+          >
+          <el-button type="danger" @click.stop="deleteHdType(item)"
+            >删除</el-button
+          >
+        </div>
+      </div>
+      <div class="hd-type-tools-down" v-show="item.isShow">
+        <div class="hd-inspection-add-wrapper">
+          <el-button
+            type="primary"
+            @click.stop="addHdInspectionDialogShow(item)"
+            >新增检查内容</el-button
+          >
+        </div>
+        <div
+          v-for="(inspection, index1) in item.inspectionContent"
+          class="hd-inspection-item-total-wrapper"
+        >
+          <div
+            class="hd-inspection-item-wrapper"
+            @click="inspection.isShow = !inspection.isShow"
+          >
+            <div class="hd-inspection-triangle-wrapper">
+              <div class="triangle-wrapper">
+                <div v-if="inspection.isShow">
+                  <svg
+                    viewBox="0 0 1024 1024"
+                    version="1.1"
+                    xmlns="http://www.w3.org/2000/svg"
+                    p-id="3183"
+                    xmlns:xlink="http://www.w3.org/1999/xlink"
+                    width="22"
+                    height="22"
+                  >
+                    <path
+                      d="M913.536524 551.447587H116.910163c-23.637854 0-42.977915-19.340062-42.977916-42.977916s19.340062-42.977915 42.977916-42.977915h796.626361c23.637854 0 42.977915 19.340062 42.977916 42.977915s-19.340062 42.977915-42.977916 42.977916z"
+                      p-id="3184"
+                    ></path>
+                  </svg>
+                </div>
+                <div v-else>
+                  <svg
+                    viewBox="0 0 1024 1024"
+                    xmlns="http://www.w3.org/2000/svg"
+                    width="22"
+                    height="22"
+                    xmlns:xlink="http://www.w3.org/1999/xlink"
+                  >
+                    <path
+                      d="M426.666667 426.666667H85.546667A85.418667 85.418667 0 0 0 0 512c0 47.445333 38.314667 85.333333 85.546667 85.333333H426.666667v341.12c0 47.274667 38.186667 85.546667 85.333333 85.546667 47.445333 0 85.333333-38.314667 85.333333-85.546667V597.333333h341.12A85.418667 85.418667 0 0 0 1024 512c0-47.445333-38.314667-85.333333-85.546667-85.333333H597.333333V85.546667A85.418667 85.418667 0 0 0 512 0c-47.445333 0-85.333333 38.314667-85.333333 85.546667V426.666667z"
+                      fill="#2c2c2c"
+                    ></path>
+                  </svg>
+                </div>
+              </div>
+              <div class="hd-inspection-content">
+                <span style="font-size: 18px;font-weight: bold;"
+                  >检查内容: </span
+                ><span>{{ inspection.inspectionContent }}</span>
+              </div>
+            </div>
+            <div class="hd-inspection-tools-wrapper">
+              <el-button
+                type="warning"
+                @click.stop="editInspectionDialogShow(item, inspection)"
+                >编辑</el-button
+              >
+              <el-button
+                type="danger"
+                @click.stop="deleteInspection(inspection)"
+                >删除</el-button
+              >
+            </div>
+          </div>
+          <div class="hd-discover-add-wrapper" v-show="inspection.isShow">
+            <el-button
+              type="primary"
+              @click="safetyMatterDialogShow(inspection)"
+              >新增发现问题</el-button
+            >
+          </div>
+          <div
+            v-for="(matt, index2) in inspection.matts"
+            class="hd-discover-wrapper"
+            v-show="inspection.isShow"
+          >
+            <div class="matt-left">
+              <div class="matt-left-discover">
+                <span class="matt-left-title">发现问题：</span
+                ><span class="matt-left-content">{{ matt.discover }}</span>
+              </div>
+              <div class="matt-left-basis">
+                <span class="matt-left-title">检查依据：</span
+                ><span class="matt-left-content">{{ matt.basis }}</span>
+              </div>
+              <div class="matt-left-suggestion">
+                <span class="matt-left-title">检查建议：</span
+                ><span class="matt-left-content">{{ matt.suggestion }}</span>
+              </div>
+            </div>
+            <div class="matt-right">
+              <el-button
+                type="warning"
+                @click.stop="editSafetyMatterDialogShow(inspection, matt)"
+                >编辑</el-button
+              >
+              <el-button
+                type="danger"
+                @click.stop="deleteSafetyMatterDialogShow(matt)"
+                >删除</el-button
+              >
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
-    <div class="hd-type-table-wrapper">
-      <el-table
-        :data="hdTypeTable"
-        border
-        @selection-change="handleSelectionChange"
+    <div
+      style="display: flex;align-items: center;"
+      @click.stop="totalData.isSiteManageShow = !totalData.isSiteManageShow"
+    >
+      <div
+        class="triangle-wrapper"
+        style="margin-right: 15px;margin-left: 10px;"
       >
-        <el-table-column
-          type="selection"
-          width="55"
-        ></el-table-column>
-        <el-table-column
-          prop="type"
-          label="隐患类别"
-          width="240"
-        ></el-table-column>
-      </el-table>
+        <div v-if="totalData.isSiteManageShow">
+          <svg
+            viewBox="0 0 1024 1024"
+            version="1.1"
+            xmlns="http://www.w3.org/2000/svg"
+            p-id="3183"
+            xmlns:xlink="http://www.w3.org/1999/xlink"
+            width="32"
+            height="32"
+          >
+            <path
+              d="M913.536524 551.447587H116.910163c-23.637854 0-42.977915-19.340062-42.977916-42.977916s19.340062-42.977915 42.977916-42.977915h796.626361c23.637854 0 42.977915 19.340062 42.977916 42.977915s-19.340062 42.977915-42.977916 42.977916z"
+              p-id="3184"
+            ></path>
+          </svg>
+        </div>
+        <div v-else>
+          <svg
+            viewBox="0 0 1024 1024"
+            xmlns="http://www.w3.org/2000/svg"
+            width="32"
+            height="32"
+            xmlns:xlink="http://www.w3.org/1999/xlink"
+          >
+            <path
+              d="M426.666667 426.666667H85.546667A85.418667 85.418667 0 0 0 0 512c0 47.445333 38.314667 85.333333 85.546667 85.333333H426.666667v341.12c0 47.274667 38.186667 85.546667 85.333333 85.546667 47.445333 0 85.333333-38.314667 85.333333-85.546667V597.333333h341.12A85.418667 85.418667 0 0 0 1024 512c0-47.445333-38.314667-85.333333-85.546667-85.333333H597.333333V85.546667A85.418667 85.418667 0 0 0 512 0c-47.445333 0-85.333333 38.314667-85.333333 85.546667V426.666667z"
+              fill="#2c2c2c"
+            ></path>
+          </svg>
+        </div>
+      </div>
+      <h2>现场管理类</h2>
+    </div>
+    <div
+      class="hd-type-wrapper"
+      v-show="totalData.isSiteManageShow"
+      v-for="(item, index) in totalData.sitemanage"
+    >
+      <div class="hd-type-tools-wrapper">
+        <div
+          class="hd-type-triangle-name-wrapper"
+          @click.stop="item.isShow = !item.isShow"
+        >
+          <div class="triangle-wrapper">
+            <div v-if="item.isShow">
+              <svg
+                viewBox="0 0 1024 1024"
+                version="1.1"
+                xmlns="http://www.w3.org/2000/svg"
+                p-id="3183"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+                width="26"
+                height="26"
+              >
+                <path
+                  d="M913.536524 551.447587H116.910163c-23.637854 0-42.977915-19.340062-42.977916-42.977916s19.340062-42.977915 42.977916-42.977915h796.626361c23.637854 0 42.977915 19.340062 42.977916 42.977915s-19.340062 42.977915-42.977916 42.977916z"
+                  p-id="3184"
+                ></path>
+              </svg>
+            </div>
+            <div v-else>
+              <svg
+                viewBox="0 0 1024 1024"
+                xmlns="http://www.w3.org/2000/svg"
+                width="26"
+                height="26"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+              >
+                <path
+                  d="M426.666667 426.666667H85.546667A85.418667 85.418667 0 0 0 0 512c0 47.445333 38.314667 85.333333 85.546667 85.333333H426.666667v341.12c0 47.274667 38.186667 85.546667 85.333333 85.546667 47.445333 0 85.333333-38.314667 85.333333-85.546667V597.333333h341.12A85.418667 85.418667 0 0 0 1024 512c0-47.445333-38.314667-85.333333-85.546667-85.333333H597.333333V85.546667A85.418667 85.418667 0 0 0 512 0c-47.445333 0-85.333333 38.314667-85.333333 85.546667V426.666667z"
+                  fill="#2c2c2c"
+                ></path>
+              </svg>
+            </div>
+          </div>
+          <div class="hd-type-name">
+            <span style="">安全类别：</span><span>{{ item.type }}</span>
+          </div>
+        </div>
+        <div class="hd-type-tool-wrapper">
+          <el-button
+            type="warning"
+            @click.stop="editHdTypeDialogShow(item, '现场检查类')"
+            >编辑</el-button
+          >
+          <el-button type="danger" @click.stop="deleteHdType(item)"
+            >删除</el-button
+          >
+        </div>
+      </div>
+      <div class="hd-type-tools-down" v-show="item.isShow">
+        <div class="hd-inspection-add-wrapper">
+          <el-button
+            type="primary"
+            @click.stop="addHdInspectionDialogShow(item)"
+            >新增检查内容</el-button
+          >
+        </div>
+        <div
+          v-for="(inspection, index1) in item.inspectionContent"
+          class="hd-inspection-item-total-wrapper"
+        >
+          <div class="hd-inspection-item-wrapper">
+            <div
+              class="hd-inspection-triangle-wrapper"
+              @click="inspection.isShow = !inspection.isShow"
+            >
+              <div class="triangle-wrapper">
+                <div v-if="inspection.isShow">
+                  <svg
+                    viewBox="0 0 1024 1024"
+                    version="1.1"
+                    xmlns="http://www.w3.org/2000/svg"
+                    p-id="3183"
+                    xmlns:xlink="http://www.w3.org/1999/xlink"
+                    width="22"
+                    height="22"
+                  >
+                    <path
+                      d="M913.536524 551.447587H116.910163c-23.637854 0-42.977915-19.340062-42.977916-42.977916s19.340062-42.977915 42.977916-42.977915h796.626361c23.637854 0 42.977915 19.340062 42.977916 42.977915s-19.340062 42.977915-42.977916 42.977916z"
+                      p-id="3184"
+                    ></path>
+                  </svg>
+                </div>
+                <div v-else>
+                  <svg
+                    viewBox="0 0 1024 1024"
+                    xmlns="http://www.w3.org/2000/svg"
+                    width="22"
+                    height="22"
+                    xmlns:xlink="http://www.w3.org/1999/xlink"
+                  >
+                    <path
+                      d="M426.666667 426.666667H85.546667A85.418667 85.418667 0 0 0 0 512c0 47.445333 38.314667 85.333333 85.546667 85.333333H426.666667v341.12c0 47.274667 38.186667 85.546667 85.333333 85.546667 47.445333 0 85.333333-38.314667 85.333333-85.546667V597.333333h341.12A85.418667 85.418667 0 0 0 1024 512c0-47.445333-38.314667-85.333333-85.546667-85.333333H597.333333V85.546667A85.418667 85.418667 0 0 0 512 0c-47.445333 0-85.333333 38.314667-85.333333 85.546667V426.666667z"
+                      fill="#2c2c2c"
+                    ></path>
+                  </svg>
+                </div>
+              </div>
+              <div class="hd-inspection-content">
+                <span style="font-size: 18px;font-weight: bold;"
+                  >检查内容: </span
+                ><span>{{ inspection.inspectionContent }}</span>
+              </div>
+            </div>
+            <div class="hd-inspection-tools-wrapper">
+              <el-button
+                type="warning"
+                @click.stop="editInspectionDialogShow(item, inspection)"
+                >编辑</el-button
+              >
+              <el-button
+                type="danger"
+                @click.stop="deleteInspection(inspection)"
+                >删除</el-button
+              >
+            </div>
+          </div>
+          <div class="hd-discover-add-wrapper" v-show="inspection.isShow">
+            <el-button
+              type="primary"
+              @click="safetyMatterDialogShow(inspection)"
+              >新增发现问题</el-button
+            >
+          </div>
+          <div
+            v-for="(matt, index2) in inspection.matts"
+            class="hd-discover-wrapper"
+            v-show="inspection.isShow"
+          >
+            <div class="matt-left">
+              <div class="matt-left-discover">
+                <span class="matt-left-title">发现问题：</span
+                ><span class="matt-left-content">{{ matt.discover }}</span>
+              </div>
+              <div class="matt-left-basis">
+                <span class="matt-left-title">检查依据：</span
+                ><span class="matt-left-content">{{ matt.basis }}</span>
+              </div>
+              <div class="matt-left-suggestion">
+                <span class="matt-left-title">检查建议：</span
+                ><span class="matt-left-content">{{ matt.suggestion }}</span>
+              </div>
+            </div>
+            <div class="matt-right">
+              <el-button
+                type="warning"
+                @click="editSafetyMatterDialogShow(inspection, matt)"
+                >编辑</el-button
+              >
+              <el-button
+                type="danger"
+                @click="deleteSafetyMatterDialogShow(matt)"
+                >删除</el-button
+              >
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <div
+        style="display: flex; align-items: center; justify-content: space-between;"
+        @click.stop="isShowTemplateTableData = !isShowTemplateTableData"
+      >
+        <div style="display: flex; align-items: center;">
+          <div
+            class="triangle-wrapper"
+            style="margin-right: 15px;margin-left: 10px;"
+          >
+            <div v-if="isShowTemplateTableData">
+              <svg
+                viewBox="0 0 1024 1024"
+                version="1.1"
+                xmlns="http://www.w3.org/2000/svg"
+                p-id="3183"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+                width="32"
+                height="32"
+              >
+                <path
+                  d="M913.536524 551.447587H116.910163c-23.637854 0-42.977915-19.340062-42.977916-42.977916s19.340062-42.977915 42.977916-42.977915h796.626361c23.637854 0 42.977915 19.340062 42.977916 42.977915s-19.340062 42.977915-42.977916 42.977916z"
+                  p-id="3184"
+                ></path>
+              </svg>
+            </div>
+            <div v-else>
+              <svg
+                viewBox="0 0 1024 1024"
+                xmlns="http://www.w3.org/2000/svg"
+                width="32"
+                height="32"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+              >
+                <path
+                  d="M426.666667 426.666667H85.546667A85.418667 85.418667 0 0 0 0 512c0 47.445333 38.314667 85.333333 85.546667 85.333333H426.666667v341.12c0 47.274667 38.186667 85.546667 85.333333 85.546667 47.445333 0 85.333333-38.314667 85.333333-85.546667V597.333333h341.12A85.418667 85.418667 0 0 0 1024 512c0-47.445333-38.314667-85.333333-85.546667-85.333333H597.333333V85.546667A85.418667 85.418667 0 0 0 512 0c-47.445333 0-85.333333 38.314667-85.333333 85.546667V426.666667z"
+                  fill="#2c2c2c"
+                ></path>
+              </svg>
+            </div>
+          </div>
+          <h2>企业安全责任清单模版</h2>
+        </div>
+        <el-button
+          type="primary"
+          style="margin-right: 15px;"
+          @click.stop="generateAllTableData"
+          >生成企业安全责任清单模板</el-button
+        >
+      </div>
+      <div v-show="isShowTemplateTableData" style="padding: 20px;">
+        <el-table
+          :data="allTotalGenerateTableData"
+          :span-method="arraySpanMethodSync"
+          border
+          v-loading="isLoadingTableData"
+        >
+          <el-table-column
+            prop="totalCategory"
+            label="类别"
+            width="120"
+          ></el-table-column>
+          <el-table-column
+            prop="type"
+            label="安全检查类别"
+            width="240"
+          ></el-table-column>
+          <el-table-column
+            prop="secContent"
+            label="安全检查内容"
+            width="280"
+          ></el-table-column>
+          <el-table-column
+            prop="discover"
+            label="发现问题"
+            width="360"
+          ></el-table-column>
+          <el-table-column
+            prop="basis"
+            label="检查依据"
+            width="360"
+          ></el-table-column>
+          <el-table-column
+            prop="suggestion"
+            label="整改建议"
+            width="360"
+          ></el-table-column>
+        </el-table>
+      </div>
     </div>
     <el-dialog
-      title="添加风险类别"
-      :visible.sync="addDialogVisible"
+      title="安全类别表单"
+      :visible.sync="isShowAddTypeDialog"
       width="50%"
+      :close-on-click-modal="false"
     >
       <el-form
-        ref="addform"
-        :model="addFormInfo"
-        label-width="80px"
-        :rules="addHdTypeRules"
-        v-if="addDialogVisible"
+        v-if="isShowAddTypeDialog"
+        ref="hdtypeaddform"
+        :rules="hdTypeFormRules"
+        :model="hdTypeForm"
+        label-width="120px"
       >
-        <el-form-item
-          prop="type"
-          label="隐患类别"
-        >
-          <el-input v-model="addFormInfo.type" maxlength="50"></el-input>
+        <el-form-item label="安全分类" prop="type">
+          <el-select v-model="hdTypeForm.type" placeholder="请选择安全分类">
+            <el-option label="安全资料类" value="安全资料类"></el-option>
+            <el-option label="现场检查类" value="现场检查类"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="安全类别名称" prop="name">
+          <el-input v-model="hdTypeForm.name"></el-input>
         </el-form-item>
       </el-form>
       <div slot="footer">
-        <el-button type="info" @click="cancelAddHdType">取消</el-button>
-        <el-button type="primary" @click="confirmAddHdType">确定</el-button>
+        <el-button type="primary" @click="submitSecType">提交</el-button>
       </div>
     </el-dialog>
     <el-dialog
-      title="编辑隐患类别"
-      :visible.sync="editDialogVisible"
+      title="编辑安全类别表单"
+      :visible.sync="isShowEditTypeDialog"
       width="50%"
+      :close-on-click-modal="false"
     >
       <el-form
-        ref="editform"
-        :model="editFormInfo"
-        label-width="80px"
-        :rules="editHdTypeRules"
-        v-if="editDialogVisible"
+        v-if="isShowEditTypeDialog"
+        ref="hdtypeeditform"
+        :rules="hdTypeFormRules"
+        :model="hdEditTypeForm"
+        label-width="120px"
       >
-        <el-form-item
-          prop="type"
-          label="隐患类别"
+        <el-form-item label="安全分类" prop="type">
+          <el-select v-model="hdEditTypeForm.type" placeholder="请选择安全分类">
+            <el-option label="安全资料类" value="安全资料类"></el-option>
+            <el-option label="现场检查类" value="现场检查类"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="安全类别名称" prop="name">
+          <el-input
+            v-model="hdEditTypeForm.name"
+            placeholder="请输入安全分类名称"
+          ></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button type="primary" @click="submitHdTypeEdit">提交</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog
+      title="安全检查内容表单"
+      :visible.sync="isShowAddInspectionDialog"
+      width="50%"
+      :close-on-click-modal="false"
+    >
+      <el-form
+        v-if="isShowAddInspectionDialog"
+        ref="hdinspectionaddform"
+        :rules="hdInspectionFormRules"
+        :model="hdInspectionForm"
+        label-width="120px"
+      >
+        <el-form-item label="安全检查内容" prop="name">
+          <el-input
+            v-model="hdInspectionForm.name"
+            placeholder="请输入安全检查内容"
+          ></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button type="primary" @click="submitInspection">提交</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog
+      title="编辑安全检查内容表单"
+      :visible.sync="isShowEditInspectionDialog"
+      width="50%"
+      :close-on-click-modal="false"
+    >
+      <el-form
+        v-if="isShowEditInspectionDialog"
+        ref="hdinspectioneditform"
+        :rules="hdInspectionFormRules"
+        :model="hdInspectionEditForm"
+        label-width="120px"
+      >
+        <el-form-item label="安全检查内容" prop="name">
+          <el-input
+            v-model="hdInspectionEditForm.name"
+            placeholder="请输入安全检查内容"
+          ></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button type="primary" @click="submitHdInspectionForm"
+          >提交</el-button
         >
-          <el-input v-model="editFormInfo.type" maxlength="50"></el-input>
+      </div>
+    </el-dialog>
+    <el-dialog
+      title="添加发现问题表单"
+      :visible.sync="isShowSafetyMatterDialogShow"
+      width="50%"
+      :close-on-click-modal="false"
+    >
+      <el-form
+        v-if="isShowSafetyMatterDialogShow"
+        ref="hdsafetymattaddform"
+        :rules="hdSafetyMatterFormRules"
+        :model="hdSafetyMatterForm"
+        label-width="120px"
+      >
+        <el-form-item label="发现问题" prop="name">
+          <el-input
+            v-model="hdSafetyMatterForm.name"
+            placeholder="请输入发现问题"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="检查依据" prop="basis">
+          <el-input
+            v-model="hdSafetyMatterForm.basis"
+            placeholder="请输入检查依据"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="整改建议" prop="suggestion">
+          <el-input
+            v-model="hdSafetyMatterForm.suggestion"
+            placeholder="请输入整改建议"
+          ></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button type="primary" @click.stop="submitSafetyMatter"
+          >提交</el-button
+        >
+      </div>
+    </el-dialog>
+    <el-dialog
+      title="编辑发现问题表单"
+      :visible.sync="isShowSafetyMatterEditDialogShow"
+      width="50%"
+      :close-on-click-modal="false"
+    >
+      <el-form
+        v-if="isShowSafetyMatterEditDialogShow"
+        ref="hdsafetymatteditform"
+        :rules="hdSafetyMatterFormRules"
+        :model="hdSafetyMatterEditForm"
+        label-width="120px"
+      >
+        <el-form-item label="发现问题" prop="name">
+          <el-input
+            v-model="hdSafetyMatterEditForm.name"
+            placeholder="请输入发现问题"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="检查依据" prop="basis">
+          <el-input
+            v-model="hdSafetyMatterEditForm.basis"
+            placeholder="请输入检查依据"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="整改建议" prop="suggestion">
+          <el-input
+            v-model="hdSafetyMatterEditForm.suggestion"
+            placeholder="请输入整改建议"
+          ></el-input>
         </el-form-item>
       </el-form>
       <div slot="footer">
-        <el-button type="info" @click="cancelEditHdType">取消</el-button>
-        <el-button type="primary" @click="confirmEditHdType">确定</el-button>
+        <el-button
+          type="primary"
+          @click.stop="submitEditSafetyMatter"
+        ></el-button>
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
+import {
+  getEnterpriseSafetyInspectionContent,
+  postEnterpriseSafetyInspectionContent,
+  putEnterpriseSafetyInspectionContent,
+  deleteEnterpriseSafetyInspectionContent,
+  getEnterpriseSafetyMatter,
+  postEnterpriseSafetyMatter,
+  putEnterpriseSafetyMatter,
+  deleteEnterpriseSafetyMatter
+} from "@/api/secFound.js";
 export default {
   data() {
     return {
-      hdTypeTable: [
+      isShowTemplateTableData: false,
+      isShowTemplateDataCheck: false,
+      isShowTemplateSiteManage: false,
+      templateDataCheck: [],
+      templateSiteManage: [],
+      templateData: [],
+      isShowAddTypeDialog: false,
+      hdTypeForm: {
+        level: 1,
+        name: "",
+        type: ""
+      },
+      hdTypeFormRules: {
+        name: [
+          {
+            required: true,
+            message: "请输入安全类别名称",
+            trigger: "blur"
+          }
+        ],
+        type: [
+          {
+            required: true,
+            message: "请选择安全分类",
+            trigger: "change"
+          }
+        ]
+      },
+      hdTypeList: [
         {
-          id: 1,
-          type: '类别1'
+          label: "安全资料类",
+          value: "安全资料类"
         },
         {
-          id: 2,
-          type: '类别2'
+          label: "现场管理类",
+          value: "现场管理类"
         }
       ],
-      multipleSelection: [],
-      isEditHdTypeEnable: true,
-      isDelHdTypeEnable: true,
-      addDialogVisible: false,
-      addFormInfo: {
-        type: ''        
+      isShowEditTypeDialog: false,
+      hdEditTypeForm: {
+        id: -1,
+        level: 1,
+        name: "",
+        type: ""
       },
-      addHdTypeRules: {
-        type: [
+      isShowAddInspectionDialog: false,
+      hdInspectionForm: {
+        level: 2,
+        name: "",
+        pid: -1
+      },
+      hdInspectionFormRules: {
+        name: [
           {
             required: true,
-            message: '请输入隐患类别',
-            trigger: 'blur'
+            message: "请输入检查内容描述",
+            trigger: "blur"
           }
         ]
       },
-      editDialogVisible: false,
-      editFormInfo: {
-        id: -1,
-        type: ''
+      isShowEditInspectionDialog: false,
+      hdInspectionEditForm: {
+        level: 2,
+        name: "",
+        id: -1
       },
-      editHdTypeRules: {
-        type: [
+      isShowSafetyMatterDialogShow: false,
+      hdSafetyMatterForm: {
+        inspectionContentId: -1,
+        name: "",
+        basis: "",
+        suggestion: ""
+      },
+      hdSafetyMatterFormRules: {
+        name: [
+          {
+            required: true,
+            message: "请输入发现问题描述",
+            trigger: "blur"
+          }
+        ],
+        basis: [
+          {
+            required: true,
+            message: "请输入检查依据",
+            trigger: "blur"
+          }
+        ],
+        suggestion: [
           {
             required: true,
-            message: '请输入隐患类别',
-            trigger: 'blur'
+            message: "请输入整改建议",
+            trigger: "blur"
           }
         ]
-      }
+      },
+      isShowSafetyMatterEditDialogShow: false,
+      hdSafetyMatterEditForm: {
+        id: -1,
+        inspectionContentId: -1,
+        basis: "",
+        name: "",
+        suggestion: ""
+      },
+      totalData: {
+        isDataCheckShow: false,
+        datacheck: [
+          {
+            type: "安全生产标准化和双重预防体系",
+            isShow: true,
+            inspectionContent: [
+              {
+                inspectionContentId: -1,
+                inspectionContent: "1、是否建立安全生产标准化, 是否有效运行",
+                isShow: true,
+                matts: [
+                  {
+                    discover: "1.1.1 未建立安全生产标准化",
+                    basis:
+                      "《中华人民共和国安全生产法》第二十一条、《山东省生产经营单位安全生产主题责任规定》第二十六条",
+                    suggestion: "按法规和规定及时建立安全标准化"
+                  },
+                  {
+                    discover: "1.1.2 未有效运行安全标准化",
+                    basis:
+                      "《中华人民共和国安全生产法》第二十一条、《山东省生产经营单位安全生产主题责任规定》第二十六条",
+                    suggestion: "按法规和规定有效运行安全标准化"
+                  }
+                ]
+              }
+            ]
+          }
+        ],
+        isSiteManageShow: false,
+        sitemanage: [
+          {
+            type: "安全生产标准化和双重预防体系",
+            isShow: true,
+            inspectionContent: [
+              {
+                inspectionContent: "1、是否建立安全生产标准化, 是否有效运行",
+                isShow: true,
+                matts: [
+                  {
+                    discover: "1.1.1 未建立安全生产标准化",
+                    basis:
+                      "《中华人民共和国安全生产法》第二十一条、《山东省生产经营单位安全生产主题责任规定》第二十六条",
+                    suggestion: "按法规和规定及时建立安全标准化"
+                  },
+                  {
+                    discover: "1.1.2 未有效运行安全标准化",
+                    basis:
+                      "《中华人民共和国安全生产法》第二十一条、《山东省生产经营单位安全生产主题责任规定》第二十六条",
+                    suggestion: "按法规和规定有效运行安全标准化"
+                  }
+                ]
+              }
+            ]
+          }
+        ]
+      },
+      allTotalGenerateTableData: [],
+      isLoadingTableData: false
+    };
+  },
+  async mounted() {
+    this.initAllTableData();
+    // await this.generateAllTableData();
+    if (window.localStorage.getItem("enterpriseTemplateData")) {
+      this.allTotalGenerateTableData = [
+        ...JSON.parse(window.localStorage.getItem("enterpriseTemplateData"))
+      ];
     }
   },
   methods: {
-    handleSelectionChange(val) {
-      this.multipleSelection = val
-      this.isEditHdTypeEnable = true;
-      this.isDelHdTypeEnable = true;
-      if (this.multipleSelection.length === 1) {
-        this.isEditHdTypeEnable = false
-      }
-      if (this.multipleSelection.length > 0) {
-        this.isDelHdTypeEnable = false
-      }
-    },
-    createHdType() {
-      this.addDialogVisible = true
-    },
-    editHdType() {
-      this.editFormInfo = {...this.multipleSelection[0]}
-      this.editDialogVisible = true
-    },
-    delHdType() {
-      this.$confirm('此操作将删除所选项, 是否继续?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        // axios
-      }).catch(() => {
-        // 取消删除
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
+    arraySpanMethodSync({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex === 0) {
+        if (row.column0hide === false) {
+          return [row.column0Length, 1];
+        } else {
+          return [0, 0];
+        }
+      }
+      if (columnIndex === 1) {
+        if (row.column1hide === false) {
+          return [row.column1Length, 1];
+        } else {
+          return [0, 0];
+        }
+      }
+      if (columnIndex === 2) {
+        if (row.column2hide === false) {
+          return [row.column2Length, 1];
+        } else {
+          return [0, 0];
+        }
+      }
+    },
+    async generateAllTableData() {
+      if (window.localStorage.getItem("enterpriseTemplateData")) {
+        this.allTotalGenerateTableData = [
+          ...JSON.parse(window.localStorage.getItem("enterpriseTemplateData"))
+        ];
+        return;
+      }
+      this.isLoadingTableData = true;
+      const allTableData = [];
+      await getEnterpriseSafetyInspectionContent({
+        level: 1,
+        page: 0,
+        size: 9999
+      }).then(async res => {
+        const level1data = [
+          ...res.content
+            .filter(item => item.type === "安全资料类")
+            .map(item => {
+              return {
+                ...item,
+                totalCategory: "安全资料类",
+                type: item.name
+              };
+            }),
+          ...res.content
+            .filter(item => item.type === "现场检查类")
+            .map(item => {
+              return {
+                ...item,
+                totalCategory: "现场检查类",
+                type: item.name
+              };
+            })
+        ];
+        const parr1 = [];
+        level1data.forEach(item => {
+          let p1 = getEnterpriseSafetyInspectionContent({
+            level: 2,
+            page: 0,
+            size: 9999,
+            pid: item.id
+          }).then(async res1 => {
+            item.secCheckContent = [
+              ...res1.content.map(item => {
+                return {
+                  ...item,
+                  secContent: item.name
+                };
+              })
+            ];
+            const parr2 = [];
+            item.secCheckContent.forEach(item1 => {
+              let p2 = getEnterpriseSafetyMatter({
+                inspectionContentId: item1.id,
+                page: 0,
+                size: 9999
+              }).then(res2 => {
+                item1.matts = [
+                  ...res2.content.map(item3 => {
+                    return {
+                      ...item3,
+                      discover: item3.name
+                    };
+                  })
+                ];
+              });
+              parr2.push(p2);
+            });
+            await Promise.all(parr2);
+          });
+          parr1.push(p1);
+        });
+        await Promise.all(parr1);
+        level1data.forEach(item => {
+          item.secCheckContent.forEach(item1 => {
+            item1.matts.forEach(item2 => {
+              allTableData.push({
+                totalCategory: item.totalCategory,
+                type: item.type,
+                secContent: item1.secContent,
+                discover: item2.discover,
+                basis: item2.basis,
+                suggestion: item2.suggestion
+              });
+            });
+          });
+        });
+        console.log(
+          allTableData,
+          "allTableData allTableData allTableData allTableData allTableData"
+        );
+      });
+      allTableData.forEach(item => {
+        item.column0Length = allTableData.filter(
+          item1 => item1.totalCategory === item.totalCategory
+        ).length;
+        item.column1Length = allTableData.filter(
+          item1 => item1.type === item.type
+        ).length;
+        item.column2Length = allTableData.filter(
+          item1 => item1.secContent === item.secContent
+        ).length;
+      });
+      for (let j = 0; j < allTableData.length; j++) {
+        const item = allTableData[j];
+        const index = j;
+        let hasAppear = false;
+        for (let i = 0; i < index; i++) {
+          if (item.totalCategory === allTableData[i].totalCategory) {
+            hasAppear = true;
+            break;
+          }
+        }
+        item.column0hide = hasAppear;
+      }
+      for (let j = 0; j < allTableData.length; j++) {
+        const item = allTableData[j];
+        const index = j;
+        let hasAppear = false;
+        for (let i = 0; i < index; i++) {
+          if (item.type === allTableData[i].type) {
+            hasAppear = true;
+            break;
+          }
+        }
+        item.column1hide = hasAppear;
+      }
+      for (let j = 0; j < allTableData.length; j++) {
+        const item = allTableData[j];
+        const index = j;
+        let hasAppear = false;
+        for (let i = 0; i < index; i++) {
+          if (item.secContent === allTableData[i].secContent) {
+            hasAppear = true;
+            break;
+          }
+        }
+        item.column2hide = hasAppear;
+      }
+      this.allTotalGenerateTableData = [...allTableData];
+      this.isLoadingTableData = false;
+      window.localStorage.setItem(
+        "enterpriseTemplateData",
+        JSON.stringify(allTableData)
+      );
+    },
+    computePreArrLengthByindexInSiteManage(passindex) {
+      const toComputeArr = this.totalData.sitemanage.filter(
+        (item, index) => index < passindex
+      );
+      if (toComputeArr.length === 0) {
+        return 0;
+      } else {
+        let result = 0;
+        toComputeArr.forEach(datacheck => {
+          datacheck.inspectionContent.forEach(inspection => {
+            result += inspection.matts.length;
+          });
+        });
+        return result;
+      }
+    },
+    computeCurArrLengthByIndexInSiteManage(passIndex) {
+      const toComputeArr = this.totalData.sitemanage.filter((item, index) => {
+        return index === passIndex;
+      });
+      if (toComputeArr.length === 0) {
+        return 0;
+      } else {
+        let result = 0;
+        toComputeArr[0].inspectionContent.forEach(item => {
+          result += item.matts.length;
+        });
+        return result;
+      }
+    },
+    computeCurArrLengthByIndex12InSiteManage(passIndex1, passIndex2) {
+      const toComputeArr = this.totalData.datacheck.filter(
+        (item, index) => index === passIndex1
+      );
+      const toComputeArr2 = toComputeArr[0].inspectionContent.filter(
+        (item, index) => index < passIndex2
+      );
+      if (toComputeArr2.length === 0) {
+        return 0;
+      } else {
+        let result = 0;
+        toComputeArr2.forEach(item => {
+          result += item.matts.length;
+        });
+        return result;
+      }
+    },
+    generateTemplateSiteManage() {
+      this.templateSiteManage = [];
+      let curIndex = 0;
+      this.totalData.sitemanage.forEach((item, index, arr) => {
+        item.inspectionContent.forEach((item1, index1, arr1) => {
+          item1.matts.forEach((item2, index2, arr2) => {
+            this.templateSiteManage.push({
+              totalType: "现场管理类",
+              type: item.type,
+              inspectionContent: item1.inspectionContent,
+              discover: item2.discover,
+              basis: item2.basis,
+              suggestion: item2.suggestion,
+              isHideColumn1:
+                curIndex !== this.computePreArrLengthByindexInSiteManage(index),
+              isHideColumn1Length: this.computeCurArrLengthByIndexInSiteManage(
+                index
+              ),
+              isHideColumn2:
+                curIndex !==
+                this.computeCurArrLengthByIndex12InSiteManage(index, index1) +
+                  this.computePreArrLengthByindexInSiteManage(index),
+              isHideColumn2Length: arr2.length
+            });
+            curIndex++;
+          });
+        });
+      });
+    },
+    computePreArrLengthByindexInDataCheck(passindex) {
+      const toComputeArr = this.totalData.datacheck.filter(
+        (item, index) => index < passindex
+      );
+      if (toComputeArr.length === 0) {
+        return 0;
+      } else {
+        let result = 0;
+        toComputeArr.forEach(datacheck => {
+          datacheck.inspectionContent.forEach(inspection => {
+            result += inspection.matts.length;
+          });
+        });
+        return result;
+      }
+    },
+    computeCurArrLengthByIndexInDataCheck(passIndex) {
+      const toComputeArr = this.totalData.datacheck.filter((item, index) => {
+        return index === passIndex;
+      });
+      if (toComputeArr.length === 0) {
+        return 0;
+      } else {
+        let result = 0;
+        toComputeArr[0].inspectionContent.forEach(item => {
+          result += item.matts.length;
+        });
+        return result;
+      }
+    },
+    computeCurArrLengthByIndex12InDataCheck(passIndex1, passIndex2) {
+      const toComputeArr = this.totalData.datacheck.filter(
+        (item, index) => index === passIndex1
+      );
+      const toComputeArr2 = toComputeArr[0].inspectionContent.filter(
+        (item, index) => index < passIndex2
+      );
+      if (toComputeArr2.length === 0) {
+        return 0;
+      } else {
+        let result = 0;
+        toComputeArr2.forEach(item => {
+          result += item.matts.length;
+        });
+        return result;
+      }
+    },
+    arraySpanMethodDataCheck({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex === 0) {
+        if (row.isHideColumn1) {
+          return [0, 0];
+        } else {
+          return [row.isHideColumn1Length, 1];
+        }
+      }
+      if (columnIndex === 1) {
+        if (row.isHideColumn2) {
+          return [0, 0];
+        } else {
+          return [row.isHideColumn2Length, 1];
+        }
+      }
+    },
+    generateTemplateDataCheck() {
+      this.templateDataCheck = [];
+      let curIndex = 0;
+      this.totalData.datacheck.forEach((item, index, arr) => {
+        item.inspectionContent.forEach((item1, index1, arr1) => {
+          item1.matts.forEach((item2, index2, arr2) => {
+            this.templateDataCheck.push({
+              totalType: "安全资料检查类",
+              type: item.type,
+              inspectionContent: item1.inspectionContent,
+              discover: item2.discover,
+              basis: item2.basis,
+              suggestion: item2.suggestion,
+              isHideColumn1:
+                curIndex !== this.computePreArrLengthByindexInDataCheck(index),
+              isHideColumn1Length: this.computeCurArrLengthByIndexInDataCheck(
+                index
+              ),
+              isHideColumn2:
+                curIndex !==
+                this.computeCurArrLengthByIndex12InDataCheck(index, index1) +
+                  this.computePreArrLengthByindexInDataCheck(index),
+              isHideColumn2Length: arr2.length
+            });
+            curIndex++;
+          });
+        });
+      });
+    },
+    generateTemplateData() {
+      const placeData = [
+        ...this.totalData.datacheck.map(item => {
+          return {
+            ...item,
+            totalType: "安全资料检查类"
+          };
+        }),
+        ...this.totalData.sitemanage.map(item => {
+          return {
+            ...item,
+            totalType: "现场管理类"
+          };
         })
+      ];
+      placeData.forEach;
+      // this.totalData.datacheck.forEach((item, index) => {
+      //   item.inspectionContent.forEach((item1, index1) => {
+      //     item1.matts.forEach((item2, index2) => {
+      //       this.templateData.push({
+      //         totalType: "安全资料检查类",
+      //         type: item.type,
+      //         inspectionContent: item1.inspectionContent,
+      //         discover: item2.discover,
+      //         basis: item2.basis,
+      //         suggestion: item2.suggestion,
+
+      //       });
+      //     });
+      //   });
+      // });
+    },
+    async initAllTableData() {
+      this.totalData = {
+        isDataCheckShow: false,
+        isSiteManageShow: false,
+        datacheck: [],
+        sitemanage: []
+      };
+      await getEnterpriseSafetyInspectionContent({
+        level: 1,
+        page: 0,
+        size: 9999
+      }).then(res => {
+        this.totalData.datacheck = [
+          ...res.content
+            .filter(item => item.type === "安全资料类")
+            .map(item => {
+              return {
+                ...item,
+                type: item.name,
+                isShow: false,
+                inspectionContent: []
+              };
+            })
+        ];
+        this.totalData.datacheck.forEach(item1 => {
+          getEnterpriseSafetyInspectionContent({
+            level: 2,
+            page: 0,
+            size: 9999,
+            pid: item1.id
+          }).then(res1 => {
+            item1.inspectionContent = res1.content.map(item2 => {
+              return {
+                ...item2,
+                inspectionContentId: item2.id,
+                inspectionContent: item2.name,
+                isShow: false,
+                matts: []
+              };
+            });
+            item1.inspectionContent.forEach(item3 => {
+              getEnterpriseSafetyMatter({
+                inspectionContentId: item3.id,
+                page: 0,
+                size: 9999
+              }).then(res3 => {
+                item3.matts = [
+                  ...res3.content.map(item4 => {
+                    return {
+                      ...item4,
+                      discover: item4.name,
+                      basis: item4.basis,
+                      suggestion: item4.suggestion
+                    };
+                  })
+                ];
+              });
+            });
+          });
+        });
+        this.totalData.sitemanage = [
+          ...res.content
+            .filter(item => item.type === "现场检查类")
+            .map(item => {
+              return {
+                ...item,
+                type: item.name,
+                isShow: false,
+                inspectionContent: []
+              };
+            })
+        ];
+        this.totalData.sitemanage.forEach(item1 => {
+          getEnterpriseSafetyInspectionContent({
+            level: 2,
+            page: 0,
+            size: 9999,
+            pid: item1.id
+          }).then(res1 => {
+            item1.inspectionContent = res1.content.map(item2 => {
+              return {
+                ...item2,
+                inspectionContentId: item2.id,
+                inspectionContent: item2.name,
+                isShow: false,
+                matts: []
+              };
+            });
+            item1.inspectionContent.forEach(item3 => {
+              getEnterpriseSafetyMatter({
+                inspectionContentId: item3.id,
+                page: 0,
+                size: 9999
+              }).then(res3 => {
+                item3.matts = [
+                  ...res3.content.map(item4 => {
+                    return {
+                      ...item4,
+                      discover: item4.name,
+                      basis: item4.basis,
+                      suggestion: item4.suggestion
+                    };
+                  })
+                ];
+              });
+            });
+          });
+        });
+      });
+    },
+    async initThreeLayerDataByType(tableData, type) {},
+    addHdTypeDialogShow() {
+      this.isShowAddTypeDialog = true;
+      this.hdTypeForm = {
+        level: 1,
+        name: "",
+        type: ""
+      };
+    },
+    submitSecType() {
+      this.$refs.hdtypeaddform.validate(valid => {
+        if (valid) {
+          postEnterpriseSafetyInspectionContent({ ...this.hdTypeForm }).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "添加安全类别成功"
+              });
+              this.initAllTableData();
+              this.isShowAddTypeDialog = false;
+              window.localStorage.removeItem("enterpriseTemplateData");
+            },
+            () => {
+              this.$message.error("添加安全类别失败");
+            }
+          );
+        }
+      });
+    },
+    editHdTypeDialogShow(item, totaltype) {
+      this.isShowEditTypeDialog = true;
+      this.hdEditTypeForm = {
+        id: item.id,
+        level: 1,
+        name: item.type,
+        type: totaltype
+      };
+    },
+    submitHdTypeEdit() {
+      this.$refs.hdtypeeditform.validate(valid => {
+        if (valid) {
+          putEnterpriseSafetyInspectionContent(this.hdEditTypeForm).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "修改成功"
+              });
+              this.initAllTableData();
+              this.isShowEditTypeDialog = false;
+              window.localStorage.removeItem("enterpriseTemplateData");
+            },
+            () => {
+              this.$message.error("修改失败");
+            }
+          );
+        }
+      });
+    },
+    deleteHdType(item) {
+      this.$confirm("此操作将永久删除该安全类别, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          deleteEnterpriseSafetyInspectionContent([
+            {
+              id: item.id,
+              level: 1
+            }
+          ]).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+              this.initAllTableData();
+              window.localStorage.removeItem("enterpriseTemplateData");
+            },
+            () => {
+              this.$message.error("修改失败");
+            }
+          );
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
-    cancelAddHdType() {
-      this.addDialogVisible = false
+    addHdInspectionDialogShow(item) {
+      this.isShowAddInspectionDialog = true;
+      this.hdInspectionForm = {
+        level: 2,
+        name: "",
+        pid: item.id
+      };
     },
-    confirmAddHdType() {
-      this.$refs.addform.validate((valid) => {
+    submitInspection() {
+      this.$refs.hdinspectionaddform.validate(valid => {
         if (valid) {
-          // axios
+          postEnterpriseSafetyInspectionContent(this.hdInspectionForm).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "添加检查内容成功"
+              });
+              this.initAllTableData();
+              this.isShowAddInspectionDialog = false;
+              window.localStorage.removeItem("enterpriseTemplateData");
+            },
+            () => {
+              this.$message.error("添加检查内容失败");
+            }
+          );
         }
+      });
+    },
+    editInspectionDialogShow(item, inspection) {
+      this.isShowEditInspectionDialog = true;
+      this.hdInspectionEditForm = {
+        level: 2,
+        name: inspection.inspectionContent,
+        id: inspection.id
+      };
+    },
+    submitHdInspectionForm() {
+      this.$refs.hdinspectioneditform.validate(valid => {
+        if (valid) {
+          putEnterpriseSafetyInspectionContent(this.hdInspectionEditForm).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "修改安全检查内容成功"
+              });
+              this.initAllTableData();
+              this.isShowEditInspectionDialog = false;
+              window.localStorage.removeItem("enterpriseTemplateData");
+            },
+            () => {
+              this.$message.error("修改安全检查内容失败");
+            }
+          );
+        }
+      });
+    },
+    deleteInspection(inspection) {
+      this.$confirm("此操作将永久删除该安全类别, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
-      // validate form
-      // this.addDialogVisible = false
+        .then(() => {
+          deleteEnterpriseSafetyInspectionContent([
+            {
+              id: inspection.id,
+              level: 2
+            }
+          ]).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+              this.initAllTableData();
+              window.localStorage.removeItem("enterpriseTemplateData");
+            },
+            () => {
+              this.$message.error("修改失败");
+            }
+          );
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
-    cancelEditHdType() {
-      this.editDialogVisible = false
+    safetyMatterDialogShow(inspection) {
+      this.hdSafetyMatterForm.inspectionContentId = inspection.id;
+      this.hdSafetyMatterForm.name = "";
+      this.hdSafetyMatterForm.basis = "";
+      this.hdSafetyMatterForm.suggestion = "";
+      this.isShowSafetyMatterDialogShow = true;
+    },
+    submitSafetyMatter() {
+      this.$refs.hdsafetymattaddform.validate(valid => {
+        if (valid) {
+          postEnterpriseSafetyMatter(this.hdSafetyMatterForm).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.initAllTableData();
+              this.isShowSafetyMatterDialogShow = false;
+              window.localStorage.removeItem("enterpriseTemplateData");
+            },
+            () => {
+              this.$message.error("添加失败");
+            }
+          );
+        }
+      });
     },
-    confirmEditHdType() {
-      this.$refs.editform.validate((valid) => {
+    submitEditSafetyMatter() {
+      this.$refs.hdsafetymatteditform.validate(valid => {
         if (valid) {
-          // axios
+          putEnterpriseSafetyMatter(this.hdSafetyMatterEditForm).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "修改成功"
+              });
+              this.initAllTableData();
+              this.isShowSafetyMatterEditDialogShow = false;
+              window.localStorage.removeItem("enterpriseTemplateData");
+            },
+            () => {
+              this.$message.error("修改失败");
+            }
+          );
         }
+      });
+    },
+    editSafetyMatterDialogShow(inspection, matt) {
+      this.isShowSafetyMatterEditDialogShow = true;
+      this.hdSafetyMatterEditForm = {
+        id: matt.id,
+        inspection: inspection.inspectionContentId,
+        name: matt.discover,
+        basis: matt.basis,
+        suggestion: matt.suggestion
+      };
+    },
+    deleteSafetyMatterDialogShow(matt) {
+      this.$confirm("此操作将永久删除安全检查类别, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning "
       })
-      // validate form
-      // this.editDialogVisible = false
+        .then(() => {
+          deleteEnterpriseSafetyMatter([matt.id])
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+              this.initAllTableData();
+              window.localStorage.removeItem("enterpriseTemplateData");
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
+.triangle-wrapper {
+  position: relative;
+  .show-triangle {
+    border-top: 15px solid black;
+    border-left: 10px solid transparent;
+    border-right: 10px solid transparent;
+    width: 0;
+    height: 0;
+    border-radius: 3px;
+  }
+  .hide-triangle {
+    border-top: 10px solid transparent;
+    border-bottom: 10px solid transparent;
+    border-left: 15px solid black;
+    width: 0;
+    height: 0;
+    border-radius: 3px;
+  }
+}
+.hd-info-wrapper {
+  .hd-type-add-wrapper {
+    margin: 10px 10px;
+    padding: 5px;
+    border-radius: 5px;
+    background: #fff;
+  }
   .hd-type-wrapper {
-    width: 80%;
-    border-radius: 30px;
-    margin: 30px auto;
-    padding: 30px;
-    box-shadow: 0 0 9px 1px #eee;
     .hd-type-tools-wrapper {
-      width: 80%;
-      margin: 30px auto;
-      padding: 10px;
       display: flex;
-      flex-direction: row;
-      box-shadow: 0 0 9px 1px #eee;
-      border-radius: 10px;
+      justify-content: space-between;
+      padding: 5px;
+      padding-left: 10px;
+      background: #fff;
+      margin: 10px 10px;
+      .hd-type-triangle-name-wrapper {
+        display: flex;
+        align-items: center;
+        .hd-type-name {
+          margin-left: 20px;
+        }
+      }
+      .hd-type-tool-wrapper {
+      }
     }
-    .hd-type-table-wrapper {
-      width: 80%;
-      margin: 30px auto;
-      padding: 10px;
-      box-shadow: 0 0 9px 1px #eee;
-      border-radius: 10px;
+    .hd-type-tools-down {
+      .hd-inspection-add-wrapper {
+        margin: 10px 10px;
+        background: #fff;
+        padding: 5px;
+        border-radius: 5px;
+        padding-left: 40px;
+      }
+      .hd-inspection-item-total-wrapper {
+        .hd-inspection-item-wrapper {
+          display: flex;
+          justify-content: space-between;
+          margin: 10px 10px;
+          background: #fff;
+          padding: 5px;
+          border-radius: 5px;
+          padding-left: 40px;
+          .hd-inspection-triangle-wrapper {
+            display: flex;
+            align-items: center;
+            .hd-inspection-content {
+              margin-left: 10px;
+            }
+          }
+          .hd-inspection-tools-wrapper {
+            display: flex;
+          }
+        }
+        .hd-discover-add-wrapper {
+          margin: 10px 10px;
+          padding: 5px;
+          border-radius: 5px;
+          background: #fff;
+          padding-left: 80px;
+        }
+        .hd-discover-wrapper {
+          margin: 10px 10px;
+          padding: 5px;
+          border-radius: 5px;
+          background: #fff;
+          padding-left: 80px;
+          display: flex;
+          justify-content: space-between;
+          .matt-left {
+            .matt-left-discover {
+              padding: 8px;
+              .matt-left-title {
+                font-size: 18px;
+                font-weight: bold;
+              }
+              .matt-left-content {
+                font-size: 16px;
+              }
+            }
+            .matt-left-basis {
+              padding: 8px;
+              .matt-left-title {
+                font-size: 18px;
+                font-weight: bold;
+              }
+              .matt-left-content {
+                font-size: 16px;
+              }
+            }
+            .matt-left-suggestion {
+              padding: 8px;
+              .matt-left-title {
+                font-size: 18px;
+                font-weight: bold;
+              }
+              .matt-left-content {
+                font-size: 16px;
+              }
+            }
+          }
+          .matt-right {
+          }
+        }
+      }
     }
   }
-</style>
+}
\ No newline at end of file
+</style>
+<style>
+.main-container {
+  background: #f5f6fb;
+}
+</style>

src/views/entercertifies/enterceritifies.vue

@@ -95,6 +95,9 @@
               <el-button type="primary" @click="downloadCertify(scope.row)"
                 >下载</el-button
               >
+              <el-button type="danger" @click="deleteCertify(scope.row)"
+                >删除</el-button
+              >
             </template>
           </el-table-column>
         </el-table>
@@ -137,6 +140,9 @@
               <el-button type="primary" @click="downloadCertify(scope.row)"
                 >下载</el-button
               >
+              <el-button type="danger" @click="deleteCertify(scope.row)"
+                >删除</el-button
+              >
             </template>
           </el-table-column>
         </el-table>
@@ -179,6 +185,9 @@
               <el-button type="primary" @click="downloadCertify(scope.row)"
                 >下载</el-button
               >
+              <el-button type="danger" @click="deleteCertify(scope.row)"
+                >删除</el-button
+              >
             </template>
           </el-table-column>
         </el-table>
@@ -279,12 +288,16 @@
 
 <script>
 import pdf from "vue-pdf";
-import { enterCertifies, postCertify } from "@/api/certify.js";
+import {
+  enterCertifies,
+  postCertify,
+  deleteEnterCertify
+} from "@/api/certify.js";
 // {y}-{m}-{d} {h}:{i}:{s}
 import { parseTime } from "@/utils/index.js";
 export default {
   components: {
-    pdf,
+    pdf
   },
   data() {
     return {
@@ -295,22 +308,22 @@ export default {
           uploadDate: "2021-01-11 12:36:25",
           validDate: "2021-10-10 12:36:25",
           filepath:
-            "https://8.143.198.78/certify1/威海大庆特种材料制作有限公司-双体系.pdf",
+            "https://8.143.198.78/certify1/威海大庆特种材料制作有限公司-双体系.pdf"
         },
         {
           name: "安全生产标准化证书02",
           uploadDate: "2021-01-13 12:11:25",
           validDate: "2021-10-09 12:45:11",
           filepath:
-            "https://8.143.198.78/certify1/威海大宇电子有限公司-双体系.jpg",
+            "https://8.143.198.78/certify1/威海大宇电子有限公司-双体系.jpg"
         },
         {
           name: "安全生产标准化证书03",
           uploadDate: "2021-01-15 12:25:23",
           validDate: "2021-08-09 12:23:00",
           filepath:
-            "https://8.143.198.78/certify1/威海海马地毯集团有限公司-双体系2.pdf",
-        },
+            "https://8.143.198.78/certify1/威海海马地毯集团有限公司-双体系2.pdf"
+        }
       ],
       dualsystemTableData: [
         {
@@ -318,22 +331,22 @@ export default {
           uploadDate: "2021-01-11 12:36:25",
           validDate: "2021-10-10 12:36:25",
           filepath:
-            "https://8.143.198.78/certify1/威海大庆特种材料制作有限公司-双体系.pdf",
+            "https://8.143.198.78/certify1/威海大庆特种材料制作有限公司-双体系.pdf"
         },
         {
           name: "安全生产标准化证书02",
           uploadDate: "2021-01-13 12:11:25",
           validDate: "2021-10-09 12:45:11",
           filepath:
-            "https://8.143.198.78/certify1/威海大宇电子有限公司-双体系.jpg",
+            "https://8.143.198.78/certify1/威海大宇电子有限公司-双体系.jpg"
         },
         {
           name: "安全生产标准化证书03",
           uploadDate: "2021-01-15 12:25:23",
           validDate: "2021-08-09 12:23:00",
           filepath:
-            "https://8.143.198.78/certify1/威海海马地毯集团有限公司-双体系2.pdf",
-        },
+            "https://8.143.198.78/certify1/威海海马地毯集团有限公司-双体系2.pdf"
+        }
       ],
       standardizationTableData: [
         {
@@ -341,22 +354,22 @@ export default {
           uploadDate: "2021-01-11 12:36:25",
           validDate: "2021-10-10 12:36:25",
           filepath:
-            "https://8.143.198.78/certify1/威海大庆特种材料制作有限公司-双体系.pdf",
+            "https://8.143.198.78/certify1/威海大庆特种材料制作有限公司-双体系.pdf"
         },
         {
           name: "安全生产标准化证书02",
           uploadDate: "2021-01-13 12:11:25",
           validDate: "2021-10-09 12:45:11",
           filepath:
-            "https://8.143.198.78/certify1/威海大宇电子有限公司-双体系.jpg",
+            "https://8.143.198.78/certify1/威海大宇电子有限公司-双体系.jpg"
         },
         {
           name: "安全生产标准化证书03",
           uploadDate: "2021-01-15 12:25:23",
           validDate: "2021-08-09 12:23:00",
           filepath:
-            "https://8.143.198.78/certify1/威海海马地毯集团有限公司-双体系2.pdf",
-        },
+            "https://8.143.198.78/certify1/威海海马地毯集团有限公司-双体系2.pdf"
+        }
       ],
       // 显示应急
       isShowEmergency: false,
@@ -370,7 +383,7 @@ export default {
         uploadTime: "",
         type: "双体系证书",
         validTime: "",
-        file: null,
+        file: null
       },
       uploadFilePath: "",
       uploadFormRules: {
@@ -378,37 +391,30 @@ export default {
           {
             required: true,
             message: "请输入证书名称",
-            trigger: "blur",
-          },
+            trigger: "blur"
+          }
         ],
         type: [
           {
             required: true,
             message: "请输入证书类型",
-            trigger: "change",
-          },
+            trigger: "change"
+          }
         ],
         uploadTime: [
           {
             required: true,
             message: "请输入上传日期",
-            trigger: "change",
-          },
-        ],
-        validTime: [
-          {
-            required: true,
-            message: "请输入有效日期",
-            trigger: "change",
-          },
+            trigger: "change"
+          }
         ],
         file: [
           {
             required: true,
             message: "请选择有效格式的文件(pdf、jpg、jpeg、png、gif)",
-            trigger: "change",
-          },
-        ],
+            trigger: "change"
+          }
+        ]
       },
       certifyShow: false,
       curCertifyFilePath: "",
@@ -418,35 +424,35 @@ export default {
       options: [
         {
           label: "双体系证书",
-          value: "双体系证书",
+          value: "双体系证书"
         },
         {
           label: "应急预案",
-          value: "应急预案",
+          value: "应急预案"
         },
         {
           label: "标准化",
-          value: "标准化",
-        },
+          value: "标准化"
+        }
       ],
       certifyTypes: [
         {
           label: "双体系证书",
-          value: "双体系证书",
+          value: "双体系证书"
         },
         {
           label: "应急预案",
-          value: "应急预案",
+          value: "应急预案"
         },
         {
           label: "标准化",
-          value: "标准化",
-        },
+          value: "标准化"
+        }
       ],
       certifyType: "",
       certifyName: "",
       uploadTime: "",
-      validTime: "",
+      validTime: ""
     };
   },
   mounted() {
@@ -459,7 +465,7 @@ export default {
         return true;
       }
       return false;
-    },
+    }
   },
   methods: {
     initMethod() {
@@ -470,48 +476,48 @@ export default {
     initCertify(category) {
       let params = {
         companyId: this.curCompanyId,
-        category: category,
+        category: category
       };
-      enterCertifies(params).then((res) => {
+      enterCertifies(params).then(res => {
         console.log(res, category, "enterCertifies enterCertifies");
         if (category === "双体系证书") {
           this.dualsystemTableData = [
-            ...res.content.map((item) => {
+            ...res.content.map(item => {
               return {
                 name: item.name,
                 uploadDate: item.uploadDate,
                 validDate: item.expirationDate,
                 filepath: item.filePath,
                 id: item.id,
-                category: item.category,
+                category: item.category
               };
-            }),
+            })
           ];
         } else if (category === "应急预案") {
           this.emergencyplanTableData = [
-            ...res.content.map((item) => {
+            ...res.content.map(item => {
               return {
                 name: item.name,
                 uploadDate: item.uploadDate,
                 validDate: item.expirationDate,
                 filepath: item.filePath,
                 id: item.id,
-                category: item.category,
+                category: item.category
               };
-            }),
+            })
           ];
         } else if (category === "标准化") {
           this.standardizationTableData = [
-            ...res.content.map((item) => {
+            ...res.content.map(item => {
               return {
                 name: item.name,
                 uploadDate: item.uploadDate,
                 validDate: item.expirationDate,
                 filepath: item.filePath,
                 id: item.id,
-                category: item.category,
+                category: item.category
               };
-            }),
+            })
           ];
         }
       });
@@ -543,14 +549,14 @@ export default {
         uploadTime: "",
         type: "双体系证书",
         validTime: "",
-        file: null,
+        file: null
       };
     },
     cancelUploadFile() {
       this.uploadDialogShow = false;
     },
     submitUploadFile() {
-      this.$refs.uploadform.validate((valid) => {
+      this.$refs.uploadform.validate(valid => {
         if (valid) {
           this.isUploading = true;
           let params = {
@@ -565,17 +571,20 @@ export default {
             uploadDate: parseTime(
               new Date(this.uploadFormInfo.uploadTime),
               "{y}-{m}-{d}"
-            ),
+            )
           };
+          if (this.uploadFormInfo.validTime === "") {
+            delete params.expirationDate;
+          }
           let formData = new FormData();
           for (const key in params) {
             formData.append(key, params[key]);
           }
           postCertify(formData)
-            .then((res) => {
+            .then(res => {
               this.$message({
                 type: "success",
-                message: "添加证书成功",
+                message: "添加证书成功"
               });
               this.uploadDialogShow = false;
               this.isUploading = false;
@@ -597,7 +606,7 @@ export default {
       this.curCertifyFilePath = this.curCertifyFilePath.substring(index3);
       if (this.curCertifyFilePath.endsWith(".pdf")) {
         this.loadingTask = pdf.createLoadingTask(this.curCertifyFilePath);
-        this.loadingTask.promise.then((pdf) => {
+        this.loadingTask.promise.then(pdf => {
           this.pdfNumPage = pdf.numPages;
         });
       }
@@ -619,6 +628,34 @@ export default {
       link.remove();
       window.URL.revokeObjectURL(link.href);
     },
+    deleteCertify(row) {
+      console.log(row, "deleteCertify deleteCertify deleteCertify");
+      // deleteCertify
+      this.$confirm("此操作将永久删除该证书, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          deleteEnterCertify([row.id])
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "删除成功!"
+              });
+              this.initMethod();
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
+    },
     findCertifies() {
       let params = {};
       params.companyId = this.curCompanyId;
@@ -652,51 +689,51 @@ export default {
           "{y}-{m}-{d}"
         );
       }
-      enterCertifies(params).then((res) => {
+      enterCertifies(params).then(res => {
         console.log(res, "certifyEnters certifyEnters");
         if (this.certifyType === "双体系证书") {
           this.dualsystemTableData = [
-            ...res.content.map((item) => {
+            ...res.content.map(item => {
               return {
                 name: item.name,
                 uploadDate: item.uploadDate,
                 validDate: item.expirationDate,
                 filepath: item.filePath,
                 id: item.id,
-                category: item.category,
+                category: item.category
               };
-            }),
+            })
           ];
         } else if (this.certifyType === "应急预案") {
           this.emergencyplanTableData = [
-            ...res.content.map((item) => {
+            ...res.content.map(item => {
               return {
                 name: item.name,
                 uploadDate: item.uploadDate,
                 validDate: item.expirationDate,
                 filepath: item.filePath,
                 id: item.id,
-                category: item.category,
+                category: item.category
               };
-            }),
+            })
           ];
         } else if (this.certifyType === "标准化") {
           this.standardizationTableData = [
-            ...res.content.map((item) => {
+            ...res.content.map(item => {
               return {
                 name: item.name,
                 uploadDate: item.uploadDate,
                 validDate: item.expirationDate,
                 filepath: item.filePath,
                 id: item.id,
-                category: item.category,
+                category: item.category
               };
-            }),
+            })
           ];
         }
       });
-    },
-  },
+    }
+  }
 };
 </script>
 
@@ -736,25 +773,20 @@ export default {
   cursor: pointer;
 }
 .entercertifies-total-wrapper {
-  width: 80%;
-  margin: 30px auto;
-  padding: 30px;
-  border-radius: 30px;
-  box-shadow: 0 0 9px 1px #eee;
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
   .certify-find-tools-wrapper {
     display: flex;
-    width: 80%;
-    margin: 30px auto;
-    padding: 20px;
-    border-radius: 20px;
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    background: #fff;
     flex-wrap: wrap;
-    box-shadow: 0 0 9px 1px #eee;
     .certify-find-item {
-      width: 80%;
-      margin: 10px auto;
+      margin: 10px 10px;
       padding: 10px;
-      border-radius: 10px;
-      box-shadow: 0 0 5px 1px #eee;
+      border-radius: 5px;
       display: flex;
       justify-content: flex-start;
       align-items: center;
@@ -766,27 +798,24 @@ export default {
       }
     }
     .certify-find-btn {
-      width: 80%;
-      margin: 10px auto;
-      padding: 2px;
+      margin: 10px 10px;
+      padding: 10px;
       display: flex;
       justify-content: flex-end;
       align-items: center;
     }
   }
   .tools-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    padding: 20px;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    background: #fff;
   }
   .emergencyplan-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    padding: 30px;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    background: #fff;
     .emergencyplan-title {
       display: flex;
       justify-content: space-between;
@@ -802,11 +831,10 @@ export default {
     }
   }
   .dualsystem-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    padding: 30px;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    background: #fff;
     .dualsystem-title {
       display: flex;
       justify-content: space-between;
@@ -822,11 +850,10 @@ export default {
     }
   }
   .standardization-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    padding: 30px;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    background: #fff;
     .standardization-title {
       display: flex;
       justify-content: space-between;
@@ -887,4 +914,4 @@ export default {
     }
   }
 }
-</style>
+</style>
\ No newline at end of file

src/views/entercertifies/index.vue

@@ -60,45 +60,45 @@ export default {
           companyId: 71522,
           emergencyPlan: 20,
           dualSystem: 10,
-          standardization: 10,
+          standardization: 10
         },
         {
           companyName: "中国石油天然气股份有限公司山东威海销售分公司",
           companyId: 71520,
           emergencyPlan: 20,
           dualSystem: 10,
-          standardization: 10,
+          standardization: 10
         },
         {
           companyName: "威海经济技术开发区洪氏家居生活馆",
           companyId: 71519,
           emergencyPlan: 15,
           dualSystem: 12,
-          standardization: 11,
+          standardization: 11
         },
         {
           companyName: "威海市教育局经济技术开发区教育服务中心",
           companyId: 71517,
           emergencyPlan: 8,
           dualSystem: 3,
-          standardization: 1,
-        },
+          standardization: 1
+        }
       ],
       currentPage: 1,
       currentPageSize: 10,
-      totalElements: 10,
+      totalElements: 10
     };
   },
   methods: {
     initMethod() {
       let params = {
         page: this.currentPage - 1,
-        size: this.currentPageSize,
+        size: this.currentPageSize
       };
       if (this.searchEnterName) {
         params.enterpriseName = this.searchEnterName;
       }
-      certifyEnters(params).then((res) => {
+      certifyEnters(params).then(res => {
         console.log(res.totalElements);
         /**
          * {
@@ -110,15 +110,15 @@ export default {
         }
          */
         this.enterCertifyList = [
-          ...res.content.map((item) => {
+          ...res.content.map(item => {
             return {
               companyName: item.enterpriseName,
               companyId: item.enterpriseId,
               emergencyPlan: item.emergencyPlanNum,
               dualSystem: item.dualSystemNum,
-              standardization: item.standardizationNum,
+              standardization: item.standardizationNum
             };
-          }),
+          })
         ];
         this.totalElements = res.totalElements;
       });
@@ -145,37 +145,33 @@ export default {
     },
     searchEnters() {
       this.initMethod();
-    },
+    }
   },
   mounted() {
     this.initMethod();
-  },
+  }
 };
 </script>
 
 <style lang="scss" scoped>
 .enter-safe-manage-wrapper {
-  width: 80%;
-  margin: 30px auto;
-  border-radius: 30px;
-  padding: 30px;
-  box-shadow: 0 0 9px 1px #eee;
+  margin: 10px 10px;
+  border-radius: 5px;
+  padding: 10px;
   .enter-safe-tools-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    border-radius: 20px;
-    padding: 20px;
-    box-shadow: 0 0 9px 1px #eee;
+    margin: 10px 10px;
+    border-radius: 5px;
+    padding: 10px;
     display: flex;
     align-items: center;
     justify-content: flex-start;
+    background: #fff;
   }
   .enter-safe-enter-list-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    border-radius: 20px;
-    padding: 20px;
-    box-shadow: 0 0 9px 1px #eee;
+    margin: 10px 10px;
+    border-radius: 5px;
+    padding: 10px;
+    background: #fff;
   }
 }
-</style>
+</style>
\ No newline at end of file

src/views/exam/index.vue

@@ -3,13 +3,12 @@
     <el-tabs v-model="activeName">
       <el-tab-pane label="题库管理" name="题库管理">
         <div class="add-question-bank-wrapper">
-          <el-button type="primary" @click="addQuestionBank">添加题库</el-button>
+          <el-button type="primary" @click="addQuestionBank"
+            >添加题库</el-button
+          >
         </div>
         <div class="tools-search-question-bank-wrapper">
-          <el-select
-            v-model="searchType"
-            placeholder="所属分类"
-          >
+          <el-select v-model="searchType" placeholder="所属分类">
             <el-option
               v-for="item in questionTypeOption"
               :key="item.value"
@@ -17,40 +16,48 @@
               :value="item.value"
             />
           </el-select>
-          <el-input v-model="inputSearchName" style="width: 480px;margin-left: 20px;" placeholder="请输入名称" />
-          <el-button style="margin-left: 20px;" type="success">搜索</el-button>
+          <el-input
+            v-model="inputSearchName"
+            style="width: 480px;margin-left: 20px;"
+            placeholder="请输入名称"
+          />
+          <el-button
+            style="margin-left: 20px;"
+            type="success"
+            @click="initExamLibrary"
+            >搜索</el-button
+          >
         </div>
         <div class="table-wrapper">
-          <el-table
-            :data="tableData"
-          >
-            <el-table-column
-              prop="title"
-              label="名称"
-            />
-            <el-table-column
-              label="包含内容"
-            >
-              <template
-                slot-scope="scope"
-              >
-                <div>试卷:&nbsp;{{ scope.row.testerSum }}&nbsp;&nbsp;题目: {{ scope.row.subjectSum }}</div>
+          <el-table :data="tableData">
+            <el-table-column prop="title" label="名称" />
+            <el-table-column label="包含内容">
+              <template slot-scope="scope">
+                <div>
+                  试卷:&nbsp;{{ scope.row.testerSum }}&nbsp;&nbsp;题目:
+                  {{ scope.row.subjectSum }}
+                </div>
               </template>
             </el-table-column>
-            <el-table-column
-              label="分类"
-              prop="type"
-            />
-            <el-table-column
-              label="操作"
-            >
+            <el-table-column label="分类" prop="type" />
+            <el-table-column label="操作">
               <template slot-scope="scope">
                 <el-button @click="jumpToManage(scope.row)">管理</el-button>
                 <el-button @click="showEditDialog(scope.row)">编辑</el-button>
-                <el-button @click="deleteEditDialog">删除</el-button>
+                <el-button @click="deleteEditDialog(scope.row)">删除</el-button>
               </template>
             </el-table-column>
           </el-table>
+          <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="currentPage"
+            :page-sizes="[10, 20, 30, 40]"
+            :page-size="curPageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="totalElements"
+          >
+          </el-pagination>
         </div>
       </el-tab-pane>
       <el-tab-pane label="题库分类管理" name="题库分类管理">
@@ -58,37 +65,81 @@
           <el-button type="primary" @click="addTypeDialog">添加分类</el-button>
         </div>
         <div class="edit-type-table-wrapper">
-          <el-table
-            :data="tableTypeData"
-          >
-            <el-table-column
-              prop="title"
-              label="名称"
-            />
-            <!-- <el-table-column
-              label="包含内容"
-            >
+          <el-table :data="tableTypeData">
+            <el-table-column prop="title" label="名称" />
+            <el-table-column label="操作">
               <template slot-scope="scope">
-                <div>题库:&nbsp;{{ scope.row.questionSum }}</div>
-              </template>
-            </el-table-column> -->
-            <el-table-column
-              label="操作"
-            >
-              <template slot-scope="scope">
-                <el-button type="warning" @click="showEditTypeDialog(scope.row)">编辑</el-button>
-                <el-button type="danger" @click="deleteType(scope.row)">删除</el-button>
+                <el-button type="warning" @click="showEditTypeDialog(scope.row)"
+                  >编辑</el-button
+                >
+                <el-button type="danger" @click="deleteType(scope.row)"
+                  >删除</el-button
+                >
               </template>
             </el-table-column>
           </el-table>
         </div>
       </el-tab-pane>
-      <el-tab-pane label="试卷管理" name="试卷管理" />
+      <el-tab-pane label="试卷管理" name="试卷管理">
+        <div class="pager-total-wrapper">
+          <div class="pager-form-wrapper">
+            <el-button type="primary" @click="navigateToMakeTester"
+              >手动组卷</el-button
+            >
+            <el-button type="primary" @click="navigateToMakeTesterAuto"
+              >智能组卷</el-button
+            >
+          </div>
+          <div class="pager-tools-wrapper">
+            <el-input
+              placeholder="关键字"
+              :style="{ width: '50%' }"
+              v-model="searchPaperKeyWord"
+            ></el-input>
+            <el-button
+              type="primary"
+              style="margin-left: 40px;"
+              @click="initPaper"
+              >搜索</el-button
+            >
+          </div>
+          <div class="pager-table-wrapper">
+            <el-table :data="paperTableData">
+              <el-table-column prop="name" label="名称"></el-table-column>
+              <el-table-column
+                prop="status"
+                label="状态"
+                width="80"
+              ></el-table-column>
+              <el-table-column label="操作">
+                <template slot-scope="scope">
+                  <el-button type="info" @click="closePaper(scope.row)"
+                    >关闭试卷</el-button
+                  >
+                  <el-button type="primary" @click="publishPaper(scope.row)"
+                    >发布试卷</el-button
+                  >
+                  <el-button type="danger" @click="deletePublish(scope.row)"
+                    >删除试卷</el-button
+                  >
+                </template>
+              </el-table-column>
+            </el-table>
+            <el-pagination
+              @size-change="handlePagerSizeChange"
+              @current-change="handlePagerCurrentChange"
+              :current-page="currentPagerPage"
+              :page-sizes="[10, 20, 30, 40]"
+              :page-size="curPagerPageSize"
+              layout="total, sizes, prev, pager, next, jumper"
+              :total="totalPagerElements"
+            >
+            </el-pagination>
+          </div>
+        </div>
+      </el-tab-pane>
     </el-tabs>
-    <el-dialog
-      title="创建题库"
-      :visible.sync="addFormDialogShow"
-    >
+    <el-dialog title="创建题库" :visible.sync="addFormDialogShow">
       <el-form
         v-if="addFormDialogShow"
         ref="addform"
@@ -100,10 +151,7 @@
           <el-input v-model="formInfo.title" />
         </el-form-item>
         <el-form-item label="分类" prop="type">
-          <el-select
-            v-model="formInfo.type"
-            placeholder="所属分类"
-          >
+          <el-select v-model="formInfo.type" placeholder="所属分类">
             <el-option
               v-for="item in questionTypeOption"
               :key="item.value"
@@ -114,15 +162,15 @@
         </el-form-item>
       </el-form>
       <div slot="footer">
-        <el-button type="info" @click="addFormDialogShow = false">取消</el-button>
+        <el-button type="info" @click="addFormDialogShow = false"
+          >取消</el-button
+        >
         <el-button type="success" @click="submitAddForm">提交</el-button>
       </div>
     </el-dialog>
-    <el-dialog
-      title="编辑题库"
-      :visible.sync="editFormDialogShow"
-    >
+    <el-dialog title="编辑题库" :visible.sync="editFormDialogShow">
       <el-form
+        v-if="editFormDialogShow"
         ref="editform"
         :model="editFormInfo"
         label-width="120px"
@@ -132,10 +180,7 @@
           <el-input v-model="editFormInfo.title" />
         </el-form-item>
         <el-form-item label="分类" prop="type">
-          <el-select
-            v-model="editFormInfo.type"
-            placeholder="所属分类"
-          >
+          <el-select v-model="editFormInfo.type" placeholder="所属分类">
             <el-option
               v-for="item in questionTypeOption"
               :key="item.value"
@@ -146,14 +191,13 @@
         </el-form-item>
       </el-form>
       <div slot="footer">
-        <el-button type="info" @click="cancelEditForm">取消</el-button>
+        <el-button type="info" @click="editFormDialogShow = false"
+          >取消</el-button
+        >
         <el-button type="success" @click="submitEditForm">提交</el-button>
       </div>
     </el-dialog>
-    <el-dialog
-      title="添加分类"
-      :visible.sync="addTypeFormDialog"
-    >
+    <el-dialog title="添加分类" :visible.sync="addTypeFormDialog">
       <el-form
         v-if="addTypeFormDialog"
         ref="addTypeform"
@@ -166,14 +210,13 @@
         </el-form-item>
       </el-form>
       <div slot="footer">
-        <el-button type="info" @click="addTypeFormDialog = false">取消</el-button>
+        <el-button type="info" @click="addTypeFormDialog = false"
+          >取消</el-button
+        >
         <el-button type="primary" @click="submitAddType">提交</el-button>
       </div>
     </el-dialog>
-    <el-dialog
-      title="编辑分类"
-      :visible.sync="editTypeFormDialog"
-    >
+    <el-dialog title="编辑分类" :visible.sync="editTypeFormDialog">
       <el-form
         v-if="editTypeFormDialog"
         ref="editTypeform"
@@ -203,308 +246,549 @@ import {
   getExamLibraryCategory,
   postExamLibraryCategory,
   putExamLibraryCategory,
-  deleteExamLibraryCategory
-} from '@/api/test.js'
+  deleteExamLibraryCategory,
+  findPagePager,
+  changePaperStatus,
+  deleteExamPaper
+} from "@/api/test.js";
 export default {
   data() {
     return {
-      activeName: '题库管理',
+      activeName: "题库管理",
       questionTypeOption: [
         {
-          label: '视频问题回答',
-          value: '视频问题回答'
+          label: "视频问题回答",
+          value: "视频问题回答"
         },
         {
-          label: '安全生产培训',
-          value: '安全生产培训'
+          label: "安全生产培训",
+          value: "安全生产培训"
         },
         {
-          label: '职业卫生培训',
-          value: '职业卫生培训'
+          label: "职业卫生培训",
+          value: "职业卫生培训"
         }
       ],
-      searchType: '',
-      inputSearchName: '',
+      searchType: "",
+      inputSearchName: "",
       tableData: [
         {
-          title: '大学习、大培训、大考试',
-          type: '大学习、大培训、大考试',
+          title: "大学习、大培训、大考试",
+          type: "大学习、大培训、大考试",
           testerSum: 10,
           subjectSum: 10
         },
         {
-          title: '放射诊疗防护',
-          type: '放射诊疗防护',
+          title: "放射诊疗防护",
+          type: "放射诊疗防护",
           testerSum: 8,
           subjectSum: 8
         },
         {
-          title: '职业卫生视频验证',
-          type: '职业卫生视频验证',
+          title: "职业卫生视频验证",
+          type: "职业卫生视频验证",
           testerSum: 2,
           subjectSum: 4
         }
       ],
       addFormDialogShow: false,
       formInfo: {
-        title: '',
-        type: ''
+        title: "",
+        type: ""
       },
       rules: {
         title: [
           {
             required: true,
-            message: '请输入名称',
-            trigger: 'blur'
+            message: "请输入名称",
+            trigger: "blur"
           }
         ],
         type: [
           {
             required: true,
-            message: '请输入课程类型',
-            trigger: 'change'
+            message: "请输入课程类型",
+            trigger: "change"
           }
         ]
       },
       editFormDialogShow: false,
       editFormInfo: {
-        title: '',
-        type: ''
+        title: "",
+        type: ""
       },
       tableTypeData: [
         {
-          title: '视频问题回答',
+          title: "视频问题回答",
           questionSum: 1
         },
         {
-          title: '放射诊疗防护',
+          title: "放射诊疗防护",
           questionSum: 1
         },
         {
-          title: '职业卫生培训',
+          title: "职业卫生培训",
           questionSum: 3
         }
       ],
       addTypeFormDialog: false,
       typeFormInfo: {
-        title: ''
+        title: ""
       },
       typeRules: {
         title: [
           {
             required: true,
-            message: '请输入名称',
-            trigger: 'blur'
+            message: "请输入名称",
+            trigger: "blur"
           }
         ]
       },
       editTypeFormDialog: false,
       editTypeFormInfo: {
-        title: ''
-      }
-    }
+        title: ""
+      },
+      currentPage: 1,
+      curPageSize: 10,
+      totalElements: 10,
+      searchPaperKeyWord: "",
+      paperTableData: [],
+      currentPagerPage: 1,
+      curPagerPageSize: 10,
+      totalPagerElements: 10
+    };
   },
   mounted() {
-    this.initExamLibraryCategory()
+    this.initExamLibraryCategory();
+    this.initExamLibrary();
+    this.initPaper();
   },
   methods: {
+    async initExamLibrary() {
+      const params = {};
+      params.page = this.currentPage - 1;
+      params.size = this.curPageSize;
+      if (this.searchType) {
+        params.categoryId = this.searchType;
+      }
+      if (this.inputSearchName) {
+        params.name = this.inputSearchName;
+      }
+      await getExamLibrary(params).then(res => {
+        if (res) {
+          console.log(res, "getExamLibrary getExamLibrary");
+          this.tableData = [
+            ...res.content.map(item => {
+              return {
+                title: item.name,
+                type: item.category,
+                subjectSum: item.subjectNum,
+                paperNum: item.testerSum,
+                id: item.id
+              };
+            })
+          ];
+        }
+      });
+    },
     async initExamLibraryCategory() {
       const params = {
         page: 0,
         size: 9999
-      }
+      };
       await getExamLibraryCategory(params).then(res => {
-        console.log(res, 'getExamLibraryCategory getExamLibraryCategory')
-        this.tableTypeData = [...res.content.map(item => {
-          return {
-            title: item.name,
-            ...item
-          }
-        })]
-        this.questionTypeOption = [...res.content.map(item => {
-          return {
-            label: item.name,
-            value: item.id
-          }
-        })]
-      })
+        console.log(res, "getExamLibraryCategory getExamLibraryCategory");
+        this.tableTypeData = [
+          ...res.content.map(item => {
+            return {
+              title: item.name,
+              ...item
+            };
+          })
+        ];
+        this.questionTypeOption = [
+          ...res.content.map(item => {
+            return {
+              label: item.name,
+              value: item.id
+            };
+          })
+        ];
+      });
+    },
+    async initPaper() {
+      const data = {
+        page: this.currentPagerPage - 1,
+        size: this.curPagerPageSize
+      };
+      if (this.searchPaperKeyWord) {
+        data.name = this.searchPaperKeyWord;
+      }
+      await findPagePager(data).then(res => {
+        console.log(res, "findPagePager findPagePager");
+        this.paperTableData = [...res.content];
+        this.totalPagerElements = res.totalElements;
+      });
     },
     addQuestionBank() {
-      this.addFormDialogShow = true
+      this.addFormDialogShow = true;
+      this.formInfo.title = "";
+      this.formInfo.type = "";
     },
     cancelAddForm() {
-      this.addFormDialogShow = false
-      this.formInfo.title = ''
-      this.formInfo.type = ''
+      this.addFormDialogShow = false;
+      this.formInfo.title = "";
+      this.formInfo.type = "";
     },
     submitAddForm() {
       // 提交 axios
+      this.$refs.addform.validate(valid => {
+        if (valid) {
+          const data = {};
+          data.categoryId = this.formInfo.type;
+          data.name = this.formInfo.title;
+          postExamLibrary(data)
+            .then(res => {
+              if (res) {
+                this.$message({
+                  type: "success",
+                  message: "添加成功"
+                });
+              }
+              this.addFormDialogShow = false;
+              this.initExamLibrary();
+            })
+            .catch(() => {
+              this.$message.error("添加失败");
+            });
+        }
+      });
     },
     cancelEditForm() {
-      this.editFormDialogShow = false
+      this.editFormDialogShow = false;
     },
     submitEditForm() {
       // axios
+      this.$refs.editform.validate(valid => {
+        if (valid) {
+          const data = {
+            categoryId: this.editFormInfo.type,
+            id: this.editFormInfo.id,
+            name: this.editFormInfo.title
+          };
+          putExamLibrary(data)
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "修改成功"
+              });
+              this.initExamLibrary();
+              this.editFormDialogShow = false;
+            })
+            .catch(() => {
+              this.$message.error("修改失败");
+            });
+        }
+      });
     },
     showEditDialog(row) {
-      this.editFormDialogShow = true
+      this.editFormDialogShow = true;
+      console.log(row, "showEditDialog showEditDialog showEditDialog");
+      console.log(
+        this.questionTypeOption,
+        "this.questionTypeOption this.questionTypeOption this.questionTypeOption this.questionTypeOption"
+      );
+      this.editFormInfo.title = row.title;
+      this.editFormInfo.id = row.id;
+      this.editFormInfo.type = this.questionTypeOption.filter(
+        item => item.label === row.type
+      ).length
+        ? this.questionTypeOption.filter(item => item.label === row.type)[0]
+            .value
+        : "";
     },
-    deleteEditDialog() {
-      this.$confirm('此操作将永久删除题库, 是否继续?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        this.$message({
-          type: 'success',
-          message: '删除成功'
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
-        })
+    deleteEditDialog(row) {
+      this.$confirm("此操作将永久删除题库, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          deleteExamLibrary([row.id])
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+              this.initExamLibrary();
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
     deleteType(row) {
       // row
       // 删除类型
-      this.$confirm('此操作将永久删除类型，是否继续?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        deleteExamLibraryCategory([row.id]).then(res => {
-          this.$message({
-            type: 'message',
-            message: '删除成功'
-          })
-          this.initExamLibraryCategory()
-        }).catch(() => {
-          this.$message.error('删除失败')
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
-        })
+      this.$confirm("此操作将永久删除类型，是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          deleteExamLibraryCategory([row.id])
+            .then(res => {
+              this.$message({
+                type: "message",
+                message: "删除成功"
+              });
+              this.initExamLibraryCategory();
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
     cancelEditType() {
-      this.editTypeFormDialog = false
+      this.editTypeFormDialog = false;
     },
     submitEditType() {
       // 提交编辑类型
       //
-      this.$refs.editTypeform.validate((valid) => {
+      this.$refs.editTypeform.validate(valid => {
         if (valid) {
-          console.log('editTypeform editTypeform editTypeform ')
+          console.log("editTypeform editTypeform editTypeform ");
           const data = {
             name: this.editTypeFormInfo.title,
             id: this.editTypeFormInfo.id
-          }
-          putExamLibraryCategory(data).then(res => {
-            this.$message({
-              type: 'success',
-              message: '修改成功'
+          };
+          putExamLibraryCategory(data)
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "修改成功"
+              });
+              this.initExamLibraryCategory();
+              this.editTypeFormDialog = false;
             })
-            this.initExamLibraryCategory()
-            this.editTypeFormDialog = false
-          }).catch(() => {
-            this.$message.error('修改失败')
-          })
+            .catch(() => {
+              this.$message.error("修改失败");
+            });
         }
-      })
+      });
     },
     showEditTypeDialog(row) {
       //
-      this.editTypeFormDialog = true
+      this.editTypeFormDialog = true;
       //
       this.editTypeFormInfo = {
         ...row
-      }
+      };
       // console.log(row, 'showEditTypeDialog showEditTypeDialog')
     },
     addTypeDialog() {
       // 添加分类对话框
-      this.addTypeFormDialog = true
-      this.typeFormInfo.title = ''
+      this.addTypeFormDialog = true;
+      this.typeFormInfo.title = "";
     },
     jumpToManage(row) {
       // console.log(row)
       this.$router.push({
-        path: '/train/exam/manage/44444'
-      })
+        path: "/train/exam/manage/" + row.id
+      });
     },
     submitAddType() {
-      this.$refs.addTypeform.validate((valid) => {
+      this.$refs.addTypeform.validate(valid => {
         if (valid) {
           // submitAddType
           const data = {
             name: this.typeFormInfo.title
-          }
-          postExamLibraryCategory(data).then(res => {
-            console.log(res, 'postExamLibraryCategory postExamLibraryCategory')
-            this.$message({
-              type: 'success',
-              message: '添加成功'
+          };
+          postExamLibraryCategory(data)
+            .then(res => {
+              console.log(
+                res,
+                "postExamLibraryCategory postExamLibraryCategory"
+              );
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.initExamLibraryCategory();
+              this.addTypeFormDialog = false;
             })
-            this.initExamLibraryCategory()
-            this.addTypeFormDialog = false
-          }).catch(() => {
-            this.$message.error('添加失败')
-          })
+            .catch(() => {
+              this.$message.error("添加失败");
+            });
         }
+      });
+    },
+    handleSizeChange(val) {
+      this.curPageSize = val;
+      this.initExamLibrary();
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      this.initExamLibrary();
+    },
+    handlePagerSizeChange(val) {
+      this.curPagerPageSize = val;
+      this.initPaper();
+    },
+    handlePagerCurrentChange(val) {
+      this.currentPagerPage = val;
+      this.initPaper();
+    },
+    navigateToMakeTester() {
+      this.$router.push("/exam/maketester/1");
+    },
+    navigateToMakeTesterAuto() {
+      this.$router.push("/exam/maketesterauto");
+    },
+    closePaper(row) {
+      const data = {
+        id: row.id,
+        status: "已关闭"
+      };
+      changePaperStatus(data)
+        .then(res => {
+          this.$message({
+            type: "success",
+            message: "修改成功"
+          });
+          this.initPaper();
+        })
+        .catch(() => {
+          this.$message.error("修改失败");
+        });
+    },
+    publishPaper(row) {
+      const data = {
+        id: row.id,
+        status: "已发布"
+      };
+      changePaperStatus(data)
+        .then(res => {
+          this.$message({
+            type: "success",
+            message: "修改成功"
+          });
+          this.initPaper();
+        })
+        .catch(() => {
+          this.$message.error("修改失败");
+        });
+    },
+    deletePublish(row) {
+      console.log(row, "deletePublish deletePublish deletePublish");
+      this.$confirm("此操作将永久删除该试卷, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          deleteExamPaper([row.id])
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "删除成功!"
+              });
+              this.initPaper();
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     }
   }
-}
+};
 </script>
 
+<style>
+.app-main {
+  background-color: #f5f6fb;
+  /*height: 100vh;*/
+}
+</style>
 <style lang="scss" scoped>
-  .exam-wrapper {
-    padding: 30px;
-    margin: 30px auto;
-    border-radius: 30px;
-    box-shadow: 0 0 9px 1px #eee;
-    width: 80%;
-  }
-  .add-question-bank-wrapper {
-    padding: 20px;
-    margin: 20px auto;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
-    width: 80%;
-  }
-  .tools-search-question-bank-wrapper {
-    padding: 20px;
-    margin: 20px auto;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
-    width: 80%;
-  }
-  .table-wrapper {
-    padding: 20px;
-    margin: 20px auto;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
-    width: 80%;
+.exam-wrapper {
+  padding: 20px;
+  margin: 10px 10px;
+  border-radius: 5px;
+}
+.add-question-bank-wrapper {
+  padding: 20px;
+  margin: 20px 10px;
+  border-radius: 5px;
+  background: #fff;
+}
+.tools-search-question-bank-wrapper {
+  padding: 20px;
+  margin: 20px 10px;
+  border-radius: 5px;
+  background: #fff;
+}
+.table-wrapper {
+  padding: 20px;
+  margin: 20px 10px;
+  border-radius: 5px;
+  background: #fff;
+}
+.edit-question-bank-wrapper {
+  padding: 20px;
+  margin: 10px 10px;
+  border-radius: 5px;
+  background-color: #fff;
+}
+.edit-type-table-wrapper {
+  padding: 20px;
+  margin: 10px 10px;
+  border-radius: 5px;
+  background-color: #fff;
+}
+.pager-total-wrapper {
+  padding: 10px;
+  border-radius: 30px;
+  margin: 10px 0;
+  .pager-form-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 0;
+    background-color: #fff;
   }
-  .edit-question-bank-wrapper {
-    padding: 20px;
-    margin: 20px auto;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
-    width: 80%;
+  .pager-tools-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 0;
+    display: flex;
+    background-color: #fff;
   }
-  .edit-type-table-wrapper {
-    padding: 20px;
-    margin: 20px auto;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
-    width: 80%;
+  .pager-table-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 0;
+    background-color: #fff;
   }
-  /* .add-question-bank-wrapper {
+}
+/* .add-question-bank-wrapper {
     position: absolute;
     right: 20px;
     top: 0;

src/views/exam/justify.vue

 <template>
   <div class="justify-wrapper">
-    <el-form
-      ref="addform"
-      :model="formInfo"
-      label-width="80px"
-      :rules="rules"
-    >
-      <el-form-item
-        label="题干"
-        prop="outline"
-      >
+    <el-form ref="addform" :model="formInfo" label-width="80px" :rules="rules">
+      <el-form-item label="题干" prop="outline">
         <el-input
           v-model="formInfo.outline"
           type="textarea"
           autosize
+          :style="{ width: '70%' }"
         />
       </el-form-item>
-      <el-form-item
-        label="判断"
-        prop="isTrue"
-      >
-        <el-radio v-model="formInfo.isTrue" label="是" />
-        <el-radio v-model="formInfo.isTrue" label="否" />
+      <el-form-item label="困难程度" prop="difficulty">
+        <el-select v-model="formInfo.difficulty" :style="{ width: '70%' }">
+          <el-option
+            v-for="item in difficulties"
+            :key="item.label"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
       </el-form-item>
-      <el-form-item
-        label="解析"
-        prop="answer"
-      >
+      <el-form-item label="判断" prop="isTrue">
+        <el-radio v-model="formInfo.isTrue" label="对" />
+        <el-radio v-model="formInfo.isTrue" label="错" />
+      </el-form-item>
+      <el-form-item label="解析" prop="answer">
         <el-input
           v-model="formInfo.answer"
           type="textarea"
           autosize
-        />
-      </el-form-item>
-      <el-form-item
-        label="分值"
-        prop="score"
-      >
-        <el-input
-          v-model="formInfo.score"
+          :style="{ width: '70%' }"
         />
       </el-form-item>
     </el-form>
     <div class="tools-wrapper">
       <el-button type="primary" @click="saveAndAdd">保存并继续添加</el-button>
-      <el-button type="primary" @click="save">保存</el-button>
+      <!-- <el-button type="primary" @click="save">保存</el-button> -->
       <el-button type="text" @click="goback">返回</el-button>
     </div>
   </div>
 </template>
 
 <script>
+import { postOnlineExamSubject } from "@/api/test.js";
 export default {
   data() {
     return {
       formInfo: {
-        outline: '',
-        isTrue: '',
-        answer: '',
-        score: ''
+        outline: "",
+        isTrue: "",
+        answer: "",
+        difficulty: ""
       },
+      difficulties: [
+        {
+          label: "简单",
+          value: "简单"
+        },
+        {
+          label: "一般",
+          value: "一般"
+        },
+        {
+          label: "困难",
+          value: "困难"
+        }
+      ],
       rules: {
+        difficulty: [
+          {
+            required: true,
+            message: "请选择困难程度",
+            trigger: "change"
+          }
+        ],
         outline: [
           {
             required: true,
-            message: '请输入题干',
-            trigger: 'blur'
+            message: "请输入题干",
+            trigger: "blur"
           }
         ],
         isTrue: [
           {
             required: true,
-            message: '请输入判断答案'
+            message: "请输入判断答案"
+          }
+        ],
+        answer: [
+          {
+            required: true,
+            message: "请输入解析",
+            trigger: "blur"
           }
         ]
       }
-    }
+    };
   },
   methods: {
     goback() {
       this.$router.push({
-        path: '/exam/manage/45666655'
-      })
+        path: "/exam/manage/" + this.$route.params.name
+      });
     },
     save() {
       // axios
@@ -89,11 +108,48 @@ export default {
     },
     saveAndAdd() {
       // axios add
+      this.$refs.addform.validate(valid => {
+        if (valid) {
+          const data = {
+            analysis: this.formInfo.answer,
+            answer: this.formInfo.isTrue,
+            difficulty: this.formInfo.difficulty,
+            libraryId: this.$route.params.name,
+            question: this.formInfo.outline,
+            type: "判断题"
+          };
+          postOnlineExamSubject(data)
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.formInfo = {
+                outline: "",
+                answer: "",
+                isTrue: this.formInfo.isTrue,
+                difficulty: this.formInfo.difficulty
+              };
+            })
+            .catch(() => {
+              this.$message.error("添加失败");
+            });
+        }
+      });
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-
+.justify-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  .tools-wrapper {
+    display: flex;
+    justify-content: flex-end;
+    padding-right: 25%;
+  }
+}
 </style>

src/views/exam/maketester.vue

 <template>
   <div class="make-tester-wrapper">
-    <el-form
-      ref="addform"
-      :model="formInfo"
-      label-width="120px"
-      :rules="rules"
-    >
-      <el-form-item
-        label="试卷名称"
-        prop="title"
+    <div class="make-tester-form">
+      <el-form
+        ref="addform"
+        :model="formInfo"
+        label-width="120px"
+        :rules="rules"
       >
-        <el-input v-model="formInfo.title" />
-      </el-form-item>
-    </el-form>
+        <el-form-item label="试卷名称" prop="name">
+          <el-input :style="{ width: '70%' }" v-model="formInfo.name" />
+        </el-form-item>
+        <el-form-item label="试卷描述" prop="description">
+          <el-input
+            :style="{ width: '70%' }"
+            v-model="formInfo.description"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="课程状态" prop="status">
+          <el-radio v-model="formInfo.status" label="已关闭"></el-radio>
+          <el-radio v-model="formInfo.status" label="已发布"></el-radio>
+        </el-form-item>
+        <el-form-item label="单选题单项分值" prop="singleChoiceScore">
+          <el-input-number
+            v-model="formInfo.singleChoiceScore"
+            :min="1"
+            :max="100"
+          ></el-input-number>
+        </el-form-item>
+        <el-form-item label="多选题单项分值" prop="multipleChoiceScore">
+          <el-input-number
+            v-model="formInfo.multipleChoiceScore"
+            :min="1"
+            :max="10"
+          ></el-input-number>
+        </el-form-item>
+        <el-form-item label="判断题单项分值" prop="judgmentScore">
+          <el-input-number
+            v-model="formInfo.judgmentScore"
+            :min="1"
+            :max="10"
+          ></el-input-number>
+        </el-form-item>
+      </el-form>
+    </div>
     <div class="selection-type-radio-wrapper">
       <el-radio v-model="curSubjectType" label="单选题" />
       <el-radio v-model="curSubjectType" label="多选题" />
@@ -20,18 +50,56 @@
       <el-button type="primary" @click="addSubject">新增试题</el-button>
     </div>
     <div class="save-btn-wrapper">
-      <el-button type="primary">保存试卷</el-button>
+      <el-button type="primary" @click="saveSubjects">保存试卷</el-button>
     </div>
-    <el-dialog
-      title="添加题目"
-      :visible.sync="addSubjectDialogShow"
-    >
+    <el-dialog title="添加题目" :visible.sync="addSubjectDialogShow">
       <div class="search-subject-wrapper">
-        <el-input v-model="searchSubjectKeyword" placeholder="关键字" />
-        <el-button type="primary">搜索</el-button>
+        <el-select v-model="selectDifficulty" placeholder="请选择困难度">
+          <el-option
+            v-for="item in difficulties"
+            :key="item.label"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
+        <el-input
+          v-model="searchSubjectKeyword"
+          :style="{ marginLeft: '30px' }"
+          placeholder="关键字"
+        />
+        <el-button
+          type="primary"
+          :style="{ marginLeft: '30px' }"
+          @click="initAllQuestion"
+          >搜索</el-button
+        >
       </div>
       <div class="subject-table-wrapper">
-        <el-table
+        <div class="mytable-wrapper">
+          <div class="mytable-header-wrapper">
+            <div class="mytable-header-selection">
+              <el-checkbox
+                v-model="chosenRadio"
+                @input="inputChosenRadio"
+              ></el-checkbox>
+            </div>
+            <div class="mytable-header-question">题干</div>
+          </div>
+          <div
+            v-for="item in subjectTable"
+            :key="item.id"
+            class="mytable-body-wrapper"
+          >
+            <div class="mytable-body-selection">
+              <el-checkbox
+                v-model="item.isChosen"
+                @input="tryInput(item)"
+              ></el-checkbox>
+            </div>
+            <div class="mytable-body-question">{{ item.question }}</div>
+          </div>
+        </div>
+        <!-- <el-table
           :data="subjectTable"
           @selection-change="handleSelectionChange"
         >
@@ -40,10 +108,10 @@
             width="55"
           />
           <el-table-column
-            prop="outline"
+            prop="question"
             label="题干"
           />
-        </el-table>
+        </el-table> -->
         <el-pagination
           :current-page="currentPage"
           :page-sizes="[10, 20, 30, 40]"
@@ -55,69 +123,306 @@
         />
       </div>
       <div class="table-wrapper">
-        {{ "共选了 " + " " + multipleSelection.length + "个题目" }}
+        {{ "共选了 " + " " + getSubjectSum + "个题目" }}
+      </div>
+      <div class="save-wrapper">
+        <el-button type="primary" @click="addSubjectDialogShow = false"
+          >保存</el-button
+        >
       </div>
-      <el-button>保存</el-button>
     </el-dialog>
   </div>
 </template>
 
 <script>
+import { getOnlineExamSubject, saveManully } from "@/api/test.js";
 export default {
   data() {
     return {
       formInfo: {
-        title: ''
+        name: "",
+        description: "",
+        status: "已关闭",
+        singleChoiceScore: 0,
+        judgmentScore: 0,
+        multipleChoiceScore: 0
       },
       // 单选题、多选题、判断题、新增试题
-      curSubjectType: '单选题',
+      curSubjectType: "单选题",
       rules: {
-        title: [
+        name: [
           {
             required: true,
-            message: '请输入试卷名称',
-            trigger: 'blur'
+            message: "请输入试卷名称",
+            trigger: "blur"
           }
         ]
       },
       addSubjectDialogShow: false,
-      searchSubjectKeyword: '',
-      subjectTable: [
+      searchSubjectKeyword: "",
+      selectDifficulty: "",
+      difficulties: [
         {
-          outline: '乡镇人民政府不具备安全生产监督管理的职责。（）'
+          label: "简单",
+          value: "简单"
         },
         {
-          outline: '工会对生产经营单位的安全生产工作无监督的权力和义务。（）'
+          label: "一般",
+          value: "一般"
         },
         {
-          outline: '道路交通安全适用于《中华人民共和国安全生产法》。（）'
+          label: "困难",
+          value: "困难"
         }
       ],
+      subjectTable: [],
       multipleSelection: [],
       pageSize: 10,
-      TotalSize: 40,
-      currentPage: 1
-    }
+      TotalSize: 0,
+      currentPage: 1,
+      chosenSelection: [],
+      chosenRadio: false
+    };
   },
   methods: {
+    async initAllQuestion() {
+      const params = {};
+      params.page = this.currentPage - 1;
+      params.size = this.pageSize;
+      params.type = this.curSubjectType;
+      if (this.selectDifficulty) {
+        params.difficulty = this.selectDifficulty;
+      }
+      if (this.searchSubjectKeyword) {
+        params.question = this.searchSubjectKeyword;
+      }
+      await getOnlineExamSubject(params).then(res => {
+        console.log(
+          res,
+          "getOnlineExamSubject getOnlineExamSubject getOnlineExamSubject"
+        );
+        this.subjectTable = [
+          ...res.content.map(item => {
+            return {
+              ...item,
+              isChosen: false
+            };
+          })
+        ];
+        this.TotalSize = res.totalElements;
+        this.chosenRadio = false;
+        this.subjectTable.forEach(subject => {
+          const resultArr = this.chosenSelection.filter(
+            item => item.id === subject.id
+          );
+          if (resultArr.length) {
+            subject.isChosen = resultArr[0].isChosen;
+          }
+        });
+      });
+    },
     addSubject() {
-      //
-      this.addSubjectDialogShow = true
+      this.addSubjectDialogShow = true;
+      this.initAllQuestion();
     },
     handleSelectionChange(val) {
-      //
-      this.multipleSelection = val
+      this.multipleSelection = val;
+      console.log(
+        this.multipleSelection,
+        "this.multipleSelection this.multipleSelection this.multipleSelection"
+      );
     },
     handleSizeChange(val) {
-      this.pageSize = val
+      this.pageSize = val;
     },
     handleCurrentChange(val) {
-      this.currentPage = val
+      this.currentPage = val;
+      if (val === 1) {
+        this.subjectTable = [];
+      }
+      if (val === 2) {
+        this.subjectTable = [];
+      }
+    },
+    tryInput(item) {
+      if (item.isChosen) {
+        if (this.chosenSelection.indexOf(item) === -1) {
+          this.chosenSelection.push(item);
+        }
+      } else {
+        if (this.chosenSelection.indexOf(item) > -1) {
+          this.chosenSelection.splice(this.chosenSelection.indexOf(item), 1);
+        }
+      }
+    },
+    saveSubjects() {
+      // console.log('saveSubjects saveSubjects saveSubjects')
+      this.$refs.addform.validate(valid => {
+        if (valid) {
+          console.log(
+            this.chosenSelection,
+            "this.chosenSelection this.chosenSelection this.chosenSelection"
+          );
+          const mySet = new Set(
+            this.chosenSelection.map(item => item.libraryId)
+          );
+          const myArr = [...mySet];
+          const data = {
+            name: this.formInfo.name,
+            description: this.formInfo.description,
+            status: this.formInfo.status,
+            libraryId: myArr,
+            addJudgementIds: this.chosenSelection
+              .filter(item => item.type === "判断题")
+              .map(item => item.id),
+            addMultipleChoiceIds: this.chosenSelection
+              .filter(item => item.type === "多选题")
+              .map(item => item.id),
+            addSingleChoiceIds: this.chosenSelection
+              .filter(item => item.type === "单选题")
+              .map(item => item.id),
+            singleChoiceScore: this.formInfo.singleChoiceScore,
+            multipleChoiceScore: this.formInfo.multipleChoiceScore,
+            judgmentScore: this.formInfo.judgmentScore
+          };
+          saveManully(data)
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "添加试卷成功"
+              });
+            })
+            .catch(() => {
+              this.$message.error("添加试卷失败");
+            });
+        }
+      });
+    },
+    inputChosenRadio($event) {
+      console.log($event, "inputChosenRadio inputChosenRadio");
+      this.subjectTable.forEach(item => {
+        item.isChosen = $event;
+        if ($event) {
+          if (this.chosenSelection.indexOf(item) === -1) {
+            this.chosenSelection.push(item);
+          }
+        } else {
+          if (this.chosenSelection.indexOf(item) > -1) {
+            this.chosenSelection.splice(this.chosenSelection.indexOf(item), 1);
+          }
+        }
+      });
     }
+  },
+  computed: {
+    getSubjectSum() {
+      return this.chosenSelection.filter(
+        item => item.type === this.curSubjectType
+      ).length;
+    }
+  },
+  watch: {
+    currentPage(newVal, oldVal) {
+      console.log(newVal, "currentPage currentPage currentPage");
+      console.log(oldVal, "oldVal oldVal oldVal");
+      // this.chosenSelection = [...this.chosenSelection, ...this.multipleSelection]
+      console.log(
+        this.chosenSelection,
+        "this.chosenSelection this.chosenSelection this.chosenSelection"
+      );
+    }
+    // chosenRadio(newVal, oldVal) {
+    //   console.log(newVal, oldVal, ',,.,,.,...,.')
+    //   this.subjectTable.forEach(item => {
+    //     item.isChosen = newVal
+    //     if (item.isChosen) {
+    //       if (this.chosenSelection.indexOf(item) === -1) {
+    //         this.chosenSelection.push(item)
+    //       }
+    //     } else {
+    //       if (this.chosenSelection.indexOf(item) > -1) {
+    //         this.chosenSelection.splice(this.chosenSelection.indexOf(item), 1)
+    //       }
+    //     }
+    //   })
+    // }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-
+.make-tester-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  .make-tester-form {
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    background: #fff;
+  }
+  .selection-type-radio-wrapper {
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    display: flex;
+    align-items: center;
+    background: #fff;
+  }
+  .save-btn-wrapper {
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    background: #fff;
+  }
+}
+.search-subject-wrapper {
+  display: flex;
+  align-items: center;
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+}
+.subject-table-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  .mytable-wrapper {
+    padding: 10px;
+    margin: 10px 10px;
+    .mytable-header-wrapper {
+      display: flex;
+      padding: 10px;
+      border-top: 1px solid #eee;
+      border-bottom: 1px solid #eee;
+      .mytable-header-selection {
+        flex-basis: 10%;
+      }
+      .mytable-header-question {
+        flex-basis: 90%;
+      }
+    }
+    .mytable-body-wrapper {
+      display: flex;
+      padding: 10px;
+      border-bottom: 1px solid #eee;
+      .mytable-body-selection {
+        flex-basis: 10%;
+      }
+      .mytable-body-question {
+        flex-basis: 90%;
+      }
+    }
+  }
+}
+.table-wrapper {
+  display: flex;
+  justify-content: flex-end;
+  margin-right: 30px;
+}
+.save-wrapper {
+  display: flex;
+  justify-content: flex-end;
+  margin-right: 30px;
+}
 </style>

src/views/exam/maketesterauto.vue

+<template>
+  <div class="maketesterauto-wrapper">
+    <div class="maketesterauto-form-wrapper">
+      <el-form
+        ref="addform"
+        :model="formInfo"
+        :rules="rules"
+        label-width="120px"
+      >
+        <el-form-item label="试卷名称" prop="name">
+          <el-input
+            v-model="formInfo.name"
+            :style="{ width: '70%' }"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="试卷描述" prop="description">
+          <el-input
+            type="textarea"
+            autosize
+            :style="{ width: '70%' }"
+            v-model="formInfo.description"
+          >
+          </el-input>
+        </el-form-item>
+        <el-form-item label="生成方式">
+          <el-radio v-model="formInfo.mode" label="随机"></el-radio>
+          <el-radio v-model="formInfo.mode" label="简单"></el-radio>
+          <el-radio v-model="formInfo.mode" label="一般"></el-radio>
+          <el-radio v-model="formInfo.mode" label="困难"></el-radio>
+        </el-form-item>
+        <el-form-item label="选择题库">
+          <el-select v-model="curChosenLibrary">
+            <el-option
+              v-for="item in curExamLibraries"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="单选题数量">
+          <el-input-number v-model="formInfo.singleChoiceNum"></el-input-number>
+        </el-form-item>
+        <el-form-item label="单选题单项分值">
+          <el-input-number
+            v-model="formInfo.singleChoiceScore"
+          ></el-input-number>
+        </el-form-item>
+        <el-form-item label="多选题数量">
+          <el-input-number
+            v-model="formInfo.multipleChoiceNum"
+          ></el-input-number>
+        </el-form-item>
+        <el-form-item label="多选题单项分值">
+          <el-input-number
+            v-model="formInfo.multipleChoiceScore"
+          ></el-input-number>
+        </el-form-item>
+        <el-form-item label="判断题数量">
+          <el-input-number v-model="formInfo.judgmentNum"></el-input-number>
+        </el-form-item>
+        <el-form-item label="判断题单项分值">
+          <el-input-number v-model="formInfo.judgmentScore"></el-input-number>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="saveNext">保存, 下一步</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getExamLibrary, savePaperAutomatically } from "@/api/test.js";
+export default {
+  data() {
+    return {
+      formInfo: {
+        name: "",
+        description: "",
+        mode: "随机",
+        libraryIds: [],
+        singleChoiceNum: 0,
+        singleChoiceScore: 0,
+        multipleChoiceNum: 0,
+        multipleChoiceScore: 0,
+        judgmentNum: 0,
+        judgmentScore: 0
+      },
+      curChosenLibrary: -1,
+      rules: {
+        name: [
+          {
+            required: true,
+            message: "请输入试卷名称",
+            trigger: "blur"
+          }
+        ],
+        description: [
+          {
+            required: true,
+            message: "请输入试卷描述",
+            trigger: "blur"
+          }
+        ]
+      },
+      curExamLibraries: []
+    };
+  },
+  async mounted() {
+    await this.initAllExamLibrary();
+  },
+  methods: {
+    async initAllExamLibrary() {
+      const params = {
+        page: 0,
+        size: 999
+      };
+      await getExamLibrary(params).then(res => {
+        console.log(res, "getExamLibrary getExamLibrary");
+        this.curExamLibraries = [...res.content];
+        this.curExamLibraries.splice(0, 0, {
+          name: "全部",
+          id: -1
+        });
+      });
+    },
+    saveNext() {
+      /**
+       * singleChoiceNum: 0,
+          singleChoiceScore: 0,
+          multipleChoiceNum: 0,
+          multipleChoiceScore: 0,
+          judgmentNum: 0,
+          judgmentScore: 0
+       */
+      if (
+        this.formInfo.singleChoiceNum * this.formInfo.singleChoiceScore +
+          this.formInfo.multipleChoiceNum * this.formInfo.multipleChoiceScore +
+          this.formInfo.judgmentNum * this.formInfo.judgmentScore !==
+        100
+      ) {
+        this.$message.error("试卷总分数不为100");
+        return;
+      }
+      let libraryIds = [];
+      if (this.curChosenLibrary === -1) {
+        libraryIds = [...this.curExamLibraries.map(item => item.id)];
+      } else {
+        libraryIds = [this.curChosenLibrary];
+      }
+      const data = {
+        name: this.formInfo.name,
+        description: this.formInfo.description,
+        mode: this.formInfo.mode,
+        libraryIds: libraryIds,
+        judgmentNum: this.formInfo.judgmentNum,
+        judgmentScore: this.formInfo.judgmentScore,
+        multipleChoiceNum: this.formInfo.multipleChoiceNum,
+        multipleChoiceScore: this.formInfo.multipleChoiceScore,
+        singleChoiceNum: this.formInfo.singleChoiceNum,
+        singleChoiceScore: this.formInfo.singleChoiceScore,
+        status: "已关闭"
+      };
+      savePaperAutomatically(data).then(res => {
+        console.log(res, "savePaperAutomatically");
+        this.$router.push("/exam/maketestersave/" + res);
+      });
+    }
+  }
+  // watch: {
+  //   curChosenLibrary(newVal, oldVal) {
+  //     console.log(newVal, oldVal, 'curChosenLibrary')
+  //   }
+  // }
+};
+</script>
+
+<style lang="scss" scoped>
+.maketesterauto-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  max-width: 777px;
+}
+</style>

src/views/exam/maketesterautosave.vue

+<template>
+  <div class="testerautosave-wrapper">
+    <div class="tools-wrapper">
+      <el-button type="primary" @click="addTester">添加试题</el-button>
+    </div>
+    <div class="table-wrapper">
+      <el-table :data="subjectsTableData" border>
+        <el-table-column prop="question" label="题干"></el-table-column>
+        <el-table-column prop="type" label="题型"></el-table-column>
+        <el-table-column prop="difficulty" label="难度"></el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-button type="danger" @click="remove(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div class="save-wrapper">
+      <el-button type="primary" @click="savePaper">保存试卷</el-button>
+    </div>
+    <el-dialog title="添加试题" :visible.sync="addDialogVisible" width="80%">
+      <div class="dialog-tools-wrapper">
+        <el-select v-model="curSubjectType" placeholder="请选择试题类型">
+          <el-option
+            v-for="item in subjectTypes"
+            :key="item.label"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
+        <el-select
+          :style="{ marginLeft: '20px' }"
+          v-model="curDifficulty"
+          placeholder="请选择困难度"
+        >
+          <el-option
+            v-for="item in difficulties"
+            :key="item.label"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
+        <el-input
+          :style="{ marginLeft: '20px' }"
+          v-model="searchKeyWord"
+          placeholder="关键字"
+          >关键字</el-input
+        >
+        <el-button
+          :style="{ marginLeft: '20px' }"
+          type="primary"
+          @click="searchQuestion"
+          >搜索</el-button
+        >
+      </div>
+      <div class="dialog-table-wrapper">
+        <div class="dialog-table-header-wrapper">
+          <div class="dialog-table-header-selection">
+            <el-checkbox
+              v-model="chosenRadio"
+              @input="inputChosenRadio"
+            ></el-checkbox>
+          </div>
+          <div class="dialog-table-header-question">题干</div>
+        </div>
+        <div
+          v-for="item in searchSubject"
+          :key="item.id"
+          class="dialog-table-body-wrapper"
+        >
+          <div class="dialog-table-body-selection">
+            <el-checkbox
+              v-model="item.isChosen"
+              @input="inputItem(item)"
+            ></el-checkbox>
+          </div>
+          <div class="dialog-table-body-question">{{ item.question }}</div>
+        </div>
+        <el-pagination
+          :style="{ marginTop: '30px' }"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage"
+          :page-sizes="[10, 20, 30, 40]"
+          :page-size="curPageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="totalElements"
+        >
+        </el-pagination>
+      </div>
+      <div class="cur-chosen-subject-sum">
+        {{ "已选择 " + curChosenSelection.length + " 个试题" }}
+      </div>
+      <div slot="footer">
+        <el-button type="primary" @click="submitSubjects">提交</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  getOnlineExamSubject,
+  findPaperSubject,
+  savePaperAfterAutomatically
+} from "@/api/test.js";
+export default {
+  data() {
+    return {
+      subjectsTableData: [],
+      exclusiveIds: [],
+      subjectTypes: [
+        {
+          label: "单选题",
+          value: "单选题"
+        },
+        {
+          label: "多选题",
+          value: "多选题"
+        },
+        {
+          label: "判断题",
+          value: "判断题"
+        }
+      ],
+      curSubjectType: "",
+      curDifficulty: "",
+      searchKeyWord: "",
+      chosenRadio: false,
+      addDialogVisible: false,
+      difficulties: [
+        {
+          label: "简单",
+          value: "简单"
+        },
+        {
+          label: "一般",
+          value: "一般"
+        },
+        {
+          label: "困难",
+          value: "困难"
+        }
+      ],
+      searchSubject: [],
+      curChosenSelection: [],
+      currentPage: 1,
+      curPageSize: 10,
+      totalElements: 0,
+      deleteSubjects: []
+    };
+  },
+  async mounted() {
+    console.log(this.$route.params.name, "this.$route.params.name");
+    const params = {
+      page: 0,
+      size: 999,
+      paperId: this.$route.params.name,
+      type: "单选题"
+    };
+    let result = [];
+    await findPaperSubject(params).then(res => {
+      console.log(res, "findPaperSubject findPaperSubject findPaperSubject");
+      result = [
+        ...result,
+        ...res.content.map(item => {
+          return {
+            ...item,
+            type: "单选题"
+          };
+        })
+      ];
+    });
+    params.type = "多选题";
+    await findPaperSubject(params).then(res => {
+      console.log(res, "fsda fsda sd fsdf sda f");
+      result = [
+        ...result,
+        ...res.content.map(item => {
+          return {
+            ...item,
+            type: "多选题"
+          };
+        })
+      ];
+    });
+    params.type = "判断题";
+    await findPaperSubject(params).then(res => {
+      console.log(res, "sdfahuykfdsyafyweyf");
+      result = [
+        ...result,
+        ...res.content.map(item => {
+          return {
+            ...item,
+            type: "判断题"
+          };
+        })
+      ];
+    });
+    this.subjectsTableData = [...result];
+    this.subjectsTableData.forEach(item => {
+      item.id = item.subjectId;
+      item.isOrigin = true;
+    });
+    this.exclusiveIds = [...this.subjectsTableData.map(item => item.subjectId)];
+  },
+  methods: {
+    async getQuestions() {
+      const data = {
+        page: this.currentPage - 1,
+        exclusiveIds: this.exclusiveIds,
+        size: this.curPageSize
+      };
+      if (this.curSubjectType) {
+        data.type = this.curSubjectType;
+      }
+      if (this.curDifficulty) {
+        data.difficulty = this.curDifficulty;
+      }
+      if (this.searchKeyWord) {
+        data.question = this.searchKeyWord;
+      }
+      await getOnlineExamSubject(data).then(res => {
+        console.log(res, "getOnlineExamSubject getOnlineExamSubject");
+        this.searchSubject = [...res.content];
+        this.searchSubject.forEach(item => {
+          item.isChosen = false;
+          item.isOrigin = false;
+        });
+        this.searchSubject.forEach(subject => {
+          if (
+            this.curChosenSelection.filter(item => item.id === subject.id)
+              .length > 0
+          ) {
+            subject.isChosen = true;
+          } else {
+            subject.isChosen = false;
+          }
+        });
+        this.chosenRadio = false;
+        this.totalElements = res.totalElements;
+      });
+    },
+    searchQuestion() {
+      this.getQuestions();
+    },
+    remove(row) {
+      console.log(row, "reomove");
+      if (row.isOrigin) {
+        this.deleteSubjects.push(row);
+        console.log(
+          this.deleteSubjects,
+          "this.deleteSubjects this.deleteSubjects"
+        );
+      }
+      // this.exclusiveIds.push(row.id)
+      this.subjectsTableData.splice(this.subjectsTableData.indexOf(row), 1);
+    },
+    inputChosenRadio($event) {
+      console.log($event, "inputChosenRadio inputChosenRadio inputChosenRadio");
+      if ($event) {
+        this.searchSubject.forEach(item => {
+          if (item.isChosen === false) {
+            this.curChosenSelection.push(item);
+            item.isChosen = true;
+          }
+        });
+      } else {
+        this.searchSubject.forEach(item => {
+          if (item.isChosen === true) {
+            this.curChosenSelection.splice(
+              this.curChosenSelection.indexOf(item),
+              1
+            );
+          }
+        });
+      }
+    },
+    inputItem(item) {
+      console.log(item, "inputItem inputItem inputItem");
+      if (item.isChosen) {
+        if (this.curChosenSelection.indexOf(item) === -1) {
+          this.curChosenSelection.push(item);
+        }
+      } else {
+        if (this.curChosenSelection.indexOf(item) > -1) {
+          this.curChosenSelection.splice(
+            this.curChosenSelection.indexOf(item),
+            1
+          );
+        }
+      }
+    },
+    handleSizeChange(val) {
+      this.curPageSize = val;
+      this.getQuestions();
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      this.getQuestions();
+    },
+    addTester() {
+      this.addDialogVisible = true;
+      this.getQuestions();
+    },
+    submitSubjects() {
+      // this.subjectsTableData = [...this.subjectsTableData, ...this.curChosenSelection]
+      this.curChosenSelection.forEach(item => {
+        if (
+          !this.subjectsTableData.filter(subject => subject.id === item.id)
+            .length
+        ) {
+          this.subjectsTableData.push(item);
+        }
+      });
+      this.addDialogVisible = false;
+    },
+    savePaper() {
+      //this.subjectsTableData
+      //this.deleteSubjects
+      const data = {
+        addJudgementIds: this.subjectsTableData
+          .filter(item => item.type === "判断题")
+          .map(item => {
+            return {
+              subjectId: item.id,
+              paperId: this.$route.params.name
+            };
+          }),
+        addMultipleChoiceIds: this.subjectsTableData
+          .filter(item => item.type === "多选题")
+          .map(item => {
+            return {
+              subjectId: item.id,
+              paperId: this.$route.params.name
+            };
+          }),
+        addSingleChoiceIds: this.subjectsTableData
+          .filter(item => item.type === "单选题")
+          .map(item => {
+            return {
+              subjectId: item.id,
+              paperId: this.$route.params.name
+            };
+          }),
+        deleteJudgementIds: this.deleteSubjects
+          .filter(item => item.type === "判断题")
+          .map(item => {
+            return {
+              subjectId: item.id,
+              paperId: this.$route.params.name
+            };
+          }),
+        deleteMultipleChoiceIds: this.deleteSubjects
+          .filter(item => item.type === "多选题")
+          .map(item => {
+            return {
+              subjectId: item.id,
+              paperId: this.$route.params.name
+            };
+          }),
+        deleteSingleChoiceIds: this.deleteSubjects
+          .filter(item => item.type === "单选题")
+          .map(item => {
+            return {
+              subjectId: item.id,
+              paperId: this.$route.params.name
+            };
+          }),
+        paperId: this.$route.params.name
+      };
+      savePaperAfterAutomatically(data)
+        .then(res => {
+          this.$message({
+            type: "success",
+            message: "保存试卷成功"
+          });
+        })
+        .catch(() => {
+          this.$message.error("保存试卷失败");
+        });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.testerautosave-wrapper {
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+  .tools-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
+  }
+  .table-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
+  }
+  .save-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    display: flex;
+    justify-content: flex-end;
+    padding-right: 10%;
+  }
+}
+.dialog-tools-wrapper {
+  display: flex;
+  justify-content: space-around;
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+}
+.dialog-table-wrapper {
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+}
+.dialog-table-header-wrapper {
+  display: flex;
+  padding: 10px;
+  border-top: 1px solid #eee;
+  border-bottom: 1px solid #eee;
+  .dialog-table-header-selection {
+    flex-basis: 10%;
+  }
+  .dialog-table-header-question {
+    flex-basis: 90%;
+  }
+}
+.dialog-table-body-wrapper {
+  display: flex;
+  padding: 10px;
+  border-bottom: 1px solid #eee;
+  .dialog-table-body-selection {
+    flex-basis: 10%;
+  }
+  .dialog-table-body-question {
+    flex-basis: 90%;
+  }
+}
+.cur-chosen-subject-sum {
+  display: flex;
+  justify-content: flex-end;
+  margin-right: 30px;
+}
+</style>

src/views/exam/manage.vue

 <template>
-  <div>
-    <el-tabs v-model="activeName">
+  <div class="manage-total-wrapper">
+    <div class="manage-search-wrapper">
+      <el-select v-model="inputType" placeholder="--按题型--">
+        <el-option
+          v-for="item in typeOptions"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+        />
+      </el-select>
+      <el-input
+        v-model="inputKeyword"
+        style="margin-left: 20px;width: 280px;"
+        placeholder="关键字"
+      />
+      <el-button
+        style="margin-left: 20px;"
+        type="success"
+        size="medium"
+        @click="initAllQuestion"
+        >搜索</el-button
+      >
+    </div>
+    <div class="manage-tools-wrapper">
+      <el-button
+        size="small"
+        icon="el-icon-plus"
+        type="primary"
+        @click="singleDialogShow"
+        >单选题</el-button
+      >
+      <el-button
+        style="margin-left: 20px;"
+        size="small"
+        icon="el-icon-plus"
+        type="primary"
+        @click="multiDialogShow"
+        >多选题</el-button
+      >
+      <el-button
+        style="margin-left: 20px;"
+        size="small"
+        icon="el-icon-plus"
+        type="primary"
+        @click="justifyDialogShow"
+        >判断题</el-button
+      >
+    </div>
+    <div class="manage-operate-wrapper">
+      <el-button
+        type="warning"
+        :disabled="disableEditBtn"
+        @click="updateQuestion"
+        >编辑</el-button
+      >
+      <el-button type="danger" :disabled="disableDelBtn" @click="deleteQuestion"
+        >删除</el-button
+      >
+    </div>
+    <div class="manage-table-wrapper">
+      <el-table :data="subjectTable" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" />
+        <el-table-column label="题干" prop="title" />
+        <el-table-column label="类型" prop="type" />
+        <!--<el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-button type="warning" @click="updateQuestion(scope.row)"
+              >编辑</el-button
+            >
+            <el-button type="danger" @click="deleteQuestion(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>-->
+      </el-table>
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage"
+        :page-sizes="[10, 20, 30, 40]"
+        :page-size="curPageSize"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="totalElements"
+      >
+      </el-pagination>
+    </div>
+    <el-dialog title="单选题" :visible.sync="singleEditDialogShow" width="70%">
+      <el-form
+        ref="singleAddForm"
+        :model="singleFormInfo"
+        label-width="120px"
+        :rules="singleRules"
+        v-if="singleEditDialogShow"
+      >
+        <el-form-item label="题干" prop="question">
+          <el-input v-model="singleFormInfo.question"></el-input>
+        </el-form-item>
+        <el-form-item label="困难程度" prop="difficulty">
+          <el-select v-model="singleFormInfo.difficulty">
+            <el-option
+              v-for="item in difficulities"
+              :key="item.label"
+              :label="item.lable"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="选项A" prop="optiona">
+          <el-input v-model="singleFormInfo.optiona"></el-input>
+          <div>
+            <div>
+              正确选项:&nbsp;&nbsp;&nbsp;<el-radio
+                v-model="singleFormInfo.answer"
+                label="A"
+              />
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="选项B" prop="optionb">
+          <el-input v-model="singleFormInfo.optionb"></el-input>
+          <div>
+            <div>
+              正确选项:&nbsp;&nbsp;&nbsp;<el-radio
+                v-model="singleFormInfo.answer"
+                label="B"
+              />
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="选项C" prop="optionc">
+          <el-input v-model="singleFormInfo.optionc"></el-input>
+          <div>
+            <div>
+              正确选项:&nbsp;&nbsp;&nbsp;<el-radio
+                v-model="singleFormInfo.answer"
+                label="C"
+              />
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="选项D" prop="optiond">
+          <el-input v-model="singleFormInfo.optiond"></el-input>
+          <div>
+            <div>
+              正确选项:&nbsp;&nbsp;&nbsp;<el-radio
+                v-model="singleFormInfo.answer"
+                label="D"
+              />
+            </div>
+          </div>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button type="info" @click="singleEditDialogShow = false"
+          >取消</el-button
+        >
+        <el-button type="primary" @click="submitSingleForm">提交</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="多选题" :visible.sync="multiEditDialogShow" width="70%">
+      <el-form
+        ref="multiAddForm"
+        :model="multiFormInfo"
+        label-width="120px"
+        :rules="multiRules"
+        v-if="multiEditDialogShow"
+      >
+        <el-form-item label="题干" prop="question">
+          <el-input v-model="multiFormInfo.question"></el-input>
+        </el-form-item>
+        <el-form-item label="困难程度" prop="difficulty">
+          <el-select v-model="multiFormInfo.difficulty">
+            <el-option
+              v-for="item in difficulities"
+              :key="item.label"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="选项A" prop="optiona">
+          <el-input v-model="multiFormInfo.optiona"></el-input>
+          <div class="other-wrapper">
+            <div class="">
+              正确选项:&nbsp;&nbsp;&nbsp;<el-checkbox v-model="multiAnswer.A" />
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="选项B" prop="optionb">
+          <el-input v-model="multiFormInfo.optionb"></el-input>
+          <div class="other-wrapper">
+            <div class="">
+              正确选项:&nbsp;&nbsp;&nbsp;<el-checkbox v-model="multiAnswer.B" />
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="选项C" prop="optionc">
+          <el-input v-model="multiFormInfo.optionc"></el-input>
+          <div class="other-wrapper">
+            <div class="">
+              正确选项:&nbsp;&nbsp;&nbsp;<el-checkbox v-model="multiAnswer.C" />
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="选项D" prop="optionD">
+          <el-input v-model="multiFormInfo.optiond"></el-input>
+          <div class="other-wrapper">
+            <div class="">
+              正确选项:&nbsp;&nbsp;&nbsp;<el-checkbox v-model="multiAnswer.D" />
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="解析" prop="analysis">
+          <el-input v-model="multiFormInfo.analysis"></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button type="info" @click="multiEditDialogShow = false"
+          >取消</el-button
+        >
+        <el-button type="primary" @click="submitMultiForm">提交</el-button>
+      </div>
+    </el-dialog>
+    <el-dialog title="判断题" :visible.sync="justifyEditDialogShow" width="70%">
+      <el-form
+        ref="justifyAddForm"
+        :model="justifyFormInfo"
+        label-width="120px"
+        :rules="justifyRules"
+        v-if="justifyEditDialogShow"
+      >
+        <el-form-item label="题干" prop="question">
+          <el-input v-model="justifyFormInfo.question"></el-input>
+        </el-form-item>
+        <el-form-item label="困难程度" prop="difficulty">
+          <el-select v-model="justifyFormInfo.difficulty">
+            <el-option
+              v-for="item in difficulities"
+              :key="item.label"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="答案" prop="answer">
+          <el-radio v-model="justifyFormInfo.answer" label="对" />
+          <el-radio v-model="justifyFormInfo.answer" label="错" />
+        </el-form-item>
+        <el-form-item label="解析" prop="analysis">
+          <el-input v-model="justifyFormInfo.analysis"></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button type="info" @click="justifyEditDialogShow = false"
+          >取消</el-button
+        >
+        <el-button type="primary" @click="submitJustifyForm">提交</el-button>
+      </div>
+    </el-dialog>
+    <!-- <el-tabs v-model="activeName">
       <el-tab-pane label="题目管理" name="题目管理">
         <div class="manage-search-wrapper">
           <el-select
@@ -87,152 +345,534 @@
           />
         </div>
       </el-tab-pane>
-    </el-tabs>
+    </el-tabs> -->
   </div>
 </template>
 
 <script>
+import {
+  getOnlineExamSubject,
+  putOnlineExamSubject,
+  deleteOnlineExamSubject
+} from "@/api/test.js";
 export default {
   data() {
     return {
-      activeName: '题目管理',
+      disableEditBtn: true,
+      disableDelBtn: true,
+      singleFormInfo: {
+        question: "",
+        difficulty: "",
+        answer: "",
+        id: "",
+        libraryId: "",
+        optiona: "",
+        optionb: "",
+        optionc: "",
+        optiond: "",
+        analysis: ""
+      },
+      singleRules: {
+        question: [
+          {
+            required: true,
+            message: "请输入题干",
+            trigger: "blur"
+          }
+        ],
+        difficulty: [
+          {
+            required: true,
+            message: "请选择困难程度",
+            trigger: "change"
+          }
+        ],
+        optiona: [
+          {
+            required: true,
+            message: "请输入选项",
+            trigger: "blur"
+          }
+        ],
+        optionb: [
+          {
+            required: true,
+            message: "请输入选项",
+            trigger: "blur"
+          }
+        ],
+        optionc: [
+          {
+            required: true,
+            message: "请输入选项",
+            trigger: "blur"
+          }
+        ],
+        optiond: [
+          {
+            required: true,
+            message: "请输入选项",
+            trigger: "blur"
+          }
+        ],
+        analysis: [
+          {
+            required: true,
+            message: "请输入解析",
+            trigger: "blur"
+          }
+        ]
+      },
+      multiFormInfo: {
+        question: "",
+        difficulty: "",
+        answer: "",
+        id: "",
+        libraryId: "",
+        optiona: "",
+        optionb: "",
+        optionc: "",
+        optiond: "",
+        analysis: ""
+      },
+      multiRules: {
+        question: [
+          {
+            required: true,
+            message: "请输入题干",
+            trigger: "blur"
+          }
+        ],
+        difficulty: [
+          {
+            required: true,
+            message: "请选择困难程度",
+            trigger: "change"
+          }
+        ],
+        optiona: [
+          {
+            required: true,
+            message: "请输入选项",
+            trigger: "blur"
+          }
+        ],
+        optionb: [
+          {
+            required: true,
+            message: "请输入选项",
+            trigger: "blur"
+          }
+        ],
+        optionc: [
+          {
+            required: true,
+            message: "请输入选项",
+            trigger: "blur"
+          }
+        ],
+        optiond: [
+          {
+            required: true,
+            message: "请输入选项",
+            trigger: "blur"
+          }
+        ],
+        analysis: [
+          {
+            required: true,
+            message: "请输入解析",
+            trigger: "blur"
+          }
+        ]
+      },
+      justifyFormInfo: {
+        question: "",
+        answer: "",
+        id: "",
+        difficulty: "",
+        libraryId: "",
+        analysis: ""
+      },
+      justifyRules: {
+        question: [
+          {
+            required: true,
+            message: "请输入问题",
+            trigger: "blur"
+          }
+        ],
+        difficulty: [
+          {
+            required: true,
+            message: "请选择困难度",
+            trigger: "change"
+          }
+        ],
+        analysis: [
+          {
+            required: true,
+            message: "请选择解析",
+            trigger: "blur"
+          }
+        ]
+      },
+      multiAnswer: {
+        A: false,
+        B: false,
+        C: false,
+        D: false
+      },
+      singleEditDialogShow: false,
+      multiEditDialogShow: false,
+      justifyEditDialogShow: false,
+      difficulities: [
+        {
+          label: "简单",
+          value: "简单"
+        },
+        {
+          label: "一般",
+          value: "一般"
+        },
+        {
+          label: "困难",
+          value: "困难"
+        }
+      ],
+      activeName: "题目管理",
       typeOptions: [
         {
-          label: '单选题',
-          value: '单选题'
+          label: "单选题",
+          value: "单选题"
         },
         {
-          label: '多选题',
-          value: '多选题'
+          label: "多选题",
+          value: "多选题"
         },
         {
-          label: '判断题',
-          value: '判断题'
+          label: "判断题",
+          value: "判断题"
         }
       ],
-      inputType: '',
-      inputKeyword: '',
+      inputType: "",
+      inputKeyword: "",
       subjectTable: [
         {
-          title: '乡镇人民政府不具备安全生产监督管理的职责。（）',
-          type: '判断题'
+          title: "乡镇人民政府不具备安全生产监督管理的职责。（）",
+          type: "判断题"
         },
         {
-          title: '工会对生产经营单位的安全生产工作无监督的权力和义务。（）',
-          type: '判断题'
+          title: "工会对生产经营单位的安全生产工作无监督的权力和义务。（）",
+          type: "判断题"
         },
         {
-          title: '道路交通安全适用于《中华人民共和国安全生产法》。（）',
-          type: '判断题'
+          title: "道路交通安全适用于《中华人民共和国安全生产法》。（）",
+          type: "判断题"
         }
       ],
       singleSelectionShow: false,
-      searchTesterName: '',
+      searchTesterName: "",
       testerTableData: [
         {
-          name: '大学习、大培训、大考试试卷21',
-          state: '已发布',
+          name: "大学习、大培训、大考试试卷21",
+          state: "已发布",
           subjectSum: 90,
           scoreSum: 100.0
         },
         {
-          name: '大学习、大培训、大考试试卷20',
-          state: '已发布',
+          name: "大学习、大培训、大考试试卷20",
+          state: "已发布",
           subjectSum: 90,
           scoreSum: 100.0
         },
         {
-          name: '大学习、大培训、大考试试卷19',
-          state: '已发布',
+          name: "大学习、大培训、大考试试卷19",
+          state: "已发布",
           subjectSum: 90,
           scoreSum: 100.0
         },
         {
-          name: '大学习、大培训、大考试试卷18',
-          state: '已发布',
+          name: "大学习、大培训、大考试试卷18",
+          state: "已发布",
           subjectSum: 90,
           scoreSum: 100.0
         },
         {
-          name: '大学习、大培训、大考试试卷17',
-          state: '已发布',
+          name: "大学习、大培训、大考试试卷17",
+          state: "已发布",
           subjectSum: 90,
           scoreSum: 100.0
         },
         {
-          name: '大学习、大培训、大考试试卷16',
-          state: '已发布',
+          name: "大学习、大培训、大考试试卷16",
+          state: "已发布",
           subjectSum: 90,
           scoreSum: 100.0
         },
         {
-          name: '大学习、大培训、大考试试卷15',
-          state: '已发布',
+          name: "大学习、大培训、大考试试卷15",
+          state: "已发布",
           subjectSum: 90,
           scoreSum: 100.0
         },
         {
-          name: '大学习、大培训、大考试试卷14',
-          state: '已发布',
+          name: "大学习、大培训、大考试试卷14",
+          state: "已发布",
           subjectSum: 90,
           scoreSum: 100.0
         },
         {
-          name: '大学习、大培训、大考试试卷13',
-          state: '已发布',
+          name: "大学习、大培训、大考试试卷13",
+          state: "已发布",
           subjectSum: 90,
           scoreSum: 100.0
         }
       ],
       multipleSelection: [],
-      totalSize: 40,
-      pageSize: 10,
+      totalElements: 40,
+      curPageSize: 10,
       currentPage: 1
-    }
+    };
   },
   mounted() {
-    this.$route.params.name
+    this.$route.params.name;
+    console.log(
+      this.$route.params.name,
+      "this.$route.params.name this.$route.params.name this.$route.params.name"
+    );
+    this.initAllQuestion();
   },
   methods: {
+    async initAllQuestion() {
+      const params = {
+        page: this.currentPage - 1,
+        size: this.curPageSize
+      };
+      if (this.inputType) {
+        params.type = this.inputType;
+      }
+      if (this.inputKeyword) {
+        params.question = this.inputKeyword;
+      }
+      getOnlineExamSubject(params).then(res => {
+        this.subjectTable = [
+          ...res.content.map(item => {
+            return {
+              ...item,
+              title: item.question,
+              type: item.type
+            };
+          })
+        ];
+        this.totalElements = res.totalElements;
+      });
+    },
     singleDialogShow() {
       // 显示单选题
       this.$router.push({
-        path: '/train/exam/single/11223344'
-      })
+        path: "/train/exam/single/" + this.$route.params.name
+      });
     },
     multiDialogShow() {
       // 显示多选题
       this.$router.push({
-        path: '/train/exam/multi/2345654'
-      })
+        path: "/train/exam/multi/" + this.$route.params.name
+      });
     },
     justifyDialogShow() {
       // 显示判断题
       this.$router.push({
-        path: '/train/exam/justify/44335566'
-      })
+        path: "/train/exam/justify/" + this.$route.params.name
+      });
     },
     handleSelectionChange(val) {
-      this.multipleSelection = val
+      this.disableEditBtn = true;
+      this.disableDelBtn = true;
+      this.multipleSelection = val;
+      if (this.multipleSelection.length === 1) {
+        this.disableEditBtn = false;
+      }
+      if (this.multipleSelection.length > 0) {
+        this.disableDelBtn = false;
+      }
     },
     handleCurrentChange(val) {
-      this.currentPage = val
+      this.currentPage = val;
+      this.initAllQuestion();
     },
     handleSizeChange(val) {
-      this.pageSize = val
+      this.curPageSize = val;
+      this.initAllQuestion();
     },
     makeTester() {
       // 手动组卷
       this.$router.push({
-        path: '/train/exam/maketester/123442211'
+        path: "/train/exam/maketester/123442211"
+      });
+    },
+    updateQuestion() {
+      const row = this.multipleSelection[0];
+      console.log(row, "updateQuestion updateQuestion updateQuestion");
+      if (row.type === "单选题") {
+        this.singleFormInfo = { ...row };
+        this.singleEditDialogShow = true;
+      }
+      if (row.type === "多选题") {
+        this.multiFormInfo = { ...row };
+        this.multiAnswer = {
+          A: false,
+          B: false,
+          C: false,
+          D: false
+        };
+        if (row.answer.indexOf("、") > -1) {
+          row.answer.split("、").forEach(item => {
+            this.multiAnswer[item] = true;
+          });
+        } else {
+          this.multiAnswer[row.answer] = true;
+        }
+        this.multiEditDialogShow = true;
+      }
+      if (row.type === "判断题") {
+        this.justifyFormInfo = { ...row };
+        this.justifyEditDialogShow = true;
+      }
+    },
+    deleteQuestion(row) {
+      console.log(row, "deleteQuestion deleteQuestion");
+      this.$confirm("此操作将永久删除题目, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          console.log("没进来么");
+          deleteOnlineExamSubject(this.multipleSelection.map(item => item.id))
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+              this.initAllQuestion();
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
+    },
+    submitSingleForm() {
+      this.$refs.singleAddForm.validate(valid => {
+        if (valid) {
+          putOnlineExamSubject(this.singleFormInfo)
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "修改成功"
+              });
+              this.singleEditDialogShow = false;
+              this.initAllQuestion();
+            })
+            .catch(() => {
+              this.$message.error("修改失败");
+            });
+        }
+      });
+    },
+    submitMultiForm() {
+      this.$refs.multiAddForm.validate(valid => {
+        if (valid) {
+          if (
+            !(
+              this.multiAnswer.A ||
+              this.multiAnswer.B ||
+              this.multiAnswer.C ||
+              this.multiAnswer.D
+            )
+          ) {
+            this.$message.error("添加失败");
+            return;
+          }
+          const result = [];
+          for (const key in this.multiAnswer) {
+            result.push(key);
+          }
+          this.multiFormInfo.answer = result.join("、");
+          putOnlineExamSubject(this.multiFormInfo)
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.multiEditDialogShow = false;
+              this.initAllQuestion();
+            })
+            .catch(() => {
+              this.$message.error("修改失败");
+            });
+        }
+      });
+    },
+    submitJustifyForm() {
+      this.$refs.justifyAddForm.validate(valid => {
+        if (valid) {
+          putOnlineExamSubject(this.justifyFormInfo)
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "修改成功"
+              });
+              this.initAllQuestion();
+              this.justifyEditDialogShow = false;
+            })
+            .catch(() => {
+              this.$message.error("修改失败");
+            });
+        }
+      });
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
+.manage-search-wrapper {
+  display: flex;
+}
+.manage-total-wrapper {
+  padding: 10px;
+  margin: 10px auto;
+  border-radius: 5px;
   .manage-search-wrapper {
-    display: flex;
+    padding: 10px;
+    margin: 10px auto;
+    border-radius: 5px;
+    background-color: #fff;
+  }
+  .manage-tools-wrapper {
+    padding: 10px;
+    margin: 10px auto;
+    border-radius: 5px;
+    background-color: #fff;
+  }
+  .manage-operate-wrapper {
+    padding: 10px;
+    margin: 10px auto;
+    border-radius: 5px;
+    background-color: #fff;
   }
+  .manage-table-wrapper {
+    padding: 10px;
+    margin: 10px auto;
+    border-radius: 5px;
+    background-color: #fff;
+  }
+}
 </style>

src/views/exam/multi.vue

 <template>
   <div class="multi-selection-wrapper">
-    <el-form
-      ref="addform"
-      :model="formInfo"
-      label-width="120px"
-      :rules="rules"
-    >
-      <el-form-item
-        label="题干"
-        prop="outline"
-      >
+    <el-form ref="addform" :model="formInfo" label-width="120px" :rules="rules">
+      <el-form-item label="题干" prop="outline">
         <el-input
           v-model="formInfo.outline"
           type="textarea"
           autosize=""
+          :style="{ width: '70%' }"
         />
       </el-form-item>
-      <el-form-item v-for="(item,index) in curIndex" :label="item.key" :prop="item.key">
+      <el-form-item label="请选择难度" prop="difficulty">
+        <el-select
+          v-model="formInfo.difficulty"
+          placeholder="请选择难度"
+          :style="{ width: '70%' }"
+        >
+          <el-option
+            v-for="item in difficulties"
+            :key="item.label"
+            :label="item.label"
+            :value="item.label"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item
+        v-for="item in curIndex"
+        :key="item.key"
+        :label="item.key"
+        :prop="item.key"
+      >
         <el-input
-          v-model="formInfo[item]"
+          v-model="formInfo[item.key]"
           type="textarea"
           autosize
+          :style="{ width: '70%' }"
         />
         <div class="other-wrapper">
           <div class="">
-            正确选项:<el-checkbox v-model="item.value" />
+            正确选项:&nbsp;&nbsp;&nbsp;<el-checkbox v-model="item.value" />
           </div>
-          <el-button v-show="index === curIndex.length -1" icon="el-icon-delete" @click="deleteItem" />
+          <!-- <el-button v-show="index === curIndex.length - 1" icon="el-icon-delete" @click="deleteItem" /> -->
         </div>
       </el-form-item>
-      <div class="addSelectionBtn-wrapper">
+      <!-- <div class="addSelectionBtn-wrapper">
         <el-button type="success" @click="addSelection">新增选项</el-button>
-      </div>
-      <el-form-item
-        label="解析"
-        prop="analysis"
-      >
+      </div> -->
+      <el-form-item label="解析" prop="analysis">
         <el-input
           v-model="formInfo.analysis"
           type="textarea"
           autosize
+          :style="{ width: '70%' }"
         />
       </el-form-item>
-      <el-form-item
+      <!-- <el-form-item
         label="分值"
         prop="score"
       >
@@ -51,205 +62,202 @@
           type="textarea"
           autosize
         />
-      </el-form-item>
+      </el-form-item> -->
     </el-form>
     <div class="tools-wrapper">
       <el-button type="primary" @click="saveAndAdd">保存并继续添加</el-button>
-      <el-button type="primary" @click="save">保存</el-button>
+      <!-- <el-button type="primary" @click="save">保存</el-button> -->
       <el-button type="text" @click="goback">返回</el-button>
     </div>
   </div>
 </template>
 
 <script>
+import { postOnlineExamSubject } from "@/api/test.js";
 export default {
   data() {
     return {
       totalIndex: [
         {
-          key: 'A',
+          key: "A",
           value: false
         },
         {
-          key: 'B',
+          key: "B",
           value: false
         },
         {
-          key: 'C',
+          key: "C",
           value: false
         },
         {
-          key: 'D',
+          key: "D",
           value: false
         },
         {
-          key: 'E',
+          key: "E",
           value: false
         },
         {
-          key: 'F',
+          key: "F",
           value: false
         },
         {
-          key: 'G',
+          key: "G",
           value: false
         },
         {
-          key: 'H',
+          key: "H",
           value: false
         },
         {
-          key: 'I',
+          key: "I",
           value: false
         },
         {
-          key: 'J',
+          key: "J",
           value: false
         },
         {
-          key: 'K',
+          key: "K",
           value: false
         },
         {
-          key: 'L',
+          key: "L",
           value: false
         },
         {
-          key: 'M',
+          key: "M",
           value: false
         },
         {
-          key: 'N',
+          key: "N",
           value: false
         },
         {
-          key: 'O',
+          key: "O",
           value: false
         },
         {
-          key: 'P',
+          key: "P",
           value: false
         },
         {
-          key: 'Q',
+          key: "Q",
           value: false
         },
         {
-          key: 'R',
+          key: "R",
           value: false
         },
         {
-          key: 'S',
+          key: "S",
           value: false
         },
         {
-          key: 'T',
+          key: "T",
           value: false
         },
         {
-          key: 'U',
+          key: "U",
           value: false
         },
         {
-          key: 'V',
+          key: "V",
           value: false
         },
         {
-          key: 'W',
+          key: "W",
           value: false
         },
         {
-          key: 'X',
+          key: "X",
           value: false
         },
         {
-          key: 'Y',
+          key: "Y",
           value: false
         },
         {
-          key: 'Z',
+          key: "Z",
           value: false
         }
       ],
+      difficulties: [
+        {
+          label: "简单",
+          value: "简单"
+        },
+        {
+          label: "一般",
+          value: "一般"
+        },
+        {
+          label: "困难",
+          value: "困难"
+        }
+      ],
       curIndex: [
         {
-          key: 'A',
+          key: "A",
           value: false
         },
         {
-          key: 'B',
+          key: "B",
           value: false
         },
         {
-          key: 'C',
+          key: "C",
           value: false
         },
         {
-          key: 'D',
+          key: "D",
+          value: false
+        },
+        {
+          key: "E",
+          value: false
+        },
+        {
+          key: "F",
           value: false
         }
       ],
       formInfo: {
-        outline: '',
-        analysis: '',
-        score: '',
-        A: '',
-        B: '',
-        C: '',
-        D: ''
+        outline: "",
+        analysis: "",
+        difficulty: "",
+        A: "",
+        B: "",
+        C: "",
+        D: "",
+        E: "",
+        F: ""
       },
       rules: {
-        outline: [
+        difficulty: [
           {
             required: true,
-            message: '请输入题干',
-            trigger: 'blur'
+            message: "请选择难度",
+            trigger: "change"
           }
         ],
-        analysis: [
-          {
-            required: true,
-            message: '请输入解析',
-            trigger: 'blur'
-          }
-        ],
-        score: [
-          {
-            required: true,
-            message: '请输入分值',
-            trigger: 'blur'
-          }
-        ],
-        A: [
-          {
-            required: true,
-            message: '请输入选项内容',
-            trigger: 'blur'
-          }
-        ],
-        B: [
-          {
-            required: true,
-            message: '请输入选项内容',
-            trigger: 'blur'
-          }
-        ],
-        C: [
+        outline: [
           {
             required: true,
-            message: '请输入选项内容',
-            trigger: 'blur'
+            message: "请输入题干",
+            trigger: "blur"
           }
         ],
-        D: [
+        analysis: [
           {
             required: true,
-            message: '请输入选项内容',
-            trigger: 'blur'
+            message: "请输入解析",
+            trigger: "blur"
           }
         ]
       }
-    }
+    };
   },
   mounted() {
     //
@@ -257,36 +265,104 @@ export default {
   methods: {
     addSelection() {
       //
-      const tempArr = this.totalIndex.slice(0, this.curIndex.length + 1)
+      const tempArr = this.totalIndex.slice(0, this.curIndex.length + 1);
       for (let i = 0; i < this.curIndex.length; i++) {
-        tempArr[i].value = this.curIndex[i].value
+        tempArr[i].value = this.curIndex[i].value;
       }
-      this.curIndex = tempArr
-      this.formInfo[this.curIndex[this.curIndex.length - 1].key] = ''
+      this.curIndex = tempArr;
+      this.formInfo[this.curIndex[this.curIndex.length - 1].key] = "";
       this.rules[this.curIndex[this.curIndex.length - 1].key] = [
         {
           required: true,
-          message: '请输入选项内容',
-          trigger: 'blur'
-        }]
+          message: "请输入选项内容",
+          trigger: "blur"
+        }
+      ];
     },
     goback() {
       //
       this.$router.push({
-        path: '/exam/manage/5556666565'
-      })
+        path: "/exam/manage/" + this.$route.params.name
+      });
     },
     save() {},
-    saveAndAdd() {},
+    saveAndAdd() {
+      this.$refs.addform.validate(valid => {
+        if (valid) {
+          console.log(this.formInfo, "this.formInfo");
+          console.log(this.curIndex, "this.curIndex this.curIndex");
+          if (this.curIndex.filter(item => item.value === true).length === 0) {
+            this.$message.error("请选择正确答案");
+            return;
+          } else {
+            const data = {
+              analysis: this.formInfo.analysis,
+              answer: this.curIndex
+                .filter(item => item.value === true)
+                .map(item => item.key)
+                .join("、"),
+              difficulty: this.formInfo.difficulty,
+              libraryId: this.$route.params.name,
+              optiona: this.formInfo.A,
+              optionb: this.formInfo.B,
+              optionc: this.formInfo.C,
+              optiond: this.formInfo.D,
+              question: this.formInfo.outline,
+              type: "多选题"
+            };
+            if (this.formInfo.E) {
+              data.optione = this.formInfo.E;
+            }
+            if (this.formInfo.F) {
+              data.optionf = this.formInfo.F;
+            }
+            postOnlineExamSubject(data)
+              .then(res => {
+                this.$message({
+                  type: "success",
+                  message: "添加成功"
+                });
+                this.formInfo = {
+                  outline: "",
+                  analysis: "",
+                  A: "",
+                  B: "",
+                  C: "",
+                  D: "",
+                  E: "",
+                  F: "",
+                  difficulty: this.formInfo.difficulty
+                };
+                this.curIndex.forEach(item => {
+                  item.value = false;
+                });
+              })
+              .catch(() => {
+                this.$message.error("添加失败");
+              });
+          }
+        }
+      });
+      // postOnlineExamSubject()
+    },
     deleteItem() {
-      const popGet = this.curIndex.pop()
-      delete this.formInfo[popGet.key]
-      delete this.rules[popGet.key]
+      const popGet = this.curIndex.pop();
+      delete this.formInfo[popGet.key];
+      delete this.rules[popGet.key];
     }
   }
-}
+};
 </script>
 
-<style>
-
+<style lang="scss" scoped>
+.multi-selection-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  .tools-wrapper {
+    display: flex;
+    justify-content: flex-end;
+    padding-right: 25%;
+  }
+}
 </style>

src/views/exam/single.vue

 <template>
   <div class="single-selection-wrapper">
-    <el-form
-      ref="addform"
-      :model="formInfo"
-      label-width="120px"
-      :rules="rules"
-    >
-      <el-form-item
-        label="题干"
-        prop="outline"
-      >
+    <el-form ref="addform" :model="formInfo" label-width="120px" :rules="rules">
+      <el-form-item label="题干" prop="outline">
         <el-input
           v-model="formInfo.outline"
           type="textarea"
           autosize
+          :style="{ width: '70%' }"
         />
       </el-form-item>
-      <el-form-item v-for="(item,index) in curIndex" :label="item" :prop="item">
+      <el-form-item label="题目难度" prop="difficulty">
+        <el-select v-model="formInfo.difficulty" :style="{ width: '70%' }">
+          <el-option
+            v-for="item in difficulties"
+            :key="item.label"
+            :label="item.label"
+            :value="item.value"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item
+        v-for="(item, index) in curIndex"
+        :key="item + index"
+        :label="item"
+        :prop="item"
+      >
         <el-input
           v-model="formInfo[item]"
           type="textarea"
           autosize
+          :style="{ width: '70%' }"
         />
         <div class="other-wrapper">
           <div class="">
-            正确选项:<el-radio v-model="answer" :label="item" />
+            正确选项:&nbsp;&nbsp;<el-radio v-model="answer" :label="item" />
           </div>
-          <el-button v-show="index === curIndex.length -1" icon="el-icon-delete" @click="cancelSelection" />
+          <!-- <el-button v-show="index === curIndex.length -1" icon="el-icon-delete" @click="cancelSelection" /> -->
         </div>
       </el-form-item>
-      <div class="addSelectionBtn-wrapper">
+      <!-- <div class="addSelectionBtn-wrapper">
         <el-button type="success" @click="addSelection">新增选项</el-button>
-      </div>
-      <el-form-item
-        label="解析"
-        prop="analysis"
-      >
+      </div> -->
+      <el-form-item label="解析" prop="analysis">
         <el-input
           v-model="formInfo.analysis"
           type="textarea"
           autosize
+          :style="{ width: '70%' }"
         />
       </el-form-item>
-      <el-form-item
+      <!-- <el-form-item
         label="分值"
         prop="score"
       >
@@ -51,109 +58,127 @@
           type="textarea"
           autosize
         />
-      </el-form-item>
+      </el-form-item> -->
     </el-form>
     <div class="tools-wrapper">
       <el-button type="primary" @click="saveAndAdd">保存并继续添加</el-button>
-      <el-button type="primary" @click="saveSingleSelection">保存</el-button>
+      <!-- <el-button type="primary" @click="saveSingleSelection">保存</el-button> -->
       <el-button type="text" @click="goback">返回</el-button>
     </div>
   </div>
 </template>
 
 <script>
+import { postOnlineExamSubject } from "@/api/test.js";
 export default {
   data() {
     return {
-      totalIndex: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'],
-      curIndex: ['A', 'B', 'C', 'D'],
-      answer: '',
+      totalIndex: [
+        "A",
+        "B",
+        "C",
+        "D",
+        "E",
+        "F",
+        "G",
+        "H",
+        "I",
+        "J",
+        "K",
+        "L",
+        "M",
+        "N",
+        "O",
+        "P",
+        "Q",
+        "R",
+        "S",
+        "T",
+        "U",
+        "V",
+        "W",
+        "X",
+        "Y",
+        "Z"
+      ],
+      curIndex: ["A", "B", "C", "D", "E", "F"],
+      answer: "",
       formInfo: {
-        outline: '',
-        analysis: '',
-        score: '',
-        A: '',
-        B: '',
-        C: '',
-        D: ''
+        outline: "",
+        analysis: "",
+        A: "",
+        B: "",
+        C: "",
+        D: "",
+        E: "",
+        F: "",
+        difficulty: ""
       },
       rules: {
-        outline: [
-          {
-            required: true,
-            message: '请输入题干',
-            trigger: 'blur'
-          }
-        ],
-        analysis: [
-          {
-            required: true,
-            message: '请输入解析',
-            trigger: 'blur'
-          }
-        ],
-        score: [
-          {
-            required: true,
-            message: '请输入分值',
-            trigger: 'blur'
-          }
-        ],
-        A: [
+        difficulty: [
           {
             required: true,
-            message: '请输入选项内容',
-            trigger: 'blur'
+            message: "请选择题目难度",
+            trigger: "change"
           }
         ],
-        B: [
-          {
-            required: true,
-            message: '请输入选项内容',
-            trigger: 'blur'
-          }
-        ],
-        C: [
+        outline: [
           {
             required: true,
-            message: '请输入选项内容',
-            trigger: 'blur'
+            message: "请输入题干",
+            trigger: "blur"
           }
         ],
-        D: [
+        analysis: [
           {
             required: true,
-            message: '请输入选项内容',
-            trigger: 'blur'
+            message: "请输入解析",
+            trigger: "blur"
           }
         ]
-      }
-    }
+      },
+      difficulties: [
+        {
+          label: "简单",
+          value: "简单"
+        },
+        {
+          label: "一般",
+          value: "一般"
+        },
+        {
+          label: "困难",
+          value: "困难"
+        }
+      ]
+    };
+  },
+  mounted() {
+    console.log(this.$route.params.name, "this.$route.params.name");
   },
-  mounted() {},
   methods: {
     addSelection() {
       // 新增选项
-      this.curIndex = this.totalIndex.slice(0, this.curIndex.length + 1)
-      this.formInfo[this.curIndex[this.curIndex.length - 1]] = ''
+      this.curIndex = this.totalIndex.slice(0, this.curIndex.length + 1);
+      this.formInfo[this.curIndex[this.curIndex.length - 1]] = "";
       this.rules[this.curIndex[this.curIndex.length - 1]] = [
         {
           required: true,
-          message: '请输入内容',
-          trigger: 'blur'
+          message: "请输入内容",
+          trigger: "blur"
         }
-      ]
+      ];
     },
     cancelSelection() {
-      const tempGot = this.curIndex.pop()
-      delete this.rules[tempGot]
-      delete this.formInfo[tempGot]
+      const tempGot = this.curIndex.pop();
+      delete this.rules[tempGot];
+      delete this.formInfo[tempGot];
     },
     goback() {
-      // goback
+      goback;
       this.$router.push({
-        path: '/exam/manage/112233'
-      })
+        path: "/exam/manage/" + this.$route.params.name
+      });
     },
     saveSingleSelection() {
       // axios
@@ -162,14 +187,73 @@ export default {
     saveAndAdd() {
       // axios
       // 恢复初始状态
+      const data = {
+        analysis: this.formInfo.analysis,
+        answer: this.answer,
+        difficulty: this.formInfo.difficulty,
+        libraryId: this.$route.params.name,
+        optiona: this.formInfo.A,
+        optionb: this.formInfo.B,
+        optionc: this.formInfo.C,
+        optiond: this.formInfo.D,
+        question: this.formInfo.outline,
+        type: "单选题"
+      };
+      if (this.formInfo.E) {
+        data.optione = this.formInfo.E;
+      }
+      if (this.formInfo.F) {
+        data.optionf = this.formInfo.F;
+      }
+      this.$refs.addform.validate(valid => {
+        if (valid) {
+          if (!this.answer) {
+            this.$message.error("请选择正确选项");
+            return;
+          }
+          postOnlineExamSubject(data)
+            .then(res => {
+              console.log(res, "postOnlineExamSubject");
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.formInfo = {
+                outline: "",
+                analysis: "",
+                A: "",
+                B: "",
+                C: "",
+                D: "",
+                E: "",
+                F: "",
+                difficulty: this.formInfo.difficulty
+              };
+              this.answer = "";
+            })
+            .catch(() => {
+              this.$message.error("添加失败");
+            });
+        }
+      });
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-  .other-wrapper {
+.other-wrapper {
+  display: flex;
+  justify-content: space-between;
+}
+.single-selection-wrapper {
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+  .tools-wrapper {
     display: flex;
-    justify-content: space-between;
+    justify-content: flex-end;
+    padding-right: 25%;
   }
+}
 </style>

src/views/hiddendanger/hdverify.vue

+<template>
+  <div class="verify-total">
+    <el-table :data="tableData" border>
+      <el-table-column
+        prop="enterpriseName"
+        label="企业名称"
+        width="120"
+      ></el-table-column>
+      <el-table-column
+        prop="hdName"
+        label="发现问题"
+        width="160"
+      ></el-table-column>
+      <el-table-column
+        prop="hdRectificationDate"
+        label="整改日期"
+        width="140"
+      ></el-table-column>
+      <el-table-column label="整改后照片路径" width="140">
+        <template slot-scope="scope">
+          <el-image
+            style="width: 100px; height: 100px"
+            :src="transferUrl(scope.row.hdRectificationPic)"
+            :preview-src-list="[transferUrl(scope.row.hdRectificationPic)]"
+          >
+          </el-image>
+        </template>
+      </el-table-column>
+      <el-table-column label="审核状态" width="140">
+        <template slot-scope="scope">
+          <div v-if="scope.row.verifyStatus === 1">审核已通过</div>
+          <div v-else-if="scope.row.verifyStatus === 2">审核未通过</div>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" width="160">
+        <template slot-scope="scope">
+          <el-button type="warning" @click="approve(scope.row)"
+            >审核通过</el-button
+          >
+          <el-button type="danger" @click="nopass(scope.row)"
+            >审核未通过</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-pagination
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+      :current-page="curPage"
+      :page-sizes="[10, 20, 30, 40]"
+      :page-size="curPageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="totalElements"
+    >
+    </el-pagination>
+  </div>
+</template>
+
+<script>
+import { getAllDangerToVerify, verifyDanger } from "@/api/secFound.js";
+export default {
+  data() {
+    return {
+      curPage: 1,
+      curPageSize: 10,
+      tableData: [],
+      totalElements: 0
+    };
+  },
+  mounted() {
+    this.initAllVerifyDanger();
+  },
+  methods: {
+    initAllVerifyDanger() {
+      getAllDangerToVerify({
+        page: this.curPage - 1,
+        size: this.curPageSize
+      }).then(res => {
+        console.log(res, "getAllDangerToVerify getAllDangerToVerify");
+      });
+    },
+    handleSizeChange(val) {
+      this.curPageSize = val;
+      this.initAllVerifyDanger();
+    },
+    handleCurrentChange(val) {
+      this.curPage = val;
+      this.initAllVerifyDanger();
+    },
+    approve(row) {
+      verifyDanger({
+        id: row.id,
+        status: 1
+      }).then(
+        res => {
+          this.$message({
+            type: "success",
+            message: "审核已通过"
+          });
+          // this.initAllVerifyDanger()
+        },
+        () => {
+          this.$message.error("审核失败");
+        }
+      );
+    },
+    nopass(row) {
+      verifyDanger({
+        id: row.id,
+        status: 2
+      }).then(
+        res => {
+          this.$message({
+            type: "success",
+            message: "已设置审核未通过"
+          });
+        },
+        () => {
+          this.$message.error("审核失败");
+        }
+      );
+    },
+    transferUrl(hdPic) {
+      if (hdPic) {
+        return (
+          "/hd_rectification_pic_to_verify/" +
+          hdPic.split("/hd_rectification_pic_to_verify/")[1]
+        );
+      } else {
+        return null;
+      }
+    }
+  }
+};
+</script>
+
+<style lang="scss">
+.verify-total {
+}
+</style>

src/views/hiddendanger/index.vue

@@ -223,15 +223,47 @@
         <el-form-item label="检查专家">
           <el-input v-model="formInfo.hdInspectExpert" />
         </el-form-item>
-        <el-form-item label="隐患名称">
+        <!--<el-form-item label="隐患名称">
           <el-input v-model="formInfo.hdName" />
-        </el-form-item>
+        </el-form-item>-->
         <el-form-item label="隐患等级">
           <el-select v-model="formInfo.hdLevel" placeholder="隐患等级">
             <el-option label="一般隐患" value="1" />
             <el-option label="重大隐患" value="2" />
           </el-select>
         </el-form-item>
+        <el-form-item label="发现问题">
+          <el-select
+            v-model="curChosenSecCheckType"
+            placeholder="请选择安全检查类别"
+          >
+            <el-option
+              v-for="item in secCheckType"
+              :key="item.id"
+              :value="item.id"
+              :label="item.name"
+            ></el-option>
+          </el-select>
+          <el-select
+            v-model="curChosenSecCheckContent"
+            placeholder="请选择检查内容"
+          >
+            <el-option
+              v-for="item in secCheckContent"
+              :key="item.id"
+              :value="item.id"
+              :label="item.name"
+            ></el-option>
+          </el-select>
+          <el-select v-model="formInfo.hdName" placeholder="检查内容">
+            <el-option
+              v-for="item in secCheckDiscover"
+              :key="item.id"
+              :value="item.name"
+              :label="item.name"
+            ></el-option>
+          </el-select>
+        </el-form-item>
         <el-form-item label="隐患描述">
           <el-input v-model="formInfo.hdDesc" type="textarea" />
         </el-form-item>
@@ -333,15 +365,47 @@
         <el-form-item label="检查专家">
           <el-input v-model="formInfo.hdInspectExpert" />
         </el-form-item>
-        <el-form-item label="隐患名称">
+        <!--<el-form-item label="隐患名称">
           <el-input v-model="formInfo.hdName" />
-        </el-form-item>
+        </el-form-item>-->
         <el-form-item label="隐患等级">
           <el-select v-model="formInfo.hdLevel" placeholder="隐患等级">
             <el-option label="一般隐患" value="1" />
             <el-option label="重大隐患" value="2" />
           </el-select>
         </el-form-item>
+        <el-form-item label="发现问题">
+          <el-select
+            v-model="curChosenSecCheckType"
+            placeholder="请选择安全检查类别"
+          >
+            <el-option
+              v-for="item in secCheckType"
+              :key="item.id"
+              :value="item.id"
+              :label="item.name"
+            ></el-option>
+          </el-select>
+          <el-select
+            v-model="curChosenSecCheckContent"
+            placeholder="请选择检查内容"
+          >
+            <el-option
+              v-for="item in secCheckContent"
+              :key="item.id"
+              :value="item.id"
+              :label="item.name"
+            ></el-option>
+          </el-select>
+          <el-select v-model="formInfo.hdName" placeholder="检查内容">
+            <el-option
+              v-for="item in secCheckDiscover"
+              :key="item.id"
+              :value="item.name"
+              :label="item.name"
+            ></el-option>
+          </el-select>
+        </el-form-item>
         <el-form-item label="隐患描述">
           <el-input v-model="formInfo.hdDesc" type="textarea" />
         </el-form-item>
@@ -473,12 +537,28 @@ import {
   getAllCompanyInfoByhdName,
   getHdByName
 } from "../../api/industry.js";
+import {
+  getEnterpriseSafetyInspectionContent,
+  getEnterpriseSafetyMatter
+} from "@/api/secFound.js";
 import axios from "axios";
 import { parseTime } from "@/utils/index.js";
 // import { Form } from 'element-ui'
 export default {
   data() {
     return {
+      // 当前选择的安全检查类别
+      curChosenSecCheckType: "",
+      // 当前选择的安全检查内容
+      curChosenSecCheckContent: "",
+      // 当前选择的发现问题
+      curChosenSecCheckDiscover: "",
+      // 安全检查类别
+      secCheckType: [],
+      // 安全检查内容
+      secCheckContent: [],
+      // 发现问题
+      secCheckDiscover: [],
       // 企业模糊搜索信息
       enterSearchInfo: "",
       // 搜索隐患信息
@@ -555,8 +635,23 @@ export default {
   },
   mounted() {
     this.initDangerInfo();
+    this.initAllSecCheckType();
   },
   methods: {
+    // 获取安全检查类别
+    async initAllSecCheckType() {
+      getEnterpriseSafetyInspectionContent({
+        level: 1,
+        page: 0,
+        size: 99999
+      }).then(res => {
+        console.log(
+          res,
+          "getEnterpriseSafetyInspectionContent getEnterpriseSafetyInspectionContent"
+        );
+        this.secCheckType = [...res.content];
+      });
+    },
     // 初始化所有隐患信息
     async initDangerInfo(toPagination) {
       let replaceArray = [];
@@ -1104,6 +1199,7 @@ export default {
                   row.hdlist[j].hdPic = res1.content[0].hdPic;
                   row.hdlist[j].hdRectificationPic =
                     res1.content[0].hdRectificationPic;
+                  console.log(res1, "res1, res1, res1, res1, res1");
                 }
               });
             }
@@ -1242,6 +1338,28 @@ export default {
         this.$message.error("请选择日期");
       }
     }
+  },
+  watch: {
+    curChosenSecCheckType(newVal, oldVal) {
+      getEnterpriseSafetyInspectionContent({
+        level: 2,
+        page: 0,
+        size: 9999,
+        pid: newVal
+      }).then(res => {
+        this.secCheckContent = [...res.content];
+      });
+    },
+    curChosenSecCheckContent(newVal, oldVal) {
+      getEnterpriseSafetyMatter({
+        inspectionContentId: newVal,
+        page: 0,
+        size: 9999
+      }).then(res => {
+        this.secCheckDiscover = [...res.content];
+        console.log(res, "getEnterpriseSafetyMatter ,,,,,,,,,,,");
+      });
+    }
   }
 };
 </script>

src/views/home.vue

 <template>
   <div class="dashboard-container">
     <div class="dashboard-editor-container">
-      <github-corner class="github-corner" />
-
+      <!--<github-corner class="github-corner" />-->
       <panel-group @handleSetLineChartData="handleSetLineChartData" />
-
-      <el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
+      <!--<el-row style="background:#fff;padding:16px 16px 0;margin-bottom:32px;">
         <line-chart :chart-data="lineChartData" />
       </el-row>
       <el-row :gutter="32">
@@ -24,18 +22,18 @@
             <bar-chart />
           </div>
         </el-col>
-      </el-row>
+      </el-row>-->
     </div>
   </div>
 </template>
 
 <script>
-import GithubCorner from '@/components/GithubCorner'
-import PanelGroup from './dashboard/PanelGroup'
-import LineChart from './dashboard/LineChart'
-import RadarChart from '@/components/Echarts/RadarChart'
-import PieChart from '@/components/Echarts/PieChart'
-import BarChart from '@/components/Echarts/BarChart'
+import GithubCorner from "@/components/GithubCorner";
+import PanelGroup from "./dashboard/PanelGroup";
+import LineChart from "./dashboard/LineChart";
+import RadarChart from "@/components/Echarts/RadarChart";
+import PieChart from "@/components/Echarts/PieChart";
+import BarChart from "@/components/Echarts/BarChart";
 
 const lineChartData = {
   newVisitis: {
@@ -54,10 +52,10 @@ const lineChartData = {
     expectedData: [130, 140, 141, 142, 145, 150, 160],
     actualData: [120, 82, 91, 154, 162, 140, 130]
   }
-}
+};
 
 export default {
-  name: 'Dashboard',
+  name: "Dashboard",
   components: {
     GithubCorner,
     PanelGroup,
@@ -69,39 +67,46 @@ export default {
   data() {
     return {
       lineChartData: lineChartData.newVisitis
-    }
+    };
   },
   methods: {
     handleSetLineChartData(type) {
-      this.lineChartData = lineChartData[type]
+      this.lineChartData = lineChartData[type];
     }
   }
-}
+};
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-  .dashboard-editor-container {
-    padding: 32px;
-    background-color: rgb(240, 242, 245);
-    position: relative;
+.dashboard-editor-container {
+  padding: 32px;
+  background-color: rgb(240, 242, 245);
+  position: relative;
 
-    .github-corner {
-      position: absolute;
-      top: 0;
-      border: 0;
-      right: 0;
-    }
+  .github-corner {
+    position: absolute;
+    top: 0;
+    border: 0;
+    right: 0;
+  }
 
-    .chart-wrapper {
-      background: #fff;
-      padding: 16px 16px 0;
-      margin-bottom: 32px;
-    }
+  .chart-wrapper {
+    background: #fff;
+    padding: 16px 16px 0;
+    margin-bottom: 32px;
   }
+}
 
-  @media (max-width:1024px) {
-    .chart-wrapper {
-      padding: 8px;
-    }
+@media (max-width: 1024px) {
+  .chart-wrapper {
+    padding: 8px;
   }
+}
+</style>
+
+<style>
+.app-main {
+  background-color: #f5f6fb;
+  /*height: 100vh;*/
+}
 </style>

src/views/hwapproval/hwapproval.vue

@@ -18,7 +18,11 @@
           :value="item.value"
         />
       </el-select> -->
-      <el-input v-model="searchEnter" placeholder="请输入企业名称" style="width: 80%;"></el-input>
+      <el-input
+        v-model="searchEnter"
+        placeholder="请输入企业名称"
+        style="width: 80%;"
+      ></el-input>
       <el-button type="success" @click="clickToSearchEnter">查找</el-button>
     </div>
     <div class="hwapproval-table-wrapper">
@@ -116,11 +120,14 @@
 
 <script>
 import pdf from "vue-pdf";
-import { dangerJobReportEnterprise, postDangerJobReport } from "@/api/dangerjob.js";
-import { parseTime } from '../../utils';
+import {
+  dangerJobReportEnterprise,
+  postDangerJobReport
+} from "@/api/dangerjob.js";
+import { parseTime } from "../../utils";
 export default {
   components: {
-    pdf,
+    pdf
   },
   data() {
     return {
@@ -139,17 +146,17 @@ export default {
               workTime: "2021-08-22 12:01:03",
               approvalName: "备案1",
               approvalId: 1,
-              filepath: "",
+              filepath: ""
             },
             {
               uploadTime: "2021-10-21 12:12:12",
               workTime: "2021-08-22 12:01:01",
               approvalName: "备案2",
               approvalId: 2,
-              filepath: "",
-            },
-          ],
-        },
+              filepath: ""
+            }
+          ]
+        }
       ],
       addDialogShow: false,
       addFormInfo: {
@@ -157,7 +164,7 @@ export default {
         workTime: "",
         uploadTime: "",
         file: null,
-        companyId: -1,
+        companyId: -1
       },
       uploadFilePath: "",
       addFormRules: {
@@ -165,15 +172,15 @@ export default {
           {
             required: true,
             message: "请输入危险作业备案名称",
-            trigger: "blur",
-          },
+            trigger: "blur"
+          }
         ],
         workTime: [
           {
             required: true,
             message: "请选择作业时间",
-            trigger: "change",
-          },
+            trigger: "change"
+          }
         ],
         // uploadTime: [
         //   {
@@ -186,11 +193,11 @@ export default {
           {
             required: true,
             message: "请选择文件(pdf、jpg、jpeg、png、gif)",
-            trigger: "change",
-          },
-        ],
+            trigger: "change"
+          }
+        ]
       },
-      curApprovalFilePath: "",
+      curApprovalFilePath: ""
     };
   },
   computed: {
@@ -199,21 +206,21 @@ export default {
         return true;
       }
       return false;
-    },
+    }
   },
   mounted() {
     this.initMethod();
   },
   methods: {
     initMethod() {
-      dangerJobReportEnterprise().then((res) => {
+      dangerJobReportEnterprise().then(res => {
         this.approvalList = [
-          ...res.content.map((item) => {
+          ...res.content.map(item => {
             return {
               companyName: item.enterpriseName,
-              companyId: item.enterpriseId,
+              companyId: item.enterpriseId
             };
-          }),
+          })
         ];
         console.log(res, "hwapprovalEnters hwapprovalEnters");
       });
@@ -222,7 +229,10 @@ export default {
     chooseFile() {
       this.addFormInfo.file = null;
       this.uploadFilePath = "";
-      console.log(this.$refs.chosenfile.files, 'this.$refs.chosenfile.files this.$refs.chosenfile.files this.$refs.chosenfile.files')
+      console.log(
+        this.$refs.chosenfile.files,
+        "this.$refs.chosenfile.files this.$refs.chosenfile.files this.$refs.chosenfile.files"
+      );
       if (this.$refs.chosenfile.files.length) {
         const filePath = this.$refs.chosenfile.files[0].name;
         if (
@@ -244,23 +254,28 @@ export default {
       this.addDialogShow = false;
     },
     submitHWapproval() {
-      this.$refs.addform.validate((valid) => {
+      this.$refs.addform.validate(valid => {
         if (valid) {
           const formData = new FormData();
-          formData.append('companyId', this.addFormInfo.companyId);
-          formData.append('name', this.addFormInfo.name);
-          formData.append('file', this.addFormInfo.file);
-          formData.append('time', parseTime(this.workTime, '{y}-{m}-{d} {h}:{i}:{s}'))
-          postDangerJobReport(formData).then(res => {
-            console.log(res, 'postDanegrJobReport postDangerJobReport')
-            this.$message({
-              type: 'success',
-              message: '上传成功'
+          formData.append("companyId", this.addFormInfo.companyId);
+          formData.append("name", this.addFormInfo.name);
+          formData.append("file", this.addFormInfo.file);
+          formData.append(
+            "time",
+            parseTime(this.workTime, "{y}-{m}-{d} {h}:{i}:{s}")
+          );
+          postDangerJobReport(formData)
+            .then(res => {
+              console.log(res, "postDanegrJobReport postDangerJobReport");
+              this.$message({
+                type: "success",
+                message: "上传成功"
+              });
+              this.addDialogShow = false;
             })
-            this.addDialogShow = false
-          }).catch(() => {
-            this.$message.error('上传失败')
-          })
+            .catch(() => {
+              this.$message.error("上传失败");
+            });
         }
       });
     },
@@ -281,40 +296,36 @@ export default {
         enterpriseName: this.searchEnter
       }).then(res => {
         this.approvalList = [
-          ...res.content.map((item) => {
+          ...res.content.map(item => {
             return {
               companyName: item.enterpriseName,
-              companyId: item.enterpriseId,
+              companyId: item.enterpriseId
             };
-          }),
+          })
         ];
-      })
-    },
-
-  },
+      });
+    }
+  }
 };
 </script>
 
 <style lang="scss" scoped>
 .hwapproval-wrapper {
-  width: 80%;
-  margin: 30px auto;
-  border-radius: 30px;
-  padding: 30px;
-  box-shadow: 0 0 9px 1px #eee;
+  margin: 10px 10px;
+  border-radius: 5px;
+  padding: 10px;
+
   .hwapproval-tools-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    border-radius: 20px;
-    padding: 20px;
-    box-shadow: 0 0 9px 1px #eee;
+    margin: 10px 10px;
+    border-radius: 5px;
+    padding: 10px;
+    background: #fff;
   }
   .hwapproval-table-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    padding: 20px;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    background: #fff;
   }
 }
 </style>

src/views/hwapproval/hwapprovals.vue

@@ -113,7 +113,7 @@ import { dangerJobReport, dangerJobReportEnterprise } from "@/api/dangerjob.js";
 import { parseTime } from "@/utils/index.js";
 export default {
   components: {
-    pdf,
+    pdf
   },
   data() {
     return {
@@ -134,31 +134,31 @@ export default {
           id: 4,
           name: "111",
           time: "2021-09-09 01:01:01",
-          uploadDate: "2022-01-04",
-        },
+          uploadDate: "2022-01-04"
+        }
       ],
       companyId: "",
-      companyName: "",
+      companyName: ""
     };
   },
   methods: {
     initJob() {
       let params = {
-        companyId: this.$route.params.name.split("&")[0],
+        companyId: this.$route.params.name.split("&")[0]
       };
-      dangerJobReport(params).then((res) => {
+      dangerJobReport(params).then(res => {
         // console.log(res.content, "所有");
         this.hwapprovalslistTableData = [
-          ...res.content.map((item) => {
+          ...res.content.map(item => {
             console.log(item.name);
             return {
               jobName: item.name,
               uploadDate: item.uploadDate,
               time: item.time,
               filePath: item.filePath,
-              id: item.id,
+              id: item.id
             };
-          }),
+          })
         ];
       });
     },
@@ -190,35 +190,35 @@ export default {
           "{y}-{m}-{d}"
         );
       }
-      dangerJobReport(params).then((res) => {
+      dangerJobReport(params).then(res => {
         // console.log(res);
         this.hwapprovalslistTableData = [
-          ...res.content.map((item) => {
+          ...res.content.map(item => {
             console.log(item.name);
             return {
               jobName: item.name,
               uploadDate: item.uploadDate,
               time: item.time,
               filePath: item.filePath,
-              id: item.id,
+              id: item.id
             };
-          }),
+          })
         ];
       });
     },
     viewHwapproval(row) {
       this.certifyShow = true;
-      
+
       this.curHwapprovalFilePath = row.filePath;
       const index1 = this.curHwapprovalFilePath.indexOf("\\");
       const index2 = this.curHwapprovalFilePath.indexOf("\\", index1 + 1);
       const index3 = this.curHwapprovalFilePath.indexOf("\\", index2 + 1);
       this.curHwapprovalFilePath = this.curHwapprovalFilePath.substring(index3);
-      this.curCertifyFilePath = this.curHwapprovalFilePath
+      this.curCertifyFilePath = this.curHwapprovalFilePath;
       if (this.curHwapprovalFilePath.endsWith(".pdf")) {
         // if (this.curHwapprovalFilePath.endsWith(".pdf")) {
         this.loadingTask = pdf.createLoadingTask(this.curHwapprovalFilePath);
-        this.loadingTask.promise.then((pdf) => {
+        this.loadingTask.promise.then(pdf => {
           this.pdfNumPage = pdf.numPages;
         });
       }
@@ -239,7 +239,7 @@ export default {
       link.click();
       link.remove();
       window.URL.revokeObjectURL(link.href);
-    },
+    }
   },
   computed: {
     getFileType() {
@@ -247,7 +247,7 @@ export default {
         return true;
       }
       return false;
-    },
+    }
   },
   mounted() {
     // console.log(this.$route.params.name);
@@ -255,19 +255,19 @@ export default {
     this.companyName = this.$route.params.name.split("&")[1];
     // console.log(this.companyName, "this.companyName this.companyName");
     this.initJob();
-  },
+  }
 };
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 .hwapprovals-find-tools-wrapper {
   display: flex;
-  width: 80%;
-  margin: 30px auto;
-  padding: 20px;
-  border-radius: 20px;
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
   flex-wrap: wrap;
-  box-shadow: 0 0 9px 1px #eee;
+  background: #fff;
+  width: 100%;
   .hwapprovals-companyName {
     width: 80%;
     margin: 10px auto;
@@ -298,14 +298,11 @@ export default {
   }
 }
 .tools-wrapper {
-  width: 80%;
-  margin: 30px auto;
-  padding: 20px;
-  border-radius: 20px;
-  box-shadow: 0 0 9px 1px #eee;
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
 }
 .hwapprovalslist-wrapper {
-  width: 80%;
   margin: 30px auto;
   padding: 30px;
   border-radius: 20px;
@@ -318,11 +315,11 @@ export default {
   }
 }
 .hwapprovalslist-table-wrapper {
-  width: 80%;
-  padding: 20px;
-  border-radius: 20px;
+  padding: 10px;
+  border-radius: 5px;
   // box-shadow: 0 0 9px 1px #eee;
-  margin: 0 auto;
+  margin: 0 10px;
+  width: 100%;
   // background: #eee;
   // display: flex;
   // justify-content: center;
@@ -412,4 +409,4 @@ export default {
     }
   }
 }
-</style>
+</style>
\ No newline at end of file

src/views/info/index.vue

 <template>
   <div class="total-wrapper">
     <div class="tools-wrapper">
-      <el-button type="primary" @click="addInfoDialogShow">增加</el-button>
+      <!--<el-button type="primary" @click="addInfoDialogShow">增加</el-button>-->
       <!-- <el-button type="warning" :disabled="isEditable" @click="editInfo">编辑</el-button> -->
       <!-- <el-button type="danger" :disabled="isDeleteable" @click="deleteInfo">删除</el-button> -->
     </div>
@@ -13,7 +13,9 @@
         start-placeholder="开始日期"
         end-placeholder="结束日期"
       />
-      <el-button type="primary" style="margin-left: 40px;" @click="searchInfo">查询</el-button>
+      <el-button type="primary" style="margin-left: 40px;" @click="searchInfo"
+        >查询</el-button
+      >
     </div>
     <div class="info-total-wrapper">
       <el-table
@@ -22,16 +24,8 @@
         border
         @selection-change="handleSelectionChange"
       >
-
-        <el-table-column
-          prop="title"
-          label="标题"
-          width="1200"
-        />
-        <el-table-column
-          prop="time"
-          label="时间"
-        />
+        <el-table-column prop="title" label="标题" width="1200" />
+        <el-table-column prop="time" label="时间" />
       </el-table>
       <el-pagination
         :current-page="currentPage"
@@ -43,15 +37,8 @@
         @current-change="handleCurrentChange"
       />
     </div>
-    <el-dialog
-      title="新增消息通知"
-      :visible.sync="addFormVisible"
-    >
-      <el-form
-        ref="addform"
-        :model="formInfo"
-        :rules="rules"
-      >
+    <el-dialog title="新增消息通知" :visible.sync="addFormVisible">
+      <el-form ref="addform" :model="formInfo" :rules="rules">
         <el-form-item label="标题" prop="title" :label-width="'120px'">
           <el-input v-model="formInfo.title" autocomplete="off" />
         </el-form-item>
@@ -64,22 +51,19 @@
         </el-form-item>
       </el-form>
       <div class="way-to-publish">
-        <el-checkbox v-model="miniProWay" style="margin-left: 120px;">小程序</el-checkbox>
-        <el-checkbox v-model="shortMessage" style="margin-left: 30px;">短信</el-checkbox>
+        <el-checkbox v-model="miniProWay" style="margin-left: 120px;"
+          >小程序</el-checkbox
+        >
+        <el-checkbox v-model="shortMessage" style="margin-left: 30px;"
+          >短信</el-checkbox
+        >
       </div>
       <div slot="footer">
         <el-button type="primary" @click="publishInfo">发布</el-button>
       </div>
     </el-dialog>
-    <el-dialog
-      title="编辑消息通知"
-      :visible.sync="editFormVisible"
-    >
-      <el-form
-        ref="editform"
-        :model="editFormInfo"
-        :rules="rules"
-      >
+    <el-dialog title="编辑消息通知" :visible.sync="editFormVisible">
+      <el-form ref="editform" :model="editFormInfo" :rules="rules">
         <el-form-item label="标题" prop="title" :label-width="'120px'">
           <el-input v-model="editFormInfo.title" autocomplete="off" />
         </el-form-item>
@@ -95,25 +79,10 @@
         <el-button type="primary" @click="submitModify">提交</el-button>
       </div>
     </el-dialog>
-    <el-dialog
-      title="查询结果"
-      :visible.sync="searchTableVisible"
-    >
-      <el-table
-        :data="searchInfoList"
-        style="width: 100%"
-        border
-      >
-
-        <el-table-column
-          prop="title"
-          label="标题"
-          width="300"
-        />
-        <el-table-column
-          prop="time"
-          label="时间"
-        />
+    <el-dialog title="查询结果" :visible.sync="searchTableVisible">
+      <el-table :data="searchInfoList" style="width: 100%" border>
+        <el-table-column prop="title" label="标题" width="300" />
+        <el-table-column prop="time" label="时间" />
       </el-table>
     </el-dialog>
   </div>
@@ -125,22 +94,26 @@ export default {
     return {
       infoList: [
         {
-          title: '[隐患预警]贵公司"重大隐患" 一 "联动台紧急停止按钮无效"整改即将到期，请及时整改',
-          time: '2020-05-19 19:25'
+          title:
+            '[隐患预警]贵公司"重大隐患" 一 "联动台紧急停止按钮无效"整改即将到期，请及时整改',
+          time: "2020-05-19 19:25"
         },
         {
-          title: '[隐患预警]贵公司"一般隐患" 一 "力矩限位不灵敏"整改即将到期，请及时整改',
-          time: '2020-05-19 19:24'
+          title:
+            '[隐患预警]贵公司"一般隐患" 一 "力矩限位不灵敏"整改即将到期，请及时整改',
+          time: "2020-05-19 19:24"
         }
       ],
       searchInfoList: [
         {
-          title: '[隐患预警]贵公司"重大隐患" 一 "联动台紧急停止按钮无效"整改即将到期，请及时整改',
-          time: '2020-05-19 19:25'
+          title:
+            '[隐患预警]贵公司"重大隐患" 一 "联动台紧急停止按钮无效"整改即将到期，请及时整改',
+          time: "2020-05-19 19:25"
         },
         {
-          title: '[隐患预警]贵公司"一般隐患" 一 "力矩限位不灵敏"整改即将到期，请及时整改',
-          time: '2020-05-19 19:24'
+          title:
+            '[隐患预警]贵公司"一般隐患" 一 "力矩限位不灵敏"整改即将到期，请及时整改',
+          time: "2020-05-19 19:24"
         }
       ],
       multipleSelection: [],
@@ -150,108 +123,133 @@ export default {
       editFormVisible: false,
       searchTableVisible: false,
       formInfo: {
-        title: '',
-        time: ''
+        title: "",
+        time: ""
       },
       editFormInfo: {
-        title: '',
-        time: ''
+        title: "",
+        time: ""
       },
       rules: {
         title: [
           {
             required: true,
-            message: '请输入标题',
-            trigger: 'blur'
+            message: "请输入标题",
+            trigger: "blur"
           }
         ],
         time: [
           {
             required: true,
-            message: '请选择发布时间',
-            trigger: 'change'
+            message: "请选择发布时间",
+            trigger: "change"
           }
         ]
       },
-      inputDate: '',
+      inputDate: "",
       miniProWay: false,
       shortMessage: false,
       currentPage: 1,
       curPageSize: 10,
       totalColumn: 40
-    }
+    };
   },
   methods: {
     handleSelectionChange(val) {
-      this.multipleSelection = val
-      this.isEditable = true
-      this.isDeleteable = true
+      this.multipleSelection = val;
+      this.isEditable = true;
+      this.isDeleteable = true;
       if (this.multipleSelection.length === 1) {
-        this.isEditable = false
+        this.isEditable = false;
       }
       if (this.multipleSelection.length > 0) {
-        this.isDeleteable = false
+        this.isDeleteable = false;
       }
     },
     publishInfo() {
-      this.$refs['addform'].validate((valid) => {
+      this.$refs["addform"].validate(valid => {
         if (valid) {
           // 调用 valid
         } else {
-          this.$message.error('请输入信息')
+          this.$message.error("请输入信息");
         }
-      })
+      });
     },
     addInfoDialogShow() {
       // addInfo
-      this.addFormVisible = true
+      this.addFormVisible = true;
     },
     editInfo() {
-      console.log(this.multipleSelection, '112233')
-      this.editFormVisible = true
-      this.editFormInfo = { ...this.multipleSelection[0] }
+      console.log(this.multipleSelection, "112233");
+      this.editFormVisible = true;
+      this.editFormInfo = { ...this.multipleSelection[0] };
     },
     deleteInfo() {
-      console.log(this.multipleSelection, '445566')
-      this.$confirm('此操作将删除选中消息', '提示', {
-        type: 'warning',
-        confirmButtonText: '确定',
-        cancelButtonText: '取消'
-      }).then(() => {
-        this.$message({
-          type: 'success',
-          message: '删除成功'
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
-        })
+      console.log(this.multipleSelection, "445566");
+      this.$confirm("此操作将删除选中消息", "提示", {
+        type: "warning",
+        confirmButtonText: "确定",
+        cancelButtonText: "取消"
       })
+        .then(() => {
+          this.$message({
+            type: "success",
+            message: "删除成功"
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
     submitModify() {
       // axios
-      this.editFormInfo = false
+      this.editFormInfo = false;
     },
     searchInfo() {
       // 查询
       // 这边可能要弹出 dialog
-      this.searchTableVisible = true
+      this.searchTableVisible = true;
     },
     handleSizeChange(val) {
       // 每页多少条
-      this.curPageSize = val
+      this.curPageSize = val;
     },
     handleCurrentChange(val) {
       // 当前是多少页
-      this.currentPage = val
+      this.currentPage = val;
     }
   }
-}
+};
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
+.tool-search-wrapper {
+}
+.total-wrapper {
+  width: 100%;
+  background: #f5f6fb;
+  box-shadow: none;
+  margin-top: -10px;
+  .tools-wrapper {
+    background: #fff;
+    padding: 10px;
+    border-radius: 5px;
+    margin-bottom: 10px;
+  }
   .tool-search-wrapper {
-    margin: 22px 0;
+    background: #fff;
+    padding: 10px;
+    border-radius: 5px;
+    margin-bottom: 10px;
   }
+  .info-total-wrapper {
+    background: #fff;
+    padding: 10px;
+    border-radius: 5px;
+    margin-bottom: 10px;
+  }
+}
 </style>

src/views/law/addlaw.vue

 <template>
   <div class="total-content-wrapper">
     <div class="total-wrapper">
-      <el-form
-        ref="addform"
-        :model="formInfo"
-        :rules="rules"
-      >
+      <el-form ref="addform" :model="formInfo" :rules="rules">
         <el-form-item label="法律法规标题" :label-width="'120px'" prop="title">
-          <el-input v-model="formInfo.title" :maxlength="50" style="width: 500px" />
+          <el-input
+            v-model="formInfo.title"
+            :maxlength="50"
+            style="width: 500px"
+          />
         </el-form-item>
         <el-form-item label="发布部门" :label-width="'120px'" prop="depart">
-          <el-input v-model="formInfo.depart" :maxlength="50" style="width: 500px" />
+          <el-input
+            v-model="formInfo.depart"
+            :maxlength="50"
+            style="width: 500px"
+          />
         </el-form-item>
         <el-form-item label="发布时间" :label-width="'120px'" prop="time">
           <el-date-picker
             v-model="formInfo.time"
-            type="datetime"
+            type="date"
             placeholder="选择发布时间"
           />
         </el-form-item>
@@ -48,133 +52,141 @@
 </template>
 
 <script>
-import Editor from '@tinymce/tinymce-vue'
-import { postLaw } from '@/api/teachManage'
-import { parseTime } from '@/utils/index'
+import Editor from "@tinymce/tinymce-vue";
+import { postLaw } from "@/api/teachManage";
+import { parseTime } from "@/utils/index";
 export default {
   components: {
-    'editor': Editor
+    editor: Editor
   },
   data() {
     return {
       formInfo: {
-        title: '',
-        depart: '',
-        time: '',
-        content: ''
+        title: "",
+        depart: "",
+        time: "",
+        content: ""
       },
       rules: {
         title: [
           {
             required: true,
-            message: '请输入标题',
-            trigger: 'blur'
+            message: "请输入标题",
+            trigger: "blur"
           }
         ],
         depart: [
           {
             required: true,
-            message: '请输入发布人',
-            trigger: 'blur'
+            message: "请输入发布人",
+            trigger: "blur"
           }
         ],
         time: [
           {
             required: true,
-            message: '请选择发布时间',
-            trigger: 'change'
+            message: "请选择发布时间",
+            trigger: "change"
           }
         ]
       },
       // 经法局列表
       departList: [
         {
-          value: '经发局（应急局）',
-          label: '经发局（应急局）'
+          value: "经发局（应急局）",
+          label: "经发局（应急局）"
         },
         {
-          value: '建设局',
-          label: '建设局'
+          value: "建设局",
+          label: "建设局"
         },
         {
-          value: '市场监督管理局',
-          label: '市场监督管理局'
+          value: "市场监督管理局",
+          label: "市场监督管理局"
         },
         {
-          value: '生态环境局',
-          label: '生态环境局'
+          value: "生态环境局",
+          label: "生态环境局"
         },
         {
-          value: '商务局',
-          label: '商务局'
+          value: "商务局",
+          label: "商务局"
         }
       ]
-    }
+    };
   },
   mounted() {
-    const curLawItem = localStorage.getItem('curLawItem')
+    const curLawItem = localStorage.getItem("curLawItem");
     if (curLawItem) {
       // localStorage.setItem('curLawItem', )
-      this.formInfo = { ...JSON.parse(curLawItem) }
+      this.formInfo = { ...JSON.parse(curLawItem) };
     }
-    console.log(this.$store.getters.user, 'this.$store.getters.user')
+    console.log(this.$store.getters.user, "this.$store.getters.user");
   },
   methods: {
     publishLaw() {
       // 校验
-      this.$refs.addform.validate((valid) => {
+      this.$refs.addform.validate(valid => {
         if (valid) {
           // 发布
           // 调用 axios
-          postLaw(this.formInfo.depart, this.formInfo.title, [{
-            lawChapter: this.formInfo.content,
-            createBy: this.$store.getters.user.username,
-            createDate: parseTime(new Date())
-          }]).then(res => {
+          postLaw(
+            this.formInfo.depart,
+            this.formInfo.title,
+            this.formInfo.time,
+            [
+              {
+                lawChapter: this.formInfo.content,
+                createBy: this.$store.getters.user.username,
+                createDate: parseTime(new Date())
+              }
+            ]
+          ).then(res => {
             this.$message({
-              type: 'success',
-              message: '添加成功'
-            })
-            this.clearContent()
-          })
+              type: "success",
+              message: "添加成功"
+            });
+            this.clearContent();
+          });
           // 调用 localStorage 的removeItem()方法去掉 curLawItem
         } else {
-          this.$message.error('请输入信息')
+          this.$message.error("请输入信息");
         }
-      })
+      });
     },
     clearContent() {
-      this.formInfo.title = ''
-      this.formInfo.depart = ''
-      this.formInfo.time = ''
-      this.formInfo.content = ''
+      this.formInfo.title = "";
+      this.formInfo.depart = "";
+      this.formInfo.time = "";
+      this.formInfo.content = "";
       // 调用 localStorage 的removeItem()方法去掉 curLawItem
-      localStorage.removeItem('curLawItem')
+      localStorage.removeItem("curLawItem");
     },
     saveStorage() {
       //
       // localStorage.getItem
-      localStorage.setItem('curLawItem', JSON.stringify(this.formInfo))
+      localStorage.setItem("curLawItem", JSON.stringify(this.formInfo));
     }
   }
-}
+};
 </script>
 
-<style lang="scss">
-  .editor-wrapper {
-    padding: 10px 20px;
-  }
-  .pulish-wrapper {
-    margin-top: 20px;
-    display: flex;
-    justify-content: flex-end;
-  }
-  .total-content-wrapper {}
-  .total-wrapper {
-    width: 800px;
-    margin: 40px auto;
-    box-shadow: 0 0 2px 2px #eee;
-    border-radius: 30px;
-    padding: 30px;
-  }
+<style lang="scss" scoped>
+.editor-wrapper {
+  padding: 10px 20px;
+}
+.pulish-wrapper {
+  margin-top: 20px;
+  display: flex;
+  justify-content: flex-end;
+}
+.total-content-wrapper {
+}
+.total-wrapper {
+  width: 800px;
+  margin: 40px auto;
+  border-radius: 5px;
+  padding: 10px;
+  background: #fff;
+}
 </style>

src/views/law/editlaw.vue

 <template>
   <div class="total-wrapper">
-    <el-form
-      ref="addform"
-      :model="formInfo"
-      :rules="rules"
-    >
+    <el-form ref="addform" :model="formInfo" :rules="rules">
       <el-form-item label="法律法规标题" :label-width="'120px'" prop="title">
-        <el-input v-model="formInfo.title" :maxlength="50" style="width: 500px" />
+        <el-input
+          v-model="formInfo.title"
+          :maxlength="50"
+          style="width: 500px"
+        />
       </el-form-item>
       <el-form-item label="发布部门" :label-width="'120px'" prop="depart">
-        <el-input v-model="formInfo.depart" :maxlength="50" style="width: 500px" />
+        <el-input
+          v-model="formInfo.depart"
+          :maxlength="50"
+          style="width: 500px"
+        />
       </el-form-item>
       <el-form-item label="发布时间" :label-width="'120px'" prop="time">
         <el-date-picker
@@ -44,129 +48,150 @@
 </template>
 
 <script>
-import Editor from '@tinymce/tinymce-vue'
-import { getLawDetail, putLaw } from '@/api/teachManage'
-import { parseTime } from '@/utils/index'
+import Editor from "@tinymce/tinymce-vue";
+import { getLawDetail, putLaw } from "@/api/teachManage";
+import { parseTime } from "@/utils/index";
 export default {
   components: {
-    'editor': Editor
+    editor: Editor
   },
   data() {
     return {
       formInfo: {
-        title: '',
-        depart: '',
-        time: '',
-        content: ''
+        title: "",
+        depart: "",
+        time: "",
+        content: ""
       },
       rules: {
         title: [
           {
             required: true,
-            message: '请输入标题',
-            trigger: 'blur'
+            message: "请输入标题",
+            trigger: "blur"
           }
         ],
         depart: [
           {
             required: true,
-            message: '请输入发布人',
-            trigger: 'blur'
+            message: "请输入发布人",
+            trigger: "blur"
           }
         ],
         time: [
           {
             required: true,
-            message: '请选择发布时间',
-            trigger: 'change'
+            message: "请选择发布时间",
+            trigger: "change"
           }
         ]
       },
       // 经法局列表
       departList: [
         {
-          value: '经发局（应急局）',
-          label: '经发局（应急局）'
+          value: "经发局（应急局）",
+          label: "经发局（应急局）"
         },
         {
-          value: '建设局',
-          label: '建设局'
+          value: "建设局",
+          label: "建设局"
         },
         {
-          value: '市场监督管理局',
-          label: '市场监督管理局'
+          value: "市场监督管理局",
+          label: "市场监督管理局"
         },
         {
-          value: '生态环境局',
-          label: '生态环境局'
+          value: "生态环境局",
+          label: "生态环境局"
         },
         {
-          value: '商务局',
-          label: '商务局'
+          value: "商务局",
+          label: "商务局"
         }
       ]
-    }
+    };
   },
   mounted() {
     // this.formInfo = { ...this.$store.getters.curLawItem }
     getLawDetail(this.$store.getters.curLawItem.lawId).then(res => {
-      console.log(res, 'getLawDetail')
-      this.formInfo.lawId = res.lawId
-      this.formInfo.depart = res.lawPublisher
-      this.formInfo.title = res.lawTitle
-      this.formInfo.time = res.createDate
-      this.formInfo.content = res.thLawChapterDtoList.length ? res.thLawChapterDtoList[0].lawChapter : ''
-      this.formInfo.createBy = res.thLawChapterDtoList.length ? res.thLawChapterDtoList[0].createBy : ''
-      this.formInfo.createDate = res.thLawChapterDtoList.length ? res.thLawChapterDtoList[0].createDate : parseTime(new Date()),
-      this.formInfo.currentUserRead = res.currentUserRead
-      this.formInfo.lawItemId = res.thLawChapterDtoList.length ? res.thLawChapterDtoList[0].lawId : ''
-    })
+      console.log(res, "getLawDetail");
+      this.formInfo.lawId = res.lawId;
+      this.formInfo.depart = res.lawPublisher;
+      this.formInfo.title = res.lawTitle;
+      this.formInfo.time = res.createDate;
+      this.formInfo.content = res.thLawChapterDtoList.length
+        ? res.thLawChapterDtoList[0].lawChapter
+        : "";
+      this.formInfo.createBy = res.thLawChapterDtoList.length
+        ? res.thLawChapterDtoList[0].createBy
+        : "";
+      (this.formInfo.createDate = res.thLawChapterDtoList.length
+        ? res.thLawChapterDtoList[0].createDate
+        : parseTime(new Date())),
+        (this.formInfo.currentUserRead = res.currentUserRead);
+      this.formInfo.lawItemId = res.thLawChapterDtoList.length
+        ? res.thLawChapterDtoList[0].lawId
+        : "";
+    });
   },
   methods: {
     publishLaw() {
       // 校验
-      this.$refs.addform.validate((valid) => {
+      this.$refs.addform.validate(valid => {
         if (valid) {
           // 发布
           // 调用 axios
-          putLaw(this.formInfo.lawId, this.formInfo.title, this.formInfo.depart, this.formInfo.createBy, this.formInfo.createDate, this.$store.getters.user.username, parseTime(new Date()), this.formInfo.createDate, this.formInfo.currentUserRead, [
-            {
-              lawChapter: this.formInfo.content,
-              createBy: this.formInfo.createBy,
-              createDate: this.formInfo.createDate,
-              updateBy: this.$store.getters.user.username,
-              updateDate: parseTime(new Date()),
-              lawId: this.formInfo.lawItemId
-            }
-          ]).then(res => {
-            console.log(res, 'putLaw')
-            this.$router.push({
-              path: '/train/law'
+          putLaw(
+            this.formInfo.lawId,
+            this.formInfo.title,
+            this.formInfo.depart,
+            this.formInfo.createBy,
+            this.formInfo.createDate,
+            this.$store.getters.user.username,
+            parseTime(new Date()),
+            this.formInfo.createDate,
+            this.formInfo.currentUserRead,
+            [
+              {
+                lawChapter: this.formInfo.content,
+                createBy: this.formInfo.createBy,
+                createDate: this.formInfo.createDate,
+                updateBy: this.$store.getters.user.username,
+                updateDate: parseTime(new Date()),
+                lawId: this.formInfo.lawItemId
+              }
+            ]
+          )
+            .then(res => {
+              console.log(res, "putLaw");
+              this.$router.push({
+                path: "/train/law"
+              });
             })
-          }).catch(() => {})
+            .catch(() => {});
         } else {
-          this.$message.error('发生错误')
+          this.$message.error("发生错误");
         }
-      })
+      });
     }
   }
-}
+};
 </script>
 
-<style lang="scss">
-  .editor-wrapper {
-    padding: 10px 20px;
-  }
-  .pulish-wrapper {
-    margin-top: 20px;
-    display: flex;
-    justify-content: flex-end;
-  }
-  .total-wrapper {
-    width: 800px;
-    margin: 45px auto;
-    padding: 30px;
-    box-shadow: 0 0 2px 2px #eee;
-    border-radius: 30px;
-  }
+<style lang="scss" scoped>
+.editor-wrapper {
+  padding: 10px 20px;
+}
+.pulish-wrapper {
+  margin-top: 20px;
+  display: flex;
+  justify-content: flex-end;
+}
+.total-wrapper {
+  width: 800px;
+  margin: 45px auto;
+  padding: 30px;
+  box-shadow: 0 0 2px 2px #eee;
+  border-radius: 5px;
+}
 </style>

src/views/law/index.vue

@@ -2,8 +2,12 @@
   <div class="law-wrapper">
     <div class="law-tools-wrapper">
       <el-button type="primary" @click="addLawDialogShow">新增</el-button>
-      <el-button type="warning" :disabled="isEditable" @click="editLaw">编辑</el-button>
-      <el-button type="danger" :disabled="isDeleteable" @click="deleteLaw">删除</el-button>
+      <el-button type="warning" :disabled="isEditable" @click="editLaw"
+        >编辑</el-button
+      >
+      <el-button type="danger" :disabled="isDeleteable" @click="deleteLaw"
+        >删除</el-button
+      >
     </div>
     <div class="law-search-wrapper">
       <el-date-picker
@@ -13,9 +17,19 @@
         start-placeholder="开始日期"
         end-placeholder="结束日期"
       />
-      <el-input v-model="keyword" style="width: 200px;margin-left: 20px;" placeholder="请输入关键字" />
-      <el-input v-model="publishPerson" style="width: 200px;margin-left: 20px;" placeholder="请输入发布人" />
-      <el-button type="primary" style="margin-left: 20px;" @click="searchLaw">搜索</el-button>
+      <el-input
+        v-model="keyword"
+        style="width: 200px;margin-left: 20px;"
+        placeholder="请输入关键字"
+      />
+      <el-input
+        v-model="publishPerson"
+        style="width: 200px;margin-left: 20px;"
+        placeholder="请输入发布人"
+      />
+      <el-button type="primary" style="margin-left: 20px;" @click="searchLaw"
+        >搜索</el-button
+      >
     </div>
     <div class="law-table-wrapper">
       <el-table
@@ -24,22 +38,10 @@
         border
         @selection-change="handleSelectionChange"
       >
-        <el-table-column
-          type="selection"
-          width="55"
-        />
-        <el-table-column
-          prop="lawTitle"
-          label="标题"
-        />
-        <el-table-column
-          prop="lawPublisher"
-          label="发布部门"
-        />
-        <el-table-column
-          prop="lawDate"
-          label="发布时间"
-        />
+        <el-table-column type="selection" width="55" />
+        <el-table-column prop="lawTitle" label="标题" />
+        <el-table-column prop="lawPublisher" label="发布部门" />
+        <el-table-column prop="lawDate" label="发布时间" />
       </el-table>
       <el-pagination
         :current-page="currentPage"
@@ -57,16 +59,16 @@
       :close-on-click-modal="false"
       :append-to-body="true"
     >
-      <el-form
-        ref="addform"
-        :model="formInfo"
-        :rules="rules"
-      >
+      <el-form ref="addform" :model="formInfo" :rules="rules">
         <el-form-item label="法律法规标题" :label-width="'120px'" prop="title">
           <el-input v-model="formInfo.title" />
         </el-form-item>
         <el-form-item label="发布部门" :label-width="'120px'" prop="depart">
-          <el-input v-model="formInfo.depart" :maxlength="50" style="width: 500px" />
+          <el-input
+            v-model="formInfo.depart"
+            :maxlength="50"
+            style="width: 500px"
+          />
         </el-form-item>
         <el-form-item label="发布时间" :label-width="'120px'" prop="time">
           <el-date-picker
@@ -85,132 +87,191 @@
 
 <script>
 // 获取法律法规
-import { getLawList, deleteLaw } from '@/api/teachManage'
-import { parseTime } from '@/utils/index'
+import { getLawList, deleteLaw } from "@/api/teachManage";
+import { parseTime } from "@/utils/index";
 export default {
   data() {
     return {
-      lawList: [
-      ],
+      lawList: [],
       multipleSelection: [],
       isEditable: true,
       isDeleteable: true,
       addLawDialog: false,
       formInfo: {
-        title: '',
-        depart: '',
-        time: '',
-        content: ''
+        title: "",
+        depart: "",
+        time: "",
+        content: ""
       },
       ckEditorConfig: {},
       // 经发局列表
       departList: [
         {
-          value: '经发局（应急局）',
-          label: '经发局（应急局）'
+          value: "经发局（应急局）",
+          label: "经发局（应急局）"
         },
         {
-          value: '建设局',
-          label: '建设局'
+          value: "建设局",
+          label: "建设局"
         },
         {
-          value: '市场监督管理局',
-          label: '市场监督管理局'
+          value: "市场监督管理局",
+          label: "市场监督管理局"
         },
         {
-          value: '生态环境局',
-          label: '生态环境局'
+          value: "生态环境局",
+          label: "生态环境局"
         },
         {
-          value: '商务局',
-          label: '商务局'
+          value: "商务局",
+          label: "商务局"
         }
       ],
       rules: {
         title: [
           {
             required: true,
-            message: '请输入标题',
-            trigger: 'blur'
+            message: "请输入标题",
+            trigger: "blur"
           }
         ],
         depart: [
           {
             required: true,
-            message: '请选择经管部门',
-            trigger: 'change'
+            message: "请选择经管部门",
+            trigger: "change"
           }
         ],
         time: [
           {
             required: true,
-            message: '请选择发布时间',
-            trigger: 'change'
+            message: "请选择发布时间",
+            trigger: "change"
           }
         ]
       },
       //
-      inputDate: '',
-      publishPerson: '',
-      keyword: '',
+      inputDate: "",
+      publishPerson: "",
+      keyword: "",
       currentPage: 1,
       curPageSize: 10,
       totalColumn: 40
-    }
+    };
   },
   watch: {
-    'formInfo.content': (newVal, oldVal) => {
-      console.log(newVal, oldVal)
+    "formInfo.content": (newVal, oldVal) => {
+      console.log(newVal, oldVal);
     },
-    'inputDate': (newVal, oldVal) => {
-      console.log(newVal, oldVal, 'hehexixi')
+    inputDate: (newVal, oldVal) => {
+      console.log(newVal, oldVal, "hehexixi");
     }
   },
   mounted() {
-    this.initLawList()
+    this.initLawList();
   },
   methods: {
     initLawList() {
-      if (!(this.inputDate instanceof Array) && !this.publishPerson && !this.keyword) {
+      if (
+        !(this.inputDate instanceof Array) &&
+        !this.publishPerson &&
+        !this.keyword
+      ) {
         getLawList(this.currentPage - 1, this.curPageSize).then(res => {
-          this.lawList = res.content
-        })
+          this.lawList = res.content;
+        });
       } else {
         if (this.inputDate instanceof Array) {
           if (this.keyword && this.publishPerson) {
-            getLawList(this.currentPage - 1, this.curPageSize, parseTime(new Date(this.inputDate[0])), parseTime(new Date(this.inputDate[1])), this.publishPerson, this.keyword).then(res => {
-              this.lawList = res.content
-            })
+            getLawList(
+              this.currentPage - 1,
+              this.curPageSize,
+              parseTime(new Date(this.inputDate[0])),
+              parseTime(new Date(this.inputDate[1])),
+              this.publishPerson,
+              this.keyword
+            ).then(res => {
+              this.lawList = res.content;
+            });
           } else if (this.keyword && !this.publishPerson) {
-            getLawList(this.currentPage - 1, this.curPageSize, parseTime(new Date(this.inputDate[0])), parseTime(new Date(this.inputDate[1])), undefined, this.keyword).then(res => {
-              this.lawList = res.content
-            })
+            getLawList(
+              this.currentPage - 1,
+              this.curPageSize,
+              parseTime(new Date(this.inputDate[0])),
+              parseTime(new Date(this.inputDate[1])),
+              undefined,
+              this.keyword
+            ).then(res => {
+              this.lawList = res.content;
+            });
           } else if (!this.keyword && !this.publishPerson) {
-            getLawList(this.currentPage - 1, this.curPageSize, parseTime(new Date(this.inputDate[0])), parseTime(new Date(this.inputDate[1])), undefined, undefined).then(res => {
-              this.lawList = res.content
-            })
+            getLawList(
+              this.currentPage - 1,
+              this.curPageSize,
+              parseTime(new Date(this.inputDate[0])),
+              parseTime(new Date(this.inputDate[1])),
+              undefined,
+              undefined
+            ).then(res => {
+              this.lawList = res.content;
+            });
           } else if (!this.keyword && this.publishPerson) {
-            getLawList(this.currentPage - 1, this.curPageSize, parseTime(new Date(this.inputDate[0])), parseTime(new Date(this.inputDate[1])), this.publishPerson, undefined).then(res => {
-              this.lawList = res.content
-            })
+            getLawList(
+              this.currentPage - 1,
+              this.curPageSize,
+              parseTime(new Date(this.inputDate[0])),
+              parseTime(new Date(this.inputDate[1])),
+              this.publishPerson,
+              undefined
+            ).then(res => {
+              this.lawList = res.content;
+            });
           }
         } else {
           if (this.keyword && this.publishPerson) {
-            getLawList(this.currentPage - 1, this.curPageSize, undefined, undefined, this.publishPerson, this.keyword).then(res => {
-              this.lawList = res.content
-            })
+            getLawList(
+              this.currentPage - 1,
+              this.curPageSize,
+              undefined,
+              undefined,
+              this.publishPerson,
+              this.keyword
+            ).then(res => {
+              this.lawList = res.content;
+            });
           } else if (this.keyword && !this.publishPerson) {
-            getLawList(this.currentPage - 1, this.curPageSize, undefined, undefined, undefined, this.keyword).then(res => {
-              this.lawList = res.content
-            })
+            getLawList(
+              this.currentPage - 1,
+              this.curPageSize,
+              undefined,
+              undefined,
+              undefined,
+              this.keyword
+            ).then(res => {
+              this.lawList = res.content;
+            });
           } else if (!this.keyword && !this.publishPerson) {
-            getLawList(this.currentPage - 1, this.curPageSize, undefined, undefined, undefined, undefined).then(res => {
-              this.lawList = res.content
-            })
+            getLawList(
+              this.currentPage - 1,
+              this.curPageSize,
+              undefined,
+              undefined,
+              undefined,
+              undefined
+            ).then(res => {
+              this.lawList = res.content;
+            });
           } else if (!this.keyword && this.publishPerson) {
-            getLawList(this.currentPage - 1, this.curPageSize, undefined, undefined, this.publishPerson, undefined).then(res => {
-              this.lawList = res.content
-            })
+            getLawList(
+              this.currentPage - 1,
+              this.curPageSize,
+              undefined,
+              undefined,
+              this.publishPerson,
+              undefined
+            ).then(res => {
+              this.lawList = res.content;
+            });
           }
         }
       }
@@ -219,156 +280,160 @@ export default {
       // this.addLawDialog = true
       // 跳转到法律法规编写页面
       this.$router.push({
-        path: '/train/law/addlaw'
-      })
+        path: "/train/law/addlaw"
+      });
     },
     handleSelectionChange(val) {
-      this.multipleSelection = val
-      this.isEditable = true
-      this.isDeleteable = true
+      this.multipleSelection = val;
+      this.isEditable = true;
+      this.isDeleteable = true;
       if (this.multipleSelection.length === 1) {
-        this.isEditable = false
+        this.isEditable = false;
       }
       if (this.multipleSelection.length > 0) {
-        this.isDeleteable = false
+        this.isDeleteable = false;
       }
     },
     publishLaw() {
       // 发布法律法规
-      this.$refs['addform'].validate((valid) => {
+      this.$refs["addform"].validate(valid => {
         if (valid) {
           // 发布
           // 调用 axios
         } else {
-          this.$message.error('请输入信息')
+          this.$message.error("请输入信息");
         }
-      })
+      });
     },
     editLaw() {
       // 编辑法律法规
       // console.log(this.multipleSelection, 'editLaw')
-      this.$store.dispatch('setLawItem', this.multipleSelection[0]).then(res => {
-        console.log(this.$store.getters.curLawItem, 'this.$store.getters.curLawItem')
-        this.$router.push({
-          path: '/train/law/editlaw'
-        })
-      })
+      this.$store
+        .dispatch("setLawItem", this.multipleSelection[0])
+        .then(res => {
+          console.log(
+            this.$store.getters.curLawItem,
+            "this.$store.getters.curLawItem"
+          );
+          this.$router.push({
+            path: "/train/law/editlaw"
+          });
+        });
     },
     deleteLaw() {
       // 删除法律法规
-      console.log(this.multipleSelection, 'deleteLaw')
-      this.$confirm('此操作将删除选中的法律法规', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        deleteLaw(this.multipleSelection.map(item => item.lawId)).then(res => {
-          this.initLawList()
-          this.$message({
-            type: 'success',
-            message: '删除成功'
-          })
-        }).catch(() => {
-          this.$message.error('删除失败')
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
-        })
+      console.log(this.multipleSelection, "deleteLaw");
+      this.$confirm("此操作将删除选中的法律法规", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          deleteLaw(this.multipleSelection.map(item => item.lawId))
+            .then(res => {
+              this.initLawList();
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
     searchLaw() {
       // 搜索
-      this.initLawList()
+      this.initLawList();
     },
     handleSizeChange(val) {
       // 每页多少条
-      this.curPageSize = val
-      this.initLawList()
+      this.curPageSize = val;
+      this.initLawList();
     },
     handleCurrentChange(val) {
       // 当前是多少页
-      this.currentPage = val
-      this.initLawList()
+      this.currentPage = val;
+      this.initLawList();
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
-  .law-wrapper {
-    margin: 30px auto;
-    width: 80%;
-    box-shadow: 0 0 9px 1px #eee;
-    border-radius: 20px;
-    padding: 20px;
-    .law-tools-wrapper {
-      width: 80%;
-      margin: 30px auto;
-      box-shadow: 0 0 9px 1px #eee;
-      border-radius: 10px;
-      padding: 10px;
-    }
-    .law-search-wrapper {
-      width: 80%;
-      margin: 30px auto;
-      box-shadow: 0 0 9px 1px #eee;
-      border-radius: 10px;
-      padding: 10px;
-    }
-    .law-table-wrapper {
-      width: 80%;
-      margin: 30px auto;
-      box-shadow: 0 0 9px 1px #eee;
-      border-radius: 15px;
-      padding: 15px;
-    }
-  }
-  .to-add-strip-wrapper {
-    padding-left: 120px;
+.law-wrapper {
+  margin: 10px 10px;
+  border-radius: 5px;
+  padding: 10px;
+  .law-tools-wrapper {
+    margin: 10px 10px;
+    border-radius: 10px;
+    padding: 10px;
+    background: #fff;
   }
   .law-search-wrapper {
-    margin: 20px 0;
-    display: flex;
+    margin: 10px 10px;
+    border-radius: 5px;
+    padding: 10px;
+    background: #fff;
   }
-  .add-strips-wrapper {
-    position: relative;
-    padding-left: 120px;
-    padding-right: 30px;
-    margin: 20px 0;
-    .add-strips-title {
-      padding-left: 4px;
-      font-size: 20px;
-      line-height: 24px;
-      letter-spacing: 4px;
-      font-weight: 550;
-      box-shadow: 1px 1px 1px 1.5px #eee;
-      margin-bottom: 7px;
-    }
-    .add-strips-content {
-      padding: 4px;
-      line-height: 18px;
-      border: 1px solid #eee;
-    }
-    .add-strips-dec {
+  .law-table-wrapper {
+    margin: 10px 10px;
+    border-radius: 10px;
+    padding: 15px;
+    background: #fff;
+  }
+}
+.to-add-strip-wrapper {
+  padding-left: 120px;
+}
+.law-search-wrapper {
+  margin: 20px 0;
+  display: flex;
+}
+.add-strips-wrapper {
+  position: relative;
+  padding-left: 120px;
+  padding-right: 30px;
+  margin: 20px 0;
+  .add-strips-title {
+    padding-left: 4px;
+    font-size: 20px;
+    line-height: 24px;
+    letter-spacing: 4px;
+    font-weight: 550;
+    box-shadow: 1px 1px 1px 1.5px #eee;
+    margin-bottom: 7px;
+  }
+  .add-strips-content {
+    padding: 4px;
+    line-height: 18px;
+    border: 1px solid #eee;
+  }
+  .add-strips-dec {
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 25px;
+    height: 25px;
+    background: #f13c3c;
+    border-radius: 50%;
+    .add-strips-inner {
       position: absolute;
-      top: 0;
-      right: 0;
-      width: 25px;
-      height: 25px;
-      background: #F13C3C;
+      width: 17px;
+      height: 3px;
+      background: white;
       border-radius: 50%;
-      .add-strips-inner {
-        position: absolute;
-        width: 17px;
-        height: 3px;
-        background: white;
-        border-radius: 50%;
-        left: 50%;
-        top: 50%;
-        transform: translate(-50%, -50%);
-      }
+      left: 50%;
+      top: 50%;
+      transform: translate(-50%, -50%);
     }
   }
+}
 </style>

src/views/live/index.vue

@@ -4,72 +4,68 @@
       <el-button type="primary" @click="addLive">新增</el-button>
     </div>
     <div class="live-search-wrapper">
-      <el-input v-model="liveName" placeholder="请输入直播名称" style="width: 270px;" />
+      <el-input
+        v-model="liveName"
+        placeholder="请输入直播名称"
+        style="width: 270px;"
+      />
       <el-button type="success">查询</el-button>
     </div>
-    <el-table
-      :data="liveList"
-    >
-      <el-table-column
-        prop="name"
-        label="直播名称"
-        width="280"
-      />
-      <el-table-column
-        prop="introduce"
-        label="简介"
-        width="360"
-      />
-      <el-table-column
-        prop="time"
-        label="直播时间"
+    <div class="live-table-wrapper">
+      <el-table :data="liveList">
+        <el-table-column prop="name" label="直播名称" width="280" />
+        <el-table-column prop="introduce" label="简介" width="360" />
+        <el-table-column prop="time" label="直播时间" />
+      </el-table>
+      <el-pagination
+        :current-page="currentPage"
+        :page-sizes="[10, 20, 30, 40]"
+        :page-size="curPageSize"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="totalPageSize"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
       />
-    </el-table>
-    <el-pagination
-      :current-page="currentPage"
-      :page-sizes="[10, 20, 30, 40]"
-      :page-size="curPageSize"
-      layout="total, sizes, prev, pager, next, jumper"
-      :total="totalPageSize"
-      @size-change="handleSizeChange"
-      @current-change="handleCurrentChange"
-    />
-    <el-dialog
-      title="新增在线直播"
-      :visible.sync="addLiveShow"
-    >
-      <el-form
-        ref="addLiveForm"
-        :model="addFormInfo"
-        label-width="120px"
-      >
-        <el-form-item
-          label="直播名称"
-        >
+    </div>
+
+    <el-dialog title="新增在线直播" :visible.sync="addLiveShow">
+      <el-form ref="addLiveForm" :model="addFormInfo" label-width="120px">
+        <el-form-item label="直播名称">
           <el-input v-model="addFormInfo.name" />
         </el-form-item>
-        <el-form-item
-          label="直播简介"
-        >
+        <el-form-item label="直播简介">
           <el-input v-model="addFormInfo.introduce" />
         </el-form-item>
-        <el-form-item
-          label="时间"
-        >
+        <el-form-item label="时间">
           <el-date-picker
             v-model="addFormInfo.time"
             type="datetime"
             placeholder="选择日期时间"
           />
         </el-form-item>
-        <el-form-item
-          label="企业"
-        >
+        <el-form-item label="企业">
           <div class="live-enter-search-wrapper">
             <!-- <div contenteditable spellcheck="false" class="inputSearch-div" /> -->
-            <input ref="searchInput" class="inputSearch-input" type="text" placeholder="请输入企业名称" @keydown.enter="inputEnterSearch" @compositionend="inputCompositionEnd">
-            <div v-show="isShowSearchEntries" class="live-enter-search-result-wrapper">
-              <div v-for="item in searchEntries" :key="item.companyId" class="live-enter-search-result-item" @click.stop="chooseEnter(item.companyId)">{{ item.companyName }}</div>
+            <input
+              ref="searchInput"
+              class="inputSearch-input"
+              type="text"
+              placeholder="请输入企业名称"
+              @keydown.enter="inputEnterSearch"
+              @compositionend="inputCompositionEnd"
+            />
+            <div
+              v-show="isShowSearchEntries"
+              class="live-enter-search-result-wrapper"
+            >
+              <div
+                v-for="item in searchEntries"
+                :key="item.companyId"
+                class="live-enter-search-result-item"
+                @click.stop="chooseEnter(item.companyId)"
+              >
+                {{ item.companyName }}
+              </div>
             </div>
           </div>
         </el-form-item>
@@ -86,17 +82,17 @@
 export default {
   data() {
     return {
-      liveName: '',
+      liveName: "",
       liveList: [
         {
-          name: '1',
-          introduce: '2',
-          time: '3'
+          name: "1",
+          introduce: "2",
+          time: "3"
         },
         {
-          name: '3',
-          introduce: '2',
-          time: '1'
+          name: "3",
+          introduce: "2",
+          time: "1"
         }
       ],
       currentPage: 1,
@@ -104,36 +100,36 @@ export default {
       totalPageSize: 40,
       addLiveShow: false,
       addFormInfo: {
-        name: '',
-        introduce: '',
-        time: '',
-        company: ''
+        name: "",
+        introduce: "",
+        time: "",
+        company: ""
       },
       searchEntries: [],
       isShowSearchEntries: false
-    }
+    };
   },
   mounted() {
-    this.checkSearchItemClick = (event) => {
+    this.checkSearchItemClick = event => {
       // if (event.target.contains())
-      this.isShowSearchEntries = false
-    }
-    document.addEventListener('click', this.checkSearchItemClick)
+      this.isShowSearchEntries = false;
+    };
+    document.addEventListener("click", this.checkSearchItemClick);
   },
   beforeDestroy() {
     // this.checkSearchItemClick = false
-    document.removeEventListener('click', this.checkSearchItemClick)
+    document.removeEventListener("click", this.checkSearchItemClick);
   },
   methods: {
     handleCurrentChange(val) {
-      this.currentPage = val
+      this.currentPage = val;
     },
     handleSizeChange(val) {
-      this.curPageSize = val
+      this.curPageSize = val;
     },
     addLive() {
       //
-      this.addLiveShow = true
+      this.addLiveShow = true;
     },
     inputEnterSearch() {
       // event
@@ -167,95 +163,114 @@ export default {
       // ]
     },
     inputCompositionEnd() {
-      this.$refs.searchInput.value
-      this.isShowSearchEntries = true
+      this.$refs.searchInput.value;
+      this.isShowSearchEntries = true;
       this.searchEntries = [
         {
-          companyName: '威海光华1广场',
+          companyName: "威海光华1广场",
           companyId: 10
         },
         {
-          companyName: '威海光华2广场',
+          companyName: "威海光华2广场",
           companyId: 11
         },
         {
-          companyName: '威海光华3广场',
+          companyName: "威海光华3广场",
           companyId: 12
         },
         {
-          companyName: '威海光华4广场',
+          companyName: "威海光华4广场",
           companyId: 13
         },
         {
-          companyName: '威海光华5广场',
+          companyName: "威海光华5广场",
           companyId: 14
         },
         {
-          companyName: '发士大夫',
+          companyName: "发士大夫",
           companyId: 15
         }
-      ]
+      ];
     },
     chooseEnter(companyId) {
       // 当前选中的 companyId
-      this.isShowSearchEntries = false
+      this.isShowSearchEntries = false;
       //
     },
     cancelChosenEnter() {
       //
-      console.log('被点击了吗')
-      this.isShowSearchEntries = false
+      console.log("被点击了吗");
+      this.isShowSearchEntries = false;
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
-  .live-search-wrapper {
-    margin: 20px 0;
-  }
-  .live-enter-search-wrapper {
-    position: relative;
-    background: #eee;
+.live-search-wrapper {
+  margin: 20px 0;
+}
+.live-enter-search-wrapper {
+  position: relative;
+  background: #eee;
+}
+.inputSearch-div {
+  font-size: 16px;
+  line-height: 16px;
+  padding-left: 10px;
+  white-space: nowrap;
+  &:empty::after {
+    content: "请输入企业名称";
   }
-  .inputSearch-div {
-    font-size: 16px;
-    line-height: 16px;
-    padding-left: 10px;
-    white-space: nowrap;
-    &:empty::after{
-      content: "请输入企业名称";
-    }
+}
+.live-enter-search-result-wrapper {
+  position: absolute;
+  top: 32px;
+  left: 20px;
+  width: 280px;
+  height: 100px;
+  overflow-y: scroll;
+  /* border: 1px solid #eee; */
+  box-shadow: 1px 1px 1px 2px #eee;
+  &::-webkit-scrollbar {
+    display: none;
   }
-  .live-enter-search-result-wrapper {
-    position: absolute;
-    top: 32px;
-    left: 20px;
-    width: 280px;
-    height: 100px;
-    overflow-y: scroll;
-    /* border: 1px solid #eee; */
-    box-shadow: 1px 1px 1px 2px #eee;
-    &::-webkit-scrollbar {
-      display: none;
-    }
-    .live-enter-search-result-item {
-      height: 20px;
-      width: 100%;
-      margin: 7px 0;
-      line-height: 20px;
-      padding-left: 7px;
-      /* background: silver; */
-      &:hover {
-        background: #eee;
-        cursor: pointer;
-      }
+  .live-enter-search-result-item {
+    height: 20px;
+    width: 100%;
+    margin: 7px 0;
+    line-height: 20px;
+    padding-left: 7px;
+    /* background: silver; */
+    &:hover {
+      background: #eee;
+      cursor: pointer;
     }
   }
-  .inputSearch-input {
-    outline: none;
-    border: none;
-    background: #eee;
-    padding-left: 10px;
-  }
+}
+.inputSearch-input {
+  outline: none;
+  border: none;
+  background: #eee;
+  padding-left: 10px;
+}
+
+.live-tools-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  background: #fff;
+}
+.live-search-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  background: #fff;
+}
+.live-table-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  background: #fff;
+}
 </style>

src/views/riskcontrol/riskdetail/index.vue

 <template>
   <div class="risk-detail-wrapper">
     <div class="enter-name-wrapper">
-      <!-- <div class="enter-name">{{ '企业: ' + enterRiskDetail.entername }}</div> -->
-      <h2 class="enter-name">{{ '企业: ' + enterRiskDetail.entername }}</h2>
+      <h2 class="enter-name">{{ "企业: " + enterRiskDetail.entername }}</h2>
     </div>
     <div class="risk-degree-wrapper">
-      <!-- <div class="risk-degree-title">风险点数量</div> -->
       <h3 class="risk-degree-title">风险点数量</h3>
       <div class="risk-degree-num">
         <el-row :gutter="12">
           <el-col :span="5">
             <div class="significant-degree-wrapper">
               <div class="singficant-title">重大风险数量：&nbsp;&nbsp;</div>
-              <div class="singficant-degree"><el-input v-model="enterRiskDetail.significantSum" /></div>
-              <!-- <div class="singficant-subtitle">个</div> -->
+              <div class="singficant-degree">
+                <el-input v-model="enterRiskDetail.significantSum" disabled />
+              </div>
             </div>
           </el-col>
           <el-col :span="5">
             <div class="large-degree-wrapper">
               <div class="large-title">较大风险数量：&nbsp;&nbsp;</div>
-              <div class="large-degree"><el-input v-model="enterRiskDetail.largeSum" /></div>
-              <!-- <div class="large-subtitle">个</div> -->
+              <div class="large-degree">
+                <el-input v-model="enterRiskDetail.largeSum" disabled />
+              </div>
             </div>
           </el-col>
-          <el-col :span="5">
-            <div class="general-degree-wrapper">
-              <div class="general-title">一般风险数量：&nbsp;&nbsp;</div>
-              <div class="general-degree"><el-input v-model="enterRiskDetail.generalSum" /></div>
-            </div>
-          </el-col>
-          <el-col :span="5">
-            <div class="low-degree-wrapper">
-              <div class="low-title">低风险数量：&nbsp;&nbsp;</div>
-              <div class="low-degree"><el-input v-model="enterRiskDetail.lowSum" /></div>
-            </div>
-          </el-col>
-          <div class="tool-btn-wrapper">
-            <el-button type="success" size="mini" @click="saveToRiskNums">保存</el-button>
-          </div>
         </el-row>
       </div>
     </div>
@@ -49,10 +34,15 @@
           <div class="import-file-risk-wrapper" @click="imortRisk">
             <label class="import-file-risk">
               导入
-              <input ref="riskimportfile" multiple type="file" hidden @change="realImportRisk">
+              <input
+                ref="riskimportfile"
+                multiple
+                type="file"
+                hidden
+                @change="realImportRisk"
+              />
             </label>
           </div>
-          <!--<el-button type="success" size="mini" @click="exportRiskseFile">导出</el-button>-->
         </div>
       </div>
       <div class="sorrisk-table-wrapper">
@@ -62,26 +52,15 @@
           style="width: 100%"
           border
         >
-          <el-table-column
-            prop="riskorder"
-            label="序号"
-            width="60"
-          />
-          <el-table-column
-            prop="riskPoint"
-            label="风险点"
-            width="80"
-          />
-          <el-table-column
-            prop="riskType"
-            label="类型"
-            width="80"
-          />
-          <el-table-column
-            prop="riskArea"
-            label="区域位置"
-            width="80"
-          />
+          <el-table-column label="序号" width="80">
+            <template slot-scope="scope">
+              {{ enterRiskDetail.riskList.indexOf(scope.row) + 1 }}
+            </template>
+          </el-table-column>
+          <el-table-column prop="level" label="风险类型" width="80" />
+          <el-table-column prop="riskPoint" label="风险点" width="80" />
+          <el-table-column prop="riskType" label="类型" width="80" />
+          <el-table-column prop="riskArea" label="区域位置" width="80" />
           <el-table-column
             prop="riskPossibleCase"
             label="可能发生的事故类型及后果"
@@ -102,41 +81,37 @@
             label="责任单位"
             width="120"
           />
-          <el-table-column
-            prop="riskChargePer"
-            label="责任人"
-            width="120"
-          />
-          <el-table-column
-            label="是否有视频或监控"
-            width="160"
-          >
+          <el-table-column prop="riskChargePer" label="责任人" width="120" />
+          <el-table-column label="是否有视频或监控" width="160">
             <template slot-scope="scope">
-              {{ (scope.row.riskId === 1225 || scope.row.riskId === 63 || scope.row.riskId === 53 || scope.row.riskId === 58 || scope.row.riskId === 108) ? '有' : (scope.row.riskVideoPath ? '有' : '无') }}
+              {{ isHasMonitor(scope.row) }}
+            </template>
+          </el-table-column>
+          <el-table-column label="是否已消除">
+            <template slot-scope="scope">
+              <div v-if="scope.row.handle">是</div>
+              <div v-else>否</div>
             </template>
           </el-table-column>
           <el-table-column
-            prop="riskRemark"
-            label="备注"
-            width="120"
-          />
-          <el-table-column
-            label="操作"
-            width="160"
-          >
-            <template
-              slot-scope="scope"
-            >
+            prop="validationExpert"
+            label="验证专家"
+          ></el-table-column>
+          <el-table-column prop="riskRemark" label="备注" width="120" />
+          <el-table-column label="操作" width="160">
+            <template slot-scope="scope">
               <el-button
                 size="mini"
                 type="warning"
                 @click="handleEdit(scope.$index, scope.row)"
-              >编辑</el-button>
+                >编辑</el-button
+              >
               <el-button
                 size="mini"
                 type="danger"
                 @click="handleDelete(scope.$index, scope.row)"
-              >删除</el-button>
+                >删除</el-button
+              >
             </template>
           </el-table-column>
         </el-table>
@@ -157,10 +132,16 @@
       :visible.sync="adddialogform"
       :close-on-click-modal="false"
     >
-      <el-form :model="riskDetail">
+      <el-form :model="riskDetail" v-if="adddialogform">
         <el-form-item label="序号" :label-width="'120px'">
           <el-input v-model="riskDetail.riskorder" :disabled="true" />
         </el-form-item>
+        <el-form-item label="风险等级" :label-width="'120px'">
+          <el-select v-model="riskDetail.level" placeholder="请选择">
+            <el-option label="重大风险" value="重大风险"> </el-option>
+            <el-option label="较大风险" value="较大风险"> </el-option>
+          </el-select>
+        </el-form-item>
         <el-form-item label="风险点" :label-width="'120px'">
           <el-input v-model="riskDetail.riskPoint" />
         </el-form-item>
@@ -171,7 +152,11 @@
           <el-input v-model="riskDetail.riskArea" />
         </el-form-item>
         <el-form-item label="可能发生的事故类型及后果" :label-width="'120px'">
-          <el-input v-model="riskDetail.riskPossibleCase" autosize type="textarea" />
+          <el-input
+            v-model="riskDetail.riskPossibleCase"
+            autosize
+            type="textarea"
+          />
         </el-form-item>
         <el-form-item label="风险管控措施" :label-width="'120px'">
           <el-input v-model="riskDetail.riskMeasure" autosize type="textarea" />
@@ -185,6 +170,13 @@
         <el-form-item label="责任人" :label-width="'120px'">
           <el-input v-model="riskDetail.riskChargePer" />
         </el-form-item>
+        <el-form-item label="是否已消除" :label-width="'120px'">
+          <el-radio v-model="riskDetail.handle" :label="true">已消除</el-radio>
+          <el-radio v-model="riskDetail.handle" :label="false">未消除</el-radio>
+        </el-form-item>
+        <el-form-item label="验证专家" :label-width="'120px'">
+          <el-input v-model="riskDetail.validationExpert" />
+        </el-form-item>
         <el-form-item label="备注" :label-width="'120px'">
           <el-input v-model="riskDetail.riskRemark" />
         </el-form-item>
@@ -192,10 +184,12 @@
       <div class="upload-risk-video">
         <el-row :gutter="30">
           <el-col :span="8">
-            <div style="text-align:right;background:#3884CC;font-size: 20px;line-height: 30px;height: 34px;text-align: center;color: #eee;">
+            <div
+              style="text-align:right;background:#3884CC;font-size: 20px;line-height: 30px;height: 34px;text-align: center;color: #eee;"
+            >
               <label style="width: 100%;height: 100%;">
                 导入风险点视频
-                <input ref="uploadRiskVideo" type="file" hidden>
+                <input ref="uploadRiskVideo" type="file" hidden />
               </label>
             </div>
           </el-col>
@@ -218,41 +212,60 @@
         <el-form-item label="序号">
           <el-input v-model="riskDetail.riskorder" :disabled="true" />
         </el-form-item>
-        <el-form-item label="风险点">
+        <el-form-item label="风险等级" :label-width="'120px'">
+          <el-select v-model="riskDetail.level" placeholder="请选择">
+            <el-option label="重大风险" value="重大风险"> </el-option>
+            <el-option label="较大风险" value="较大风险"> </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="风险点" :label-width="'120px'">
           <el-input v-model="riskDetail.riskPoint" />
         </el-form-item>
-        <el-form-item label="类型">
+        <el-form-item label="类型" :label-width="'120px'">
           <el-input v-model="riskDetail.riskType" />
         </el-form-item>
-        <el-form-item label="区域位置">
+        <el-form-item label="区域位置" :label-width="'120px'">
           <el-input v-model="riskDetail.riskArea" />
         </el-form-item>
-        <el-form-item label="可能发生的事故类型及后果">
-          <el-input v-model="riskDetail.riskPossibleCase" autosize type="textarea" />
+        <el-form-item label="可能发生的事故类型及后果" :label-width="'120px'">
+          <el-input
+            v-model="riskDetail.riskPossibleCase"
+            autosize
+            type="textarea"
+          />
         </el-form-item>
-        <el-form-item label="风险管控措施">
+        <el-form-item label="风险管控措施" :label-width="'120px'">
           <el-input v-model="riskDetail.riskMeasure" autosize type="textarea" />
         </el-form-item>
-        <el-form-item label="管控层级">
+        <el-form-item label="管控层级" :label-width="'120px'">
           <el-input v-model="riskDetail.riskControlLevel" />
         </el-form-item>
-        <el-form-item label="责任单位">
+        <el-form-item label="责任单位" :label-width="'120px'">
           <el-input v-model="riskDetail.riskChargeDepartment" />
         </el-form-item>
-        <el-form-item label="责任人">
+        <el-form-item label="责任人" :label-width="'120px'">
           <el-input v-model="riskDetail.riskChargePer" />
         </el-form-item>
-        <el-form-item label="备注">
+        <el-form-item label="是否已消除" :label-width="'120px'">
+          <el-radio v-model="riskDetail.handle" :label="true">已消除</el-radio>
+          <el-radio v-model="riskDetail.handle" :label="false">未消除</el-radio>
+        </el-form-item>
+        <el-form-item label="验证专家" :label-width="'120px'">
+          <el-input v-model="riskDetail.validationExpert" />
+        </el-form-item>
+        <el-form-item label="备注" :label-width="'120px'">
           <el-input v-model="riskDetail.riskRemark" />
         </el-form-item>
       </el-form>
       <div class="upload-risk-video">
         <el-row :gutter="30">
           <el-col :span="8">
-            <div style="text-align:right;background:#3884CC;font-size: 20px;line-height: 30px;height: 34px;text-align: center;color: #eee;">
+            <div
+              style="text-align:right;background:#3884CC;font-size: 20px;line-height: 30px;height: 34px;text-align: center;color: #eee;"
+            >
               <label style="width: 100%;height: 100%;">
                 更改风险点视频
-                <input ref="updateRiskVideo" type="file" hidden>
+                <input ref="updateRiskVideo" type="file" hidden />
               </label>
             </div>
           </el-col>
@@ -270,35 +283,53 @@
 </template>
 
 <script>
-import axiosFile from '@/utils/requestfile.js'
+import axiosFile from "@/utils/requestfile.js";
 // 获取企业风险 新增企业风险 修改企业风险 删除企业风险 导出数据
-import { getthRisk, addthRisk, editthRisk, deletethRisk, downloadRiskData, getriskNumAnalysis, postriskNumAnalysis, putriskNumAnalysis } from '../../../api/industry.js'
+import {
+  getthRisk,
+  addthRisk,
+  editthRisk,
+  deletethRisk,
+  downloadRiskData,
+  getriskNumAnalysisBackend,
+  getriskNumAnalysis,
+  postriskNumAnalysis,
+  putriskNumAnalysis
+} from "../../../api/industry.js";
+import monitorList from "@/utils/monitorconfig";
 export default {
   data() {
     return {
+      curChildSelectList: [],
       riskDetail: {
         // 序号
         riskorder: 1,
+        // 风险类型
+        level: "",
         // 区域位置
-        riskArea: '',
+        riskArea: "",
         // 责任单位
-        riskChargeDepartment: '',
+        riskChargeDepartment: "",
         // 责任人
-        riskChargePer: '',
+        riskChargePer: "",
         // 管控层级
-        riskControlLevel: '',
+        riskControlLevel: "",
         // 风险id
         riskId: 0,
         // 风险管控措施
-        riskMeasure: '',
+        riskMeasure: "",
         // 风险点
-        riskPoint: '',
+        riskPoint: "",
         // 可能发生的事故类型及后果
-        riskPossibleCase: '',
+        riskPossibleCase: "",
         // 备注
-        riskRemark: '',
+        riskRemark: "",
         // 类型
-        riskType: ''
+        riskType: "",
+        // 是否消除
+        handle: false,
+        // 验证专家
+        validationExpert: ""
       },
       // 新增对话框
       adddialogform: false,
@@ -306,7 +337,7 @@ export default {
       editdialogform: false,
       enterRiskDetail: {
         // 企业名称
-        entername: '永和大王',
+        entername: "永和大王",
         // 重大风险数量
         significantSum: 0,
         significantId: 0,
@@ -316,8 +347,7 @@ export default {
         generalId: 0,
         lowSum: 0,
         lowId: 0,
-        riskList: [
-        ]
+        riskList: []
       },
       // 是否加载所有风险
       isLoadingAllRisk: false,
@@ -331,118 +361,144 @@ export default {
       isShowRiskAlert: false,
       // 当前上传进度
       curUploadProgress: 0
-    }
+    };
   },
   async created() {
-    this.enterRiskDetail.entername = this.$route.params.name.split('&')[1]
-    this.riskDetail.companyId = Number(this.$route.params.name.split('&')[0])
-    await this.initAllRisk()
-    await this.getAllRiskNumAnalisis()
-    console.log(new Date())
+    this.enterRiskDetail.entername = this.$route.params.name.split("&")[1];
+    this.riskDetail.companyId = Number(this.$route.params.name.split("&")[0]);
+    await this.initAllRisk();
+    await this.getAllRiskNumAnalisis();
+    console.log(new Date());
   },
   async mounted() {
-    console.log(new Date())
+    console.log(new Date());
   },
   methods: {
+    // 判断是否有监控
+    isHasMonitor(row) {
+      let isHasMonitor = false;
+      for (let i = 0; i < monitorList.length; i++) {
+        if (row.riskId === monitorList[i].riskId) {
+          isHasMonitor = true;
+        }
+      }
+      if (isHasMonitor) {
+        return "有";
+      }
+      if (row.riskVideoPath && row.riskVideoPath !== "null") {
+        return "有";
+      }
+      return "无";
+    },
     // 获取所有风险管控数量信息
     async getAllRiskNumAnalisis() {
-      await getriskNumAnalysis(this.riskDetail.companyId).then(async(res) => {
-        if (res.totalElements === 0) {
-          // 调用接口增加四个风险数量
-          const p1 = postriskNumAnalysis(this.riskDetail.companyId, '重大风险', 0)
-          const p2 = postriskNumAnalysis(this.riskDetail.companyId, '较大风险', 0)
-          const p3 = postriskNumAnalysis(this.riskDetail.companyId, '一般风险', 0)
-          const p4 = postriskNumAnalysis(this.riskDetail.companyId, '低风险', 0)
-          await Promise.all([p1, p2, p3, p4]).then(res => {
-            this.getAllRiskNumAnalisis(this.riskDetail.companyId)
-          }, () => {
-            this.$message.error('初始化失败')
-          })
-        } else if (res.totalElements > 3) {
-          for (let i = 0; i < res.content.length; i++) {
-            if (res.content[i].rnaLevel === '重大风险') {
-              this.enterRiskDetail.significantSum = res.content[i].rnaNum
-              this.enterRiskDetail.significantId = res.content[i].rnaId
-              break
-            }
-          }
-          for (let i = 0; i < res.content.length; i++) {
-            if (res.content[i].rnaLevel === '较大风险') {
-              this.enterRiskDetail.largeSum = res.content[i].rnaNum
-              this.enterRiskDetail.largeId = res.content[i].rnaId
-              break
-            }
-          }
-          for (let i = 0; i < res.content.length; i++) {
-            if (res.content[i].rnaLevel === '一般风险') {
-              this.enterRiskDetail.generalSum = res.content[i].rnaNum
-              this.enterRiskDetail.generalId = res.content[i].rnaId
-              break
-            }
-          }
-          for (let i = 0; i < res.content.length; i++) {
-            if (res.content[i].rnaLevel === '低风险') {
-              this.enterRiskDetail.lowSum = res.content[i].rnaNum
-              this.enterRiskDetail.lowId = res.content[i].rnaId
-              break
-            }
-          }
-        }
-      })
+      getriskNumAnalysisBackend(this.riskDetail.companyId).then(async res => {
+        this.enterRiskDetail.significantSum = res.majorRiskNum;
+        this.enterRiskDetail.largeSum = res.greaterRiskNum;
+      });
     },
     // 获取所有的风险管控
     async initAllRisk() {
       // 获取当前风险
-      this.isLoadingAllRisk = true
-      await getthRisk(this.riskDetail.companyId, this.currentComRiskPage - 1, this.currentComRiskNum).then(res => {
-        this.totalComRiskNum = res.totalElements
-        this.enterRiskDetail.riskList = [...res.content]
-        for (let i = 0; i < this.enterRiskDetail.riskList.length; i++) {
-          this.enterRiskDetail.riskList[i].riskorder = i + 1
+      this.isLoadingAllRisk = true;
+      await getthRisk(
+        this.riskDetail.companyId,
+        this.currentComRiskPage - 1,
+        this.currentComRiskNum
+      ).then(
+        res => {
+          this.totalComRiskNum = res.totalElements;
+          this.enterRiskDetail.riskList = [...res.content];
+          console.log(
+            this.enterRiskDetail.riskList,
+            "this.enterRiskDetail.riskList this.enterRiskDetail.riskList"
+          );
+          for (let i = 0; i < this.enterRiskDetail.riskList.length; i++) {
+            this.enterRiskDetail.riskList[i].riskorder = i + 1;
+          }
+          this.isLoadingAllRisk = false;
+        },
+        () => {
+          this.isLoadingAllRisk = false;
         }
-        this.isLoadingAllRisk = false
-      }, () => {
-        this.isLoadingAllRisk = false
-      })
+      );
     },
     // 点击风险管控的编辑按钮
     handleEdit(index, row) {
-      console.log(index, row, '难道没有id吗')
-      this.riskDetail = { ...row }
-      this.editdialogform = true
+      console.log(index, row, "难道没有id吗");
+      this.riskDetail = { ...row };
+      this.editdialogform = true;
     },
     // 点击风险管控的删除按钮
     handleDelete(index, row) {
-      this.$confirm('确定要删除此项', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(async() => {
-        deletethRisk(Number(row.riskId)).then(res => {
+      this.$confirm("确定要删除此项", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(
+        async () => {
+          deletethRisk(Number(row.riskId)).then(
+            res => {
+              this.$message({
+                message: "删除成功",
+                type: "success"
+              });
+              this.initAllRisk();
+              this.getAllRiskNumAnalisis();
+            },
+            () => {
+              this.$message.error("删除失败");
+            }
+          );
+        },
+        () => {
           this.$message({
-            message: '删除成功',
-            type: 'success'
-          })
-          this.initAllRisk()
-        }, () => {
-          this.$message.error('删除失败')
-        })
-      }, () => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
-        })
-      })
+            type: "info",
+            message: "已取消删除"
+          });
+        }
+      );
     },
     // 增加风险管控详情对话框的显示
     addriskdetail() {
       // 设置序号
-      this.riskDetail.riskorder = this.enterRiskDetail.riskList.length + 1
-      this.adddialogform = true
+      this.riskDetail.riskorder = this.enterRiskDetail.riskList.length + 1;
+      this.adddialogform = true;
+      let nullRiskDetail = {
+        // 序号
+        riskorder: 1,
+        // 风险类型
+        level: "",
+        // 区域位置
+        riskArea: "",
+        // 责任单位
+        riskChargeDepartment: "",
+        // 责任人
+        riskChargePer: "",
+        // 管控层级
+        riskControlLevel: "",
+        // 风险id
+        riskId: 0,
+        // 风险管控措施
+        riskMeasure: "",
+        // 风险点
+        riskPoint: "",
+        // 可能发生的事故类型及后果
+        riskPossibleCase: "",
+        // 备注
+        riskRemark: "",
+        // 类型
+        riskType: "",
+        // 是否消除
+        handle: false,
+        // 验证专家
+        validationExpert: ""
+      };
+      this.riskDetail = { ...this.riskDetail, ...nullRiskDetail };
     },
     // 取消增加风险管控详情对话框的显示
     adddialogcancel() {
-      this.adddialogform = false
+      this.adddialogform = false;
     },
     // 确定增加风险管控详情对话框
     confirmadddialog() {
@@ -451,128 +507,162 @@ export default {
        * 注意*****
        */
       // 要把riskId处理掉
-      const replaceRiskDetail = { ...this.riskDetail }
-      delete replaceRiskDetail.riskId
-      const mForm = new FormData()
+      const replaceRiskDetail = { ...this.riskDetail };
+      delete replaceRiskDetail.riskId;
+      const mForm = new FormData();
+      for (const key in replaceRiskDetail) {
+        if (!replaceRiskDetail[key]) {
+          delete replaceRiskDetail[key];
+        }
+      }
       for (const key in replaceRiskDetail) {
-        mForm.append(key, replaceRiskDetail[key])
+        mForm.append(key, replaceRiskDetail[key]);
       }
       if (this.$refs.uploadRiskVideo.files.length > 0) {
-        console.log('file', this.$refs.uploadRiskVideo.files[0])
-        mForm.append('file', this.$refs.uploadRiskVideo.files[0])
+        console.log("file", this.$refs.uploadRiskVideo.files[0]);
+        mForm.append("file", this.$refs.uploadRiskVideo.files[0]);
       }
       axiosFile({
-        url: '/api/thRisk/create',
-        method: 'POST',
+        url: "/api/thRisk/create",
+        method: "POST",
         data: mForm,
         onUploadProgress: progressEvent => {
           // progressEvent.loaded
           // progressEvent.total
-          this.curUploadProgress = ((progressEvent.loaded / progressEvent.total) * 100).toFixed(0)
+          this.curUploadProgress = (
+            (progressEvent.loaded / progressEvent.total) *
+            100
+          ).toFixed(0);
         }
       }).then(res => {
-        this.adddialogform = false
+        this.adddialogform = false;
         this.$message({
-          type: 'success',
-          message: '上传成功'
-        })
-      })
+          type: "success",
+          message: "上传成功"
+        });
+        this.getAllRiskNumAnalisis();
+        this.initAllRisk();
+      });
     },
     // 编辑对话框取消
     editdialogcancel() {
-      this.editdialogform = false
+      this.editdialogform = false;
     },
     // 确定编辑对话框
     confirmeditdialog() {
       //
-      const mFormData = new FormData()
-      for (const key in this.riskDetail) {
-        mFormData.append(key, this.riskDetail[key])
+      const replaceRiskDetail = { ...this.riskDetail };
+      for (const key in replaceRiskDetail) {
+        if (!replaceRiskDetail[key]) {
+          delete replaceRiskDetail[key];
+        }
+      }
+      const mFormData = new FormData();
+      for (const key in replaceRiskDetail) {
+        mFormData.append(key, this.riskDetail[key]);
       }
       if (this.$refs.updateRiskVideo.files.length > 0) {
-        mFormData.append('file', this.$refs.updateRiskVideo.files[0])
+        mFormData.append("file", this.$refs.updateRiskVideo.files[0]);
       }
       axiosFile({
-        url: '/api/thRisk/update',
-        method: 'POST',
+        url: "/api/thRisk/update",
+        method: "POST",
         data: mFormData,
         onUploadProgress: progressEvent => {
-          this.curUploadProgress = ((progressEvent.loaded / progressEvent.total) * 100).toFixed(0)
+          this.curUploadProgress = (
+            (progressEvent.loaded / progressEvent.total) *
+            100
+          ).toFixed(0);
         }
       }).then(res => {
-        this.editdialogform = false
+        this.editdialogform = false;
         this.$message({
-          type: 'success',
-          message: '上传成功'
-        })
-      })
+          type: "success",
+          message: "上传成功"
+        });
+        this.getAllRiskNumAnalisis();
+        this.initAllRisk();
+      });
     },
     // 风险分页 页内个数的限制
     handleCOMRisksSizeChange(val) {
-      this.currentComRiskNum = val
-      console.log(val, '选择页内页数大小变化')
+      this.currentComRiskNum = val;
+      console.log(val, "选择页内页数大小变化");
     },
     // 风险换页
     handleCOMRisksPageChange(val) {
-      this.currentComRiskPage = val
+      this.currentComRiskPage = val;
       // 去请求数据
-      this.initAllRisk()
+      this.initAllRisk();
     },
     // 导入风险 对话框控制
     imortRisk($event) {
       if (this.isShowRiskAlert === false) {
-        $event.preventDefault()
-        $event.stopPropagation()
-        this.$alert('请先将文件另存为97-2003(xls)格式', '请注意', {
-          confirmButtonText: '确定',
+        $event.preventDefault();
+        $event.stopPropagation();
+        this.$alert("请先将文件另存为97-2003(xls)格式", "请注意", {
+          confirmButtonText: "确定",
           callback: action => {
-            console.log(action, 'helloworld')
-            this.isShowRiskAlert = true
-            $event.target.click()
+            console.log(action, "helloworld");
+            this.isShowRiskAlert = true;
+            $event.target.click();
             setTimeout(() => {
-              this.isShowRiskAlert = false
-            }, 0)
+              this.isShowRiskAlert = false;
+            }, 0);
           }
-        })
+        });
       }
     },
     // 选中文件导入风险
     realImportRisk() {
-      const formdata = new FormData()
-      formdata.append('companyId', this.riskDetail.companyId)
-      for (let i = 0; i < this.$refs['riskimportfile'].files.length; i++) {
-        formdata.append('files', this.$refs['riskimportfile'].files[i])
+      const formdata = new FormData();
+      formdata.append("companyId", this.riskDetail.companyId);
+      for (let i = 0; i < this.$refs["riskimportfile"].files.length; i++) {
+        formdata.append("files", this.$refs["riskimportfile"].files[i]);
       }
-      if (this.$refs['riskimportfile'].files.length === 0) {
-        return
+      if (this.$refs["riskimportfile"].files.length === 0) {
+        return;
       }
       axiosFile({
-        url: '/api/thRisk/importExcel',
-        method: 'POST',
+        url: "/api/thRisk/importExcel",
+        method: "POST",
         data: formdata
-      }).then(res => {
-        this.$message({
-          message: '导入成功',
-          type: 'success'
-        })
-        this.initAllRisk()
-      }, () => {
-        this.$message.error('导入失败')
-      })
+      }).then(
+        res => {
+          this.$message({
+            message: "导入成功",
+            type: "success"
+          });
+          this.initAllRisk();
+        },
+        () => {
+          this.$message.error("导入失败");
+        }
+      );
     },
     // 导出文件
     exportRiskseFile() {
-      downloadRiskData(Number(this.riskDetail.companyId)).then(res => {
-        const downLoadURL = URL.createObjectURL(new Blob([res]))
-        const toa = document.createElement('a')
-        document.body.appendChild(toa)
-        toa.href = downLoadURL
-        toa.download = '' + Math.floor((Math.random() * 10)) + Math.floor((Math.random() * 10)) + Math.floor((Math.random() * 10)) + Math.floor((Math.random() * 10)) + Math.floor((Math.random() * 10)) + '.xls'
-        toa.click()
-        toa.remove()
-      }, () => {
-        this.$message.error('导出失败')
-      })
+      downloadRiskData(Number(this.riskDetail.companyId)).then(
+        res => {
+          const downLoadURL = URL.createObjectURL(new Blob([res]));
+          const toa = document.createElement("a");
+          document.body.appendChild(toa);
+          toa.href = downLoadURL;
+          toa.download =
+            "" +
+            Math.floor(Math.random() * 10) +
+            Math.floor(Math.random() * 10) +
+            Math.floor(Math.random() * 10) +
+            Math.floor(Math.random() * 10) +
+            Math.floor(Math.random() * 10) +
+            ".xls";
+          toa.click();
+          toa.remove();
+        },
+        () => {
+          this.$message.error("导出失败");
+        }
+      );
     },
     // 保存数量
     saveToRiskNums() {
@@ -580,144 +670,147 @@ export default {
         companyId: this.riskDetail.companyId,
         rnaId: this.enterRiskDetail.significantId,
         rnaNum: this.enterRiskDetail.significantSum,
-        rnaLevel: '重大风险'
-      })
+        rnaLevel: "重大风险"
+      });
       const p2 = putriskNumAnalysis({
         companyId: this.riskDetail.companyId,
         rnaId: this.enterRiskDetail.largeId,
         rnaNum: this.enterRiskDetail.largeSum,
-        rnaLevel: '较大风险'
-      })
+        rnaLevel: "较大风险"
+      });
       const p3 = putriskNumAnalysis({
         companyId: this.riskDetail.companyId,
         rnaId: this.enterRiskDetail.generalId,
         rnaNum: this.enterRiskDetail.generalSum,
-        rnaLevel: '一般风险'
-      })
+        rnaLevel: "一般风险"
+      });
       const p4 = putriskNumAnalysis({
         companyId: this.riskDetail.companyId,
         rnaId: this.enterRiskDetail.lowId,
         rnaNum: this.enterRiskDetail.lowSum,
-        rnaLevel: '低风险'
-      })
-      Promise.all([p1, p2, p3, p4]).then(res => {
-        this.$message({
-          message: '修改成功',
-          type: 'success'
-        })
-      }, () => {
-        this.$message.error('修改失败')
-      })
+        rnaLevel: "低风险"
+      });
+      Promise.all([p1, p2, p3, p4]).then(
+        res => {
+          this.$message({
+            message: "修改成功",
+            type: "success"
+          });
+        },
+        () => {
+          this.$message.error("修改失败");
+        }
+      );
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
-  .risk-detail-wrapper {
-    padding: 20px;
-    .enter-name-wrapper {
+.risk-detail-wrapper {
+  padding: 20px;
+  .enter-name-wrapper {
+    font-size: 16px;
+  }
+  .risk-degree-wrapper {
+    border: 1px solid #eee;
+    padding: 12px;
+    margin: 20px;
+    box-shadow: -1px 1px 5px 1px rgba(204, 204, 204, 0.3);
+    .risk-degree-title {
       font-size: 16px;
+      margin-left: 16px;
     }
-    .risk-degree-wrapper {
-      border: 1px solid #eee;
-      padding: 12px;
-      margin: 20px;
-      box-shadow: -1px 1px 5px 1px rgba(204, 204, 204, 0.3);
-      .risk-degree-title {
-        font-size: 16px;
-        margin-left: 16px;
+    .risk-degree-num {
+      font-size: 16px;
+      .significant-degree-wrapper {
+        display: flex;
+        flex-direction: row;
+        justify-content: flex-end;
+        align-items: center;
+        .singficant-degree {
+          width: 80px;
+        }
       }
-      .risk-degree-num {
-        font-size: 16px;
-        .significant-degree-wrapper {
-          display: flex;
-          flex-direction: row;
-          justify-content: flex-end;
-          align-items: center;
-          .singficant-degree {
-            width: 80px;
-          }
+      .large-degree-wrapper {
+        display: flex;
+        flex-direction: row;
+        justify-content: flex-end;
+        align-items: center;
+        .large-degree {
+          width: 80px;
         }
-        .large-degree-wrapper {
-          display: flex;
-          flex-direction: row;
-          justify-content: flex-end;
-          align-items: center;
-          .large-degree {
-            width: 80px;
-          }
+      }
+      .general-degree-wrapper {
+        display: flex;
+        flex-direction: row;
+        justify-content: flex-end;
+        align-items: center;
+        .general-degree {
+          width: 80px;
         }
-        .general-degree-wrapper {
-          display: flex;
-          flex-direction: row;
-          justify-content: flex-end;
-          align-items: center;
-          .general-degree {
-            width: 80px;
-          }
+      }
+      .low-degree-wrapper {
+        display: flex;
+        flex-direction: row;
+        justify-content: flex-end;
+        align-items: center;
+        .low-degree {
+          width: 80px;
         }
-        .low-degree-wrapper {
+      }
+      .tool-btn-wrapper {
+        position: absolute;
+        top: 50%;
+        right: 10%;
+        transform: translateY(-50%);
+        display: flex;
+        flex-direction: row;
+        justify-content: center;
+      }
+    }
+  }
+  .sorlrisk-wrapper {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-content: center;
+    .sorlrisk-title {
+      margin-left: 50%;
+      position: relative;
+      transform: translateX(-50%);
+    }
+    .tool-btn {
+      position: relative;
+      right: 10%;
+      transform: translateX(4px);
+      .import-file-risk-wrapper {
+        display: inline-block;
+        margin: 0 20px;
+        .import-file-risk {
+          color: white;
+          border-radius: 3px;
+          background-color: #1890ff;
+          text-align: center;
+          width: 56px;
+          height: 28px;
           display: flex;
-          flex-direction: row;
-          justify-content: flex-end;
           align-items: center;
-          .low-degree {
-            width: 80px;
-          }
-        }
-        .tool-btn-wrapper {
-          position: absolute;
-          top: 50%;
-          right: 10%;
-          transform: translateY(-50%);
-          display: flex;
-          flex-direction: row;
           justify-content: center;
-        }
-      }
-    }
-    .sorlrisk-wrapper {
-      display: flex;
-      flex-direction: row;
-      justify-content: space-between;
-      align-content: center;
-      .sorlrisk-title {
-        margin-left: 50%;
-        position: relative;
-        transform: translateX(-50%);
-      }
-      .tool-btn {
-        position: relative;
-        right: 10%;
-        transform: translateX(4px);
-        .import-file-risk-wrapper {
-          display: inline-block;
-          margin: 0 20px;
-          .import-file-risk {
-            color: white;
-            border-radius: 3px;
-            background-color: #1890ff;
-            text-align: center;
-            width: 56px;
-            height: 28px;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            font-size: 14px;
-            font-weight: 600;
-            &:hover {
-              background-color: #46a6ff;
-            }
+          font-size: 14px;
+          font-weight: 600;
+          &:hover {
+            background-color: #46a6ff;
           }
         }
       }
     }
   }
-  .sorlrisk-total-wrapper {
-    border: 1px solid #eee;
-    margin: 20px;
-    padding: 12px;
-    box-shadow: -2px 2px 5px 1px rgba(204, 204, 204, 0.3);
-  }
+}
+.sorlrisk-total-wrapper {
+  border: 1px solid #eee;
+  margin: 20px;
+  padding: 12px;
+  box-shadow: -2px 2px 5px 1px rgba(204, 204, 204, 0.3);
+}
 </style>

src/views/riskcontrol/uploadlist/index.vue

@@ -6,10 +6,19 @@
           <el-input v-model="enterinfoByRisk" placeholder="请输入企业名称" />
         </el-col>
         <el-col :span="4">
-          <el-button type="success" size="mini" @click="searchEnterInfo">搜索</el-button>
+          <el-button type="success" size="mini" @click="searchEnterInfoRisk"
+            >搜索</el-button
+          >
         </el-col>
         <el-col :span="4">
-          <el-button type="success" size="mini" :disabled="loadingRiskTable" v-loading="loadingRiskTable" @click="exportRiskExcel">导出</el-button>
+          <el-button
+            type="success"
+            size="mini"
+            :disabled="loadingRiskTable"
+            v-loading="loadingRiskTable"
+            @click="exportRiskExcel"
+            >导出</el-button
+          >
         </el-col>
       </el-row>
     </div>
@@ -18,24 +27,17 @@
       :data="enterrisk"
       style="width: 100%"
     >
-      <el-table-column
-        label="企业名称"
-        prop="companyName"
-      />
-      <el-table-column
-        label="企业负责人"
-        prop="companyChargePer"
-      />
-      <el-table-column
-        label="操作"
-      >
+      <el-table-column label="企业名称" prop="companyName" />
+      <el-table-column label="企业负责人" prop="companyChargePer" />
+      <el-table-column label="操作">
         <template slot-scope="scope1">
           <div class="tools-risk-upload-wrapper">
             <el-button
               size="mini"
               type="primary"
               @click="showEnterRisk($event, scope1.$index, scope1.row)"
-            >显示企业风险情况</el-button>
+              >显示企业风险情况</el-button
+            >
             <!-- <el-button
               size="mini"
               type="success"
@@ -64,17 +66,16 @@
 </template>
 
 <script>
-import axiosFile from '@/utils/requestfile.js'
-import { getAllCompanyInfo } from '../../../api/industry.js'
-import axios from 'axios'
+import axiosFile from "@/utils/requestfile.js";
+import { getAllCompanyInfo } from "../../../api/industry.js";
+import axios from "axios";
 export default {
   data() {
     return {
       // 企业信息
-      enterinfoByRisk: '',
+      enterinfoByRisk: "",
       // 企业风险
-      enterrisk: [
-      ],
+      enterrisk: [],
       // 是否显示提示框
       isShowAlert: false,
       // 总的个数
@@ -87,170 +88,200 @@ export default {
       isLoadingRiskEnter: false,
       // 导出风险表格
       loadingRiskTable: false
-    }
+    };
   },
   mounted() {
-    this.initEnterInfoRisk()
+    this.initEnterInfoRisk();
   },
   methods: {
     // 初始化企业信息
     async initEnterInfoRisk(toPagination) {
-      let replaceArray = []
+      let replaceArray = [];
       await getAllCompanyInfo({
-        page: toPagination === undefined ? (this.currentPage - 1) : 0,
+        page: toPagination === undefined ? this.currentPage - 1 : 0,
         size: this.currentPageDegree,
         companyName: this.enterinfoByRisk
       }).then(res => {
-        this.totalElement = res.totalElements
-        replaceArray = [...res.content]
-        replaceArray = replaceArray.sort((a, b) => a.companyId - b.companyId)
-        this.enterrisk = [...replaceArray]
-      })
+        this.totalElement = res.totalElements;
+        replaceArray = [...res.content];
+        replaceArray = replaceArray.sort((a, b) => a.companyId - b.companyId);
+        this.enterrisk = [...replaceArray];
+      });
+    },
+    async searchEnterInfoRisk() {
+      let replaceArray = [];
+      await getAllCompanyInfo({
+        page: 0,
+        size: 99,
+        companyName: this.enterinfoByRisk
+      }).then(res => {
+        this.totalElement = res.totalElements;
+        replaceArray = [...res.content];
+        replaceArray = replaceArray.sort((a, b) => a.companyId - b.companyId);
+        this.enterrisk = [...replaceArray];
+      });
     },
     // 显示企业详细风险
     showEnterRisk(event, index, row) {
-      console.log(event, index, row)
+      console.log(event, index, row);
       // 跳转到企业风险情况页面
-      this.$router.push(
-        {
-          path: '/security/riskmanager/showRisk/' + row.companyId + '&' + row.companyName
-        }
-      )
+      this.$router.push({
+        path:
+          "/security/riskmanager/showRisk/" +
+          row.companyId +
+          "&" +
+          row.companyName
+      });
     },
     // 搜索企业信息
     searchEnterInfo() {
-      this.initEnterInfoRisk('a')
+      this.initEnterInfoRisk("a");
     },
     // 导入风险弹出框
     importRisk($event, index, row) {
       if (this.isShowAlert === false) {
-        $event.stopPropagation()
-        $event.preventDefault()
-        this.$alert('请先将文件另存为97-2003(xls)格式', '请注意', {
-          confirmButtonText: '确定',
+        $event.stopPropagation();
+        $event.preventDefault();
+        this.$alert("请先将文件另存为97-2003(xls)格式", "请注意", {
+          confirmButtonText: "确定",
           callback: action => {
-            console.log(action, 'helloworld')
-            this.isShowAlert = true
-            $event.target.click()
+            console.log(action, "helloworld");
+            this.isShowAlert = true;
+            $event.target.click();
             setTimeout(() => {
-              this.isShowAlert = false
-            }, 0)
+              this.isShowAlert = false;
+            }, 0);
           }
-        })
+        });
       }
     },
     // 导入风险文件
     realImportRisk(index, row) {
-      console.log(index, row, '导入风险文件')
+      console.log(index, row, "导入风险文件");
       // 调用提交按钮
       // const formdata = new FormData()
-      console.log(this.$refs['file' + index].files, 'files')
-      console.log(axiosFile, 'helloworld')
-      const formdata = new FormData()
-      formdata.append('companyId', row.companyId)
-      for (let i = 0; i < this.$refs['file' + index].files.length; i++) {
-        formdata.append('files', this.$refs['file' + index].files[i])
+      console.log(this.$refs["file" + index].files, "files");
+      console.log(axiosFile, "helloworld");
+      const formdata = new FormData();
+      formdata.append("companyId", row.companyId);
+      for (let i = 0; i < this.$refs["file" + index].files.length; i++) {
+        formdata.append("files", this.$refs["file" + index].files[i]);
       }
-      if (this.$refs['file' + index].files.length === 0) {
-        return
+      if (this.$refs["file" + index].files.length === 0) {
+        return;
       }
-      console.log(this.$refs['file' + index].files, 'hellworld, to justify yourself believer and behavior')
+      console.log(
+        this.$refs["file" + index].files,
+        "hellworld, to justify yourself believer and behavior"
+      );
       axiosFile({
-        url: '/api/thRisk/importExcel',
-        method: 'POST',
+        url: "/api/thRisk/importExcel",
+        method: "POST",
         data: formdata
       }).then(res => {
-        this.$message({
-          message: '上传成功',
-          type: 'success'
-        }, () => {
-          this.$message.error('上传失败')
-        })
-      })
+        this.$message(
+          {
+            message: "上传成功",
+            type: "success"
+          },
+          () => {
+            this.$message.error("上传失败");
+          }
+        );
+      });
     },
     // 每页条数
     handleSizeChangeRisk(val) {
-      this.currentPageDegree = val
+      this.currentPageDegree = val;
     },
     // 当前页码改变
     handleCurrentChangeRisk(val) {
       // 去请求数据 改变data
-      this.currentPage = val
-      this.initEnterInfoRisk()
+      this.currentPage = val;
+      this.initEnterInfoRisk();
     },
     exportRiskExcel() {
-      this.loadingRiskTable = true
+      this.loadingRiskTable = true;
       axios({
-          url: process.env.VUE_APP_BASE_API + '/api/thRisk/download',
-          method: 'get',
-          responseType: 'blob',
-          onDownloadProgress: (ProgressEvent) => {
-            console.log(ProgressEvent, 'exportHDAnalyze exportHDAnalyze exportHDAnalyze')
-            // this.loadingHDAnalyzeExcel = true
-            this.loadingRiskTable = true
-            if (this.loadingRiskTableTimer) {
-              clearTimeout(this.loadingRiskTableTimer)
-            } else {
-              this.loadingRiskTableTimer = setTimeout(() => {
-                this.loadingRiskTable = false
-              }, 500)
-            }
-            // if (this.timerLoadingHDAnalyzeExcel) {
-            //   clearTimeout(this.timerLoadingHDAnalyzeExcel)
-            // } else {
-            //   setTimeout(() => {
-            //     this.loadingHDAnalyzeExcel = false
-            //   }, 500)
-            // }
-          },
-          // params: {
-          //   startTime: parseTime(new Date(this.hdAnalyzeChosenDateRange[0]), '{y}-{m}-{d}'),
-          //   endTime: parseTime(new Date(this.hdAnalyzeChosenDateRange[1]), '{y}-{m}-{d}')
+        url: process.env.VUE_APP_BASE_API + "/api/thRisk/download",
+        method: "get",
+        responseType: "blob",
+        onDownloadProgress: ProgressEvent => {
+          console.log(
+            ProgressEvent,
+            "exportHDAnalyze exportHDAnalyze exportHDAnalyze"
+          );
+          // this.loadingHDAnalyzeExcel = true
+          this.loadingRiskTable = true;
+          if (this.loadingRiskTableTimer) {
+            clearTimeout(this.loadingRiskTableTimer);
+          } else {
+            this.loadingRiskTableTimer = setTimeout(() => {
+              this.loadingRiskTable = false;
+            }, 500);
+          }
+          // if (this.timerLoadingHDAnalyzeExcel) {
+          //   clearTimeout(this.timerLoadingHDAnalyzeExcel)
+          // } else {
+          //   setTimeout(() => {
+          //     this.loadingHDAnalyzeExcel = false
+          //   }, 500)
           // }
-        }).then(res => {
-          console.dir(res, 'console')
-          console.log(res, 'this.hdAnalyzeChosenDateRange  this.hdAnalyzeChosenDateRange')
-          const url = window.URL.createObjectURL(new Blob([res.data]))
-          const link = document.createElement('a')
-          link.href = url
-          link.setAttribute('download', decodeURI(res.headers['content-disposition'].split("''")[1]))
-          document.body.appendChild(link)
-          link.click()
-          link.remove()
-          window.URL.revokeObjectURL(link.href)
-        })
+        }
+        // params: {
+        //   startTime: parseTime(new Date(this.hdAnalyzeChosenDateRange[0]), '{y}-{m}-{d}'),
+        //   endTime: parseTime(new Date(this.hdAnalyzeChosenDateRange[1]), '{y}-{m}-{d}')
+        // }
+      }).then(res => {
+        console.dir(res, "console");
+        console.log(
+          res,
+          "this.hdAnalyzeChosenDateRange  this.hdAnalyzeChosenDateRange"
+        );
+        const url = window.URL.createObjectURL(new Blob([res.data]));
+        const link = document.createElement("a");
+        link.href = url;
+        link.setAttribute(
+          "download",
+          decodeURI(res.headers["content-disposition"].split("''")[1])
+        );
+        document.body.appendChild(link);
+        link.click();
+        link.remove();
+        window.URL.revokeObjectURL(link.href);
+      });
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
-  .riskmanager-wrapper {
-    padding: 20px;
-    .tools-risk-upload-wrapper {
-      display: flex;
-      align-items: center;
-      .import-file-risk-wrapper {
-        display: inline-block;
-        margin: 0 20px;
-        .import-file-risk {
-          color: white;
-          border-radius: 3px;
-          background-color: #1890ff;
-          /* display: inline-block; */
-          text-align: center;
-          width: 56px;
-          height: 28px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          &:hover {
-            /* color: #46a6ff; */
-            /* border-color: #badeff; */
-            background-color: #46a6ff;
-          }
+.riskmanager-wrapper {
+  padding: 20px;
+  .tools-risk-upload-wrapper {
+    display: flex;
+    align-items: center;
+    .import-file-risk-wrapper {
+      display: inline-block;
+      margin: 0 20px;
+      .import-file-risk {
+        color: white;
+        border-radius: 3px;
+        background-color: #1890ff;
+        /* display: inline-block; */
+        text-align: center;
+        width: 56px;
+        height: 28px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        &:hover {
+          /* color: #46a6ff; */
+          /* border-color: #badeff; */
+          background-color: #46a6ff;
         }
       }
     }
   }
+}
 </style>

src/views/securityCheck/editcheck.vue

 <template>
-  <div class="security-check-total-wrapper">
+  <!--<div class="security-check-total-wrapper">
     <el-table
       :data="checkTypes"
       style="width: 100%"
@@ -76,11 +76,37 @@
         prop="rsbtType"
       />
     </el-table>
+  </div>-->
+  <div class="dec-total">
+    <el-table :data="securityCheck" border>
+      <el-table-column
+        prop="category"
+        label="类别"
+        width="180"
+      ></el-table-column>
+      <el-table-column prop="type" label="类型" width="140"></el-table-column>
+      <el-table-column
+        prop="inspectionContent"
+        label="检查内容"
+        width="180"
+      ></el-table-column>
+      <el-table-column
+        prop="matter"
+        label="发现问题"
+        width="180"
+      ></el-table-column>
+      <el-table-column
+        prop="satisfaction"
+        label="是否符合"
+        width="140"
+      ></el-table-column>
+    </el-table>
   </div>
 </template>
 
 <script>
-import { adRiskStandingBook, deleteRiskStandingBook, editRiskStandingBook, getRiskStandingBook, getRiskStandingBookType } from '../../api/industry'
+// import { adRiskStandingBook, deleteRiskStandingBook, editRiskStandingBook, getRiskStandingBook, getRiskStandingBookType } from '../../api/industry'
+import { findMattsByEnterpriseId } from "@/api/secFound.js";
 export default {
   data() {
     // 返回想要的数据
@@ -90,128 +116,147 @@ export default {
       // 当前选中的行
       curSelectedRow: [],
       // 当前展开的行
-      curExpandedRow: []
-    }
+      curExpandedRow: [],
+      // 当前企业的安全检查
+      securityCheck: []
+    };
   },
   mounted() {
     // 获取公司id
-    this.companyId = this.$route.params.name.split('&')[0]
+    this.companyId = this.$route.params.name.split("&")[0];
     // 获取公司名称
-    this.companyName = this.$route.params.name.split('&')[1]
+    this.companyName = this.$route.params.name.split("&")[1];
     // 初始化所有的安全检查项
-    this.initAllCheckTypes()
+    this.getAllSecCheckItems();
   },
   methods: {
+    // 获取所有的安全检查项目
+    async getAllSecCheckItems() {
+      findMattsByEnterpriseId(this.companyId).then(res => {
+        this.securityCheck = [...res];
+      });
+    },
     // 初始化所有的安全检查项
     async initAllCheckTypes() {
       // 获取风险类型
-      await getRiskStandingBookType().then(async(res) => {
-        // 检查类型
-        this.checkTypes = [...res.content]
-        // 初始化checkItemList
-        for (let i = 0; i < this.checkTypes.length; i++) {
-          this.checkTypes[i].checkItemList = []
+      await getRiskStandingBookType().then(
+        async res => {
+          // 检查类型
+          this.checkTypes = [...res.content];
+          // 初始化checkItemList
+          for (let i = 0; i < this.checkTypes.length; i++) {
+            this.checkTypes[i].checkItemList = [];
+          }
+          // getRiskStandingBook(this.companyId).then(res => {
+          //   // 根据当前 rsbtId 匹配出来
+          //   for (let i = 0; i < this.checkTypes.length; i++) {
+          //     this.checkTypes[i].checkItemList = res.content.filter(item => {
+          //       return Number(item.rsbtId) === Number(this.checkTypes[i].rsbtId)
+          //     })
+          //   }
+          //   for (let i = 0; i < this.checkTypes.length; i++) {
+          //     this.checkTypes[i].checkItemList.push({
+          //       rsbInspectContent: '',
+          //       rsbInspectCase: 0,
+          //       rsbRemark: ''
+          //     })
+          //   }
+          // })
+          // this.curSelectedRow = [...this.curExpandedRow.map(item => { return item.rsbtId })]
+        },
+        () => {
+          console.log("这里获取失败了");
         }
-        // getRiskStandingBook(this.companyId).then(res => {
-        //   // 根据当前 rsbtId 匹配出来
-        //   for (let i = 0; i < this.checkTypes.length; i++) {
-        //     this.checkTypes[i].checkItemList = res.content.filter(item => {
-        //       return Number(item.rsbtId) === Number(this.checkTypes[i].rsbtId)
-        //     })
-        //   }
-        //   for (let i = 0; i < this.checkTypes.length; i++) {
-        //     this.checkTypes[i].checkItemList.push({
-        //       rsbInspectContent: '',
-        //       rsbInspectCase: 0,
-        //       rsbRemark: ''
-        //     })
-        //   }
-        // })
-        // this.curSelectedRow = [...this.curExpandedRow.map(item => { return item.rsbtId })]
-      }, () => {
-        console.log('这里获取失败了')
-      })
+      );
       await getRiskStandingBook(this.companyId).then(res => {
         for (let i = 0; i < this.checkTypes.length; i++) {
           this.checkTypes[i].checkItemList = res.content.filter(item => {
-            return Number(item.rsbtId) === Number(this.checkTypes[i].rsbtId)
-          })
+            return Number(item.rsbtId) === Number(this.checkTypes[i].rsbtId);
+          });
         }
         for (let i = 0; i < this.checkTypes.length; i++) {
           this.checkTypes[i].checkItemList.push({
-            rsbInspectContent: '',
+            rsbInspectContent: "",
             rsbInspectCase: 0,
-            rsbRemark: ''
-          })
+            rsbRemark: ""
+          });
         }
-      })
-      this.curSelectedRow = [...this.curExpandedRow.map(item => { return item.rsbtId })]
+      });
+      this.curSelectedRow = [
+        ...this.curExpandedRow.map(item => {
+          return item.rsbtId;
+        })
+      ];
     },
     // 当前展开的行
     rowChange(row, expanded) {
-      this.curExpandedRow = [...expanded]
+      this.curExpandedRow = [...expanded];
     },
     // 保存
     saveToCheckItem(row1, row2) {
-      const tempReplaceItem = {}
+      const tempReplaceItem = {};
       // tempReplaceItem.companyId = row2.companyId
-      tempReplaceItem.companyId = this.companyId
-      tempReplaceItem.rsbInspectContent = row2.rsbInspectContent
-      tempReplaceItem.rsbInspectCase = row2.rsbInspectCase
-      tempReplaceItem.rsbRemark = row2.rsbRemark
-      tempReplaceItem.rsbId = row2.rsbId
-      tempReplaceItem.rsbtType = row1.rsbtType
-      tempReplaceItem.rsbtId = row1.rsbtId
-      editRiskStandingBook(tempReplaceItem).then(res => {
-        this.$message({
-          message: '编辑成功',
-          type: 'success'
-        })
-        this.initAllCheckTypes()
-      }, () => {
-        this.$message.error('编辑失败')
-      })
+      tempReplaceItem.companyId = this.companyId;
+      tempReplaceItem.rsbInspectContent = row2.rsbInspectContent;
+      tempReplaceItem.rsbInspectCase = row2.rsbInspectCase;
+      tempReplaceItem.rsbRemark = row2.rsbRemark;
+      tempReplaceItem.rsbId = row2.rsbId;
+      tempReplaceItem.rsbtType = row1.rsbtType;
+      tempReplaceItem.rsbtId = row1.rsbtId;
+      editRiskStandingBook(tempReplaceItem).then(
+        res => {
+          this.$message({
+            message: "编辑成功",
+            type: "success"
+          });
+          this.initAllCheckTypes();
+        },
+        () => {
+          this.$message.error("编辑失败");
+        }
+      );
     },
     // 删除
     deleteToCheckItem(row) {
-      console.log(row, 'hehehehehhehehehehehehehehehheheheheheheheheheheheheh')
-      this.$confirm('确定要删除此安全检查项', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(
-        () => {
-          deleteRiskStandingBook([row.rsbId]).then(res => {
+      console.log(row, "hehehehehhehehehehehehehehehheheheheheheheheheheheheh");
+      this.$confirm("确定要删除此安全检查项", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        deleteRiskStandingBook([row.rsbId]).then(
+          res => {
             this.$message({
-              message: '刪除成功',
-              type: 'success'
-            })
-            this.initAllCheckTypes()
-          }, () => {
+              message: "刪除成功",
+              type: "success"
+            });
+            this.initAllCheckTypes();
+          },
+          () => {
             this.$message({
-              type: 'info',
-              message: '已取消刪除'
-            })
-          })
-        }
-      )
+              type: "info",
+              message: "已取消刪除"
+            });
+          }
+        );
+      });
     },
     // 提交安全检查项
     submitCheckItem(row1, row2, index) {
-      const tempReplaceItem = {}
-      tempReplaceItem.rsbtId = row1.rsbtId
-      tempReplaceItem.rsbtType = row1.rsbtType
-      tempReplaceItem.companyId = this.companyId
-      tempReplaceItem.rsbInspectCase = row2.rsbInspectCase
-      tempReplaceItem.rsbInspectContent = row2.rsbInspectContent
-      tempReplaceItem.rsbRemark = row2.rsbRemark
+      const tempReplaceItem = {};
+      tempReplaceItem.rsbtId = row1.rsbtId;
+      tempReplaceItem.rsbtType = row1.rsbtType;
+      tempReplaceItem.companyId = this.companyId;
+      tempReplaceItem.rsbInspectCase = row2.rsbInspectCase;
+      tempReplaceItem.rsbInspectContent = row2.rsbInspectContent;
+      tempReplaceItem.rsbRemark = row2.rsbRemark;
 
       adRiskStandingBook(tempReplaceItem).then(res => {
         this.$message({
-          message: '添加成功',
-          type: 'success'
-        })
-        this.initAllCheckTypes()
+          message: "添加成功",
+          type: "success"
+        });
+        this.initAllCheckTypes();
 
         // 这里可以重写个方法只增加自己列
         // getRiskStandingBook(this.companyId).then(res => {
@@ -222,17 +267,23 @@ export default {
         //   console.log('这里被调用了吗, fhhfhfhdhfhfdhfhfdhsfaehwuruiwrhie')
 
         // })
-      })
-      console.log(this.curSelectedRow, 'fhsdkfhksahfuehwuifaheiwuhfuiehiuwfhhsdfhjdksahfksa')
+      });
+      console.log(
+        this.curSelectedRow,
+        "fhsdkfhksahfuehwuifaheiwuhfuiehiuwfhhsdfhjdksahfksa"
+      );
     },
     // 写一个更新数组检查项的
     updateCheckItem(row) {
-      console.log(row)
+      console.log(row);
     }
   }
-}
+};
 </script>
 
-<style lang="scss">
-
+<style lang="scss" scoped>
+.dec-total {
+  padding-left: 30px;
+  padding-top: 30px;
+}
 </style>

src/views/system/compedent/index.vue

@@ -2,12 +2,32 @@
   <div class="compedent-outer-wrapper">
     <div class="compedent-tools-wrapper">
       <el-button type="primary" @click="addChargeDept">新增主管部门</el-button>
-      <el-button type="warning" :disabled="disableChargeDeptEdit" @click="editChargeDept">编辑主管部门</el-button>
-      <el-button type="danger" :disabled="disableChargeDeptDelete" @click="deleteChargeDept">删除主管部门</el-button>
+      <el-button
+        type="warning"
+        :disabled="disableChargeDeptEdit"
+        @click="editChargeDept"
+        >编辑主管部门</el-button
+      >
+      <el-button
+        type="danger"
+        :disabled="disableChargeDeptDelete"
+        @click="deleteChargeDept"
+        >删除主管部门</el-button
+      >
     </div>
     <div class="compedent-inner-wrapper">
-      <div v-for="item in chargeDepts" :key="item.icdId">
-        <label><input type="checkbox" :checked="item.checked" @change="inputChange($event, item)">{{ '   ' + item.icdName }}</label>
+      <div
+        v-for="item in chargeDepts"
+        :key="item.icdId"
+        class="compedent-inner-item-wrapper"
+      >
+        <label
+          ><input
+            type="checkbox"
+            :checked="item.checked"
+            @change="inputChange($event, item)"
+          />&nbsp;&nbsp;&nbsp;{{ item.icdName }}</label
+        >
       </div>
     </div>
     <el-dialog
@@ -21,16 +41,18 @@
         :model="formInfo"
         :rules="rules"
       >
-        <el-form-item
-          label="主管部门名称"
-          prop="icdName"
-        >
+        <el-form-item label="主管部门名称" prop="icdName">
           <el-input v-model="formInfo.icdName" />
         </el-form-item>
       </el-form>
       <div slot="footer">
         <el-button type="info" @click="cancelAddCharge">取消</el-button>
-        <el-button type="primary" :loading="addFormLoading" @click="submitAddChargeDept">提交</el-button>
+        <el-button
+          type="primary"
+          :loading="addFormLoading"
+          @click="submitAddChargeDept"
+          >提交</el-button
+        >
       </div>
     </el-dialog>
     <el-dialog
@@ -44,39 +66,45 @@
         :model="editFormInfo"
         :rules="rules"
       >
-        <el-form-item
-          label="主管部门名称"
-          prop="icdName"
-        >
+        <el-form-item label="主管部门名称" prop="icdName">
           <el-input v-model="editFormInfo.icdName" />
         </el-form-item>
       </el-form>
       <div slot="footer">
         <el-button type="info" @click="cancelEditChargeDept">取消</el-button>
-        <el-button type="primary" :loading="editFormLoading" @click="submitEditChargeDept">提交</el-button>
+        <el-button
+          type="primary"
+          :loading="editFormLoading"
+          @click="submitEditChargeDept"
+          >提交</el-button
+        >
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { getIndustryChargeDept, postIndustryChargeDept, putIndustryChargeDept, deleteIndustryChargeDept } from '@/api/industry.js'
+import {
+  getIndustryChargeDept,
+  postIndustryChargeDept,
+  putIndustryChargeDept,
+  deleteIndustryChargeDept
+} from "@/api/industry.js";
 export default {
   data() {
     return {
-      chargeDepts: [
-      ],
+      chargeDepts: [],
       disableChargeDeptEdit: true,
       disableChargeDeptDelete: true,
       formInfo: {
-        icdName: ''
+        icdName: ""
       },
       rules: {
         icdName: [
           {
             required: true,
-            message: '请输入主管部门名称',
-            trigger: 'blur'
+            message: "请输入主管部门名称",
+            trigger: "blur"
           }
         ]
       },
@@ -84,124 +112,160 @@ export default {
       editChargeDeptDialogShow: false,
       addFormLoading: false,
       editFormInfo: {
-        icdName: '',
+        icdName: "",
         icdId: -1
       },
       editFormLoading: false
-    }
+    };
   },
   mounted() {
-    this.initChargeDepts()
+    this.initChargeDepts();
   },
   methods: {
     initChargeDepts() {
       getIndustryChargeDept().then(res => {
-        this.chargeDepts = []
+        this.chargeDepts = [];
         res.content.forEach(item => {
           const tempObj = {
             icdId: item.icdId,
             icdName: item.icdName,
             checked: false
-          }
-          this.chargeDepts.push(tempObj)
-          console.log(this.chargeDepts, 'this.chargeDepts this.chargeDepts')
-        })
-      })
+          };
+          this.chargeDepts.push(tempObj);
+          console.log(this.chargeDepts, "this.chargeDepts this.chargeDepts");
+        });
+      });
     },
     inputChange($event, item) {
-      item.checked = $event.target.checked
-      this.disableChargeDeptEdit = true
-      this.disableChargeDeptDelete = true
+      item.checked = $event.target.checked;
+      this.disableChargeDeptEdit = true;
+      this.disableChargeDeptDelete = true;
       if (this.chargeDepts.filter(item => item.checked === true).length === 1) {
-        this.disableChargeDeptEdit = false
+        this.disableChargeDeptEdit = false;
       }
       if (this.chargeDepts.filter(item => item.checked === true).length > 0) {
-        this.disableChargeDeptDelete = false
+        this.disableChargeDeptDelete = false;
       }
     },
     // 新增主管部门
     addChargeDept() {
       // 展示dialog
-      this.formInfo.icdName = ''
-      this.addChargeDeptDialogShow = true
+      this.formInfo.icdName = "";
+      this.addChargeDeptDialogShow = true;
     },
     cancelAddCharge() {
       //
-      this.addChargeDeptDialogShow = false
-      this.formInfo.icdName = ''
+      this.addChargeDeptDialogShow = false;
+      this.formInfo.icdName = "";
     },
     submitAddChargeDept() {
-      this.addFormLoading = true
-      postIndustryChargeDept(this.formInfo.icdName).then(res => {
-        this.initChargeDepts()
-        this.addFormLoading = false
-        this.$message({
-          type: 'success',
-          message: '添加成功'
-        })
+      this.addFormLoading = true;
+      postIndustryChargeDept(this.formInfo.icdName).then(
+        res => {
+          this.initChargeDepts();
+          this.addFormLoading = false;
+          this.$message({
+            type: "success",
+            message: "添加成功"
+          });
 
-        this.addChargeDeptDialogShow = false
-      }, err => {
-        console.log(err, 'err by postIndustryChargeDept')
-        this.addFormLoading = false
-        this.$message.error('添加失败')
-        this.addChargeDeptDialogShow = false
-      })
+          this.addChargeDeptDialogShow = false;
+        },
+        err => {
+          console.log(err, "err by postIndustryChargeDept");
+          this.addFormLoading = false;
+          this.$message.error("添加失败");
+          this.addChargeDeptDialogShow = false;
+        }
+      );
     },
     editChargeDept() {
-      this.editFormInfo.icdName = this.chargeDepts.filter(item => item.checked)[0].icdName
-      this.editFormInfo.icdId = this.chargeDepts.filter(item => item.checked)[0].icdId
-      this.editChargeDeptDialogShow = true
+      this.editFormInfo.icdName = this.chargeDepts.filter(
+        item => item.checked
+      )[0].icdName;
+      this.editFormInfo.icdId = this.chargeDepts.filter(
+        item => item.checked
+      )[0].icdId;
+      this.editChargeDeptDialogShow = true;
     },
     cancelEditChargeDept() {
-      this.editChargeDeptDialogShow = false
+      this.editChargeDeptDialogShow = false;
     },
     submitEditChargeDept() {
-      this.editFormLoading = false
-      putIndustryChargeDept(this.editFormInfo.icdId, this.editFormInfo.icdName).then(res => {
-        console.log(res, 'putIndustryChargeDept')
-        this.editFormLoading = true
-        this.initChargeDepts()
-        this.$message({
-          type: 'success',
-          message: '编辑成功'
+      this.editFormLoading = false;
+      putIndustryChargeDept(this.editFormInfo.icdId, this.editFormInfo.icdName)
+        .then(res => {
+          console.log(res, "putIndustryChargeDept");
+          this.editFormLoading = true;
+          this.initChargeDepts();
+          this.$message({
+            type: "success",
+            message: "编辑成功"
+          });
+          this.editChargeDeptDialogShow = false;
         })
-        this.editChargeDeptDialogShow = false
-      }).catch(res1 => {
-        console.log(res1, 'err by putIndustryChargeDept')
-        this.editFormLoading = true
-        this.$message.error('编辑失败')
-        this.editChargeDeptDialogShow = false
-      })
+        .catch(res1 => {
+          console.log(res1, "err by putIndustryChargeDept");
+          this.editFormLoading = true;
+          this.$message.error("编辑失败");
+          this.editChargeDeptDialogShow = false;
+        });
     },
     deleteChargeDept() {
-      this.$confirm('此操作将删除所选主管部门', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        deleteIndustryChargeDept(this.chargeDepts.filter(item => item.checked).map(item => item.icdId)).then(res => {
-          this.initChargeDepts()
-          this.$message({
-            type: 'success',
-            message: '删除成功'
-          })
-        }).catch(err => {
-          console.log(err)
-          this.$message.error('删除失败')
-        })
-      }).catch((err) => {
-        console.log(err)
-        this.$message({
-          type: 'info',
-          message: '已取消操作'
-        })
+      this.$confirm("此操作将删除所选主管部门", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          deleteIndustryChargeDept(
+            this.chargeDepts
+              .filter(item => item.checked)
+              .map(item => item.icdId)
+          )
+            .then(res => {
+              this.initChargeDepts();
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+            })
+            .catch(err => {
+              console.log(err);
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(err => {
+          console.log(err);
+          this.$message({
+            type: "info",
+            message: "已取消操作"
+          });
+        });
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-
+.compedent-outer-wrapper {
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+  .compedent-tools-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
+  }
+  .compedent-inner-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
+    .compedent-inner-item-wrapper {
+      margin: 10px 10px;
+    }
+  }
+}
 </style>

src/views/system/user/index.vue

@@ -9,70 +9,75 @@
         <el-dropdown-menu slot="dropdown">
           <el-dropdown-item command="政府用户">政府用户</el-dropdown-item>
           <el-dropdown-item command="运营商用户">运营商用户</el-dropdown-item>
-          <el-dropdown-item command="企业管理用户">企业管理用户</el-dropdown-item>
-          <el-dropdown-item divided command="企业员工用户">企业员工用户</el-dropdown-item>
+          <el-dropdown-item command="企业管理用户"
+            >企业管理用户</el-dropdown-item
+          >
+          <el-dropdown-item divided command="企业员工用户"
+            >企业员工用户</el-dropdown-item
+          >
         </el-dropdown-menu>
       </el-dropdown>
     </div>
     <div v-show="curUser === '政府用户'" class="users-gov-wrapper">
       <div class="gov-tools-wrapper">
-        <el-button type="primary" @click="clickToAddGovUserDialogShow">新增政府用户</el-button>
-        <el-button type="warning" style="margin-left: 20px;" :disabled="disableGovEdit" @click="clickToEditGovUserDialogShow">编辑政府用户</el-button>
-        <el-button type="danger" style="margin-left: 20px;" :disabled="disableGovDelete" @click="clickToDeleteGovUserDialogShow">删除政府用户</el-button>
+        <el-button type="primary" @click="clickToAddGovUserDialogShow"
+          >新增政府用户</el-button
+        >
+        <el-button
+          type="warning"
+          style="margin-left: 20px;"
+          :disabled="disableGovEdit"
+          @click="clickToEditGovUserDialogShow"
+          >编辑政府用户</el-button
+        >
+        <el-button
+          type="danger"
+          style="margin-left: 20px;"
+          :disabled="disableGovDelete"
+          @click="clickToDeleteGovUserDialogShow"
+          >删除政府用户</el-button
+        >
       </div>
-      <el-table
-        v-loading=""
-        :data="govUsers"
-        border
-        @selection-change="handleGovSelectionChange"
-      >
-        <el-table-column
-          type="selection"
-          width="55"
-        />
-        <el-table-column
-          prop="username"
-          label="用户名"
-          width="180"
-        />
-        <el-table-column
-          prop="nickName"
-          label="姓名"
-          width="180"
-        />
-        <el-table-column
-          prop="thIndustryChargeDept.icdName"
-          label="所属局"
-          width="160"
-        />
-        <el-table-column
-          label="角色"
-          width="160"
+      <div class="gov-table-wrapper">
+        <el-table
+          v-loading=""
+          :data="govUsers"
+          border
+          @selection-change="handleGovSelectionChange"
         >
-          <template slot-scope="scope">
-            {{ (scope.row.roles && scope.row.roles.length && scope.row.roles.length > 0)?scope.row.roles.map(item => item.name).join(' ') : '' }}
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="wechat"
-          label="微信号"
-          width="180"
-        />
-        <el-table-column
-          prop="phone"
-          label="手机号"
-          width="240"
+          <el-table-column type="selection" width="55" />
+          <el-table-column prop="username" label="用户名" width="180" />
+          <el-table-column prop="nickName" label="姓名" width="180" />
+          <el-table-column
+            prop="thIndustryChargeDept.icdName"
+            label="所属局"
+            width="160"
+          />
+          <el-table-column label="角色" width="160">
+            <template slot-scope="scope">
+              {{
+                scope.row.roles &&
+                scope.row.roles.length &&
+                scope.row.roles.length > 0
+                  ? scope.row.roles.map(item => item.name).join(" ")
+                  : ""
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column prop="wechat" label="微信号" width="180" />
+          <el-table-column prop="phone" label="手机号" width="240" />
+        </el-table>
+        <el-pagination
+          :current-page="currentGovPage"
+          :page-sizes="[10, 20, 30, 40]"
+          :page-size="currentGovPageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="totalGovPageSize"
+          @size-change="handleGovSizeChange"
+          @current-change="handleGovCurrentChange"
         />
-      </el-table>
-      <el-pagination
-        :current-page="currentGovPage"
-        :page-sizes="[10, 20, 30, 40]"
-        :page-size="currentGovPageSize"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="totalGovPageSize"
-        @size-change="handleGovSizeChange"
-        @current-change="handleGovCurrentChange"
-      />
+      </div>
+
       <el-dialog
         title="新增政府用户"
         :visible.sync="govUserDialogShow"
@@ -84,44 +89,34 @@
           :model="govFormInfo"
           :rules="govRules"
         >
-          <el-form-item
-            prop="username"
-            label="用户名"
-            label-width="120px"
-          >
+          <el-form-item prop="username" label="用户名" label-width="120px">
             <el-input v-model="govFormInfo.username" />
           </el-form-item>
-          <el-form-item
-            prop="password"
-            label="密码"
-            label-width="120px"
-          >
+          <el-form-item prop="password" label="密码" label-width="120px">
             <el-input v-model="govFormInfo.password" type="password" />
           </el-form-item>
-          <el-form-item
-            prop="nickName"
-            label="姓名"
-            label-width="120px"
-          >
+          <el-form-item prop="nickName" label="姓名" label-width="120px">
             <el-input v-model="govFormInfo.nickName" />
           </el-form-item>
           <el-form-item
             prop="thIndustryChargeDept.icdId"
             label="所属局"
             label-width="120px"
-          >
-            <el-select v-model="govFormInfo.thIndustryChargeDept.icdId" placeholder="请选择所属局">
-              <el-option v-for="item in chargeDepts" :key="item.icdId" :label="item.icdName" :value="item.icdId" />
-            </el-select>
-          </el-form-item>
-          <el-form-item
-            label="角色"
-            label-width="120px"
           >
             <el-select
-              v-model="govFormInfo.roles"
-              multiple
+              v-model="govFormInfo.thIndustryChargeDept.icdId"
+              placeholder="请选择所属局"
             >
+              <el-option
+                v-for="item in chargeDepts"
+                :key="item.icdId"
+                :label="item.icdName"
+                :value="item.icdId"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="角色" label-width="120px">
+            <el-select v-model="govFormInfo.roles" multiple>
               <el-option
                 v-for="(item, index) in curRoles"
                 :key="index"
@@ -130,22 +125,21 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item
-            label="微信号"
-            label-width="120px"
-          >
+          <el-form-item label="微信号" label-width="120px">
             <el-input v-model="govFormInfo.wechat" />
           </el-form-item>
-          <el-form-item
-            label="电话"
-            label-width="120px"
-          >
+          <el-form-item label="电话" label-width="120px">
             <el-input v-model="govFormInfo.phone" />
           </el-form-item>
         </el-form>
         <div slot="footer">
           <el-button type="info" @click="cancelAddGovUser">取消</el-button>
-          <el-button type="primary" :loading="isAddGovUserBtnLoading" @click="submitGovUser">提交</el-button>
+          <el-button
+            type="primary"
+            :loading="isAddGovUserBtnLoading"
+            @click="submitGovUser"
+            >提交</el-button
+          >
         </div>
       </el-dialog>
       <el-dialog
@@ -159,44 +153,34 @@
           :model="editGovFormInfo"
           :rules="editGovRules"
         >
-          <el-form-item
-            prop="username"
-            label="用户名"
-            label-width="120px"
-          >
+          <el-form-item prop="username" label="用户名" label-width="120px">
             <el-input v-model="editGovFormInfo.username" />
           </el-form-item>
-          <el-form-item
-            prop="password"
-            label="密码"
-            label-width="120px"
-          >
+          <el-form-item prop="password" label="密码" label-width="120px">
             <el-input v-model="editGovFormInfo.password" type="password" />
           </el-form-item>
-          <el-form-item
-            prop="nickName"
-            label="姓名"
-            label-width="120px"
-          >
+          <el-form-item prop="nickName" label="姓名" label-width="120px">
             <el-input v-model="editGovFormInfo.nickName" />
           </el-form-item>
           <el-form-item
             prop="thIndustryChargeDept.icdName"
             label="所属局"
             label-width="120px"
-          >
-            <el-select v-model="editGovFormInfo.thIndustryChargeDept.icdId" placeholder="请选择所属局">
-              <el-option v-for="item in chargeDepts" :key="item.icdId" :label="item.icdName" :value="item.icdId" />
-            </el-select>
-          </el-form-item>
-          <el-form-item
-            label="角色"
-            label-width="120px"
           >
             <el-select
-              v-model="editGovFormInfo.roles"
-              multiple
+              v-model="editGovFormInfo.thIndustryChargeDept.icdId"
+              placeholder="请选择所属局"
             >
+              <el-option
+                v-for="item in chargeDepts"
+                :key="item.icdId"
+                :label="item.icdName"
+                :value="item.icdId"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="角色" label-width="120px">
+            <el-select v-model="editGovFormInfo.roles" multiple>
               <el-option
                 v-for="(item, index) in curRoles"
                 :key="index"
@@ -205,98 +189,97 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item
-            label="微信号"
-            label-width="120px"
-          >
+          <el-form-item label="微信号" label-width="120px">
             <el-input v-model="editGovFormInfo.wechat" />
           </el-form-item>
-          <el-form-item
-            label="电话"
-            label-width="120px"
-          >
+          <el-form-item label="电话" label-width="120px">
             <el-input v-model="editGovFormInfo.phone" />
           </el-form-item>
         </el-form>
         <div slot="footer">
           <el-button @click="cancelEditGovUser">取消</el-button>
-          <el-button type="primary" :loading="isEditGovUserBtnLoading" @click="submitEditGovUser">提交</el-button>
+          <el-button
+            type="primary"
+            :loading="isEditGovUserBtnLoading"
+            @click="submitEditGovUser"
+            >提交</el-button
+          >
         </div>
       </el-dialog>
     </div>
     <div v-show="curUser === '运营商用户'" class="users-operator-wrapper">
       <div class="operators-tools-wrapper">
-        <el-button type="primary" @click="addOperatorShow">新增运营商用户</el-button>
-        <el-button type="warning" style="margin-left: 20px;" :disabled="disableOperatorEdit" @click="editOperatorShow">编辑运营商用户</el-button>
-        <el-button type="danger" style="margin-left: 20px;" :disabled="disableOperatorDelete" @click="deleteOperator">删除运营商用户</el-button>
-      </div>
-      <el-table
-        :data="OperatorUsers"
-        border
-        @selection-change="multipleOperatorSelectionChange"
-      >
-        <el-table-column
-          type="selection"
-          width="55"
-        />
-        <el-table-column
-          prop="username"
-          label="用户名"
-          width="180"
-        />
-        <!-- <el-table-column
-          prop="password"
-          label="密码"
-          width="180"
-        /> -->
-        <el-table-column
-          prop="nickName"
-          label="姓名"
-        />
-        <el-table-column
-          label="所属角色"
+        <el-button type="primary" @click="addOperatorShow"
+          >新增运营商用户</el-button
         >
-          <template slot-scope="scope">
-            {{ (scope.row.roles && scope.row.roles.length && scope.row.roles.length > 0)?scope.row.roles.map(item => item.name).join(' ') : '' }}
-          </template>
-        </el-table-column>
-        <el-table-column
-          label="所属部门"
-          prop="dept.name"
-        />
-        <el-table-column
-          label="所属分组"
+        <el-button
+          type="warning"
+          style="margin-left: 20px;"
+          :disabled="disableOperatorEdit"
+          @click="editOperatorShow"
+          >编辑运营商用户</el-button
         >
-          <template slot-scope="scope">
-            {{ scope.row.groupId ? curGroups.filter(item => item.groupId === scope.row.groupId)[0].groupName: '' }}
-          </template>
-        </el-table-column>
-        <el-table-column
-          label="v网号"
-          prop="vNetNum"
-        />
-        <el-table-column
-          label="手机号"
-          prop="phone"
-        />
-        <el-table-column
-          label="备注"
-          prop="remarks"
-        />
-        <el-table-column
-          label="微信号"
-          prop="wechat"
+        <el-button
+          type="danger"
+          style="margin-left: 20px;"
+          :disabled="disableOperatorDelete"
+          @click="deleteOperator"
+          >删除运营商用户</el-button
+        >
+      </div>
+      <div class="operators-table-wrapper">
+        <el-table
+          :data="OperatorUsers"
+          border
+          @selection-change="multipleOperatorSelectionChange"
+        >
+          <el-table-column type="selection" width="55" />
+          <el-table-column prop="username" label="用户名" width="180" />
+          <!-- <el-table-column
+            prop="password"
+            label="密码"
+            width="180"
+          /> -->
+          <el-table-column prop="nickName" label="姓名" />
+          <el-table-column label="所属角色">
+            <template slot-scope="scope">
+              {{
+                scope.row.roles &&
+                scope.row.roles.length &&
+                scope.row.roles.length > 0
+                  ? scope.row.roles.map(item => item.name).join(" ")
+                  : ""
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column label="所属部门" prop="dept.name" />
+          <el-table-column label="所属分组">
+            <template slot-scope="scope">
+              {{
+                scope.row.groupId
+                  ? curGroups.filter(
+                      item => item.groupId === scope.row.groupId
+                    )[0].groupName
+                  : ""
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column label="v网号" prop="vNetNum" />
+          <el-table-column label="手机号" prop="phone" />
+          <el-table-column label="备注" prop="remarks" />
+          <el-table-column label="微信号" prop="wechat" />
+        </el-table>
+        <el-pagination
+          :current-page="currentOperatorPage"
+          :page-sizes="[10, 20, 30, 40]"
+          :page-size="currentOperatorPageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="totalOperatorPageSize"
+          @size-change="handleOperatorSizeChange"
+          @current-change="handleCurrentOperatorChange"
         />
-      </el-table>
-      <el-pagination
-        :current-page="currentOperatorPage"
-        :page-sizes="[10, 20, 30, 40]"
-        :page-size="currentOperatorPageSize"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="totalOperatorPageSize"
-        @size-change="handleOperatorSizeChange"
-        @current-change="handleCurrentOperatorChange"
-      />
+      </div>
+
       <el-dialog
         title="新增运营商用户"
         :visible.sync="operatorUserDialogShow"
@@ -309,35 +292,16 @@
           label-width="120px"
           :rules="operatorRules"
         >
-          <el-form-item
-            label="用户名"
-            prop="username"
-          >
-            <el-input
-              v-model="operatorFormInfo.username"
-            />
+          <el-form-item label="用户名" prop="username">
+            <el-input v-model="operatorFormInfo.username" />
           </el-form-item>
-          <el-form-item
-            label="密码"
-            prop="password"
-          >
-            <el-input
-              v-model="operatorFormInfo.password"
-              type="password"
-            />
+          <el-form-item label="密码" prop="password">
+            <el-input v-model="operatorFormInfo.password" type="password" />
           </el-form-item>
-          <el-form-item
-            label="姓名"
-            prop="nickName"
-          >
-            <el-input
-              v-model="operatorFormInfo.nickName"
-            />
+          <el-form-item label="姓名" prop="nickName">
+            <el-input v-model="operatorFormInfo.nickName" />
           </el-form-item>
-          <el-form-item
-            label="所属部门"
-            prop="dept"
-          >
+          <el-form-item label="所属部门" prop="dept">
             <treeselect
               v-model="operatorFormInfo.dept"
               :options="curDepts"
@@ -345,14 +309,8 @@
               placeholder="请选择部门"
             />
           </el-form-item>
-          <el-form-item
-            label="角色"
-            label-width="120px"
-          >
-            <el-select
-              v-model="operatorFormInfo.roles"
-              multiple
-            >
+          <el-form-item label="角色" label-width="120px">
+            <el-select v-model="operatorFormInfo.roles" multiple>
               <el-option
                 v-for="(item, index) in curRoles"
                 :key="index"
@@ -361,10 +319,7 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item
-            label="分组名"
-            prop="groupId"
-          >
+          <el-form-item label="分组名" prop="groupId">
             <el-select v-model="operatorFormInfo.groupId">
               <el-option
                 v-for="item in curGroups"
@@ -374,40 +329,29 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item
-            label="v网号"
-            prop="vNetNum"
-          >
+          <el-form-item label="v网号" prop="vNetNum">
             <el-input v-model="operatorFormInfo.vNetNum" />
           </el-form-item>
-          <el-form-item
-            label="电话"
-            prop="phone"
-          >
-            <el-input
-              v-model="operatorFormInfo.phone"
-            />
+          <el-form-item label="电话" prop="phone">
+            <el-input v-model="operatorFormInfo.phone" />
           </el-form-item>
-          <el-form-item
-            label="备注"
-            prop="remarks"
-          >
-            <el-input
-              v-model="operatorFormInfo.remarks"
-            />
+          <el-form-item label="备注" prop="remarks">
+            <el-input v-model="operatorFormInfo.remarks" />
           </el-form-item>
-          <el-form-item
-            label="微信号"
-            prop="wechat"
-          >
-            <el-input
-              v-model="operatorFormInfo.wechat"
-            />
+          <el-form-item label="微信号" prop="wechat">
+            <el-input v-model="operatorFormInfo.wechat" />
           </el-form-item>
         </el-form>
         <div slot="footer">
-          <el-button type="info" @click="clicktoCancelAddOperator">取消</el-button>
-          <el-button type="primary" :loading="isAddOperatorBtnLoading" @click="clicktoSubmitAddOperator">提交</el-button>
+          <el-button type="info" @click="clicktoCancelAddOperator"
+            >取消</el-button
+          >
+          <el-button
+            type="primary"
+            :loading="isAddOperatorBtnLoading"
+            @click="clicktoSubmitAddOperator"
+            >提交</el-button
+          >
         </div>
       </el-dialog>
       <el-dialog
@@ -422,35 +366,16 @@
           label-width="120px"
           :rules="operatorRules"
         >
-          <el-form-item
-            prop="username"
-            label="用户名"
-          >
-            <el-input
-              v-model="editOperatorFormInfo.username"
-            />
+          <el-form-item prop="username" label="用户名">
+            <el-input v-model="editOperatorFormInfo.username" />
           </el-form-item>
-          <el-form-item
-            label="密码"
-            prop="password"
-          >
-            <el-input
-              v-model="editOperatorFormInfo.password"
-              type="password"
-            />
+          <el-form-item label="密码" prop="password">
+            <el-input v-model="editOperatorFormInfo.password" type="password" />
           </el-form-item>
-          <el-form-item
-            label="姓名"
-            prop="nickName"
-          >
-            <el-input
-              v-model="editOperatorFormInfo.nickName"
-            />
+          <el-form-item label="姓名" prop="nickName">
+            <el-input v-model="editOperatorFormInfo.nickName" />
           </el-form-item>
-          <el-form-item
-            label="所属部门"
-            prop="dept"
-          >
+          <el-form-item label="所属部门" prop="dept">
             <treeselect
               v-model="editOperatorFormInfo.dept"
               :options="curDepts"
@@ -458,14 +383,8 @@
               placeholder="请选择部门"
             />
           </el-form-item>
-          <el-form-item
-            label="角色"
-            label-width="120px"
-          >
-            <el-select
-              v-model="editOperatorFormInfo.roles"
-              multiple
-            >
+          <el-form-item label="角色" label-width="120px">
+            <el-select v-model="editOperatorFormInfo.roles" multiple>
               <el-option
                 v-for="(item, index) in curRoles"
                 :key="index"
@@ -474,10 +393,7 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item
-            label="分组名"
-            prop="groupId"
-          >
+          <el-form-item label="分组名" prop="groupId">
             <el-select v-model="editOperatorFormInfo.groupId">
               <el-option
                 v-for="item in curGroups"
@@ -488,110 +404,102 @@
             </el-select>
           </el-form-item>
 
-          <el-form-item
-            label="v网号"
-            prop="vNetNum"
-          >
+          <el-form-item label="v网号" prop="vNetNum">
             <el-input v-model="editOperatorFormInfo.vNetNum" />
           </el-form-item>
-          <el-form-item
-            label="电话"
-            prop="phone"
-          >
-            <el-input
-              v-model="editOperatorFormInfo.phone"
-            />
+          <el-form-item label="电话" prop="phone">
+            <el-input v-model="editOperatorFormInfo.phone" />
           </el-form-item>
-          <el-form-item
-            label="备注"
-            prop="remarks"
-          >
-            <el-input
-              v-model="editOperatorFormInfo.remarks"
-            />
+          <el-form-item label="备注" prop="remarks">
+            <el-input v-model="editOperatorFormInfo.remarks" />
           </el-form-item>
-          <el-form-item
-            label="微信号"
-            prop="wechat"
-          >
-            <el-input
-              v-model="editOperatorFormInfo.wechat"
-            />
+          <el-form-item label="微信号" prop="wechat">
+            <el-input v-model="editOperatorFormInfo.wechat" />
           </el-form-item>
         </el-form>
         <div slot="footer">
           <el-button type="info" @click="cancalEditOperator">取消</el-button>
-          <el-button type="primary" :loading="isEditOperatorBtnLoading" @click="submitEditOperator">提交</el-button>
+          <el-button
+            type="primary"
+            :loading="isEditOperatorBtnLoading"
+            @click="submitEditOperator"
+            >提交</el-button
+          >
         </div>
       </el-dialog>
     </div>
-    <div v-show="curUser === '企业管理用户'" class="users-enterprise-manager-wrapper">
+    <div
+      v-show="curUser === '企业管理用户'"
+      class="users-enterprise-manager-wrapper"
+    >
       <div class="enterprise-Manager-tools-wrapper">
-        <el-button type="primary" @click="clicktoAddEnterpriseUser">新增企业管理用户</el-button>
-        <el-button type="warning" style="margin-left: 20px;" :disabled="disableEnterpriseManagerEdit" @click="clicktoEditEnterpriseManager">编辑企业管理用户</el-button>
-        <el-button type="danger" style="margin-left: 20px;" :disabled="disableEnterpriseManagerDelete" @click="clicktoDeleteEnterpriseManager">删除企业管理用户</el-button>
+        <el-button type="primary" @click="clicktoAddEnterpriseUser"
+          >新增企业管理用户</el-button
+        >
+        <el-button
+          type="warning"
+          style="margin-left: 20px;"
+          :disabled="disableEnterpriseManagerEdit"
+          @click="clicktoEditEnterpriseManager"
+          >编辑企业管理用户</el-button
+        >
+        <el-button
+          type="danger"
+          style="margin-left: 20px;"
+          :disabled="disableEnterpriseManagerDelete"
+          @click="clicktoDeleteEnterpriseManager"
+          >删除企业管理用户</el-button
+        >
       </div>
-      <el-table
-        :data="enterpriseManagerUsers"
-        border
-        @selection-change="handleEnterpriseManagerChange"
-      >
-        <el-table-column
-          type="selection"
-          width="55"
-        />
-        <el-table-column
-          prop="username"
-          label="用户名"
-          width="180"
-        />
-        <el-table-column
-          prop="nickName"
-          label="姓名"
-          width="140"
-        />
-        <el-table-column
-          prop="companyName"
-          label="所属企业"
-          width="240"
-        />
-        <el-table-column
-          label="角色"
-          width="130"
+      <div class="enterprise-Maanger-table-wrapper">
+        <el-table
+          :data="enterpriseManagerUsers"
+          border
+          @selection-change="handleEnterpriseManagerChange"
         >
-          <template slot-scope="scope">
-            {{ (scope.row.roles && scope.row.roles.length && scope.row.roles.length > 0)?scope.row.roles.map(item => item.name).join(' ') : '' }}
-          </template>
-        </el-table-column>
-        <el-table-column
-          prop="wechat"
-          label="微信号"
-          width="280"
-        />
-        <el-table-column
-          prop="phone"
-          label="手机号"
-          width="140"
+          <el-table-column type="selection" width="55" />
+          <el-table-column prop="username" label="用户名" width="180" />
+          <el-table-column prop="nickName" label="姓名" width="140" />
+          <el-table-column prop="companyName" label="所属企业" width="240" />
+          <el-table-column label="角色" width="130">
+            <template slot-scope="scope">
+              {{
+                scope.row.roles &&
+                scope.row.roles.length &&
+                scope.row.roles.length > 0
+                  ? scope.row.roles.map(item => item.name).join(" ")
+                  : ""
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column prop="wechat" label="微信号" width="280" />
+          <el-table-column prop="phone" label="手机号" width="140" />
+          <el-table-column label="审核" fixed="right">
+            <template slot-scope="scope">
+              <div
+                v-if="scope.row.verifyStatus"
+                style="text-align: center;color: #bbb;"
+              >
+                已审核
+              </div>
+              <div v-else style="display: flex;justify-content: center;">
+                <el-button type="primary" @click="verifyUser(scope.row.id)"
+                  >审核</el-button
+                >
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-pagination
+          :current-page="currentEnterpriseManagerPage"
+          :page-sizes="[10, 20, 30, 40]"
+          :page-size="currentEnterpriseManagerPageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="totalEnterpriseManagerSize"
+          @size-change="handleEnterpriseManagerSizeChange"
+          @current-change="handleCurrentEnterpriseMangerChange"
         />
-        <el-table-column
-          label="审核"
-          fixed="right"
-        >
-          <template slot-scope="scope">
-            <div v-if="scope.row.verifyStatus" style="text-align: center;color: #bbb;">已审核</div>
-            <div v-else style="display: flex;justify-content: center;"><el-button type="primary" @click="verifyUser(scope.row.id)">审核</el-button></div>
-          </template>
-        </el-table-column>
-      </el-table>
-      <el-pagination
-        :current-page="currentEnterpriseManagerPage"
-        :page-sizes="[10, 20, 30, 40]"
-        :page-size="currentEnterpriseManagerPageSize"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="totalEnterpriseManagerSize"
-        @size-change="handleEnterpriseManagerSizeChange"
-        @current-change="handleCurrentEnterpriseMangerChange"
-      />
+      </div>
       <el-dialog
         title="新增企业管理用户"
         :visible.sync="addEnterpriseManagerDialogShow"
@@ -604,28 +512,19 @@
           label-width="120px"
           :rules="enterpriseManagerRules"
         >
-          <el-form-item
-            prop="username"
-            label="用户名"
-          >
+          <el-form-item prop="username" label="用户名">
             <el-input v-model="enterpriseManagerFormInfo.username" />
           </el-form-item>
-          <el-form-item
-            prop="password"
-            label="密码"
-          >
-            <el-input v-model="enterpriseManagerFormInfo.password" type="password" />
+          <el-form-item prop="password" label="密码">
+            <el-input
+              v-model="enterpriseManagerFormInfo.password"
+              type="password"
+            />
           </el-form-item>
-          <el-form-item
-            prop="nickName"
-            label="姓名"
-          >
+          <el-form-item prop="nickName" label="姓名">
             <el-input v-model="enterpriseManagerFormInfo.nickName" />
           </el-form-item>
-          <el-form-item
-            prop="companyId"
-            label="所属企业"
-          >
+          <el-form-item prop="companyId" label="所属企业">
             <el-select
               v-model="enterpriseManagerFormInfo.companyId"
               filterable
@@ -653,22 +552,23 @@
               />
             </el-select>
           </el-form-item> -->
-          <el-form-item
-            prop="wechat"
-            label="微信号"
-          >
+          <el-form-item prop="wechat" label="微信号">
             <el-input v-model="enterpriseManagerFormInfo.wechat" />
           </el-form-item>
-          <el-form-item
-            prop="phone"
-            label="手机号"
-          >
+          <el-form-item prop="phone" label="手机号">
             <el-input v-model="enterpriseManagerFormInfo.phone" />
           </el-form-item>
         </el-form>
         <div slot="footer">
-          <el-button type="info" @click="cancelAddEnterpriseManager">取消</el-button>
-          <el-button type="primary" :loading="isAddEnterpriseManagerLoading" @click="submitEnterpriseManager">提交</el-button>
+          <el-button type="info" @click="cancelAddEnterpriseManager"
+            >取消</el-button
+          >
+          <el-button
+            type="primary"
+            :loading="isAddEnterpriseManagerLoading"
+            @click="submitEnterpriseManager"
+            >提交</el-button
+          >
         </div>
       </el-dialog>
       <el-dialog
@@ -683,28 +583,19 @@
           label-width="120px"
           :rules="enterpriseManagerRules"
         >
-          <el-form-item
-            prop="username"
-            label="用户名"
-          >
+          <el-form-item prop="username" label="用户名">
             <el-input v-model="editEnterpriseManagerFormInfo.username" />
           </el-form-item>
-          <el-form-item
-            prop="password"
-            label="密码"
-          >
-            <el-input v-model="editEnterpriseManagerFormInfo.password" type="password" />
+          <el-form-item prop="password" label="密码">
+            <el-input
+              v-model="editEnterpriseManagerFormInfo.password"
+              type="password"
+            />
           </el-form-item>
-          <el-form-item
-            prop="nickName"
-            label="姓名"
-          >
+          <el-form-item prop="nickName" label="姓名">
             <el-input v-model="editEnterpriseManagerFormInfo.nickName" />
           </el-form-item>
-          <el-form-item
-            prop="enterpriseName"
-            label="所属企业"
-          >
+          <el-form-item prop="enterpriseName" label="所属企业">
             <el-select
               v-model="editEnterpriseManagerFormInfo.companyId"
               filterable
@@ -732,26 +623,30 @@
               />
             </el-select>
           </el-form-item> -->
-          <el-form-item
-            prop="wechat"
-            label="微信号"
-          >
+          <el-form-item prop="wechat" label="微信号">
             <el-input v-model="editEnterpriseManagerFormInfo.wechat" />
           </el-form-item>
-          <el-form-item
-            prop="phone"
-            label="手机号"
-          >
+          <el-form-item prop="phone" label="手机号">
             <el-input v-model="editEnterpriseManagerFormInfo.phone" />
           </el-form-item>
         </el-form>
         <div slot="footer">
-          <el-button type="info" @click="cancelEditEnterpriseManager">取消</el-button>
-          <el-button type="primary" :loading="isEditEnterpriseManagerLoading" @click="submitEditEnterpriseManager">提交</el-button>
+          <el-button type="info" @click="cancelEditEnterpriseManager"
+            >取消</el-button
+          >
+          <el-button
+            type="primary"
+            :loading="isEditEnterpriseManagerLoading"
+            @click="submitEditEnterpriseManager"
+            >提交</el-button
+          >
         </div>
       </el-dialog>
     </div>
-    <div v-show="curUser === '企业员工用户'" class="users-enterprise-staff-wrapper">
+    <div
+      v-show="curUser === '企业员工用户'"
+      class="users-enterprise-staff-wrapper"
+    >
       <div class="enterprise-staff-tools-wrapper">
         <!-- <el-button type="primary" @click="addEnterpriseStaffDialog">新增企业员工用户</el-button>
         <el-button type="warning" style="margin-left: 20px;" :disabled="disableEnterpriseStaffEdit" @click="editEnterpriseStaffDialog">编辑企业员工用户</el-button>
@@ -762,45 +657,19 @@
         border
         @selection-change="handleEnterpriseStaffChange"
       >
-        <el-table-column
-          type="selection"
-          width="55"
-        />
-        <el-table-column
-          prop="username"
-          label="用户名"
-          width="180"
-        />
-        <el-table-column
-          prop="nickName"
-          label="姓名"
-          width="140"
-        />
-        <el-table-column
-          prop="companyName"
-          label="所属企业"
-          width="240"
-        />
-        <el-table-column
-          prop="wechat"
-          label="微信号"
-          width="280"
-        />
-        <el-table-column
-          prop="phone"
-          label="手机号"
-          width="140"
-        />
-        <el-table-column
-          label="审核状态"
-          width="140"
-        >
+        <el-table-column type="selection" width="55" />
+        <el-table-column prop="username" label="用户名" width="180" />
+        <el-table-column prop="nickName" label="姓名" width="140" />
+        <el-table-column prop="companyName" label="所属企业" width="240" />
+        <el-table-column prop="wechat" label="微信号" width="280" />
+        <el-table-column prop="phone" label="手机号" width="140" />
+        <el-table-column label="审核状态" width="140">
           <template slot-scope="scope">
             <!-- <div style="display:flex;justify-content: center;align-items: center;">
               {{ scope.row.verifyStatus? '已审核' : '未审核' }}
             </div> -->
             <div>
-              {{ scope.row.verifyStatus? '已审核' : '未审核' }}
+              {{ scope.row.verifyStatus ? "已审核" : "未审核" }}
             </div>
           </template>
         </el-table-column>
@@ -826,28 +695,19 @@
           label-width="120px"
           :rules="enterpriseManagerRules"
         >
-          <el-form-item
-            prop="username"
-            label="用户名"
-          >
+          <el-form-item prop="username" label="用户名">
             <el-input v-model="enterpriseStaffFormInfo.username" />
           </el-form-item>
-          <el-form-item
-            prop="password"
-            label="密码"
-          >
-            <el-input v-model="enterpriseStaffFormInfo.password" type="password" />
+          <el-form-item prop="password" label="密码">
+            <el-input
+              v-model="enterpriseStaffFormInfo.password"
+              type="password"
+            />
           </el-form-item>
-          <el-form-item
-            prop="nickName"
-            label="姓名"
-          >
+          <el-form-item prop="nickName" label="姓名">
             <el-input v-model="enterpriseStaffFormInfo.nickName" />
           </el-form-item>
-          <el-form-item
-            prop="companyId"
-            label="所属企业"
-          >
+          <el-form-item prop="companyId" label="所属企业">
             <el-select
               v-model="enterpriseStaffFormInfo.companyId"
               filterable
@@ -875,22 +735,23 @@
               />
             </el-select>
           </el-form-item> -->
-          <el-form-item
-            prop="wechat"
-            label="微信号"
-          >
+          <el-form-item prop="wechat" label="微信号">
             <el-input v-model="enterpriseStaffFormInfo.wechat" />
           </el-form-item>
-          <el-form-item
-            prop="phone"
-            label="手机号"
-          >
+          <el-form-item prop="phone" label="手机号">
             <el-input v-model="enterpriseStaffFormInfo.phone" />
           </el-form-item>
         </el-form>
         <div slot="footer">
-          <el-button type="info" @click="cancelAddEnterpriseStaff">取消</el-button>
-          <el-button type="primary" :loading="isAddEnterpriseStaffLoading" @click="submitAddEnterpriseStaff">提交</el-button>
+          <el-button type="info" @click="cancelAddEnterpriseStaff"
+            >取消</el-button
+          >
+          <el-button
+            type="primary"
+            :loading="isAddEnterpriseStaffLoading"
+            @click="submitAddEnterpriseStaff"
+            >提交</el-button
+          >
         </div>
       </el-dialog>
       <el-dialog
@@ -905,28 +766,19 @@
           label-width="120px"
           :rules="enterpriseManagerRules"
         >
-          <el-form-item
-            prop="username"
-            label="用户名"
-          >
+          <el-form-item prop="username" label="用户名">
             <el-input v-model="editEnterpriseStaffFormInfo.userName" />
           </el-form-item>
-          <el-form-item
-            prop="password"
-            label="密码"
-          >
-            <el-input v-model="editEnterpriseStaffFormInfo.passWord" type="password" />
+          <el-form-item prop="password" label="密码">
+            <el-input
+              v-model="editEnterpriseStaffFormInfo.passWord"
+              type="password"
+            />
           </el-form-item>
-          <el-form-item
-            prop="nickName"
-            label="姓名"
-          >
+          <el-form-item prop="nickName" label="姓名">
             <el-input v-model="editEnterpriseStaffFormInfo.nickName" />
           </el-form-item>
-          <el-form-item
-            prop="enterpriseName"
-            label="所属企业"
-          >
+          <el-form-item prop="enterpriseName" label="所属企业">
             <el-select
               v-model="editEnterpriseStaffFormInfo.enterpriseName"
               filterable
@@ -941,10 +793,7 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item
-            prop="roles"
-            label="角色"
-          >
+          <el-form-item prop="roles" label="角色">
             <el-select v-model="editEnterpriseStaffFormInfo.roles">
               <el-option
                 v-for="(item, index) in curRoles"
@@ -954,22 +803,23 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item
-            prop="wechat"
-            label="微信号"
-          >
+          <el-form-item prop="wechat" label="微信号">
             <el-input v-model="editEnterpriseStaffFormInfo.wechat" />
           </el-form-item>
-          <el-form-item
-            prop="phone"
-            label="手机号"
-          >
+          <el-form-item prop="phone" label="手机号">
             <el-input v-model="editEnterpriseStaffFormInfo.phone" />
           </el-form-item>
         </el-form>
         <div slot="footer">
-          <el-button type="info" @click="cancelEditEnterpriseStaff">取消</el-button>
-          <el-button type="primary" :loading="isEditEnterpriseStaffLoading" @click="submitEditEnterpriseStaff">提交</el-button>
+          <el-button type="info" @click="cancelEditEnterpriseStaff"
+            >取消</el-button
+          >
+          <el-button
+            type="primary"
+            :loading="isEditEnterpriseStaffLoading"
+            @click="submitEditEnterpriseStaff"
+            >提交</el-button
+          >
         </div>
       </el-dialog>
     </div>
@@ -977,22 +827,30 @@
 </template>
 
 <script>
-import { getAll } from '@/api/system/role'
-import { getDepts } from '@/api/system/dept'
-import { getAllCompanyInfo, getAllGroup, addUserInfo, editUserInfo, getUserByRole, getIndustryChargeDept, deleteUsersInfo, verifyEnterpriseManager } from '../../../api/industry'
+import { getAll } from "@/api/system/role";
+import { getDepts } from "@/api/system/dept";
+import {
+  getAllCompanyInfo,
+  getAllGroup,
+  addUserInfo,
+  editUserInfo,
+  getUserByRole,
+  getIndustryChargeDept,
+  deleteUsersInfo,
+  verifyEnterpriseManager
+} from "../../../api/industry";
 // 导入vue-treeselect
-import Treeselect from '@riophae/vue-treeselect'
-import '@riophae/vue-treeselect/dist/vue-treeselect.css'
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 export default {
   components: { Treeselect },
   data() {
     return {
       // 当前选中的是政府用户、运营商用户、企业管理用户、企业员工用户
-      curUser: '政府用户',
+      curUser: "政府用户",
       // 当前所有的角色
       curRoles: [],
-      govUsers: [
-      ],
+      govUsers: [],
       currentGovPage: 1,
       currentGovPageSize: 10,
       totalGovPageSize: 40,
@@ -1001,95 +859,93 @@ export default {
       disableGovDelete: true,
       govUserDialogShow: false,
       govFormInfo: {
-        username: '',
-        password: '',
-        nickName: '',
+        username: "",
+        password: "",
+        nickName: "",
         thIndustryChargeDept: {
-          icdId: ''
+          icdId: ""
         },
-        roles: '',
-        wechat: '',
-        phone: ''
+        roles: "",
+        wechat: "",
+        phone: ""
       },
       govRules: {
         username: [
           {
             required: true,
-            message: '请输入用户名',
-            trigger: 'blur'
+            message: "请输入用户名",
+            trigger: "blur"
           }
         ],
         password: [
           {
             required: true,
-            message: '请输入密码',
-            trigger: 'blur'
+            message: "请输入密码",
+            trigger: "blur"
           }
         ],
         nickName: [
           {
             required: true,
-            message: '请输入姓名',
-            trigger: 'blur'
+            message: "请输入姓名",
+            trigger: "blur"
           }
         ],
-        'thIndustryChargeDept.icdId': [
+        "thIndustryChargeDept.icdId": [
           {
             required: true,
-            message: '请输入所属局',
-            trigger: 'change'
+            message: "请输入所属局",
+            trigger: "change"
           }
         ]
       },
       editGovUserDialogShow: false,
       editGovFormInfo: {
-        username: '',
-        password: '',
-        nickName: '',
+        username: "",
+        password: "",
+        nickName: "",
         thIndustryChargeDept: {
-          icdId: ''
+          icdId: ""
         },
-        roles: '',
-        wechat: '',
-        phone: ''
+        roles: "",
+        wechat: "",
+        phone: ""
       },
       editGovRules: {
         username: [
           {
             required: true,
-            message: '请输入用户名',
-            trigger: 'blur'
+            message: "请输入用户名",
+            trigger: "blur"
           }
         ],
         password: [
           {
             required: true,
-            message: '请输入密码',
-            trigger: 'blur'
+            message: "请输入密码",
+            trigger: "blur"
           }
         ],
         nickName: [
           {
             required: true,
-            message: '请输入姓名',
-            trigger: 'blur'
+            message: "请输入姓名",
+            trigger: "blur"
           }
         ],
-        'thIndustryChargeDept.icdId': [
+        "thIndustryChargeDept.icdId": [
           {
             required: true,
-            message: '请输入所属局',
-            trigger: 'change'
+            message: "请输入所属局",
+            trigger: "change"
           }
         ]
       },
-      enterpriseManagerUsers: [
-      ],
+      enterpriseManagerUsers: [],
       currentEnterpriseManagerPage: 1,
       currentEnterpriseManagerPageSize: 10,
       totalEnterpriseManagerSize: 40,
-      enterpriseStaffUsers: [
-      ],
+      enterpriseStaffUsers: [],
       currentEnterStaffPage: 1,
       currentEnterStaffPageSize: 10,
       totalEnterStaffPageSize: 40,
@@ -1103,90 +959,88 @@ export default {
       disableEnterpriseManagerDelete: true,
       addEnterpriseManagerDialogShow: false,
       enterpriseManagerFormInfo: {
-        username: '',
-        password: '',
-        nickName: '',
-        companyId: '',
-        roles: '',
-        wechat: '',
-        phone: ''
+        username: "",
+        password: "",
+        nickName: "",
+        companyId: "",
+        roles: "",
+        wechat: "",
+        phone: ""
       },
       enterpriseManagerRules: {
         username: [
           {
             required: true,
-            message: '请输入用户名',
-            trigger: 'blur'
+            message: "请输入用户名",
+            trigger: "blur"
           }
         ],
         password: [
           {
             required: true,
-            message: '请输入密码',
-            trigger: 'blur'
+            message: "请输入密码",
+            trigger: "blur"
           }
         ],
         nickName: [
           {
             required: true,
-            message: '请输入姓名',
-            trigger: 'blur'
+            message: "请输入姓名",
+            trigger: "blur"
           }
         ],
         companyId: [
           {
             required: true,
-            message: '请输入企业名',
-            trigger: 'blur'
+            message: "请输入企业名",
+            trigger: "blur"
           }
         ],
         roles: [
           {
             required: true,
-            message: '请输入角色',
-            trigger: 'change'
+            message: "请输入角色",
+            trigger: "change"
           }
         ],
         wechat: [
           {
             required: true,
-            message: '请输入微信号',
-            trigger: 'blur'
+            message: "请输入微信号",
+            trigger: "blur"
           }
         ]
       },
-      curEnterprises: [
-      ],
+      curEnterprises: [],
       editEnterpriseManagerDialogShow: false,
       editEnterpriseManagerFormInfo: {
-        username: '',
-        password: '',
-        nickName: '',
-        companyId: '',
-        roles: '',
-        wechat: '',
-        phone: ''
+        username: "",
+        password: "",
+        nickName: "",
+        companyId: "",
+        roles: "",
+        wechat: "",
+        phone: ""
       },
       enterpriseStaffFormInfo: {
-        userName: '',
-        passWord: '',
-        nickName: '',
-        enterpriseName: '',
-        roles: '',
-        wechat: '',
-        phone: ''
+        userName: "",
+        passWord: "",
+        nickName: "",
+        enterpriseName: "",
+        roles: "",
+        wechat: "",
+        phone: ""
       },
       editEnterpriseStaffFormInfo: {
-        userName: '',
-        passWord: '',
-        nickName: '',
-        enterpriseName: '',
-        roles: '',
-        wechat: '',
-        phone: ''
+        userName: "",
+        passWord: "",
+        nickName: "",
+        enterpriseName: "",
+        roles: "",
+        wechat: "",
+        phone: ""
       },
-      OperatorUsers: [
-      ],
+      OperatorUsers: [],
       currentOperatorPage: 1,
       currentOperatorPageSize: 10,
       totalOperatorPageSize: 40,
@@ -1195,100 +1049,100 @@ export default {
       curDepts: [],
       operatorFormInfo: {
         // 用户名
-        username: '',
+        username: "",
         // 密码
-        password: '',
+        password: "",
         // 人员姓名
-        nickName: '',
+        nickName: "",
         // 所属角色
-        roles: '',
+        roles: "",
         // 部门
         dept: null,
         // 所属分组
         groupId: null,
         // v网号
-        vNetNum: '',
+        vNetNum: "",
         // 手机号
-        phone: '',
+        phone: "",
         // 备注
-        remarks: '',
+        remarks: "",
         // 微信号
-        wechat: ''
+        wechat: ""
       },
       operatorUserDialogShow: false,
       operatorRules: {
         username: [
           {
             required: true,
-            message: '请输入用户名',
-            trigger: 'blur'
+            message: "请输入用户名",
+            trigger: "blur"
           }
         ],
         password: [
           {
             required: true,
-            message: '请输入密码',
-            trigger: 'blur'
+            message: "请输入密码",
+            trigger: "blur"
           }
         ],
         nickName: [
           {
             required: true,
-            message: '请输入姓名',
-            trigger: 'blur'
+            message: "请输入姓名",
+            trigger: "blur"
           }
         ],
         roles: [
           {
             required: true,
-            message: '请选择角色',
-            trigger: 'change'
+            message: "请选择角色",
+            trigger: "change"
           }
         ],
         dept: [
           {
             required: true,
-            message: '请选择部门',
-            trigger: 'change'
+            message: "请选择部门",
+            trigger: "change"
           }
         ],
         phone: [
           {
             required: true,
-            message: '请输入手机号码',
-            trigger: 'blur'
+            message: "请输入手机号码",
+            trigger: "blur"
           }
         ],
         wechat: [
           {
             required: true,
-            message: '请输入微信号',
-            trigger: 'blur'
+            message: "请输入微信号",
+            trigger: "blur"
           }
         ]
       },
       editOperatorUserDialogShow: false,
       editOperatorFormInfo: {
         // 用户名
-        username: '',
+        username: "",
         // 密码
-        password: '',
+        password: "",
         // 人员姓名
-        nickName: '',
+        nickName: "",
         // 所属角色
-        roles: '',
+        roles: "",
         // 部门
         dept: null,
         // 所属分组
         groupId: null,
         // v网号
-        vNetNum: '',
+        vNetNum: "",
         // 手机号
-        phone: '',
+        phone: "",
         // 备注
-        remarks: '',
+        remarks: "",
         // 微信号
-        wechat: ''
+        wechat: ""
       },
       isAddGovUserBtnLoading: false,
       isEditGovUserBtnLoading: false,
@@ -1309,205 +1163,250 @@ export default {
       enterpriseManagerLoading: false,
       enterpriseStaffLoading: false,
       chargeDepts: []
-    }
+    };
   },
   mounted() {
     // 在这里面获取所有的角色
-    this.initAllUsers()
+    this.initAllUsers();
     // 获取当前所有分组
     getAllGroup().then(res => {
-      this.curGroups = [...res.content]
-      console.log(this.curGroups, 'this.curGroups')
-    })
+      this.curGroups = [...res.content];
+      console.log(this.curGroups, "this.curGroups");
+    });
     // 在这里面获取所有的部门
     getDepts().then(res => {
-      this.curDepts = [...res.content]
-      console.log('当前所有部门', this.curDepts)
+      this.curDepts = [...res.content];
+      console.log("当前所有部门", this.curDepts);
       for (let i = 0; i < this.curDepts.length; i++) {
-        this.curDepts[i].label = this.curDepts[i].name
-        this.recursiveAllDept(this.curDepts[i])
+        this.curDepts[i].label = this.curDepts[i].name;
+        this.recursiveAllDept(this.curDepts[i]);
       }
-    })
+    });
   },
   methods: {
     userTypeSelect(item) {
-      this.curUser = item
+      this.curUser = item;
     },
     recursiveAllDept(item) {
       if (item.hasChildren === true) {
         getDepts({ pid: item.id }).then(res => {
-          item.children = [...res.content]
+          item.children = [...res.content];
           for (let i = 0; i < item.children.length; i++) {
-            item.children[i].label = item.children[i].name
-            this.recursiveAllDept(item.children[i])
-            console.log(this.curDepts, '1232133213123123122222_________')
+            item.children[i].label = item.children[i].name;
+            this.recursiveAllDept(item.children[i]);
+            console.log(this.curDepts, "1232133213123123122222_________");
           }
-        })
+        });
       }
     },
     handleGovSizeChange(val) {
-      this.currentGovPageSize = val
-      this.initGovUserList()
+      this.currentGovPageSize = val;
+      this.initGovUserList();
     },
     handleGovCurrentChange(val) {
-      this.currentGovPage = val
-      this.initGovUserList()
+      this.currentGovPage = val;
+      this.initGovUserList();
     },
     handleGovSelectionChange(val) {
-      this.multipleGovSelection = val
-      this.disableGovEdit = true
-      this.disableGovDelete = true
+      this.multipleGovSelection = val;
+      this.disableGovEdit = true;
+      this.disableGovDelete = true;
       if (this.multipleGovSelection.length === 1) {
-        this.disableGovEdit = false
+        this.disableGovEdit = false;
       }
       if (this.multipleGovSelection.length > 0) {
-        this.disableGovDelete = false
+        this.disableGovDelete = false;
       }
     },
     clickToAddGovUserDialogShow() {
       // this.$refs['addGovUserForm'].resetFields()
       this.govFormInfo = {
-        username: '',
-        password: '',
-        nickName: '',
+        username: "",
+        password: "",
+        nickName: "",
         thIndustryChargeDept: {
-          icdId: ''
+          icdId: ""
         },
-        roles: '',
-        wechat: '',
-        phone: ''
-      }
-      this.govUserDialogShow = true
+        roles: "",
+        wechat: "",
+        phone: ""
+      };
+      this.govUserDialogShow = true;
     },
     cancelAddGovUser() {
       // 取消添加政府用户
-      this.govUserDialogShow = false
+      this.govUserDialogShow = false;
     },
     submitGovUser() {
       // 确认提交
-      this.$refs.addGovUserForm.validate((valid) => {
+      this.$refs.addGovUserForm.validate(valid => {
         if (valid) {
-          this.isAddGovUserBtnLoading = true
-          console.log(this.govFormInfo.roles, 'this.govFormInfo this.govFormInfo this.govFormInfo this.govFormInfo')
+          this.isAddGovUserBtnLoading = true;
+          console.log(
+            this.govFormInfo.roles,
+            "this.govFormInfo this.govFormInfo this.govFormInfo this.govFormInfo"
+          );
           // valid
-          const replaceUser = {}
-          replaceUser.username = this.govFormInfo.username
-          replaceUser.password = this.govFormInfo.password
-          replaceUser.nickName = this.govFormInfo.nickName
+          const replaceUser = {};
+          replaceUser.username = this.govFormInfo.username;
+          replaceUser.password = this.govFormInfo.password;
+          replaceUser.nickName = this.govFormInfo.nickName;
           replaceUser.thIndustryChargeDept = {
             icdId: this.govFormInfo.thIndustryChargeDept.icdId
-          }
-          if (this.govFormInfo.roles && this.govFormInfo.roles && this.govFormInfo.roles.length > 0) {
-            replaceUser.roles = [...this.originRoles.filter(item => item.name === '政府'), ...this.curRoles.filter(item => this.govFormInfo.roles.includes(item.id))]
+          };
+          if (
+            this.govFormInfo.roles &&
+            this.govFormInfo.roles &&
+            this.govFormInfo.roles.length > 0
+          ) {
+            replaceUser.roles = [
+              ...this.originRoles.filter(item => item.name === "政府"),
+              ...this.curRoles.filter(item =>
+                this.govFormInfo.roles.includes(item.id)
+              )
+            ];
           } else {
-            replaceUser.roles = [...this.originRoles.filter(item => item.name === '政府')]
+            replaceUser.roles = [
+              ...this.originRoles.filter(item => item.name === "政府")
+            ];
           }
-          replaceUser.wechat = this.govFormInfo.wechat
-          replaceUser.phone = this.govFormInfo.phone
-          replaceUser.enabled = 1
-          addUserInfo(replaceUser).then(res => {
-            console.log(res, 'addGovUser')
-            this.$message({
-              message: '添加成功',
-              type: 'success'
+          replaceUser.wechat = this.govFormInfo.wechat;
+          replaceUser.phone = this.govFormInfo.phone;
+          replaceUser.enabled = 1;
+          addUserInfo(replaceUser)
+            .then(res => {
+              console.log(res, "addGovUser");
+              this.$message({
+                message: "添加成功",
+                type: "success"
+              });
+              this.initGovUserList();
+              this.govUserDialogShow = false;
+              this.isAddGovUserBtnLoading = false;
             })
-            this.initGovUserList()
-            this.govUserDialogShow = false
-            this.isAddGovUserBtnLoading = false
-          }).catch(res => {
-            this.$message.error('添加失败')
-            this.govUserDialogShow = false
-            this.isAddGovUserBtnLoading = false
-          })
+            .catch(res => {
+              this.$message.error("添加失败");
+              this.govUserDialogShow = false;
+              this.isAddGovUserBtnLoading = false;
+            });
         }
-      })
+      });
     },
     clickToDeleteGovUserDialogShow() {
-      this.$confirm('此操作将要删除所选用户', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        deleteUsersInfo(this.multipleGovSelection.map(item => item.id)).then(res => {
-          this.$message({
-            message: '删除成功',
-            type: 'success'
-          })
-          this.initGovUserList()
-        }).catch(() => {
-          this.$message.error('删除失败')
-        })
-      }).catch((err) => {
-        console.log(err)
-        this.$message({
-          type: 'info',
-          message: '已取消操作'
-        })
+      this.$confirm("此操作将要删除所选用户", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          deleteUsersInfo(this.multipleGovSelection.map(item => item.id))
+            .then(res => {
+              this.$message({
+                message: "删除成功",
+                type: "success"
+              });
+              this.initGovUserList();
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(err => {
+          console.log(err);
+          this.$message({
+            type: "info",
+            message: "已取消操作"
+          });
+        });
     },
     clickToEditGovUserDialogShow() {
       // 编辑
-      this.editGovFormInfo = { ...this.multipleGovSelection[0] }
-      this.editGovFormInfo.roles = this.multipleGovSelection[0].roles.filter(item => !(item.name === '政府' || item.name === '运营商' || item.name === '企业管理' || item.name === '企业员工')).map(item => item.id)
-      this.editGovUserDialogShow = true
+      this.editGovFormInfo = { ...this.multipleGovSelection[0] };
+      this.editGovFormInfo.roles = this.multipleGovSelection[0].roles
+        .filter(
+          item =>
+            !(
+              item.name === "政府" ||
+              item.name === "运营商" ||
+              item.name === "企业管理" ||
+              item.name === "企业员工"
+            )
+        )
+        .map(item => item.id);
+      this.editGovUserDialogShow = true;
     },
     cancelEditGovUser() {
-      this.editGovUserDialogShow = false
+      this.editGovUserDialogShow = false;
     },
     submitEditGovUser() {
       // 提交
-      this.$refs.editGovUserForm.validate((valid) => {
-        if (valid) {
-          // axios
-          this.isEditGovUserBtnLoading = true
-          if (this.editGovFormInfo.roles && this.editGovFormInfo.roles.length && this.editGovFormInfo.roles.length > 0) {
-            this.editGovFormInfo.roles = [...this.originRoles.filter(item => item.name === '政府'), ...this.curRoles.filter(item => this.editGovFormInfo.roles.includes(item.id))]
-          } else {
-            this.editGovFormInfo.roles = this.originRoles.filter(item => item.name === '政府')
-          }
-          for (const key in this.editGovFormInfo) {
-            if (!this.editGovFormInfo[key]) {
-              delete this.editGovFormInfo[key]
+      this.$refs.editGovUserForm
+        .validate(valid => {
+          if (valid) {
+            // axios
+            this.isEditGovUserBtnLoading = true;
+            if (
+              this.editGovFormInfo.roles &&
+              this.editGovFormInfo.roles.length &&
+              this.editGovFormInfo.roles.length > 0
+            ) {
+              this.editGovFormInfo.roles = [
+                ...this.originRoles.filter(item => item.name === "政府"),
+                ...this.curRoles.filter(item =>
+                  this.editGovFormInfo.roles.includes(item.id)
+                )
+              ];
+            } else {
+              this.editGovFormInfo.roles = this.originRoles.filter(
+                item => item.name === "政府"
+              );
+            }
+            for (const key in this.editGovFormInfo) {
+              if (!this.editGovFormInfo[key]) {
+                delete this.editGovFormInfo[key];
+              }
             }
+            editUserInfo(this.editGovFormInfo)
+              .then(res => {
+                console.log(res, "editGovUser");
+                this.$message({
+                  message: "修改成功",
+                  type: "success"
+                });
+                this.editGovUserDialogShow = false;
+                this.isEditGovUserBtnLoading = false;
+                this.initGovUserList();
+              })
+              .catch(() => {
+                this.editGovUserDialogShow = false;
+                this.isEditGovUserBtnLoading = false;
+              });
           }
-          editUserInfo(this.editGovFormInfo).then(res => {
-            console.log(res, 'editGovUser')
-            this.$message({
-              message: '修改成功',
-              type: 'success'
-            })
-            this.editGovUserDialogShow = false
-            this.isEditGovUserBtnLoading = false
-            this.initGovUserList()
-          }).catch(() => {
-            this.editGovUserDialogShow = false
-            this.isEditGovUserBtnLoading = false
-          })
-        }
-      }).catch(res => {
-        this.$message.error('修改失败')
-        this.editGovUserDialogShow = false
-        this.isEditGovUserBtnLoading = false
-      })
+        })
+        .catch(res => {
+          this.$message.error("修改失败");
+          this.editGovUserDialogShow = false;
+          this.isEditGovUserBtnLoading = false;
+        });
     },
     handleEnterpriseManagerChange(val) {
-      this.multipleEnterpriseManagerSelection = val
-      this.disableEnterpriseManagerEdit = true
-      this.disableEnterpriseManagerDelete = true
+      this.multipleEnterpriseManagerSelection = val;
+      this.disableEnterpriseManagerEdit = true;
+      this.disableEnterpriseManagerDelete = true;
       if (this.multipleEnterpriseManagerSelection.length === 1) {
-        this.disableEnterpriseManagerEdit = false
+        this.disableEnterpriseManagerEdit = false;
       }
       if (this.multipleEnterpriseManagerSelection.length > 0) {
-        this.disableEnterpriseManagerDelete = false
+        this.disableEnterpriseManagerDelete = false;
       }
     },
     handleEnterpriseManagerSizeChange(val) {
-      this.currentEnterpriseManagerPageSize = val
-      this.initEnterpriseManagerList()
+      this.currentEnterpriseManagerPageSize = val;
+      this.initEnterpriseManagerList();
     },
     handleCurrentEnterpriseMangerChange(val) {
-      this.currentEnterManagerPage = val
-      this.initEnterpriseManagerList()
+      this.currentEnterManagerPage = val;
+      this.initEnterpriseManagerList();
     },
     // 根据用户输入的 item 进行搜索
     remoteMethod(item) {
@@ -1516,225 +1415,244 @@ export default {
         size: this.curPageSum,
         companyName: item
       }).then(res => {
-        console.log(res, 'isres', item)
-        this.curEnterprises = [...res.content]
-      })
+        console.log(res, "isres", item);
+        this.curEnterprises = [...res.content];
+      });
     },
     // 添加企业用户
     clicktoAddEnterpriseUser() {
-      this.enterpriseManagerFormInfo.username = ''
-      this.enterpriseManagerFormInfo.password = ''
-      this.enterpriseManagerFormInfo.nickName = ''
-      this.enterpriseManagerFormInfo.companyId = ''
-      this.enterpriseManagerFormInfo.wechat = ''
-      this.enterpriseManagerFormInfo.phone = ''
-      this.addEnterpriseManagerDialogShow = true
+      this.enterpriseManagerFormInfo.username = "";
+      this.enterpriseManagerFormInfo.password = "";
+      this.enterpriseManagerFormInfo.nickName = "";
+      this.enterpriseManagerFormInfo.companyId = "";
+      this.enterpriseManagerFormInfo.wechat = "";
+      this.enterpriseManagerFormInfo.phone = "";
+      this.addEnterpriseManagerDialogShow = true;
     },
     cancelAddEnterpriseManager() {
-      this.addEnterpriseManagerDialogShow = false
+      this.addEnterpriseManagerDialogShow = false;
     },
     // 提交企业管理用户
     submitEnterpriseManager() {
-      this.$refs.addEnterpriseManagerForm.validate((valid) => {
+      this.$refs.addEnterpriseManagerForm.validate(valid => {
         if (valid) {
           // axios
           // this.enterpriseManagerFormInfo
-          this.isAddEnterpriseManagerLoading = true
-          this.enterpriseManagerFormInfo.enabled = 1
-          this.enterpriseManagerFormInfo.roles = this.originRoles.filter(item => item.name === '企业管理')
-          this.enterpriseManagerFormInfo.verifyStatus = 1
-          addUserInfo({ ...this.enterpriseManagerFormInfo, tag: '企业管理' }).then(res => {
-            this.$message({
-              type: 'success',
-              message: '添加成功'
+          this.isAddEnterpriseManagerLoading = true;
+          this.enterpriseManagerFormInfo.enabled = 1;
+          this.enterpriseManagerFormInfo.roles = this.originRoles.filter(
+            item => item.name === "企业管理"
+          );
+          this.enterpriseManagerFormInfo.verifyStatus = 1;
+          addUserInfo({ ...this.enterpriseManagerFormInfo, tag: "企业管理" })
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.isAddEnterpriseManagerLoading = false;
+              this.addEnterpriseManagerDialogShow = false;
+              this.initEnterpriseManagerList();
             })
-            this.isAddEnterpriseManagerLoading = false
-            this.addEnterpriseManagerDialogShow = false
-            this.initEnterpriseManagerList()
-          }).catch(() => {
-            this.$message.error('添加失败')
-            this.isAddEnterpriseManagerLoading = false
-            this.addEnterpriseManagerDialogShow = false
-          })
+            .catch(() => {
+              this.$message.error("添加失败");
+              this.isAddEnterpriseManagerLoading = false;
+              this.addEnterpriseManagerDialogShow = false;
+            });
         }
-      })
+      });
     },
     cancelEditEnterpriseManager() {
-      this.editEnterpriseManagerDialogShow = false
+      this.editEnterpriseManagerDialogShow = false;
     },
     submitEditEnterpriseManager() {
       // this.editEnterpriseManagerDialogShow = true
-      this.$refs.editEnterpriseManagerForm.validate((valid) => {
+      this.$refs.editEnterpriseManagerForm.validate(valid => {
         // 验证
-        this.isEditEnterpriseManagerLoading = true
-        editUserInfo(this.editEnterpriseManagerFormInfo).then(res => {
-          this.isEditEnterpriseManagerLoading = false
-          this.$message({
-            type: 'success',
-            message: '修改成功'
+        this.isEditEnterpriseManagerLoading = true;
+        editUserInfo(this.editEnterpriseManagerFormInfo)
+          .then(res => {
+            this.isEditEnterpriseManagerLoading = false;
+            this.$message({
+              type: "success",
+              message: "修改成功"
+            });
+            this.editEnterpriseManagerDialogShow = false;
+            this.initEnterpriseManagerList();
           })
-          this.editEnterpriseManagerDialogShow = false
-          this.initEnterpriseManagerList()
-        }).catch(() => {
-          this.$message.error('修改失败')
-          this.isEditEnterpriseManagerLoading = false
-          this.editEnterpriseManagerDialogShow = false
-        })
-      })
+          .catch(() => {
+            this.$message.error("修改失败");
+            this.isEditEnterpriseManagerLoading = false;
+            this.editEnterpriseManagerDialogShow = false;
+          });
+      });
     },
     clicktoEditEnterpriseManager() {
-      this.editEnterpriseManagerFormInfo = { ...this.multipleEnterpriseManagerSelection[0] }
-      this.editEnterpriseManagerDialogShow = true
+      this.editEnterpriseManagerFormInfo = {
+        ...this.multipleEnterpriseManagerSelection[0]
+      };
+      this.editEnterpriseManagerDialogShow = true;
     },
     clicktoDeleteEnterpriseManager() {
       //
-      this.$confirm('此操作将要删除所选用户', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        deleteUsersInfo(this.multipleEnterpriseManagerSelection.map(item => item.id)).then(res => {
-          this.$message({
-            type: 'success',
-            message: '删除成功'
-          })
-          this.initEnterpriseManagerList()
-        }, () => {
-          this.$message.error('删除失败')
-        })
-      }).catch((err) => {
-        console.log(err)
-        this.$message({
-          type: 'info',
-          message: '已取消操作'
-        })
+      this.$confirm("此操作将要删除所选用户", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          deleteUsersInfo(
+            this.multipleEnterpriseManagerSelection.map(item => item.id)
+          ).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+              this.initEnterpriseManagerList();
+            },
+            () => {
+              this.$message.error("删除失败");
+            }
+          );
+        })
+        .catch(err => {
+          console.log(err);
+          this.$message({
+            type: "info",
+            message: "已取消操作"
+          });
+        });
     },
     handleEnterpriseStaffChange(val) {
-      this.multipleEnterpriseStaffSelection = val
-      this.disableEnterpriseStaffEdit = true
-      this.disableEnterpriseStaffDelete = true
+      this.multipleEnterpriseStaffSelection = val;
+      this.disableEnterpriseStaffEdit = true;
+      this.disableEnterpriseStaffDelete = true;
       if (this.multipleEnterpriseStaffSelection.length === 1) {
-        this.disableEnterpriseStaffEdit = false
+        this.disableEnterpriseStaffEdit = false;
       }
       if (this.multipleEnterpriseStaffSelection.length > 0) {
-        this.disableEnterpriseStaffDelete = false
+        this.disableEnterpriseStaffDelete = false;
       }
     },
     handleEnterpriseStaffSizeChange(val) {
-      this.currentEnterStaffPageSize = val
-      this.initEnterpriseStaffList()
+      this.currentEnterStaffPageSize = val;
+      this.initEnterpriseStaffList();
     },
     handleCurrentEnterpriseStaffChange(val) {
-      this.currentEnterStaffPage = val
-      this.initEnterpriseStaffList()
+      this.currentEnterStaffPage = val;
+      this.initEnterpriseStaffList();
     },
     cancelAddEnterpriseStaff() {
-      this.addEnterpriseStaffDialogShow = false
+      this.addEnterpriseStaffDialogShow = false;
     },
     submitAddEnterpriseStaff() {
-      this.$refs.addEnterpriseStaffForm.validate((valid) => {
+      this.$refs.addEnterpriseStaffForm.validate(valid => {
         if (valid) {
           // ...
         } else {
           // ...
         }
-      })
+      });
     },
     addEnterpriseStaffDialog() {
       // ...
-      this.enterpriseStaffFormInfo.userName = ''
-      this.enterpriseStaffFormInfo.passWord = ''
-      this.enterpriseStaffFormInfo.nickName = ''
-      this.enterpriseStaffFormInfo.enterpriseName = ''
-      this.enterpriseStaffFormInfo.roles = ''
-      this.enterpriseStaffFormInfo.wechat = ''
-      this.enterpriseStaffFormInfo.phone = ''
-      this.addEnterpriseStaffDialogShow = true
+      this.enterpriseStaffFormInfo.userName = "";
+      this.enterpriseStaffFormInfo.passWord = "";
+      this.enterpriseStaffFormInfo.nickName = "";
+      this.enterpriseStaffFormInfo.enterpriseName = "";
+      this.enterpriseStaffFormInfo.roles = "";
+      this.enterpriseStaffFormInfo.wechat = "";
+      this.enterpriseStaffFormInfo.phone = "";
+      this.addEnterpriseStaffDialogShow = true;
     },
     cancelEditEnterpriseStaff() {
-      this.editEnterpriseStaffDialogShow = false
+      this.editEnterpriseStaffDialogShow = false;
     },
     submitEditEnterpriseStaff() {
-      this.$refs.editEnterpriseStaffForm.validate((valid) => {
+      this.$refs.editEnterpriseStaffForm.validate(valid => {
         if (valid) {
           // valid
         } else {
           // invalid
         }
-      })
+      });
     },
     editEnterpriseStaffDialog() {
-      this.enterpriseStaffFormInfo = { ...this.multipleEnterpriseStaffSelection[0] }
-      this.editEnterpriseStaffDialogShow = true
+      this.enterpriseStaffFormInfo = {
+        ...this.multipleEnterpriseStaffSelection[0]
+      };
+      this.editEnterpriseStaffDialogShow = true;
     },
     deleteEnterpriseStaff() {
       // 删除企业用户
-      this.$confirm('此操作将要删除所选用户', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {}).catch((err) => {
-        console.log(err)
-        this.$message({
-          type: 'info',
-          message: '已取消操作'
-        })
+      this.$confirm("此操作将要删除所选用户", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {})
+        .catch(err => {
+          console.log(err);
+          this.$message({
+            type: "info",
+            message: "已取消操作"
+          });
+        });
     },
     multipleOperatorSelectionChange(val) {
-      this.multipleOperatorSelection = val
-      this.disableOperatorEdit = true
-      this.disableOperatorDelete = true
+      this.multipleOperatorSelection = val;
+      this.disableOperatorEdit = true;
+      this.disableOperatorDelete = true;
       if (this.multipleOperatorSelection.length === 1) {
-        this.disableOperatorEdit = false
+        this.disableOperatorEdit = false;
       }
       if (this.multipleOperatorSelection.length > 0) {
-        this.disableOperatorDelete = false
+        this.disableOperatorDelete = false;
       }
     },
     handleOperatorSizeChange(val) {
-      this.currentOperatorPageSize = val
-      this.initOperatorUserList()
+      this.currentOperatorPageSize = val;
+      this.initOperatorUserList();
     },
     handleCurrentOperatorChange(val) {
-      this.currentOperatorPage = val
-      this.initOperatorUserList()
+      this.currentOperatorPage = val;
+      this.initOperatorUserList();
     },
     normalizer(node) {
-      if (node.children == null || node.children === 'null') {
-        delete node.children
+      if (node.children == null || node.children === "null") {
+        delete node.children;
       }
     },
     // 根据部门id获取部门
     getDeptInfoById(deptId) {
-      let dept = {}
+      let dept = {};
       // 遍历
       function traverse(item) {
         if (item.id === deptId) {
-          dept = item
+          dept = item;
         }
         // 遍历
         if (item.children) {
           for (let i = 0; i < item.children.length; i++) {
-            traverse(item.children[i])
+            traverse(item.children[i]);
           }
         }
       }
       for (let i = 0; i < this.curDepts.length; i++) {
-        traverse(this.curDepts[i])
+        traverse(this.curDepts[i]);
       }
-      return dept
+      return dept;
     },
     clicktoCancelAddOperator() {
-      this.operatorUserDialogShow = false
+      this.operatorUserDialogShow = false;
     },
     clicktoSubmitAddOperator() {
       //
-      this.$refs.operatorForm.validate((valid) => {
+      this.$refs.operatorForm.validate(valid => {
         if (valid) {
           //
-          this.isAddOperatorBtnLoading = true
+          this.isAddOperatorBtnLoading = true;
           // const replaceUser = {}
           // replaceUser.username = this.operatorFormInfo.username
           // replaceUser.password = this.operatorFormInfo.password
@@ -1746,267 +1664,366 @@ export default {
           // replaceUser.phone = this.operatorFormInfo.phone
           // replaceUser.remarks = this.operatorFormInfo.remarks
           // replaceUser.wechat = this.operatorFormInfo.wechat
-          if (this.operatorFormInfo.roles && this.operatorFormInfo.roles.length && this.operatorFormInfo.roles.length > 0) {
-            this.operatorFormInfo.roles = [...this.originRoles.filter(item => item.name === '运营商'), ...this.curRoles.filter(item => this.operatorFormInfo.roles.includes(item.id))]
+          if (
+            this.operatorFormInfo.roles &&
+            this.operatorFormInfo.roles.length &&
+            this.operatorFormInfo.roles.length > 0
+          ) {
+            this.operatorFormInfo.roles = [
+              ...this.originRoles.filter(item => item.name === "运营商"),
+              ...this.curRoles.filter(item =>
+                this.operatorFormInfo.roles.includes(item.id)
+              )
+            ];
           } else {
-            this.operatorFormInfo.roles = this.originRoles.filter(item => item.name === '运营商')
+            this.operatorFormInfo.roles = this.originRoles.filter(
+              item => item.name === "运营商"
+            );
           }
           if (this.operatorFormInfo.dept) {
-            this.operatorFormInfo.dept = this.getDeptInfoById(this.operatorFormInfo.dept)
+            this.operatorFormInfo.dept = this.getDeptInfoById(
+              this.operatorFormInfo.dept
+            );
           }
-          this.operatorFormInfo.enabled = 1
-          addUserInfo(this.operatorFormInfo).then(res => {
-            console.log(res, 'addUserInfo by operator')
-            this.$message({
-              type: 'success',
-              message: '添加运营商成功'
+          this.operatorFormInfo.enabled = 1;
+          addUserInfo(this.operatorFormInfo)
+            .then(res => {
+              console.log(res, "addUserInfo by operator");
+              this.$message({
+                type: "success",
+                message: "添加运营商成功"
+              });
+              this.initOperatorUserList();
+              this.isAddOperatorBtnLoading = false;
+              this.operatorUserDialogShow = false;
             })
-            this.initOperatorUserList()
-            this.isAddOperatorBtnLoading = false
-            this.operatorUserDialogShow = false
-          }).catch(() => {
-            this.$message.error('添加运营商失败')
-            this.isAddOperatorBtnLoading = false
-            this.operatorUserDialogShow = false
-          })
+            .catch(() => {
+              this.$message.error("添加运营商失败");
+              this.isAddOperatorBtnLoading = false;
+              this.operatorUserDialogShow = false;
+            });
         }
-      })
+      });
     },
     cancalEditOperator() {
-      this.editOperatorUserDialogShow = false
+      this.editOperatorUserDialogShow = false;
     },
     submitEditOperator() {
       //
-      this.$refs.editOperatorForm.validate((valid) => {
+      this.$refs.editOperatorForm.validate(valid => {
         //
         if (valid) {
           //
-          if (this.editOperatorFormInfo.roles && this.editOperatorFormInfo.roles.length && this.editOperatorFormInfo.roles.length > 0) {
-            this.editOperatorFormInfo.roles = [...this.originRoles.filter(item => item.name === '运营商'), ...this.curRoles.filter(item => this.editOperatorFormInfo.roles.includes(item.id))]
+          if (
+            this.editOperatorFormInfo.roles &&
+            this.editOperatorFormInfo.roles.length &&
+            this.editOperatorFormInfo.roles.length > 0
+          ) {
+            this.editOperatorFormInfo.roles = [
+              ...this.originRoles.filter(item => item.name === "运营商"),
+              ...this.curRoles.filter(item =>
+                this.editOperatorFormInfo.roles.includes(item.id)
+              )
+            ];
           } else {
-            this.editOperatorFormInfo.roles = this.originRoles.filter(item => item.name === '运营商')
+            this.editOperatorFormInfo.roles = this.originRoles.filter(
+              item => item.name === "运营商"
+            );
           }
           if (this.editOperatorFormInfo.dept) {
-            this.editOperatorFormInfo.dept = this.getDeptInfoById(this.editOperatorFormInfo.dept)
+            this.editOperatorFormInfo.dept = this.getDeptInfoById(
+              this.editOperatorFormInfo.dept
+            );
           }
-          editUserInfo(this.editOperatorFormInfo).then(res => {
-            this.$message({
-              type: 'success',
-              message: '添加成功'
+          editUserInfo(this.editOperatorFormInfo)
+            .then(res => {
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.isEditOperatorBtnLoading = false;
+              this.editOperatorUserDialogShow = false;
+              this.initOperatorUserList();
             })
-            this.isEditOperatorBtnLoading = false
-            this.editOperatorUserDialogShow = false
-            this.initOperatorUserList()
-          }).catch(() => {
-            this.$message.error('添加失败')
-            this.isEditOperatorBtnLoading = false
-          })
+            .catch(() => {
+              this.$message.error("添加失败");
+              this.isEditOperatorBtnLoading = false;
+            });
         }
-      })
+      });
     },
     addOperatorShow() {
       this.operatorFormInfo = {
         // 用户名
-        username: '',
+        username: "",
         // 密码
-        password: '',
+        password: "",
         // 人员姓名
-        nickName: '',
+        nickName: "",
         // 所属角色
-        roles: '',
+        roles: "",
         // 部门
         dept: null,
         // 所属分组
         groupId: null,
         // v网号
-        vNetNum: '',
+        vNetNum: "",
         // 手机号
-        phone: '',
+        phone: "",
         // 备注
-        remarks: '',
+        remarks: "",
         // 微信号
-        wechat: ''
-      }
-      this.operatorUserDialogShow = true
+        wechat: ""
+      };
+      this.operatorUserDialogShow = true;
     },
     editOperatorShow() {
-      this.editOperatorFormInfo = { ...this.multipleOperatorSelection[0] }
-      this.editOperatorFormInfo.roles = this.editOperatorFormInfo.roles.filter(item => !(item.name === '政府' || item.name === '运营商' || item.name === '企业管理' || item.name === '企业员工')).map(item => item.id)
+      this.editOperatorFormInfo = { ...this.multipleOperatorSelection[0] };
+      this.editOperatorFormInfo.roles = this.editOperatorFormInfo.roles
+        .filter(
+          item =>
+            !(
+              item.name === "政府" ||
+              item.name === "运营商" ||
+              item.name === "企业管理" ||
+              item.name === "企业员工"
+            )
+        )
+        .map(item => item.id);
       if (this.editOperatorFormInfo.dept) {
-        this.editOperatorFormInfo.dept = this.editOperatorFormInfo.dept.id
+        this.editOperatorFormInfo.dept = this.editOperatorFormInfo.dept.id;
       }
-      this.editOperatorUserDialogShow = true
+      this.editOperatorUserDialogShow = true;
     },
     deleteOperator() {
-      this.$confirm('此操作将要删除所选用户', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        deleteUsersInfo(this.multipleOperatorSelection.map(item => item.id)).then(res => {
-          this.$message({
-            message: '删除成功',
-            type: 'success'
-          })
-          this.initOperatorUserList()
-        }).catch(() => {
-          this.$message.error('删除失败')
-        })
-      }).catch((err) => {
-        console.log(err)
-        this.$message({
-          type: 'info',
-          message: '已取消操作'
-        })
+      this.$confirm("此操作将要删除所选用户", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          deleteUsersInfo(this.multipleOperatorSelection.map(item => item.id))
+            .then(res => {
+              this.$message({
+                message: "删除成功",
+                type: "success"
+              });
+              this.initOperatorUserList();
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(err => {
+          console.log(err);
+          this.$message({
+            type: "info",
+            message: "已取消操作"
+          });
+        });
     },
     async initAllUsers() {
       // getUserByRole(0, 10)
       await getAll().then(res => {
-        this.curRoles = [...res]
-        this.originRoles = [...res]
-        this.curRoles = this.curRoles.filter(item => !(item.name === '政府' || item.name === '企业管理' || item.name === '企业员工' || item.name === '运营商'))
-        console.log(this.curRoles, 'this.curRoles this.curRoles this.curRoles')
+        this.curRoles = [...res];
+        this.originRoles = [...res];
+        this.curRoles = this.curRoles.filter(
+          item =>
+            !(
+              item.name === "政府" ||
+              item.name === "企业管理" ||
+              item.name === "企业员工" ||
+              item.name === "运营商"
+            )
+        );
+        console.log(this.curRoles, "this.curRoles this.curRoles this.curRoles");
         for (let i = 0; i < this.originRoles.length; i++) {
-          if (this.originRoles[i].name === '政府') {
-            this.govRoleId = this.originRoles[i].id
+          if (this.originRoles[i].name === "政府") {
+            this.govRoleId = this.originRoles[i].id;
           }
-          if (this.originRoles[i].name === '运营商') {
-            this.operatorRoleId = this.originRoles[i].id
+          if (this.originRoles[i].name === "运营商") {
+            this.operatorRoleId = this.originRoles[i].id;
           }
-          if (this.originRoles[i].name === '企业管理') {
-            this.enterpriseManagerRoleId = this.originRoles[i].id
+          if (this.originRoles[i].name === "企业管理") {
+            this.enterpriseManagerRoleId = this.originRoles[i].id;
           }
-          if (this.originRoles[i].name === '企业员工') {
-            this.enterpriseStaffRoleId = this.originRoles[i].id
+          if (this.originRoles[i].name === "企业员工") {
+            this.enterpriseStaffRoleId = this.originRoles[i].id;
           }
         }
-      })
+      });
       await getIndustryChargeDept().then(res => {
-        this.chargeDepts = []
+        this.chargeDepts = [];
         res.content.forEach(item => {
           const tempObj = {
             icdId: item.icdId,
             icdName: item.icdName
-          }
-          this.chargeDepts.push(tempObj)
-        })
-      })
+          };
+          this.chargeDepts.push(tempObj);
+        });
+      });
       // getUserByRole(this.currentGovPage - 1, this.currentGovPageSize, this.govRoleId).then(res => {
       //   this.govUsers = res.content
       // })
-      this.initGovUserList()
-      this.initOperatorUserList()
-      this.initEnterpriseManagerList()
-      this.initEnterpriseStaffList()
+      this.initGovUserList();
+      this.initOperatorUserList();
+      this.initEnterpriseManagerList();
+      this.initEnterpriseStaffList();
     },
     initGovUserList() {
-      this.govUsersLoading = true
-      getUserByRole(this.currentGovPage - 1, this.currentGovPageSize, this.govRoleId).then(res => {
-        this.govUsers = res.content
-        this.govUsersLoading = false
-        this.totalGovPageSize = res.totalElements
-      }).catch(() => {
-        this.govUsersLoading = false
-      })
+      this.govUsersLoading = true;
+      getUserByRole(
+        this.currentGovPage - 1,
+        this.currentGovPageSize,
+        this.govRoleId
+      )
+        .then(res => {
+          this.govUsers = res.content;
+          this.govUsersLoading = false;
+          this.totalGovPageSize = res.totalElements;
+        })
+        .catch(() => {
+          this.govUsersLoading = false;
+        });
     },
     initOperatorUserList() {
-      this.OperatorLoading = true
-      getUserByRole(this.currentOperatorPage - 1, this.currentOperatorPageSize, this.operatorRoleId).then(res => {
-        this.OperatorUsers = res.content
-        this.OperatorLoading = false
-        this.totalOperatorPageSize = res.totalElements
-      }).catch(() => {
-        this.OperatorLoading = false
-      })
+      this.OperatorLoading = true;
+      getUserByRole(
+        this.currentOperatorPage - 1,
+        this.currentOperatorPageSize,
+        this.operatorRoleId
+      )
+        .then(res => {
+          this.OperatorUsers = res.content;
+          this.OperatorLoading = false;
+          this.totalOperatorPageSize = res.totalElements;
+        })
+        .catch(() => {
+          this.OperatorLoading = false;
+        });
     },
     initEnterpriseManagerList() {
-      this.enterpriseManagerLoading = true
-      getUserByRole(this.currentEnterpriseManagerPage - 1, this.currentEnterpriseManagerPageSize, this.enterpriseManagerRoleId, 'verifyStatus,asc').then(res => {
-        this.enterpriseManagerUsers = res.content
-        this.enterpriseManagerLoading = false
-        // res.totalElements
-        //
-        this.totalEnterpriseManagerSize = res.totalElements
-      }).catch(() => {
-        this.enterpriseManagerLoading = false
-      })
+      this.enterpriseManagerLoading = true;
+      getUserByRole(
+        this.currentEnterpriseManagerPage - 1,
+        this.currentEnterpriseManagerPageSize,
+        this.enterpriseManagerRoleId,
+        "verifyStatus,asc"
+      )
+        .then(res => {
+          this.enterpriseManagerUsers = res.content;
+          this.enterpriseManagerLoading = false;
+          // res.totalElements
+          //
+          this.totalEnterpriseManagerSize = res.totalElements;
+        })
+        .catch(() => {
+          this.enterpriseManagerLoading = false;
+        });
     },
     initEnterpriseStaffList() {
-      this.enterpriseStaffLoading = true
-      getUserByRole(this.currentEnterStaffPage - 1, this.currentEnterStaffPageSize, this.enterpriseStaffRoleId).then(res => {
-        this.enterpriseStaffUsers = res.content
-        this.enterpriseStaffLoading = false
-        this.totalEnterStaffPageSize = res.totalElements
-      }).catch(() => {
-        this.enterpriseStaffLoading = false
-      })
+      this.enterpriseStaffLoading = true;
+      getUserByRole(
+        this.currentEnterStaffPage - 1,
+        this.currentEnterStaffPageSize,
+        this.enterpriseStaffRoleId
+      )
+        .then(res => {
+          this.enterpriseStaffUsers = res.content;
+          this.enterpriseStaffLoading = false;
+          this.totalEnterStaffPageSize = res.totalElements;
+        })
+        .catch(() => {
+          this.enterpriseStaffLoading = false;
+        });
     },
     verifyUser(id) {
-      verifyEnterpriseManager(id).then(res => {
-        this.$message({
-          type: 'success',
-          message: '审核成功'
+      verifyEnterpriseManager(id)
+        .then(res => {
+          this.$message({
+            type: "success",
+            message: "审核成功"
+          });
+          this.initEnterpriseManagerList();
         })
-        this.initEnterpriseManagerList()
-      }).catch(() => {
-        this.$message.error('审核失败')
-      })
+        .catch(() => {
+          this.$message.error("审核失败");
+        });
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-  .users-wrapper {
-    padding: 18px;
+.users-wrapper {
+  padding: 10px;
+}
+.uesrs-type-wrapper {
+  border-radius: 5px;
+  padding: 10px;
+  background: #fff;
+  .my-users {
+    background: #eee;
+    padding: 10px;
+    border-radius: 8px;
+    cursor: pointer;
   }
-  .uesrs-type-wrapper {
-    width: 100%;
-    box-shadow: 2px 2px 2px 3px #eee;
-    border-radius: 12px;
-    padding: 18px;
-    .my-users {
-      background: #eee;
-      padding: 10px;
-      border-radius: 8px;
-      cursor: pointer;
-    }
+}
+.users-gov-wrapper {
+  margin-top: 10px;
+  border-radius: 5px;
+  padding: 10px;
+  .gov-tools-wrapper {
+    margin-bottom: 10px;
+    background: #fff;
+    border-radius: 5px;
+    padding: 10px;
   }
-  .users-gov-wrapper {
-    margin-top: 20px;
-    box-shadow: 2px 2px 2px 3px #eee;
-    border-radius: 12px;
-    padding: 8px;
-    .gov-tools-wrapper {
-      margin-bottom: 20px;
-    }
+  .gov-table-wrapper {
+    background: #fff;
+    border-radius: 5px;
+    padding: 10px;
   }
-  .users-enterprise-manager-wrapper {
-    margin-top: 20px;
-    box-shadow: 2px 2px 2px 3px #eee;
-    border-radius: 12px;
-    padding: 8px;
-    .enterprise-Manager-tools-wrapper {
-      margin-bottom: 20px;
-    }
+}
+.users-enterprise-manager-wrapper {
+  margin-top: 10px;
+  border-radius: 5px;
+  padding: 10px;
+  .enterprise-Manager-tools-wrapper {
+    margin-bottom: 10px;
+    border-radius: 5px;
+    padding: 10px;
+    background: #fff;
   }
-  .users-enterprise-staff-wrapper {
-    margin-top: 20px;
-    box-shadow: 2px 2px 2px 3px #eee;
-    border-radius: 12px;
-    padding: 8px;
-    .enterprise-staff-tools-wrapper {
-      margin-bottom: 20px;
-    }
+  .enterprise-Maanger-table-wrapper {
+    border-radius: 5px;
+    padding: 10px;
+    background: #fff;
   }
-  .users-operator-wrapper {
-    margin-top: 20px;
-    box-shadow: 2px 2px 2px 3px #eee;
-    border-radius: 12px;
-    padding: 8px;
-    .operators-tools-wrapper {
-      margin-bottom: 20px;
-    }
+}
+.users-enterprise-staff-wrapper {
+  margin-top: 10px;
+  border-radius: 5px;
+  padding: 10px;
+  background: #fff;
+  .enterprise-staff-tools-wrapper {
+    margin-bottom: 10px;
+  }
+}
+.users-operator-wrapper {
+  margin-top: 10px;
+  border-radius: 5px;
+  padding: 10px;
+  .operators-tools-wrapper {
+    margin-bottom: 10px;
+    border-radius: 5px;
+    padding: 10px;
+    background: #fff;
+  }
+  .operators-table-wrapper {
+    border-radius: 5px;
+    padding: 10px;
+    background: #fff;
   }
+}
 </style>

src/views/teach/addtype.vue

 <template>
   <div class="type-total-wrapper">
     <div class="tools-wrapper">
-      <el-button type="primary" @click="addCourseTypeShow">新增课程分类</el-button>
+      <el-button type="primary" @click="addCourseTypeShow"
+        >新增课程分类</el-button
+      >
     </div>
     <div class="table-total-wrapper">
       <div class="type-title-wrapper">
         <div style="margin-left: 40px;">课程分类名称</div>
         <div style="margin-right:80px;">操作</div>
       </div>
-      <coursetype v-for="item in courseList" :coursetypes="item" :refresh="initCourseType" />
+      <coursetype
+        v-for="item in courseList"
+        :coursetypes="item"
+        :refresh="initCourseType"
+      />
     </div>
-    <el-dialog
-      title="新增课程分类"
-      :visible.sync="addCourseType"
-      width="70%"
-    >
+    <el-dialog title="新增课程分类" :visible.sync="addCourseType" width="70%">
       <el-form
         v-if="addCourseType"
         ref="addform"
@@ -22,22 +24,14 @@
         :rules="rules"
         label-width="120px"
       >
-        <el-form-item
-          prop="name"
-          label="课程分类名称"
-        >
-          <el-input
-            v-model="addCourseFormInfo.name"
-          />
+        <el-form-item prop="name" label="课程分类名称">
+          <el-input v-model="addCourseFormInfo.name" />
         </el-form-item>
-        <el-form-item
-          prop="description"
-          label="课程分类描述"
-        >
+        <el-form-item prop="description" label="课程分类描述">
           <el-input
             v-model="addCourseFormInfo.description"
             type="textarea"
-            :autosize="{ minRows: 2, maxRows: 4}"
+            :autosize="{ minRows: 2, maxRows: 4 }"
           />
         </el-form-item>
       </el-form>
@@ -50,13 +44,13 @@
 </template>
 
 <script>
-import coursetype from '../components/coursetype.vue'
+import coursetype from "../components/coursetype.vue";
 import {
   getOnlineTrainingCategory,
   postOnlineTrainingCategory,
   putOnlineTrainingCategory,
   deleteOnlineTrainingCategory
-} from '@/api/coursecategory.js'
+} from "@/api/coursecategory.js";
 export default {
   components: {
     coursetype
@@ -66,18 +60,18 @@ export default {
       courseList: [
         {
           id: 1,
-          name: 'a',
+          name: "a",
           children: [
             {
               id: 11,
-              name: 'a1',
+              name: "a1",
               children: [],
               isShow: false,
               level: 2
             },
             {
               id: 12,
-              name: 'a2',
+              name: "a2",
               children: [],
               isShow: false,
               level: 2
@@ -88,14 +82,14 @@ export default {
         },
         {
           id: 2,
-          name: 'b',
+          name: "b",
           children: [],
           isShow: false,
           level: 1
         },
         {
           id: 3,
-          name: 'c',
+          name: "c",
           children: [],
           isShow: false,
           level: 1
@@ -103,74 +97,74 @@ export default {
       ],
       addCourseType: false,
       addCourseFormInfo: {
-        name: '',
-        description: ''
+        name: "",
+        description: ""
       },
       rules: {
         name: [
           {
             required: true,
-            message: '请输入课程分类名称',
-            trigger: 'blur'
+            message: "请输入课程分类名称",
+            trigger: "blur"
           }
         ],
         description: [
           {
             required: true,
-            message: '请输入课程分类描述',
-            trigger: 'blur'
+            message: "请输入课程分类描述",
+            trigger: "blur"
           }
         ]
       }
-    }
+    };
   },
   mounted() {
-    this.initCourseType()
+    this.initCourseType();
   },
   methods: {
     async initCourseType() {
       const params = {
         page: 0,
         size: 9999
-      }
+      };
       await getOnlineTrainingCategory(params).then(res => {
         res.content.forEach(item => {
-          item.children = []
-          item.isShow = false
-          item.level = 1
-        })
-        const category = []
+          item.children = [];
+          item.isShow = false;
+          item.level = 1;
+        });
+        const category = [];
         // 给指定父 id 元素添加元素
         function addType(item) {
-          const pid = item.pid
-          const id = item.id
+          const pid = item.pid;
+          const id = item.id;
           // 判断自己是否已经添加过
-          let isAdded = false
+          let isAdded = false;
           function isAddElement(item1) {
             if (item1.id === id) {
-              isAdded = true
+              isAdded = true;
             }
             for (const item2 of item1.children) {
-              isAddElement(item2)
+              isAddElement(item2);
             }
           }
 
           function addElement(item1) {
             if (item1.id === pid) {
-              item1.children.push(item)
-              item.level = item1.level + 1
-              return
+              item1.children.push(item);
+              item.level = item1.level + 1;
+              return;
             }
             for (const item2 of item1.children) {
-              addElement(item2)
+              addElement(item2);
             }
           }
           for (const ele of category) {
-            isAddElement(ele)
+            isAddElement(ele);
           }
           if (isAdded === false) {
             for (const ele of category) {
-              addElement(ele)
+              addElement(ele);
             }
           }
         }
@@ -178,96 +172,96 @@ export default {
           if (!pid) {
             for (let i = 0; i < res.content.length; i++) {
               if (res.content[i].pid) {
-                composeCategory(res.content[i].pid)
-                addType(res.content[i])
+                composeCategory(res.content[i].pid);
+                addType(res.content[i]);
               }
             }
           }
           if (pid) {
             for (let i = 0; i < res.content.length; i++) {
               if (res.content[i].id === pid && res.content[i].pid) {
-                composeCategory(res.content[i].pid)
-                addType(res.content[i])
+                composeCategory(res.content[i].pid);
+                addType(res.content[i]);
                 // res.content[i].level = category[category.length - 1].level + 1
                 // category[category.length - 1].children.push(res.content[i])
               } else if (res.content[i].id === pid && !res.content[i].pid) {
                 if (!category.filter(item => item.id === pid).length) {
-                  category.push(res.content[i])
+                  category.push(res.content[i]);
                 }
               }
             }
           }
         }
-        composeCategory()
+        composeCategory();
         for (let i = 0; i < res.content.length; i++) {
-          const pArray = category.filter(item => item.id === res.content[i].id)
+          const pArray = category.filter(item => item.id === res.content[i].id);
           if (!pArray.length && !res.content[i].pid) {
-            category.push(res.content[i])
+            category.push(res.content[i]);
           }
         }
-        this.courseList = [...category]
-      })
+        this.courseList = [...category];
+      });
     },
     addCourseTypeShow() {
       // addCourseTypeShow
-      this.addCourseType = true
+      this.addCourseType = true;
       this.addCourseFormInfo = {
-        name: '',
-        description: ''
-      }
+        name: "",
+        description: ""
+      };
     },
     submitCourseType() {
-      this.$refs.addform.validate((valid) => {
+      this.$refs.addform.validate(valid => {
         if (valid) {
           //
           const params = {
             name: this.addCourseFormInfo.name,
             description: this.addCourseFormInfo.description
-          }
-          postOnlineTrainingCategory(params).then(res => {
-            console.log('postOnlineTrainingCategory poseOnlineTrainingCategory poseOnlineTrainingCategory')
-            this.$message({
-              type: 'success',
-              message: '添加成功'
+          };
+          postOnlineTrainingCategory(params)
+            .then(res => {
+              console.log(
+                "postOnlineTrainingCategory poseOnlineTrainingCategory poseOnlineTrainingCategory"
+              );
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.addCourseType = false;
             })
-            this.addCourseType = false
-          }).catch(() => {
-            this.$message.error('添加失败')
-          })
+            .catch(() => {
+              this.$message.error("添加失败");
+            });
         }
-      })
+      });
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-  .type-title-wrapper{
-    margin-top: 20px;
-    display: flex;
-    justify-content: space-between;
-    border-bottom: 3px solid #eee;
-    padding-bottom: 18px;
+.type-title-wrapper {
+  margin-top: 20px;
+  display: flex;
+  justify-content: space-between;
+  border-bottom: 3px solid #eee;
+  padding-bottom: 18px;
+}
+.type-total-wrapper {
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+  .tools-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
   }
-  .type-total-wrapper {
-    width: 80%;
-    padding: 30px;
-    border-radius: 30px;
-    box-shadow: 0 0 9px 1px #eee;
-    margin: 30px auto;
-    .tools-wrapper {
-      width: 80%;
-      padding: 20px;
-      border-radius: 20px;
-      box-shadow: 0 0 9px 1px #eee;
-      margin: 20px auto;
-    }
-    .table-total-wrapper {
-      width: 80%;
-      padding: 20px;
-      border-radius: 20px;
-      box-shadow: 0 0 9px 1px #eee;
-      margin: 20px auto;
-    }
+  .table-total-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
   }
+}
 </style>

src/views/teach/cousehour.vue

@@ -2,32 +2,21 @@
   <div class="coursehour-total-wrapper">
     <div class="tools-wrapper">
       <el-button type="primary" @click="addClass">新增课时</el-button>
-      <el-button type="warning" :disabled="isEditable" @click="editClass">编辑课时</el-button>
-      <el-button type="danger" :disabled="isDeleteable" @click="deleteClass">删除课时</el-button>
+      <el-button type="warning" :disabled="isEditable" @click="editClass"
+        >编辑课时</el-button
+      >
+      <el-button type="danger" :disabled="isDeleteable" @click="deleteClass"
+        >删除课时</el-button
+      >
     </div>
     <div class="table-wrapper">
-      <el-table
-        :data="tableData"
-        @selection-change="handleSelectionChange"
-      >
-        <el-table-column
-          type="selection"
-          width="55"
-        />
-        <el-table-column
-          prop="title"
-          label="课时名称"
-        />
-        <el-table-column
-          prop="time"
-          label="课时时长"
-        />
+      <el-table :data="tableData" @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" />
+        <el-table-column prop="title" label="课时名称" />
+        <el-table-column prop="time" label="课时时长" />
       </el-table>
     </div>
-    <el-dialog
-      title="新增课时"
-      :visible.sync="addDialogFormVisible"
-    >
+    <el-dialog title="新增课时" :visible.sync="addDialogFormVisible">
       <el-form
         v-if="addDialogFormVisible"
         ref="addform"
@@ -35,26 +24,25 @@
         label-width="120px"
         :rules="rules"
       >
-        <el-form-item
-          label="课时名称"
-          prop="title"
-        >
+        <el-form-item label="课时名称" prop="title">
           <el-input v-model="formInfo.title" />
         </el-form-item>
-        <el-form-item
-          label="导入视频文件"
-          prop="fileUrl"
-        >
+        <el-form-item label="导入视频文件" prop="fileUrl">
           <div class="import-file-total-wrapper">
             <div class="import-file-wrapper">
               <label style="width: 100%;height: 100%;">
                 导入文件
-                <input ref="importfile" type="file" hidden @change="importFile">
+                <input
+                  ref="importfile"
+                  type="file"
+                  hidden
+                  @change="importFile"
+                />
               </label>
             </div>
-            <div class="import-file-elprogress-wrapper">
-              <el-progress :percentage="importfilePercentage" />
-            </div>
+          </div>
+          <div class="import-file-elprogress-wrapper">
+            <el-progress :percentage="importfilePercentage" />
           </div>
           <div v-if="formInfo.fileUrl">{{ formInfo.fileUrl.name }}</div>
         </el-form-item>
@@ -63,39 +51,40 @@
         <el-button type="primary" @click="submitFileName">提交</el-button>
       </div>
     </el-dialog>
-    <el-dialog
-      title="修改课时"
-      :visible.sync="editDialogFormVisible"
-    >
+    <el-dialog title="修改课时" :visible.sync="editDialogFormVisible">
       <el-form
         ref="editform"
         :model="editFormInfo"
         label-width="120px"
         :rules="editrules"
       >
-        <el-form-item
-          label="课时名称"
-          prop="title"
-        >
+        <el-form-item label="课时名称" prop="title">
           <el-input v-model="editFormInfo.title" />
         </el-form-item>
-        <el-form-item
-          label="导入视频文件"
-          prop="fileUrl"
-        >
+        <el-form-item label="导入视频文件" prop="fileUrl">
           <div class="import-file-total-wrapper">
             <div class="import-file-wrapper">
               <label style="width: 100%;height: 100%;">
                 导入文件
-                <input ref="editImportfile" type="file" hidden @change="editImportFile">
+                <input
+                  ref="editImportfile"
+                  type="file"
+                  hidden
+                  @change="editImportFile"
+                />
               </label>
             </div>
-            <div class="import-file-elprogress-wrapper">
-              <el-progress :percentage="editImportantPercentage" />
-            </div>
           </div>
-          <div v-if="(!editFormInfo.fileUrl && editFormInfo.lessonFilePath)">{{ editFormInfo.lessonFilePath }}</div>
-          <div v-if="( editFormInfo.fileUrl && editFormInfo.lessonFilePath )">{{ editFormInfo.fileUrl.name }}</div>
+
+          <div v-if="!editFormInfo.fileUrl && editFormInfo.lessonFilePath">
+            {{ editFormInfo.lessonFilePath }}
+          </div>
+          <div v-if="editFormInfo.fileUrl && editFormInfo.lessonFilePath">
+            {{ editFormInfo.fileUrl.name }}
+          </div>
+          <div class="import-file-elprogress-wrapper">
+            <el-progress :percentage="editImportantPercentage" />
+          </div>
           <!-- <div v-else-if="(editFormInfo.fileUrl instanceof String)">{{ editFormInfo.fileUrl }}</div> -->
           <!-- <div v-if="editFileName">{{ editFileName }}</div> -->
         </el-form-item>
@@ -104,8 +93,16 @@
         <el-button type="success" @click="editSubmitClass">提交</el-button>
       </div>
     </el-dialog>
-    <video :src="curAddFilePath" style="display:none" @loadeddata="addvideoLoadData" />
-    <video :src="curUpdateFilePath" style="display: none" @loadeddata="editvideoLoadData" />
+    <video
+      :src="curAddFilePath"
+      style="display:none"
+      @loadeddata="addvideoLoadData"
+    />
+    <video
+      :src="curUpdateFilePath"
+      style="display: none"
+      @loadeddata="editvideoLoadData"
+    />
   </div>
 </template>
 
@@ -115,360 +112,413 @@ import {
   createLesson,
   updateLesson,
   findLesson
-} from '@/api/course.js'
+} from "@/api/course.js";
 export default {
   data() {
     return {
       tableData: [
         {
-          title: '2021年全员必看的安全生产警示片',
-          time: '01:06:25'
+          title: "2021年全员必看的安全生产警示片",
+          time: "01:06:25"
         },
         {
-          title: '年度最走心的安全生产微电影《安全是什么》',
-          time: '07:51'
+          title: "年度最走心的安全生产微电影《安全是什么》",
+          time: "07:51"
         },
         {
-          title: '新-安全生产法',
-          time: '0'
+          title: "新-安全生产法",
+          time: "0"
         },
         {
-          title: '应急管理部政策法规司新安全生产法修改权威解读',
-          time: '02:31:12'
+          title: "应急管理部政策法规司新安全生产法修改权威解读",
+          time: "02:31:12"
         }
       ],
       multipleSelection: [],
       addDialogFormVisible: false,
       formInfo: {
-        title: '',
-        fileUrl: '',
-        lessonDuration: ''
+        title: "",
+        fileUrl: "",
+        lessonDuration: ""
       },
-      formLabelWidth: '120px',
-      fileName: '',
+      formLabelWidth: "120px",
+      fileName: "",
       importfilePercentage: 0,
       rules: {
         title: [
           {
             required: true,
-            message: '请输入课时名称',
-            trigger: 'blur'
+            message: "请输入课时名称",
+            trigger: "blur"
           }
         ],
         fileUrl: [
           {
             required: true,
-            message: '请选择课时文件',
-            trigger: 'change'
+            message: "请选择课时文件",
+            trigger: "change"
           }
         ]
       },
       isLoadingAdd: false,
       isLoadingEdit: false,
-      curAddFilePath: '',
-      curUpdateFilePath: '',
+      curAddFilePath: "",
+      curUpdateFilePath: "",
       editDialogFormVisible: false,
       editFormInfo: {
-        title: '',
-        fileUrl: ''
+        title: "",
+        fileUrl: ""
       },
       editrules: {
         title: [
           {
             required: true,
-            message: '请输入课时名称',
-            trigger: 'blur'
+            message: "请输入课时名称",
+            trigger: "blur"
           }
         ]
       },
-      editFileName: '',
+      editFileName: "",
       editImportantPercentage: 0,
       isEditable: true,
       isDeleteable: true,
-      curFilePath: ''
-    }
+      curFilePath: ""
+    };
   },
   mounted() {
     // alert(this.$route.params.name)
-    this.initTableData()
+    this.initTableData();
   },
   methods: {
     async initTableData() {
       const params = {
         pid: this.$route.params.name
-      }
+      };
       await findLesson(params).then(res => {
-        this.tableData = [...res.map(item => {
-          return {
-            title: item.lessonTitle,
-            time: item.lessonDuration,
-            ...item
-          }
-        })]
-      })
+        this.tableData = [
+          ...res.map(item => {
+            return {
+              title: item.lessonTitle,
+              time: item.lessonDuration,
+              ...item
+            };
+          })
+        ];
+      });
     },
     handleSelectionChange(val) {
-      this.multipleSelection = val
-      this.isEditable = true
-      this.isDeleteable = true
+      this.multipleSelection = val;
+      this.isEditable = true;
+      this.isDeleteable = true;
       if (this.multipleSelection.length === 1) {
-        this.isEditable = false
+        this.isEditable = false;
       }
       if (this.multipleSelection.length > 0) {
-        this.isDeleteable = false
+        this.isDeleteable = false;
       }
     },
     addClass() {
       // 新增课程
-      this.addDialogFormVisible = true
-      this.formInfo.title = ''
-      this.formInfo.fileUrl = null
-      this.formInfo.lessonDuration = '00:00:00'
-      this.importfilePercentage = 0
+      this.addDialogFormVisible = true;
+      this.formInfo.title = "";
+      this.formInfo.fileUrl = null;
+      this.formInfo.lessonDuration = "00:00:00";
+      this.importfilePercentage = 0;
     },
     editClass() {
       // 赋值当前
       this.editFormInfo = {
-        fileUrl: '',
+        fileUrl: "",
         title: this.multipleSelection[0].lessonTitle,
         ...this.multipleSelection[0]
-      }
-      this.editDialogFormVisible = true
+      };
+      this.editDialogFormVisible = true;
     },
     deleteClass() {
-      this.$confirm('此操作将永久删除所选课时', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        onlineTraining(this.multipleSelection.map(item => item.id)).then(res => {
-          this.initTableData()
-          this.$message({
-            type: 'success',
-            message: '删除成功'
-          })
-        }).catch(() => {
-          this.$message.error('删除失败')
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
-        })
+      this.$confirm("此操作将永久删除所选课时", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          onlineTraining(this.multipleSelection.map(item => item.id))
+            .then(res => {
+              this.initTableData();
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
     importFile() {
       if (this.$refs.importfile.files.length > 0) {
-        this.formInfo.fileUrl = this.$refs.importfile.files[0]
-        if (this.formInfo.fileUrl.name.endsWith('.mp4')) {
-          this.isLoadingAdd = false
-          this.curAddFilePath = window.URL.createObjectURL(this.formInfo.fileUrl)
-        } else if (this.formInfo.fileUrl.name.endsWith('.pdf')) {
-          this.isLoadingAdd = true
-          this.formInfo.lessonDuration = '00:00:00'
+        this.formInfo.fileUrl = this.$refs.importfile.files[0];
+        if (this.formInfo.fileUrl.name.endsWith(".mp4")) {
+          this.isLoadingAdd = false;
+          this.curAddFilePath = window.URL.createObjectURL(
+            this.formInfo.fileUrl
+          );
+        } else if (this.formInfo.fileUrl.name.endsWith(".pdf")) {
+          this.isLoadingAdd = true;
+          this.formInfo.lessonDuration = "00:00:00";
         }
       } else {
-        this.formInfo.fileUrl = null
+        this.formInfo.fileUrl = null;
       }
     },
     submitFileName() {
       // 判断valid
-      this.$refs.addform.validate((valid) => {
+      this.$refs.addform.validate(valid => {
         if (valid) {
           // ..
-          if (!(this.formInfo.fileUrl.name.endsWith('.mp4') || this.formInfo.fileUrl.name.endsWith('.pdf'))) {
-            this.$message.error('支持mp4、pdf等文件格式')
-            return
+          if (
+            !(
+              this.formInfo.fileUrl.name.endsWith(".mp4") ||
+              this.formInfo.fileUrl.name.endsWith(".pdf")
+            )
+          ) {
+            this.$message.error("支持mp4、pdf等文件格式");
+            return;
           }
           if (this.isLoadingAdd === true) {
-            const formData = new FormData()
+            const formData = new FormData();
             const data = {
               pid: this.$route.params.name,
               lessonTitle: this.formInfo.title,
               lessonFile: this.formInfo.fileUrl,
               lessonDuration: this.formInfo.lessonDuration
-            }
+            };
             for (const key in data) {
-              formData.append(key, data[key])
-            }
-            const updateFunc = (progressEvent) => {
-              this.importfilePercentage = parseInt('' + progressEvent.loaded / progressEvent.total)
+              formData.append(key, data[key]);
             }
-            createLesson(formData, updateFunc).then(res => {
-              console.log(res, 'createLesson createLesson createLesson')
-              this.$message({
-                type: 'success',
-                message: '添加成功'
+            const updateFunc = progressEvent => {
+              console.log(
+                progressEvent,
+                "progressEvent progressEvent updateFunc updateFunc updateFunc"
+              );
+              this.importfilePercentage = parseInt(
+                "" + (progressEvent.loaded / progressEvent.total) * 100
+              );
+              console.log(
+                this.importfilePercentage,
+                "this.importfilePercentage this.importfilePercentage this.importfilePercentage"
+              );
+            };
+            createLesson(formData, updateFunc)
+              .then(res => {
+                console.log(res, "createLesson createLesson createLesson");
+                this.$message({
+                  type: "success",
+                  message: "添加成功"
+                });
+                this.initTableData();
+                this.addDialogFormVisible = false;
               })
-              this.initTableData()
-              this.addDialogFormVisible = false
-            }).catch(() => {
-              this.$message.error('添加失败')
-            })
+              .catch(() => {
+                this.$message.error("添加失败");
+              });
           } else {
-            this.$message.error('视频获取失败')
+            this.$message.error("视频获取失败");
           }
         } else {
           // ..
         }
-      })
+      });
     },
     editImportFile() {
       if (this.$refs.editImportfile.files.length > 0) {
-        console.log(this.$refs.editImportfile.files, 'this.$refs.editImportfile.files')
-        this.editFormInfo.fileUrl = this.$refs.editImportfile.files[0]
-        if (this.editFormInfo.fileUrl.name.endsWith('.mp4')) {
-          this.isLoadingEdit = false
-          this.curUpdateFilePath = window.URL.createObjectURL(this.editFormInfo.fileUrl)
-        } else if (this.editFormInfo.fileUrl.name.endsWith('.pdf')) {
-          this.isLoadingEdit = true
+        console.log(
+          this.$refs.editImportfile.files,
+          "this.$refs.editImportfile.files"
+        );
+        this.editFormInfo.fileUrl = this.$refs.editImportfile.files[0];
+        if (this.editFormInfo.fileUrl.name.endsWith(".mp4")) {
+          this.isLoadingEdit = false;
+          this.curUpdateFilePath = window.URL.createObjectURL(
+            this.editFormInfo.fileUrl
+          );
+        } else if (this.editFormInfo.fileUrl.name.endsWith(".pdf")) {
+          this.isLoadingEdit = true;
         }
       } else {
-        this.editFormInfo.fileUrl = null
+        this.editFormInfo.fileUrl = null;
       }
     },
     editSubmitClass() {
-      this.$refs.editform.validate((valid) => {
+      this.$refs.editform.validate(valid => {
         if (valid) {
           // ..
           if (this.editFormInfo.fileUrl) {
-            if (!(this.editFormInfo.fileUrl.name.endsWith('.mp4') || this.editFormInfo.fileUrl.name.endsWith('.pdf'))) {
-              this.$message.error('支持mp4、pdf等文件格式')
-              return
+            if (
+              !(
+                this.editFormInfo.fileUrl.name.endsWith(".mp4") ||
+                this.editFormInfo.fileUrl.name.endsWith(".pdf")
+              )
+            ) {
+              this.$message.error("支持mp4、pdf等文件格式");
+              return;
             }
             if (this.isLoadingEdit === true) {
-              const formData = new FormData()
+              const formData = new FormData();
               const data = {
                 pid: this.$route.params.name,
                 lessonTitle: this.editFormInfo.title,
                 lessonFile: this.editFormInfo.fileUrl,
                 lessonDuration: this.editFormInfo.lessonDuration,
                 id: this.editFormInfo.id
-              }
+              };
               for (const key in data) {
-                formData.append(key, data[key])
+                formData.append(key, data[key]);
               }
-              const updateFunc = (progressEvent) => {
-                this.editImportantPercentage = parseInt('' + progressEvent.loaded / progressEvent.total)
-              }
-              updateLesson(formData, updateFunc).then(res => {
-                console.log(res, 'createLesson createLesson createLesson')
-                this.$message({
-                  type: 'success',
-                  message: '添加成功'
+              const updateFunc = progressEvent => {
+                this.editImportantPercentage = parseInt(
+                  "" + (progressEvent.loaded / progressEvent.total) * 100
+                );
+                console.log(
+                  this.editImportantPercentage,
+                  progressEvent,
+                  "progressEvent"
+                );
+              };
+              updateLesson(formData, updateFunc)
+                .then(res => {
+                  console.log(res, "createLesson createLesson createLesson");
+                  this.$message({
+                    type: "success",
+                    message: "修改成功"
+                  });
+                  this.initTableData();
+                  this.editDialogFormVisible = false;
                 })
-                this.initTableData()
-                this.editDialogFormVisible = false
-              }).catch(() => {
-                this.$message.error('添加失败')
-              })
+                .catch(() => {
+                  this.$message.error("修改失败");
+                });
             }
           } else {
-            const formData = new FormData()
+            const formData = new FormData();
             const data = {
               pid: this.$route.params.name,
               lessonTitle: this.editFormInfo.title,
               lessonDuration: this.editFormInfo.lessonDuration,
               id: this.editFormInfo.id
-            }
+            };
             for (const key in data) {
-              formData.append(key, data[key])
-            }
-            const updateFunc = (progressEvent) => {
-              this.editImportantPercentage = parseInt('' + progressEvent.loaded / progressEvent.total)
+              formData.append(key, data[key]);
             }
-            updateLesson(formData, updateFunc).then(res => {
-              this.$message({
-                type: 'success',
-                message: '添加成功'
+            const updateFunc = progressEvent => {
+              this.editImportantPercentage = parseInt(
+                "" + (progressEvent.loaded / progressEvent.total) * 100
+              );
+              console.log(
+                this.editImportantPercentage,
+                progressEvent,
+                "progressEvent"
+              );
+            };
+            updateLesson(formData, updateFunc)
+              .then(res => {
+                this.$message({
+                  type: "success",
+                  message: "修改成功"
+                });
+                this.initTableData();
+                this.editDialogFormVisible = false;
               })
-              this.initTableData()
-              this.editDialogFormVisible = false
-            }).catch(() => {
-              this.$message.error('添加失败')
-            })
+              .catch(() => {
+                this.$message.error("修改失败");
+              });
           }
         } else {
           // ..
         }
-      })
+      });
     },
     addvideoLoadData(event) {
-      const seconds = parseInt('' + event.target.duration)
-      let hour = parseInt('' + seconds / 3600)
-      let minute = parseInt('' + (seconds - hour * 3600) / 60)
-      let second = parseInt('' + (seconds - 3600 * hour - 60 * minute))
+      const seconds = parseInt("" + event.target.duration);
+      let hour = parseInt("" + seconds / 3600);
+      let minute = parseInt("" + (seconds - hour * 3600) / 60);
+      let second = parseInt("" + (seconds - 3600 * hour - 60 * minute));
       if (hour < 10) {
-        hour = '0' + hour
+        hour = "0" + hour;
       }
       if (minute < 10) {
-        minute = '0' + minute
+        minute = "0" + minute;
       }
       if (second < 10) {
-        second = '0' + second
+        second = "0" + second;
       }
-      this.formInfo.lessonDuration = hour + ':' + minute + ':' + second
-      this.isLoadingAdd = true
+      this.formInfo.lessonDuration = hour + ":" + minute + ":" + second;
+      this.isLoadingAdd = true;
     },
     editvideoLoadData(event) {
-      const seconds = parseInt('' + event.target.duration)
-      let hour = parseInt('' + seconds / 3600)
-      let minute = parseInt('' + (seconds - hour * 3600) / 60)
-      let second = parseInt('' + (seconds - 3600 * hour - 60 * minute))
+      const seconds = parseInt("" + event.target.duration);
+      let hour = parseInt("" + seconds / 3600);
+      let minute = parseInt("" + (seconds - hour * 3600) / 60);
+      let second = parseInt("" + (seconds - 3600 * hour - 60 * minute));
       if (hour < 10) {
-        hour = '0' + hour
+        hour = "0" + hour;
       }
       if (minute < 10) {
-        minute = '0' + minute
+        minute = "0" + minute;
       }
       if (second < 10) {
-        second = '0' + second
+        second = "0" + second;
       }
-      this.editFormInfo.lessonDuration = hour + ':' + minute + ':' + second
-      this.isLoadingEdit = true
+      this.editFormInfo.lessonDuration = hour + ":" + minute + ":" + second;
+      this.isLoadingEdit = true;
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-  .coursehour-total-wrapper {
-    width: 80%;
-    padding: 30px;
-    border-radius: 30px;
+.coursehour-total-wrapper {
+  width: 80%;
+  padding: 30px;
+  border-radius: 30px;
+  box-shadow: 0 0 9px 1px #eee;
+  margin: 30px auto;
+  .tools-wrapper {
+    padding: 20px;
+    border-radius: 20px;
+    margin: 20px auto;
     box-shadow: 0 0 9px 1px #eee;
-    margin: 30px auto;
-    .tools-wrapper {
-      padding: 20px;
-      border-radius: 20px;
-      margin: 20px auto;
-      box-shadow: 0 0 9px 1px #eee;
-      width: 80%;
-    }
-    .table-wrapper {
-      width: 80%;
-      padding: 20px;
-      border-radius: 20px;
-      margin: 20px auto;
-      box-shadow: 0 0 9px 1px #eee;
-    }
-  }
-  .import-file-total-wrapper {
-    display: flex;
-    width: 100%;
-    align-items: center;
-  }
-  .import-file-wrapper {
-    /* width: 200px; */
-    flex-basis: 50%;
-    height: 100px;
-    text-align: center;
-    line-height: 100px;
-    color: white;
-    font-size: 20px;
-    background: #A1A1A1;
+    width: 80%;
   }
-  .import-file-elprogress-wrapper {
-    flex-grow: 1;
+  .table-wrapper {
+    width: 80%;
+    padding: 20px;
+    border-radius: 20px;
+    margin: 20px auto;
+    box-shadow: 0 0 9px 1px #eee;
   }
+}
+.import-file-total-wrapper {
+  display: flex;
+  width: 100%;
+  align-items: center;
+}
+.import-file-wrapper {
+  /* width: 200px; */
+  flex-basis: 50%;
+  height: 100px;
+  text-align: center;
+  line-height: 100px;
+  color: white;
+  font-size: 20px;
+  background: #a1a1a1;
+}
+.import-file-elprogress-wrapper {
+  flex-grow: 1;
+}
 </style>

src/views/teach/editcourse.vue

@@ -9,19 +9,18 @@
       <el-form-item label="课程标题" prop="title">
         <el-input v-model="formInfo.title" />
       </el-form-item>
-      <el-form-item
-        label="课程副标题"
-        prop="subTitle"
-      >
+      <el-form-item label="课程副标题" prop="subTitle">
         <el-input v-model="formInfo.subTitle" />
       </el-form-item>
       <el-form-item label="课程类型" prop="type">
-        <treeselect v-model="formInfo.type" :options="typeOptions" style="width: 120px;margin-left: 20px;" />
+        <treeselect
+          v-model="formInfo.type"
+          :options="typeOptions"
+          style="width: 120px;margin-left: 20px;"
+        />
       </el-form-item>
       <el-form-item label="课程状态" prop="state">
-        <el-select
-          v-model="formInfo.state"
-        >
+        <el-select v-model="formInfo.state">
           <el-option
             v-for="item in courseStates"
             :key="item.label"
@@ -35,12 +34,12 @@
           <div class="import-cover-wrapper">
             <label style="width: 100%; height: 100%;">
               导入图片
-              <input ref="importfile" type="file" hidden @change="importFile">
+              <input ref="importfile" type="file" hidden @change="importFile" />
             </label>
           </div>
-          <div class="progress-wrapper">
-            <el-progress :percentage="progressPercent" />
-          </div>
+        </div>
+        <div class="progress-wrapper">
+          <el-progress :percentage="progressPercent" />
         </div>
         <div>{{ formInfo.coverName }}</div>
         <!-- <img v-if="fileUrl" style="width: 400px;" :src="fileUrl" alt="没有导入图片"> -->
@@ -56,16 +55,18 @@
       </el-form-item>
     </el-form>
     <div class="submit-course-wrapper">
-      <el-button size="medium" type="primary" @click="submitEditCourse">提交</el-button>
+      <el-button size="medium" type="primary" @click="submitEditCourse"
+        >提交</el-button
+      >
     </div>
   </div>
 </template>
 
 <script>
-import Treeselect from '@riophae/vue-treeselect'
-import '@riophae/vue-treeselect/dist/vue-treeselect.css'
-import { getOnlineTrainingCategory } from '@/api/coursecategory.js'
-import { updateCourse } from '@/api/course.js'
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import { getOnlineTrainingCategory } from "@/api/coursecategory.js";
+import { updateCourse } from "@/api/course.js";
 export default {
   components: {
     Treeselect
@@ -73,82 +74,79 @@ export default {
   data() {
     return {
       formInfo: {
-        title: '',
-        subTitle: '',
-        type: '1',
-        cover: '',
-        introduce: ''
+        title: "",
+        subTitle: "",
+        type: "1",
+        cover: "",
+        introduce: ""
       },
       rules: {
         title: [
           {
             required: true,
-            message: '请输入标题',
-            trigger: 'blur'
+            message: "请输入标题",
+            trigger: "blur"
           }
         ],
         type: [
           {
             required: true,
-            message: '请输入类型',
-            trigger: 'blur'
+            message: "请输入类型",
+            trigger: "blur"
           }
         ],
         coverName: [
           {
             required: true,
-            message: '请选择封面图片',
-            trigger: 'change'
+            message: "请选择封面图片",
+            trigger: "change"
           }
         ],
         introduce: [
           {
             required: true,
-            message: '请选择课程简介',
-            trigger: 'blur'
+            message: "请选择课程简介",
+            trigger: "blur"
           }
         ],
         state: [
           {
             required: true,
-            message: '请选择课程状态',
-            trigger: 'change'
+            message: "请选择课程状态",
+            trigger: "change"
           }
         ],
         subTitle: [
           {
             required: true,
-            message: '请输入课程副标题',
-            trigger: 'blur'
+            message: "请输入课程副标题",
+            trigger: "blur"
           }
         ]
       },
       progressPercent: 0,
-      typeOptions: [
-      ],
-      fileUrl: '',
+      typeOptions: [],
+      fileUrl: "",
       courseStates: [
         {
-          label: '未发布',
-          value: '未发布'
+          label: "未发布",
+          value: "未发布"
         },
         {
-          label: '已发布',
-          value: '已发布'
+          label: "已发布",
+          value: "已发布"
         },
         {
-          label: '已关闭',
-          value: '已关闭'
+          label: "已关闭",
+          value: "已关闭"
         }
       ]
-    }
+    };
   },
   async mounted() {
     // alert(this.$route.params.name)
     // alert(this.$store.getters.course)
-    console.log(this.$store.getters.course, 'this.$store.getters.course')
-    await this.getCourseCategory()
-    // console.log(), 'this.$store.setCourse this.$store.setCourse')
+    console.log(this.$store.getters.course, "this.$store.getters.course");
     this.formInfo = {
       title: this.$store.getters.course.courseTitle,
       subTitle: this.$store.getters.course.courseSubTitle,
@@ -158,53 +156,58 @@ export default {
       coverName: this.$store.getters.course.courseCoverFilePath,
       introduce: this.$store.getters.course.courseBriefIntroduction,
       ...this.$store.getters.course
-    }
+    };
+    await this.getCourseCategory();
+    // console.log(), 'this.$store.setCourse this.$store.setCourse')
   },
   methods: {
     async getCourseCategory() {
       const params = {
         page: 0,
         size: 99999
-      }
+      };
       await getOnlineTrainingCategory(params).then(res => {
-        console.log(res, 'getOnlineTrainingCategory getOnlineTrainingCategory')
+        console.log(res, "getOnlineTrainingCategory getOnlineTrainingCategory");
         res.content.forEach(item => {
-          item.children = []
-          item.isShow = false
-          item.level = 1
-          item.label = item.name
-        })
-        const category = []
+          item.children = [];
+          item.isShow = false;
+          item.level = 1;
+          item.label = item.name;
+        });
+        this.formInfo.type = res.content.filter(
+          item => item.label === this.$store.getters.course.category
+        )[0].id;
+        const category = [];
         // 给指定父 id 元素添加元素
         function addType(item) {
-          const pid = item.pid
-          const id = item.id
+          const pid = item.pid;
+          const id = item.id;
           // 判断自己是否已经添加过
-          let isAdded = false
+          let isAdded = false;
           function isAddElement(item1) {
             if (item1.id === id) {
-              isAdded = true
+              isAdded = true;
             }
             for (const item2 of item1.children) {
-              isAddElement(item2)
+              isAddElement(item2);
             }
           }
           function addElement(item1) {
             if (item1.id === pid) {
-              item1.children.push(item)
-              item.level = item1.level + 1
-              return
+              item1.children.push(item);
+              item.level = item1.level + 1;
+              return;
             }
             for (const item2 of item1.children) {
-              addElement(item2)
+              addElement(item2);
             }
           }
           for (const ele of category) {
-            isAddElement(ele)
+            isAddElement(ele);
           }
           if (isAdded === false) {
             for (const ele of category) {
-              addElement(ele)
+              addElement(ele);
             }
           }
         }
@@ -212,57 +215,65 @@ export default {
           if (!pid) {
             for (let i = 0; i < res.content.length; i++) {
               if (res.content[i].pid) {
-                composeCategory(res.content[i].pid)
-                addType(res.content[i])
+                composeCategory(res.content[i].pid);
+                addType(res.content[i]);
               }
             }
           }
           if (pid) {
             for (let i = 0; i < res.content.length; i++) {
               if (res.content[i].id === pid && res.content[i].pid) {
-                composeCategory(res.content[i].pid)
-                addType(res.content[i])
+                composeCategory(res.content[i].pid);
+                addType(res.content[i]);
                 // res.content[i].level = category[category.length - 1].level + 1
                 // category[category.length - 1].children.push(res.content[i])
               } else if (res.content[i].id === pid && !res.content[i].pid) {
                 if (!category.filter(item => item.id === pid).length) {
-                  category.push(res.content[i])
+                  category.push(res.content[i]);
                 }
               }
             }
           }
         }
-        composeCategory()
+        composeCategory();
         for (let i = 0; i < res.content.length; i++) {
-          const pArray = category.filter(item => item.id === res.content[i].id)
+          const pArray = category.filter(item => item.id === res.content[i].id);
           if (!pArray.length && !res.content[i].pid) {
-            category.push(res.content[i])
+            category.push(res.content[i]);
           }
         }
-        this.typeOptions = [...category]
-      })
+        this.typeOptions = [...category];
+      });
     },
     importFile() {
       if (this.$refs.importfile.files.length === 0) {
         // this.fileUrl = ''
         if (this.formInfo.cover) {
-          this.formInfo.cover = null
-          this.formInfo.coverName = ''
+          this.formInfo.cover = null;
+          this.formInfo.coverName = "";
         }
       } else {
         // this.fileUrl = URL.createObjectURL(this.$refs.importfile.files[0])
-        console.log(this.formInfo.coverName, 'this.formInfo.coverNamethis.formInfo.coverName')
-        this.formInfo.cover = this.$refs.importfile.files[0]
-        console.log(this.formInfo.cover, 'this.formInfo.cover this.formInfo.cover')
-        this.formInfo.coverName = this.$refs.importfile.files[0].name
+        console.log(
+          this.formInfo.coverName,
+          "this.formInfo.coverNamethis.formInfo.coverName"
+        );
+        this.formInfo.cover = this.$refs.importfile.files[0];
+        console.log(
+          this.formInfo.cover,
+          "this.formInfo.cover this.formInfo.cover"
+        );
+        this.formInfo.coverName = this.$refs.importfile.files[0].name;
       }
     },
     submitEditCourse() {
-      this.$refs.editcourse.validate((valid) => {
+      this.$refs.editcourse.validate(valid => {
         if (valid) {
-          const updateFunc = (progressEvent) => {
-            this.progressPercent = parseInt('' + progressEvent.loaded / progressEvent.total)
-          }
+          const updateFunc = progressEvent => {
+            this.progressPercent = parseInt(
+              "" + progressEvent.loaded / progressEvent.total
+            );
+          };
           const data = {
             categoryId: this.formInfo.type,
             courseBriefIntroduction: this.formInfo.introduce,
@@ -270,62 +281,62 @@ export default {
             courseSubTitle: this.formInfo.subTitle,
             courseTitle: this.formInfo.title,
             id: this.formInfo.id
-          }
-          const formData = new FormData()
+          };
+          const formData = new FormData();
           for (const key in data) {
-            formData.append(key, data[key])
+            formData.append(key, data[key]);
           }
           // if (this.formInfo.coverName && this.formInfo.cover) {
           //   data.courseCoverFile = this.formInfo.cover
           // }
           if (this.formInfo.cover) {
-            formData.append('courseCoverFile', this.formInfo.cover)
+            formData.append("courseCoverFile", this.formInfo.cover);
           }
-          updateCourse(formData, updateFunc).then(res => {
-            console.log(res, 'updateCourse')
-            this.$message({
-              type: 'success',
-              message: '修改成功'
+          updateCourse(formData, updateFunc)
+            .then(res => {
+              console.log(res, "updateCourse");
+              this.$message({
+                type: "success",
+                message: "修改成功"
+              });
             })
-          }).catch(() => {
-            this.$message.error('修改失败')
-          })
+            .catch(() => {
+              this.$message.error("修改失败");
+            });
         }
-      })
+      });
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
-  .edit-course-wrapper {
-    padding: 30px;
-    width: 80%;
-    border-radius: 30px;
-    padding: 0 0 9px 1px #eee;
-    box-shadow: 0 0 9px 1px #eee;
-    margin: 30px auto;
-    .submit-course-wrapper {
-      display: flex;
-      justify-content: flex-end;
-    }
-  }
-  .tool-import-cover-wrapper {
+.edit-course-wrapper {
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+  max-width: 777px;
+  .submit-course-wrapper {
     display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    width: 600px;
-    .import-cover-wrapper {
-      width: 200px;
-      height: 100px;
-      background: #A1A1A1;
-      color: white;
-      font-size: 18px;
-      text-align: center;
-      line-height: 100px;
-    }
-    .progress-wrapper {
-      flex-grow: 1;
-    }
+    justify-content: flex-end;
+  }
+}
+.tool-import-cover-wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  width: 600px;
+  .import-cover-wrapper {
+    width: 200px;
+    height: 100px;
+    background: #a1a1a1;
+    color: white;
+    font-size: 18px;
+    text-align: center;
+    line-height: 100px;
   }
+  .progress-wrapper {
+    flex-grow: 1;
+  }
+}
 </style>

src/views/teach/index.vue

@@ -4,10 +4,27 @@
       <el-button type="primary" @click="addCoure">新增</el-button>
     </div>
     <div class="teach-search-wrapper">
-      <el-input v-model="inputSearchName" style="width: 280px;" placeholder="请输入课程名称" />
-      <treeSelect v-model="inputChosenType" style="width: 260px;margin-left: 20px;" :options="typeOptions" />
-      <el-select v-model="inputChosenState" style="margin-left: 20px;" placeholder="课程状态">
-        <el-option v-for="item in courseStateList" :key="item.value" :label="item.label" :value="item.value" />
+      <el-input
+        v-model="inputSearchName"
+        style="width: 280px;"
+        placeholder="请输入课程名称"
+      />
+      <treeSelect
+        v-model="inputChosenType"
+        style="width: 260px;margin-left: 20px;"
+        :options="typeOptions"
+      />
+      <el-select
+        v-model="inputChosenState"
+        style="margin-left: 20px;"
+        placeholder="课程状态"
+      >
+        <el-option
+          v-for="item in courseStateList"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+        />
       </el-select>
       <el-date-picker
         v-model="inputChosenDate"
@@ -17,58 +34,52 @@
         end-placeholder="结束日期"
         style="margin-left: 20px;"
       />
-      <el-input v-model="inputCreator" style="width: 180px;margin-left: 20px;" placeholder="请输入发布人" />
-      <el-button style="margin-left: 20px;" type="success" @click="getAllCourse">查询</el-button>
+      <el-input
+        v-model="inputCreator"
+        style="width: 180px;margin-left: 20px;"
+        placeholder="请输入发布人"
+      />
+      <el-button style="margin-left: 20px;" type="success" @click="getAllCourse"
+        >查询</el-button
+      >
     </div>
     <div class="table-wraperr">
-      <el-table
-        :data="courseList"
-      >
-        <el-table-column
-          label="课程名称"
-          width="180"
-        >
-          <template
-            slot-scope="scope"
-          >
-            <div style="color: skyblue;cursor: pointer;" @click="jumpToClassHour(scope.row)">{{ scope.row.courseName }}</div>
+      <el-table :data="courseList">
+        <el-table-column label="课程名称" width="180">
+          <template slot-scope="scope">
+            <div
+              style="color: skyblue;cursor: pointer;"
+              @click="jumpToClassHour(scope.row)"
+            >
+              {{ scope.row.courseName }}
+            </div>
           </template>
         </el-table-column>
-        <el-table-column
-          prop="price"
-          label="价格"
-          width="100"
-        />
-        <el-table-column
-          prop="studentSum"
-          label="学生数"
-          width="120"
-        />
-        <el-table-column
-          prop="courseState"
-          label="课程状态"
-          width="180"
-        />
-        <el-table-column
-          label="创建者/时间"
-          width="180"
-        >
+        <el-table-column prop="price" label="价格" width="100" />
+        <el-table-column prop="studentSum" label="学生数" width="120" />
+        <el-table-column prop="courseState" label="课程状态" width="180" />
+        <el-table-column label="创建者/时间" width="180">
           <template slot-scope="scope">
             <div>{{ scope.row.creator }}</div>
             <div>{{ scope.row.createDateTime }}</div>
           </template>
         </el-table-column>
-        <el-table-column
-          label="操作"
-          width="580"
-        >
+        <el-table-column label="操作" width="580">
           <template slot-scope="scope">
             <div class="tool-manage-wrapper">
-              <el-button size="medium" @click="manageCourse(scope.row)">管理</el-button>
+              <el-button size="medium" @click="manageCourse(scope.row)"
+                >管理</el-button
+              >
               <div class="other-manage-wrapper">
-                <el-button size="medium" @click="publicCourse(scope.row)">发布课程</el-button>
-                <el-button size="medium" @click="deleteCourse(scope.row)">删除课程</el-button>
-                <el-button size="medium" @click="closeCourse(scope.row)">关闭课程</el-button>
+                <el-button size="medium" @click="publicCourse(scope.row)"
+                  >发布课程</el-button
+                >
+                <el-button size="medium" @click="deleteCourse(scope.row)"
+                  >删除课程</el-button
+                >
+                <el-button size="medium" @click="closeCourse(scope.row)"
+                  >关闭课程</el-button
+                >
                 <el-button size="medium" @click="manageStu">学生管理</el-button>
               </div>
             </div>
@@ -89,124 +100,123 @@
 </template>
 
 <script>
-import TreeSelect from '@riophae/vue-treeselect'
-import '@riophae/vue-treeselect/dist/vue-treeselect.css'
-import { getOnlineTrainingCategory } from '@/api/coursecategory.js'
-import {
-  findCourse,
-  updateCourse,
-  onlineTraining
-} from '@/api/course.js'
-import { parseTime } from '../../utils'
-import { } from '@/api/course.js'
+import TreeSelect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import { getOnlineTrainingCategory } from "@/api/coursecategory.js";
+import { findCourse, updateCourse, onlineTraining } from "@/api/course.js";
+import { parseTime } from "../../utils";
+import {} from "@/api/course.js";
 export default {
-  name: 'Teach',
+  name: "Teach",
   components: {
     TreeSelect
   },
   data() {
     return {
       // 搜索的名称
-      inputSearchName: '',
+      inputSearchName: "",
       // 选择的分类
-      inputChosenType: '1',
-      typeOptions: [
-      ],
+      inputChosenType: "1",
+      typeOptions: [],
       courseStateList: [
         {
-          label: '未发布',
-          value: '未发布'
+          label: "全选",
+          value: "全选"
         },
         {
-          label: '已发布',
-          value: '已发布'
+          label: "未发布",
+          value: "未发布"
         },
         {
-          label: '已关闭',
-          value: '已关闭'
+          label: "已发布",
+          value: "已发布"
+        },
+        {
+          label: "已关闭",
+          value: "已关闭"
         }
       ],
       // 选择的课程状态
-      inputChosenState: '',
+      inputChosenState: "",
       // 选择的日期
-      inputChosenDate: '',
+      inputChosenDate: "",
       // 创建人
-      inputCreator: '',
+      inputCreator: "",
       // 课程列表
       courseList: [
         {
-          courseName: '大学习、大培训、大考试',
-          price: '8888.00',
+          courseName: "大学习、大培训、大考试",
+          price: "8888.00",
           studentSum: 154,
-          creator: '陈老师',
-          createDateTime: '2021-10-00 14:43:32',
-          courseState: '已发布'
+          creator: "陈老师",
+          createDateTime: "2021-10-00 14:43:32",
+          courseState: "已发布"
         },
         {
-          courseName: '安全管理员【换证】新',
-          price: '300.00',
+          courseName: "安全管理员【换证】新",
+          price: "300.00",
           studentSum: 127,
-          creator: '陈老师',
-          createDateTime: '2021-03-31 14:42:32',
-          courseState: '已发布'
+          creator: "陈老师",
+          createDateTime: "2021-03-31 14:42:32",
+          courseState: "已发布"
         }
       ],
       // 当前页码
       currentPage: 1,
       curPageSize: 10,
       totalElement: 10
-    }
+    };
   },
   async mounted() {
-    await this.getCourseCategory()
-    await this.getAllCourse()
+    await this.getCourseCategory();
+    await this.getAllCourse();
   },
   methods: {
     async getCourseCategory() {
       const params = {
         page: 0,
         size: 99999
-      }
+      };
       await getOnlineTrainingCategory(params).then(res => {
-        console.log(res, 'getOnlineTrainingCategory getOnlineTrainingCategory')
+        console.log(res, "getOnlineTrainingCategory getOnlineTrainingCategory");
         res.content.forEach(item => {
-          item.children = []
-          item.isShow = false
-          item.level = 1
-          item.label = item.name
-        })
-        const category = []
+          item.children = [];
+          item.isShow = false;
+          item.level = 1;
+          item.label = item.name;
+        });
+        const category = [];
         // 给指定父 id 元素添加元素
         function addType(item) {
-          const pid = item.pid
-          const id = item.id
+          const pid = item.pid;
+          const id = item.id;
           // 判断自己是否已经添加过
-          let isAdded = false
+          let isAdded = false;
           function isAddElement(item1) {
             if (item1.id === id) {
-              isAdded = true
+              isAdded = true;
             }
             for (const item2 of item1.children) {
-              isAddElement(item2)
+              isAddElement(item2);
             }
           }
 
           function addElement(item1) {
             if (item1.id === pid) {
-              item1.children.push(item)
-              item.level = item1.level + 1
-              return
+              item1.children.push(item);
+              item.level = item1.level + 1;
+              return;
             }
             for (const item2 of item1.children) {
-              addElement(item2)
+              addElement(item2);
             }
           }
           for (const ele of category) {
-            isAddElement(ele)
+            isAddElement(ele);
           }
           if (isAdded === false) {
             for (const ele of category) {
-              addElement(ele)
+              addElement(ele);
             }
           }
         }
@@ -214,229 +224,263 @@ export default {
           if (!pid) {
             for (let i = 0; i < res.content.length; i++) {
               if (res.content[i].pid) {
-                composeCategory(res.content[i].pid)
-                addType(res.content[i])
+                composeCategory(res.content[i].pid);
+                addType(res.content[i]);
               }
             }
           }
           if (pid) {
             for (let i = 0; i < res.content.length; i++) {
               if (res.content[i].id === pid && res.content[i].pid) {
-                composeCategory(res.content[i].pid)
-                addType(res.content[i])
+                composeCategory(res.content[i].pid);
+                addType(res.content[i]);
                 // res.content[i].level = category[category.length - 1].level + 1
                 // category[category.length - 1].children.push(res.content[i])
               } else if (res.content[i].id === pid && !res.content[i].pid) {
                 if (!category.filter(item => item.id === pid).length) {
-                  category.push(res.content[i])
+                  category.push(res.content[i]);
                 }
               }
             }
           }
         }
-        composeCategory()
+        composeCategory();
         for (let i = 0; i < res.content.length; i++) {
-          const pArray = category.filter(item => item.id === res.content[i].id)
+          const pArray = category.filter(item => item.id === res.content[i].id);
           if (!pArray.length && !res.content[i].pid) {
-            category.push(res.content[i])
+            category.push(res.content[i]);
+          }
+        }
+        function removeChildrenOfNull(arr1) {
+          for (let i = 0; i < arr1.length; i++) {
+            if (arr1[i].children.length === 0) {
+              delete arr1[i].children;
+            } else {
+              removeChildrenOfNull(arr1[i].children);
+            }
           }
         }
-        this.typeOptions = [...category]
+        removeChildrenOfNull(category);
+        this.typeOptions = [...category];
+        this.typeOptions.unshift({
+          createBy: "admin",
+          createTime: "2022-01-20 14:33:57",
+          description: "213",
+          id: -1,
+          isShow: false,
+          label: "全选",
+          level: 1,
+          name: "全选",
+          pid: 6,
+          updateBy: "admin",
+          updateTime: "2022-01-20 14:33:57"
+        });
+        console.log(this.typeOptions, "this.typeOptions this.typeOptions");
+
         if (this.typeOptions.length > 0) {
-          this.inputChosenType = this.typeOptions[0].id
+          this.inputChosenType = this.typeOptions[0].id;
         }
-      })
+      });
     },
     async getAllCourse() {
       const params = {
         page: this.currentPage - 1,
         size: this.curPageSize
-      }
+      };
       if (this.inputSearchName) {
-        params.courseTitle = this.inputSearchName
+        params.courseTitle = this.inputSearchName;
       }
-      if (this.inputChosenType) {
-        params.categoryId = this.inputChosenType
+      if (this.inputChosenType !== -1) {
+        if (this.inputChosenType) {
+          params.categoryId = this.inputChosenType;
+        }
       }
-      if (this.inputChosenState) {
-        params.courseStatus = this.inputChosenState
+      if (this.inputChosenState !== "全选") {
+        if (this.inputChosenState) {
+          params.courseStatus = this.inputChosenState;
+        }
       }
       if (this.inputCreator) {
-        params.courseTeacher = this.inputCreator
+        params.courseTeacher = this.inputCreator;
       }
       if (this.inputChosenDate instanceof Array) {
-        params.courseStartCreateTime = parseTime(this.inputChosenDate[0])
-        params.courseEndCreateTime = parseTime(this.inputChosenDate[1])
+        params.courseStartCreateTime = parseTime(this.inputChosenDate[0]);
+        params.courseEndCreateTime = parseTime(this.inputChosenDate[1]);
       }
       findCourse(params).then(res => {
-        console.log(res, 'findCourse findCourse')
-        this.courseList = [...res.content.map(item => {
-          return {
-            ...item,
-            courseName: item.courseTitle,
-            creator: item.courseTeacher,
-            createDateTime: item.courseCreateTime,
-            courseState: item.courseStatus
-          }
-        })]
-        this.totalElement = res.totalElements
-      })
+        console.log(res, "findCourse findCourse");
+        this.courseList = [
+          ...res.content.map(item => {
+            return {
+              ...item,
+              courseName: item.courseTitle,
+              creator: item.courseTeacher,
+              createDateTime: item.courseCreateTime,
+              courseState: item.courseStatus
+            };
+          })
+        ];
+        this.totalElement = res.totalElements;
+      });
     },
     handleSizeChange(val) {
-      this.curPageSize = val
-      this.getAllCourse()
+      this.curPageSize = val;
+      this.getAllCourse();
     },
     handleCurrentChange(val) {
-      this.currentPage = val
-      this.getAllCourse()
+      this.currentPage = val;
+      this.getAllCourse();
     },
     addCoure() {
       // 新增课程
       // 跳转到新增课程的网页
       this.$router.push({
-        path: '/train/teach/addcourse'
-      })
+        path: "/train/teach/addcourse"
+      });
     },
     manageCourse(row) {
       // 跳转到管理课程页面
-      row.categoryId = this.inputChosenType
-      const newObj = { ...row }
-      console.log(newObj, 'newObj newObj newObj')
-      this.$store.dispatch('setCourse', newObj).then(() => {
+      row.categoryId = this.inputChosenType;
+      const newObj = { ...row };
+      console.log(newObj, "newObj newObj newObj");
+      this.$store.dispatch("setCourse", newObj).then(() => {
         this.$router.push({
-          path: '/train/teach/editcourse/' + row.id
-        })
-      })
+          path: "/train/teach/editcourse/" + row.id
+        });
+      });
     },
     // 删除课程
     deleteCourse(row) {
-      this.$confirm('此操作将永久删除该课程, 是否继续?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        onlineTraining([row.id]).then(res => {
-          this.getAllCourse()
-          this.$message({
-            type: 'success',
-            message: '删除成功'
-          })
-        }).catch(() => {
-          this.$message.error('删除失败')
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
-        })
+      this.$confirm("此操作将永久删除该课程, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          onlineTraining([row.id])
+            .then(res => {
+              this.getAllCourse();
+              this.$message({
+                type: "success",
+                message: "删除成功"
+              });
+            })
+            .catch(() => {
+              this.$message.error("删除失败");
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
     publicCourse(row) {
-      const formData = new FormData()
+      const formData = new FormData();
       const data = {
         categoryId: this.inputChosenType,
         courseBriefIntroduction: row.courseBriefIntroduction,
-        courseStatus: '已发布',
+        courseStatus: "已发布",
         courseSubTitle: row.courseSubTitle,
         courseTitle: row.courseTitle,
         id: row.id
-      }
+      };
       for (const key in data) {
-        formData.append(key, data[key])
+        formData.append(key, data[key]);
       }
-      updateCourse(formData, () => {}).then(res => {
-        this.$message({
-          type: 'success',
-          message: '修改成功'
+      updateCourse(formData, () => {})
+        .then(res => {
+          this.$message({
+            type: "success",
+            message: "修改成功"
+          });
+          this.getAllCourse();
         })
-        this.getAllCourse()
-      }).catch(() => {
-        this.$message.error('修改失败')
-      })
+        .catch(() => {
+          this.$message.error("修改失败");
+        });
     },
     closeCourse(row) {
-      const formData = new FormData()
+      const formData = new FormData();
       const data = {
         categoryId: this.inputChosenType,
         courseBriefIntroduction: row.courseBriefIntroduction,
-        courseStatus: '已关闭',
+        courseStatus: "已关闭",
         courseSubTitle: row.courseSubTitle,
         courseTitle: row.courseTitle,
         id: row.id
-      }
+      };
       for (const key in data) {
-        formData.append(key, data[key])
+        formData.append(key, data[key]);
       }
-      updateCourse(formData, () => {}).then(res => {
-        this.$message({
-          type: 'success',
-          message: '修改成功'
+      updateCourse(formData, () => {})
+        .then(res => {
+          this.$message({
+            type: "success",
+            message: "修改成功"
+          });
+          this.getAllCourse();
         })
-        this.getAllCourse()
-      }).catch(() => {
-        this.$message.error('修改失败')
-      })
+        .catch(() => {
+          this.$message.error("修改失败");
+        });
     },
     jumpToClassHour(row) {
       // row
-      console.log(row.id, 'row.id row.id')
+      console.log(row.id, "row.id row.id");
       this.$router.push({
-        path: '/train/teach/addcoursehour/' + row.id
-      })
+        path: "/train/teach/addcoursehour/" + row.id
+      });
     },
     manageStu() {
       this.$router.push({
-        path: '/train/teach/student/333333333'
-      })
+        path: "/train/teach/student/333333333"
+      });
     }
   }
-}
+};
 </script>
 
 <style lang="scss">
-  .total-wrapper {
-    width: 80%;
-    padding: 30px;
-    border-radius: 30px;
-    box-shadow: 0 0 9px 1px #eee;
-    margin: 30px auto;
-    .teach-tools-add-wrapper {
-      width: 80%;
-      padding: 20px;
-      border-radius: 20px;
-      box-shadow: 0 0 9px 1px #eee;
-      margin: 20px auto;
-    }
-    .teach-search-wrapper {
-      width: 80%;
-      padding: 20px;
-      border-radius: 20px;
-      box-shadow: 0 0 9px 1px #eee;
-      margin: 20px auto;
-    }
-    .table-wraperr {
-      width: 80%;
-      padding: 20px;
-      border-radius: 20px;
-      box-shadow: 0 0 9px 1px #eee;
-      margin: 20px auto;
-    }
+.total-wrapper {
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+  .teach-tools-add-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
   }
   .teach-search-wrapper {
-    margin: 15px 0;
-    display: flex;
-    align-items: center;
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
   }
-  .tool-manage-wrapper {
-    display: flex;
+  .table-wraperr {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
+  }
+}
+.teach-search-wrapper {
+  margin: 15px 0;
+  display: flex;
+  align-items: center;
+}
+.tool-manage-wrapper {
+  display: flex;
+  .other-manage-wrapper {
+    display: none;
+  }
+  &:hover {
     .other-manage-wrapper {
-      display: none;
-    }
-    &:hover {
-      .other-manage-wrapper {
-        margin-left: 20px;
-        display: flex;
-      }
+      margin-left: 20px;
+      display: flex;
     }
   }
+}
 </style>

src/views/trainimage/index.vue

 <template>
   <div class="train-image-wrapper">
     <div class="train-image-tools-wrapper">
-      <el-input v-model="searchEntryName" style="width: 80%;" placeholder="请输入企业名称"></el-input>
-      <el-button type="primary" style="margin-left: 20px;" @click="searchEntry">查找</el-button>
+      <el-input
+        v-model="searchEntryName"
+        style="width: 80%;"
+        placeholder="请输入企业名称"
+      ></el-input>
+      <el-button type="primary" style="margin-left: 20px;" @click="searchEntry"
+        >查找</el-button
+      >
     </div>
     <div class="train-image-list-wrapper">
-      <el-table
-        :data="enterList"
-        border
-        v-loading="isLoadingData"
-      >
+      <el-table :data="enterList" border v-loading="isLoadingData">
         <el-table-column
           prop="name"
           label="企业名称"
           width="480"
         ></el-table-column>
-        <el-table-column
-          label="操作"
-        >
+        <el-table-column label="操作">
           <template slot-scope="scope">
-            <el-button type="text" @click="enterDetail(scope.row)">详情</el-button>
+            <el-button type="text" @click="enterDetail(scope.row)"
+              >详情</el-button
+            >
           </template>
         </el-table-column>
       </el-table>
@@ -37,104 +39,102 @@
 </template>
 
 <script>
-import { searchEnterprise } from '@/api/trainimage.js'
+import { searchEnterprise } from "@/api/trainimage.js";
 export default {
   data() {
     return {
-      searchEntryName: '',
+      searchEntryName: "",
       enterList: [
         {
-          name: '威海晶合数字矿山有限公司',
+          name: "威海晶合数字矿山有限公司",
           id: -1
         },
         {
-          name: '威海港盛船务有限公司',
+          name: "威海港盛船务有限公司",
           id: -1
         },
         {
-          name: '山东港口威海港有限公司',
+          name: "山东港口威海港有限公司",
           id: -1
         },
         {
-          name: '山东威海港国际客运有限公司',
+          name: "山东威海港国际客运有限公司",
           id: -1
         },
         {
-          name: '威海兴茂置业有限公司'
+          name: "威海兴茂置业有限公司"
         }
       ],
       currentPage: 1,
       curPageSize: 10,
       totalSize: 100,
       isLoadingData: false
-    }
+    };
   },
   mounted() {
-    this.initData()
+    this.initData();
   },
   methods: {
     initData() {
-      this.isLoadingData = true
+      this.isLoadingData = true;
       const params = {
         page: this.currentPage - 1,
         size: this.curPageSize
-      }
+      };
       if (this.searchEntryName) {
-        params.name = this.searchEntryName
+        params.name = this.searchEntryName;
       }
-      searchEnterprise(params).then(res => {
-        this.enterList = [...res.content]
-        this.totalSize = res.totalElements
-        this.isLoadingData = false
-      }).catch(() => {
-        this.isLoadingData = false
-      })
+      searchEnterprise(params)
+        .then(res => {
+          this.enterList = [...res.content];
+          this.totalSize = res.totalElements;
+          this.isLoadingData = false;
+        })
+        .catch(() => {
+          this.isLoadingData = false;
+        });
     },
     enterDetail(row) {
-      console.log(row, 'enterDetail enterDetail enterDetail')
-      this.$router.push('/train/trainimage/trainimg/' + row.id)
+      console.log(row, "enterDetail enterDetail enterDetail");
+      this.$router.push("/train/trainimage/trainimg/" + row.id);
     },
     handleSizeChange(val) {
-      this.curPageSize = val
-      this.initData()
+      this.curPageSize = val;
+      this.initData();
     },
     handleCurrentChange(val) {
-      this.currentPage = val
-      this.initData()
+      this.currentPage = val;
+      this.initData();
     },
     searchEntry() {
-      this.initData()
+      this.initData();
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-  .train-image-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    padding: 30px;
-    border-radius: 30px;
-    box-shadow: 0 0 9px 1px #eee;
-    .train-image-tools-wrapper {
-      width: 80%;
-      margin: 30px auto;
-      padding: 20px;
-      border-radius: 20px;
-      box-shadow: 0 0 9px 1px #eee;
-      display: flex;
-      flex-direction: row;
-      justify-content: flex-start;
-    }
-    .train-image-list-wrapper {
-      width: 80%;
-      margin: 30px auto;
-      padding: 20px;
-      border-radius: 20px;
-      box-shadow: 0 0 9px 1px #eee;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-    }
+.train-image-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  .train-image-tools-wrapper {
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    background: #fff;
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
   }
+  .train-image-list-wrapper {
+    margin: 10px 10px;
+    padding: 10px;
+    border-radius: 5px;
+    background: #fff;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+}
 </style>

src/views/trainimage/statistics.vue

@@ -4,10 +4,7 @@
       <div class="trainimg-statistics-tool">
         <div class="trainimg-statistics-tool-title">行业-主管部门</div>
         <div class="trainimg-statistics-tool-content">
-          <el-select
-            v-model="indus_manager"
-            placeholder="请选择行业-主管部门"
-          >
+          <el-select v-model="indus_manager" placeholder="请选择行业-主管部门">
             <el-option
               v-for="item in industries"
               :key="item.name"
@@ -25,7 +22,8 @@
             type="datetimerange"
             range-separator="至"
             start-placeholder="开始日期"
-            end-placeholder="结束日期">
+            end-placeholder="结束日期"
+          >
           </el-date-picker>
         </div>
       </div>
@@ -36,24 +34,21 @@
           <el-radio v-model="train" :label="false">未参加培训</el-radio>
         </div>
       </div>
-      <div style="display: flex;flex-direction: row;justify-content: flex-end;padding: 10px;margin: 20px auto; width: 80%;">
-        <el-button type="primary" @click="findTrainImgStatistics">查找</el-button>
+      <div
+        style="display: flex;flex-direction: row;justify-content: flex-end;padding: 10px;margin: 20px auto; width: 80%;"
+      >
+        <el-button type="primary" @click="findTrainImgStatistics"
+          >查找</el-button
+        >
       </div>
     </div>
     <div class="trainimg-statistics-table-wrapper">
-      <el-table
-        :data="tableData"
-        border
-        v-loading="isLoadingData"
-      >
+      <el-table :data="tableData" border v-loading="isLoadingData">
         <el-table-column
           prop="enterpriseName"
           label="企业名称"
         ></el-table-column>
-        <el-table-column
-          prop="peopleNum"
-          label="参与人数"
-        ></el-table-column>
+        <el-table-column prop="peopleNum" label="参与人数"></el-table-column>
       </el-table>
       <el-pagination
         @size-change="handleSizeChange"
@@ -62,29 +57,43 @@
         :page-sizes="[10, 20, 30, 40]"
         :page-size="curPageSize"
         layout="total, sizes, prev, pager, next, jumper"
-        :total="totalElements">
+        :total="totalElements"
+      >
       </el-pagination>
     </div>
     <div class="trainimg-statistics-census-wrapper">
-      <div class="trainimg-statistics-census-item">参与培训企业总数量： <span class="fontColorStatistics">{{trainEnterpriseNum}}</span></div>
-      <div class="trainimg-statistics-census-item">总参与人次：<span class="fontColorStatistics">{{peopleNum}}</span></div>
-      <div class="trainimg-statistics-census-item">未参与培训的企业数量: <span class="fontColorStatistics">{{notTrainEnterpriseNum}}</span></div>
+      <div class="trainimg-statistics-census-item">
+        参与培训企业总数量：
+        <span class="fontColorStatistics">{{ trainEnterpriseNum }}</span>
+      </div>
+      <div class="trainimg-statistics-census-item">
+        总参与人次：<span class="fontColorStatistics">{{ peopleNum }}</span>
+      </div>
+      <div class="trainimg-statistics-census-item">
+        未参与培训的企业数量:
+        <span class="fontColorStatistics">{{ notTrainEnterpriseNum }}</span>
+      </div>
     </div>
   </div>
 </template>
 
 <script>
-import { trainImageAnalyze1, trainImageAnalyze2, getThIndustryChargeDept, getAllIndustry } from '@/api/trainimage.js'
-import { parseTime } from '@/utils/index.js'
+import {
+  trainImageAnalyze1,
+  trainImageAnalyze2,
+  getThIndustryChargeDept,
+  getAllIndustry
+} from "@/api/trainimage.js";
+import { parseTime } from "@/utils/index.js";
 export default {
   data() {
     return {
-      indus_manager: '',
-      trainDateTime: '',
-      startTime: '',
-      endTime: '',
-      industry: '',
-      manager: '',
+      indus_manager: "",
+      trainDateTime: "",
+      startTime: "",
+      endTime: "",
+      industry: "",
+      manager: "",
       train: false,
       industries: [],
       tableData: [],
@@ -99,43 +108,45 @@ export default {
       trainEnterpriseNum: 0,
       // 是否正在加载表格数据
       isLoadingData: false
-    }
+    };
   },
   mounted() {
     let params = {
       page: 0,
       size: 999
-    }
+    };
     getAllIndustry(params).then(res => {
-      console.log(res, 'getAllIndustry getAllIndustry')
-      this.industries = [...res.content.map(item => {
-        return {
-          name: item.industryName + '-' + item.thIndustryChargeDept.icdName
-        }
-      })]
-    })
+      console.log(res, "getAllIndustry getAllIndustry");
+      this.industries = [
+        ...res.content.map(item => {
+          return {
+            name: item.industryName + "-" + item.thIndustryChargeDept.icdName
+          };
+        })
+      ];
+    });
     trainImageAnalyze2().then(res => {
-      this.notTrainEnterpriseNum = res.notTrainEnterpriseNum
-      this.peopleNum = res.peopleNum? res.peopleNum : 0
-      this.trainEnterpriseNum = res.trainEnterpriseNum
-    })
+      this.notTrainEnterpriseNum = res.notTrainEnterpriseNum;
+      this.peopleNum = res.peopleNum ? res.peopleNum : 0;
+      this.trainEnterpriseNum = res.trainEnterpriseNum;
+    });
     // console.log(this.$refs.statistics, 'this.$refs.statistics')
   },
   methods: {
     handleSizeChange(val) {
-      this.curPageSize = val
+      this.curPageSize = val;
     },
     handleCurrentChange(val) {
-      this.currentPage = val
+      this.currentPage = val;
     },
     findTrainImgStatistics() {
       if (!(this.startTime || this.endTime)) {
-        this.$message.error('请选择日期范围')
-        return
+        this.$message.error("请选择日期范围");
+        return;
       }
       if (!(this.industry || this.manager)) {
-        this.$message.error('请选择行业-主管部门')
-        return
+        this.$message.error("请选择行业-主管部门");
+        return;
       }
       let params = {
         department: this.manager,
@@ -145,16 +156,18 @@ export default {
         size: this.curPageSize,
         startTime: this.startTime,
         train: this.train
-      }
-      this.isLoadingData = true
-      trainImageAnalyze1(params).then(res => {
-        console.log(res ,'trainImageAnalyze1 trainImageAnalyze1')
-        this.totalElements = res.totalElements
-        this.tableData = [...res.content]
-        this.isLoadingData = false
-      }).catch(() => {
-        this.isLoadingData = false
-      })
+      };
+      this.isLoadingData = true;
+      trainImageAnalyze1(params)
+        .then(res => {
+          console.log(res, "trainImageAnalyze1 trainImageAnalyze1");
+          this.totalElements = res.totalElements;
+          this.tableData = [...res.content];
+          this.isLoadingData = false;
+        })
+        .catch(() => {
+          this.isLoadingData = false;
+        });
     }
   },
   watch: {
@@ -163,8 +176,8 @@ export default {
        *  industry: '',
           manager: '',
        */
-      this.industry = newVal.split('-')[0]
-      this.manager = newVal.split('-')[1]
+      this.industry = newVal.split("-")[0];
+      this.manager = newVal.split("-")[1];
     },
     trainDateTime(newVal, oldVal) {
       if (newVal instanceof Array) {
@@ -172,72 +185,65 @@ export default {
          *       startTime: '',
          *       endTime: '',
          */
-        this.startTime =  parseTime(newVal[0])
-        this.endTime = parseTime(newVal[1])
+        this.startTime = parseTime(newVal[0]);
+        this.endTime = parseTime(newVal[1]);
       }
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-  .trainimg-statistics-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    padding: 30px;
-    border-radius: 30px;
-    box-shadow: 0 0 9px 1px #eee;
-  }
-  .trainimg-statistics-tools-wrapper {
-    width: 80%;
-    margin: 30px auto;
-    padding: 20px;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
-    .trainimg-statistics-tool {
-      width: 80%;
-      margin: 20px auto;
-      display: flex;
-      flex-direction: row;
-      justify-content: flex-start;
-      align-items: center;
-      padding: 15px;
-      .trainimg-statistics-tool-title {
-        flex-basis: 30%;
-        flex-grow: 0;
-        flex-shrink: 0;
-        text-align: right;
-        margin-right: 13px;
-      }
-      .trainimg-statistics-tool-content {
-        flex-basis: 70%;
-        flex-grow: 0;
-        flex-shrink: 0;
-      }
-    }
-  }
-  .trainimg-statistics-table-wrapper {
-    width: 80%;
-    padding: 20px;
-    border-radius: 20px;
-    box-shadow: 0 0 9px 1px #eee;
-    margin: 30px auto;
-  }
-  .trainimg-statistics-census-wrapper {
+.trainimg-statistics-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+}
+.trainimg-statistics-tools-wrapper {
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  background: #fff;
+  .trainimg-statistics-tool {
     display: flex;
     flex-direction: row;
     justify-content: flex-start;
     align-items: center;
-    width: 80%;
-    margin: 30px auto;
-    padding: 20px;
-    border-radius: 20px;
-    box-shadow:  0 0 9px 1px #eee;
-    .trainimg-statistics-census-item {
-      flex-basis: 33%;
-      .fontColorStatistics {
-        color: #090d9c;
-      }
+    padding: 15px;
+    .trainimg-statistics-tool-title {
+      flex-basis: 17%;
+      flex-grow: 0;
+      flex-shrink: 0;
+      text-align: right;
+      margin-right: 13px;
+    }
+    .trainimg-statistics-tool-content {
+      flex-basis: 70%;
+      flex-grow: 0;
+      flex-shrink: 0;
     }
   }
+}
+.trainimg-statistics-table-wrapper {
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+  background: #fff;
+}
+.trainimg-statistics-census-wrapper {
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-start;
+  align-items: center;
+  margin: 10px 10px;
+  padding: 10px;
+  border-radius: 5px;
+  background: #fff;
+  .trainimg-statistics-census-item {
+    flex-basis: 33%;
+    .fontColorStatistics {
+      color: #090d9c;
+    }
+  }
+}
 </style>

src/views/trainimage/trainimg.vue

 <template>
   <div class="trainimg-total-wrapper">
-    <el-table
-      :data="trainimgData"
-      border
-      v-loading="isLoadingData"
-    >
+    <el-table :data="trainimgData" border v-loading="isLoadingData">
       <el-table-column
         prop="briefIntroduction"
         label="培训简介"
       ></el-table-column>
-      <el-table-column
-        prop="location"
-        label="培训位置"
-      ></el-table-column>
-      <el-table-column
-        prop="peopleNum"
-        label="培训人数"
-      ></el-table-column>
-      <el-table-column
-        prop="time"
-        label="培训时间"
-      ></el-table-column>
-      <el-table-column
-        prop="beforeImgPath"
-        label="培训前照片"
-      >
+      <el-table-column prop="location" label="培训位置"></el-table-column>
+      <el-table-column prop="peopleNum" label="培训人数"></el-table-column>
+      <el-table-column prop="time" label="培训时间"></el-table-column>
+      <el-table-column prop="beforeImgPath" label="培训前照片">
         <template slot-scope="scope">
-          <el-image 
+          <el-image
             style="width: 70px; height: 70px"
-            :src="scope.row.beforeImgPath" 
-            :preview-src-list="[scope.row.beforeImgPath]">
+            :src="scope.row.beforeImgPath"
+            :preview-src-list="[scope.row.beforeImgPath]"
+          >
           </el-image>
         </template>
       </el-table-column>
-      <el-table-column
-        prop="trainingImgPath"
-        label="培训中照片"
-      >
+      <el-table-column prop="trainingImgPath" label="培训中照片">
         <template slot-scope="scope">
-          <el-image 
+          <el-image
             style="width: 70px; height: 70px"
-            :src="scope.row.trainingImgPath" 
-            :preview-src-list="[scope.row.trainingImgPath]">
+            :src="scope.row.trainingImgPath"
+            :preview-src-list="[scope.row.trainingImgPath]"
+          >
           </el-image>
         </template>
       </el-table-column>
-      <el-table-column
-        prop="afterImgPath"
-        label="培训后照片"
-      >
+      <el-table-column prop="afterImgPath" label="培训后照片">
         <template slot-scope="scope">
-          <el-image 
+          <el-image
             style="width: 70px; height: 70px"
-            :src="scope.row.afterImgPath" 
-            :preview-src-list="[scope.row.afterImgPath]">
+            :src="scope.row.afterImgPath"
+            :preview-src-list="[scope.row.afterImgPath]"
+          >
           </el-image>
         </template>
       </el-table-column>
@@ -65,85 +46,98 @@
       :page-sizes="[10, 20, 30, 40]"
       :page-size="curPageSize"
       layout="total, sizes, prev, pager, next, jumper"
-      :total="totalSize">
+      :total="totalSize"
+    >
     </el-pagination>
   </div>
 </template>
 
 <script>
-import { searchTrainImage } from '@/api/trainimage.js'
+import { searchTrainImage } from "@/api/trainimage.js";
 export default {
   data() {
     return {
-      companyId: '',
+      companyId: "",
       trainimgData: [
         {
-          briefIntroduction: '',
-          location: '',
-          peopleNum: '',
-          time: '',
-          beforeImgPath: '',
-          trainingImgPath: '',
-          afterImgPath: ''
+          briefIntroduction: "",
+          location: "",
+          peopleNum: "",
+          time: "",
+          beforeImgPath: "",
+          trainingImgPath: "",
+          afterImgPath: ""
         }
       ],
       currentPage: 1,
       curPageSize: 10,
       totalSize: 100,
-      isLoadingData: false,
-    }
+      isLoadingData: false
+    };
   },
   mounted() {
-    console.log(this.$route.params.name, 'this.$route.params.name this.$route.params.name')
-    this.companyId = this.$route.params.name
-    this.initData()
+    console.log(
+      this.$route.params.name,
+      "this.$route.params.name this.$route.params.name"
+    );
+    this.companyId = this.$route.params.name;
+    this.initData();
   },
   methods: {
     handleSizeChange(val) {
-      this.curPageSize = val
-      this.initData()
+      this.curPageSize = val;
+      this.initData();
     },
     handleCurrentChange(val) {
-      this.currentPage = val
-      this.initData()
+      this.currentPage = val;
+      this.initData();
     },
     initData() {
-      this.isLoadingData = true
+      this.isLoadingData = true;
       let params = {
         enterpriseId: this.companyId,
         page: this.currentPage - 1,
         size: this.curPageSize,
-        sort: 'time,desc'
-      }
-      searchTrainImage(params).then(res => {
-        console.log(res ,'searchTrainImg searchTrainImg searchTrainImg')
-        this.trainimgData = [...res.content.map(item => {
-          return {
-            briefIntroduction: item.briefIntroduction,
-            location: item.location,
-            peopleNum: item.peopleNum,
-            time: item.time,
-            beforeImgPath: '/train-image/' + item.beforeImgPath.split('\\train-image\\')[1],
-            trainingImgPath: '/train-image/' + item.trainingImgPath.split('\\train-image\\')[1],
-            afterImgPath: '/train-image/' + item.afterImgPath.split('\\train-image\\')[1]
-          }
-        })]
-        this.totalSize = res.totalElements
-        this.isLoadingData = false
-      }).catch(() => {
-        this.isLoadingData = false
-      })
+        sort: "time,desc"
+      };
+      searchTrainImage(params)
+        .then(res => {
+          console.log(res, "searchTrainImg searchTrainImg searchTrainImg");
+          this.trainimgData = [
+            ...res.content.map(item => {
+              return {
+                briefIntroduction: item.briefIntroduction,
+                location: item.location,
+                peopleNum: item.peopleNum,
+                time: item.time,
+                beforeImgPath:
+                  "/train-image/" +
+                  item.beforeImgPath.split("\\train-image\\")[1],
+                trainingImgPath:
+                  "/train-image/" +
+                  item.trainingImgPath.split("\\train-image\\")[1],
+                afterImgPath:
+                  "/train-image/" +
+                  item.afterImgPath.split("\\train-image\\")[1]
+              };
+            })
+          ];
+          this.totalSize = res.totalElements;
+          this.isLoadingData = false;
+        })
+        .catch(() => {
+          this.isLoadingData = false;
+        });
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-  .trainimg-total-wrapper {
-    width: 80%;
-    padding: 30px;
-    border-radius: 30px;
-    margin: 30px auto;
-    box-shadow: 0 0 9px 1px #eee;
-  }
-</style>
+.trainimg-total-wrapper {
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+  background: #fff;
+}
+</style>
\ No newline at end of file

src/views/warn/index.vue

@@ -4,8 +4,18 @@
       <div class="datamanage-wrapper">
         <div class="tool-wrapper">
           <el-button type="primary" @click="addDialogData">新增</el-button>
-          <el-button type="warning" :disabled="isEditable" @click="editDialogData">编辑</el-button>
-          <el-button type="danger" :disabled="isDeleteable" @click="deleteDialogData">删除</el-button>
+          <el-button
+            type="warning"
+            :disabled="isEditable"
+            @click="editDialogData"
+            >编辑</el-button
+          >
+          <el-button
+            type="danger"
+            :disabled="isDeleteable"
+            @click="deleteDialogData"
+            >删除</el-button
+          >
         </div>
         <div class="search-wrapper">
           <!--时间、题目、类别、上传人-->
@@ -16,8 +26,16 @@
             start-placeholder="开始日期"
             end-placeholder="结束日期"
           />
-          <el-input v-model="searchTitle" style="width: 180px;margin-left: 20px;" placeholder="请输入题目" />
-          <el-select v-model="searchType" placeholder="请选择类别" style="margin-left: 20px;">
+          <el-input
+            v-model="searchTitle"
+            style="width: 180px;margin-left: 20px;"
+            placeholder="请输入题目"
+          />
+          <el-select
+            v-model="searchType"
+            placeholder="请选择类别"
+            style="margin-left: 20px;"
+          >
             <el-option
               v-for="item in category"
               :key="item"
@@ -25,8 +43,17 @@
               :value="item"
             />
           </el-select>
-          <el-input v-model="searchPerson" style="width: 180px;margin-left: 20px;" placeholder="请输入上传人" />
-          <el-button type="success" style="margin-left: 20px;" @click="initWarning">查询</el-button>
+          <el-input
+            v-model="searchPerson"
+            style="width: 180px;margin-left: 20px;"
+            placeholder="请输入上传人"
+          />
+          <el-button
+            type="success"
+            style="margin-left: 20px;"
+            @click="initWarning"
+            >查询</el-button
+          >
         </div>
         <div class="table-wrapper">
           <el-table
@@ -35,35 +62,12 @@
             style="width: 100%"
             @selection-change="handleSelectionChange"
           >
-            <el-table-column
-              type="selection"
-              width="55"
-            />
-            <el-table-column
-              prop="type"
-              label="类别"
-              width="180"
-            />
-            <el-table-column
-              prop="title"
-              label="标题"
-              width="180"
-            />
-            <el-table-column
-              prop="introduce"
-              label="简介"
-              width="180"
-            />
-            <el-table-column
-              prop="uploader"
-              label="上传人"
-              width="180"
-            />
-            <el-table-column
-              prop="uploadtime"
-              label="上传时间"
-              width="180"
-            />
+            <el-table-column type="selection" width="55" />
+            <el-table-column prop="type" label="类别" width="180" />
+            <el-table-column prop="title" label="标题" width="180" />
+            <el-table-column prop="introduce" label="简介" width="180" />
+            <el-table-column prop="uploader" label="上传人" width="180" />
+            <el-table-column prop="uploadtime" label="上传时间" width="180" />
           </el-table>
           <el-pagination
             :current-page="currentPage"
@@ -75,21 +79,14 @@
             @current-change="handleCurrentChange"
           />
         </div>
-        <el-dialog
-          title="新增警示教育"
-          :visible.sync="addDialogFormVisible"
-        >
+        <el-dialog title="新增警示教育" :visible.sync="addDialogFormVisible">
           <el-form
             v-if="addDialogFormVisible"
             ref="addDataForm"
             :model="addFormInfo"
             :rules="rules"
           >
-            <el-form-item
-              prop="type"
-              label="类别"
-              :label-width="'120px'"
-            >
+            <el-form-item prop="type" label="类别" :label-width="'120px'">
               <el-select
                 v-model="addFormInfo.type"
                 placeholder="请选择类别"
@@ -104,18 +101,10 @@
                 />
               </el-select>
             </el-form-item>
-            <el-form-item
-              prop="title"
-              label="题目"
-              :label-width="'120px'"
-            >
+            <el-form-item prop="title" label="题目" :label-width="'120px'">
               <el-input v-model="addFormInfo.title" :maxlength="50" />
             </el-form-item>
-            <el-form-item
-              prop="introduce"
-              label="简介"
-              :label-width="'120px'"
-            >
+            <el-form-item prop="introduce" label="简介" :label-width="'120px'">
               <el-input v-model="addFormInfo.introduce" :maxlength="200" />
             </el-form-item>
             <el-form-item
@@ -125,37 +114,36 @@
             >
               <div class="upload-file-wrapper">
                 <div class="file-wrapper">
-                  <label style="width: 100%; height: 100%;display: flex;align-items: center;justify-content: center;">
+                  <label
+                    style="width: 100%; height: 100%;display: flex;align-items: center;justify-content: center;"
+                  >
                     选择要上传的文件
-                    <input ref="addDataFileRef" type="file" hidden @change="chosenAddFile">
+                    <input
+                      ref="addDataFileRef"
+                      type="file"
+                      hidden
+                      @change="chosenAddFile"
+                    />
                   </label>
                   <div>{{ addFormInfo.fileName }}</div>
                 </div>
                 <el-progress :percentage="addFormUploadPercentage" />
               </div>
             </el-form-item>
-
           </el-form>
           <div slot="footer">
             <el-button @click="cancelAddForm">取消</el-button>
             <el-button type="primary" @click="uploadAddForm">上传</el-button>
           </div>
         </el-dialog>
-        <el-dialog
-          title="编辑警示教育"
-          :visible.sync="editDialogFormVisible"
-        >
+        <el-dialog title="编辑警示教育" :visible.sync="editDialogFormVisible">
           <el-form
             v-if="editDialogFormVisible"
             ref="editDataForm"
             :model="editFormInfo"
             :rules="rules"
           >
-            <el-form-item
-              prop="type"
-              label="类别"
-              :label-width="'120px'"
-            >
+            <el-form-item prop="type" label="类别" :label-width="'120px'">
               <el-select
                 v-model="editFormInfo.type"
                 placeholder="请选择类别"
@@ -170,18 +158,10 @@
                 />
               </el-select>
             </el-form-item>
-            <el-form-item
-              prop="title"
-              label="题目"
-              :label-width="'120px'"
-            >
+            <el-form-item prop="title" label="题目" :label-width="'120px'">
               <el-input v-model="editFormInfo.title" :maxlength="50" />
             </el-form-item>
-            <el-form-item
-              prop="introduce"
-              label="简介"
-              :label-width="'120px'"
-            >
+            <el-form-item prop="introduce" label="简介" :label-width="'120px'">
               <el-input v-model="editFormInfo.introduce" :maxlength="200" />
             </el-form-item>
             <el-form-item
@@ -191,9 +171,16 @@
             >
               <div class="upload-file-wrapper">
                 <div class="file-wrapper">
-                  <label style="width: 100%; height: 100%;display: flex;align-items:center;justify-content: center;">
+                  <label
+                    style="width: 100%; height: 100%;display: flex;align-items:center;justify-content: center;"
+                  >
                     选择要上传的文件
-                    <input ref="editDataFileRef" type="file" hidden @change="chosenEditFile">
+                    <input
+                      ref="editDataFileRef"
+                      type="file"
+                      hidden
+                      @change="chosenEditFile"
+                    />
                   </label>
                   <div>{{ editFormInfo.fileName }}</div>
                 </div>
@@ -217,49 +204,27 @@
           start-placeholder="开始日期"
           end-placeholder="结束日期"
         />
-        <el-input v-model="recordSearchUser" placeholder="请输入用户名" style="width: 240px;margin-left: 20px;" />
-        <el-input v-model="recordSearchEnter" placeholder="请输入企业名" style="width: 240px;margin-left: 20px;" />
+        <el-input
+          v-model="recordSearchUser"
+          placeholder="请输入用户名"
+          style="width: 240px;margin-left: 20px;"
+        />
+        <el-input
+          v-model="recordSearchEnter"
+          placeholder="请输入企业名"
+          style="width: 240px;margin-left: 20px;"
+        />
         <el-button type="success" style="margin-left: 20px;">查询</el-button>
         <el-button type="primary" @click="exportFile">导出</el-button>
       </div>
-      <el-table
-        :data="recordList"
-      >
-        <el-table-column
-          prop="userName"
-          label="用户名"
-          width="100"
-        />
-        <el-table-column
-          prop="company"
-          label="所属企业"
-          width="100"
-        />
-        <el-table-column
-          prop="companyCommunity"
-          label="所属区域"
-          width="100"
-        />
-        <el-table-column
-          prop="companyIndus"
-          label="企业所属行业"
-          width="100"
-        />
-        <el-table-column
-          prop="recordTitle"
-          label="标题"
-          width="150"
-        />
-        <el-table-column
-          prop="recordType"
-          label="类别"
-          width="100"
-        />
-        <el-table-column
-          prop="recordTime"
-          label="观看时间"
-          width="100"
-        />
+      <el-table :data="recordList">
+        <el-table-column prop="userName" label="用户名" width="100" />
+        <el-table-column prop="company" label="所属企业" width="100" />
+        <el-table-column prop="companyCommunity" label="所属区域" width="100" />
+        <el-table-column prop="companyIndus" label="企业所属行业" width="100" />
+        <el-table-column prop="recordTitle" label="标题" width="150" />
+        <el-table-column prop="recordType" label="类别" width="100" />
+        <el-table-column prop="recordTime" label="观看时间" width="100" />
       </el-table>
       <el-pagination
         :page-sizes="[10, 20, 30, 40]"
@@ -272,7 +237,6 @@
       />
     </el-tab-pane>
   </el-tabs>
-
 </template>
 
 <script>
@@ -280,9 +244,9 @@ import {
   deleteWarnTeach,
   getWranTeach,
   getWarnTeachCategory
-} from '@/api/warnteach.js'
-import axiosFile from '@/utils/requestfile'
-import { parseTime } from '../../utils'
+} from "@/api/warnteach.js";
+import axiosFile from "@/utils/requestfile";
+import { parseTime } from "../../utils";
 /**
  * axiosFile({
         url: '/api/thRisk/create',
@@ -299,51 +263,49 @@ export default {
   data() {
     return {
       category: [],
-      warnList: [
-      ],
+      warnList: [],
       multipleSelection: [],
-      typeList: [
-      ],
+      typeList: [],
       // 时间 、题目 、 类别、 上传人
-      searchTime: '',
-      searchTitle: '',
-      searchType: '',
-      searchPerson: '',
+      searchTime: "",
+      searchTitle: "",
+      searchType: "",
+      searchPerson: "",
       formInfo: {
-        type: '',
-        title: '',
-        introduce: '',
-        uploader: '',
-        uploadTime: ''
+        type: "",
+        title: "",
+        introduce: "",
+        uploader: "",
+        uploadTime: ""
       },
       isLoadingWarning: false,
       currentPage: 1,
       curPageSize: 10,
       totalColumn: 40,
-      activeName: 'datamanage',
+      activeName: "datamanage",
       isEditable: true,
       isDeleteable: true,
-      recordSearchTime: '',
-      recordSearchUser: '',
-      recordSearchEnter: '',
+      recordSearchTime: "",
+      recordSearchUser: "",
+      recordSearchEnter: "",
       recordList: [
         {
-          userName: '1',
-          company: '2',
-          companyCommunity: '1',
-          companyIndus: '2',
-          recordTitle: '1',
-          recordType: '2',
-          recordTime: '1'
+          userName: "1",
+          company: "2",
+          companyCommunity: "1",
+          companyIndus: "2",
+          recordTitle: "1",
+          recordType: "2",
+          recordTime: "1"
         },
         {
-          userName: '3',
-          company: '4',
-          companyCommunity: '3',
-          companyIndus: '4',
-          recordTitle: '3',
-          recordType: '4',
-          recordTime: '3'
+          userName: "3",
+          company: "4",
+          companyCommunity: "3",
+          companyIndus: "4",
+          recordTitle: "3",
+          recordType: "4",
+          recordTime: "3"
         }
       ],
       curRecordPageSize: 10,
@@ -351,328 +313,355 @@ export default {
       curRecordTotal: 40,
       addDialogFormVisible: false,
       addFormInfo: {
-        type: '', // 类型
-        title: '', // 标题
-        introduce: '', // 简介
-        fileName: '', // 文件名
+        type: "", // 类型
+        title: "", // 标题
+        introduce: "", // 简介
+        fileName: "", // 文件名
         file: null
       },
       rules: {
-        type: [
-          { required: true, message: '请输入类别', trigger: 'blur' }
-        ],
-        title: [
-          { required: true, message: '请输入标题', trigger: 'blur' }
-        ],
-        fileName: [
-          { required: true, message: '请选择文件', trigger: 'change' }
-        ]
+        type: [{ required: true, message: "请输入类别", trigger: "blur" }],
+        title: [{ required: true, message: "请输入标题", trigger: "blur" }],
+        fileName: [{ required: true, message: "请选择文件", trigger: "change" }]
       },
       addFormUploadPercentage: 0,
       editFormUploadPercentage: 0,
       editDialogFormVisible: false,
       editFormInfo: {
-        type: '',
-        title: '',
-        introduce: '',
-        fileName: '',
+        type: "",
+        title: "",
+        introduce: "",
+        fileName: "",
         file: null,
         userId: 1
       }
-    }
+    };
   },
   async mounted() {
     await getWarnTeachCategory().then(res => {
-      this.category = [...res]
-    })
-    await this.initWarning()
+      this.category = [...res];
+    });
+    await this.initWarning();
   },
   methods: {
     async initWarning() {
-      this.isLoadingWarning = true
+      this.isLoadingWarning = true;
       const params = {
         page: this.currentPage - 1,
         size: this.curPageSize
-      }
+      };
       // 类别
       if (this.searchType) {
-        params.category = this.searchType
+        params.category = this.searchType;
       }
       // 题目
       if (this.searchTitle) {
-        params.title = this.searchTitle
+        params.title = this.searchTitle;
       }
       // 时间
       if (this.searchTime instanceof Array) {
-        params.uploadStartTime = parseTime(new Date(this.searchTime[0]))
-        params.uploadEndTime = parseTime(new Date(this.searchTime[1]))
+        params.uploadStartTime = parseTime(new Date(this.searchTime[0]));
+        params.uploadEndTime = parseTime(new Date(this.searchTime[1]));
       }
       // 上传人
       if (this.searchPerson) {
-        params.uploader = this.searchPerson
+        params.uploader = this.searchPerson;
       }
-      await getWranTeach(params).then(res => {
-        this.warnList = [...res.content.map(item => {
-          return {
-            ...item,
-            type: item.category,
-            title: item.title,
-            introduce: item.briefIntroduction,
-            uploader: item.uploader,
-            uploadtime: item.uploadTime
-          }
-        })]
-        this.totalColumn = res.totalElements
-        this.isLoadingWarning = false
-      }, () => {
-        this.isLoadingWarning = false
-      })
+      await getWranTeach(params).then(
+        res => {
+          this.warnList = [
+            ...res.content.map(item => {
+              return {
+                ...item,
+                type: item.category,
+                title: item.title,
+                introduce: item.briefIntroduction,
+                uploader: item.uploader,
+                uploadtime: item.uploadTime
+              };
+            })
+          ];
+          this.totalColumn = res.totalElements;
+          this.isLoadingWarning = false;
+        },
+        () => {
+          this.isLoadingWarning = false;
+        }
+      );
     },
     async initCategory() {
       await getWarnTeachCategory().then(res => {
-        this.category = [...res]
-      })
+        this.category = [...res];
+      });
     },
     handleSizeChange(val) {
       // 每页多少条
-      this.curPageSize = val
-      this.initWarning()
+      this.curPageSize = val;
+      this.initWarning();
     },
     handleCurrentChange(val) {
       // 当前是多少页
-      this.currentPage = val
-      this.initWarning()
+      this.currentPage = val;
+      this.initWarning();
     },
     exportFile() {
       // 导出文件
     },
     handleRecordSizeChange(val) {
-      this.curRecordPageSize = val
+      this.curRecordPageSize = val;
     },
     handleRecordCurrentChange(val) {
-      this.curRecordPage = val
+      this.curRecordPage = val;
     },
     cancelAddForm() {
-      this.addFormInfo.type = ''
-      this.addFormInfo.title = ''
-      this.addFormInfo.introduce = ''
-      this.addFormInfo.fileName = ''
-      this.addFormInfo.file = null
-      this.addFormInfo.userId = ''
-      this.addDialogFormVisible = false
+      this.addFormInfo.type = "";
+      this.addFormInfo.title = "";
+      this.addFormInfo.introduce = "";
+      this.addFormInfo.fileName = "";
+      this.addFormInfo.file = null;
+      this.addFormInfo.userId = "";
+      this.addDialogFormVisible = false;
     },
     uploadAddForm() {
       // formData
       // multipart/formdata
       //
-      this.$refs.addDataForm.validate((valid) => {
+      this.$refs.addDataForm.validate(valid => {
         if (valid) {
-          if (!(this.addFormInfo.file.name.endsWith('.mp4') || this.addFormInfo.file.name.endsWith('.m3u8') || this.addFormInfo.file.name.endsWith('.pdf'))) {
-            this.$message.error('只支持mp4、m3u8、pdf类型的文件')
-            return
+          if (
+            !(
+              this.addFormInfo.file.name.endsWith(".mp4") ||
+              this.addFormInfo.file.name.endsWith(".m3u8") ||
+              this.addFormInfo.file.name.endsWith(".pdf")
+            )
+          ) {
+            this.$message.error("只支持mp4、m3u8、pdf类型的文件");
+            return;
           }
-          const mForm = new FormData()
-          mForm.append('briefIntroduction', this.addFormInfo.introduce)
-          mForm.append('category', this.addFormInfo.type)
-          mForm.append('file', this.addFormInfo.file)
-          mForm.append('title', this.addFormInfo.title)
+          const mForm = new FormData();
+          mForm.append("briefIntroduction", this.addFormInfo.introduce);
+          mForm.append("category", this.addFormInfo.type);
+          mForm.append("file", this.addFormInfo.file);
+          mForm.append("title", this.addFormInfo.title);
           axiosFile({
-            url: '/api/warningEducation',
-            method: 'POST',
+            url: "/api/warningEducation",
+            method: "POST",
             data: mForm,
             onUploadProgress: progressEvent => {
               // progressEvent. loaded
               // progressEvent. total
               // this.curUploadProgress = (())
-              console.log(progressEvent, 'progressEvent, progressEvent, progressEvent')
-              this.addFormUploadPercentage = parseInt('' + progressEvent.loaded / progressEvent.total)
+              console.log(
+                progressEvent,
+                "progressEvent, progressEvent, progressEvent"
+              );
+              this.addFormUploadPercentage = parseInt(
+                "" + progressEvent.loaded / progressEvent.total
+              );
             }
-          }).then(res => {
-            this.addDialogFormVisible = false
-            this.initCategory()
-            this.$message({
-              type: 'success',
-              message: '添加成功'
-            })
-            this.initWarning()
-          }).catch(() => {
-            this.$message.error('添加失败')
           })
+            .then(res => {
+              this.addDialogFormVisible = false;
+              this.initCategory();
+              this.$message({
+                type: "success",
+                message: "添加成功"
+              });
+              this.initWarning();
+            })
+            .catch(() => {
+              this.$message.error("添加失败");
+            });
         }
-      })
+      });
     },
     addDialogData() {
-      this.addFormInfo.type = ''
-      this.addFormInfo.title = ''
-      this.addFormInfo.introduce = ''
-      this.addFormInfo.fileName = ''
-      this.addFormInfo.file = null
-      this.addFormUploadPercentage = 0
+      this.addFormInfo.type = "";
+      this.addFormInfo.title = "";
+      this.addFormInfo.introduce = "";
+      this.addFormInfo.fileName = "";
+      this.addFormInfo.file = null;
+      this.addFormUploadPercentage = 0;
       // 获取用户id
-      this.addFormInfo.userId = 0
-      this.addDialogFormVisible = true
+      this.addFormInfo.userId = 0;
+      this.addDialogFormVisible = true;
     },
     // 编辑对话框
     editDialogData() {
       //
       // editDialog
-      this.editDialogFormVisible = true
-      this.editFormInfo.type = this.multipleSelection[0].type
-      this.editFormInfo.title = this.multipleSelection[0].title
-      this.editFormInfo.introduce = this.multipleSelection[0].introduce
-      this.editFormInfo.fileName = this.multipleSelection[0].filePath
-      this.editFormInfo.id = this.multipleSelection[0].id
+      this.editDialogFormVisible = true;
+      this.editFormInfo.type = this.multipleSelection[0].type;
+      this.editFormInfo.title = this.multipleSelection[0].title;
+      this.editFormInfo.introduce = this.multipleSelection[0].introduce;
+      this.editFormInfo.fileName = this.multipleSelection[0].filePath;
+      this.editFormInfo.id = this.multipleSelection[0].id;
     },
     // 删除对话框
     deleteDialogData() {
-      console.log(this.multipleSelection, 'this.multipleSelection this.multipleSelection this.multipleSelection')
-      this.$confirm('此操作将删除选中项, 是否继续', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        deleteWarnTeach(this.multipleSelection.map(item => item.id)).then(res => {
-          this.$message({
-            type: 'success',
-            message: '删除成功!'
-          })
-          this.initWarning()
-          this.initCategory
-        }, () => {
-          this.$message.error('删除失败!')
-        })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消删除'
-        })
+      console.log(
+        this.multipleSelection,
+        "this.multipleSelection this.multipleSelection this.multipleSelection"
+      );
+      this.$confirm("此操作将删除选中项, 是否继续", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
+        .then(() => {
+          deleteWarnTeach(this.multipleSelection.map(item => item.id)).then(
+            res => {
+              this.$message({
+                type: "success",
+                message: "删除成功!"
+              });
+              this.initWarning();
+              this.initCategory;
+            },
+            () => {
+              this.$message.error("删除失败!");
+            }
+          );
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
     handleSelectionChange(val) {
-      this.multipleSelection = val
-      this.isEditable = true
-      this.isDeleteable = true
+      this.multipleSelection = val;
+      this.isEditable = true;
+      this.isDeleteable = true;
       if (this.multipleSelection.length === 1) {
-        this.isEditable = false
+        this.isEditable = false;
       }
       if (this.multipleSelection.length > 0) {
-        this.isDeleteable = false
+        this.isDeleteable = false;
       }
     },
     addType() {
       // 跳转到新增页面
       this.$router.push({
-        path: 'warn/warntype'
-      })
+        path: "warn/warntype"
+      });
     },
     cancelEditForm() {
-      this.editDialogFormVisible = false
+      this.editDialogFormVisible = false;
     },
     uploadEditForm() {
       // formdata axios
-      this.$refs.editDataForm.validate((valid) => {
+      this.$refs.editDataForm.validate(valid => {
         if (valid) {
-          if (!(this.editFormInfo.fileName.endsWith('.mp4') || this.editFormInfo.fileName.endsWith('.m3u8') || this.editFormInfo.fileName.endsWith('.pdf'))) {
-            this.$message.error('只支持mp4、m3u8、pdf类型的文件')
-            return
+          if (
+            !(
+              this.editFormInfo.fileName.endsWith(".mp4") ||
+              this.editFormInfo.fileName.endsWith(".m3u8") ||
+              this.editFormInfo.fileName.endsWith(".pdf")
+            )
+          ) {
+            this.$message.error("只支持mp4、m3u8、pdf类型的文件");
+            return;
           }
-          const mForm = new FormData()
-          mForm.append('briefIntroduction', this.editFormInfo.introduce)
-          mForm.append('category', this.editFormInfo.type)
-          mForm.append('id', this.editFormInfo.id)
-          mForm.append('title', this.editFormInfo.title)
+          const mForm = new FormData();
+          mForm.append("briefIntroduction", this.editFormInfo.introduce);
+          mForm.append("category", this.editFormInfo.type);
+          mForm.append("id", this.editFormInfo.id);
+          mForm.append("title", this.editFormInfo.title);
           if (this.editFormInfo.fileName && this.editFormInfo.file) {
-            mForm.append('file', this.editFormInfo.file)
+            mForm.append("file", this.editFormInfo.file);
           }
           axiosFile({
-            url: '/api/warningEducation/update',
-            method: 'POST',
+            url: "/api/warningEducation/update",
+            method: "POST",
             data: mForm,
             onUploadProgress: progressEvent => {
-              console.log(progressEvent,)
-              this.editFormUploadPercentage = parseInt('' + progressEvent.loaded / progressEvent.total)
+              console.log(progressEvent);
+              this.editFormUploadPercentage = parseInt(
+                "" + progressEvent.loaded / progressEvent.total
+              );
             }
-          }).then(res => {
-            console.log(res, 'axiosFile axiosFile axiosFile')
-            this.$message({
-              type: 'success',
-              message: '修改成功'
-            })
-            this.editDialogFormVisible = false
-            this.initCategory()
-            this.initWarning()
-          }).catch(() => {
-            this.$message.error('修改失败')
           })
+            .then(res => {
+              console.log(res, "axiosFile axiosFile axiosFile");
+              this.$message({
+                type: "success",
+                message: "修改成功"
+              });
+              this.editDialogFormVisible = false;
+              this.initCategory();
+              this.initWarning();
+            })
+            .catch(() => {
+              this.$message.error("修改失败");
+            });
         }
-      })
+      });
     },
     chosenAddFile() {
-      console.log(this.$refs.addDataFileRef.files, 'this.$refs.addDataFileRef this.$refs.addDataFileRef')
+      console.log(
+        this.$refs.addDataFileRef.files,
+        "this.$refs.addDataFileRef this.$refs.addDataFileRef"
+      );
       // this.$refs.addDataFileRef.files
-      this.addFormInfo.fileName = ''
-      this.addFormInfo.file = null
+      this.addFormInfo.fileName = "";
+      this.addFormInfo.file = null;
       if (this.$refs.addDataFileRef.files.length) {
-        this.addFormInfo.fileName = this.$refs.addDataFileRef.files[0].name
-        this.addFormInfo.file = this.$refs.addDataFileRef.files[0]
+        this.addFormInfo.fileName = this.$refs.addDataFileRef.files[0].name;
+        this.addFormInfo.file = this.$refs.addDataFileRef.files[0];
       }
     },
     chosenEditFile() {
       // this.editFormInfo.fileName = ''
       // this.editFormInfo.file = null
       if (this.$refs.editDataFileRef.files.length > 0) {
-        this.editFormInfo.fileName = this.$refs.editDataFileRef.files[0].name
-        this.editFormInfo.file = this.$refs.editDataFileRef.files[0]
+        this.editFormInfo.fileName = this.$refs.editDataFileRef.files[0].name;
+        this.editFormInfo.file = this.$refs.editDataFileRef.files[0];
       }
     }
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
-  .search-wrapper {
-    display: flex;
-    margin: 20px 0;
+.search-wrapper {
+  display: flex;
+  margin: 20px 0;
+}
+.tools-wrapper {
+  display: flex;
+  margin: 20px 0;
+}
+.upload-file-wrapper {
+  display: flex;
+  .file-wrapper {
+    width: 240px;
+    height: 100px;
+    background: aliceblue;
   }
-  .tools-wrapper {
-    display: flex;
-    margin: 20px 0;
+}
+.datamanage-wrapper {
+  padding: 10px;
+  border-radius: 5px;
+  margin: 10px 10px;
+  .tool-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
   }
-  .upload-file-wrapper {
-    display: flex;
-    .file-wrapper {
-      width: 240px;
-      height: 100px;
-      background: aliceblue;
-    }
+  .search-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
   }
-  .datamanage-wrapper {
-    width: 80%;
-    padding: 30px;
-    border-radius: 30px;
-    box-shadow: 0 0 9px 1px #eee;
-    margin: 30px auto;
-    .tool-wrapper {
-      width: 80%;
-      padding: 20px;
-      border-radius: 20px;
-      box-shadow: 0 0 9px 1px #eee;
-      margin: 20px auto;
-    }
-    .search-wrapper {
-      width: 80%;
-      padding: 20px;
-      border-radius: 20px;
-      box-shadow: 0 0 9px 1px #eee;
-      margin: 20px auto;
-    }
-    .table-wrapper {
-      width: 80%;
-      padding: 20px;
-      border-radius: 20px;
-      box-shadow: 0 0 9px 1px #eee;
-      margin: 20px auto;
-    }
+  .table-wrapper {
+    padding: 10px;
+    border-radius: 5px;
+    margin: 10px 10px;
+    background: #fff;
   }
-
+}
 </style>