diff --git a/src/components/common-autocomplete/index.vue b/src/components/common-autocomplete/index.vue
index 11da421..03bbb65 100644
--- a/src/components/common-autocomplete/index.vue
+++ b/src/components/common-autocomplete/index.vue
@@ -51,7 +51,7 @@ const props = defineProps({
},
inputWidth: {
type: String,
- default: '200px'
+ default: ''
},
autocompleteConfig: {
type: Object,
@@ -194,10 +194,21 @@ const onInputKeywords = debounce((input) => {
}
}, props.debounceTime)
+const calcDefaultLabelFunc = () => {
+ if (!props.useIdModel) {
+ const value = props.modelValue
+ return value && isObject(value) ? value[labelProp.value] : ''
+ }
+ return props.defaultLabel
+}
+
+const calcDefaultLabel = computed(calcDefaultLabelFunc)
+
onMounted(() => {
onClickOutside(autocompletePopover.value?.popperRef?.contentRef, () => {
popoverVisible.value = false
})
+ setAutocompleteLabel(calcDefaultLabel.value)
})
watch(() => popoverVisible.value, (val) => {
@@ -211,7 +222,6 @@ watch(() => popoverVisible.value, (val) => {
})
watch(() => props.modelValue, (value) => {
- console.info('=====================value', value)
if (!props.useIdModel) {
setAutocompleteLabel(value && isObject(value) ? value[labelProp.value] : '')
if (isEmpty(value)) {
@@ -220,13 +230,7 @@ watch(() => props.modelValue, (value) => {
}
})
-watch(() => {
- if (!props.useIdModel) {
- const value = props.modelValue
- return value && isObject(value) ? value[labelProp.value] : ''
- }
- return props.defaultLabel
-}, (label) => {
+watch(calcDefaultLabelFunc, (label) => {
setAutocompleteLabel(label)
})
@@ -287,7 +291,6 @@ const moveSelection = function (down) {
currentOnIndex.value = -1
currentOnRow.value = null
}
- console.info('=================', tableRef.value.table, currentOnIndex.value, currentOnRow.value)
tableRef.value.table?.setCurrentRow(currentOnRow.value)
}
diff --git a/src/components/common-form-control/index.vue b/src/components/common-form-control/index.vue
index b744d6a..6b77616 100644
--- a/src/components/common-form-control/index.vue
+++ b/src/components/common-form-control/index.vue
@@ -5,6 +5,7 @@ import ControlChild from '@/components/common-form-control/control-child.vue'
import { useInputType } from '@/components/utils'
import cloneDeep from 'lodash/cloneDeep'
import { get, set } from 'lodash'
+import dayjs from 'dayjs'
/**
* @type {{option:CommonFormOption}}
@@ -38,9 +39,40 @@ const modelAttrs = computed(() => {
if (inputType.value === 'common-autocomplete' && option.getAutocompleteLabel) {
attrs.defaultLabel = option.getAutocompleteLabel(props.model, option)
}
+ if (inputType.value === 'el-date-picker') {
+ attrs.disabledDate = (date) => {
+ const option = props.option
+ let result = false
+ if (option.minDate) {
+ result = date.getTime() < dayjs(option.minDate).startOf('d').toDate().getTime()
+ }
+ if (result && option.maxDate) {
+ result = date.getTime() > dayjs(option.maxDate).startOf('d').toDate().getTime()
+ }
+ return result
+ }
+ }
+ attrs.defaultValue = modelValue.value || option.minDate
return attrs
})
+watch(() => [inputType.value, props.option.minDate, props.option.maxDate], ([type, minDate, maxDate]) => {
+ const option = props.option
+ const date = modelValue.value
+ if (type === 'el-date-picker' && date && !option.disabled && option.clearInvalidDate !== false) {
+ let invalid = false
+ if (minDate) {
+ invalid = date.getTime() < dayjs(option.minDate).startOf('d').toDate().getTime()
+ }
+ if (invalid && maxDate) {
+ invalid = date.getTime() > dayjs(option.maxDate).startOf('d').toDate().getTime()
+ }
+ if (invalid) {
+ modelValue.value = undefined
+ }
+ }
+})
+
const label = computed(() => {
const option = props.option
if (option.labelKey) {
@@ -142,6 +174,12 @@ const controlChange = (...args) => {
const formItemEnabled = computed(() => props.option.enabled !== false)
+const controlLabelWidth = computed(() => {
+ const option = props.option
+ const labelWidth = props.labelWidth
+ return option.labelWidth || modelAttrs.value.labelWidth || labelWidth
+})
+
@@ -150,13 +188,15 @@ const formItemEnabled = computed(() => props.option.enabled !== false)
ref="formItemRef"
:rules="rules"
:prop="option.prop"
- :label-width="labelWidth"
+ :label-width="controlLabelWidth"
+ v-bind="$attrs"
>
- {{ label }}
+
+ {{ label }}
props.option.enabled !== false)
/>
+
diff --git a/src/components/common-form/index.vue b/src/components/common-form/index.vue
index 63d6c37..fc2f03c 100644
--- a/src/components/common-form/index.vue
+++ b/src/components/common-form/index.vue
@@ -23,6 +23,14 @@ const props = defineProps({
type: Object,
default: null
},
+ className: {
+ type: String,
+ default: 'common-form'
+ },
+ buttonStyle: {
+ type: [String, Object],
+ default: ''
+ },
validateOnRuleChange: {
type: Boolean,
default: false
@@ -78,7 +86,7 @@ defineExpose({
-
+
-import { formatDate } from '@/components/utils'
+import { formatDate } from '@/utils'
import { computed } from 'vue'
import { get } from 'lodash'
diff --git a/src/components/utils/index.js b/src/components/utils/index.js
index 0cff6b5..6c767b5 100644
--- a/src/components/utils/index.js
+++ b/src/components/utils/index.js
@@ -1,6 +1,5 @@
import { ref } from 'vue'
import { $i18nBundle } from '@/messages'
-import dayjs from 'dayjs'
const calcWithIf = menuItem => {
['icon', 'labelKey', 'label', 'html'].forEach(key => {
@@ -74,15 +73,3 @@ export const useParentRoute = function (route) {
}
return route
}
-
-export const formatDate = (date, format) => {
- if (date) {
- return dayjs(date).format(format || 'YYYY-MM-DD HH:mm:ss')
- }
-}
-
-export const formatDay = (date, format) => {
- if (date) {
- return dayjs(date).format(format || 'YYYY-MM-DD')
- }
-}