From ed3c060124eda08bf9b188128d34fd087097ff04 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=AA=86=E4=B9=90?= <342503599@qq.com>
Date: Fri, 18 Nov 2022 13:54:38 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=20=E9=87=91=E6=9E=97?=
 =?UTF-8?q?=E6=B9=BEbug=EF=BC=88=E5=AE=89=E5=85=A8=E6=95=99=E8=82=B2?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=EF=BC=89=E5=88=86=E7=B1=BB=E5=9B=9E=E6=98=BE?=
 =?UTF-8?q?=E3=80=81=E6=96=B0=E5=A2=9E=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../safetyEducation/addCourse.vue             |  33 +-
 .../safetyEducation/courseManage.vue          | 461 +++++++++++-------
 2 files changed, 305 insertions(+), 189 deletions(-)

diff --git a/src/views/projectFront/safetyEducation/addCourse.vue b/src/views/projectFront/safetyEducation/addCourse.vue
index 3707c0b8..b30f33f5 100644
--- a/src/views/projectFront/safetyEducation/addCourse.vue
+++ b/src/views/projectFront/safetyEducation/addCourse.vue
@@ -30,15 +30,15 @@
           </el-select>
         </el-form-item>
         <!-- 课程分类 -->
-        <el-form-item :label="$t('message.safetyEducation.courseClass')" prop="classifyName">
-          <el-select :disabled="classifyId!=''"
+        <el-form-item :label="$t('message.safetyEducation.courseClass')" prop="classifyId">
+          <el-select :disabled="eduId!=''"
             style="width: 100%"
-            v-model="ruleForm.classifyName"
+            v-model="ruleForm.classifyId"
             :placeholder="$t('message.safetyEducation.pleaseEnter')"
           >
             <el-option
               v-for="item in classifyList"
-              :key="item.id+'classify'"
+              :key="item.id"
               :label="item.classifyName"
               :value="item.id"
             >
@@ -331,8 +331,8 @@ export default {
         questionList: [],
         totalScore: "",
         videoType: 1,
-        classifyId:'',
-        classifyName:""
+        classifyId:"",
+        classifyName:"",
       },
       indexList: [
         "A",
@@ -397,7 +397,7 @@ export default {
           // 请选择课程类型
           { required: true, message: this.$t('message.safetyEducation.rulesA2'), trigger: "change" },
         ],
-        classifyName:[
+        classifyId:[
           // 请选择课程分类
           { required: true, message: this.$t('message.safetyEducation.rulesA3'), trigger: "change" }
         ],
@@ -429,21 +429,29 @@ export default {
   },
   mounted(){
     // console.log(process.env.NODE_ENV)
+    console.log("进入 mounted--1", this.classifyId);
     if(this.classifyId != ''){
+
       this.ruleForm.classifyName= this.$route.query.name
       console.log('=====',this.ruleForm.classifyName)
-      this.ruleForm.classifyId=parseInt(this.classifyId)
+      this.ruleForm.classifyId=this.classifyId
+      console.log("this.ruleForm.classifyId", this.ruleForm.classifyId);
     }
+    console.log("进入 mounted--2", this.classifyId);
     this.styleType = this.$store.state.userInfo.styleType
     console.log(this.styleType)
     if(this.eduId==''){
+      console.log("进入 mounted--3", this.classifyId);
       if(this.$route.path.indexOf('/project/')!=-1){
         this.ruleForm.projectSn=this.$store.state.projectSn
       }else{
         this.ruleForm.projectSn=this.$store.state.userInfo.headquartersSn
       }
-      this.getClassifyList()
+      console.log("进入 mounted--4", this.classifyId);
+    this.getClassifyList()
+
     }else{
+      console.log("进入 mounted--5", this.eduId);
       this.createQRcode('')
       this.getDetailData()
     }
@@ -514,6 +522,12 @@ export default {
       safeEducationQuestionDetailApi({eduId:this.eduId}).then(res=>{
         this.ruleForm=res.result.safeEducation
         this.ruleForm.classifyName = this.$route.query.name
+        console.log('分类详细数据',this.ruleForm.classifyName);
+        console.log('详细数据',this.ruleForm);
+        if(this.ruleForm.projectSn != null) {
+          console.log("getDetailData 调用 getClassifyList -- ",this.ruleForm.projectSn);
+          this.getClassifyList()
+        }
       })
     },
     addOptions() {
@@ -686,6 +700,7 @@ export default {
             type=1
           }
           this.ruleForm.type=type
+          console.log("this.ruleForm",this.ruleForm);
           safeEducationQuestionAddApi(this.ruleForm).then(res=>{
             // 保存成功！
             this.$message.success(this.$t('message.safetyEducation.savedSuccess'))
diff --git a/src/views/projectFront/safetyEducation/courseManage.vue b/src/views/projectFront/safetyEducation/courseManage.vue
index 424f1820..a39a097f 100644
--- a/src/views/projectFront/safetyEducation/courseManage.vue
+++ b/src/views/projectFront/safetyEducation/courseManage.vue
@@ -1,38 +1,75 @@
 <template>
   <div class="fullHeight">
-    
-    <div class="fullHeight" v-if="pageType == 'list'" style="position:relative">
+    <div
+      class="fullHeight"
+      v-if="pageType == 'list'"
+      style="position: relative"
+    >
       <!--courseManagement 课程管理 -->
-      <el-page-header style="margin-bottom:15px" v-if="$route.path.indexOf('/project/')==-1"
+      <el-page-header
+        style="margin-bottom: 15px"
+        v-if="$route.path.indexOf('/project/') == -1"
         @back="goBack2"
-        :content="parentName+' /' + $t('message.safetyEducation.courseManagement') "
+        :content="
+          parentName + ' /' + $t('message.safetyEducation.courseManagement')
+        "
         class="backText"
       ></el-page-header>
-       <!-- <el-tabs v-model="activeName" @tab-click="getList" v-if="$route.path.indexOf('/project/')!=-1">
+      <!-- <el-tabs v-model="activeName" @tab-click="getList" v-if="$route.path.indexOf('/project/')!=-1">
         <el-tab-pane label="企业课程" name="company"></el-tab-pane>
         <el-tab-pane label="项目课程" name="project"></el-tab-pane>
       </el-tabs> -->
-       <!-- v-if="$route.path.indexOf('/project/')==-1" -->
+      <!-- v-if="$route.path.indexOf('/project/')==-1" -->
       <div class="classificationBox" v-else>
-        <span :class="{'active':parentId==''}" @click="parentId='';getList()">
+        <span
+          :class="{ active: parentId == '' }"
+          @click="
+            parentId = '';
+            getList();
+          "
+        >
           <!-- 全部 -->
-          {{ $t('message.safetyEducation.whole') }}
-          </span>
-        <span :class="{'active':parentId==item.id}" v-for="(item,index) in classifyList" :key="index" @click="parentId=item.id;getList()">{{item.classifyName}}
-          <i class="el-icon-error" v-if="activeName=='project'" @click.stop="deleteClassifyFn(item)"></i>
+          {{ $t("message.safetyEducation.whole") }}
         </span>
-        <span class="addTypeBtn" @click="addClassifyFn" v-if="$route.path.indexOf('/project/')==-1||activeName=='project'"> <i class="el-icon-plus"></i>
-        <!-- 新增类型 -->
-        {{ $t('message.safetyEducation.newType') }}
+        <span
+          :class="{ active: parentId == item.id }"
+          v-for="item  in classifyList"
+          :key="item.id"
+          :label="item.classifyName"
+          :value="item.id"
+          @click="
+            parentId = item.id;
+            getList();
+          "
+          >{{ item.classifyName }}
+          <i
+            class="el-icon-error"
+            v-if="activeName == 'project'"
+            @click.stop="deleteClassifyFn(item)"
+          ></i>
+        </span>
+        <span
+          class="addTypeBtn"
+          @click="addClassifyFn"
+          v-if="
+            $route.path.indexOf('/project/') == -1 || activeName == 'project'
+          "
+        >
+          <i class="el-icon-plus"></i>
+          <!-- 新增类型 -->
+          {{ $t("message.safetyEducation.newType") }}
         </span>
       </div>
-      <div v-show="activeName=='project'||$route.path.indexOf('/project/')==-1" style="margin: 10px 15px;position:absolute;right:20px;top:-10px">
-        <el-button type="primary" size="medium" @click="addFn"
-          >
+      <div
+        v-show="
+          activeName == 'project' || $route.path.indexOf('/project/') == -1
+        "
+        style="margin: 10px 15px; position: absolute; right: 20px; top: -10px"
+      >
+        <el-button type="primary" size="medium" @click="addFn">
           <!-- 新增课程 -->
-          {{ $t('message.safetyEducation.newCourses') }}
-          </el-button
-        >
+          {{ $t("message.safetyEducation.newCourses") }}
+        </el-button>
         <el-button type="warning" plain size="medium" @click="refresh">{{
           $t("message.alarmValueSet.refresh")
         }}</el-button>
@@ -54,20 +91,31 @@
                   ></video>
                   <div class="desc">
                     <!-- <span class="time">30分钟</span> -->
-                    <span v-if="item.eduWorkerNum">{{ item.eduWorkerNum }}
-                      {{$t("message.safetyEducation.humanLearning")}}
+                    <span v-if="item.eduWorkerNum"
+                      >{{ item.eduWorkerNum }}
+                      {{ $t("message.safetyEducation.humanLearning") }}
                       <!-- 人学习 -->
-                      </span>
+                    </span>
                   </div>
                   <div class="mask" @click.stop="editBefore(item)">
                     <!-- 进入题库 -->
-                    {{$t("message.safetyEducation.enterQuestionBank")}}
-                    </div>
+                    {{ $t("message.safetyEducation.enterQuestionBank") }}
+                  </div>
                 </div>
-                <div class="title" @click="editBefore(item)">{{ item.eduCourseName }}</div>
-                <div @click.stop="deleteBefore(item)" class="deleteBtn" v-show="activeName=='project'">
-                    <img src="@/assets/images/icon-delete.png" width="15px" height="15px"/>
-                    <!-- <span>{{$t('message.workType.delete')}}</span> -->
+                <div class="title" @click="editBefore(item)">
+                  {{ item.eduCourseName }}
+                </div>
+                <div
+                  @click.stop="deleteBefore(item)"
+                  class="deleteBtn"
+                  v-show="activeName == 'project'"
+                >
+                  <img
+                    src="@/assets/images/icon-delete.png"
+                    width="15px"
+                    height="15px"
+                  />
+                  <!-- <span>{{$t('message.workType.delete')}}</span> -->
                 </div>
               </div>
             </div>
@@ -77,7 +125,7 @@
           <img src="@/assets/images/noData.png" alt="" />
           <p>
             <!-- 暂无课程 -->
-            {{$t("message.safetyEducation.noCourses")}}
+            {{ $t("message.safetyEducation.noCourses") }}
           </p>
         </div>
         <el-pagination
@@ -97,54 +145,84 @@
       <!-- '新增课程' : '课程详细' -->
       <el-page-header
         @back="goBack"
-        :content="(itemId == '' ? $t('message.safetyEducation.newType') : $t('message.safetyEducation.courseDetails'))"
+        :content="
+          itemId == ''
+            ? $t('message.safetyEducation.newType')
+            : $t('message.safetyEducation.courseDetails')
+        "
         class="backText"
       ></el-page-header>
-      <addCourse :eduId="itemId" :classifyId="parentId" @showList="goBack"></addCourse>
+      <addCourse
+        :eduId="itemId"
+        :classifyId="parentId"
+        @showList="goBack"
+      ></addCourse>
     </div>
     <!-- 添加分类 -->
     <el-dialog
-          :modal-append-to-body="false"
-          :title="$t('message.safetyEducation.addCategory')"
-          :visible.sync="dialogVisible"
-          width="667px">
+      :modal-append-to-body="false"
+      :title="$t('message.safetyEducation.addCategory')"
+      :visible.sync="dialogVisible"
+      width="667px"
+    >
       <div class="dialog_content">
-          <el-form label-width="120px" size="medium" class="dialogFormBox" ref="addEditForm" :model="classifyForm">
-            <!-- 分类名称 -->
-              <el-form-item :label="$t('message.safetyEducation.classificationName')" prop="classifyName" :rules="[
-                      { required: true, message: $t('message.safetyEducation.pleaseEnter'), trigger: 'blur' }
-                  ]">
-                  <el-input v-model="classifyForm.classifyName"
-                            :placeholder="$t('message.workType.placeholder')"></el-input>
-              </el-form-item>
-              <div class="dialog-footer">
-                  <el-button
-                          class="cancleBtn"
-                          @click="dialogVisible = false"
-                          icon="el-icon-circle-close"
-                          size="medium"
-                  >{{$t('message.personnelPosition.cancel')}}
-                  </el-button>
-                  <el-button
-                          type="primary"
-                          icon="el-icon-circle-check"
-                          @click="saveClassifyFn"
-                          size="medium"
-                  >{{$t('message.personnelPosition.determine')}}
-                  </el-button>
-              </div>
-          </el-form>
+        <el-form
+          label-width="120px"
+          size="medium"
+          class="dialogFormBox"
+          ref="addEditForm"
+          :model="classifyForm"
+        >
+          <!-- 分类名称 -->
+          <el-form-item
+            :label="$t('message.safetyEducation.classificationName')"
+            prop="classifyName"
+            :rules="[
+              {
+                required: true,
+                message: $t('message.safetyEducation.pleaseEnter'),
+                trigger: 'blur',
+              },
+            ]"
+          >
+            <el-input
+              v-model="classifyForm.classifyName"
+              :placeholder="$t('message.workType.placeholder')"
+            ></el-input>
+          </el-form-item>
+          <div class="dialog-footer">
+            <el-button
+              class="cancleBtn"
+              @click="dialogVisible = false"
+              icon="el-icon-circle-close"
+              size="medium"
+              >{{ $t("message.personnelPosition.cancel") }}
+            </el-button>
+            <el-button
+              type="primary"
+              icon="el-icon-circle-check"
+              @click="saveClassifyFn"
+              size="medium"
+              >{{ $t("message.personnelPosition.determine") }}
+            </el-button>
+          </div>
+        </el-form>
       </div>
-
-  </el-dialog>
+    </el-dialog>
   </div>
 </template>
 <script>
 import {
   safeEducationQuestionListApi,
-  workerSafeEducationDeleteApi,selectCompanyEducationCoursePageApi
+  workerSafeEducationDeleteApi,
+  selectCompanyEducationCoursePageApi,
+} from "@/assets/js/api/laborPerson";
+import {
+  educationClassifyAddApi,
+  educationClassifyEditApi,
+  educationClassifyDeleteApi,
+  educationClassifyListApi,
 } from "@/assets/js/api/laborPerson";
-import {educationClassifyAddApi, educationClassifyEditApi, educationClassifyDeleteApi, educationClassifyListApi} from '@/assets/js/api/laborPerson'
 import addCourse from "./addCourse";
 export default {
   components: { addCourse },
@@ -158,76 +236,83 @@ export default {
         total: 0, //总条数
       },
       itemId: "",
-      parentId:'',
-      parentName:'',
-      activeName:'company',
-      classifyList:[],
-      dialogVisible:false,
-      classifyForm:{
-        classifyName:''
+      parentId: "",
+      parentName: "",
+      activeName: "company",
+      classifyList: [],
+      dialogVisible: false,
+      classifyForm: {
+        classifyName: "",
       },
-      dataSn:''
+      dataSn: "",
     };
   },
   mounted() {
-    if(this.$route.params.type){
-      this.activeName=this.$route.params.type
-    }else{
-      this.parentId=this.$route.query.id
+    if (this.$route.params.type) {
+      this.activeName = this.$route.params.type;
+    } else {
+      this.parentId = this.$route.query.id;
     }
-    if(this.activeName=='company'){
-      this.dataSn=this.$store.state.userInfo.headquartersSn
-    }else{
-      this.dataSn=this.$store.state.projectSn
+    if (this.activeName == "company") {
+      this.dataSn = this.$store.state.userInfo.headquartersSn;
+    } else {
+      this.dataSn = this.$store.state.projectSn;
     }
-    this.parentName=this.$route.query.name
-    this.getClassifyList()
+    this.parentName = this.$route.query.name;
+    this.getClassifyList();
     this.getList();
   },
   watch: {
     $route(to, from) {
-      if(this.$route.params.type){
-        this.activeName=this.$route.params.type
-        if(this.activeName=='company'){
-          this.dataSn=this.$store.state.userInfo.headquartersSn
-        }else{
-          this.dataSn=this.$store.state.projectSn
+      if (this.$route.params.type) {
+        this.activeName = this.$route.params.type;
+        if (this.activeName == "company") {
+          this.dataSn = this.$store.state.userInfo.headquartersSn;
+        } else {
+          this.dataSn = this.$store.state.projectSn;
         }
-        this.parentId=''
-        this.pageType='list'
+        this.parentId = "";
+        this.pageType = "list";
       }
-      this.getClassifyList()
+      this.getClassifyList();
       this.getList();
     },
   },
   methods: {
-    goBack2(){
-      this.$router.back()
+    goBack2() {
+      this.$router.back();
     },
     refresh() {
       this.getList();
     },
     getList() {
-      let sn = this.$store.state.projectSn
-      let type =1  // 2总企业，1项目
-      if(this.activeName=='company'){
-        sn=this.$store.state.userInfo.headquartersSn
-        type=2
+      let sn = this.$store.state.projectSn;
+      let type = 1; // 2总企业，1项目
+      if (this.activeName == "company") {
+        sn = this.$store.state.userInfo.headquartersSn;
+        type = 2;
         selectCompanyEducationCoursePageApi({
-          sn: sn,type:type,classifyId:this.parentId,pageNo:this.pageInfo.pageNo,pageSize:this.pageInfo.pageSize
+          sn: sn,
+          type: type,
+          classifyId: this.parentId,
+          pageNo: this.pageInfo.pageNo,
+          pageSize: this.pageInfo.pageSize,
         }).then((res) => {
           this.workerList = res.result.records;
           this.pageInfo.total = res.result.total;
         });
-      }else{
+      } else {
         safeEducationQuestionListApi({
-          projectSn: sn,type:type,classifyId:this.parentId,pageNo:this.pageInfo.pageNo,pageSize:this.pageInfo.pageSize
+          projectSn: sn,
+          type: type,
+          classifyId: this.parentId,
+          pageNo: this.pageInfo.pageNo,
+          pageSize: this.pageInfo.pageSize,
         }).then((res) => {
           this.workerList = res.result.records;
           this.pageInfo.total = res.result.total;
         });
       }
-      
     },
     goBack() {
       this.pageType = "list";
@@ -239,16 +324,20 @@ export default {
     },
     editBefore(item) {
       this.itemId = item.id;
-      console.log('展示')
+      console.log("展示");
       this.pageType = "detail";
     },
     deleteBefore(item) {
       // 此操作将永久删除该课程, 是否继续?
-      this.$confirm(this.$t("message.safetyEducation.permanentlyDelete"), this.$t("message.safetyEducation.tips"), {
-        confirmButtonText: this.$t("message.safetyEducation.determine"), // determine
-        cancelButtonText: this.$t("message.safetyEducation.cancel"), // 取消
-        type: "warning",
-      })
+      this.$confirm(
+        this.$t("message.safetyEducation.permanentlyDelete"),
+        this.$t("message.safetyEducation.tips"),
+        {
+          confirmButtonText: this.$t("message.safetyEducation.determine"), // determine
+          cancelButtonText: this.$t("message.safetyEducation.cancel"), // 取消
+          type: "warning",
+        }
+      )
         .then(() => {
           workerSafeEducationDeleteApi({ id: item.id }).then((res) => {
             this.$message({
@@ -274,62 +363,73 @@ export default {
       this.getList();
     },
     getClassifyList() {
-        educationClassifyListApi({sn: this.dataSn}).then(result => {
-            this.classifyList = result.result;
-        })
-    },
-    addClassifyFn(){
-      this.dialogVisible=true;
-      this.classifyForm.classifyName=''
-    },
-    editClassifyFn(){},
-    deleteClassifyFn(item){
-      this.$confirm(this.$t('message.personnelPosition.beaconManage.table.confirmText') + "【" + item.classifyName + "】?", this.$t('message.personnelPosition.beaconManage.table.Tips'), {
-            confirmButtonText: this.$t('message.personnelPosition.confirmButtonText'),
-            cancelButtonText: this.$t('message.personnelPosition.cancelButtonText'),
-            type: "warning",
-        }).then(() => {
-            educationClassifyDeleteApi({id: item.id}).then(result => {
-                if (result.success) {
-                    this.$message.success(result.message);
-                    if(item.id==this.parentId){
-                      this.parentId=''
-                      this.getList();
-                    }
-                    this.getClassifyList();
-                }
-            })
-        })
-    },
-    saveClassifyFn(){
-      this.$refs['addEditForm'].validate((valid) => {
-          if (valid) {
-              educationClassifyAddApi({
-                  sn: this.dataSn,
-                  classifyName: this.classifyForm.classifyName,
-                  type:this.activeName=='company'?1:2
-              }).then(result => {
-                this.dialogVisible = false;
-                this.$message.success(result.message);
-                this.getClassifyList();
-              })
-          } else {
-              console.log('error submit!!');
-              return false;
-          }
+      educationClassifyListApi({ sn: this.dataSn }).then((result) => {
+        this.classifyList = result.result;
+        console.log('课程分类', this.classifyList);
       });
-    }
+    },
+    addClassifyFn() {
+      this.dialogVisible = true;
+      this.classifyForm.classifyName = "";
+    },
+    editClassifyFn() {},
+    deleteClassifyFn(item) {
+      this.$confirm(
+        this.$t("message.personnelPosition.beaconManage.table.confirmText") +
+          "【" +
+          item.classifyName +
+          "】?",
+        this.$t("message.personnelPosition.beaconManage.table.Tips"),
+        {
+          confirmButtonText: this.$t(
+            "message.personnelPosition.confirmButtonText"
+          ),
+          cancelButtonText: this.$t(
+            "message.personnelPosition.cancelButtonText"
+          ),
+          type: "warning",
+        }
+      ).then(() => {
+        educationClassifyDeleteApi({ id: item.id }).then((result) => {
+          if (result.success) {
+            this.$message.success(result.message);
+            if (item.id == this.parentId) {
+              this.parentId = "";
+              this.getList();
+            }
+            this.getClassifyList();
+          }
+        });
+      });
+    },
+    saveClassifyFn() {
+      this.$refs["addEditForm"].validate((valid) => {
+        if (valid) {
+          educationClassifyAddApi({
+            sn: this.dataSn,
+            classifyName: this.classifyForm.classifyName,
+            type: this.activeName == "company" ? 1 : 2,
+          }).then((result) => {
+            this.dialogVisible = false;
+            this.$message.success(result.message);
+            this.getClassifyList();
+          });
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
   },
 };
 </script>
 <style lang="less" scoped>
-
 .backText {
   margin: -10px 0 0 0;
 }
-.jyjzPage .backText{
+.jyjzPage .backText {
   margin: 15px 15px 0;
-  /deep/.el-page-header__content{
+  /deep/.el-page-header__content {
     color: white;
   }
 }
@@ -341,7 +441,7 @@ export default {
   float: left;
   width: 20%;
   height: 250px;
-    margin-bottom: 20px;
+  margin-bottom: 20px;
   .inner {
     margin: 0 10px;
     box-shadow: 0px 2px 16px 0px rgba(131, 183, 255, 0.2);
@@ -349,7 +449,7 @@ export default {
     overflow: hidden;
     position: relative;
   }
-  .mask{
+  .mask {
     position: absolute;
     left: 0;
     top: 0;
@@ -368,8 +468,8 @@ export default {
   .videoBox {
     position: relative;
     overflow: hidden;
-    &:hover{
-      .mask{
+    &:hover {
+      .mask {
         transform: translateY(0);
       }
     }
@@ -396,33 +496,33 @@ export default {
     white-space: nowrap;
     text-overflow: ellipsis;
     cursor: pointer;
-    &:hover{
-        color: @--color-primary;
+    &:hover {
+      color: @--color-primary;
     }
   }
-  &:hover{
-      .deleteBtn{
-        display: block;
+  &:hover {
+    .deleteBtn {
+      display: block;
     }
   }
-  .deleteBtn{
-      display: none;
-      position: absolute;
-      right: 10px;
-      bottom: 10px;
-      cursor: pointer;
+  .deleteBtn {
+    display: none;
+    position: absolute;
+    right: 10px;
+    bottom: 10px;
+    cursor: pointer;
   }
 }
 .pagerBox {
   margin: 20px;
 }
-.table_wrap{ 
+.table_wrap {
   position: relative;
   height: calc(100% - 98px - 50px);
 }
-.classificationBox{
+.classificationBox {
   margin: 20px;
-  span{
+  span {
     margin-right: 30px;
     cursor: pointer;
     display: inline-block;
@@ -430,16 +530,17 @@ export default {
     border-radius: 3px;
     padding: 3px 10px;
     position: relative;
-    &.active,&:hover{
+    &.active,
+    &:hover {
       background-color: @--color-primary-deep;
       color: white;
     }
-    &:hover{
-      .el-icon-error{
+    &:hover {
+      .el-icon-error {
         display: block;
       }
     }
-    .el-icon-error{
+    .el-icon-error {
       color: salmon;
       position: absolute;
       right: -8px;
@@ -448,10 +549,10 @@ export default {
       display: none;
     }
   }
-  .addTypeBtn{
+  .addTypeBtn {
     border: 1px solid @--color-primary-deep;
     color: @--color-primary-deep;
-    i{
+    i {
       margin-right: 8px;
     }
   }