eztech-core-components 1.0.39 → 1.0.41

package/comps/CoreBooleanSelect.vue

@@ -0,0 +1,24 @@
+<template>
+  <el-select
+    v-model="modelValue"
+    placeholder="Бүгд"
+  >
+    <el-option :value="null" label="Бүгд" />
+    <el-option :value="true" label="Тийм" />
+    <el-option :value="false" label="Үгүй" />
+  </el-select>
+</template>
+<script>
+export default {
+  name: 'CoreBooleanSelect',
+  props: {
+    value: { type: Boolean, default: null }
+  },
+  computed: {
+    modelValue: {
+      get () { return this.value },
+      set (val) { this.$emit('input', val) }
+    }
+  }
+}
+</script>

package/comps/CoreDateRange.vue

@@ -7,6 +7,7 @@
     :format="format"
     :value-format="valueFormat"
     class="w-full"
+    style="width: 100%;"
   />
 </template>
 <script>

package/comps/CoreFormTable.vue

@@ -30,6 +30,8 @@
       :read-only="isReadonly"
       :is-sub="true"
       :statuses="statuses"
+      :filters="filters"
+      :filter="filter"
       :status-count="statusCount"
       @load="handleRefreshList"
       @excel="handleExcel"

package/comps/CoreNumberRange.vue

@@ -0,0 +1,65 @@
+<template>
+  <div class="flex gap-1 items-center">
+    <el-input
+      v-model.number="val1"
+      placeholder="Эхлэх"
+      clearable
+      @clear="onClear(0)"
+    />
+    <span class="mx-1">—</span>
+    <el-input
+      v-model.number="val2"
+      placeholder="Дуусах"
+      clearable
+      @clear="onClear(1)"
+    />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'CoreNumberRange',
+  props: {
+    value: {
+      type: Array,
+      default: () => null
+    }
+  },
+  computed: {
+    val1: {
+      get () {
+        return Array.isArray(this.value) ? this.value[0] : null
+      },
+      set (val) {
+        this.updateValue(0, val)
+      }
+    },
+    val2: {
+      get () {
+        return Array.isArray(this.value) ? this.value[1] : null
+      },
+      set (val) {
+        this.updateValue(1, val)
+      }
+    }
+  },
+  methods: {
+    updateValue (index, val) {
+      const normalized = (val === '' || val === undefined) ? null : val
+      let next = Array.isArray(this.value) ? [...this.value] : [null, null]
+      next[index] = normalized
+
+      // Хоёулаа null бол бүхэлдээ null болгоно
+      if (next[0] == null && next[1] == null) {
+        next = null
+      }
+
+      this.$emit('input', next)
+      this.$emit('change', next)
+    },
+    onClear (index) {
+      this.updateValue(index, null)
+    }
+  }
+}
+</script>

package/comps/CoreSelectOrgEmp.vue

@@ -19,7 +19,7 @@
       @keydown.native.enter="$emit('keydown-enter')"
       @keydown="$emit('keydown', $event)"
     >
-      <div class="text-center">
+      <div v-if="!notEdit" class="text-center">
         <el-button type="text" :loading="loadingVisible" @click="handleVisible()">
           Шинээр нэмэх
         </el-button>
@@ -48,7 +48,7 @@
               <span>{{ item.pos_name }} {{ item.expert_num }} {{ item.phone_num }}</span>
             </div>
           </div>
-          <button class="text-xs text-corePrimaryText hover:bg-white rounded px-2 p-1" @click.stop.prevent="handleVisible(item._id, item.tid)">
+          <button v-if="!notEdit" class="text-xs text-corePrimaryText hover:bg-white rounded px-2 p-1" @click.stop.prevent="handleVisible(item._id, item.tid)">
             <i class="el-icon-edit" />
           </button>
         </div>
@@ -116,7 +116,8 @@ export default {
     disabled: { type: Boolean, default: false },
     size: { type: String, default: null },
     isSearch: { type: Boolean, default: false },
-    placeholder: { type: String, default: 'Сонгох' }
+    placeholder: { type: String, default: 'Сонгох' },
+    notEdit: { type: Boolean, default: false }
   },
   data () {
     return {

package/comps/CoreTable.vue

@@ -70,7 +70,8 @@
         >
           Дахин ачаалах
         </el-button>
-        <!-- <el-button
+        <el-button
+          v-if="!!filters?.length"
           icon="el-icon-search"
           :plain="plainButton"
           :size="sizeButton || defaultSize"
@@ -78,7 +79,7 @@
           @click="visibleSearch = true"
         >
           Дэлгэрэнгүй хайлт
-        </el-button> -->
+        </el-button>
         <el-button
           v-if="buttons.textExport"
           icon="el-icon-download"
@@ -151,6 +152,37 @@
     </div>
     <!-- :highlight-current-row="selectable" -->
     <!-- @current-change="handleCurrentRowChange" -->
+    <div v-if="filter" class="flex flex-row flex-wrap gap-2 text-sm">
+      <div
+        v-for="item in filters.filter(c => {
+          const val = filter[c.field]
+          if (val === null || val === undefined) {
+            return false
+          }
+          if (typeof val === 'string' && val.trim() === '') {
+            return false
+          }
+          return true
+        })"
+        :key="item.field"
+        class="bg-white px-2 py-1 rounded flex flex-row items-center gap-2"
+      >
+        <div>
+          <span class="text-coreRegularText">{{ item.title }}: </span>
+          <span v-if="item.type === 'string'">{{ filter[item.field] }}</span>
+          <span v-else-if="item.type === 'boolean'">{{ filter[item.field] ? 'Тийм' : 'Үгүй' }}</span>
+          <span v-else-if="item.type === 'manyToOne'">{{ filter[item.field][item.props.ref_column] }}</span>
+          <span v-else-if="item.type === 'date'">{{ $moment(filter[item.field][0]).format('YYYY-MM-DD') }}/{{ $moment(filter[item.field][1]).format('YYYY-MM-DD') }}</span>
+          <span v-else-if="item.type === 'number'">{{ filter[item.field][0] }}-{{ filter[item.field][1] }}</span>
+        </div>
+        <div
+          class="cursor-pointer bg-coreBgHover rounded-full size-5 flex items-center justify-center  text-sm text-coreSecondaryText hover:text-coreRegularText"
+          @click="filter[item.field] = null; handleSearch()"
+        >
+          <i class="el-icon-close" />
+        </div>
+      </div>
+    </div>
     <el-table
       ref="tableMain"
       v-loading="loading"
@@ -234,7 +266,7 @@
         @detail="handleDetail"
         @sort-change="$emit('sort-change', $event)"
         @search-input="$emit('search-input', $event)"
-        @search="$emit('search')"
+        @search="handleSearch()"
         @change-cell-value="($event) => $emit('change-cell-value', $event)"
       />
       <!-- <el-table-column
@@ -283,7 +315,7 @@
             </div>
           </div>
           <div>
-            <el-button v-if="search && !noSearch" icon="el-icon-search" size="mini" @click="$emit('search')" />
+            <el-button v-if="search && !noSearch" icon="el-icon-search" size="mini" @click="handleSearch()" />
           </div>
         </template>
         <template slot-scope="scope">
@@ -412,6 +444,10 @@
       :api-id="api_id"
       :table-id="table_id"
       :table-name="table_name"
+      :filters="filters"
+      :filter="filter"
+      @search="handleSearch"
+      @refresh="handleRefresh"
     />
   </div>
 </template>
@@ -475,6 +511,8 @@ export default {
     cellClassName: { type: Function, default: null },
     rowClassName: { type: Function, default: null },
     statuses: { type: Array, default: () => { return [] } },
+    filters: { type: Array, default: () => { return [] } },
+    filter: { type: Object, default: () => { return null } },
     statusCount: { type: Object, default: () => { return null } },
     editFields: { type: Array, default: () => { return [] } },
     totalDurationMs: { type: Number, default: () => { return null } },
@@ -496,6 +534,9 @@ export default {
     ...mapGetters('settings', ['tablePageSizes', 'windowHeight', 'ignoreTableConfig']),
     ...mapGetters('user', ['isLocked']),
     ...mapGetters(['user_position_id']),
+    isDevelopment () {
+      return process.env.NODE_ENV === 'development'
+    },
     isDisabled () {
       return false // this.isLocked
     },
@@ -677,6 +718,9 @@ export default {
       await this.$nextTick()
       this.$emit('load', { pageSize: this.getPageSize() })
     },
+    handleSearch () {
+      this.$emit('search')
+    },
     handleRefresh () {
       this.currentRow = null
       this.currentRows = []

package/comps/CoreTableSearchDetail.vue

@@ -5,27 +5,21 @@
     :width="dialogWidth"
   >
     <div v-loading="loading" class="p-4 bg-white rounded">
+      <!-- h-[400px] overflow-y-auto -->
       <el-form class="core-form grid grid-cols-3 gap-x-2 label-position-top" label-position="top">
         <el-form-item
-          v-for="item in list"
-          :key="item._id"
-          :label="item.col_title"
-          :class="[{
-            'col-span-full': item.col_type === 'manyToOne' && !item.ref_table?.startsWith('ref_')
-          }]"
+          v-for="item in filters"
+          :key="item.field"
+          :label="item.title"
         >
-          <span slot="label" class="leading-3">
-            {{ item.col_title }}
-          </span>
-          <div
-            v-if="item.col_type === 'manyToOne' && !item.ref_table?.startsWith('ref_')"
-            class="core-form grid grid-cols-3"
-          >
-            <div v-for="col of item.list" :key="col._id">
-              {{ col.col_title }}
-            </div>
-          </div>
-          <el-input v-else />
+          <component
+            :value="getValue(item.field)"
+            :is="item.component"
+            v-bind="item.props"
+            :parent-temp="getParentTemp(item)"
+            clearable
+            @input="setValue(item.field, $event)"
+          />
         </el-form-item>
       </el-form>
     </div>
@@ -33,6 +27,9 @@
       <el-button type="primary" icon="el-icon-search" @click="handleSearch">
         Хайх
       </el-button>
+      <el-button icon="el-icon-refresh" @click="handleRefreshSearch">
+        Цэвэрлэх
+      </el-button>
       <el-button icon="el-icon-close" @click="modelVisible = false">
         Буцах
       </el-button>
@@ -40,6 +37,7 @@
   </el-dialog>
 </template>
 <script>
+import { get, set } from 'lodash'
 export default {
   name: 'CoreTableSearchDetail',
   props: {
@@ -47,12 +45,15 @@ export default {
     projectId: { type: [String, Number], default: '5' },
     tableName: { type: String, default: '' },
     apiId: { type: String, default: null },
-    tableId: { type: String, default: null }
+    tableId: { type: String, default: null },
+    filters: { type: Array, default: () => { return [] } },
+    filter: { type: Object, default: () => { return null } }
   },
   data () {
     return {
       loading: false,
-      list: []
+      list: [],
+      itemValue: null
     }
   },
   computed: {
@@ -63,10 +64,29 @@ export default {
   },
   watch: {
     modelVisible () {
-      this.handleRefresh()
+      // this.handleRefresh()
     }
   },
   methods: {
+    getParentTemp (item) {
+      if (['CoreSelect', 'CoreSelectOrgEmp'].includes(item.component)) {
+        return this.filter
+      }
+    },
+    handleSearch () {
+      this.$emit('search')
+      this.modelVisible = false
+    },
+    handleRefreshSearch () {
+      this.$emit('refresh')
+      this.modelVisible = false
+    },
+    getValue (field) {
+      return get(this.filter, field)
+    },
+    setValue (field, value) {
+      return set(this.filter, field, value)
+    },
     async handleRefresh () {
       try {
         if (!this.modelVisible) {
@@ -80,9 +100,6 @@ export default {
       } finally {
         this.loading = false
       }
-    },
-    handleSearch () {
-      // console.log('search')
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eztech-core-components",
-  "version": "1.0.39",
+  "version": "1.0.41",
   "publishConfig": {
     "access": "public"
   },

package/utils/table-helper.js

@@ -140,6 +140,15 @@ export const tableComputed = {
     }
     return `search_${this.tableName}`
   },
+  localKeyFilter () {
+    if (this.noCache) {
+      return ''
+    }
+    if (!['service_', 'config_'].some(c => this.tableName?.includes(c))) {
+      return ''
+    }
+    return `filter_${this.tableName}`
+  },
   localKeyPageSize () {
     if (this.noCache) {
       return ''
@@ -160,6 +169,7 @@ export const tableData = {
   downloadingProfile: false,
   saving: false,
   search: null,
+  filter: null,
   visible: false,
   defaultTemp: null,
   temp: null,
@@ -795,6 +805,13 @@ export const tableMethods = {
       this.currentRow = row
     }
   },
+  resetFilter () {
+    const filter = {}
+    this.filters?.forEach((r) => {
+      filter[r.field] = null
+    })
+    this.filter = filter
+  },
   resetSearch () {
     const search = {}
     const setSearch = (columns, parentKeys = [], currentIndex = 0) => {
@@ -1154,6 +1171,22 @@ export const tableMethods = {
         }
       }
     }
+    const filter = {}
+    for (const filterKey in this.filter) {
+      const item = this.filters.find(c => c.field === filterKey)
+      const val = this.filter[filterKey]
+      if (val === null || val === undefined) {
+        continue
+      }
+      if (typeof val === 'string' && val.trim() === '') {
+        continue
+      }
+      if (item.type === 'manyToOne') {
+        filter[filterKey] = val._id
+      } else {
+        filter[filterKey] = val
+      }
+    }
     if (this.textWhere) {
       const trigger_fields = getTriggerFields(this.textWhere)
       for (const { localKey, localVal, operation, type } of trigger_fields) {
@@ -1172,6 +1205,7 @@ export const tableMethods = {
         pageSize: this.pageSize || '20',
         currentPage: this.currentPage,
         qstatus: this.qstatus,
+        filter: JSON.stringify(filter),
         search: JSON.stringify(search),
         sorts: JSON.stringify(this.sorts),
         locale_id: this.localeId,
@@ -1196,6 +1230,9 @@ export const tableMethods = {
     if (this.localKeySearch) {
       localStorage.setItem(this.localKeySearch, JSON.stringify(this.search))
     }
+    if (this.localKeyFilter) {
+      localStorage.setItem(this.localKeyFilter, JSON.stringify(this.filter))
+    }
     if (this.currentPage === 1) {
       this.handleRefreshList()
     } else {
@@ -1212,6 +1249,7 @@ export const tableMethods = {
       }
       const localSorts = localStorage.getItem(this.localKeySort)
       const localSearch = localStorage.getItem(this.localKeySearch)
+      const localFilter = localStorage.getItem(this.localKeyFilter)
       // const localPageSize = localStorage.getItem(this.localKeyPageSize)
       if (localSorts && this.localKeySort) {
         try {
@@ -1227,6 +1265,13 @@ export const tableMethods = {
           localStorage.removeItem(this.localKeySearch)
         }
       }
+      if (localFilter && this.localKeyFilter) {
+        try {
+          this.filter = { ...this.filter, ...JSON.parse(localFilter) }
+        } catch (_) {
+          localStorage.removeItem(this.localKeyFilter)
+        }
+      }
       // if (localPageSize && this.localKeyPageSize) {
       //   try {
       //     this.pageSize = Number(localPageSize)
@@ -1255,7 +1300,9 @@ export const tableMethods = {
   },
   handleRefresh () {
     localStorage.removeItem(this.localKeySearch)
+    localStorage.removeItem(this.localKeyFilter)
     this.resetSearch()
+    this.resetFilter()
     if (!this.onlyList) {
       this.resetTemp()
     }
@@ -1326,6 +1373,7 @@ export const getAsyncData = async ({
   const { data } = await $axios.get(configUrl, { params: { sub, id, apiName, reApi } })
   if (!data) {
     return {
+      filters: null,
       configProjectId: null, project: null, table: null,
       columns: [], configTableName: null,
       configColFields: [], hasPassword: null, refColumns: [],
@@ -1351,7 +1399,8 @@ export const getAsyncData = async ({
     locales,
     isXypLog,
     columnUsers,
-    statuses
+    statuses,
+    filters
   } = data
   // console.log('data', data)
   if (!level && checkPermission) {
@@ -1599,6 +1648,7 @@ export const getAsyncData = async ({
     formReadonly,
     isXypLog,
     customExtraFields,
-    statuses
+    statuses,
+    filters
   }
 }