物模型页面调整
This commit is contained in:
parent
4ebb3d9d34
commit
0ebec11ab7
@ -3,13 +3,25 @@
|
||||
<el-dialog v-model="modelDialogVisible" :title="modelDialogTitle" :width="400" @close="cancelModelForm">
|
||||
<el-form ref="modelFormRef" :model="modelForm" :rules="modelFormRules" label-width="110">
|
||||
<el-form-item prop="iotModelName" :label="ModelFieldsEnums['iotModelName']">
|
||||
<el-input :disabled="modelDialogState === ModelDialogTitleStateType['detail']" v-model="modelForm.iotModelName"></el-input>
|
||||
<el-input
|
||||
:disabled="modelDialogState === ModelDialogTitleStateType['detail']"
|
||||
v-model="modelForm.iotModelName"
|
||||
:placeholder="'请输入' + ModelFieldsEnums['iotModelName']"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="iotModelCode" :label="ModelFieldsEnums['iotModelCode']">
|
||||
<el-input :disabled="modelDialogState === ModelDialogTitleStateType['detail']" v-model="modelForm.iotModelCode"></el-input>
|
||||
<el-input
|
||||
:disabled="modelDialogState === ModelDialogTitleStateType['detail']"
|
||||
v-model="modelForm.iotModelCode"
|
||||
:placeholder="'请输入' + ModelFieldsEnums['iotModelCode']"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="objectType" :label="ModelFieldsEnums['objectType']">
|
||||
<el-input :disabled="modelDialogState === ModelDialogTitleStateType['detail']" v-model="modelForm.objectType"></el-input>
|
||||
<el-input
|
||||
:disabled="modelDialogState === ModelDialogTitleStateType['detail']"
|
||||
v-model="modelForm.objectType"
|
||||
:placeholder="'请输入' + ModelFieldsEnums['objectType']"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer v-if="modelDialogState !== ModelDialogTitleStateType['detail']">
|
||||
@ -28,17 +40,18 @@
|
||||
class="searchModelInput"
|
||||
></el-input>
|
||||
</el-header>
|
||||
<el-main class="asideMain">
|
||||
<el-tree-v2
|
||||
<el-main class="treeMain">
|
||||
<el-tree
|
||||
ref="modelTreeRef"
|
||||
node-key="id"
|
||||
:data="treeData"
|
||||
:props="DeviceModelPropReplace"
|
||||
class="modelTree"
|
||||
class="treePart"
|
||||
@node-contextmenu="modelContextMenu"
|
||||
@node-click="modelNodeClick"
|
||||
highlight-current
|
||||
>
|
||||
</el-tree-v2>
|
||||
</el-tree>
|
||||
</el-main>
|
||||
</el-aside>
|
||||
<el-container class="mainContainer">
|
||||
@ -64,7 +77,7 @@
|
||||
<el-main class="mainMain">
|
||||
<el-tabs v-model="ModelTabs" @tab-change="changeTabs" class="tabsPart">
|
||||
<el-tab-pane :label="modelTabsType['attribute']" name="attribute">
|
||||
<el-table :data="attributeTableData" class="tablePart">
|
||||
<el-table :data="attributeTableData" class="tablePart" highlight-current-row>
|
||||
<el-table-column
|
||||
prop="attributeName"
|
||||
:label="ModelAttributeFieldsEnums['attributeName']"
|
||||
@ -152,22 +165,22 @@
|
||||
</template>
|
||||
</ContextMenu>
|
||||
<el-dialog v-model="attributeVisible" :title="attributeFormTitle" @close="closeAttributeForm" :width="600">
|
||||
<el-form ref="attributeFormRef" :model="attributeForm" label-width="100">
|
||||
<el-form ref="attributeFormRef" :model="attributeForm" label-width="100" :rules="attributeAndServiceRules">
|
||||
<el-form-item :label="ModelAttributeFieldsEnums['attributeName']" prop="attributeName">
|
||||
<el-input v-model="attributeForm.attributeName"></el-input>
|
||||
<el-input v-model="attributeForm.attributeName" :placeholder="'请输入' + ModelAttributeFieldsEnums['attributeName']"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="ModelAttributeFieldsEnums['attributeCode']" prop="attributeCode">
|
||||
<el-input v-model="attributeForm.attributeCode"></el-input>
|
||||
<el-input v-model="attributeForm.attributeCode" :placeholder="'请输入' + ModelAttributeFieldsEnums['attributeCode']"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="ModelAttributeFieldsEnums['attributeTypeName']" prop="attributeType">
|
||||
<el-select v-model="attributeForm.attributeType">
|
||||
<el-select v-model="attributeForm.attributeType" :placeholder="'请选择' + ModelAttributeFieldsEnums['attributeTypeName']">
|
||||
<el-option label="模拟量" :value="138"></el-option>
|
||||
<el-option label="累积量" :value="139"></el-option>
|
||||
<el-option label="离散量" :value="140"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="ModelAttributeFieldsEnums['porder']" prop="porder">
|
||||
<el-input v-model="attributeForm.porder"></el-input>
|
||||
<el-input v-model="attributeForm.porder" :placeholder="'请输入' + ModelAttributeFieldsEnums['porder']"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
@ -176,21 +189,21 @@
|
||||
</template>
|
||||
</el-dialog>
|
||||
<el-dialog v-model="serviceVisible" :title="serviceFormTitle" @close="closeServiceForm" :width="600">
|
||||
<el-form ref="serviceFormRef" :model="serviceForm" label-width="100">
|
||||
<el-form ref="serviceFormRef" :model="serviceForm" label-width="100" :rules="attributeAndServiceRules">
|
||||
<el-form-item :label="ModelServiceFieldsEnums['serviceName']" prop="serviceName">
|
||||
<el-input v-model="serviceForm.serviceName"></el-input>
|
||||
<el-input v-model="serviceForm.serviceName" :placeholder="'请输入' + ModelServiceFieldsEnums['serviceName']"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="ModelServiceFieldsEnums['serviceCode']" prop="serviceCode">
|
||||
<el-input v-model="serviceForm.serviceCode"></el-input>
|
||||
<el-input v-model="serviceForm.serviceCode" :placeholder="'请输入' + ModelServiceFieldsEnums['serviceCode']"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item :label="ModelServiceFieldsEnums['serviceTypeName']" prop="attributeType">
|
||||
<el-select v-model="serviceForm.serviceType">
|
||||
<el-form-item :label="ModelServiceFieldsEnums['serviceTypeName']" prop="serviceType">
|
||||
<el-select v-model="serviceForm.serviceType" :placeholder="'请选择' + ModelServiceFieldsEnums['serviceTypeName']">
|
||||
<el-option label="遥调" :value="146"></el-option>
|
||||
<el-option label="遥控" :value="147"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="ModelServiceFieldsEnums['porder']" prop="porder">
|
||||
<el-input v-model="serviceForm.porder"></el-input>
|
||||
<el-input v-model="serviceForm.porder" :placeholder="'请输入' + ModelServiceFieldsEnums['porder']"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
@ -208,7 +221,7 @@ import {
|
||||
ElAside,
|
||||
ElHeader,
|
||||
ElMain,
|
||||
ElTreeV2,
|
||||
ElTree,
|
||||
ElInput,
|
||||
ElMessage,
|
||||
ElRadioGroup,
|
||||
@ -221,7 +234,7 @@ import {
|
||||
FormInstance,
|
||||
UploadRequestOptions,
|
||||
TreeNode,
|
||||
TreeInstance
|
||||
TreeInstance,
|
||||
} from 'element-plus'
|
||||
import { Reading, DocumentAdd, DocumentChecked, DocumentDelete, Search, Plus, Download, Upload } from '@element-plus/icons-vue'
|
||||
import {
|
||||
@ -394,7 +407,7 @@ const modelNodeClick = (target: TreeNode) => {
|
||||
const openModel = (type: ModelDialogTitleStateKeyType, data?: AddModelType & UpdateModelType) => {
|
||||
modelDialogState.value = ModelDialogTitleStateType[type]
|
||||
if (type !== 'add') {
|
||||
modelForm.value = data!
|
||||
modelForm.value = JSON.parse(JSON.stringify(data!))
|
||||
}
|
||||
// modelOperateVisible.value = false
|
||||
modelDialogVisible.value = true
|
||||
@ -418,8 +431,6 @@ const modelAttributeAndServiceInputValue = ref('')
|
||||
const searchModelAttribute = () => {
|
||||
if (modelAttributeSearchRadio.value === 'Name') {
|
||||
if (ModelTabs.value === 'attribute') {
|
||||
console.log('test')
|
||||
|
||||
getAttributeList(modelAttributeSearchRadio.value, modelAttributeAndServiceInputValue.value)
|
||||
} else if (ModelTabs.value === 'service') {
|
||||
getServiceList(modelAttributeSearchRadio.value, modelAttributeAndServiceInputValue.value)
|
||||
@ -673,6 +684,40 @@ const submitServiceForm = () => {
|
||||
}
|
||||
})
|
||||
}
|
||||
const codeReg = /^[a-zA-Z][a-zA-Z0-9_]*$/
|
||||
const attributeAndServiceRules = {
|
||||
attributeCode: [
|
||||
{ required: true, message: '请输入属性编码', trigger: 'blur' },
|
||||
{
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!codeReg.test(value)) {
|
||||
callback(new Error('必须为字母开头,不能包含特殊字符'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
attributeName: [{ required: true, message: '请输入属性名称', trigger: 'blur' }],
|
||||
attributeType: [{ required: true, message: '请选择属性类型', trigger: 'change' }],
|
||||
serviceCode: [
|
||||
{ required: true, message: '请输方法编码', trigger: 'blur' },
|
||||
{
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (!codeReg.test(value)) {
|
||||
callback(new Error('必须为字母开头,不能包含特殊字符'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
serviceName: [{ required: true, message: '请输入方法名称', trigger: 'blur' }],
|
||||
serviceType: [{ required: true, message: '请选择方法类型', trigger: 'change' }],
|
||||
porder: [{ required: true, message: '请输入序号', trigger: 'blur' }],
|
||||
}
|
||||
|
||||
const addModelAttributeAndService = () => {
|
||||
if (ModelTabs.value === 'attribute') {
|
||||
@ -762,10 +807,10 @@ $paginationHeight: 32px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
.asideMain {
|
||||
.treeMain {
|
||||
height: calc(100% - $headerHeight);
|
||||
overflow-y: auto;
|
||||
.modelTree {
|
||||
.treePart {
|
||||
height: 100%;
|
||||
background-color: $defaultBackgroundColor;
|
||||
}
|
||||
|
@ -61,7 +61,7 @@ export enum ModelAttributeFieldsEnums {
|
||||
'attributeName' = '属性名称',
|
||||
'attributeType' = '属性类型value',
|
||||
'attributeTypeName' = '属性类型',
|
||||
'porder' = '测点序号',
|
||||
'porder' = '序号',
|
||||
'revision' = '乐观锁',
|
||||
'createdBy' = '创建人',
|
||||
'createdTime' = '创建时间',
|
||||
@ -72,11 +72,11 @@ export enum ModelAttributeFieldsEnums {
|
||||
export enum ModelServiceFieldsEnums {
|
||||
'id' = 'id',
|
||||
'iotModelId' = '所属物模型ID',
|
||||
'serviceCode' = '属性编码',
|
||||
'serviceName' = '属性名称',
|
||||
'serviceType' = '属性类型value',
|
||||
'serviceTypeName' = '属性类型',
|
||||
'porder' = '测点序号',
|
||||
'serviceCode' = '方法编码',
|
||||
'serviceName' = '方法名称',
|
||||
'serviceType' = '方法类型value',
|
||||
'serviceTypeName' = '方法类型',
|
||||
'porder' = '序号',
|
||||
'revision' = '乐观锁',
|
||||
'createdBy' = '创建人',
|
||||
'createdTime' = '创建时间',
|
||||
|
@ -114,7 +114,7 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref, computed } from 'vue'
|
||||
import { onMounted, ref, computed,nextTick } from 'vue'
|
||||
import {
|
||||
ElContainer,
|
||||
ElAside,
|
||||
@ -495,6 +495,9 @@ const initData = () => {
|
||||
.then((res) => {
|
||||
console.log(res)
|
||||
treeData.value = [...res]
|
||||
nextTick(() => {
|
||||
treeRef.value?.setCurrentKey(res[0]?.id!, false)
|
||||
})
|
||||
return
|
||||
})
|
||||
.then(() => {
|
||||
|
Loading…
Reference in New Issue
Block a user