chengdandan
/
InternetCompetition
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Compare commits

base: chengdandan:1988a7ed22c050713bdb1f98bcb4d56454719f3d
Branches Tags
chengdandan:master
...
compare: chengdandan:f8944129e9ba5d7eac8bf99e4f7b7ce9ab67d822
Branches Tags
chengdandan:master

2 Commits
1988a7ed22 ... f8944129e9

Author SHA1 Message Date
lll f8944129e9 1 2023-11-06 09:15:33 +08:00
lll 29c402b1c8 11-06 2023-11-06 09:10:09 +08:00
9 changed files with 1349 additions and 869 deletions
Show Stats Expand all files Collapse all files

33
src/App.vue
View File

@ -190,7 +190,7 @@ export default {
};
</script>
<style>
<style lang="less">
* {
margin: 0;
padding: 0;
@ -208,7 +208,7 @@ export default {
.el-tree,
.tree_menu {
/* background-color: rgba(255, 0, 0, 0.0); */
color: #FFFFFF;
color: #ffffff;
background-image: url(./assets/image/bg.png);
background-size: 100% 100%;
}
@ -225,7 +225,7 @@ export default {
.el_table_body {
/* border-top: 0 !important; */
/* background-color: rgba(19, 31, 59, 0); */
color: #FFFFFF;
color: #ffffff;
background-image: url(./assets/image/bg.png);
background-size: 100% 100%;
}
@ -243,20 +243,16 @@ export default {
.el-tree-node__content:hover {
background-image: url(./assets/image/bg.png);
background-size: 100% 100%;
}
.el-tree-node.is-current>.el-tree-node__content {
.el-tree-node.is-current > .el-tree-node__content {
background-image: url(./assets/image/bg.png);
background-size: 100% 100%;
}
.el-tree-node:focus>.el-tree-node__content {
.el-tree-node:focus > .el-tree-node__content {
background-image: url(./assets/image/bg.png);
background-size: 100% 100%;
}
}
@ -279,7 +275,7 @@ export default {
.el-dialog__header,
.el-table {
color: #FFFFFF;
color: #ffffff;
background-image: url(./assets/image/bg.png);
background-size: cover;
}
@ -318,16 +314,15 @@ export default {
background-size: cover;
}
.el-tree-node.is-current>.el-tree-node__content {
background-image: url(./assets/image/bg.png);
background-size: cover;
}
.el-tree-node:focus>.el-tree-node__content {
.el-tree-node.is-current > .el-tree-node__content {
background-image: url(./assets/image/bg.png);
background-size: cover;
}
/* 弹窗 */</style>
.el-tree-node:focus > .el-tree-node__content {
background-image: url(./assets/image/bg.png);
background-size: cover;
}
/* 弹窗 */
</style>

160
src/components/DataAcquisition.vue
View File

@ -5,35 +5,77 @@
</div> -->
<div>
<el-dialog title="新建网关" :visible.sync="outerVisible" width="382px">
<el-form :model="formdata" :rules="rules" ref="ruleForm" label-width="85px" class="demo-ruleForm">
<el-form
:model="formdata"
:rules="rules"
ref="ruleForm"
label-width="85px"
class="demo-ruleForm"
>
<el-form-item label="网关名称:" prop="wgpz_wgmc">
<el-select v-model="formdata.wgpz_wgmc" placeholder="有线区网关1" style="width: 200px;">
<el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value">
<el-select
v-model="formdata.wgpz_wgmc"
placeholder="有线区网关1"
style="width: 200px"
>
<el-option
v-for="item in options1"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="网关ID:" prop="wgpz_wgid">
<el-select v-model="formdata.wgpz_wgid" placeholder="LAN-BOX1" style="width: 200px;">
<el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value">
<el-select
v-model="formdata.wgpz_wgid"
placeholder="LAN-BOX1"
style="width: 200px"
>
<el-option
v-for="item in options2"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="网关类型:" prop="wgpz_wglx">
<el-select v-model="formdata.wgpz_wglx" placeholder="lot Life 网关" style="width: 200px;">
<el-option v-for="item in options3" :key="item.value" :label="item.label" :value="item.value">
<el-select
v-model="formdata.wgpz_wglx"
placeholder="lot Life 网关"
style="width: 200px"
>
<el-option
v-for="item in options3"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
</el-form>
<el-dialog width="382px" title="系统提示" :visible.sync="innerVisible" append-to-body>
<p class="inner_content">请确认选择的网关类型与网关实体一致:否则该工程无法下载至实体网关</p>
<el-dialog
width="382px"
title="系统提示"
:visible.sync="innerVisible"
append-to-body
>
<p class="inner_content" style="color: #fff">
请确认选择的网关类型与网关实体一致:否则该工程无法下载至实体网关
</p>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="innerConfirm">确定</el-button>
<el-button @click="innerVisible = false">取 消</el-button>
</div>
</el-dialog>
<div slot="footer" class="dialog-footer-outer">
<el-button type="primary" @click="innerVisible = true">保存</el-button>
<el-button type="primary" @click="innerVisible = true"
>保存</el-button
>
<el-button @click="outerVisible = false">取 消</el-button>
</div>
</el-dialog>
@ -44,59 +86,71 @@
<script>
import { SaveUserAnswer, GetUserAnswer } from "@/api/user";
export default {
name: 'TestDataAcquisition',
name: "TestDataAcquisition",
data() {
return {
options1: [{
options1: [
{
value: "有线区网关1",
label: "有线区网关1",
}, {
value: "无线区网关1",
label: "无线区网关1",
}],
options2: [{
value: "LAN-BOX1",
label: "LAN-BOX1",
}, {
value: "WLAN-BOX1",
label: "WLAN-BOX1",
}],
options3: [{
value: 'loT Lite网关',
label: 'loT Lite网关'
}, {
value: 'MODBUS网关',
label: 'MODBUS网关'
}, {
value: 'BACNET网关',
label: 'BACNET网关'
}, {
value: 'OPC UA网关',
label: 'OPC UA网关'
}, {
value: 'OPC DA网关',
label: 'OPC DA网关'
},
{
value: 'loT网关',
label: 'loT网关'
}],
value: '',
value: "无线区网关1",
label: "无线区网关1",
},
],
options2: [
{
value: "LAN-BOX1",
label: "LAN-BOX1",
},
{
value: "WLAN-BOX1",
label: "WLAN-BOX1",
},
],
options3: [
{
value: "loT Lite网关",
label: "loT Lite网关",
},
{
value: "MODBUS网关",
label: "MODBUS网关",
},
{
value: "BACNET网关",
label: "BACNET网关",
},
{
value: "OPC UA网关",
label: "OPC UA网关",
},
{
value: "OPC DA网关",
label: "OPC DA网关",
},
{
value: "loT网关",
label: "loT网关",
},
],
value: "",
formdata: {
wgpz_wgmc: "有线区网关1",
wgpz_wgid: "LAN-BOX1",
wgpz_wglx: "loT网关"
wgpz_wglx: "loT网关",
},
rules: {
wgpz_wgmc: [
{ required: true, message: '请选择网关名称', trigger: 'change' },
{ required: true, message: "请选择网关名称", trigger: "change" },
],
wgpz_wgid: [
{ required: true, message: '请选择网关id', trigger: 'change' },
{ required: true, message: "请选择网关id", trigger: "change" },
],
wgpz_wglx: [
{ required: true, message: '请选择网关类型', trigger: 'change' }
{ required: true, message: "请选择网关类型", trigger: "change" },
],
},
outerVisible: true,
@ -104,9 +158,7 @@ export default {
};
},
mounted() {
},
mounted() {},
methods: {
async innerConfirm() {
@ -120,11 +172,11 @@ export default {
mark: "DB-IotLite_yx",
user_id: "USER202307301109254198",
mark_value: JSON.stringify(this.formdata),
})
});
console.log(JSON.parse(res.data.data.mark_value));
sessionStorage.setItem('answer', JSON.stringify(this.formdata))
sessionStorage.setItem("answer", JSON.stringify(this.formdata));
this.$router.replace("/channelconfig");
}
},
},
async created() {
let res2 = await GetUserAnswer({
@ -139,7 +191,7 @@ export default {
console.log(this.formdata.wgpz_wgid);
this.formdata.wgpz_wgmc = res3.wgpz_wgmc;
this.formdata.wgpz_wglx = res3.wgpz_wglx;
}
},
};
</script>
@ -155,6 +207,6 @@ export default {
// color: rgba(255, 255, 255, 0);
font-size: 14px;
text-align: left;
font-family: SourceHanSansSC-regular;
font-family: "SourceHanSansSC-regular";
}
</style>

137
src/components/DataView.vue
View File

@ -3,7 +3,12 @@
<div>
<!-- <div> <el-button type="info" plain @click="dialogFormVisible = true">IP设置</el-button></div> -->
<!-- 无线网关 -->
<el-dialog title="IP设置" :visible.sync="dialogFormVisible" :append-to-body="true" width="894px">
<el-dialog
title="IP设置"
:visible.sync="dialogFormVisible"
:append-to-body="true"
width="894px"
>
<div class="form_content">
<div>
<p class="netWay">网络方式</p>
@ -14,19 +19,36 @@
<!-- v-if="ippz_lwfs == 1 ? true : false" -->
<div>
<h2>有线</h2>
<el-form :label-position="labelPosition" label-width="80px" :rules="rules_ippz_wirle" ref="reform">
<el-form
:label-position="labelPosition"
label-width="80px"
:rules="rules_ippz_wirle"
ref="reform"
>
<div class="wired">
<el-row>
<el-col :span="12">
<el-form-item label="网口:" :label-width="formLabelWidth" prop="ippz_wangkou">
<el-select v-model="ippz_wangkou" placeholder="ETHO" style="width: 200px; height: 30px">
<el-form-item
label="网口:"
:label-width="formLabelWidth"
prop="ippz_wangkou"
>
<el-select
v-model="ippz_wangkou"
placeholder="ETHO"
style="width: 200px; height: 30px"
>
<el-option label="ETH0" value="ETH0"></el-option>
<el-option label="ETH1" value="ETH1"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="默认网关:" :label-width="formLabelWidth" prop="ippz_mrwg">
<el-form-item
label="默认网关:"
:label-width="formLabelWidth"
prop="ippz_mrwg"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_mrwg1"></el-input>
@ -49,7 +71,11 @@
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="子网掩码:" :label-width="formLabelWidth" prop="ippz_zwym">
<el-form-item
label="子网掩码:"
:label-width="formLabelWidth"
prop="ippz_zwym"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_zwym1"></el-input>
@ -70,7 +96,11 @@
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="IP地址:" :label-width="formLabelWidth" prop="ippz_ip">
<el-form-item
label="IP地址:"
:label-width="formLabelWidth"
prop="ippz_ip"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_ip1"></el-input>
@ -93,7 +123,11 @@
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="首选DNS:" :label-width="formLabelWidth" prop="ippz_dns_sx">
<el-form-item
label="首选DNS:"
:label-width="formLabelWidth"
prop="ippz_dns_sx"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_dns_sx1"></el-input>
@ -114,7 +148,11 @@
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备选DNS:" :label-width="formLabelWidth" prop="ippz_dns_by">
<el-form-item
label="备选DNS:"
:label-width="formLabelWidth"
prop="ippz_dns_by"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_dns_by1"></el-input>
@ -137,11 +175,20 @@
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="MAC地址:" :label-width="formLabelWidth" prop="ippz_mac">
<el-form-item
label="MAC地址:"
:label-width="formLabelWidth"
prop="ippz_mac"
>
<el-row>
<el-col :span="24" class="mac">
<el-input style="width: 200px; height: 30px" v-model="ippz_mac"></el-input><el-button
v-copy="ippz_mac" @click="CopyText">复制</el-button>
<el-input
style="width: 200px; height: 30px"
v-model="ippz_mac"
></el-input
><el-button v-copy="ippz_mac" @click="CopyText"
>复制</el-button
>
</el-col>
</el-row>
</el-form-item>
@ -153,17 +200,37 @@
<!-- v-if="ippz_lwfs == 2 ? true : false" -->
<div>
<h2>WIFI</h2>
<el-form :label-position="labelPosition" label-width="80px" :rules="rules_ippz_wifi" ref="reform">
<el-form
:label-position="labelPosition"
label-width="80px"
:rules="rules_ippz_wifi"
ref="reform"
>
<div class="wifi">
<el-row>
<el-col :span="12">
<el-form-item label="SSID:" :label-width="formLabelWidth" prop="ippz_wifi_ssid">
<el-input v-model="ippz_wifi_ssid" placeholder="请输入SSID"></el-input>
<el-form-item
label="SSID:"
:label-width="formLabelWidth"
prop="ippz_wifi_ssid"
>
<el-input
v-model="ippz_wifi_ssid"
placeholder="请输入SSID"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="密码:" :label-width="formLabelWidth" prop="ippz_wifi_mm">
<el-input v-model="ippz_wifi_mm" placeholder="" style="width: 200px; height: 30px"></el-input>
<el-form-item
label="密码:"
:label-width="formLabelWidth"
prop="ippz_wifi_mm"
>
<el-input
v-model="ippz_wifi_mm"
placeholder=""
style="width: 200px; height: 30px"
></el-input>
</el-form-item>
</el-col>
</el-row>
@ -234,7 +301,11 @@
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="首选DNS:" :label-width="formLabelWidth" prop="ippz_dns_sx">
<el-form-item
label="首选DNS:"
:label-width="formLabelWidth"
prop="ippz_dns_sx"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_dns_sx1"></el-input>
@ -257,7 +328,11 @@
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="备选DNS:" :label-width="formLabelWidth" prop="ippz_dns_by">
<el-form-item
label="备选DNS:"
:label-width="formLabelWidth"
prop="ippz_dns_by"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_dns_by1"></el-input>
@ -278,11 +353,17 @@
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="MAC地址:" :label-width="formLabelWidth" prop="ippz_mac">
<el-form-item
label="MAC地址:"
:label-width="formLabelWidth"
prop="ippz_mac"
>
<el-row>
<el-col :span="24" class="mac">
<el-input style="width: 200px" v-model="ippz_mac" /><el-button
v-copy="formdata.ippz_mac">复制</el-button>
<el-input
style="width: 200px"
v-model="ippz_mac"
/><el-button v-copy="formdata.ippz_mac">复制</el-button>
</el-col>
</el-row>
</el-form-item>
@ -451,17 +532,17 @@ export default {
let res = await SaveUserAnswer({
mark: "DB-IotLite_wx",
user_id: "USER202307301109254198",
mark_value: JSON.stringify(this.formdata)
})
mark_value: JSON.stringify(this.formdata),
});
console.log(res);
sessionStorage.setItem("answer", JSON.stringify(this.formdata));
},
CopyText() {
this.$message({
message: '复制成功',
type: 'success'
message: "复制成功",
type: "success",
});
}
},
},
async created() {
let res2 = await GetUserAnswer({
@ -501,7 +582,7 @@ export default {
this.ippz_dns_by3 = this.SliceData(this.ippz_dns_by)[2];
this.ippz_dns_by4 = this.SliceData(this.ippz_dns_by)[3];
},
mounted() { },
mounted() {},
directives: {
copy: {
bind(el, { value }) {

213
src/components/DeviceWirle.vue
View File

@ -4,20 +4,26 @@
<div v-click-outside="closeMenu">
<!-- <el-button type="info" plain @click="dialogVisible = true">设备设置</el-button> -->
<div class="tree_menu" v-show="dialogVisible">
<el-tree :data="datas" :props="defaultProps" @node-contextmenu="rightClick"
@node-click="treeNodeClick"></el-tree>
<el-tree
:data="datas"
:props="defaultProps"
@node-contextmenu="rightClick"
@node-click="treeNodeClick"
></el-tree>
<!-- 树形控件右键组件 -->
<div v-show="menuShow" class="tree_rightmenu" :style="{ ...rightMenu }">
<el-menu class="el-menu-vertical-demo" @select="selectMenuNode" default-active="#0078FE">
<el-menu-item id="menuitem" index="1" style="font-size: 12px;">
<el-menu
class="el-menu-vertical-demo"
@select="selectMenuNode"
default-active="#0078FE"
>
<el-menu-item id="menuitem" index="1" style="font-size: 12px">
<span slot="title">新建设备</span>
</el-menu-item>
<el-menu-item index="2" style="font-size: 12px;">
<el-menu-item index="2" style="font-size: 12px">
<span slot="title">删 除</span>
</el-menu-item>
<el-menu-item index="3" style="font-size: 12px;">
<el-menu-item index="3" style="font-size: 12px">
<span slot="title">取 消</span>
</el-menu-item>
</el-menu>
@ -29,10 +35,22 @@
<el-form :label-position="labelPosition" :rules="rules" ref="ruleForm">
<el-row>
<el-col :span="24">
<el-form-item label="设备ID:" :label-width="formLabelWidth" prop="sbpz_sbid">
<el-select v-model="sbpz_sbid" placeholder="" style="width: 200px;height:30px">
<el-option v-for="item in options1" :key="item.value" :label="item.label"
:value="item.value">
<el-form-item
label="设备ID:"
:label-width="formLabelWidth"
prop="sbpz_sbid"
>
<el-select
v-model="sbpz_sbid"
placeholder=""
style="width: 200px; height: 30px"
>
<el-option
v-for="item in options1"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
@ -40,10 +58,22 @@
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="设备名称:" :label-width="formLabelWidth" prop="dev_name">
<el-select v-model="sbpz_sbmc" placeholder="" style="width: 200px;height:30px">
<el-option v-for="item in options2" :key="item.value" :label="item.label"
:value="item.value">
<el-form-item
label="设备名称:"
:label-width="formLabelWidth"
prop="dev_name"
>
<el-select
v-model="sbpz_sbmc"
placeholder=""
style="width: 200px; height: 30px"
>
<el-option
v-for="item in options2"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
@ -51,8 +81,16 @@
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="设备地址:" :label-width="formLabelWidth" prop="dev_address">
<el-input v-model="sbpz_sbdz" placeholder="" style="width: 200px;height:30px"></el-input>
<el-form-item
label="设备地址:"
:label-width="formLabelWidth"
prop="dev_address"
>
<el-input
v-model="sbpz_sbdz"
placeholder=""
style="width: 200px; height: 30px"
></el-input>
</el-form-item>
</el-col>
</el-row>
@ -73,7 +111,9 @@
</el-row>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="add_passage = false">保 存</el-button>
<el-button type="primary" @click="add_passage = false"
>保 存</el-button
>
<el-button @click="add_passage = false">取 消</el-button>
</span>
</el-dialog>
@ -83,7 +123,7 @@
<script>
export default {
name: 'DeviceView',
name: "DeviceView",
data() {
return {
@ -91,7 +131,7 @@ export default {
sbpz_sbmc: "有线区精雕1",
sbpz_sbdz: "1",
sbpz_jysb: "",
sbpz_jdzxz: "0",
sbpz_jdzxz: false,
labelPosition: "left",
formLabelWidth: "116px",
input1: 192,
@ -99,101 +139,109 @@ export default {
rightMenu: "",
dialogVisible: true,
menuShow: false,
options1: [{
options1: [
{
value: "有线区加工设备1",
label: "有线区加工设备1"
}, {
label: "有线区加工设备1",
},
{
value: "无线区加工设备1",
label: "无线区加工设备1"
}],
options2: [{
label: "无线区加工设备1",
},
],
options2: [
{
value: "有线区精雕1",
label: "有线区精雕1",
}, {
},
{
value: "无线区精雕1",
label: "无线区精雕1",
}],
datas: [{
label: 'Gateway',
children: [{
label: '数据采集',
children: [{
label: 'I/O点'
},
],
datas: [
{
label: "Gateway",
children: [
{
label: "数据采集",
children: [
{
label: "I/O点",
},
{
label: '用户点',
label: "用户点",
},
{
label: '计算点',
label: "计算点",
},
{
label: '系统点',
label: "系统点",
},
]
],
},
{
label: "数据服务",
children: [{
label: "Modbus"
}]
children: [
{
label: "Modbus",
},
],
},
{
label: "IOT",
children: [
{
label: "Mqtt Client"
label: "Mqtt Client",
},
{
label: "Alink"
label: "Alink",
},
{
label: "Tlink"
label: "Tlink",
},
{
label: "loTDDC"
label: "loTDDC",
},
{
label: "Ulink"
label: "Ulink",
},
]
}
]
}],
],
},
],
},
],
defaultProps: {
children: 'children',
label: 'label'
children: "children",
label: "label",
},
rules: {
dev_id: [
{ required: true, message: '请输入设备ID', trigger: 'blur' },
],
dev_id: [{ required: true, message: "请输入设备ID", trigger: "blur" }],
dev_name: [
{ required: true, message: '请输入设备名称', trigger: 'blur' },
{ min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
{ required: true, message: "请输入设备名称", trigger: "blur" },
{ min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" },
],
dev_address: [
{ required: true, message: '请输入设备地址', trigger: 'blur' },
{ required: true, message: "请输入设备地址", trigger: "blur" },
],
},
};
},
mounted() {
},
mounted() {},
methods: {
rightClick(e, data, node) {
this.menuShow = false
this.menuShow = true
e.preventDefault() //关闭浏览器右键默认事件
this.rightMenu = { top: e.pageY + 'px', left: e.pageX + 'px' }
document.addEventListener('click', (ev) => {
ev.stopImmediatePropagation()
if (ev.target !== document.querySelector('.el-menu-item.is-active')) {
this.foo()
this.menuShow = false;
this.menuShow = true;
e.preventDefault(); //关闭浏览器右键默认事件
this.rightMenu = { top: e.pageY + "px", left: e.pageX + "px" };
document.addEventListener("click", (ev) => {
ev.stopImmediatePropagation();
if (ev.target !== document.querySelector(".el-menu-item.is-active")) {
this.foo();
}
})
});
},
// 点击时候的判断,判断是否为新增设备
selectMenuNode(index, indexPath) {
@ -204,11 +252,11 @@ export default {
},
foo() {
// 取消鼠标监听事件 菜单栏
this.menuShow = false
document.removeEventListener('click', this.foo) // 关掉监听，
this.menuShow = false;
document.removeEventListener("click", this.foo); // 关掉监听，
},
treeNodeClick() {
this.foo()
this.foo();
},
getDriveName() {
this.diag_drive = true;
@ -220,12 +268,12 @@ export default {
saveDevice() {
this.add_passage = false;
this.$router.push("/dbcollect");
}
},
},
directives: {
'click-outside': {
"click-outside": {
bind: function (el, binding, vnode) {
console.log('el', el);
console.log("el", el);
console.log("binding", binding);
el.event = function (event) {
// 检查点击是否发生在节点之内（包括子节点）
@ -233,18 +281,18 @@ export default {
// 如果没有，则触发调用
// 若绑定值为函数，则执行
// 这里我们可以通过钩子函数中的 vnode.context，来获取当前组件的作用域
if (typeof vnode.context[binding.expression] == 'function') {
vnode.context[binding.expression](event)
}
if (typeof vnode.context[binding.expression] == "function") {
vnode.context[binding.expression](event);
}
}
};
// 绑定事件
// 设置为true，代表在DOM树中，注册了该listener的元素，会先于它下方的任何事件目标，接收到该事件。
document.body.addEventListener('click', el.event, true)
document.body.addEventListener("click", el.event, true);
},
unbind: function (el) {
// 解绑事件
document.body.removeEventListener('click', el.event, true)
document.body.removeEventListener("click", el.event, true);
},
},
},
@ -333,7 +381,6 @@ export default {
}
.el-input__inner {
text-align: left;
padding: 0 8px;
}

227
src/components/GateWay.vue
View File

@ -2,28 +2,48 @@
<template>
<div>
<!-- <div> <el-button type="info" plain @click="dialogFormVisible = true">IP设置</el-button></div> -->
<el-dialog title="IP设置" :visible.sync="dialogFormVisible" :append-to-body="true" width="894px">
<el-dialog
title="IP设置"
:visible.sync="dialogFormVisible"
:append-to-body="true"
width="894px"
>
<div class="form_content">
<el-form :label-position="labelPosition" label-width="80px" :rules="rules_ippz_wirle" ref="reform">
<el-form
:label-position="labelPosition"
label-width="80px"
:rules="rules_ippz_wirle"
ref="reform"
>
<div class="wired">
<el-row>
<el-col :span="12">
<el-form-item label="网口:" :label-width="formLabelWidth" prop="ippz_wangkou">
<el-select v-model="ippz_wangkou" placeholder="ETHO" style="width: 200px;height:30px">
<el-form-item
label="网口:"
:label-width="formLabelWidth"
prop="ippz_wangkou"
>
<el-select
v-model="ippz_wangkou"
placeholder="ETHO"
style="width: 200px; height: 30px"
>
<el-option label="ETH0" value="ETH0"></el-option>
<el-option label="ETH1" value="ETH1"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="默认网关:" :label-width="formLabelWidth" prop="ippz_mrwg">
<el-form-item
label="默认网关:"
:label-width="formLabelWidth"
prop="ippz_mrwg"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_mrwg1"></el-input>
</el-col>
<el-col :span="1">.
</el-col>
<el-col :span="1">. </el-col>
<el-col :span="5">
<el-input v-model="ippz_mrwg2"></el-input>
</el-col>
@ -41,7 +61,11 @@
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="子网掩码:" :label-width="formLabelWidth" prop="ippz_zwym">
<el-form-item
label="子网掩码:"
:label-width="formLabelWidth"
prop="ippz_zwym"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_zwym1"></el-input>
@ -62,23 +86,26 @@
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="IP地址:" :label-width="formLabelWidth" prop="ippz_ip">
<el-form-item
label="IP地址:"
:label-width="formLabelWidth"
prop="ippz_ip"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_ip1"></el-input>
</el-col>
<el-col :span="1">.
<el-input v-model="ippz_ip1" maxlength="3"></el-input>
</el-col>
<el-col :span="1">. </el-col>
<el-col :span="5">
<el-input v-model="ippz_ip2"></el-input>
<el-input v-model="ippz_ip2" maxlength="3"></el-input>
</el-col>
<el-col :span="1">.</el-col>
<el-col :span="5">
<el-input v-model="ippz_ip3"></el-input>
<el-input v-model="ippz_ip3" maxlength="3"></el-input>
</el-col>
<el-col :span="1">.</el-col>
<el-col :span="5">
<el-input v-model="ippz_ip4"></el-input>
<el-input v-model="ippz_ip4" maxlength="3"></el-input>
</el-col>
</el-row>
</el-form-item>
@ -86,7 +113,11 @@
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="首选DNS:" :label-width="formLabelWidth" prop="ippz_dns_sx">
<el-form-item
label="首选DNS:"
:label-width="formLabelWidth"
prop="ippz_dns_sx"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_dns_sx1"></el-input>
@ -107,13 +138,16 @@
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备选DNS:" :label-width="formLabelWidth" prop="ippz_dns_by">
<el-form-item
label="备选DNS:"
:label-width="formLabelWidth"
prop="ippz_dns_by"
>
<el-row>
<el-col :span="5">
<el-input v-model="ippz_dns_by1"></el-input>
</el-col>
<el-col :span="1">.
</el-col>
<el-col :span="1">. </el-col>
<el-col :span="5">
<el-input v-model="ippz_dns_by2"></el-input>
</el-col>
@ -131,11 +165,20 @@
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="MAC地址:" :label-width="formLabelWidth" prop="ippz_mac">
<el-form-item
label="MAC地址:"
:label-width="formLabelWidth"
prop="ippz_mac"
>
<el-row>
<el-col :span="24" class="mac">
<el-input style="width: 200px;height:30px" v-model="ippz_mac"></el-input><el-button
v-copy="ippz_mac" @click="CopyText">复制</el-button>
<el-input
style="width: 200px; height: 30px"
v-model="ippz_mac"
></el-input
><el-button v-copy="ippz_mac" @click="CopyText"
>复制</el-button
>
</el-col>
</el-row>
</el-form-item>
@ -145,9 +188,10 @@
</el-form>
<div slot="footer" class="dialog-footer footer">
<el-button type="primary" @click="saveAll">保 存</el-button>
<el-button type="primary" @click="saveAll" :disabled="disabled"
>保 存</el-button
>
<el-button @click="dialogFormVisible = false">取 消</el-button>
</div>
</div>
</el-dialog>
@ -157,11 +201,12 @@
<script>
import { SaveUserAnswer, GetUserAnswer } from "../api/user";
export default {
name: 'DataView',
name: "DataView",
data() {
return {
disabled: true,
// 判断是否保存过
isSaveAnswer: false,
//
formdata: {
ippz_wangkou: "1",
@ -205,49 +250,55 @@ export default {
ippz_wifi_mm: "",
ippz_lwfs: "1",
dialogFormVisible: true,
formLabelWidth: '100px',
formLabelWidth: "100px",
// 有线的规则校验
rules_ippz_wirle: {
ippz_wangkou: [
{ required: true, message: '请输入网口', trigger: 'change' },
{ required: true, message: "请输入网口", trigger: "change" },
],
ippz_zwym: [
{ required: true, message: '请输入子网掩码', trigger: 'blur' },
],
ippz_ip: [
{ required: true, message: '请输入IP地址', trigger: 'blur' },
{ required: true, message: "请输入子网掩码", trigger: "blur" },
],
ippz_ip: [{ required: true, message: "请输入IP地址", trigger: "blur" }],
ippz_mrwg: [
{ required: true, message: '请输入默认网关', trigger: 'blur' },
{ required: true, message: "请输入默认网关", trigger: "blur" },
],
ippz_dns_sx: [
{ required: true, message: '请输入首选DNS', trigger: 'blur' },
{ required: true, message: "请输入首选DNS", trigger: "blur" },
],
ippz_dns_by: [
{ required: true, message: '请输入备选DNS', trigger: 'blur' },
{ required: true, message: "请输入备选DNS", trigger: "blur" },
],
ippz_mac: [
{ required: true, message: '请输入备选DNS', trigger: 'blur' },
{ required: true, message: "请输入备选DNS", trigger: "blur" },
],
},
rules_ippz_wifi: {
ippz_wifi_ssid: [
{ required: true, message: '请输入SSID', trigger: 'blur' },
{ required: true, message: "请输入SSID", trigger: "blur" },
],
ippz_wifi_mm: [
{ required: true, message: '请输入密码', trigger: 'blur' },
{ required: true, message: "请输入密码", trigger: "blur" },
],
ippz_dns_sx: [
{ required: true, message: '请输入首选DNS', trigger: 'blur' },
{ required: true, message: "请输入首选DNS", trigger: "blur" },
],
ippz_dns_by: [
{ required: true, message: '请输入备选DNS', trigger: 'blur' },
{ required: true, message: "请输入备选DNS", trigger: "blur" },
],
ippz_mac: [
{ required: true, message: '请输入备选DNS', trigger: 'blur' },
{ required: true, message: "请输入备选DNS", trigger: "blur" },
],
}
}
},
};
},
computed: {
isSaveButtonDisabled() {
return (
!this.$refs.rules_ippz_wirle ||
this.$refs.rules_ippz_wirle.validateSync().length > 0
);
},
},
methods: {
// 封装合并输入框的数据
@ -265,27 +316,57 @@ export default {
this.dialogFormVisible = false;
this.isSaveAnswer = true;
this.formdata.ippz_wangkou = this.ippz_wangkou;
this.formdata.ippz_ip = this.Merge(this.ippz_ip, this.ippz_ip1, this.ippz_ip2, this.ippz_ip3, this.ippz_ip4);
this.formdata.ippz_zwym = this.Merge(this.ippz_zwym, this.ippz_zwym1, this.ippz_zwym2, this.ippz_zwym3, this.ippz_zwym4);
this.formdata.ippz_mrwg = this.Merge(this.ippz_mrwg, this.ippz_mrwg1, this.ippz_mrwg2, this.ippz_mrwg3, this.ippz_mrwg4);
this.formdata.ippz_dns_sx = this.Merge(this.ippz_dns_sx, this.ippz_dns_sx1, this.ippz_dns_sx2, this.ippz_dns_sx3, this.ippz_dns_sx4);
this.formdata.ippz_dns_by = this.Merge(this.ippz_dns_by, this.ippz_dns_by1, this.ippz_dns_by2, this.ippz_dns_by3, this.ippz_dns_by4);
this.formdata.ippz_ip = this.Merge(
this.ippz_ip,
this.ippz_ip1,
this.ippz_ip2,
this.ippz_ip3,
this.ippz_ip4
);
this.formdata.ippz_zwym = this.Merge(
this.ippz_zwym,
this.ippz_zwym1,
this.ippz_zwym2,
this.ippz_zwym3,
this.ippz_zwym4
);
this.formdata.ippz_mrwg = this.Merge(
this.ippz_mrwg,
this.ippz_mrwg1,
this.ippz_mrwg2,
this.ippz_mrwg3,
this.ippz_mrwg4
);
this.formdata.ippz_dns_sx = this.Merge(
this.ippz_dns_sx,
this.ippz_dns_sx1,
this.ippz_dns_sx2,
this.ippz_dns_sx3,
this.ippz_dns_sx4
);
this.formdata.ippz_dns_by = this.Merge(
this.ippz_dns_by,
this.ippz_dns_by1,
this.ippz_dns_by2,
this.ippz_dns_by3,
this.ippz_dns_by4
);
this.formdata.ippz_mac = this.ippz_mac;
sessionStorage.setItem("answer", JSON.stringify(this.formdata));
let data = {
mark: "DB-IotLite_yx",
user_id: "USER202307301109254198",
mark_value: JSON.stringify(this.formdata)
}
mark_value: JSON.stringify(this.formdata),
};
let res1 = await SaveUserAnswer(data);
console.log(res1);
},
CopyText() {
this.$message({
message: '复制成功',
type: 'success'
message: "复制成功",
type: "success",
});
}
},
},
async created() {
let res2 = await GetUserAnswer({
@ -323,40 +404,38 @@ export default {
this.ippz_dns_by3 = this.SliceData(this.ippz_dns_by)[2];
this.ippz_dns_by4 = this.SliceData(this.ippz_dns_by)[3];
},
mounted() {
},
mounted() {},
directives: {
copy: {
bind(el, { value }) {
// 给元素赋值一个$value值,即指令绑定的值
el.$value = value
el.$value = value;
el.handler = () => {
// 如果可复制的值为空的时候，给出提示；
if (!el.$value) {
console.log('无复制内容')
return
console.log("无复制内容");
return;
}
// 动态创建 textarea 标签
const textarea = document.createElement('textarea');
const textarea = document.createElement("textarea");
// 将该 textarea 设为 readonly 防止 IOS 下自动唤起键盘，同时将 textarea 移除可视区域
textarea.readOnly = 'readonly';
textarea.style.position = 'absolute';
textarea.style.left = '-9999px';
textarea.readOnly = "readonly";
textarea.style.position = "absolute";
textarea.style.left = "-9999px";
// 将要copy的值赋值给textarea 标签的value属性
textarea.value = el.$value;
// 将textarea 插入到body中
document.body.appendChild(textarea);
// 选中值并复制
textarea.select()
const result = document.execCommand('Copy');
textarea.select();
const result = document.execCommand("Copy");
if (result) {
console.log('复制成功');
console.log("复制成功");
}
document.body.removeChild(textarea);
}
};
// 绑定点击事件，点击的时候copy值
el.addEventListener('click', el.handler);
el.addEventListener("click", el.handler);
},
// 当传递进来的值更新的时候触发
componentUpdated(el, { value }) {
@ -364,11 +443,11 @@ export default {
},
// 指令与元素解绑的时候，移除事件绑定
unbind(el) {
el.removeEventListener('click', el.handler);
}
}
}
}
el.removeEventListener("click", el.handler);
},
},
},
};
</script>
<style lang="less" scoped>

50
src/components/GatewayConfiguration.vue
View File

@ -12,29 +12,37 @@
<el-button>筛选</el-button>
</div>
</div>
<el-table ref="multipleTable" :data="wgpz" border style="margin-top: 10px" tooltip-effect="dark"
@selection-change="handleSelectionChange" :cell-style="cellStyle">
<el-table
ref="multipleTable"
:data="wgpz"
border
style="margin-top: 10px"
tooltip-effect="dark"
@selection-change="handleSelectionChange"
:cell-style="cellStyle"
>
<el-table-column label="序号">
<template slot-scope="scope">
{{ scope.$index + 1 }}
</template></el-table-column>
</template></el-table-column
>
<el-table-column type="selection" width="55"> </el-table-column>
<el-table-column prop="wgid" label="网关ID" > </el-table-column>
<el-table-column prop="wgid" label="网关ID"> </el-table-column>
<el-table-column prop="wgbh" label="网关编号"> </el-table-column>
<el-table-column prop="wgmc" label="网关名称"> </el-table-column>
<el-table-column prop="wglx" label="网关类型"> </el-table-column>
<el-table-column prop="whr" label="维护人"> </el-table-column>
<el-table-column prop="whsj" label="维护时间"> </el-table-column>
<el-table-column prop="wgzt" label="网关状态"> </el-table-column>
<el-table-column prop="zxxtsj" label="最新心跳时间"> </el-table-column>
<el-table-column label="修改">
<template slot-scope="scope">
<el-button type="text" size="small">删除</el-button>
</template></el-table-column>
</template></el-table-column
>
<el-table-column label="详细">
<template slot-scope="scope">
<el-button type="text" size="small">查看</el-button>
</template></el-table-column>
</template></el-table-column
>
<el-table-column label="参数配置">
<template slot-scope="scope">
<el-button type="text" size="small">参数配置</el-button>
@ -44,8 +52,14 @@
</el-dialog>
<el-dialog title="新建网关" :visible.sync="flag" width="30%">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="150px" class="demo-ruleForm"
:label-position="labelPosition">
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="150px"
class="demo-ruleForm"
:label-position="labelPosition"
>
<el-form-item label="网关类型:" prop="wglx">
<el-col :span="12">
<el-select v-model="ruleForm.wglx">
@ -141,7 +155,9 @@ export default {
wglx: [
{ required: true, trigger: "change", message: "请选择一个选项" },
],
wgid: [{ required: true, trigger: "change", message: "请选择一个选项" }],
wgid: [
{ required: true, trigger: "change", message: "请选择一个选项" },
],
wgbh: [
{ required: true, trigger: "change", message: "请选择一个选项" },
],
@ -152,7 +168,7 @@ export default {
};
},
methods: {
handleSelectionChange() { },
handleSelectionChange() {},
cellStyle({ row, column }) {
if (column.property === "status") {
if (row.status === "离线") {
@ -168,20 +184,20 @@ export default {
if (this.FormData.length < 4) {
this.FormData.push(this.ruleForm);
this.$message({
message: '添加成功',
type: 'success'
message: "添加成功",
type: "success",
});
console.log(this.FormData);
} else {
this.$message({
message: '抱歉，只能添加四条数据',
type: 'error'
message: "抱歉，只能添加四条数据",
type: "error",
});
return false;
}
},
},
}
};
</script>
<style scoped lang="less">
.title {

100
src/components/GatewayMaintenance.vue
View File

@ -1,7 +1,11 @@
<template>
<div>
<!-- <el-button @click="dialogVisible = true">网关维护</el-button> -->
<el-dialog title="网关维护" :visible.sync="dialogVisible" :append-to-body="true">
<el-dialog
title="网关维护"
:visible.sync="dialogVisible"
:append-to-body="true"
>
<div class="title">
<div class="left">
<el-button @click="flag = true">新增参数</el-button>
@ -12,43 +16,55 @@
<el-button>筛选</el-button>
</div>
</div>
<el-table ref="multipleTable" :data="tableData" border style="margin-top: 10px" tooltip-effect="dark"
@selection-change="handleSelectionChange" :cell-style="cellStyle">
<el-table
ref="multipleTable"
:data="tableData"
border
style="margin-top: 10px"
tooltip-effect="dark"
@selection-change="handleSelectionChange"
:cell-style="cellStyle"
>
<el-table-column label="序号">
<template slot-scope="scope">
{{ scope.$index + 1 }}
</template></el-table-column>
</template></el-table-column
>
<el-table-column type="selection" width="55"> </el-table-column>
<el-table-column prop="wgsn" label="网关SN" > </el-table-column>
<el-table-column prop="wgsn" label="网关SN"> </el-table-column>
<el-table-column prop="wgbh" label="网关编号"> </el-table-column>
<el-table-column prop="wgmc" label="网关名称"> </el-table-column>
<el-table-column prop="cskey" label="参数Key"> </el-table-column>
<el-table-column prop="csmc" label="参数名称"> </el-table-column>
<el-table-column prop="xsws" label="小数位数"> </el-table-column>
<el-table-column prop="sdz" label="设定值"> </el-table-column>
<el-table-column prop="pcz" label="偏差值">
</el-table-column>
<el-table-column prop="pcz" label="偏差值"> </el-table-column>
<el-table-column prop="whr" label="维护人"> </el-table-column>
<el-table-column prop="whsj" label="维护时间"> </el-table-column>
<el-table-column prop="sfyxbz" label="是否运行标识">
</el-table-column>
<el-table-column prop="sfbjbz" label="是否报警标识">
</el-table-column>
<el-table-column label="修改">
<template slot-scope="scope">
<el-button type="text" size="small">删除</el-button>
</template></el-table-column>
</template></el-table-column
>
<el-table-column label="详细">
<template slot-scope="scope">
<el-button type="text" size="small">查看</el-button>
</template></el-table-column>
</template></el-table-column
>
</el-table>
</el-dialog>
<el-dialog title="新增参数" :visible.sync="flag" width="30%">
<el-col :span="12">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="150px" class="demo-ruleForm"
:label-position="labelPosition">
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="150px"
class="demo-ruleForm"
:label-position="labelPosition"
>
<el-form-item label="所属网关:" prop="sswg" class="red">
<el-select v-model="ruleForm.sswg">
<el-option label="lan-box1" value="lan-box1"></el-option>
@ -87,14 +103,32 @@
</el-form>
</el-col>
<el-col :span="12">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="150px" class="demo-ruleForm"
:label-position="labelPosition">
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="150px"
class="demo-ruleForm"
:label-position="labelPosition"
>
<el-form-item label="参数key:" prop="cskey" class="red">
<el-select v-model="ruleForm.cskey">
<el-option label="MachinePamHID910" value="MachinePamHID910"></el-option>
<el-option label="MachinePamHID917" value="MachinePamHID917"></el-option>
<el-option label="MachinePamHID909" value="MachinePamHID909"></el-option>
<el-option label="MachinePamHID928" value="MachinePamHID928"></el-option>
<el-option
label="MachinePamHID910"
value="MachinePamHID910"
></el-option>
<el-option
label="MachinePamHID917"
value="MachinePamHID917"
></el-option>
<el-option
label="MachinePamHID909"
value="MachinePamHID909"
></el-option>
<el-option
label="MachinePamHID928"
value="MachinePamHID928"
></el-option>
<!-- <el-option
label="MachinePamHID923"
value="MachinePamHID923"
@ -170,23 +204,23 @@ export default {
sfyxbz: [
{ required: true, trigger: "change", message: "请选择一个选项" },
],
sdz: [
{ required: true, trigger: "blur", message: "设定值是必填参数" },
sdz: [{ required: true, trigger: "blur", message: "设定值是必填参数" }],
cskey: [
{ required: true, trigger: "change", message: "请选择一个选项" },
],
cskey: [{ required: true, trigger: "change", message: "请选择一个选项" }],
xsws: [
{ required: true, trigger: "blur", message: "小数位数是必填参数" },
],
sfbjbz: [{ required: true, trigger: "change", message: "请选择一个选项" }],
pcz: [
{ required: true, trigger: "blur", message: "偏差值是必填参数" },
sfbjbz: [
{ required: true, trigger: "change", message: "请选择一个选项" },
],
pcz: [{ required: true, trigger: "blur", message: "偏差值是必填参数" }],
},
};
},
created() { },
created() {},
methods: {
handleSelectionChange() { },
handleSelectionChange() {},
cellStyle({ row, column }) {
if (column.property === "open") {
if (row.open === "是") {
@ -208,14 +242,14 @@ export default {
if (this.FormData.length < 4) {
this.FormData.push(this.ruleForm);
this.$message({
message: '添加成功',
type: 'success'
message: "添加成功",
type: "success",
});
console.log(this.FormData);
} else {
this.$message({
message: '抱歉，只能添加四条数据',
type: 'error'
message: "抱歉，只能添加四条数据",
type: "error",
});
return false;
}

438
src/components/TreeView.vue
View File

@ -4,16 +4,24 @@
<!-- v-click-outside="closeMenu" -->
<div>
<div class="tree_menu" v-show="dialogVisible">
<el-tree :data="datas" :props="defaultProps" @node-contextmenu="rightClick" @node-click="treeNodeClick"></el-tree>
<el-tree
:data="datas"
:props="defaultProps"
@node-contextmenu="rightClick"
@node-click="treeNodeClick"
:default-expand-all="true"
></el-tree>
<!-- 树形控件右键组件 -->
<div v-show="menuShow" class="tree_rightmenu" :style="{ ...rightMenu }">
<el-menu class="el-menu-vertical-demo" @select="selectMenuNode" default-active="#0078FE">
<el-menu-item id="menuitem" index="1" style="font-size: 12px;">
<el-menu
class="el-menu-vertical-demo"
@select="selectMenuNode"
default-active="#0078FE"
>
<el-menu-item id="menuitem" index="1" style="font-size: 12px">
<span slot="title">新建通道</span>
</el-menu-item>
<el-menu-item index="2" style="font-size: 12px;">
<el-menu-item index="2" style="font-size: 12px">
<span slot="title">取 消</span>
</el-menu-item>
</el-menu>
@ -22,12 +30,30 @@
</div>
<div class="pas_params">
<el-dialog title="通道参数设置" :visible.sync="add_passage" width="765px">
<el-form :model="FormData" :label-position="labelPosition" :rules="rules" ref="ruleForm">
<el-form
:model="FormData"
:label-position="labelPosition"
:rules="rules"
ref="ruleForm"
>
<el-row>
<el-col :span="12">
<el-form-item label="通道名称:" :label-width="formLabelWidth" prop="tdpz_tdmc">
<el-select v-model="FormData.tdpz_tdmc" placeholder="" style="width: 200px;height:30px">
<el-option v-for="(item, index) in options1" :key="index" :label="item.label" :value="item.value">
<el-form-item
label="通道名称:"
:label-width="formLabelWidth"
prop="tdpz_tdmc"
>
<el-select
v-model="FormData.tdpz_tdmc"
placeholder=""
style="width: 200px; height: 30px"
>
<el-option
v-for="(item, index) in options1"
:key="index"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
@ -35,22 +61,46 @@
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="通道:" :label-width="formLabelWidth" prop="tdpz_td">
<el-select v-model="FormData.tdpz_td" placeholder="" style="width: 200px;height:30px">
<el-option v-for="(item, index) in options2" :key="index" :label="item.label" :value="item.value">
<el-form-item
label="通道:"
:label-width="formLabelWidth"
prop="tdpz_td"
>
<el-select
v-model="FormData.tdpz_td"
placeholder=""
style="width: 200px; height: 30px"
>
<el-option
v-for="(item, index) in options2"
:key="index"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="驱动名称:" :label-width="formLabelWidth" prop="tdpz_qdmc">
<el-form-item
label="驱动名称:"
:label-width="formLabelWidth"
prop="tdpz_qdmc"
>
<el-row>
<el-col :span="18">
<el-input v-model="FormData.tdpz_qdmc" placeholder="" style="width: 200px;height:30px"></el-input>
<el-input
v-model="FormData.tdpz_qdmc"
placeholder=""
style="width: 200px; height: 30px"
></el-input>
</el-col>
<el-col :span="6">
<el-button style="width: 50px; height: 30px;" @click="getDriveName">...</el-button>
<el-button
style="width: 50px; height: 30px"
@click="getDriveName"
>...</el-button
>
</el-col>
</el-row>
</el-form-item>
@ -58,23 +108,38 @@
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="IP地址:" :label-width="formLabelWidth" prop="tdpz_ip">
<el-form-item
label="IP地址:"
:label-width="formLabelWidth"
prop="tdpz_ip"
>
<el-row>
<el-col :span="5">
<el-input v-model="tdpz_ip1" style="width: 43px;height:30px"></el-input>
</el-col>
<el-col :span="1">.
<el-input
v-model="tdpz_ip1"
style="width: 43px; height: 30px"
></el-input>
</el-col>
<el-col :span="1">. </el-col>
<el-col :span="5">
<el-input v-model="tdpz_ip2" style="width: 43px;height:30px"></el-input>
<el-input
v-model="tdpz_ip2"
style="width: 43px; height: 30px"
></el-input>
</el-col>
<el-col :span="1">.</el-col>
<el-col :span="5">
<el-input v-model="tdpz_ip3" style="width: 43px;height:30px"></el-input>
<el-input
v-model="tdpz_ip3"
style="width: 43px; height: 30px"
></el-input>
</el-col>
<el-col :span="1">.</el-col>
<el-col :span="5">
<el-input v-model="tdpz_ip4" style="width: 43px;height:30px"></el-input>
<el-input
v-model="tdpz_ip4"
style="width: 43px; height: 30px"
></el-input>
</el-col>
</el-row>
</el-form-item>
@ -82,32 +147,72 @@
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="端口号:" :label-width="formLabelWidth" prop="tdpz_port">
<el-input v-model="FormData.tdpz_port" placeholder="" style="width: 200px;height:30px"></el-input>
<el-form-item
label="端口号:"
:label-width="formLabelWidth"
prop="tdpz_port"
>
<el-input
v-model="FormData.tdpz_port"
placeholder=""
style="width: 200px; height: 30px"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="超过时间(ms):" :label-width="formLabelWidth" prop="tdpz_cssj">
<el-input v-model="FormData.tdpz_cssj" placeholder="" style="width: 200px;height:30px"></el-input>
<el-form-item
label="超过时间(ms):"
:label-width="formLabelWidth"
prop="tdpz_cssj"
>
<el-input
v-model="FormData.tdpz_cssj"
placeholder=""
style="width: 200px; height: 30px"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="间隔时间(ms):" :label-width="formLabelWidth" prop="tdpz_jgsj">
<el-input v-model="FormData.tdpz_jgsj" placeholder="" style="width: 200px;height:30px"></el-input>
<el-form-item
label="间隔时间(ms):"
:label-width="formLabelWidth"
prop="tdpz_jgsj"
>
<el-input
v-model="FormData.tdpz_jgsj"
placeholder=""
style="width: 200px; height: 30px"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="轮询时间(ms):" :label-width="formLabelWidth" prop="tdpz_lxsj">
<el-input v-model="FormData.tdpz_lxsj" placeholder="" style="width: 200px;height:30px"></el-input>
<el-form-item
label="轮询时间(ms):"
:label-width="formLabelWidth"
prop="tdpz_lxsj"
>
<el-input
v-model="FormData.tdpz_lxsj"
placeholder=""
style="width: 200px; height: 30px"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="重复次数:" :label-width="formLabelWidth" prop="tdpz_cfcs">
<el-input v-model="FormData.tdpz_cfcs" placeholder="" style="width: 200px;height:30px"></el-input>
<el-form-item
label="重复次数:"
:label-width="formLabelWidth"
prop="tdpz_cfcs"
>
<el-input
v-model="FormData.tdpz_cfcs"
placeholder=""
style="width: 200px; height: 30px"
></el-input>
</el-form-item>
</el-col>
</el-row>
@ -117,24 +222,47 @@
<div>
<i class="el-icon-caret-bottom" v-if="is_retract"></i>
<i class="el-icon-caret-top" v-else="is_retract"></i>
<el-button type="text" plain @click="getRetract" style="width: 28px;
border:none;color: rgba(16, 16, 16, 1);font-size: 14px;text-align: left;">
收起</el-button>
<el-button
type="text"
plain
@click="getRetract"
style="
width: 28px;
border: none;
color: rgba(16, 16, 16, 1);
font-size: 14px;
text-align: left;
"
>
收起</el-button
>
</div>
</div>
<div class="super_con" v-show="is_retract">
<el-form :label-position="labelPosition" :rules="rules" ref="ruleForm">
<el-form
:label-position="labelPosition"
:rules="rules"
ref="ruleForm"
>
<el-row>
<el-col :span="12">
<el-form-item>
<el-checkbox v-model="FormData.tdpz_watchtime">watch time(s)</el-checkbox>
<el-input v-model="input1" placeholder="" style="width: 200px;height:30px"
:disabled="isdisabled"></el-input>
<el-checkbox v-model="FormData.tdpz_watchtime"
>watch time(s)</el-checkbox
>
<el-input
v-model="input1"
placeholder=""
style="width: 200px; height: 30px"
:disabled="isdisabled"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item>
<el-checkbox v-model="FormData.tdpz_cjsylxdz">采集使用连续地址</el-checkbox>
<el-checkbox v-model="FormData.tdpz_cjsylxdz"
>采集使用连续地址</el-checkbox
>
</el-form-item>
</el-col>
</el-row>
@ -143,12 +271,17 @@
<el-form-item label="读写占空比:" :label-width="formLabelWidth">
<el-row>
<el-col :span="10">
<el-input v-model="FormData.tdpz_dxzkb1" style="width: 91px;height:30px"></el-input>
</el-col>
<el-col :span="4">:
<el-input
v-model="FormData.tdpz_dxzkb1"
style="width: 91px; height: 30px"
></el-input>
</el-col>
<el-col :span="4">: </el-col>
<el-col :span="10">
<el-input v-model="FormData.tdpz_dxzkb2" style="width: 91px;height:30px"></el-input>
<el-input
v-model="FormData.tdpz_dxzkb2"
style="width: 91px; height: 30px"
></el-input>
</el-col>
</el-row>
</el-form-item>
@ -158,18 +291,42 @@
<el-col :span="12">
<el-form-item label="05/0F:" :label-width="formLabelWidth">
<el-row>
<el-col :span="8"><el-radio v-model="FormData.tdpz_050F" label="auto">auto</el-radio></el-col>
<el-col :span="8"><el-radio v-model="FormData.tdpz_050F" label="05">05</el-radio></el-col>
<el-col :span="8"><el-radio v-model="FormData.tdpz_050F" label="0F">0F</el-radio></el-col>
<el-col :span="8"
><el-radio v-model="FormData.tdpz_050F" label="auto"
>auto</el-radio
></el-col
>
<el-col :span="8"
><el-radio v-model="FormData.tdpz_050F" label="05"
>05</el-radio
></el-col
>
<el-col :span="8"
><el-radio v-model="FormData.tdpz_050F" label="0F"
>0F</el-radio
></el-col
>
</el-row>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="06/10:" :label-width="formLabelWidth">
<el-row>
<el-col :span="8"><el-radio v-model="FormData.tdpz_0610" label="auto">auto</el-radio></el-col>
<el-col :span="8"><el-radio v-model="FormData.tdpz_0610" label="06">06</el-radio></el-col>
<el-col :span="8"><el-radio v-model="FormData.tdpz_0610" label="10">10</el-radio></el-col>
<el-col :span="8"
><el-radio v-model="FormData.tdpz_0610" label="auto"
>auto</el-radio
></el-col
>
<el-col :span="8"
><el-radio v-model="FormData.tdpz_0610" label="06"
>06</el-radio
></el-col
>
<el-col :span="8"
><el-radio v-model="FormData.tdpz_0610" label="10"
>10</el-radio
></el-col
>
</el-row>
</el-form-item>
</el-col>
@ -179,7 +336,6 @@
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="saveGate">保 存</el-button>
<el-button @click="add_passage = false">取 消</el-button>
</span>
</el-dialog>
</div>
@ -189,13 +345,17 @@
<i class="el-icon-close title_r" @click="diag_drive = false"></i>
</div>
<el-divider></el-divider>
<el-tree :data="datas2" :props="defaultProps" default-expand-all></el-tree>
<el-tree
:data="datas2"
:props="defaultProps"
default-expand-all
></el-tree>
</div>
</div>
</template>
<script>
import { SaveUserAnswer, GetUserAnswer } from '@/api/user';
import { SaveUserAnswer, GetUserAnswer } from "@/api/user";
export default {
name: "TestTreeView",
@ -218,21 +378,27 @@ export default {
tdpz_ip2: "",
tdpz_ip3: "",
tdpz_ip4: "",
options1: [{
options1: [
{
value: "有线区Channel1",
label: "有线区Channel1",
}, {
},
{
value: "无线区Channel1",
label: "无线区Channel1",
}],
options2: [{
},
],
options2: [
{
value: "网口",
label: "网口",
}, {
},
{
value: "串口",
label: "串口",
}],
value1: '有线区Channel1',
},
],
value1: "有线区Channel1",
value2: "网口",
diag_drive: false,
isdisabled: true,
@ -245,129 +411,136 @@ export default {
rightMenu: "",
dialogVisible: true,
menuShow: false,
datas: [{
label: 'Gateway',
children: [{
label: '数据采集',
children: [{
label: 'I/O点'
datas: [
{
label: "Gateway",
children: [
{
label: "数据采集",
children: [
{
label: "I/O点",
},
{
label: '用户点',
label: "用户点",
},
{
label: '计算点',
label: "计算点",
},
{
label: '系统点',
label: "系统点",
},
]
],
},
{
label: "数据服务",
children: [{
label: "Modbus"
}]
children: [
{
label: "Modbus",
},
],
},
{
label: "IOT",
children: [
{
label: "Mqtt Client"
label: "Mqtt Client",
},
{
label: "Alink"
label: "Alink",
},
{
label: "Tlink"
label: "Tlink",
},
{
label: "loTDDC"
label: "loTDDC",
},
{
label: "Ulink"
label: "Ulink",
},
]
}
]
}],
datas2: [{
label: '通用标准',
],
},
],
},
],
datas2: [
{
label: "通用标准",
children: [
{
label: 'ModbusTCPClient',
label: "ModbusTCPClient",
},
{
label: 'ModbusRTU_over_TCP',
label: "ModbusRTU_over_TCP",
},
{
label: 'OPCUAClient',
label: "OPCUAClient",
},
{
label: 'OPCDAClient',
label: "OPCDAClient",
},
{
label: 'MQTTClient',
label: "MQTTClient",
},
{
label: "OPCXMLDAClient",
},
{
label: "环保212协议网口监听",
}
]
},
],
},
{
label: "PLC",
children: [
{
label: "Slemens S7-200 Network"
label: "Slemens S7-200 Network",
},
{
label: "Slemens S7-300 Network"
label: "Slemens S7-300 Network",
},
{
label: "Slemens S7-400 Network"
label: "Slemens S7-400 Network",
},
{
label: "Slemens S7-1200 Network"
label: "Slemens S7-1200 Network",
},
{
label: "Slemens S7-1500 Network"
label: "Slemens S7-1500 Network",
},
{
label: "EtherNet/IP CIP协议(AB OMR ON)"
label: "EtherNet/IP CIP协议(AB OMR ON)",
},
{
label: "MC_Qna-3E(三菱 基恩士 松下)"
label: "MC_Qna-3E(三菱 基恩士 松下)",
},
{
label: "MC_A-1E_Binary"
label: "MC_A-1E_Binary",
},
{
label: "OMRON-FINS"
label: "OMRON-FINS",
},
{
label: "横河PLC"
label: "横河PLC",
},
{
label: "西门子FetchWirte"
label: "西门子FetchWirte",
},
{
label: "富机 FUJI_SPH_NET"
label: "富机 FUJI_SPH_NET",
},
{
label: "基恩士上位链路通讯"
label: "基恩士上位链路通讯",
},
]
],
},
{
label: "智能建筑",
children: []
children: [],
},
{
label: "厂家定制",
children: []
children: [],
},
{
label: "电力行业标准",
@ -376,34 +549,32 @@ export default {
label: "IEC104",
},
{
label: "DLT645_over_TCP"
}
]
label: "DLT645_over_TCP",
},
],
},
{
label: "CNC数控",
children: []
}, {
children: [],
},
{
label: "私有协议",
children: []
}],
children: [],
},
],
defaultProps: {
children: 'children',
label: 'label'
children: "children",
label: "label",
},
rules: {
tdpz_tdmc: [
{ required: true, message: "请输入通道名称", trigger: "change" },
],
tdpz_td: [
{ required: true, message: "请输入通道", trigger: "change" }
],
tdpz_td: [{ required: true, message: "请输入通道", trigger: "change" }],
tdpz_qdmc: [
{ required: true, message: "请输入驱动名称", trigger: "change" },
],
tdpz_ip: [
{ required: true, message: "请输入ip地址", trigger: "blur" },
],
tdpz_ip: [{ required: true, message: "请输入ip地址", trigger: "blur" }],
tdpz_port: [
{ required: true, message: "请输入端口号", trigger: "blur" },
],
@ -419,7 +590,7 @@ export default {
tdpz_cfcs: [
{ required: true, message: "请输入重复次数", trigger: "blur" },
],
}
},
};
},
methods: {
@ -469,7 +640,13 @@ export default {
this.add_passage = false;
this.FormData.tdpz_watchtime = Number(this.FormData.tdpz_watchtime);
this.FormData.tdpz_cjsylxdz = Number(this.FormData.tdpz_cjsylxdz);
this.FormData.tdpz_ip = this.Merge(this.FormData.tdpz_ip, this.tdpz_ip1, this.tdpz_ip2, this.tdpz_ip3, this.tdpz_ip4)
this.FormData.tdpz_ip = this.Merge(
this.FormData.tdpz_ip,
this.tdpz_ip1,
this.tdpz_ip2,
this.tdpz_ip3,
this.tdpz_ip4
);
let datas = sessionStorage.getItem("answer");
this.FormData = { ...this.FormData, ...JSON.parse(datas) };
let res = await SaveUserAnswer({
@ -477,14 +654,14 @@ export default {
user_id: "USER202307301109254198",
mark_value: JSON.stringify(this.FormData),
});
sessionStorage.setItem('answer', JSON.stringify(this.FormData));
sessionStorage.setItem("answer", JSON.stringify(this.FormData));
console.log(res);
console.log(res.data.data.mark_value);
this.$router.push("/dbcollectdevice");
}
},
async created(){
let res2=GetUserAnswer()
},
async created() {
let res2 = GetUserAnswer();
},
watch: {
tdpz_watchtime: {
@ -524,7 +701,6 @@ export default {
.tree_menu {
position: absolute;
width: 286px;
height: 753px;
left: 64px;
top: 104px;
width: 286px;

2
src/router/index.js
View File

@ -107,7 +107,7 @@ const routes = [
{
path: "/chiwifigate",
name: "chiwifigate",
component:()=>import("../views/ChWifigate.vue")
component: () => import("../views/ChWifigate.vue"),
},
//斥候工业网关-数据采集配置-有线网关配置