n20-common-lib 2.2.6 → 2.2.8

package/src/components/UTable/ElxTableFilter.vue

@@ -0,0 +1,183 @@
+<template>
+  <div
+    class="elx-table--filter-wrapper filter--prevent-default p-a"
+    :class="{
+      't--animat': $parent.animat,
+      'is--multiple': filterStore.multiple,
+      'filter--active': filterStore.visible
+    }"
+    :style="filterStore.style"
+  >
+    <slot v-if="filterStore.visible">
+      <el-input
+        v-model="searchVal"
+        class="input-w m-b"
+        :placeholder="'请输入' | $lc"
+        clearable
+        suffix-icon="el-icon-search"
+      />
+      <div v-if="filterStore.multiple">
+        <div>
+          <el-checkbox
+            v-model="filterStore.isAllSelected"
+            :label="true"
+            :indeterminate="indeterminate"
+            @change="allCheckFn"
+            >{{ '全部' | $lc }}{{ filters | alltextF }}</el-checkbox
+          >
+        </div>
+        <div class="input-w p-b-s" style="max-height: 226px; overflow: auto">
+          <template v-for="filter in filters">
+            <el-checkbox
+              v-if="filter.label.includes(searchVal)"
+              :key="filter.value"
+              v-model="filter._checked"
+              class="m-t-s m-r-0"
+              style="display: block"
+              @change="(val) => itemCheckFn(val, filter)"
+            >
+              <span class="align-bottom">{{ filter.label }}</span>
+              <span>{{ filter | countF }}</span>
+            </el-checkbox>
+          </template>
+        </div>
+        <div class="flex-box flex-c m-t-s">
+          <el-button type="primary" size="mini" @click="handleConfirm">
+            {{ '确认' | $lc }}
+          </el-button>
+          <el-button plain size="mini" @click="handleReset">{{ '清空' | $lc }}</el-button>
+        </div>
+      </div>
+      <div v-else>
+        <ul class="el-table-filter__list">
+          <li class="el-table-filter__list-item text-l" @click="allCheckFn">
+            {{ '全部' | $lc }}{{ filters | alltextF }}
+          </li>
+        </ul>
+        <ul class="el-table-filter__list" style="max-height: 226px; overflow: auto">
+          <template v-for="filter in filters">
+            <li
+              v-if="filter.label.includes(searchVal)"
+              :key="filter.value"
+              class="el-table-filter__list-item text-l"
+              :class="{ 'is-active': filter._checked }"
+              @click="itemCheckFn(!filter._checked, filter)"
+            >
+              <span class="text-ellipsis align-bottom">{{ filter.label }}</span>
+              <span>{{ filter | countF }}</span>
+            </li>
+          </template>
+        </ul>
+      </div>
+    </slot>
+  </div>
+</template>
+
+<script>
+// import { $lc } from '../../utils/i18n/index'
+function getCount(item) {
+  return item.count || (item.data ? item.data.count : undefined)
+}
+
+export default {
+  name: 'ElxTableFilter',
+  filters: {
+    countF(item) {
+      let N = getCount(item)
+      if (N !== undefined) {
+        return ' (' + N + ')'
+      } else {
+        return ''
+      }
+    },
+    alltextF(list = []) {
+      if (list.some((c) => getCount(c) !== undefined)) {
+        let total = 0
+        list.forEach((c) => {
+          total = total + (Number(c) || 0)
+        })
+        return ' (' + total + ')'
+      } else {
+        return ''
+      }
+    }
+  },
+  props: {
+    filterStore: { type: Object, default: () => ({}) }
+  },
+  data() {
+    return {
+      searchVal: ''
+    }
+  },
+  computed: {
+    column() {
+      return this.filterStore.column || {}
+    },
+    filters() {
+      return this.filterStore.options
+    },
+    multiple() {
+      return this.filterStore.multiple
+    },
+    indeterminate() {
+      return this.filterStore.isIndeterminate
+    }
+  },
+  watch: {
+    'filterStore.visible': {
+      handler(val) {
+        if (val) this.searchVal = ''
+      }
+    }
+  },
+  mounted() {},
+  methods: {
+    allCheckFn(t) {
+      if (this.filterStore.multiple) {
+        this.filterStore.options.forEach((e) => {
+          this.$set(e, '_checked', t)
+          this.$set(e, 'checked', t)
+        })
+        this.$set(this.filterStore, 'isAllSelected', t)
+        this.$set(this.filterStore, 'isIndeterminate', false)
+      } else {
+        this.$parent.resetFilterEvent()
+      }
+    },
+    itemCheckFn(t, i) {
+      if (this.filterStore.multiple) {
+        this.$set(i, '_checked', t)
+
+        this.$parent.checkFilterOptions()
+      } else {
+        this.filterStore.options.forEach((e) => {
+          this.$set(e, '_checked', false)
+          this.$set(e, '_checked', false)
+        })
+
+        this.$set(i, '_checked', t)
+        this.$set(i, 'checked', t)
+
+        this.$parent.checkFilterOptions()
+        this.$parent.confirmFilterEvent()
+      }
+    },
+    handleConfirm() {
+      let someC = false
+      this.filterStore.options.forEach((e) => {
+        e.checked = e._checked
+        e._checked && (someC = true)
+      })
+      if (someC) {
+        this.$parent.confirmFilterEvent()
+      } else {
+        this.$parent.resetFilterEvent()
+      }
+    },
+    handleReset() {
+      this.$parent.resetFilterEvent()
+    }
+  }
+}
+</script>

package/src/components/UTable/index.js

@@ -0,0 +1,115 @@
+import 'umy-table/lib/theme-chalk/elx-table.css'
+import { UTable, UTableColumn, UxGrid, UxTableColumn } from 'umy-table'
+import ElxTableFilter from './ElxTableFilter.vue'
+
+function install(Vue) {
+  Vue.component('UTable', UTable)
+  Vue.component('UTableColumn', UTableColumn)
+  repairUtable(Vue) // 美化
+
+  Vue.component('UxTable', UxGrid)
+
+  setPropsDefault(UxTableColumn, { headerAlign: { default: 'center' } })
+  const _created = UxTableColumn.created
+  UxTableColumn.created = function () {
+    _created.call(this, ...arguments)
+    this.$watch('filters', () => {
+      this.columnConfig.filters = this.filters
+    })
+  }
+  Vue.component('UxTableColumn', UxTableColumn)
+  // 自定义筛选
+  Vue.component('ElxTableFilter', ElxTableFilter)
+}
+
+export default {
+  install
+}
+
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+//
+// 美化表头搜索
+import FilterPanel from '../../utils/tableheaderFilterpanel.vue'
+function setPropsDefault(component, props) {
+  let c_props = component.props
+  Object.keys(props).forEach((key) => {
+    c_props[key] = Object.assign({}, c_props[key], props[key])
+  })
+}
+function setMethodsDefault(component, methods) {
+  let c_methods = component.methods
+  Object.keys(methods).forEach((key) => {
+    c_methods[key] = methods[key]
+  })
+}
+function hasClass(el, cls) {
+  if (!el || !cls) return false
+  if (cls.indexOf(' ') !== -1) throw new Error('className should not contain space.')
+  if (el.classList) {
+    return el.classList.contains(cls)
+  } else {
+    return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1
+  }
+}
+
+function repairUtable(Vue) {
+  setPropsDefault(UTableColumn, {
+    filterPlacement: {
+      default: 'bottom'
+    }
+  })
+  if (UTable.components.ElTable.components.TableHeader) {
+    setMethodsDefault(UTable.components.ElTable.components.TableHeader, {
+      handleFilterClick(event, column) {
+        event.stopPropagation()
+        const target = event.target
+        let cell = target.tagName === 'TH' ? target : target.parentNode
+        if (hasClass(cell, 'noclick')) return
+        cell = cell.querySelector('.el-table__column-filter-trigger') || cell
+        const table = this.$parent
+
+        let filterPanel = this.filterPanels[column.id]
+
+        if (filterPanel && column.filterOpened) {
+          filterPanel.showPopper = false
+          return
+        }
+
+        if (!filterPanel) {
+          filterPanel = new Vue(FilterPanel)
+          this.filterPanels[column.id] = filterPanel
+          if (column.filterPlacement) {
+            filterPanel.placement = column.filterPlacement
+          }
+          filterPanel.table = table
+          filterPanel.cell = cell
+          filterPanel.column = column
+          !this.$isServer && filterPanel.$mount(document.createElement('div'))
+        }
+
+        setTimeout(() => {
+          filterPanel.showPopper = true
+        }, 16)
+      }
+    })
+  }
+}

package/src/utils/asyncGetRelaNos.js

@@ -1,5 +1,5 @@
 import axios from './axios'
-
+import { getItem, setItem } from './storageEdit'
 // 按需/按模块 加载权限
 async function asyncGetRelaNos(appNo, rns) {
   let uno = sessionStorage.getItem('userNo')
@@ -20,27 +20,30 @@ async function asyncGetRelaNos(appNo, rns) {
     { loading: false, noMsg: true }
   )
 
-  let ssRelaNos = JSON.parse(sessionStorage.getItem('relaNos'))
-  let ssCltrelaNos = JSON.parse(sessionStorage.getItem('cltrelaNos'))
-
-  let relaNos = []
-  data.forEach((el) => {
-    ssCltrelaNos[el.cltNo] || (ssCltrelaNos[el.cltNo] = [])
-
-    relaNos.push(...el.relaNos)
-    ssCltrelaNos[el.cltNo].push(...el.relaNos)
-  })
-  relaNos = Array.from(new Set(relaNos))
+  let ssRelaNos = getItem('relaNos') // JSON.parse(sessionStorage.getItem('relaNos'))
+  let ssCltrelaNos = getItem('cltrelaNos') // JSON.parse(sessionStorage.getItem('cltrelaNos'))
 
   let rnObj = ssRelaNos.find((el) => el.appNo === appNo)
-  if (rnObj) {
-    rnObj.relaNos = relaNos
-  } else {
-    ssRelaNos.push({ appNo: appNo || 'null', relaNos: relaNos })
+  if (!rnObj) {
+    rnObj = { appNo: appNo || 'null', relaNos: [] }
+    ssRelaNos.push(rnObj)
   }
+  let oRelaNos = []
+  data.forEach((el) => {
+    if (ssCltrelaNos[el.cltNo]) {
+      ssCltrelaNos[el.cltNo].push(...el.relaNos)
+    } else {
+      ssCltrelaNos[el.cltNo] = el.relaNos
+    }
+    oRelaNos.push(...el.relaNos)
+  })
+  oRelaNos = [...new Set(oRelaNos)]
+  rnObj.relaNos = oRelaNos
 
-  sessionStorage.setItem('relaNos', JSON.stringify(ssRelaNos))
-  sessionStorage.setItem('cltrelaNos', JSON.stringify(ssCltrelaNos))
+  // sessionStorage.setItem('relaNos', JSON.stringify(ssRelaNos))
+  setItem('relaNos', ssRelaNos)
+  // sessionStorage.setItem('cltrelaNos', JSON.stringify(ssCltrelaNos))
+  setItem('cltrelaNos', ssCltrelaNos)
 }
 
 export default asyncGetRelaNos

package/src/utils/relaNo.js

@@ -1,33 +1,37 @@
 import forEachs from './forEachs'
+import { getItem } from './storageEdit'
 
 const name = process.env.VUE_APP_RelaAppNo || process.env.VUE_APP_NAME
 
-let relaObj = {
-  appNo: name,
-  relaNos: []
-}
+let relaObj = undefined
+let cltrelaNos = undefined
 
 export function getRela() {
+  if (!relaObj) setRela()
+
   return relaObj
 }
 
 export function setRela() {
-  let relaNosStr = sessionStorage.getItem('relaNos')
-  if (relaNosStr) {
-    let relaNos = JSON.parse(relaNosStr)
-    Object.assign(
-      relaObj,
-      relaNos.find((r) => r.appNo === name)
-    )
+  let _relaNos = getItem('relaNos') // sessionStorage.getItem('relaNos')
+  if (_relaNos) {
+    let relaNos = _relaNos
+    relaObj = relaNos.find((r) => r.appNo === name)
     console.log(relaObj, 'has权限列表')
 
-    relaObj.relaNosGlobal = relaNos.map((item) => item.relaNos).flat()
+    let relaNosG = []
+    for (let i = 0; i < relaNos.length; i++) {
+      let item = relaNos[i]
+      relaNosG.push(...item.relaNos)
+    }
+    relaObj.relaNosGlobal = relaNosG
+
     return
   }
   /* 兼容旧门户 */
-  let resourcesStr = sessionStorage.getItem('resources')
-  if (resourcesStr) {
-    let resources = JSON.parse(resourcesStr)
+  let _resources = getItem('resources') // sessionStorage.getItem('resources')
+  if (_resources) {
+    let resources = _resources
     let relaNos = []
     forEachs(resources, (item) => {
       relaNos.push(item.relaNo)
@@ -37,13 +41,12 @@ export function setRela() {
   }
 }
 
-let cltrelaNos = undefined
 export function getCltRela(clt) {
   /* 获取全部单位权限 */
   if (!cltrelaNos) {
-    let cltrelaNosStr = sessionStorage.getItem('cltrelaNos')
-    if (cltrelaNosStr) {
-      cltrelaNos = JSON.parse(cltrelaNosStr)
+    let _cltrelaNos = getItem('cltrelaNos') // sessionStorage.getItem('cltrelaNos')
+    if (_cltrelaNos) {
+      cltrelaNos = _cltrelaNos
     } else {
       cltrelaNos = {}
     }
@@ -52,14 +55,34 @@ export function getCltRela(clt) {
   if (Array.isArray(clt)) {
     let clts = clt
     let cltI = clts[0]
-    let cltRela = cltrelaNos[cltI]
+    let cltRela = []
+    for (let id in cltrelaNos) {
+      let ids = id.split(',')
+      if (ids.includes(cltI)) {
+        cltRela.push(...cltrelaNos[id])
+      }
+    }
 
     for (let i = 1; i < clt.length; i++) {
-      cltRela = aandb(cltRela, cltrelaNos[clts[i]])
+      let cltRela2 = []
+      for (let id in cltrelaNos) {
+        let ids = id.split(',')
+        if (ids.includes(clts[i])) {
+          cltRela2.push(...cltrelaNos[id])
+        }
+      }
+      cltRela = aandb(cltRela, cltRela2)
     }
     return cltRela || []
   } else {
-    return cltrelaNos[clt] || []
+    let cltRela = []
+    for (let id in cltrelaNos) {
+      let ids = id.split(',')
+      if (ids.includes(clt)) {
+        cltRela.push(...cltrelaNos[id])
+      }
+    }
+    return cltRela
   }
 }
 

package/src/utils/storageEdit.js

@@ -0,0 +1,15 @@
+export function setItem(key, obj) {
+  window['_keep_' + key] = obj
+  setTimeout(function () {
+    sessionStorage.setItem(key, JSON.stringify(obj))
+  }, 100)
+}
+
+export function getItem(key) {
+  let obj = window['_keep_' + key]
+  if (!obj) {
+    obj = JSON.parse(sessionStorage.getItem(key))
+    window['_keep_' + key] = obj
+  }
+  return obj
+}

package/src/utils/tableheaderFilterpanel.vue

@@ -14,9 +14,9 @@
         suffix-icon="el-icon-search"
       />
       <div>
-        <el-checkbox v-model="allCheck" :label="true" :indeterminate="indeterminate">{{
-          filters | alltextF
-        }}</el-checkbox>
+        <el-checkbox v-model="allCheck" :label="true" :indeterminate="indeterminate"
+          >{{ '全部' | $lc }}{{ filters | alltextF }}</el-checkbox
+        >
       </div>
       <el-checkbox-group v-model="filteredValue" class="input-w p-b-s" style="max-height: 226px; overflow: auto">
         <template v-for="filter in filters">
@@ -64,7 +64,7 @@
           }"
           @click="handleSelect(null)"
         >
-          {{ filters | alltextF }}
+          {{ '全部' | $lc }}{{ filters | alltextF }}
         </li>
       </ul>
       <ul class="el-table-filter__list" style="max-height: 226px; overflow: auto">
@@ -90,7 +90,7 @@
 </template>
 
 <script>
-import { $lc } from './i18n/index'
+// import { $lc } from './i18n/index'
 import Popper from 'element-ui/lib/utils/vue-popper.js'
 export default {
   name: 'ElTableFilterPanelPor',
@@ -110,9 +110,9 @@ export default {
             total = total + Number(c.count)
           }
         })
-        return $lc('全部') + ' (' + total + ')'
+        return ' (' + total + ')'
       } else {
-        return $lc('全部')
+        return ''
       }
     }
   },