style: lint格式化文件
This commit is contained in:
@ -86,7 +86,7 @@
|
||||
});
|
||||
|
||||
const getSchemas = computed<FormSchema[]>(() => {
|
||||
let schemas = (unref(getProps).schemas as any) || unref(schemaRef)
|
||||
let schemas = (unref(getProps).schemas as any) || unref(schemaRef);
|
||||
getComponent(schemas);
|
||||
return schemas;
|
||||
});
|
||||
@ -255,7 +255,7 @@
|
||||
|
||||
function setComponentDefault(item) {
|
||||
if ((staticDataComponents.includes(item.component) && (item.componentProps as any)?.datasourceType === 'staticData') || (needDicDefaultValue.includes(item.type) && (item.componentProps as any)?.datasourceType === 'dic')) {
|
||||
if(formModel[item.field]==undefined) {
|
||||
if (formModel[item.field] == undefined) {
|
||||
let { defaultSelect } = item.componentProps as any;
|
||||
formModel[item.field] = defaultSelect;
|
||||
}
|
||||
@ -281,7 +281,7 @@
|
||||
}
|
||||
return;
|
||||
} else {
|
||||
if(formModel[item.field]==undefined){
|
||||
if (formModel[item.field] == undefined) {
|
||||
formModel[item.field] = item.component === 'SubForm' ? [] : defaultValue;
|
||||
}
|
||||
return;
|
||||
@ -420,7 +420,7 @@
|
||||
* 为了保证表单赋值触发所有组件的change事件
|
||||
*/
|
||||
const executeEvent = (allSchemas: FormSchema[] = []) => {
|
||||
if(!allSchemas) return;
|
||||
if (!allSchemas) return;
|
||||
for (const schema of allSchemas) {
|
||||
//如果是这几个组件 需要查询子级
|
||||
if (['Card', 'Tab', 'Grid'].includes(schema.component)) {
|
||||
|
||||
@ -407,7 +407,7 @@
|
||||
* 为了保证表单赋值触发所有组件的change事件
|
||||
*/
|
||||
const executeEvent = (allSchemas: FormSchema[] = []) => {
|
||||
if(!allSchemas) return;
|
||||
if (!allSchemas) return;
|
||||
for (const schema of allSchemas) {
|
||||
//如果是这几个组件 需要查询子级
|
||||
if (['Card', 'Tab', 'Grid'].includes(schema.component)) {
|
||||
|
||||
@ -1,87 +1,74 @@
|
||||
<template>
|
||||
<div>
|
||||
<Col v-for="(col, colIndex) in children" :key="colIndex" :span="col.span">
|
||||
<template v-for="(schema, key) in col.list" :key="key">
|
||||
<template v-if="schema.component.includes('Range')">
|
||||
<SimpleFormItem
|
||||
:schema="schema"
|
||||
:value="
|
||||
convertToDayjs(
|
||||
formModel[spiltRangeDateField(schema.field)[0]],
|
||||
formModel[spiltRangeDateField(schema.field)[1]],
|
||||
)
|
||||
"
|
||||
:form-props="formProps"
|
||||
v-model:value="formModel[schema.field]"
|
||||
v-model:startTime="formModel[spiltRangeDateField(schema.field)[0]]"
|
||||
v-model:endTime="formModel[spiltRangeDateField(schema.field)[1]]"
|
||||
/>
|
||||
</template>
|
||||
<template v-else>
|
||||
<SimpleFormItem
|
||||
:schema="schema"
|
||||
:form-props="formProps"
|
||||
v-model:value="formModel[schema.field]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</Col>
|
||||
</div>
|
||||
<div>
|
||||
<Col v-for="(col, colIndex) in children" :key="colIndex" :span="col.span">
|
||||
<template v-for="(schema, key) in col.list" :key="key">
|
||||
<template v-if="schema.component.includes('Range')">
|
||||
<SimpleFormItem
|
||||
:schema="schema"
|
||||
:value="convertToDayjs(formModel[spiltRangeDateField(schema.field)[0]], formModel[spiltRangeDateField(schema.field)[1]])"
|
||||
:form-props="formProps"
|
||||
v-model:value="formModel[schema.field]"
|
||||
v-model:startTime="formModel[spiltRangeDateField(schema.field)[0]]"
|
||||
v-model:endTime="formModel[spiltRangeDateField(schema.field)[1]]"
|
||||
/>
|
||||
</template>
|
||||
<template v-else>
|
||||
<SimpleFormItem :schema="schema" :form-props="formProps" v-model:value="formModel[schema.field]" />
|
||||
</template>
|
||||
</template>
|
||||
</Col>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { Col } from 'ant-design-vue';
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
import { trim } from 'lodash-es';
|
||||
import { reactive, watch } from 'vue';
|
||||
import SimpleFormItem from './SimpleFormItem.vue';
|
||||
import { FormSchema, GridComponentProps, FormProps } from '/@/components/Form';
|
||||
import { Col } from 'ant-design-vue';
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
import { trim } from 'lodash-es';
|
||||
import { reactive, watch } from 'vue';
|
||||
import SimpleFormItem from './SimpleFormItem.vue';
|
||||
import { FormSchema, GridComponentProps, FormProps } from '/@/components/Form';
|
||||
|
||||
const props = defineProps({
|
||||
// 表单配置规则
|
||||
config: {
|
||||
type: Object as PropType<FormSchema>,
|
||||
default: () => {},
|
||||
},
|
||||
//整个表单配置
|
||||
formProps: {
|
||||
type: Object as PropType<FormProps>,
|
||||
default: () => ({}),
|
||||
},
|
||||
//子组件
|
||||
children: {
|
||||
type: Array as PropType<GridComponentProps[]>,
|
||||
default: () => [],
|
||||
},
|
||||
//表单数据
|
||||
formModel: {
|
||||
type: Object as PropType<Recordable>,
|
||||
default: () => {},
|
||||
},
|
||||
});
|
||||
const props = defineProps({
|
||||
// 表单配置规则
|
||||
config: {
|
||||
type: Object as PropType<FormSchema>,
|
||||
default: () => {}
|
||||
},
|
||||
//整个表单配置
|
||||
formProps: {
|
||||
type: Object as PropType<FormProps>,
|
||||
default: () => ({})
|
||||
},
|
||||
//子组件
|
||||
children: {
|
||||
type: Array as PropType<GridComponentProps[]>,
|
||||
default: () => []
|
||||
},
|
||||
//表单数据
|
||||
formModel: {
|
||||
type: Object as PropType<Recordable>,
|
||||
default: () => {}
|
||||
}
|
||||
});
|
||||
|
||||
const formModel = reactive<Recordable>(props.formModel);
|
||||
const formModel = reactive<Recordable>(props.formModel);
|
||||
|
||||
/**
|
||||
* 当有range组件 schema的field格式为 startTime,endTime 默认逗号隔开 开始时间在前 结束时间在后
|
||||
*/
|
||||
const spiltRangeDateField = (field: string): string[] => {
|
||||
return field.split(',').map(trim);
|
||||
};
|
||||
/**
|
||||
* 当有range组件 schema的field格式为 startTime,endTime 默认逗号隔开 开始时间在前 结束时间在后
|
||||
*/
|
||||
const spiltRangeDateField = (field: string): string[] => {
|
||||
return field.split(',').map(trim);
|
||||
};
|
||||
|
||||
const convertToDayjs = (
|
||||
startTime: string,
|
||||
endTime: string,
|
||||
format = 'YYYY-MM-DD',
|
||||
): [Dayjs, Dayjs] => {
|
||||
return [dayjs(startTime, format), dayjs(endTime, format)];
|
||||
};
|
||||
const convertToDayjs = (startTime: string, endTime: string, format = 'YYYY-MM-DD'): [Dayjs, Dayjs] => {
|
||||
return [dayjs(startTime, format), dayjs(endTime, format)];
|
||||
};
|
||||
|
||||
const emit = defineEmits(['update:formModel']);
|
||||
const emit = defineEmits(['update:formModel']);
|
||||
|
||||
watch(
|
||||
() => formModel,
|
||||
() => {
|
||||
emit('update:formModel', formModel);
|
||||
},
|
||||
);
|
||||
watch(
|
||||
() => formModel,
|
||||
() => {
|
||||
emit('update:formModel', formModel);
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
@ -32,7 +32,7 @@
|
||||
:name="schema.field"
|
||||
:wrapperCol="itemLabelWidthProp.wrapperCol"
|
||||
:style="{
|
||||
overflow:'hidden'
|
||||
overflow: 'hidden'
|
||||
}"
|
||||
>
|
||||
<component :is="formComponent(schema)" v-model:value="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size" v-bind="schema.componentProps" />
|
||||
@ -87,7 +87,7 @@
|
||||
:wrapperCol="itemLabelWidthProp.wrapperCol"
|
||||
>
|
||||
<template v-if="getDisable && readonlySupport(schema.component)">
|
||||
<readonly :schema="schema" :model="formModel"/>
|
||||
<readonly :schema="schema" :model="formModel" />
|
||||
<component
|
||||
:is="componentMap.get(schema.component)"
|
||||
v-show="false"
|
||||
@ -171,7 +171,16 @@
|
||||
<readonly :schema="schema" :value="formModel![schema.field]" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<component :is="defaultComponent(schema)" :key="refreshFieldObj[schema.field]" v-model:value="formModel![schema.field]" :disabled="getDisable" :formData="formModel" :size="formProps?.size" v-bind="{...getComponentsProps, placeholder: getDisable ? '' : getComponentsProps.placeholder, disabledShowBorder: getDisabledShowBorder}" :title="readonlySupport(schema.component) ? formModel![schema.field] : ''"/>
|
||||
<component
|
||||
:is="defaultComponent(schema)"
|
||||
:key="refreshFieldObj[schema.field]"
|
||||
v-model:value="formModel![schema.field]"
|
||||
:disabled="getDisable"
|
||||
:formData="formModel"
|
||||
:size="formProps?.size"
|
||||
v-bind="{ ...getComponentsProps, placeholder: getDisable ? '' : getComponentsProps.placeholder, disabledShowBorder: getDisabledShowBorder }"
|
||||
:title="readonlySupport(schema.component) ? formModel![schema.field] : ''"
|
||||
/>
|
||||
</template>
|
||||
</FormItem>
|
||||
</template>
|
||||
@ -267,15 +276,15 @@
|
||||
});
|
||||
|
||||
const getDisabledShowBorder = computed(() => {
|
||||
let disabledShowBorder = false
|
||||
let disabledShowBorder = false;
|
||||
if (getComponentsProps.value?.disabledShowBorder) {
|
||||
disabledShowBorder = true;
|
||||
}
|
||||
if(import.meta.env?.VITE_GLOB_READ_ONLY_BORDER_DISABLED) {
|
||||
disabledShowBorder = import.meta.env?.VITE_GLOB_READ_ONLY_BORDER_DISABLED == 'true'
|
||||
if (import.meta.env?.VITE_GLOB_READ_ONLY_BORDER_DISABLED) {
|
||||
disabledShowBorder = import.meta.env?.VITE_GLOB_READ_ONLY_BORDER_DISABLED == 'true';
|
||||
}
|
||||
return disabledShowBorder
|
||||
})
|
||||
return disabledShowBorder;
|
||||
});
|
||||
|
||||
const getComponentsProps = computed(() => {
|
||||
let { componentProps = {} } = props.schema;
|
||||
@ -428,7 +437,7 @@
|
||||
|
||||
if (isFunction(componentProps?.isShow)) {
|
||||
isShow = componentProps.isShow({
|
||||
values:formModel![schema.field],
|
||||
values: formModel![schema.field],
|
||||
model: formModel!,
|
||||
schema: schema,
|
||||
field: schema.field
|
||||
@ -448,7 +457,7 @@
|
||||
}
|
||||
if (isFunction(show)) {
|
||||
isShow = show({
|
||||
values:formModel![schema.field],
|
||||
values: formModel![schema.field],
|
||||
model: formModel!,
|
||||
schema: schema,
|
||||
field: schema.field
|
||||
|
||||
Reference in New Issue
Block a user