lianmei
/
dc-ui
mirror of https://gitee.com/lmlz_0/dc-ui.git
3
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

解决冲突

pull/1/head
ljlong_2630 1 year ago
parent
3fd8d793dc
commit
ebe22536cb
2 changed files with 364 additions and 209 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 60
      src/assets/styles/self-defined.scss
  2. 251
      src/views/model/devicemodel/addmodel.vue

60
src/assets/styles/self-defined.scss
View File

@ -25,6 +25,10 @@
} }
.marginbottom5{
margin-bottom: 5px;
}
.textaligncenter{ .textaligncenter{
text-align:center; text-align:center;
} }
@ -35,6 +39,10 @@
width: 50%; width: 50%;
display: inline-block; display: inline-block;
} }
.width75percentinlineblock{
width: 75%;
display: inline-block;
}
.textalignright{ .textalignright{
text-align:right; text-align:right;
} }
@ -77,3 +85,55 @@
width: 0; width: 0;
height: 0; height: 0;
} }
.divsonmarginleft0{
div{
margin-left:0 !important;
}
}
.marginbottom{
margin-bottom: 0 !important;
}
.inlineblock{
display: inline-block;
}
.marginright6percent{
margin-right: 10%;
}
.fixedbottomright{
position: fixed;
/* 设置图片相对于浏览器的位置
距离右边180px,底部20px,宽度50px
*/
right : 80px;
bottom: 2%;
}
.width50percent{
width:50%;
}
.overflowscroll{
overflow-y: scroll;
}
.sonheight500{
>div{
height:500px;
}
}
.height350{
height:350px;
}
.height300{
height:300px;
}
.height260{
height:260px;
}

251
src/views/model/devicemodel/addmodel.vue
View File

@ -1,17 +1,18 @@
<template> <template>
<div class="app-container" v-loading="loading"> <div class="app-container"
v-loading="loading">
<!-- 添加或修改设备模型信息对话框 --> <!-- 添加或修改设备模型信息对话框 -->
<div class="marginbottom50px"> <div class="marginbottom50px">
<el-steps :active="currentStep"> <el-steps :active="currentStep">
<el-step title="模型信息" description="名称、编号、序号、备注等" class="step" /> <el-step title="模型信息" description="名称、编号、序号、备注等" />
<el-step title="参数类别配置" description="模型的参数类别" /> <el-step title="参数类别配置" description="模型的参数类别" />
<el-step title="调控策略" description="模型的调控策略" /> <el-step title="调控策略" description="模型的调控策略" />
</el-steps> </el-steps>
</div> </div>
<div> <div class="overflowscroll">
<el-form ref="devicemodelRef" :model="form" :rules="rules" label-width="100px"> <el-form ref="devicemodelRef" :model="form" :rules="rules" label-width="100px">
<el-carousel ref="carousel" :autoplay="false" :arrow="never" pause-on-hover="false" class="customCarousel" > <el-carousel ref="carousel" :autoplay="false" :arrow="never" pause-on-hover="false" class="customCarousel" >
<el-carousel-item :key="1" name="1" class="textaligncenter"> <el-carousel-item :key="1" name="1" class="textaligncenter overflowscroll height300">
<div class="widthhalfinlineblock"> <div class="widthhalfinlineblock">
<el-form-item label="模型名称" prop="modelName"> <el-form-item label="模型名称" prop="modelName">
<el-input v-model="form.modelName" placeholder="请输入模型名称" /> <el-input v-model="form.modelName" placeholder="请输入模型名称" />
@ -23,53 +24,74 @@
<el-input-number v-model="form.sort" :min="1" :max="100" placeholder="请输入排序"/> <el-input-number v-model="form.sort" :min="1" :max="100" placeholder="请输入排序"/>
</el-form-item> </el-form-item>
<el-form-item label="上级" prop="pid"> <el-form-item label="上级" prop="pid">
<el-tree-select v-model="form.pid" :data="devicemodelOptions" <el-tree-select
:props="{ value: 'id', label: 'modelName', children: 'children' }" value-key="id" placeholder="请选择上级" v-model="form.pid"
check-strictly :default-expand-all="true" :default-checked-keys="defaultCheckedKeys" /> :data="devicemodelOptions"
:props="{ value: 'id', label: 'modelName', children: 'children' }"
value-key="id"
placeholder="请选择上级"
check-strictly
:default-expand-all="true"
:default-checked-keys="defaultCheckedKeys"
/>
</el-form-item> </el-form-item>
<el-form-item label="模型类别" key="selectmodelType" 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 @change="modalTypeControllButton">
<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-option v-for="dict in dc_model_type" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="是否是叶节点"> <el-form-item label="是否可用" prop="vailable">
<el-switch v-model="form.dc_is_leaf" @change="switch_isLeaf" class="ml-2i" <el-switch
style="--el-switch-on-color: #13ce66" /> v-model="form.dc_available"
</el-form-item> class="ml-2i"
<el-form-item label="是否可用"> style="--el-switch-on-color: #13ce66"
<el-switch v-model="form.dc_available" class="ml-2i" style="--el-switch-on-color: #13ce66" /> />
</el-form-item> </el-form-item>
<el-form-item label="备注" prop="note"> <el-form-item label="备注" prop="note">
<el-input v-model="form.note" type="textarea" placeholder="请输入内容" /> <el-input v-model="form.note" type="textarea" placeholder="请输入内容" />
</el-form-item> </el-form-item>
</div> </div>
<div class="width50percent textalignright">
<el-form-item class="inlineblock marginright6percent divsonmarginleft0">
<el-button type="primary" v-if="prevStepButtonShow" @click="prevStep" style="display: inline-block !important" >上一步</el-button>
<el-button type="primary" v-if="submitButtonShow" @click="submitForm" style="display: inline-block !important">提交</el-button>
<el-button type="primary" v-if="nextStepButtonShow" @click="nextStep" style="display: inline-block !important">下一步</el-button>
<el-button @click="cancel" style="display: inline-block !important">取 消</el-button>
</el-form-item>
</div>
</el-carousel-item> </el-carousel-item>
<el-carousel-item :key="2" name="2" class="textaligncenter"> <el-carousel-item :key="2" name="2" class="textaligncenter overflowscroll height300">
<div class="widthhalfinlineblock"> <div class="width75percentinlineblock">
<div class="textalignright marginbottom5"> <div class="textalignright marginbottom5">
<el-button type="primary" style="display: inline-block !important" <el-button type="primary" style="display: inline-block !important" @click="addParamModel">添加参数模版</el-button>
@click="addParamModel">添加参数模版</el-button>
</div> </div>
<el-table :data="selectedModelList" style="width: 100%" max-height="250" @cell-dblclick="startEditing"> <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" align="center" >
<template #default="scope"> <template #default="scope">
<span>{{ scope.$index+1 }}</span> <span>{{ scope.$index+1 }}</span>
</template> </template>
</el-table-column> </el-table-column>
<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="paramClassName" />
<el-table-column label="参数编码" align="center" prop="paramClassCode" /> <el-table-column label="参数编码" align="center" prop="paramClassCode" />
<el-table-column label="PLC地址位" align="center" prop="plcAdr"> <el-table-column label="PLC地址位" align="center" prop="plcAdr" vali>
<template #default="scope"> <template #default="scope">
<span v-if="!scope.row.editing">{{ scope.row.editing }}</span> <ValidationProvider :rules="plcAdr" v-slot="">
<el-input v-else v-model="scope.row.plcAdr" @blur="saveData(scope)" /> <span v-if="!scope.row.editing">{{ scope.row.plcAdr}}</span>
<el-input v-else v-model="scope.row.plcAdr" @blur="saveData(scope.row)"/>
</ValidationProvider>
</template> </template>
</el-table-column> </el-table-column>
<!-- <el-table-column label="是否可控" align="center" prop="control"> <el-table-column label="是否可控" align="center" prop="controllab">
<template #default="scope"> <template #default="scope">
<dict-tag :options="dc_class_type" :value="scope.row.control" /> <el-switch
v-model="scope.row.controllab"
@change="selectRadio(scope.row)"
class="ml-2i"
style="--el-switch-on-color: #13ce66"
/>
</template> </template>
</el-table-column> --> </el-table-column>
<el-table-column label="类别" align="center" prop="classType"> <el-table-column label="类别" align="center" prop="classType">
<template #default="scope"> <template #default="scope">
<dict-tag :options="dc_class_type" :value="scope.row.classType" /> <dict-tag :options="dc_class_type" :value="scope.row.classType" />
@ -81,30 +103,28 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="备注" align="center" prop="note" /> <el-table-column label="备注" align="center" prop="note" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" width="200px">
<template #default="scope"> <template #default="scope">
<el-button type="text" icon="View" @click="handleView(scope.row)">查看</el-button> <el-button style="display:inline-block !important" type="primary" @click="handleDelete(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> <div class="fixedbottomright width50percent textalignright">
</el-carousel> <el-form-item class="inlineblock marginright6percent divsonmarginleft0">
<div class="textaligncenter"> <el-button type="primary" v-if="prevStepButtonShow" @click="prevStep" style="display: inline-block !important">上一步</el-button>
<el-form-item class="widthhalfinlineblock"> <el-button type="primary" v-if="submitButtonShow" @click="submitForm" style="display: inline-block !important">提交</el-button>
<el-button type="primary" v-if="prevStepButtonShow" @click="prevStep">上一步</el-button> <el-button type="primary" v-if="nextStepButtonShow" @click="nextStep" style="display: inline-block !important">下一步</el-button>
<el-button type="primary" v-if="submitButtonShow" @click="submitForm">提交</el-button> <el-button @click="cancel" style="display: inline-block !important">取 消</el-button>
<el-button type="primary" v-if="nextStepButtonShow" @click="nextStep">下一步</el-button>
<el-button @click="cancel">取 消</el-button>
</el-form-item> </el-form-item>
</div> </div>
</el-carousel-item>
</el-carousel>
</el-form> </el-form>
<el-dialog :title="title" v-model="addParamModelShow" width="800px" append-to-body <el-dialog :title="title" v-model="addParamModelShow" width="800px" append-to-body :dc_device_partion="dc_device_partion" :dc_class_type="dc_class_type">
: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 ref="dialogTable" :data="paramModelList" key="newTable" style="width: 100%" max-height="600">
<el-table-column type="selection" width="55" :selectable="ifselectable"/> <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="paramClassName" />
<el-table-column label="参数编码" align="center" prop="paramClassCode" /> <el-table-column label="参数编码" align="center" prop="paramClassCode" />
<el-table-column label="类别" align="center" prop="classType"> <el-table-column label="类别" align="center" prop="classType">
@ -128,14 +148,12 @@
</template> </template>
<style lang="scss"> <style lang="scss">
@import "@/assets/styles/self-defined.scss"; @import "@/assets/styles/self-defined.scss";
.customCarousel { .customCarousel {
div{ div{
button { button {
display: none !important; display: none !important;
} }
} }
ul{ ul{
display: none !important; display: none !important;
} }
@ -145,9 +163,11 @@
import { listDevicemodel,addDevicemodel, updateDevicemodel } from "@/api/model/devicemodel"; import { listDevicemodel,addDevicemodel, updateDevicemodel } from "@/api/model/devicemodel";
import { listParamclass } from "@/api/model/paramclass"; import { listParamclass } from "@/api/model/paramclass";
import { listModelType} from "@/api/model/modelType"; import { listModelType} from "@/api/model/modelType";
import { required } from "@vee-validate/rules";
import { listModelparam, addModelparam, updateModelparam, delModelparam} from "@/api/model/modelparam";
import { onMounted, ref } from 'vue'; import { onMounted, ref } from 'vue';
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const { dc_class_type, dc_device_partion } = proxy.useDict('dc_available', 'dc_is_leaf', 'dc_class_type', 'dc_device_partion'); const {dc_class_type, dc_device_partion, dc_model_type} = proxy.useDict('dc_class_type', 'dc_device_partion','dc_model_type');
const router = useRouter(); const router = useRouter();
const devicemodelOptions = ref([]); const devicemodelOptions = ref([]);
const open = ref(false); const open = ref(false);
@ -159,26 +179,24 @@ const prevStepButtonShow = ref(false);
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([]); const selectedModelList = ref([]);
const oldSelectedList = ref([]);
const addModelSubmit = ref([]);
const updateModelSubmit = ref([]);
const operateModelIds = ref([]);
const updateModelIds = ref([]);
const deleteModelIds = 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;
const data = reactive({ const data = reactive({
form: { form: {
sort:1, sort:1,
dc_is_leaf: false,
dc_available: false,
// pid:tempPid,
}, },
dc_available: [ dc_available: [
{label: '可用', value: 'true', elTagType: 'default', elTagClass: null}, {label: '可用', value: 'true', elTagType: 'default', elTagClass: null},
{label: '不可用', value: 'false', 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,
@ -200,10 +218,16 @@ const data = reactive({
pid: [ pid: [
{ required: true, message: "上级不能为空", trigger: "change" } { required: true, message: "上级不能为空", trigger: "change" }
], ],
plcAdr: [
{ required }
]
},
validations: {
inputValue: { required }
} }
}); });
const { queryParams, form, rules, dc_available, dc_is_leaf } = toRefs(data); const { queryParams, form, rules } = toRefs(data);
// 取消按钮 // 取消按钮
function cancel() { function cancel() {
@ -237,19 +261,74 @@ function reset() {
/** 提交按钮 */ /** 提交按钮 */
function submitForm() { function submitForm() {
loading.value = false;
proxy.$refs["devicemodelRef"].validate(valid => { proxy.$refs["devicemodelRef"].validate(valid => {
if (valid) { if (valid) {
console.log("进入方法");
//模型按钮主表维护
if (form.value.id != null) { if (form.value.id != null) {
updateDevicemodel(form.value).then(response => { updateDevicemodel(form.value).then(response => {
router.go(-1);
proxy.$modal.msgSuccess("修改成功"); proxy.$modal.msgSuccess("修改成功");
}); });
} else { } else {
addDevicemodel(form.value).then(response => { addDevicemodel(form.value).then(response => {
router.go(-1);
proxy.$modal.msgSuccess("新增成功");
}); });
} }
//模型参数表维护
//删除计算
let delFlag = true;
oldSelectedList.value.forEach((item)=>{
selectedModelList.value.forEach(element=>{
if(item.id == element.id){
delFlag == false;
}
})
if(delFlag){
deleteModelIds.value.push(item.id);
}
});
//修改计算
operateModelIds.value.forEach(item=>{
selectedModelList.value.forEach(element=>{
if(item.id == element.id){
updateModelSubmit.value.push(element);
}
})
});
console.log("新增计算");
//新增计算
let addFlag = true;
selectedModelList.value.forEach(item=>{
oldSelectedList.value.forEach(element=>{
if(item.id == element.id){
addFlag == false;
}
})
if(addFlag){
addModelSubmit.value.push(item);
}
});
console.log("新增方法");
console.log(addModelSubmit.value);
//新增
addModelSubmit.value.forEach(item=>{
delete item.id;
addModelparam(item).then(response => {
});
});
//修改
updateModelSubmit.value.forEach(item=>{
updateModelparam(item).then(response => {
});
});
//删除
deleteModelIds.value.forEach(item=>{
delModelparam(item).then(response => {
});
});
router.go(-1);
} }
}); });
} }
@ -267,8 +346,7 @@ function getTreeselect() {
devicemodelOptions.value = []; devicemodelOptions.value = [];
const data = { id: 0, modelName: '顶级节点', children: [] }; const data = { id: 0, modelName: '顶级节点', children: [] };
const parentData = response.data.filter(item => { const parentData = response.data.filter(item => {
// 根据需要进行关键字匹配，可以使用 includes()、indexOf() 等方法 return (item.modelTypeId == 1);
return !item.isLeaf;
}); });
data.children = proxy.handleTree(parentData, "id", "pid"); data.children = proxy.handleTree(parentData, "id", "pid");
devicemodelOptions.value.push(data); devicemodelOptions.value.push(data);
@ -280,11 +358,11 @@ onMounted(() => {
// 可以在这里给组件复制 // 可以在这里给组件复制
// form.value.pid=tempPid; // form.value.pid=tempPid;
}); });
function switch_isLeaf() { function modalTypeControllButton(){
if (form.value.dc_is_leaf) { if(form.value.modelTypeId == "2"){
submitButtonShow.value = false; submitButtonShow.value = false;
nextStepButtonShow.value = true; nextStepButtonShow.value = true;
} else { }else if(form.value.modelTypeId == "1"){
submitButtonShow.value = true; submitButtonShow.value = true;
nextStepButtonShow.value = false; nextStepButtonShow.value = false;
} }
@ -293,6 +371,7 @@ function nextStep() {
console.log("---------------"); console.log("---------------");
proxy.$refs["devicemodelRef"].validate(valid => { proxy.$refs["devicemodelRef"].validate(valid => {
// if (valid) { // if (valid) {
selectedModelList.value = oldSelectedList.value;
if(currentStep.value<2){ if(currentStep.value<2){
currentStep.value = currentStep.value + 1; currentStep.value = currentStep.value + 1;
proxy.$refs.carousel.next(); proxy.$refs.carousel.next();
@ -317,18 +396,19 @@ function addParamModel() {
listParamclass(queryParams.value).then(response => { listParamclass(queryParams.value).then(response => {
console.log(response); console.log(response);
paramModelList.value = response.rows; paramModelList.value = response.rows;
paramModelList.value.forEach(item=>{
item.paramClassId = item.id;
item.modelId = form.value.modelCode;
item.controllab = false;
});
console.log(paramModelList); console.log(paramModelList);
addParamModelShow.value = true; addParamModelShow.value = true;
loading.value = false; loading.value = false;
}); });
} }
function handleView() { function handleDelete(element){
selectedModelList.value = selectedModelList.value.filter(item => item.id !== element.id);
}
function handleEdit() {
} }
function selectedSubmit(){ function selectedSubmit(){
@ -337,32 +417,32 @@ function selectedSubmit() {
editing: false, // 添加 'editing' 属性并设置初始值为 false editing: false, // 添加 'editing' 属性并设置初始值为 false
})); }));
if(selectedModelList.value.length>0){ if(selectedModelList.value.length>0){
selectedModelList.value = { selectedModelList.value = [
...selectedModelList, ...selectedModelList.value,
...newSelectedList, ...newSelectedList,
} ];
}else{ }else{
selectedModelList.value = newSelectedList; selectedModelList.value = newSelectedList;
} }
console.log(selectedModelList);
addParamModelShow.value = false; addParamModelShow.value = false;
} }
function startEditing(scope) { function startEditing(row, column, cell, event) {
console.log(scope); if (!updateModelIds.value.includes(row.id)) {
scope.row.editing = true; // 进入编辑模式 updateModelIds.value.push(row.id);
}
row.editing = true; // 进入编辑模式
} }
function saveData(scope) { function saveData(row) {
// 保存数据的逻辑... // 保存数据的逻辑...
scope.row.editing = false; // 保存完成后，切换回显示模式 row.editing = false; // 保存完成后，切换回显示模式
} }
function ifselectable(row, index){ function ifselectable(row, index){
let flag = true; let flag = true;
console.log(selectedModelList.value); console.log(selectedModelList.value);
if (selectedModelList.value != []) { if(selectedModelList.value.length > 0){
selectedModelList.value.forEach(element => { selectedModelList.value.forEach(element => {
if(element.id == row.id){ if(element.id == row.id){
flag = false; flag = false;
@ -372,7 +452,22 @@ function ifselectable(row, index) {
return flag; return flag;
} }
function selectRadio(row){
if (!updateModelIds.value.includes(row.id)) {
updateModelIds.value.push(row.id);
}
}
function getOldModelParams(){
listModelparam(queryParams.value).then(response => {
// oldSelectedList.value = response.rows;
});
}
getTreeselect(); getTreeselect();
getModelTypeList(); getModelTypeList();
getOldModelParams();
</script> </script>

Write Preview
Loading…
Cancel
Save