|
|
|
|
@ -1,385 +0,0 @@
|
|
|
|
|
<template>
|
|
|
|
|
<el-dialog
|
|
|
|
|
class="photoSetDialog"
|
|
|
|
|
title="设置"
|
|
|
|
|
:visible.sync="isShow"
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
|
width="1020px"
|
|
|
|
|
>
|
|
|
|
|
<div class="setTimeTd">
|
|
|
|
|
<h3>时间表规则</h3>
|
|
|
|
|
<div class="flexTimeGz">
|
|
|
|
|
<p class="timeGz" v-for="(val, index) in ruleSchedule" :key="index">
|
|
|
|
|
<span>{{ val.startTime }}</span> ~
|
|
|
|
|
<span>{{ val.endTime }}</span>
|
|
|
|
|
间隔：<b>{{ val.span }}分钟</b>
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<h3>设置通道</h3>
|
|
|
|
|
<div class="chooseTDBox">
|
|
|
|
|
<label>选择通道:</label>
|
|
|
|
|
<div class="checkBox">
|
|
|
|
|
<el-radio-group v-model="checkedAisle" @change="handleChange">
|
|
|
|
|
<el-radio
|
|
|
|
|
:label="val.id"
|
|
|
|
|
border
|
|
|
|
|
v-for="val in aisleList"
|
|
|
|
|
:key="val.id"
|
|
|
|
|
>{{ val.name }}</el-radio
|
|
|
|
|
>
|
|
|
|
|
</el-radio-group>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexnr" v-loading="loading" v-if="newzzList.length !== 0">
|
|
|
|
|
<div class="dybox" v-for="(dyitem, index) in newzzList" :key="index">
|
|
|
|
|
<h4>电压等级：{{ dyitem.name }}</h4>
|
|
|
|
|
<div
|
|
|
|
|
class="xlbox"
|
|
|
|
|
v-for="(xlitem, index) in dyitem.list"
|
|
|
|
|
:key="index"
|
|
|
|
|
>
|
|
|
|
|
<div class="zzbox">
|
|
|
|
|
<el-checkbox
|
|
|
|
|
:indeterminate="isIndeterminate"
|
|
|
|
|
v-model="xlitem.isCheck"
|
|
|
|
|
@change="handleCheckAllChange(item.isCheck, index)"
|
|
|
|
|
>
|
|
|
|
|
<h4>线路：{{ xlitem.name }}</h4>
|
|
|
|
|
</el-checkbox>
|
|
|
|
|
<el-checkbox-group v-model="zzListCheck" @change="handleCheckBox">
|
|
|
|
|
<el-checkbox
|
|
|
|
|
:label="zzitem.id"
|
|
|
|
|
v-for="(zzitem, index) in xlitem.list"
|
|
|
|
|
:key="index"
|
|
|
|
|
>{{ zzitem.displayName }}
|
|
|
|
|
<b v-if="false" class="zzstatus">装置正在下发</b>
|
|
|
|
|
</el-checkbox>
|
|
|
|
|
</el-checkbox-group>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexnr" v-else>
|
|
|
|
|
<p class="nochannel">暂无通道</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<!-- <el-button @click="getCheckedNodes">获取</el-button> -->
|
|
|
|
|
<el-button @click="isShow = false">取 消</el-button>
|
|
|
|
|
<el-button type="primary" @click="submitForm()">确 定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
import {
|
|
|
|
|
setScheduleRulel,
|
|
|
|
|
getScheduleRulelAccessList,
|
|
|
|
|
getTermListByChannelJoggle,
|
|
|
|
|
} from "@/utils/api/index";
|
|
|
|
|
export default {
|
|
|
|
|
props: {
|
|
|
|
|
title: String,
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
contentStyle: { width: "90px" },
|
|
|
|
|
isShow: false,
|
|
|
|
|
selid: 0, //选中时间表id
|
|
|
|
|
ruleSchedule: [], //时间表规则
|
|
|
|
|
checkedAisle: "", //选中通道数据
|
|
|
|
|
aisleList: [], //通道数据内容
|
|
|
|
|
listnr: [], //通道树状结构
|
|
|
|
|
defaultProps: {
|
|
|
|
|
children: "list",
|
|
|
|
|
label: "name",
|
|
|
|
|
},
|
|
|
|
|
ruleid: "",
|
|
|
|
|
parmsList: [], //选中的通道
|
|
|
|
|
multipleSelection: [],
|
|
|
|
|
//新是数据结构参数
|
|
|
|
|
newzzList: [],
|
|
|
|
|
zzListCheck: [],
|
|
|
|
|
loading: false,
|
|
|
|
|
|
|
|
|
|
//全选
|
|
|
|
|
checkAll: true,
|
|
|
|
|
isIndeterminate: true, //全选设置默认选中
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
mounted() {},
|
|
|
|
|
methods: {
|
|
|
|
|
//判断
|
|
|
|
|
getdataform(val) {
|
|
|
|
|
this.selid = val.id;
|
|
|
|
|
this.ruleSchedule = val.list;
|
|
|
|
|
console.log(this.ruleSchedule, "时间规则");
|
|
|
|
|
this.getlistnr();
|
|
|
|
|
},
|
|
|
|
|
//获取所有通道
|
|
|
|
|
getlistnr() {
|
|
|
|
|
getScheduleRulelAccessList({})
|
|
|
|
|
.then((res) => {
|
|
|
|
|
this.listnr = res.data.list;
|
|
|
|
|
this.aisleList = res.data.channellist;
|
|
|
|
|
})
|
|
|
|
|
.catch((err) => {});
|
|
|
|
|
},
|
|
|
|
|
//q全选
|
|
|
|
|
handleCheckAllChange(val, index) {
|
|
|
|
|
let arr = [];
|
|
|
|
|
const re = this.data[index].children;
|
|
|
|
|
//全选
|
|
|
|
|
if (val) {
|
|
|
|
|
for (let i = 0; i < re.length; i++) {
|
|
|
|
|
arr[i] = re[i]["value"];
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
this.data[index].checkedData = arr;
|
|
|
|
|
this.data[index].isIndeterminate = false;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
//选择通道
|
|
|
|
|
handleChange() {
|
|
|
|
|
console.log(this.checkedAisle);
|
|
|
|
|
this.loading = true;
|
|
|
|
|
getTermListByChannelJoggle({
|
|
|
|
|
id: this.checkedAisle,
|
|
|
|
|
})
|
|
|
|
|
.then((res) => {
|
|
|
|
|
console.log(res);
|
|
|
|
|
this.newzzList = res.data.list;
|
|
|
|
|
console.log(this.zzListCheck);
|
|
|
|
|
this.loading = false;
|
|
|
|
|
})
|
|
|
|
|
.catch((err) => {});
|
|
|
|
|
},
|
|
|
|
|
handleCheckBox() {
|
|
|
|
|
console.log(this.zzListCheck);
|
|
|
|
|
},
|
|
|
|
|
//遍历数据
|
|
|
|
|
eachTreeData(data, callback, childKey) {
|
|
|
|
|
if (!childKey) childKey = "children";
|
|
|
|
|
data.forEach((d) => {
|
|
|
|
|
if (callback(d) !== false && d[childKey])
|
|
|
|
|
this.eachTreeData(d[childKey], callback, childKey);
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
//给树的每一个节点 添加一个唯一值key，并算出默认选中的节点key数组
|
|
|
|
|
addKeyToList(data) {
|
|
|
|
|
let key = 0;
|
|
|
|
|
this.eachTreeData(data, (d) => {
|
|
|
|
|
d.key = key++;
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
//获取所选值
|
|
|
|
|
getCheckedNodes() {
|
|
|
|
|
this.parmsList = [];
|
|
|
|
|
const checkedNodes = this.$refs.tree.getCheckedNodes(false, true); //若节点可被选择，则返回目前被选中的节点所组成的数组
|
|
|
|
|
//const checkedParam = []; //定义选中的数组
|
|
|
|
|
let index = -1;
|
|
|
|
|
// console.log(checkedNodes);
|
|
|
|
|
if (checkedNodes.length !== 0) {
|
|
|
|
|
checkedNodes.forEach((item) => {
|
|
|
|
|
// 父节点结构的情况 判断是否有list子节点，如果有定义数组结构
|
|
|
|
|
if (item.list !== undefined) {
|
|
|
|
|
index++;
|
|
|
|
|
this.parmsList[index] = {
|
|
|
|
|
//name: item.name,
|
|
|
|
|
termid: item.id,
|
|
|
|
|
channelidlist: [],
|
|
|
|
|
};
|
|
|
|
|
} else {
|
|
|
|
|
//如果没有list 把子节点id push到 定义的数组channelidlist中
|
|
|
|
|
this.parmsList[index].channelidlist.push(item.id);
|
|
|
|
|
}
|
|
|
|
|
//通过bsManufacturer 判断是否是 线路 获取线路id
|
|
|
|
|
// if (item.bsManufacturer !== undefined) {
|
|
|
|
|
// this.ruleid = item.id;
|
|
|
|
|
// console.log(this.ruleid);
|
|
|
|
|
// }
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
// console.log(this.parmsList);
|
|
|
|
|
//遍历删除没有channelichilddlist的数据，只留下通道
|
|
|
|
|
this.parmsList = this.parmsList
|
|
|
|
|
.filter((item) => item.channelidlist.length !== 0)
|
|
|
|
|
.map((item) => {
|
|
|
|
|
return {
|
|
|
|
|
termid: item.termid,
|
|
|
|
|
channelidlist: item.channelidlist,
|
|
|
|
|
};
|
|
|
|
|
});
|
|
|
|
|
console.log(this.parmsList);
|
|
|
|
|
return this.parmsList;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
// 保存确定操作
|
|
|
|
|
submitForm() {
|
|
|
|
|
console.log(this.zzListCheck);
|
|
|
|
|
console.log(this.checkedAisle);
|
|
|
|
|
let checkzzList = [];
|
|
|
|
|
for (let i = 0; i < this.zzListCheck.length; i++) {
|
|
|
|
|
console.log(this.zzListCheck[i]);
|
|
|
|
|
checkzzList.push({
|
|
|
|
|
termid: this.zzListCheck[i],
|
|
|
|
|
channelidlist: [this.checkedAisle],
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
console.log(checkzzList);
|
|
|
|
|
if (this.zzListCheck.length == 0) {
|
|
|
|
|
this.$message.error("请选择通道");
|
|
|
|
|
} else {
|
|
|
|
|
setScheduleRulel({
|
|
|
|
|
scheduleid: this.selid,
|
|
|
|
|
list: checkzzList,
|
|
|
|
|
})
|
|
|
|
|
.then((res) => {
|
|
|
|
|
this.isShow = false;
|
|
|
|
|
this.$message({
|
|
|
|
|
showClose: true,
|
|
|
|
|
message: '添加成功',type: 'success'
|
|
|
|
|
});;
|
|
|
|
|
this.$parent.deviceList();
|
|
|
|
|
})
|
|
|
|
|
.catch((err) => {
|
|
|
|
|
this.$message({
|
|
|
|
|
showClose: true,
|
|
|
|
|
message: '添加失败',type: 'error'
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
// if (this.parmsList.length == 0)
|
|
|
|
|
// return this.$message.error("通道不能为空");
|
|
|
|
|
// setScheduleRulel({ list: this.parmsList, ruleid: this.selid })
|
|
|
|
|
// .then((res) => {
|
|
|
|
|
// this.isShow = false;
|
|
|
|
|
// this.$message({
|
|
|
|
|
showClose: true,
|
|
|
|
|
message: '添加成功',type: 'success'
|
|
|
|
|
});;
|
|
|
|
|
// this.$parent.deviceList();
|
|
|
|
|
// })
|
|
|
|
|
// .catch((err) => {
|
|
|
|
|
// this.$message({
|
|
|
|
|
showClose: true,
|
|
|
|
|
message: '添加失败',type: 'error'
|
|
|
|
|
});
|
|
|
|
|
// });
|
|
|
|
|
},
|
|
|
|
|
display() {
|
|
|
|
|
this.isShow = true;
|
|
|
|
|
},
|
|
|
|
|
hide() {
|
|
|
|
|
this.isShow = false;
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
<style lang="less">
|
|
|
|
|
.photoSetDialog {
|
|
|
|
|
.el-dialog__body {
|
|
|
|
|
// height: 360px;
|
|
|
|
|
// overflow: auto;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.flexnr {
|
|
|
|
|
height: 360px;
|
|
|
|
|
overflow: auto;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: flex-start;
|
|
|
|
|
border: 1px solid #eee;
|
|
|
|
|
padding: 16px;
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
.dybox {
|
|
|
|
|
h4 {
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: #333;
|
|
|
|
|
line-height: 24px;
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
}
|
|
|
|
|
.xlbox {
|
|
|
|
|
h4 {
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: #333;
|
|
|
|
|
line-height: 24px;
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
}
|
|
|
|
|
margin-left: 16px;
|
|
|
|
|
.zzbox {
|
|
|
|
|
h4 {
|
|
|
|
|
}
|
|
|
|
|
.el-checkbox-group {
|
|
|
|
|
// display: flex;
|
|
|
|
|
// flex-direction: column;
|
|
|
|
|
margin-left: 22px;
|
|
|
|
|
.el-checkbox {
|
|
|
|
|
line-height: 28px;
|
|
|
|
|
//width: 196px;
|
|
|
|
|
.el-checkbox__label {
|
|
|
|
|
b {
|
|
|
|
|
margin-left: 18px;
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.nochannel {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.w50 {
|
|
|
|
|
width: 50px;
|
|
|
|
|
}
|
|
|
|
|
.setTimeTd {
|
|
|
|
|
h3 {
|
|
|
|
|
margin: 8px 0px;
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
line-height: 24px;
|
|
|
|
|
}
|
|
|
|
|
.flexTimeGz {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
.timeGz {
|
|
|
|
|
line-height: 32px;
|
|
|
|
|
margin-right: 16px;
|
|
|
|
|
b {
|
|
|
|
|
font-weight: normal;
|
|
|
|
|
color: #409eff;
|
|
|
|
|
}
|
|
|
|
|
span {
|
|
|
|
|
margin: 0px 8px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.setCheckbox {
|
|
|
|
|
.el-table__header .el-table-column--selection .cell .el-checkbox:after {
|
|
|
|
|
color: #333;
|
|
|
|
|
content: "全选";
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
margin-left: 12px;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.chooseTDBox {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-bottom: 8px;
|
|
|
|
|
label {
|
|
|
|
|
margin-right: 8px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.treeTable {
|
|
|
|
|
margin-top: 16px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
fanluyan
2 years ago