附件，筛选项功能优化

src/views/projectManage/bugList/bugindex.vue

@@ -501,7 +501,7 @@
       @confirm="saveSearch('searchForm')"
       @cancel="showSaveSearch=false"
     >
-      <div class="file-dialog">
+      <div v-if="showSaveSearch" class="file-dialog">
         <el-form ref="searchForm" :model="searchForm" :rules="searchFormRules" label-width="100px">
           <el-form-item label="过滤器名称" prop="name">
             <el-input v-model="searchForm.name" placeholder="不超过50个字符" />
@@ -913,7 +913,14 @@ export default {
           this.stratAndEnd = this.stratAndEnd ? this.stratAndEnd : []
           this.formInline.createStartTime = this.stratAndEnd[0] || null
           this.formInline.createEndTime = this.stratAndEnd[1] || null
-          this.toSave()
+          const isExistName = this.filterList.some(item => {
+            return item.name === this.searchForm.name
+          })
+          if (isExistName) {
+            this.$message({ showClose: true, message: '筛选项名称重名', type: 'error' })
+          } else {
+            this.toSave()
+          }
         } else {
           this.$message({ showClose: true, message: '筛选项名称不能为空', type: 'error' })
           return false
@@ -938,8 +945,6 @@ export default {
     },
     async getFilterList() { // 获取过滤器列表
       const params = {
-        pageSize: 10,
-        curIndex: 1,
         bizId: Number(localStorage.getItem('bizId'))
       }
       const res = await getFilterList(params)

src/views/projectManage/bugList/details/filterList.vue

@@ -4,6 +4,7 @@
       :data="filterList"
       style="width: 100%"
       height="288"
+      border
       :header-cell-style="{background:'#EBEEF5'}"
     >
       <el-table-column
@@ -13,7 +14,7 @@
       >
         <template slot-scope="scope">
           <el-row>
-            <el-col v-if="scope.row.showEdit" :span="8">
+            <el-col v-if="scope.row.showEdit" :span="22">
               <el-input
                 v-model="filterList[scope.row.index].name"
                 size="mini"
@@ -23,8 +24,8 @@
               />
             </el-col>
             <el-col v-if="scope.row.showEdit" :span="2"><i class="el-icon-edit" @click.stop="cancel(scope.row)" /></el-col>
-            <el-col v-if="!scope.row.showEdit" :span="8">
-              <span>{{ scope.row.name }}</span>
+            <el-col v-if="!scope.row.showEdit" :span="22">
+              <span class="item-name">{{ scope.row.name }}</span>
               <i class="el-icon-edit" @click.stop="editFilter(scope.row)" />
             </el-col>
           </el-row>
@@ -162,5 +163,11 @@ export default {
 <style scoped lang="scss">
 .el-icon-edit {
   margin-left: 10px;
+}
+i {
+  cursor: pointer;
+}
+.item-name {
+
 }
 </style>

src/views/projectManage/bugList/details/index.vue

@@ -492,7 +492,15 @@
             >
               <el-button v-if="false" slot="trigger" size="small" type="primary">上传附件</el-button>
               <div slot="file" slot-scope="{file}" class="image-detail">
-                <div class="image-name">{{ file.name }}</div>
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  :content="file.name"
+                  placement="top-start"
+                  popper-class="tip-style"
+                >
+                  <div class="image-name">{{ file.name }}</div>
+                </el-tooltip>
                 <img
                   class="el-upload-list__item-thumbnail detail-img"
                   :src="file.url"
@@ -932,14 +940,23 @@ export default {
       this.$router.push({ name: '缺陷详情', params: { id: this.id }})
     },
     isImage(arr) {
-      const reg = new RegExp(/.*(\.gif|\.jpeg|\.png|\.jpg|\.bmp|\.gif)/i)
+      const reg = new RegExp(/.*(\.gif|\.jpeg|\.png|\.jpg|\.bmp)/i)
       return arr.filter(item => { return !!item.url.match(reg) })
     },
     isNotImage(arr) {
-      const reg = new RegExp(/.*(\.gif|\.jpeg|\.png|\.jpg|\.bmp|\.gif)/i)
+      const reg = new RegExp(/.*(\.gif|\.jpeg|\.png|\.jpg|\.bmp)/i)
       return arr.filter(item => { return !item.url.match(reg) })
     },
     beforeUpload(file) {
+      const reg = new RegExp(/.*(zip|xlsx|txt|csv|xls|mov|mp4|m4a|avi|amr|mp3|wav|3gpp|gif|jpeg|png|jpg)/i)
+      const isUpload = file.type.match(reg)
+      if (!isUpload) {
+        this.$message({
+          message: '不支持上传此文件格式',
+          type: 'warning'
+        })
+        return false
+      }
       const isLt200M = (file.size / 1024 / 1024) < 200
       if (!isLt200M) {
         this.$message({
@@ -1734,13 +1751,20 @@ border-color: #DCDFE6;
 }
 .upload-info {
   position: absolute;
-  left: 140px;
-  top: 10px;
+  left: 130px;
+  top: 14px;
   color:#409EFF;
+  font-size: 12px;
+  i{
+    margin-right: 5px;
+  }
 }
 .upload-file {
   color: #E6A23C;
   font-size: 12px;
+  i{
+    margin-right: 5px;
+  }
 }
 .upload-title {
   width: 40px;

src/views/projectManage/bugList/file/createdBug.vue

@@ -149,18 +149,30 @@
                 </el-row>
               </el-form-item>
               <el-form-item label="附件" style="width:100%;">
-                <el-upload
-                  class="upload-demo"
-                  action="http://star.xiaojukeji.com/upload/img.node"
-                  :on-remove="handleRemove"
-                  :on-preview="handlePictureCardPreview"
-                  :on-progress="progress"
-                  :on-success="handleChange"
-                  :file-list="fileList"
-                  list-type="picture"
-                >
-                  <el-button size="small" type="primary">上传附件</el-button>
-                </el-upload>
+                <section class="upload-main">
+                  <el-tooltip
+                    class="item"
+                    effect="dark"
+                    content="支持的文件格式有：.zip, .xlsx, .txt, .csv, .xls, .mov, .mp4, .m4a, .avi, .amr, .mp3, .wav, .3gpp, .png, .jpg, .jpeg"
+                    placement="top-start"
+                    popper-class="tip-style"
+                  >
+                    <div class="upload-info"><i class="el-icon-question" />格式说明</div>
+                  </el-tooltip>
+                  <el-upload
+                    class="upload-demo"
+                    action="http://star.xiaojukeji.com/upload/img.node"
+                    :on-remove="handleRemove"
+                    :on-preview="handlePictureCardPreview"
+                    :on-progress="progress"
+                    :on-success="handleChange"
+                    :file-list="fileList"
+                    list-type="picture"
+                    :before-upload="beforeUpload"
+                  >
+                    <el-button size="small" type="primary">上传附件</el-button>
+                  </el-upload>
+                </section>
               </el-form-item>
             </div>
           </div>
@@ -499,6 +511,25 @@ export default {
         }))
       })
     },
+    beforeUpload(file) {
+      const reg = new RegExp(/.*(zip|xlsx|txt|csv|xls|mov|mp4|m4a|avi|amr|mp3|wav|3gpp|gif|jpeg|png|jpg)/i)
+      const isUpload = file.type.match(reg)
+      if (!isUpload) {
+        this.$message({
+          message: '不支持上传此文件格式',
+          type: 'warning'
+        })
+        return false
+      }
+      const isLt200M = (file.size / 1024 / 1024) < 200
+      if (!isLt200M) {
+        this.$message({
+          message: '上传文件大小不能超过 200MB!',
+          type: 'warning'
+        })
+        return false
+      }
+    },
     handleRemove(file, fileList) {
       this.fileDbList = this.fileDbList.filter(item => {
         return item.name !== file.name
@@ -620,4 +651,18 @@ export default {
     }
   }
 }
+.upload-main {
+  position: relative;
+}
+.upload-info {
+  position: absolute;
+  left: 90px;
+  top: 50%;
+  transform: translateY(-50%);
+  color:#409EFF;
+  font-size: 12px;
+  i{
+    margin-right: 5px;
+  }
+}
 </style>