el-plus-crud 0.0.112 → 0.0.113

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -18,7 +18,7 @@ import { ICRUDConfig } from 'types'
18
18
  const defaultConf = inject('defaultConf') as ICRUDConfig
19
19
 
20
20
  const props = defineProps<{
21
- modelValue?: number | null
21
+ modelValue?: number | string | null
22
22
  field?: string
23
23
  loading?: boolean
24
24
  desc: { [key: string]: any }
@@ -28,7 +28,7 @@ const props = defineProps<{
28
28
  }>()
29
29
 
30
30
  const emits = defineEmits(['update:modelValue', 'validateThis'])
31
- const currentValue = ref(props.modelValue)
31
+ const currentValue = ref(typeof props.modelValue === 'string' ? +props.modelValue : props.modelValue)
32
32
 
33
33
  emits('update:modelValue', currentValue)
34
34
  const attrs = ref({} as any)
@@ -6,7 +6,7 @@
6
6
  {{ item[tableConfig.showSelectNameKey || 'name'] }}
7
7
  </el-tag>
8
8
  </div> -->
9
- <EleTabletHeader ref="tableHeaderRef" v-if="Object.keys(tableConfig?.toolbar || {}).length || tableConfig.tbName" v-model="toolFormData" :tbName="tableConfig.tbName" :column="tableConfig?.column || []" :size="size" :isShowRefresh="isShowRefresh" :loading="loading" :toolbar="tableConfig.toolbar" :isDialog="isDialog" @query="handelTopQuery" :queryDataFn="getListQueryData" />
9
+ <EleTabletHeader ref="tableHeaderRef" v-if="Object.keys(tableConfig?.toolbar || {}).length || tableConfig.tbName" v-model="toolFormData" :tbName="tableConfig.tbName" :column="tableConfig?.column || []" :size="size" :isShowRefresh="isShowRefresh" :loading="compLoading" :toolbar="tableConfig.toolbar" :isDialog="isDialog" @query="handelTopQuery" :queryDataFn="getListQueryData" />
10
10
 
11
11
  <!-- 中部的Tabs -->
12
12
  <div class="table-tabs-panel" v-if="tableConfig.tabConf">
@@ -29,7 +29,7 @@
29
29
  </template>
30
30
 
31
31
  <!-- 中间列表 -->
32
- <div class="el-plus-table-main" v-loading="loading">
32
+ <div class="el-plus-table-main" v-loading="compLoading">
33
33
  <template v-if="isDIYMain">
34
34
  <slot name="main" :tableData="tableData"></slot>
35
35
  </template>
@@ -66,7 +66,7 @@
66
66
  <ElPlusTableColumn v-for="(item, i) in headerColumns" :key="i" :item="item" :size="size"></ElPlusTableColumn>
67
67
 
68
68
  <!-- 空 -->
69
- <template v-if="!loading && loadingStatus === 2" #empty>
69
+ <template v-if="!compLoading && loadingStatus === 2" #empty>
70
70
  <el-empty v-if="isEmptyImg" :description="nullText" />
71
71
  <span v-else>{{ nullText }}</span>
72
72
  </template>
@@ -99,7 +99,7 @@ import { ref, reactive, onMounted, computed, watch, nextTick, useSlots, inject,
99
99
  import EleTabletHeader from './components/header.vue'
100
100
  import ElPlusTableColumn from './ElPlusTableColumn.vue'
101
101
  import { handelListColumn } from './util'
102
- import { cloneDeep } from 'lodash'
102
+ import { cloneDeep, throttle } from 'lodash'
103
103
  import { Loading } from '@element-plus/icons-vue'
104
104
  import type { TableColumnCtx } from 'element-plus'
105
105
  import { ICRUDConfig, ITableConfig, ITableTabItem, ITreeProps } from 'types'
@@ -148,6 +148,8 @@ const props = withDefaults(
148
148
  headerAlign?: 'left' | 'right' | 'center'
149
149
  // 是否使用tempId
150
150
  isTempId?: boolean
151
+ // 加载状态
152
+ loading?: boolean
151
153
  }>(),
152
154
  {
153
155
  modelValue: null,
@@ -164,7 +166,8 @@ const props = withDefaults(
164
166
  selectList: () => [],
165
167
  colMinWidth: 'auto',
166
168
  headerAlign: 'left',
167
- isTempId: true
169
+ isTempId: true,
170
+ loading: false
168
171
  }
169
172
  )
170
173
 
@@ -203,11 +206,14 @@ const selectable = computed(() => (row: any, index: number) => {
203
206
  const tableHeaderRef = ref()
204
207
 
205
208
  // 加载
206
- const loading = ref(false)
209
+ const localLoading = ref(false)
207
210
  const loadingTab = ref(!!props.tableConfig?.tabConf?.fetch)
208
211
  const listLoading = ref(false)
209
212
  const size = defaultConf.size || 'default'
210
213
 
214
+ // 最终的loading
215
+ const compLoading = computed(() => props.loading || localLoading.value)
216
+
211
217
  // 顶部查询条件数据缓存
212
218
  // const topQueryData = ref({} as any)
213
219
 
@@ -633,9 +639,9 @@ async function loadData(isInit: Boolean) {
633
639
  // }
634
640
  return false
635
641
  }
636
- if (loadingStatus.value === 1 || loading.value) return false
642
+ if (loadingStatus.value === 1 || localLoading.value) return false
637
643
  loadingStatus.value = 1
638
- loading.value = true
644
+ localLoading.value = true
639
645
  if (isInit) {
640
646
  pageInfo.current = 1
641
647
  }
@@ -644,49 +650,59 @@ async function loadData(isInit: Boolean) {
644
650
  if (props.tableConfig?.toolbar?.formConfig?.beforeRequest) {
645
651
  postData = props.tableConfig?.toolbar?.formConfig?.beforeRequest(JSON.parse(JSON.stringify(postData))) || postData
646
652
  }
647
- let dataPage = ((await props.tableConfig.fetch(postData)) || {}) as any
648
- // 这里要进行赋值操作-同时要转换相关key
649
- if (Array.isArray(dataPage)) {
650
- dataPage = { [props.tableConfig?.fetchMap?.list || 'records']: dataPage }
651
- }
652
653
  try {
653
- let dataResult = [] as any
654
- if (props.isPager) {
655
- pageInfo.total = dataPage[props.tableConfig?.fetchMap?.total || 'total'] * 1 || 0
656
- pageInfo.current = dataPage[props.tableConfig?.fetchMap?.current || 'current'] || 1
657
- dataResult = dataPage[props.tableConfig?.fetchMap?.list || 'records'] || null
658
- } else {
659
- dataResult = dataPage[props.tableConfig?.fetchMap?.list || 'records'] || null
654
+ let dataPage = ((await props.tableConfig.fetch(postData)) || {}) as any
655
+ // 这里要进行赋值操作-同时要转换相关key
656
+ if (Array.isArray(dataPage)) {
657
+ dataPage = { [props.tableConfig?.fetchMap?.list || 'records']: dataPage }
660
658
  }
659
+ try {
660
+ let dataResult = [] as any
661
+ if (props.isPager) {
662
+ pageInfo.total = dataPage[props.tableConfig?.fetchMap?.total || 'total'] * 1 || 0
663
+ pageInfo.current = dataPage[props.tableConfig?.fetchMap?.current || 'current'] || 1
664
+ dataResult = dataPage[props.tableConfig?.fetchMap?.list || 'records'] || null
665
+ } else {
666
+ dataResult = dataPage[props.tableConfig?.fetchMap?.list || 'records'] || null
667
+ }
661
668
 
662
- if (props.isTempId && Array.isArray(dataResult)) {
663
- const nowTime = new Date().getTime()
664
- dataResult.map((item, i) => {
665
- item.tempId = item[props.rowKey] || `${nowTime + i}`
666
- })
667
- }
669
+ if (props.isTempId && Array.isArray(dataResult)) {
670
+ const nowTime = new Date().getTime()
671
+ dataResult.map((item, i) => {
672
+ item.tempId = item[props.rowKey] || `${nowTime + i}`
673
+ })
674
+ }
668
675
 
669
- tableData.value = dataResult
670
- // 如果是树形结构
671
- if (props.type === 'expand') {
672
- treeIndexList.splice(0, treeIndexList.length)
673
- handelTreeIndex(tableData.value, [])
676
+ tableData.value = dataResult
677
+ // 如果是树形结构
678
+ if (props.type === 'expand') {
679
+ treeIndexList.splice(0, treeIndexList.length)
680
+ handelTreeIndex(tableData.value, [])
681
+ }
682
+ listLoading.value = false
683
+ // 通知父类
684
+ noticeInited()
685
+ nextTick(() => {
686
+ // 遍历以及选中当前页面数据
687
+ refreshTableSelect()
688
+ })
689
+ } catch (e) {
690
+ if (defaultConf.debug) {
691
+ // eslint-disable-next-line no-console
692
+ console.log('error: ', e)
693
+ }
674
694
  }
675
- listLoading.value = false
676
- nextTick(() => {
677
- // 遍历以及选中当前页面数据
678
- refreshTableSelect()
679
- })
680
695
  } catch (e) {
681
- if (defaultConf.debug) {
682
- // eslint-disable-next-line no-console
683
- console.log('error: ', e)
684
- }
696
+ console.log('fetch error: ', e)
685
697
  }
686
698
  loadingStatus.value = 2
687
- loading.value = false
699
+ localLoading.value = false
688
700
  }
689
701
 
702
+ const noticeInited = throttle(() => {
703
+ emits('inited', tableData.value)
704
+ }, 1000)
705
+
690
706
  /**
691
707
  * 渲染列表的选中项
692
708
  */
package/package-lock.json CHANGED
@@ -1,12 +1,12 @@
1
1
  {
2
2
  "name": "el-plus-crud",
3
- "version": "0.0.112",
3
+ "version": "0.0.113",
4
4
  "lockfileVersion": 3,
5
5
  "requires": true,
6
6
  "packages": {
7
7
  "": {
8
8
  "name": "el-plus-crud",
9
- "version": "0.0.112",
9
+ "version": "0.0.113",
10
10
  "license": "MIT",
11
11
  "dependencies": {
12
12
  "@element-plus/icons-vue": "^2.1.0",
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "el-plus-crud",
3
3
  "description": "采用Vue3 + TS,封装的element-plus数据驱动表单、列表组件",
4
4
  "author": "K.D.Jack",
5
- "version": "0.0.112",
5
+ "version": "0.0.113",
6
6
  "license": "MIT",
7
7
  "private": false,
8
8
  "main": "dist/el-plus-crud.mjs",
@@ -34,6 +34,7 @@
34
34
  },
35
35
  "dependencies": {
36
36
  "@element-plus/icons-vue": "^2.1.0",
37
+ "dayjs": "^1.11.10",
37
38
  "element-plus": "^2.3.6",
38
39
  "lodash": "^4.17.21",
39
40
  "vue": "^3.2.47"