修复筛选无法取消问题

examples/plugins/xtable/renderer/components/FilterComplex.vue

@@ -3,8 +3,6 @@
     <div class="my-fc-type">
       <vxe-radio v-model="option.data.type" name="fType" label="has">包含</vxe-radio>
       <vxe-radio v-model="option.data.type" name="fType" label="eq">等于</vxe-radio>
-      <vxe-radio v-model="option.data.type" name="fType" label="gt">大于</vxe-radio>
-      <vxe-radio v-model="option.data.type" name="fType" label="lt">小于</vxe-radio>
     </div>
     <div class="my-fc-name">
       <vxe-input v-model="option.data.name" type="text" placeholder="请输入名称" @input="changeOptionEvent()"></vxe-input>

examples/plugins/xtable/renderer/components/FilterContent.vue

@@ -2,7 +2,7 @@
   <div class="my-filter-content">
     <div class="my-fc-search">
       <div class="my-fc-search-top">
-        <vxe-input v-model="option.data.sVal" placeholder="搜索" suffix-icon="fa fa-search" @keyup="searchEvent"></vxe-input>
+        <vxe-input v-model="option.data.sVal" placeholder="搜索" suffix-icon="fa fa-search"></vxe-input>
       </div>
       <div class="my-fc-search-content">
         <template v-if="valList.length">
@@ -13,7 +13,7 @@
           </ul>
           <ul class="my-fc-search-list my-fc-search-list-body">
             <li class="my-fc-search-item" v-for="(item, sIndex) in valList" :key="sIndex">
-              <vxe-checkbox v-model="item.checked" @change="changeItemEvent">{{ item.value }}</vxe-checkbox>
+              <vxe-checkbox v-model="item.checked">{{ item.value }}</vxe-checkbox>
             </li>
           </ul>
         </template>
@@ -49,9 +49,6 @@ export default {
   watch: {
     params () {
       this.load()
-    },
-    colValList () {
-      this.searchEvent()
     }
   },
   created () {
@@ -77,7 +74,6 @@ export default {
     searchEvent () {
       const { option, colValList } = this
       this.valList = option.data.sVal ? colValList.filter(item => item.value.indexOf(option.data.sVal) > -1) : colValList
-      this.updateCheckStatus()
     },
     changeAllEvent () {
       const { isAll } = this
@@ -85,14 +81,6 @@ export default {
         item.checked = isAll
       })
     },
-    updateCheckStatus () {
-      const { valList } = this
-      const isAll = valList.every(item => item.checked)
-      this.isAll = isAll
-    },
-    changeItemEvent () {
-      this.updateCheckStatus()
-    },
     confirmFilterEvent () {
       const { params, option, valList } = this
       const { data } = option
@@ -126,7 +114,6 @@ export default {
   line-height: 22px;
 }
 .my-filter-content .my-fc-search .my-fc-search-content {
-  border: 1px solid #E2E4E7;
   padding: 2px 10px;
 }
 .my-filter-content .my-fc-search-empty {

examples/plugins/xtable/renderer/components/FilterExcel.vue

@@ -19,8 +19,7 @@
           <i class="fa fa-caret-right my-fe-menu-link-right-icon"></i>
           <div class="my-fe-menu-child-list">
             <ul class="my-fe-child-menu-group-list" v-for="(cList, gIndex) in caseGroups" :key="gIndex">
-              <li v-for="(cItem, cIndex) in cList" :key="cIndex" :class="[option.data.fMenu === cItem.value ? 'my-fe-child-menu-item active' : 'my-fe-child-menu-item']" @click="childMenuClickEvent(cItem)">
-                <i class="fa fa-check my-fe-child-menu-left-icon"></i>
+              <li v-for="(cItem, cIndex) in cList" :key="cIndex" class="my-fe-child-menu-item" @click="childMenuClickEvent(cItem)">
                 <span>{{ cItem.label }}</span>
               </li>
             </ul>
@@ -33,9 +32,9 @@
         <input v-model="option.data.sVal" placeholder="搜索"/>
         <i class="fa fa-search my-fe-search-icon"></i>
       </div>
-      <ul class="my-fe-search-list" v-if="searchList.length">
+      <ul class="my-fe-search-list">
         <li class="my-fe-search-item" @click="sAllEvent">
-          <i :class="[isAllSearch ? 'fa fa-check-square-o my-fe-search-item-icon' : 'fa fa-square-o my-fe-search-item-icon']"></i>
+          <i class="fa fa-square-o my-fe-search-item-icon"></i>
           <span>(全选)</span>
         </li>
         <li class="my-fe-search-item" v-for="(val, sIndex) in searchList" :key="sIndex" @click="sItemEvent(val)">
@@ -43,9 +42,6 @@
           <span>{{ val }}</span>
         </li>
       </ul>
-      <div v-else class="body">
-        <div class="my-fe-search-empty">无匹配项</div>
-      </div>
     </div>
     <div class="my-fe-footer">
       <vxe-button status="primary" @click="confirmFilterEvent">确认</vxe-button>
@@ -77,8 +73,7 @@ export default {
           { value: 'greater', label: '大于' },
           { value: 'ge', label: '大于或等于' },
           { value: 'less', label: '小于' },
-          { value: 'le', label: '小于或等于' },
-          { value: 'between', label: '介于' }
+          { value: 'le', label: '小于或等于' }
         ]
       ],
       allCaseList: [
@@ -92,10 +87,6 @@ export default {
     }
   },
   computed: {
-    isAllSearch () {
-      const { option, searchList } = this
-      return searchList.every(val => option.data.vals.indexOf(val) > -1)
-    },
     searchList () {
       const { option, colValList } = this
       return option.data.sVal ? colValList.filter(val => val.indexOf(option.data.sVal) > -1) : colValList
@@ -121,10 +112,10 @@ export default {
     },
     sAllEvent () {
       const { data } = this.option
-      if (this.isAllSearch) {
+      if (data.vals.length > 0) {
         data.vals = []
       } else {
-        data.vals = this.searchList
+        data.vals = this.colValList
       }
     },
     sItemEvent (val) {
@@ -136,13 +127,13 @@ export default {
         data.vals.splice(vIndex, 1)
       }
     },
-    confirmFilterEvent () {
+    confirmFilterEvent (evnt) {
       const { params, option } = this
       const { data } = option
       const { $panel } = params
       data.f1 = ''
       data.f2 = ''
-      option.checked = true
+      $panel.changeOption(evnt, true, option)
       $panel.confirmFilter()
     },
     resetFilterEvent () {
@@ -182,10 +173,6 @@ export default {
           data.f1Type = '6'
           data.f2Type = ''
           break
-        case 'between':
-          data.f1Type = '4'
-          data.f2Type = '6'
-          break
       }
       $table.closeFilter()
       VXETable.modal.open({
@@ -195,7 +182,6 @@ export default {
           default: ({ $modal }) => {
             return [
               <div class="my-fe-popup">
-                <div class="my-fe-popup-title">显示行</div>
                 <div class="my-fe-popup-filter my-fe-popup-f1">
                   <vxe-select class="my-fe-popup-filter-select" v-model={ data.f1Type } transfer clearable>
                     {
@@ -319,15 +305,6 @@ export default {
 .my-filter-excel .my-fe-top .my-fe-menu-group .my-fe-menu-link .my-fe-child-menu-group-list > .my-fe-child-menu-item:hover {
   background-color: #C5C5C5;
 }
-.my-filter-excel .my-fe-top .my-fe-menu-group .my-fe-menu-link .my-fe-child-menu-group-list > .my-fe-child-menu-item .my-fe-child-menu-left-icon {
-  display: none;
-  position: absolute;
-  left: 10px;
-  top: 6px;
-}
-.my-filter-excel .my-fe-top .my-fe-menu-group .my-fe-menu-link .my-fe-child-menu-group-list > .my-fe-child-menu-item.active .my-fe-child-menu-left-icon {
-  display: block;
-}
 .my-filter-excel .my-fe-search {
   padding: 0 10px 0 30px;
 }
@@ -354,10 +331,6 @@ export default {
   overflow: auto;
   height: 140px;
 }
-.my-filter-excel .my-fe-search .my-fe-search-list .my-fe-search-empty {
-  text-align: center;
-  padding-top: 20px;
-}
 .my-filter-excel .my-fe-search .my-fe-search-list .my-fe-search-item {
   cursor: pointer;
   padding: 2px 0;