过滤器

src/api/defectManage.js

@@ -142,9 +142,26 @@ export function createFilter(data) {
 }
 
 // 获取过滤器
-export function getFilterList() {
+export function getFilterList(data) {
   return request({
     url: TeamManagement + '/bug/getFilterList',
+    method: 'get',
+    data
+  })
+}
+
+// 获取过滤器
+export function getFilterItem(id) {
+  return request({
+    url: TeamManagement + '/bug/getFilter?id=' + id,
+    method: 'get'
+  })
+}
+
+// 删除过滤器
+export function deleteFilter(id) {
+  return request({
+    url: TeamManagement + '/bug/deleteFilter?id=' + id,
     method: 'get'
   })
 }

src/components/dialog/normalDialog.vue

@@ -9,7 +9,7 @@
       @close="cancel()"
     >
       <slot />
-      <span slot="footer" class="dialog-footer">
+      <span v-show="showFooter" slot="footer" class="dialog-footer">
         <el-button @click="cancel()">取 消</el-button>
         <el-button type="primary" @click="confirm()">确 定</el-button>
       </span>
@@ -33,6 +33,11 @@ export default {
       type: Boolean,
       default: false,
       required: true
+    },
+    showFooter: {
+      type: Boolean,
+      default: true,
+      required: false
     }
   },
   data() {

src/utils/global.js

@@ -5,3 +5,20 @@ export function debounce(func, delay) { // 防抖
     func.apply(this, arguments)
   }, delay)
 }
+export function deepClone(obj) {
+  function isObject(o) {
+    return (typeof o === 'object' || typeof o === 'function') && o !== null
+  }
+
+  if (!isObject(obj)) {
+    throw new Error('非对象')
+  }
+
+  const isArray = Array.isArray(obj)
+  const newObj = isArray ? [...obj] : { ...obj }
+  Reflect.ownKeys(newObj).forEach(key => {
+    newObj[key] = isObject(obj[key]) ? deepClone(obj[key]) : obj[key]
+  })
+
+  return newObj
+}

src/views/projectManage/bugList/bugindex.vue

@@ -376,8 +376,17 @@
             </el-form>
           </el-col>
           <el-row type="flex" justify="space-between" class="filter">
-            <el-col :span="12" class="mine-filter">我的过滤器</el-col>
-            <el-col :span="2" align="end">管理过滤器</el-col>
+            <el-col :span="12" class="mine-filter">
+              <span>我的过滤器：</span>
+              <span v-for="item in filterList" :key="item.id" class="filter-item" @click="getFilterItem(item.id)">
+                <el-tooltip class="item" effect="dark" :content="item.name" placement="bottom">
+                  <span>{{ item.name }}</span>
+                </el-tooltip>
+              </span>
+            </el-col>
+            <el-col :span="2" align="end">
+              <span @click.stop="showEditSearch = true">管理过滤器</span>
+            </el-col>
           </el-row>
         </el-row>
       </el-header>
@@ -440,7 +449,7 @@
             <div align="right">
               <el-pagination
                 :page-sizes="[15, 30, 45, total]"
-                :current-page="currentPage4"
+                :current-page="curIndex"
                 :page-size="pageSize"
                 background
                 layout="total, sizes, prev, pager, next, jumper"
@@ -482,13 +491,22 @@
       @cancel="showSaveSearch=false"
     >
       <div class="file-dialog">
-        <el-form ref="searchForm" :model="searchForm" :rules="searchFormRules" label-width="80px">
-          <el-form-item label="活动名称" prop="name">
+        <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个字符" />
           </el-form-item>
         </el-form>
       </div>
     </normal-dialog>
+    <normal-dialog
+      :show-footer="false"
+      :show-dialog="showEditSearch"
+      :title="'管理过滤器'"
+      :width="'65%'"
+      @cancel="showEditSearch=false"
+    >
+      <filter-list @deleteFilter="deleteFilter" />
+    </normal-dialog>
   </div>
 </template>
 
@@ -496,6 +514,8 @@
 import BugDetails from './details/index'
 import createdBug from '@/views/projectManage/bugList/file/createdBug'
 import normalDialog from '@/components/dialog/normalDialog'
+import filterList from '@/views/projectManage/bugList/details/filterList'
+import { deepClone } from '@/utils/global'
 import {
   bugList,
   bugSelfList,
@@ -506,7 +526,8 @@ import {
   settingQueryBizModuleList,
   bugDownload,
   createFilter,
-  getFilterList
+  getFilterList,
+  getFilterItem
 } from '@/api/defectManage'
 import { memberQueryMemberInfoByIDAPorName } from '@/api/projectIndex'
 import '@/views/projectManage/bugList/css/index.css'
@@ -514,7 +535,8 @@ export default {
   components: {
     createdBug,
     BugDetails,
-    normalDialog
+    normalDialog,
+    filterList
   },
   filters: {
     oneA(value) {
@@ -594,7 +616,6 @@ export default {
       curIndex: 1,
       total: 0,
       goodName: '更多筛选',
-      currentPage4: 1,
       modalShow: false, // 弹窗（新建）
       drawerShow: false, // drawer展示
       taskIdStr: [],
@@ -609,11 +630,14 @@ export default {
       dialogImageUrl: '',
       isBugNameClick: false,
       showSaveSearch: false, // 显示保存筛选项对话框
-      searchForm: { searchObj: null }, // 筛选项obj
+      showEditSearch: false, // 显示管理过滤器
+      searchForm: { name: null }, // 筛选项obj
       searchFormRules: { name: [
         { required: true, message: '请输入筛选项名称', trigger: 'blur' },
         { min: 1, max: 50, message: '长度在 1 到 50 个字符', trigger: 'blur' }
-      ] }
+      ] },
+      filterList: [], // 筛选器列表
+      filterDetail: null // 筛选器详情
     }
   },
   computed: {
@@ -631,6 +655,9 @@ export default {
     if (this.$route.query.startDate && this.$route.query.endDate) {
       this.stratAndEnd = [this.$route.query.startDate, this.$route.query.endDate]
     }
+    if (this.$route.query.filterId) {
+      this.getFilterItem(this.$route.query.filterId)
+    }
     this.tableData = []
     if (this.type === 'page') {
       this.getBugList()
@@ -652,10 +679,6 @@ export default {
         this.$router.push({ path: this.$route.path })
       }
     },
-    async getFilterList() { // 获取过滤器列表
-      const res = await getFilterList()
-      console.log(res)
-    },
     async getBugList() {
       if (!this.stratAndEnd) {
         this.stratAndEnd = []
@@ -702,15 +725,15 @@ export default {
     resetQuery() {
       this.$router.push({ path: this.$route.path })
       this.stratAndEnd = []
-      var combination = {}
+      let combination = {}
       combination = this.formInline
       this.formInline = {}
       this.$set(this.formInline, 'bugId', combination.bugId)
       this.$set(this.formInline, 'status', combination.status)
       this.$set(this.formInline, 'priorityLevel', combination.priorityLevel)
+      this.curIndex = 1
       this.getBugList()
     },
-    queryBug() {},
     getClient(e) {
       this.$set(this.formInline, 'appVersion', '')
       this.Editionlist = this.appClient.filter(
@@ -876,12 +899,41 @@ export default {
           return false
         }
       })
-      const res = await createFilter({ name: this.searchForm.name, content: JSON.stringify(this.formInline) })
-      console.log(res)
+      const saveObj = deepClone(this.formInline)
+      delete saveObj.curIndex
+      delete saveObj.pageSize
+      const res = await createFilter({ name: this.searchForm.name, content: JSON.stringify(saveObj) })
       if (res.code === 200) {
         this.$message({ showClose: true, message: '保存成功', type: 'success' })
         this.showSaveSearch = false
+        this.getFilterList()
+        this.searchForm.name = null
+      }
+    },
+    async getFilterList() { // 获取过滤器列表
+      const res = await getFilterList()
+      this.filterList = res.data
+    },
+    async getFilterItem(filterId) { // 获取单个过滤器
+      this.stratAndEnd = []
+      const combination = deepClone(this.formInline)
+      const { bugId, status, priorityLevel } = combination
+      this.formInline = { bugId, status, priorityLevel }
+      this.$router.push({ path: this.$route.path, query: { filterId: filterId }})
+      const res = await getFilterItem(filterId)
+      if (res.code === 200) {
+        const filter = JSON.parse(res.data.content)
+        if (filter.createStartTime && filter.createEndTime) {
+          this.stratAndEnd = [filter.createStartTime, filter.createEndTime]
+        }
+        Object.assign(this.formInline, filter)
+        this.curIndex = 1
+        this.getBugList()
       }
+    },
+    deleteFilter() {
+      this.$router.push({ path: this.$route.path })
+      this.getFilterList()
     }
   }
 }
@@ -908,10 +960,15 @@ export default {
   width: 100%;
   padding: 0 11px 15px 15px;
   color: #606266;
+  cursor: pointer;
   .mine-filter {
     overflow: hidden;
     text-overflow:ellipsis;
     white-space: nowrap;
+    .filter-item {
+      color: #409EFF;
+      margin-right: 15px;
+    }
   }
 }
 </style>

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

@@ -0,0 +1,97 @@
+<template>
+  <div class="filterList">
+    <el-table
+      :data="filterList"
+      style="width: 100%"
+      :header-cell-style="{background:'#EBEEF5'}"
+    >
+      <el-table-column
+        fixed
+        prop="name"
+        label="过滤器名称"
+      />
+      <el-table-column
+        fixed="right"
+        align="center"
+        label="操作"
+        width="80"
+      >
+        <template slot-scope="scope">
+          <i class="el-icon-delete" @click="deleteFilter(scope.row)" />
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-col :span="24">
+      <div align="right">
+        <el-pagination
+          :page-sizes="[15, 30, 45, total]"
+          :current-page="currentPage"
+          :page-size="pageSize"
+          background
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+        />
+      </div>
+    </el-col>
+  </div>
+</template>
+<script>
+import {
+  getFilterList,
+  deleteFilter
+} from '@/api/defectManage'
+export default {
+  data() {
+    return {
+      filterList: [],
+      total: 0,
+      currentPage: 1,
+      pageSize: 5
+    }
+  },
+  created() {
+    this.getFilterList()
+  },
+  methods: {
+    async getFilterList() { // 获取过滤器列表
+      const params = {
+        pageSize: this.pageSize,
+        curIndex: this.curIndex
+      }
+      const res = await getFilterList(params)
+      this.filterList = res.data
+    },
+    async deleteFilter(item) {
+      this.$confirm(`是否删除${item.name}?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.confirmDelete(item.id)
+      })
+    },
+    async confirmDelete(id) {
+      const res = await deleteFilter(id)
+      this.$emit('deleteFilter')
+      if (res.code === 200) {
+        this.$message({ showClose: true, message: '删除成功', type: 'success' })
+      }
+      this.getFilterList()
+    },
+    handleSizeChange(e) {
+      this.pageSize = e
+    },
+    handleCurrentChange(e) {
+      this.curIndex = e
+      this.getFilterList()
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+.el-icon-delete {
+  color: #F56C6C
+}
+</style>