Commit cbf9e17eafbede086634ccd8ffe6c776d0fea1a1
Merge branch 'ww' into 'main'
fix: BUG in teambition See merge request huang/yun-teng-iot-front!300
Showing
7 changed files
with
67 additions
and
27 deletions
| ... | ... | @@ -122,11 +122,11 @@ export const addDataComponent = (params: AddDataComponentParams) => { | 
| 122 | 122 | * @param params | 
| 123 | 123 | * @returns | 
| 124 | 124 | */ | 
| 125 | -export const deleteDataComponent = (params: string[]) => { | |
| 125 | +export const deleteDataComponent = (params: string) => { | |
| 126 | 126 | return defHttp.delete({ | 
| 127 | - url: DataComponentUrl.DELETE_DATA_COMPONENT, | |
| 127 | + url: `${DataComponentUrl.DELETE_DATA_COMPONENT}/${params}`, | |
| 128 | 128 | params: { | 
| 129 | - ids: params, | |
| 129 | + ids: [params], | |
| 130 | 130 | }, | 
| 131 | 131 | }); | 
| 132 | 132 | }; | ... | ... | 
| ... | ... | @@ -65,7 +65,7 @@ | 
| 65 | 65 | <Tooltip :title="item.deviceName" placement="topLeft"> | 
| 66 | 66 | <span> | 
| 67 | 67 | <SvgIcon name="" prefix="iconfont" class="!fill-emerald-400" /> | 
| 68 | - <span>{{ item.deviceName }}</span> | |
| 68 | + <span>{{ item.deviceRename || item.deviceName }}</span> | |
| 69 | 69 | </span> | 
| 70 | 70 | </Tooltip> | 
| 71 | 71 | </div> | ... | ... | 
| ... | ... | @@ -26,10 +26,6 @@ | 
| 26 | 26 | |
| 27 | 27 | const { createMessage } = useMessage(); | 
| 28 | 28 | |
| 29 | - // const componentRecord = reactive<DataBoardLayoutInfo>({ | |
| 30 | - // ...props.record, | |
| 31 | - // } as unknown as DataBoardLayoutInfo); | |
| 32 | - | |
| 33 | 29 | const dataSource = ref<DataSourceEl[]>([ | 
| 34 | 30 | { id: buildUUID(), componentInfo: props.defaultConfig || {} } as unknown as DataSourceEl, | 
| 35 | 31 | ]); | 
| ... | ... | @@ -49,6 +45,11 @@ | 
| 49 | 45 | } | 
| 50 | 46 | }; | 
| 51 | 47 | |
| 48 | + const validate = async () => { | |
| 49 | + await basicMethod.validate(); | |
| 50 | + await validateDataSourceField(); | |
| 51 | + }; | |
| 52 | + | |
| 52 | 53 | const getAllDataSourceFieldValue = () => { | 
| 53 | 54 | const _dataSource = getDataSourceField(); | 
| 54 | 55 | const basicInfo = basicMethod.getFieldsValue(); | 
| ... | ... | @@ -58,6 +59,16 @@ | 
| 58 | 59 | }; | 
| 59 | 60 | }; | 
| 60 | 61 | |
| 62 | + const validateDataSourceField = async () => { | |
| 63 | + const hasExistEl = Object.keys(dataSourceEl).filter((key) => dataSourceEl[key]); | |
| 64 | + const _dataSource: boolean[] = []; | |
| 65 | + for (const id of hasExistEl) { | |
| 66 | + const flag = (await (dataSourceEl[id] as FormActionType).validate()) as boolean; | |
| 67 | + _dataSource.push(flag); | |
| 68 | + } | |
| 69 | + return _dataSource; | |
| 70 | + }; | |
| 71 | + | |
| 61 | 72 | const getDataSourceField = () => { | 
| 62 | 73 | const hasExistEl = Object.keys(dataSourceEl).filter((key) => dataSourceEl[key]); | 
| 63 | 74 | const _dataSource: DataSource[] = []; | 
| ... | ... | @@ -66,7 +77,7 @@ | 
| 66 | 77 | const value = (dataSourceEl[id] as FormActionType).getFieldsValue() as DataSource; | 
| 67 | 78 | if (!~index) continue; | 
| 68 | 79 | const componentInfo = unref(dataSource)[index].componentInfo || {}; | 
| 69 | - _dataSource.push({ | |
| 80 | + _dataSource.unshift({ | |
| 70 | 81 | ...value, | 
| 71 | 82 | componentInfo: { ...(props.defaultConfig || {}), ...componentInfo }, | 
| 72 | 83 | }); | 
| ... | ... | @@ -90,6 +101,7 @@ | 
| 90 | 101 | }); | 
| 91 | 102 | await nextTick(); | 
| 92 | 103 | (dataSourceEl[copyRecordId] as FormActionType).setFieldsValue(value); | 
| 104 | + (dataSourceEl[copyRecordId] as FormActionType).clearValidate(); | |
| 93 | 105 | }; | 
| 94 | 106 | |
| 95 | 107 | const [registerVisualOptionModal, { openModal }] = useModal(); | 
| ... | ... | @@ -128,6 +140,7 @@ | 
| 128 | 140 | |
| 129 | 141 | const echoDataSource = () => { | 
| 130 | 142 | basicMethod.setFieldsValue(props.record.record); | 
| 143 | + basicMethod.clearValidate(); | |
| 131 | 144 | dataSource.value = []; | 
| 132 | 145 | dataSource.value = props.record.record.dataSource.map((item) => { | 
| 133 | 146 | const id = buildUUID(); | 
| ... | ... | @@ -139,6 +152,7 @@ | 
| 139 | 152 | |
| 140 | 153 | nextTick(() => { | 
| 141 | 154 | (dataSourceEl[id] as FormActionType).setFieldsValue(item); | 
| 155 | + (dataSourceEl[id] as FormActionType).clearValidate(); | |
| 142 | 156 | }); | 
| 143 | 157 | return { | 
| 144 | 158 | id, | 
| ... | ... | @@ -165,6 +179,7 @@ | 
| 165 | 179 | |
| 166 | 180 | defineExpose({ | 
| 167 | 181 | getAllDataSourceFieldValue, | 
| 182 | + validate, | |
| 168 | 183 | }); | 
| 169 | 184 | </script> | 
| 170 | 185 | ... | ... | 
| ... | ... | @@ -44,6 +44,7 @@ | 
| 44 | 44 | |
| 45 | 45 | const basicConfigurationEl = ref<{ | 
| 46 | 46 | getAllDataSourceFieldValue: Fn<any, Recordable>; | 
| 47 | + validate: Fn; | |
| 47 | 48 | }>(); | 
| 48 | 49 | |
| 49 | 50 | const resetForm = () => { | 
| ... | ... | @@ -53,8 +54,9 @@ | 
| 53 | 54 | componentDefaultConfig.value = {}; | 
| 54 | 55 | }; | 
| 55 | 56 | |
| 56 | - const handleSubmit = () => { | |
| 57 | - const { getAllDataSourceFieldValue } = unref(basicConfigurationEl)!; | |
| 57 | + const handleSubmit = async () => { | |
| 58 | + const { getAllDataSourceFieldValue, validate } = unref(basicConfigurationEl)!; | |
| 59 | + await validate(); | |
| 58 | 60 | const value = getAllDataSourceFieldValue(); | 
| 59 | 61 | unref(isEdit) ? handleUpdateComponent(value) : handleAddComponent(value); | 
| 60 | 62 | resetForm(); | ... | ... | 
| ... | ... | @@ -32,6 +32,7 @@ export const basicSchema: FormSchema[] = [ | 
| 32 | 32 | field: BasicConfigField.NAME, | 
| 33 | 33 | label: '组件名称', | 
| 34 | 34 | component: 'Input', | 
| 35 | + rules: [{ required: true, message: '组件名称为必填项' }], | |
| 35 | 36 | componentProps: { | 
| 36 | 37 | placeholder: '请输入组件名称', | 
| 37 | 38 | }, | 
| ... | ... | @@ -40,6 +41,7 @@ export const basicSchema: FormSchema[] = [ | 
| 40 | 41 | field: BasicConfigField.REMARK, | 
| 41 | 42 | label: '组件备注', | 
| 42 | 43 | component: 'InputTextArea', | 
| 44 | + // rules: [{ required: true, message: '组件备注为必填项' }], | |
| 43 | 45 | componentProps: { | 
| 44 | 46 | placeholder: '请输入组件备注', | 
| 45 | 47 | }, | 
| ... | ... | @@ -64,6 +66,7 @@ export const dataSourceSchema: FormSchema[] = [ | 
| 64 | 66 | component: 'ApiTreeSelect', | 
| 65 | 67 | label: '组织', | 
| 66 | 68 | colProps: { span: 8 }, | 
| 69 | + rules: [{ required: true, message: '组织为必填项' }], | |
| 67 | 70 | componentProps({ formActionType }) { | 
| 68 | 71 | const { setFieldsValue } = formActionType; | 
| 69 | 72 | return { | 
| ... | ... | @@ -90,6 +93,7 @@ export const dataSourceSchema: FormSchema[] = [ | 
| 90 | 93 | component: 'ApiSelect', | 
| 91 | 94 | label: '设备', | 
| 92 | 95 | colProps: { span: 8 }, | 
| 96 | + rules: [{ required: true, message: '设备名称为必填项' }], | |
| 93 | 97 | componentProps({ formModel, formActionType }) { | 
| 94 | 98 | const { setFieldsValue } = formActionType; | 
| 95 | 99 | const organizationId = formModel[DataSourceField.ORIGINATION_ID]; | 
| ... | ... | @@ -126,6 +130,7 @@ export const dataSourceSchema: FormSchema[] = [ | 
| 126 | 130 | label: '网关子设备', | 
| 127 | 131 | component: 'ApiSelect', | 
| 128 | 132 | colProps: { span: 8 }, | 
| 133 | + rules: [{ required: true, message: '网关子设备为必填项' }], | |
| 129 | 134 | ifShow({ model }) { | 
| 130 | 135 | return model[DataSourceField.IS_GATEWAY_DEVICE]; | 
| 131 | 136 | }, | 
| ... | ... | @@ -168,6 +173,7 @@ export const dataSourceSchema: FormSchema[] = [ | 
| 168 | 173 | component: 'ApiSelect', | 
| 169 | 174 | label: '属性', | 
| 170 | 175 | colProps: { span: 8 }, | 
| 176 | + rules: [{ required: true, message: '属性为必填项' }], | |
| 171 | 177 | componentProps({ formModel }) { | 
| 172 | 178 | const organizationId = formModel[DataSourceField.ORIGINATION_ID]; | 
| 173 | 179 | const isGatewayDevice = formModel[DataSourceField.IS_GATEWAY_DEVICE]; | ... | ... | 
| ... | ... | @@ -177,21 +177,23 @@ | 
| 177 | 177 | openModal(true, { isEdit: false }); | 
| 178 | 178 | }; | 
| 179 | 179 | |
| 180 | + const getLayoutInfo = () => { | |
| 181 | + return unref(dataBoardList).map((item) => { | |
| 182 | + return { | |
| 183 | + id: item.i, | |
| 184 | + h: item.h, | |
| 185 | + w: item.w, | |
| 186 | + x: item.x, | |
| 187 | + y: item.y, | |
| 188 | + } as Layout; | |
| 189 | + }); | |
| 190 | + }; | |
| 191 | + | |
| 180 | 192 | const handleSaveLayoutInfo = async () => { | 
| 181 | 193 | try { | 
| 182 | - const layoutInfo = unref(dataBoardList).map((item) => { | |
| 183 | - return { | |
| 184 | - id: item.i, | |
| 185 | - h: item.h, | |
| 186 | - w: item.w, | |
| 187 | - x: item.x, | |
| 188 | - y: item.y, | |
| 189 | - } as Layout; | |
| 190 | - }); | |
| 191 | - | |
| 192 | 194 | await updateDataBoardLayout({ | 
| 193 | 195 | boardId: unref(getBoardId), | 
| 194 | - layout: layoutInfo, | |
| 196 | + layout: getLayoutInfo(), | |
| 195 | 197 | }); | 
| 196 | 198 | } catch (error) {} | 
| 197 | 199 | }; | 
| ... | ... | @@ -231,7 +233,6 @@ | 
| 231 | 233 | |
| 232 | 234 | if (!data.data.componentData) { | 
| 233 | 235 | dataBoardList.value = []; | 
| 234 | - console.log(unref(dataBoardList)); | |
| 235 | 236 | return; | 
| 236 | 237 | } | 
| 237 | 238 | dataBoardList.value = data.data.componentData.map((item) => { | 
| ... | ... | @@ -311,7 +312,7 @@ | 
| 311 | 312 | const handleCopy = async (id: string) => { | 
| 312 | 313 | const record = unref(dataBoardList).find((item) => item.i === id); | 
| 313 | 314 | try { | 
| 314 | - await addDataComponent({ | |
| 315 | + const data = await addDataComponent({ | |
| 315 | 316 | boardId: unref(getBoardId), | 
| 316 | 317 | record: { | 
| 317 | 318 | dataBoardId: unref(getBoardId), | 
| ... | ... | @@ -320,14 +321,31 @@ | 
| 320 | 321 | }, | 
| 321 | 322 | }); | 
| 322 | 323 | createMessage.success('复制成功'); | 
| 323 | - getDataBoardComponent(); | |
| 324 | + const _id = data.data.id; | |
| 325 | + const layoutInfo = getLayoutInfo(); | |
| 326 | + | |
| 327 | + layoutInfo.push({ | |
| 328 | + id: _id, | |
| 329 | + h: record?.h, | |
| 330 | + w: record?.w, | |
| 331 | + x: record?.x, | |
| 332 | + y: record?.y, | |
| 333 | + } as Layout); | |
| 334 | + | |
| 335 | + await updateDataBoardLayout({ | |
| 336 | + boardId: unref(getBoardId), | |
| 337 | + layout: layoutInfo, | |
| 338 | + }); | |
| 339 | + | |
| 340 | + await getDataBoardComponent(); | |
| 324 | 341 | } catch (error) {} | 
| 325 | 342 | }; | 
| 326 | 343 | |
| 327 | 344 | const handleDelete = async (id: string) => { | 
| 328 | 345 | try { | 
| 329 | - await deleteDataComponent([id]); | |
| 346 | + await deleteDataComponent(id); | |
| 330 | 347 | createMessage.success('删除成功'); | 
| 348 | + await handleSaveLayoutInfo(); | |
| 331 | 349 | await getDataBoardComponent(); | 
| 332 | 350 | } catch (error) { | 
| 333 | 351 | // createMessage.error('删除失败'); | ... | ... |