up

houtai/src/apis/tab1.js

@@ -46,9 +46,9 @@ export const goodsDetail = (id) => {
   })
 }
 // 删除图片
-export const goodsimgRemove = (id) => {
+export const goodsimgRemove = (fileId) => {
   return axios({
-    url: `/cms/goods/imgRemove/${id}`
+    url: `/cms/goods/remove/file/${fileId}`
   })
 }
 

houtai/src/views/tab1/index.vue

@@ -359,22 +359,17 @@ export default {
     lookGood (id) {
       this.$router.push({
         path: '/layout/tab1Look',
-        query: { conLeftId: this.formData.type, id }
+        query: { Sid: id, id: this.formData.moduleId }
       })
     },
     // 点击编辑文物
     editGood (id) {
-      if (this.formData.type === 'img') {
-        this.$router.push({
-          path: '/layout/tab1Add2',
-          query: { id }
-        })
-      } else {
-        this.$router.push({
-          path: '/layout/tab1Add',
-          query: { conLeftId: this.formData.type, id }
-        })
-      }
+      let temp = '/layout/tab1Add'
+      if (this.activeType === 'img') temp = '/layout/tab1Add2'
+      this.$router.push({
+        path: temp,
+        query: { Sid: id, id: this.formData.moduleId }
+      })
     },
     // 点击新增文物
     addGood () {
@@ -435,21 +430,26 @@ export default {
     }
   },
   // 生命周期 - 创建完成（可以访问当前this实例）
-  created () {
+  async created () {
+    // 获取模块列表
+    const res = await moduleList('goods')
+    this.conLeftArr = res.data
+
     // 获取服务器前缀地址
     this.baseURL = axios.defaults.baseURL
     // 判断是第一次进来还是修改或者新增或者查看后返回
     // 拿到路由跳转传过来的数据
-    if (this.$route.query.conLeftId) {
-      this.formData.type = this.$route.query.conLeftId
+    if (this.$route.query.k) {
+      const temp = Number(this.$route.query.k)
+      this.formData.moduleId = temp
+      this.conLeftArr.forEach(v => {
+        if (v.id === temp) this.activeType = v.type
+      })
     }
     this.goodsList(this.formData)
   },
   // 生命周期 - 挂载完成（可以访问DOM元素）
-  async mounted () {
-    const res = await moduleList('goods')
-    this.conLeftArr = res.data
-  },
+  mounted () {},
   beforeCreate () {}, // 生命周期 - 创建之前
   beforeMount () {}, // 生命周期 - 挂载之前
   beforeUpdate () {}, // 生命周期 - 更新之前

houtai/src/views/tab1/tab1Add.vue

@@ -49,7 +49,7 @@
           <i class="biaoshi" :class="{ biaoshi1: conLeftId === 'model' }"></i>
           <el-upload
             class="avatar-uploader"
-            :action="baseURL + '/cms/goods/uploadImg'"
+            :action="`${baseURL}/cms/goods/upload/thumb`"
             :headers="{
               token,
             }"
@@ -136,6 +136,7 @@ export default {
       baseURL: '',
       token: '',
       ruleForm: {
+        moduleId: '', // 模块id
         name: '', // 标题
         type: '', // 类型, model:模型， img:图片， video：视频
         thumb: '', // 封面图
@@ -160,7 +161,7 @@ export default {
         this.$message.success('操作成功')
         this.$router.push({
           path: '/layout/tab1',
-          query: { conLeftId: this.conLeftId }
+          query: { k: this.ruleForm.moduleId }
         })
       } else this.$message.warning(res.msg)
     },
@@ -174,7 +175,7 @@ export default {
         .then(async () => {
           this.$router.push({
             path: '/layout/tab1',
-            query: { conLeftId: this.conLeftId }
+            query: { k: this.ruleForm.moduleId }
           })
         })
         .catch(() => {
@@ -250,7 +251,7 @@ export default {
     successFujian (file) {
       console.log('上传附件成功', file)
       if (file.code === 0) {
-        this.ruleForm.filePath = file.data.urlPath
+        this.ruleForm.filePath = file.data.filePath
         this.ruleForm.fileName = file.data.fileName
         this.$message.success('上传成功')
       } else if (file.code === -1) {
@@ -278,12 +279,16 @@ export default {
     this.token = localStorage.getItem('CQLJXU_token')
     // 拿到路由跳转传过来的数据
     this.conLeftId = this.$route.query.k
+    // 获取模块id
+    this.ruleForm.moduleId = Number(this.$route.query.id)
     // 通过父亲传过来的id获取详情
     if (!this.$route.query.k) {
-      const res = await goodsDetail(Number(this.$route.query.id))
+      const res = await goodsDetail(Number(this.$route.query.Sid))
       this.ruleForm = res.data.entity
       // 附件回显
       this.fileList = [{ name: res.data.entity.fileName }]
+      // 类型回显
+      this.conLeftId = res.data.entity.type
       // console.log(998, res)
     }
   },

houtai/src/views/tab1/tab1Add2.vue

@@ -28,22 +28,22 @@
         </el-form-item>
         <el-form-item label="精品类型：">
           <i class="biaoshi biaoshi2"></i>
-          <el-radio v-model="conLeftId" label="model" disabled>实物模型</el-radio>
+          <el-radio v-model="conLeftId" label="model" disabled
+            >实物模型</el-radio
+          >
           <el-radio v-model="conLeftId" label="img">专题图库</el-radio>
-          <el-radio v-model="conLeftId" label="video：视频" disabled>视频档案</el-radio>
+          <el-radio v-model="conLeftId" label="video：视频" disabled
+            >视频档案</el-radio
+          >
         </el-form-item>
         <!-- 图片 -->
-        <el-form-item label="图片：" style="height:480px;overflow-y: auto;">
+        <el-form-item label="图片：" style="height: 480px; overflow-y: auto">
           <i class="biaoshi biaoshi1"></i>
           <div class="imgBox">
-            <div
-              class="imgdiv"
-              v-for="(item, index) in imgList"
-              :key="item.id"
-            >
+            <div class="imgdiv" v-for="(item, index) in imgList" :key="item.id">
               <el-image
                 style="width: 200px; height: 200px"
-                :src="baseURL+item.filePath"
+                :src="baseURL + item.filePath"
                 :preview-src-list="imgListLook"
               >
               </el-image>
@@ -51,16 +51,28 @@
               <div class="cover" v-if="imgActive === index">封面图片</div>
               <!-- 下面的按钮 -->
               <div class="handle">
-                <el-button size="mini" type="primary" round @click="goodsImgIndex(index)" v-if="imgActive !== index">设为封面</el-button>
+                <el-button
+                  size="mini"
+                  type="primary"
+                  round
+                  @click="goodsImgIndex(index)"
+                  v-if="imgActive !== index"
+                  >设为封面</el-button
+                >
               </div>
               <!-- 删除 -->
-              <div class="delImg el-icon-delete" @click="delGoodsImg(index,item.id)" v-if="imgActive !== index"></div>
+              <div
+                class="delImg el-icon-delete"
+                @click="delGoodsImg(index, item.id)"
+                v-if="imgActive !== index"
+              ></div>
             </div>
             <el-upload
-              v-if="this.imgList.length<18"
+              v-if="this.imgList.length < 18"
               ref="upload"
               class="avatar-uploader"
-              :action="baseURL + '/cms/goods/upload'"
+              :data="{ code: ruleForm.code }"
+              :action="baseURL + '/cms/goods/uploadImg'"
               :headers="{ token }"
               :show-file-list="true"
               :before-upload="beforethumbUpload"
@@ -105,6 +117,7 @@ export default {
       baseURL: '',
       token: '',
       ruleForm: {
+        moduleId: '',
         code: new Date().valueOf(),
         name: '',
         type: 'img',
@@ -119,20 +132,29 @@ export default {
   methods: {
     // 点击保存
     async goodsSave () {
-      if (this.ruleForm.name.trim() === '') { return this.$message.warning('标题不能为空') }
-      if (this.imgList.length === 0) { return this.$message.warning('图片不能为空') }
+      if (this.ruleForm.name.trim() === '') {
+        return this.$message.warning('标题不能为空')
+      }
+      if (this.imgList.length === 0) {
+        return this.$message.warning('图片不能为空')
+      }
       // if (this.imgList.length > 18) { return this.$message.warning('图片不能超过18张') }
       const temp = []
-      this.imgList.forEach(v => {
+      this.imgList.forEach((v) => {
         temp.push(v.id)
       })
-      const obj = { ...this.ruleForm, fileIds: temp.join(','), thumb: this.imgList[this.imgActive].filePath, indexId: this.imgList[this.imgActive].id }
+      const obj = {
+        ...this.ruleForm,
+        fileIds: temp.join(','),
+        thumb: this.imgList[this.imgActive].filePath,
+        indexId: this.imgList[this.imgActive].id
+      }
       const res = await goodsSave(obj)
       if (res.code === 0) {
         this.$message.success('操作成功')
         this.$router.push({
           path: '/layout/tab1',
-          query: { conLeftId: 'img' }
+          query: { k: this.ruleForm.moduleId }
         })
       } else this.$message.warning(res.msg)
       // console.log(998, res)
@@ -171,7 +193,7 @@ export default {
         .then(async () => {
           this.$router.push({
             path: '/layout/tab1',
-            query: { conLeftId: 'img' }
+            query: { k: this.ruleForm.moduleId }
           })
         })
         .catch(() => {
@@ -202,19 +224,26 @@ export default {
     async upload_thumb_success (data) {
       this.$message.success('上传成功')
       // console.log('图片上传成功', data)
-      this.imgList.push({ name: data.data.name, id: data.data.id, filePath: data.data.filePath })
+      this.imgList.push({
+        // name: data.data.name,
+        id: data.data.id,
+        filePath: data.data.filePath
+      })
       this.imgListLook.push(this.baseURL + data.data.filePath)
     }
   },
   // 生命周期 - 创建完成（可以访问当前this实例）
   async created () {
+    // 获取模块id
+    this.ruleForm.moduleId = Number(this.$route.query.id)
+
     // 获取服务器前缀地址
     this.baseURL = axios.defaults.baseURL
     // 获取用户token
     this.token = localStorage.getItem('CQLJXU_token')
     // 通过父亲传过来的id获取详情
-    if (this.$route.query.id) {
-      const res = await goodsDetail(Number(this.$route.query.id))
+    if (this.$route.query.Sid) {
+      const res = await goodsDetail(Number(this.$route.query.Sid))
       this.ruleForm = res.data.entity
       this.imgList = res.data.file
       this.imgList.forEach((v, i) => {
@@ -240,7 +269,7 @@ export default {
 .tab1Add2 {
   height: 100%;
   .conten {
-    /deep/.el-form-item{
+    /deep/.el-form-item {
       max-height: 480px;
       // overflow-y: auto;
     }
@@ -291,19 +320,19 @@ export default {
       transform: translateX(-50%);
       bottom: 15px;
     }
-    .imgBox{
+    .imgBox {
       display: flex;
       flex-wrap: wrap;
-      .imgdiv{
+      .imgdiv {
         position: relative;
         margin-right: 30px;
         margin-bottom: 10px;
-        .handle{
+        .handle {
           display: flex;
           justify-content: center;
           margin-top: 5px;
         }
-        .delImg{
+        .delImg {
           cursor: pointer;
           border-radius: 10px;
           color: #fff;
@@ -314,7 +343,7 @@ export default {
           top: 5px;
           right: 5px;
         }
-        .cover{
+        .cover {
           pointer-events: none;
           font-size: 16px;
           display: flex;
@@ -327,11 +356,11 @@ export default {
           left: 0;
           transform: translateY(-50%);
           height: 40px;
-          background-color: rgba(255,255,255,.4);
+          background-color: rgba(255, 255, 255, 0.4);
         }
       }
     }
-    .upHint1{
+    .upHint1 {
       margin-top: 15px;
     }
   }

houtai/src/views/tab1/tab1Look.vue

@@ -115,7 +115,7 @@ export default {
     goBack () {
       this.$router.push({
         path: '/layout/tab1',
-        query: { conLeftId: this.conLeftId }
+        query: { k: this.$route.query.id }
       })
     }
   },
@@ -124,13 +124,13 @@ export default {
     // 获取服务器前缀地址
     this.baseURL = axios.defaults.baseURL
     // 拿到路由跳转传过来的数据
-    this.conLeftId = this.$route.query.conLeftId
     // 通过父亲传过来的id获取详情
-    if (this.$route.query.id) {
-      const res = await goodsDetail(Number(this.$route.query.id))
+    if (this.$route.query.Sid) {
+      const res = await goodsDetail(Number(this.$route.query.Sid))
+      // 确定类型
+      this.conLeftId = res.data.entity.type
       this.myObj = res.data.entity
       this.srcList = [this.baseURL + this.myObj.thumb]
-      console.log(998, this.myObj)
       this.myArr = res.data.file
       this.myArr.forEach((v, i) => {
         this.srcList2.push(this.baseURL + v.filePath)

houtai/src/views/tab3/index.vue

@@ -9,6 +9,11 @@
     <div class="obstruct"></div>
     <div class="conten">
       <div class="con_left">
+        <div class="moBtn">
+          <el-button type="primary" @click="dialogShow = true"
+            >新增模块</el-button
+          >
+        </div>
         <div class="cutJT">
           <i class="el-icon-arrow-down"></i>
           教育基地
@@ -17,10 +22,22 @@
           <li
             v-for="item in conLeftArr"
             :key="item.id"
-            :class="{ active: formData.type === item.type }"
-            @click="cutLeft(item.type)"
+            :class="{ active: formData.moduleId === item.id }"
+            @click="cutLeft(item.id,item.type)"
           >
-            {{ item.name }}
+            <span :title="item.name">{{ item.name }}</span>
+            <div class="inco" v-if="item.id !== 1 && item.id !== 2 && item.id !== 3">
+              <i
+                @click="moduleEdit(item.id)"
+                title="编辑"
+                class="el-icon-edit"
+              ></i>
+              <i
+                title="删除"
+                class="el-icon-delete"
+                @click="moduleRemove(item.id)"
+              ></i>
+            </div>
           </li>
         </ul>
       </div>
@@ -71,40 +88,63 @@
             </el-table-column>
             <el-table-column label="标题" width="250">
               <template #default="{ row }">
-                <span class="table_name" :title="row.name">{{
-                  row.name
-                }}</span>
+                <span class="table_name" :title="row.name">{{ row.name }}</span>
               </template>
             </el-table-column>
             <el-table-column label="封面图片" width="120">
-              <template #default='{row}'>
-                <img class="table_img" :src="baseURL+row.thumb" alt="" :onerror="defaultImg"/>
+              <template #default="{ row }">
+                <img
+                  class="table_img"
+                  :src="baseURL + row.thumb"
+                  alt=""
+                  :onerror="defaultImg"
+                />
               </template>
             </el-table-column>
-            <el-table-column prop="visit" label="阅读" width="100"> </el-table-column>
-            <el-table-column prop="creatorName" label="发布人"> </el-table-column>
+            <el-table-column prop="visit" label="阅读" width="100">
+            </el-table-column>
+            <el-table-column prop="creatorName" label="发布人">
+            </el-table-column>
             <el-table-column prop="createTime" label="发布时间" width="200">
             </el-table-column>
-            <el-table-column  label="排序" width="80">
+            <el-table-column label="排序" width="80">
               <template #default="{ row }">
-                <el-input type="text" v-model="row.sort" @blur="changeSort(row.sort,row.id)"></el-input>
+                <el-input
+                  type="text"
+                  v-model="row.sort"
+                  @blur="changeSort(row.sort, row.id)"
+                ></el-input>
               </template>
             </el-table-column>
             <el-table-column label="是否显示">
               <template #default="{ row }">
-                <el-switch v-model="row.display" active-color="#b9412e" :active-value='1' :inactive-value='0' @change='changeSwit($event,row.id)'>
+                <el-switch
+                  v-model="row.display"
+                  active-color="#b9412e"
+                  :active-value="1"
+                  :inactive-value="0"
+                  @change="changeSwit($event, row.id)"
+                >
                 </el-switch>
               </template>
             </el-table-column>
             <el-table-column label="操作">
               <template #default="{ row }">
+                <el-button type="text" @click="lookGood(row.id)"
+                  >查看</el-button
+                >
                 <el-button
                   type="text"
-                  @click="lookGood(row.id)"
-                  >查看</el-button
+                  v-if="!row.display"
+                  @click="editGood(row.id)"
+                  >编辑</el-button
+                >
+                <el-button
+                  type="text"
+                  v-if="!row.display"
+                  @click="delGoods(row.id)"
+                  >删除</el-button
                 >
-                <el-button type="text" v-if="!row.display" @click="editGood(row.id)">编辑</el-button>
-                <el-button type="text" v-if="!row.display" @click="delGoods(row.id)">删除</el-button>
               </template>
             </el-table-column>
           </el-table>
@@ -122,24 +162,68 @@
       >
       </el-pagination>
     </div>
+    <!-- 点击新增模块出现的弹窗 -->
+    <el-dialog
+      :title="dialogData.id?'编辑模块':'新增模块'"
+      :visible="dialogShow"
+      class="myDialog"
+      @close="btnX"
+    >
+      <div class="row">
+        <span>模块名称：</span>
+        <el-input
+          style="width: 500px"
+          v-model="dialogData.name"
+          maxlength="10"
+          show-word-limit
+        ></el-input>
+      </div>
+      <div class="row">
+        <span>展示类型：</span>
+        <el-radio :disabled='!!dialogData.id' v-model="dialogData.type" label="model">实物模型</el-radio>
+        <el-radio :disabled='!!dialogData.id' v-model="dialogData.type" label="img">专题图库</el-radio>
+        <el-radio :disabled='!!dialogData.id' v-model="dialogData.type" label="video">视频档案</el-radio>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="btnX">取 消</el-button>
+        <el-button type="primary" @click="btnOk">确 定</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import axios from '@/utils/request'
-import { goodsList, goodsRemove, goodsDisplay, goodsSort } from '@/apis/tab1'
+import {
+  goodsList,
+  goodsRemove,
+  goodsDisplay,
+  goodsSort,
+  moduleList,
+  moduleSave,
+  moduleRemove,
+  moduleDetail
+} from '@/apis/tab1'
 export default {
   name: 'tab3',
   components: {},
   data () {
     // 这里存放数据
     return {
+      dialogShow: false,
+      dialogData: {
+        module: 'news',
+        name: '',
+        type: 'model'
+      },
+      // 关于新增模块的数据↑
       baseURL: '',
       total: 0,
       time: '',
       conLeftArr: [
-        { name: '知识共享', type: 'model' },
-        { name: '知识阅览', type: 'img' }
+        { id: 1, name: '...' },
+        { id: 2, name: '...' },
+        { id: 3, name: '...' }
       ],
       formData: {
         startTime: '',
@@ -148,8 +232,10 @@ export default {
         pageSize: 10,
         searchKey: '',
         sortType: 0,
-        type: 'model'
+        moduleId: 1
       },
+      // 当前选中的模块类型
+      activeType: 'model',
       tableData: []
     }
   },
@@ -163,6 +249,50 @@ export default {
   },
   // 方法集合
   methods: {
+    async moduleEdit (id) {
+      const res = await moduleDetail(id)
+      this.dialogData = res.data
+      this.dialogShow = true
+    },
+    moduleRemove (id) {
+      this.$confirm('确定删除吗? 当前模块下如果存在数据，也会一并删除.', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(async () => {
+          const res = await moduleRemove(id)
+          if (res.code === 0) {
+            this.$message.success('删除成功')
+            const res2 = await moduleList('goods')
+            this.conLeftArr = res2.data
+          } else this.$message.warning(res.msg)
+        })
+        .catch(() => {
+          this.$message.info('已取消')
+        })
+    },
+    btnX () {
+      this.dialogShow = false
+      this.dialogData = {
+        module: 'goods',
+        name: '',
+        type: 'model'
+      }
+    },
+    async btnOk () {
+      if (this.dialogData.name.trim() === '') {
+        return this.$message.warning('模块名称不能为空')
+      }
+      const res = await moduleSave(this.dialogData)
+      if (res.code === 0) {
+        this.$message.success('操作成功')
+        this.btnX()
+        const res2 = await moduleList('goods')
+        this.conLeftArr = res2.data
+      } else this.$message.warning(res.msg)
+    },
+    // 关于新增模块的方法↑
     // 点击重置
     resetBtn () {
       this.formData.searchKey = ''
@@ -194,7 +324,6 @@ export default {
         this.$message.success('操作成功')
         this.goodsList(this.formData)
       } else this.$message.warning(res.msg)
-      console.log(998, val, id)
     },
     // 分页器方法
     currentChange (val) {
@@ -230,38 +359,34 @@ export default {
     lookGood (id) {
       this.$router.push({
         path: '/layout/tab1Look',
-        query: { conLeftId: this.formData.type, id }
+        query: { Sid: id, id: this.formData.moduleId }
       })
     },
     // 点击编辑文物
     editGood (id) {
-      if (this.formData.type === 'img') {
-        this.$router.push({
-          path: '/layout/tab1Add2',
-          query: { id }
-        })
-      } else {
-        this.$router.push({
-          path: '/layout/tab1Add',
-          query: { conLeftId: this.formData.type, id }
-        })
-      }
+      let temp = '/layout/tab1Add'
+      if (this.activeType === 'img') temp = '/layout/tab1Add2'
+      this.$router.push({
+        path: temp,
+        query: { Sid: id, id: this.formData.moduleId }
+      })
     },
     // 点击新增文物
     addGood () {
-      if (this.formData.type === 'img') this.$router.push('/layout/tab1Add2')
-      else {
-        this.$router.push({
-          path: '/layout/tab1Add',
-          query: { conLeftId: this.formData.type }
-        })
-      }
+      let temp = '/layout/tab1Add'
+      if (this.activeType === 'img') temp = '/layout/tab1Add2'
+      this.$router.push({
+        path: temp,
+        query: { id: this.formData.moduleId, k: this.activeType }
+      })
     },
     // 点击左侧的tab栏
-    cutLeft (type) {
-      if (type === this.formData.type) return
-      this.formData.type = type
+    cutLeft (id, type) {
+      if (id === this.formData.moduleId) return
+      this.formData.moduleId = id
       this.goodsList(this.formData)
+      // 把当前选中的模块类型保存
+      this.activeType = type
     },
     // 时间处理----------------
     handleSelect (e) {
@@ -305,13 +430,21 @@ export default {
     }
   },
   // 生命周期 - 创建完成（可以访问当前this实例）
-  created () {
+  async created () {
+    // 获取模块列表
+    const res = await moduleList('goods')
+    this.conLeftArr = res.data
+
     // 获取服务器前缀地址
     this.baseURL = axios.defaults.baseURL
     // 判断是第一次进来还是修改或者新增或者查看后返回
     // 拿到路由跳转传过来的数据
-    if (this.$route.query.conLeftId) {
-      this.formData.type = this.$route.query.conLeftId
+    if (this.$route.query.k) {
+      const temp = Number(this.$route.query.k)
+      this.formData.moduleId = temp
+      this.conLeftArr.forEach(v => {
+        if (v.id === temp) this.activeType = v.type
+      })
     }
     this.goodsList(this.formData)
   },
@@ -333,28 +466,87 @@ export default {
     display: flex;
     height: calc(100% - 32px);
     .con_left {
-      padding: 20px 0 0 15px;
+      position: relative;
+      padding: 50px 0 0 0;
       width: 180px;
       height: 100%;
       border: 1px solid #ccc;
+      border-top: none;
+      .moBtn {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 40px;
+        /deep/button {
+          width: 100%;
+        }
+      }
       .cutJT {
+        padding-left: 8px;
         margin-bottom: 10px;
       }
       ul {
+        height: 600px;
+        overflow-y: auto;
+        &::-webkit-scrollbar {
+          /*滚动条整体样式*/
+          width: 2px; /*高宽分别对应横竖滚动条的尺寸*/
+        }
+        &::-webkit-scrollbar-thumb {
+          /*滚动条里面小方块*/
+          border-radius: 10px;
+          box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+          background: #b9412e;
+        }
         li {
+          position: relative;
+          padding-left: 30px;
           cursor: pointer;
-          margin-left: 20px;
-          width: 100px;
-          text-align: center;
-          line-height: 30px;
-          height: 30px;
+          width: 100%;
+          text-align: left;
+          line-height: 40px;
+          height: 40px;
+          & > span {
+            display: inline-block;
+            width: calc(100% - 50px);
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+          }
+          .inco {
+            display: none;
+            text-align: right;
+            padding: 0 2px;
+            font-size: 20px;
+            position: absolute;
+            right: 0;
+            top: 0;
+            width: 50px;
+            height: 40px;
+            .el-icon-delete {
+              margin-left: 5px;
+            }
+            i {
+              &:hover {
+                color: #b9412e;
+              }
+            }
+          }
           &:hover {
-            color: #b9412e;
+            & > span {
+              color: #b9412e;
+            }
             background-color: #e6f7ff;
+            .inco {
+              display: block;
+            }
           }
         }
         .active {
-          color: #b9412e;
+          & > span {
+            color: #b9412e;
+          }
           background-color: #e6f7ff;
         }
       }
@@ -388,18 +580,26 @@ export default {
       }
     }
   }
-  .table{
+  .table {
     max-width: 1370px;
   }
-  /deep/.el-table__body-wrapper{
+  /deep/.el-table__body-wrapper {
     max-height: 485px;
     overflow-y: auto;
   }
-      .paging {
-      position: absolute;
-      bottom: 15px;
-      right: 50px;
+  .paging {
+    position: absolute;
+    bottom: 15px;
+    right: 50px;
+  }
+  .myDialog {
+    .row {
+      display: flex;
+      align-items: center;
+      &:nth-of-type(1) {
+        margin-bottom: 30px;
+      }
     }
-
+  }
 }
 </style>