Showing
4 changed files
with
52 additions
and
9 deletions
| 1 | -import type { FunctionType, TransportTypeEnum } from '@/enums/datasource' | |
| 1 | +import type { DataTypeEnum, FunctionType, TransportTypeEnum } from '@/enums/datasource' | |
| 2 | 2 | |
| 3 | 3 | export interface DeviceProfileItemType { | 
| 4 | 4 | id: string | 
| ... | ... | @@ -147,6 +147,7 @@ export interface Detail { | 
| 147 | 147 | export interface DataType { | 
| 148 | 148 | type: string | 
| 149 | 149 | specs: Specs | StructJSON[] | 
| 150 | + specsList: Specs[] | |
| 150 | 151 | } | 
| 151 | 152 | |
| 152 | 153 | export interface Specs { | 
| ... | ... | @@ -158,6 +159,9 @@ export interface Specs { | 
| 158 | 159 | length?: string | 
| 159 | 160 | min: string | 
| 160 | 161 | max: string | 
| 162 | + name?: string | |
| 163 | + value?: string | |
| 164 | + dataType?: DataTypeEnum | |
| 161 | 165 | } | 
| 162 | 166 | |
| 163 | 167 | export interface ValueRange { | ... | ... | 
| ... | ... | @@ -93,6 +93,27 @@ export const getFormSchemas = ({ structJSON: structJson, required, transportType | 
| 93 | 93 | } | 
| 94 | 94 | } | 
| 95 | 95 | |
| 96 | + const createEnumSelect = ({ identifier, functionName, dataType }: StructJSON): FormSchema => { | |
| 97 | + const { specsList } = dataType || {} | |
| 98 | + | |
| 99 | + return { | |
| 100 | + field: identifier, | |
| 101 | + label: functionName, | |
| 102 | + component: ComponentEnum.SELECT, | |
| 103 | + rules: [ | |
| 104 | + { | |
| 105 | + required, | |
| 106 | + message: `${functionName}是必填项`, | |
| 107 | + type: 'number', | |
| 108 | + }, | |
| 109 | + ], | |
| 110 | + componentProps: { | |
| 111 | + options: specsList, | |
| 112 | + fieldNames: { label: 'name', value: 'value' }, | |
| 113 | + }, | |
| 114 | + } | |
| 115 | + } | |
| 116 | + | |
| 96 | 117 | const createStructJson = ({ identifier, functionName, dataType }: StructJSON): FormSchema => { | 
| 97 | 118 | return { | 
| 98 | 119 | field: identifier, | 
| ... | ... | @@ -129,6 +150,8 @@ export const getFormSchemas = ({ structJSON: structJson, required, transportType | 
| 129 | 150 | schemas.push(createTCPServiceCommandInput(item)) | 
| 130 | 151 | if (type === DataTypeEnum.BOOL) | 
| 131 | 152 | schemas.push(createSelect(item)) | 
| 153 | + else if (type === DataTypeEnum.ENUM) | |
| 154 | + schemas.push(createEnumSelect(item)) | |
| 132 | 155 | else if (type === DataTypeEnum.NUMBER_INT) | 
| 133 | 156 | schemas.push(createInputNumber(item)) | 
| 134 | 157 | else if (type === DataTypeEnum.NUMBER_DOUBLE) | ... | ... | 
| ... | ... | @@ -29,7 +29,7 @@ const thingsModelFormListElMap = reactive<Record<string, { el: InstanceType<type | 
| 29 | 29 | const [register, formActionType] = useForm({ | 
| 30 | 30 | schemas: getFormSchemas({ structJSON: props.inputData || [], required: props.required, transportType: props.transportType }), | 
| 31 | 31 | showActionButtonGroup: false, | 
| 32 | - // labelWidth: getLabelWidth() || 80, | |
| 32 | + labelWidth: 100, | |
| 33 | 33 | labelAlign: FormLabelAlignEnum.RIGHT, | 
| 34 | 34 | layout: FormLayoutEnum.HORIZONTAL, | 
| 35 | 35 | }) | 
| ... | ... | @@ -105,19 +105,34 @@ defineExpose<ComponentExposeType>({ | 
| 105 | 105 | <Card class="!border-2 !border-dashed" :title="title"> | 
| 106 | 106 | <BasicForm class="things-model-form" @register="register"> | 
| 107 | 107 | <template v-for="item in getStructFormItem" #[item.identifier]="{ model, field }" :key="item.identifier"> | 
| 108 | - <ThingsModelForm :ref="(el) => setFormElRef(el as InstanceType<typeof ThingsModelForm>, item) " v-model:value="model[field]" :input-data="(item.dataType?.specs as StructJSON[]) || []" :title="item.functionName" /> | |
| 108 | + <ThingsModelForm | |
| 109 | + :ref="(el) => setFormElRef(el as InstanceType<typeof ThingsModelForm>, item)" | |
| 110 | + v-model:value="model[field]" :input-data="(item.dataType?.specs as StructJSON[]) || []" | |
| 111 | + :title="item.functionName" | |
| 112 | + /> | |
| 109 | 113 | </template> | 
| 110 | 114 | </BasicForm> | 
| 111 | 115 | </Card> | 
| 112 | 116 | </template> | 
| 113 | 117 | |
| 114 | 118 | <style lang="less" scoped> | 
| 115 | - .things-model-form { | |
| 116 | - :deep(.ant-input-number) { | |
| 117 | - width: 100%; | |
| 118 | - } | |
| 119 | +.things-model-form { | |
| 120 | + :deep(.ant-input-number) { | |
| 121 | + width: 100%; | |
| 119 | 122 | } | 
| 120 | - :deep(.ant-form-item-control){ | |
| 121 | - margin-left: 6px; | |
| 123 | + | |
| 124 | + :deep(.ant-form-item-label) { | |
| 125 | + >label { | |
| 126 | + display: block; | |
| 127 | + text-align: right; | |
| 128 | + white-space: nowrap; | |
| 129 | + text-overflow: ellipsis; | |
| 130 | + overflow: hidden; | |
| 131 | + } | |
| 122 | 132 | } | 
| 133 | +} | |
| 134 | + | |
| 135 | +:deep(.ant-form-item-control) { | |
| 136 | + margin-left: 6px; | |
| 137 | +} | |
| 123 | 138 | </style> | ... | ... |