el-plus-crud 0.0.74 → 0.0.76

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.
Files changed (31) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/dist/el-plus-crud.mjs +10 -10
  3. package/example/App.vue +69 -68
  4. package/lib/components/el-plus-form/ElPlusForm.vue +2 -1
  5. package/lib/components/el-plus-form/ElPlusFormDialog.vue +90 -89
  6. package/lib/components/el-plus-form/ElPlusFormGroup.vue +2 -1
  7. package/lib/components/el-plus-form/components/ElPlusFormBtn.vue +2 -1
  8. package/lib/components/el-plus-form/components/ElPlusFormBtns.vue +2 -1
  9. package/lib/components/el-plus-form/components/ElPlusFormFile.vue +49 -48
  10. package/lib/components/el-plus-form/components/ElPlusFormInput.vue +64 -63
  11. package/lib/components/el-plus-form/components/ElPlusFormLink.vue +284 -283
  12. package/lib/components/el-plus-form/components/ElPlusFormLkuser.vue +492 -491
  13. package/lib/components/el-plus-form/components/ElPlusFormNumber.vue +149 -148
  14. package/lib/components/el-plus-form/components/ElPlusFormPassword.vue +46 -45
  15. package/lib/components/el-plus-form/components/ElPlusFormQuickInput.vue +98 -97
  16. package/lib/components/el-plus-form/components/ElPlusFormSelect.vue +164 -163
  17. package/lib/components/el-plus-form/components/ElPlusFormTextarea.vue +52 -51
  18. package/lib/components/el-plus-form/components/ElPlusFormUpbtn.vue +146 -145
  19. package/lib/components/el-plus-form/components/ElPlusFormUpload.vue +371 -370
  20. package/lib/components/el-plus-form/components/components/file-icons/FileIcons.vue +137 -136
  21. package/lib/components/el-plus-table/ElPlusTable.vue +2 -1
  22. package/lib/components/el-plus-table/components/columnItem.vue +214 -213
  23. package/lib/components/el-plus-table/components/header.vue +2 -1
  24. package/lib/components/el-plus-table/components/settingColumn.vue +180 -179
  25. package/lib/components/el-plus-table/util/index.ts +148 -148
  26. package/lib/config/index.ts +32 -32
  27. package/lib/index.ts +52 -52
  28. package/package-lock.json +2 -2
  29. package/package.json +1 -1
  30. package/types/global.d.ts +13 -13
  31. package/types/{formList.d.ts → index.d.ts} +1 -0
@@ -1,148 +1,149 @@
1
- <template>
2
- <el-input-number v-if="isInit" class="ElPlusFormNumber-panel" v-bind="attrs" v-on="onEvents" v-model="currentValue" :disabled="disabled" @focus="handelFocus" @blur="handelBlur" onkeypress="return( /[\d\.]/.test(String.fromCharCode(event.keyCode)))" />
3
- </template>
4
- <script lang="ts">
5
- export default {
6
- name: 'ElPlusFormNumber',
7
- inheritAttrs: false,
8
- typeName: 'number',
9
- customOptions: {}
10
- }
11
- </script>
12
- <script lang="ts" setup>
13
- import { ref, computed, useAttrs, onBeforeMount, nextTick, inject } from 'vue'
14
- import { getAttrs, getEvents } from '../mixins'
15
- import { ElMessage } from 'element-plus'
16
- import { ICRUDConfig } from 'types/formList'
17
-
18
- const defaultConf = inject('defaultConf') as ICRUDConfig
19
-
20
- const props = defineProps<{
21
- modelValue?: number | null
22
- field: string
23
- loading?: boolean
24
- desc: { [key: string]: any }
25
- formData: { [key: string]: any }
26
- rowIndex?: number
27
- disabled?: boolean
28
- }>()
29
-
30
- const emits = defineEmits(['update:modelValue', 'validateThis'])
31
- const currentValue = ref(props.modelValue)
32
- emits('update:modelValue', currentValue)
33
- const attrs = ref({} as any)
34
- const isInit = ref(false)
35
- const onEvents = ref(getEvents(props))
36
-
37
- const isDoChange = ref(false)
38
-
39
- onBeforeMount(async () => {
40
- attrs.value = await getAttrs(props, { ...defaultConf.form?.leng.nbinput, ...useAttrs() })
41
- delete attrs.value.min
42
- delete attrs.value.max
43
- isInit.value = true
44
- })
45
-
46
- /**
47
- * 获取焦点
48
- */
49
- function handelFocus() {
50
- isDoChange.value = false
51
- }
52
-
53
- /**
54
- * 处理失去焦点
55
- * @param event
56
- */
57
- function handelBlur() {
58
- if (!isDoChange.value) {
59
- if (!currentValue.value) {
60
- nextTick(() => {
61
- currentValue.value = props.desc?.required ? numBindAttr.value.min : 0
62
- if (!props.desc?.required) {
63
- // 查看了源码,这里需要二次赋不一样的值,这里才会真正重新渲染
64
- nextTick(() => {
65
- currentValue.value = null
66
- })
67
- }
68
- })
69
- } else {
70
- handelValChange(currentValue.value, 0)
71
- }
72
- }
73
- nextTick(() => {
74
- emits('validateThis')
75
- })
76
- }
77
-
78
- /**
79
- * 绑定属性
80
- */
81
- const numBindAttr = computed(() => {
82
- let numAttrs = props.desc.attrs || defaultConf.form?.leng.nbinput
83
- if (typeof props.desc.attrs === 'function') {
84
- numAttrs = props.desc.attrs(props.formData)
85
- }
86
- // 这里判断一下,最小和最大值的大小
87
- if (numAttrs.min > numAttrs.max) {
88
- numAttrs.min = numAttrs.max
89
- } else if (numAttrs.max < numAttrs.min) {
90
- numAttrs.max = numAttrs.min
91
- }
92
- return numAttrs
93
- })
94
-
95
- // 判断一下初始值
96
- if (currentValue.value !== undefined && currentValue.value !== null) {
97
- if (currentValue.value < numBindAttr.value.min) {
98
- currentValue.value = numBindAttr.value.min
99
- } else if (currentValue.value > numBindAttr.value.max) {
100
- currentValue.value = numBindAttr.value.max
101
- }
102
- }
103
-
104
- const change = onEvents.value.change
105
- if (change) {
106
- onEvents.value.change = (val: any, oldVal: any) => {
107
- handelValChange(val, oldVal)
108
- }
109
- } else {
110
- onEvents.value.change = handelValChange
111
- }
112
-
113
- /**
114
- * 监听值改变
115
- * @param val
116
- */
117
- function handelValChange(val: any, oldVal: any) {
118
- isDoChange.value = true
119
- if (val !== oldVal) {
120
- if (val < numBindAttr.value.min) {
121
- ElMessage.warning(`${props.desc?.label || ''}最少不能低于${numBindAttr.value.min}`)
122
- nextTick(() => {
123
- currentValue.value = numBindAttr.value.min
124
- })
125
- } else if (val > numBindAttr.value.max) {
126
- ElMessage.warning(`${props.desc?.label || ''}最多不能大于${numBindAttr.value.max}`)
127
- nextTick(() => {
128
- currentValue.value = numBindAttr.value.max
129
- change && change()
130
- })
131
- } else {
132
- change && change()
133
- }
134
- }
135
- }
136
- </script>
137
- <style lang="scss" scoped>
138
- .ElPlusFormNumber-panel {
139
- width: 100% !important;
140
- max-width: 100%;
141
- :deep(.el-input__wrapper) {
142
- // padding-left: 11px !important;
143
- input {
144
- text-align: left !important;
145
- }
146
- }
147
- }
148
- </style>
1
+ <template>
2
+ <el-input-number v-if="isInit" class="ElPlusFormNumber-panel" v-bind="attrs" v-on="onEvents" v-model="currentValue" :disabled="disabled" @focus="handelFocus" @blur="handelBlur" onkeypress="return( /[\d\.]/.test(String.fromCharCode(event.keyCode)))" />
3
+ </template>
4
+ <script lang="ts">
5
+ export default {
6
+ name: 'ElPlusFormNumber',
7
+ inheritAttrs: false,
8
+ typeName: 'number',
9
+ customOptions: {}
10
+ }
11
+ </script>
12
+ <script lang="ts" setup>
13
+ import { ref, computed, useAttrs, onBeforeMount, nextTick, inject } from 'vue'
14
+ import { getAttrs, getEvents } from '../mixins'
15
+ import { ElMessage } from 'element-plus'
16
+ import { ICRUDConfig } from 'types'
17
+
18
+ const defaultConf = inject('defaultConf') as ICRUDConfig
19
+
20
+ const props = defineProps<{
21
+ modelValue?: number | null
22
+ field: string
23
+ loading?: boolean
24
+ desc: { [key: string]: any }
25
+ formData: { [key: string]: any }
26
+ rowIndex?: number
27
+ disabled?: boolean
28
+ }>()
29
+
30
+ const emits = defineEmits(['update:modelValue', 'validateThis'])
31
+ const currentValue = ref(props.modelValue)
32
+ emits('update:modelValue', currentValue)
33
+ const attrs = ref({} as any)
34
+ const isInit = ref(false)
35
+ const onEvents = ref(getEvents(props))
36
+
37
+ const isDoChange = ref(false)
38
+
39
+ onBeforeMount(async () => {
40
+ attrs.value = await getAttrs(props, { ...defaultConf.form?.leng.nbinput, ...useAttrs() })
41
+ delete attrs.value.min
42
+ delete attrs.value.max
43
+ isInit.value = true
44
+ })
45
+
46
+ /**
47
+ * 获取焦点
48
+ */
49
+ function handelFocus() {
50
+ isDoChange.value = false
51
+ }
52
+
53
+ /**
54
+ * 处理失去焦点
55
+ * @param event
56
+ */
57
+ function handelBlur() {
58
+ if (!isDoChange.value) {
59
+ if (!currentValue.value) {
60
+ nextTick(() => {
61
+ currentValue.value = props.desc?.required ? numBindAttr.value.min : 0
62
+ if (!props.desc?.required) {
63
+ // 查看了源码,这里需要二次赋不一样的值,这里才会真正重新渲染
64
+ nextTick(() => {
65
+ currentValue.value = null
66
+ })
67
+ }
68
+ })
69
+ } else {
70
+ handelValChange(currentValue.value, 0)
71
+ }
72
+ }
73
+ nextTick(() => {
74
+ emits('validateThis')
75
+ })
76
+ }
77
+
78
+ /**
79
+ * 绑定属性
80
+ */
81
+ const numBindAttr = computed(() => {
82
+ let numAttrs = props.desc.attrs || defaultConf.form?.leng.nbinput
83
+ if (typeof props.desc.attrs === 'function') {
84
+ numAttrs = props.desc.attrs(props.formData)
85
+ }
86
+ // 这里判断一下,最小和最大值的大小
87
+ if (numAttrs.min > numAttrs.max) {
88
+ numAttrs.min = numAttrs.max
89
+ } else if (numAttrs.max < numAttrs.min) {
90
+ numAttrs.max = numAttrs.min
91
+ }
92
+ return numAttrs
93
+ })
94
+
95
+ // 判断一下初始值
96
+ if (currentValue.value !== undefined && currentValue.value !== null) {
97
+ if (currentValue.value < numBindAttr.value.min) {
98
+ currentValue.value = numBindAttr.value.min
99
+ } else if (currentValue.value > numBindAttr.value.max) {
100
+ currentValue.value = numBindAttr.value.max
101
+ }
102
+ }
103
+
104
+ const change = onEvents.value.change
105
+ if (change) {
106
+ onEvents.value.change = (val: any, oldVal: any) => {
107
+ handelValChange(val, oldVal)
108
+ }
109
+ } else {
110
+ onEvents.value.change = handelValChange
111
+ }
112
+
113
+ /**
114
+ * 监听值改变
115
+ * @param val
116
+ */
117
+ function handelValChange(val: any, oldVal: any) {
118
+ isDoChange.value = true
119
+ if (val !== oldVal) {
120
+ if (val < numBindAttr.value.min) {
121
+ ElMessage.warning(`${props.desc?.label || ''}最少不能低于${numBindAttr.value.min}`)
122
+ nextTick(() => {
123
+ currentValue.value = numBindAttr.value.min
124
+ })
125
+ } else if (val > numBindAttr.value.max) {
126
+ ElMessage.warning(`${props.desc?.label || ''}最多不能大于${numBindAttr.value.max}`)
127
+ nextTick(() => {
128
+ currentValue.value = numBindAttr.value.max
129
+ change && change()
130
+ })
131
+ } else {
132
+ change && change()
133
+ }
134
+ }
135
+ }
136
+ </script>
137
+ <style lang="scss" scoped>
138
+ .ElPlusFormNumber-panel {
139
+ width: 100% !important;
140
+ max-width: 100%;
141
+ :deep(.el-input__wrapper) {
142
+ // padding-left: 11px !important;
143
+ input {
144
+ text-align: left !important;
145
+ }
146
+ }
147
+ }
148
+ </style>
149
+ types
@@ -1,45 +1,46 @@
1
- <template>
2
- <el-input v-if="isInit" :class="desc.class" :show-password="true" v-bind="attrs" v-on="onEvents" v-model="currentValue" :disabled="disabled">
3
- <!-- 组件内部插槽 -->
4
- <template v-for="(item, key, index) in slots" #[key]="data" :key="index">
5
- <slot :name="key" :data="data" />
6
- </template>
7
- </el-input>
8
- </template>
9
- <script lang="ts">
10
- export default {
11
- name: 'ElPlusFormPassword',
12
- inheritAttrs: false,
13
- typeName: 'password',
14
- customOptions: {}
15
- }
16
- </script>
17
- <script lang="ts" setup>
18
- import { ref, useAttrs, useSlots, onBeforeMount, inject } from 'vue'
19
- import { getAttrs, getEvents } from '../mixins'
20
- import { ICRUDConfig } from 'types/formList'
21
-
22
- const defaultConf = inject('defaultConf') as ICRUDConfig
23
-
24
- const props = defineProps<{
25
- modelValue?: string | number | '' | null
26
- field: string
27
- loading?: boolean
28
- desc: { [key: string]: any }
29
- formData: { [key: string]: any }
30
- disabled?: boolean
31
- }>()
32
- const emits = defineEmits(['update:modelValue'])
33
- const currentValue = ref(props.modelValue)
34
- emits('update:modelValue', currentValue)
35
-
36
- const slots = ref(Object.assign({}, useSlots(), props.desc.slots))
37
- const attrs = ref({} as any)
38
- const isInit = ref(false)
39
- const onEvents = ref(getEvents(props))
40
-
41
- onBeforeMount(async () => {
42
- attrs.value = await getAttrs(props, { autocomplete: 'new-password', maxlength: defaultConf.form?.leng?.input || 0, ...useAttrs() })
43
- isInit.value = true
44
- })
45
- </script>
1
+ <template>
2
+ <el-input v-if="isInit" :class="desc.class" :show-password="true" v-bind="attrs" v-on="onEvents" v-model="currentValue" :disabled="disabled">
3
+ <!-- 组件内部插槽 -->
4
+ <template v-for="(item, key, index) in slots" #[key]="data" :key="index">
5
+ <slot :name="key" :data="data" />
6
+ </template>
7
+ </el-input>
8
+ </template>
9
+ <script lang="ts">
10
+ export default {
11
+ name: 'ElPlusFormPassword',
12
+ inheritAttrs: false,
13
+ typeName: 'password',
14
+ customOptions: {}
15
+ }
16
+ </script>
17
+ <script lang="ts" setup>
18
+ import { ref, useAttrs, useSlots, onBeforeMount, inject } from 'vue'
19
+ import { getAttrs, getEvents } from '../mixins'
20
+ import { ICRUDConfig } from 'types'
21
+
22
+ const defaultConf = inject('defaultConf') as ICRUDConfig
23
+
24
+ const props = defineProps<{
25
+ modelValue?: string | number | '' | null
26
+ field: string
27
+ loading?: boolean
28
+ desc: { [key: string]: any }
29
+ formData: { [key: string]: any }
30
+ disabled?: boolean
31
+ }>()
32
+ const emits = defineEmits(['update:modelValue'])
33
+ const currentValue = ref(props.modelValue)
34
+ emits('update:modelValue', currentValue)
35
+
36
+ const slots = ref(Object.assign({}, useSlots(), props.desc.slots))
37
+ const attrs = ref({} as any)
38
+ const isInit = ref(false)
39
+ const onEvents = ref(getEvents(props))
40
+
41
+ onBeforeMount(async () => {
42
+ attrs.value = await getAttrs(props, { autocomplete: 'new-password', maxlength: defaultConf.form?.leng?.input || 0, ...useAttrs() })
43
+ isInit.value = true
44
+ })
45
+ </script>
46
+ types
@@ -1,97 +1,98 @@
1
- <template>
2
- <el-input v-if="isInit" :class="desc.class" :style="desc.style" type="textarea" v-bind="attrs" v-model="currentValue" v-on="onEvents" :disabled="disabled"> </el-input>
3
- <div class="el-plus-form-quick-input">
4
- <el-tag v-for="(option, index) in options" :key="index" type="info" @click="changeTip(option.label)">{{ option.label }}</el-tag>
5
- </div>
6
- </template>
7
- <script lang="ts">
8
- export default {
9
- name: 'ElPlusFormQuickinput',
10
- inheritAttrs: false,
11
- typeName: 'quickinput',
12
- customOptions: {}
13
- }
14
- </script>
15
- <script lang="ts" setup>
16
- import { ref, useAttrs, watch, onBeforeMount, inject, reactive } from 'vue'
17
- import { getAttrs, getEvents } from '../mixins'
18
- import { isEqual } from 'lodash'
19
- import { ICRUDConfig } from 'types/formList'
20
-
21
- const globalData = inject('globalData') as any
22
- const defaultConf = inject('defaultConf') as ICRUDConfig
23
-
24
- const props = defineProps<{
25
- modelValue?: string | null
26
- field: string
27
- loading?: boolean
28
- desc: { [key: string]: any }
29
- formData: { [key: string]: any }
30
- disabled?: boolean
31
- }>()
32
-
33
- const emits = defineEmits(['update:modelValue', 'validateThis'])
34
- const attrs = ref({} as any)
35
- const isInit = ref(false)
36
- const onEvents = ref(getEvents(props))
37
- const options = reactive([] as any[])
38
- const currentValue = ref(props.modelValue)
39
- emits('update:modelValue', currentValue)
40
-
41
- onBeforeMount(async () => {
42
- attrs.value = await getAttrs(props, { maxlength: defaultConf.form?.leng.textare, showWordLimit: true, rows: 3, ...useAttrs() })
43
- isInit.value = true
44
- })
45
-
46
- /**
47
- *
48
- * @param text
49
- * 选中
50
- */
51
- function changeTip(text: any) {
52
- if (props.disabled) return false
53
- currentValue.value = text
54
- emits('validateThis')
55
- }
56
-
57
- watch(
58
- () => props.modelValue,
59
- (data: string | null | undefined) => {
60
- // 这里要截取一下字符串长度
61
- if (data && data.length > attrs.value.maxlength) {
62
- data = data.substring(0, attrs.value.maxlength)
63
- }
64
- currentValue.value = data
65
- },
66
- { immediate: true }
67
- )
68
- watch(
69
- () => props.desc.options,
70
- async (data) => {
71
- if (typeof data === 'string') {
72
- // // 从全局数据中获取options
73
- options.splice(0, options.length, ...(globalData[data] || []))
74
- } else if (typeof data === 'function') {
75
- options.splice(0, options.length, ...(await data(props.formData)))
76
- } else if (Array.isArray(data)) {
77
- if (data && options && !isEqual(data, options)) {
78
- options.splice(0, options.length, ...data)
79
- }
80
- } else {
81
- options.splice(0, options.length)
82
- }
83
- },
84
- { immediate: true }
85
- )
86
- </script>
87
- <style lang="scss">
88
- .el-plus-form-quick-input {
89
- width: 100%;
90
- display: flex;
91
- align-items: center;
92
- margin-top: 10px;
93
- .el-tag {
94
- margin-right: 10px;
95
- }
96
- }
97
- </style>
1
+ <template>
2
+ <el-input v-if="isInit" :class="desc.class" :style="desc.style" type="textarea" v-bind="attrs" v-model="currentValue" v-on="onEvents" :disabled="disabled"> </el-input>
3
+ <div class="el-plus-form-quick-input">
4
+ <el-tag v-for="(option, index) in options" :key="index" type="info" @click="changeTip(option.label)">{{ option.label }}</el-tag>
5
+ </div>
6
+ </template>
7
+ <script lang="ts">
8
+ export default {
9
+ name: 'ElPlusFormQuickinput',
10
+ inheritAttrs: false,
11
+ typeName: 'quickinput',
12
+ customOptions: {}
13
+ }
14
+ </script>
15
+ <script lang="ts" setup>
16
+ import { ref, useAttrs, watch, onBeforeMount, inject, reactive } from 'vue'
17
+ import { getAttrs, getEvents } from '../mixins'
18
+ import { isEqual } from 'lodash'
19
+ import { ICRUDConfig } from 'types'
20
+
21
+ const globalData = inject('globalData') as any
22
+ const defaultConf = inject('defaultConf') as ICRUDConfig
23
+
24
+ const props = defineProps<{
25
+ modelValue?: string | null
26
+ field: string
27
+ loading?: boolean
28
+ desc: { [key: string]: any }
29
+ formData: { [key: string]: any }
30
+ disabled?: boolean
31
+ }>()
32
+
33
+ const emits = defineEmits(['update:modelValue', 'validateThis'])
34
+ const attrs = ref({} as any)
35
+ const isInit = ref(false)
36
+ const onEvents = ref(getEvents(props))
37
+ const options = reactive([] as any[])
38
+ const currentValue = ref(props.modelValue)
39
+ emits('update:modelValue', currentValue)
40
+
41
+ onBeforeMount(async () => {
42
+ attrs.value = await getAttrs(props, { maxlength: defaultConf.form?.leng.textare, showWordLimit: true, rows: 3, ...useAttrs() })
43
+ isInit.value = true
44
+ })
45
+
46
+ /**
47
+ *
48
+ * @param text
49
+ * 选中
50
+ */
51
+ function changeTip(text: any) {
52
+ if (props.disabled) return false
53
+ currentValue.value = text
54
+ emits('validateThis')
55
+ }
56
+
57
+ watch(
58
+ () => props.modelValue,
59
+ (data: string | null | undefined) => {
60
+ // 这里要截取一下字符串长度
61
+ if (data && data.length > attrs.value.maxlength) {
62
+ data = data.substring(0, attrs.value.maxlength)
63
+ }
64
+ currentValue.value = data
65
+ },
66
+ { immediate: true }
67
+ )
68
+ watch(
69
+ () => props.desc.options,
70
+ async (data) => {
71
+ if (typeof data === 'string') {
72
+ // // 从全局数据中获取options
73
+ options.splice(0, options.length, ...(globalData[data] || []))
74
+ } else if (typeof data === 'function') {
75
+ options.splice(0, options.length, ...(await data(props.formData)))
76
+ } else if (Array.isArray(data)) {
77
+ if (data && options && !isEqual(data, options)) {
78
+ options.splice(0, options.length, ...data)
79
+ }
80
+ } else {
81
+ options.splice(0, options.length)
82
+ }
83
+ },
84
+ { immediate: true }
85
+ )
86
+ </script>
87
+ <style lang="scss">
88
+ .el-plus-form-quick-input {
89
+ width: 100%;
90
+ display: flex;
91
+ align-items: center;
92
+ margin-top: 10px;
93
+ .el-tag {
94
+ margin-right: 10px;
95
+ }
96
+ }
97
+ </style>
98
+ types