|
@ -35,7 +35,7 @@ |
|
|
:default-checked-keys="defaultCheckedKeys" |
|
|
:default-checked-keys="defaultCheckedKeys" |
|
|
/> |
|
|
/> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
<el-form-item label="模型类别" prop="modelTypeId"> |
|
|
<el-form-item label="模型类别" key="selectmodelType" prop="modelTypeId"> |
|
|
<el-select v-model="form.modelTypeId" placeholder="请选择模型类别" clearable> |
|
|
<el-select v-model="form.modelTypeId" placeholder="请选择模型类别" clearable> |
|
|
<el-option v-for="dict in modeltypeList" :key="dict.id" :label="dict.modelTypeName" :value="dict.id" /> |
|
|
<el-option v-for="dict in modeltypeList" :key="dict.id" :label="dict.modelTypeName" :value="dict.id" /> |
|
|
</el-select> |
|
|
</el-select> |
|
@ -65,34 +65,48 @@ |
|
|
<div class="textalignright marginbottom5"> |
|
|
<div class="textalignright marginbottom5"> |
|
|
<el-button type="primary" style="display: inline-block !important" @click="addParamModel">添加参数模版</el-button> |
|
|
<el-button type="primary" style="display: inline-block !important" @click="addParamModel">添加参数模版</el-button> |
|
|
</div> |
|
|
</div> |
|
|
<el-table :data="tableData" style="width: 100%" max-height="250"> |
|
|
<el-table :data="selectedModelList" style="width: 100%" max-height="250" @cell-dblclick="startEditing"> |
|
|
<el-table-column fixed label="序号" width="80"> |
|
|
<el-table-column fixed label="序号" width="80"> |
|
|
<template slot-scope="scope"> |
|
|
<template #default="scope" > |
|
|
{{ scope.$index + 1 }} |
|
|
<span>{{ scope.$index+1 }}</span> |
|
|
</template> |
|
|
</template> |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
<el-table-column prop="name" label="Name" width="120" /> |
|
|
<el-table-column label="ID" align="center" width="55" prop="id" /> |
|
|
<el-table-column prop="state" label="State" width="120" /> |
|
|
<el-table-column label="参数名称" align="center" prop="paramClassName" /> |
|
|
<el-table-column prop="city" label="City" width="120" /> |
|
|
<el-table-column label="参数编码" align="center" prop="paramClassCode" /> |
|
|
<el-table-column prop="address" label="Address" width="600" /> |
|
|
<el-table-column label="PLC地址位" align="center" prop="plcAdr"> |
|
|
<el-table-column prop="zip" label="Zip" width="120" /> |
|
|
|
|
|
<el-table-column fixed="right" label="Operations" width="120"> |
|
|
|
|
|
<template #default="scope"> |
|
|
<template #default="scope"> |
|
|
<el-button |
|
|
<span v-if="!scope.row.editing">{{ scope.row.editing}}</span> |
|
|
link |
|
|
<el-input v-else v-model="scope.row.plcAdr" @blur="saveData(scope)"/> |
|
|
type="primary" |
|
|
</template> |
|
|
size="small" |
|
|
</el-table-column> |
|
|
@click.prevent="deleteRow(scope.$index)" |
|
|
<!-- <el-table-column label="是否可控" align="center" prop="control"> |
|
|
> |
|
|
<template #default="scope"> |
|
|
Remove |
|
|
<dict-tag :options="dc_class_type" :value="scope.row.control" /> |
|
|
</el-button> |
|
|
</template> |
|
|
|
|
|
</el-table-column> --> |
|
|
|
|
|
<el-table-column label="类别" align="center" prop="classType"> |
|
|
|
|
|
<template #default="scope"> |
|
|
|
|
|
<dict-tag :options="dc_class_type" :value="scope.row.classType" /> |
|
|
|
|
|
</template> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column label="分区" align="center" prop="devicePartion"> |
|
|
|
|
|
<template #default="scope"> |
|
|
|
|
|
<dict-tag :options="dc_device_partion" :value="scope.row.devicePartion" /> |
|
|
|
|
|
</template> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column label="备注" align="center" prop="note" /> |
|
|
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> |
|
|
|
|
|
<template #default="scope"> |
|
|
|
|
|
<el-button type="text" icon="View" @click="handleView(scope.row)">查看</el-button> |
|
|
|
|
|
<el-button type="text" icon="Edit" @click="handleEdit(scope.row)">编辑</el-button> |
|
|
</template> |
|
|
</template> |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
</el-table> |
|
|
</el-table> |
|
|
</div> |
|
|
</div> |
|
|
</el-carousel-item> |
|
|
</el-carousel-item> |
|
|
</el-carousel> |
|
|
</el-carousel> |
|
|
<div class="textaligncenter"> |
|
|
<div class="textaligncenter"> |
|
|
<el-form-item class="widthhalfinlineblock"> |
|
|
<el-form-item class="widthhalfinlineblock"> |
|
|
<el-button type="primary" v-if="prevStepButtonShow" @click="prevStep" >上一步</el-button> |
|
|
<el-button type="primary" v-if="prevStepButtonShow" @click="prevStep" >上一步</el-button> |
|
|
<el-button type="primary" v-if="submitButtonShow" @click="submitForm" >提交</el-button> |
|
|
<el-button type="primary" v-if="submitButtonShow" @click="submitForm" >提交</el-button> |
|
@ -100,7 +114,29 @@ |
|
|
<el-button @click="cancel">取 消</el-button> |
|
|
<el-button @click="cancel">取 消</el-button> |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
</div> |
|
|
</div> |
|
|
</el-form> |
|
|
</el-form> |
|
|
|
|
|
<el-dialog :title="title" v-model="addParamModelShow" width="800px" append-to-body :dc_device_partion="dc_device_partion" :dc_class_type="dc_class_type"> |
|
|
|
|
|
<el-table ref="dialogTable" :data="paramModelList" key="newTable" style="width: 100%" max-height="600"> |
|
|
|
|
|
<el-table-column type="selection" width="55" :selectable="ifselectable"/> |
|
|
|
|
|
<el-table-column label="ID" align="center" width="55" prop="id" /> |
|
|
|
|
|
<el-table-column label="参数名称" align="center" prop="paramClassName" /> |
|
|
|
|
|
<el-table-column label="参数编码" align="center" prop="paramClassCode" /> |
|
|
|
|
|
<el-table-column label="类别" align="center" prop="classType"> |
|
|
|
|
|
<template #default="scope"> |
|
|
|
|
|
<dict-tag :options="dc_class_type" :value="scope.row.classType" /> |
|
|
|
|
|
</template> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column label="分区" align="center" prop="devicePartion"> |
|
|
|
|
|
<template #default="scope"> |
|
|
|
|
|
<dict-tag :options="dc_device_partion" :value="scope.row.devicePartion" /> |
|
|
|
|
|
</template> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column label="备注" align="center" prop="note" /> |
|
|
|
|
|
</el-table> |
|
|
|
|
|
<div class="textalignright margintop10"> |
|
|
|
|
|
<el-button type="primary" @click="selectedSubmit">提交</el-button> |
|
|
|
|
|
</div> |
|
|
|
|
|
</el-dialog> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
@ -119,10 +155,11 @@ |
|
|
</style> |
|
|
</style> |
|
|
<script setup name="newdevicemodel"> |
|
|
<script setup name="newdevicemodel"> |
|
|
import { listDevicemodel,addDevicemodel, updateDevicemodel } from "@/api/model/devicemodel"; |
|
|
import { listDevicemodel,addDevicemodel, updateDevicemodel } from "@/api/model/devicemodel"; |
|
|
|
|
|
import { listParamclass } from "@/api/model/paramclass"; |
|
|
import { listModelType} from "@/api/model/modelType"; |
|
|
import { listModelType} from "@/api/model/modelType"; |
|
|
import { onMounted, ref } from 'vue'; |
|
|
import { onMounted, ref } from 'vue'; |
|
|
const { proxy } = getCurrentInstance(); |
|
|
const { proxy } = getCurrentInstance(); |
|
|
const { dc_available, dc_is_leaf } = proxy.useDict('dc_available', 'dc_is_leaf'); |
|
|
const {dc_class_type, dc_device_partion} = proxy.useDict('dc_available', 'dc_is_leaf', 'dc_class_type', 'dc_device_partion'); |
|
|
const router = useRouter(); |
|
|
const router = useRouter(); |
|
|
const devicemodelOptions = ref([]); |
|
|
const devicemodelOptions = ref([]); |
|
|
const open = ref(false); |
|
|
const open = ref(false); |
|
@ -134,6 +171,8 @@ |
|
|
const submitButtonShow = ref(true); |
|
|
const submitButtonShow = ref(true); |
|
|
const paramModelList = ref([]); |
|
|
const paramModelList = ref([]); |
|
|
const addParamModelShow = ref(false); |
|
|
const addParamModelShow = ref(false); |
|
|
|
|
|
const nordeNumber = ref(1); |
|
|
|
|
|
const selectedModelList = ref([]); |
|
|
console.log(router); |
|
|
console.log(router); |
|
|
console.log(proxy); |
|
|
console.log(proxy); |
|
|
const tempPid = router.currentRoute._value.query.pid; |
|
|
const tempPid = router.currentRoute._value.query.pid; |
|
@ -144,6 +183,14 @@ |
|
|
dc_available:false, |
|
|
dc_available:false, |
|
|
// pid:tempPid, |
|
|
// pid:tempPid, |
|
|
}, |
|
|
}, |
|
|
|
|
|
dc_available: [ |
|
|
|
|
|
{label: '可用', value: 'true', elTagType: 'default', elTagClass: null}, |
|
|
|
|
|
{label: '不可用', value: 'false', elTagType: 'default', elTagClass: null} |
|
|
|
|
|
], |
|
|
|
|
|
dc_is_leaf: [ |
|
|
|
|
|
{label: '是', value: 'true', elTagType: 'default', elTagClass: null}, |
|
|
|
|
|
{label: '否', value: 'false', elTagType: 'default', elTagClass: null} |
|
|
|
|
|
], |
|
|
queryParams: { |
|
|
queryParams: { |
|
|
modelName: null, |
|
|
modelName: null, |
|
|
modelCode: null, |
|
|
modelCode: null, |
|
@ -168,7 +215,7 @@ |
|
|
} |
|
|
} |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
const { queryParams, form, rules } = toRefs(data); |
|
|
const { queryParams, form, rules, dc_available, dc_is_leaf } = toRefs(data); |
|
|
|
|
|
|
|
|
// 取消按钮 |
|
|
// 取消按钮 |
|
|
function cancel() { |
|
|
function cancel() { |
|
@ -256,13 +303,17 @@ |
|
|
} |
|
|
} |
|
|
function nextStep(){ |
|
|
function nextStep(){ |
|
|
console.log("---------------"); |
|
|
console.log("---------------"); |
|
|
if(currentStep.value<2){ |
|
|
proxy.$refs["devicemodelRef"].validate(valid => { |
|
|
currentStep.value = currentStep.value + 1; |
|
|
// if (valid) { |
|
|
proxy.$refs.carousel.next(); |
|
|
if(currentStep.value<2){ |
|
|
submitButtonShow.value = true; |
|
|
currentStep.value = currentStep.value + 1; |
|
|
nextStepButtonShow.value = false; |
|
|
proxy.$refs.carousel.next(); |
|
|
prevStepButtonShow.value = true; |
|
|
submitButtonShow.value = true; |
|
|
} |
|
|
nextStepButtonShow.value = false; |
|
|
|
|
|
prevStepButtonShow.value = true; |
|
|
|
|
|
} |
|
|
|
|
|
// } |
|
|
|
|
|
}); |
|
|
} |
|
|
} |
|
|
function prevStep(){ |
|
|
function prevStep(){ |
|
|
currentStep.value = currentStep.value - 1; |
|
|
currentStep.value = currentStep.value - 1; |
|
@ -271,15 +322,68 @@ |
|
|
nextStepButtonShow.value = true; |
|
|
nextStepButtonShow.value = true; |
|
|
prevStepButtonShow.value = false; |
|
|
prevStepButtonShow.value = false; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/** 查询参数模型信息列表 */ |
|
|
function addParamModel(){ |
|
|
function addParamModel(){ |
|
|
loading.value = true; |
|
|
loading.value = true; |
|
|
listParamclass(queryParams.value).then(response => { |
|
|
listParamclass(queryParams.value).then(response => { |
|
|
console.log(response); |
|
|
console.log(response); |
|
|
paramModelList.value = response.rows; |
|
|
paramModelList.value = response.rows; |
|
|
|
|
|
console.log(paramModelList); |
|
|
addParamModelShow.value = true; |
|
|
addParamModelShow.value = true; |
|
|
loading.value = false; |
|
|
loading.value = false; |
|
|
}); |
|
|
}); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function handleView(){ |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function handleEdit(){ |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function selectedSubmit(){ |
|
|
|
|
|
const newSelectedList = proxy.$refs.dialogTable.getSelectionRows().map(row => ({ |
|
|
|
|
|
...row, |
|
|
|
|
|
editing: false, // 添加 'editing' 属性并设置初始值为 false |
|
|
|
|
|
})); |
|
|
|
|
|
if(selectedModelList.value.length>0){ |
|
|
|
|
|
selectedModelList.value = { |
|
|
|
|
|
...selectedModelList, |
|
|
|
|
|
...newSelectedList, |
|
|
|
|
|
} |
|
|
|
|
|
}else{ |
|
|
|
|
|
selectedModelList.value = newSelectedList; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
console.log(selectedModelList); |
|
|
|
|
|
addParamModelShow.value = false; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function startEditing(scope) { |
|
|
|
|
|
console.log(scope); |
|
|
|
|
|
scope.row.editing = true; // 进入编辑模式 |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function saveData(scope) { |
|
|
|
|
|
// 保存数据的逻辑... |
|
|
|
|
|
scope.row.editing = false; // 保存完成后,切换回显示模式 |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function ifselectable(row, index){ |
|
|
|
|
|
let flag = true; |
|
|
|
|
|
console.log(selectedModelList.value); |
|
|
|
|
|
if(selectedModelList.value != []){ |
|
|
|
|
|
selectedModelList.value.forEach(element => { |
|
|
|
|
|
if(element.id == row.id){ |
|
|
|
|
|
flag = false; |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
} |
|
|
|
|
|
return flag; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
getTreeselect(); |
|
|
getTreeselect(); |
|
|
getModelTypeList(); |
|
|
getModelTypeList(); |
|
|
</script> |
|
|
</script> |
|
|