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

zyh 11-2 second

This commit is contained in:
unknown 2023-11-02 14:42:14 +08:00
parent 31bb096272 bc01ac6b00
commit 5de551a8e3
11 changed files with 1085 additions and 696 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

180
.history/src/router/index_20231102144141.js Normal file
View File

@ -0,0 +1,180 @@
import Vue from "vue";
import VueRouter from "vue-router";
Vue.use(VueRouter);
const routes = [
{
path: "/",
component: () => import("../views/Index.vue"),
},
{
path: "/cockpit",
name: "cockpit",
component: () => import("../views/Cockpit.vue"),
},
{
path: "/datacollect",
name: "datacollect",
component: () => import("../views/DataCollect.vue"),
},
// 刘龙龙新加的全部路由
//db网关-ip配置-无线网关
{
path: "/wirelessgatewayip",
name: "wirelessgatewayip",
component: () => import("../views/WirelessGatewayIP.vue"),
},
//db网关-ip配置-有线网关
{
path: "/wiredgatewayip",
name: "wiredgatewayip",
component: () => import("../views/WiredGatewayIP.vue"),
},
//db网关-数据采集配置-网关配置
{
path: "/dbcollectiongate",
name: "dbcollectiongate",
component: () => import("../views/DbCollectiongate.vue"),
},
// db网关-数据采集配置-网口配置
{
path: "/channelconfig",
name: "channelconfig",
component: () => import("../views/ChannelConfig.vue"),
},
// db网关-数据采集配置-串口配置
{
path: "/dbcollectserial",
name: "dbcollectserial",
component: () => import("../views/DbCollectserial.vue"),
},
// db网关-数据采集配置-设备配置
{
path: "/dbcollectdevice",
name: "dbcollectdevice",
component: () => import("../views/DbCollectdevice.vue"),
},
// db网关-数据采集配置-采集点配置
{
path: "/dbcollect",
name: "dbcollect",
component: () => import("../views/DbCollection.vue"),
},
//db网关-MQTT上云-MQTT1配置
{
path: "/mqttconfig",
name: "mqttconfig",
component: () => import("../views/MqttConfig.vue"),
},
//斥候工业网关-ip配置-无线网关
{
path: "/chwirelessgatewayip",
name: "chwirelessgatewayip",
component: () => import("../views/ChWirelessGatewayIP.vue"),
},
//斥候工业网关-ip配置-有线网关
{
path: "/chwiredgatewayip",
name: "chwiredgatewayip",
component: () => import("../views/ChWiredGatewayIP.vue"),
},
//斥候工业网关-数据采集配置-网关配置
{
path: "/gatewayconfiguration",
name: "gatewayconfiguration",
component: () => import("../views/GatewayConfiguration.vue"),
},
//斥候工业网关-数据采集配置-设备配置
{
path: "/configuration",
name: "configuration",
component: () => import("../views/Configuration.vue"),
},
//斥候工业网关-数据采集配置-采集点配置
{
path: "/collectionpoint",
name: "collectionpoint",
component: () => import("../views/CollectionPoint.vue"),
},
//斥候工业网关-数据上云配置-MQTT上云
{
path: "/chmqtt",
name: "chmqtt",
component: () => import("../views/ChMqtt.vue"),
},
//串口服务器-Ip配置
{
path: "/ckipconfig",
name: "ckipconfig",
component: () => import("../views/CkIpConfig.vue"),
},
//串口服务器-端口配置
{
path: "/ckportconfig",
name: "ckportconfig",
component: () => import("../views/CkPortConfig.vue"),
},
//串口服务器-485towifi-串口及网络协议设置
{
path: "/towifi",
name: "towifi",
component: () => import("../views/ToWifi.vue"),
},
//串口服务器-485towifi-网口配置
{
path: "/cknet",
name: "cknet",
component: () => import("../views/CkNet.vue"),
},
//串口服务器-485towifi-无线配置
{
path: "/ckwireless",
name: "ckwireless",
component: () => import("../views/CkWireless.vue"),
},
//工业网闸配置-网络管理
{
path: "/networkmanagement",
name: "networkmanagement",
component: () => import("../views/NetworkManagement.vue"),
},
//工业网闸配置-对象管理
{
path: "/objmanagement",
name: "objmanagement",
component: () => import("../views/ObjManagement.vue"),
},
//工业网闸配置-策略管理
{
path: "/strategyManagement",
name: "strategyManagement",
component: () => import("../views/StrategyManagement.vue"),
},
//工业网闸配置-策略管理-添加策略
{
path: "/addstrategy",
name: "addstrategy",
component: () => import("../views/AddStrategy.vue"),
},
//网络优化-网关配置
{
path: "/ntconfig",
name: "ntconfig",
component: () => import("../views/NtConfig.vue"),
},
//网络优化-网关维护
{
path: "/ntmaintenance",
name: "ntmaintenance",
component: () => import("../views/NtMaintenance.vue"),
},
];
const router = new VueRouter({
mode: "history",
base: process.env.BASE_URL,
routes,
});
export default router;

33
.history/src/views/ChMqtt_20231102144203.vue Normal file
View File

@ -0,0 +1,33 @@
<!-- <template>
<div>斥候工业网关-数据上云配置-MQTT上云</div>
</template> -->
<template>
<div>
<ChiClone></ChiClone>
</div>
</template>
<script>
import ChiClone from "@/components/ChiClone.vue";
export default {
name: 'InternetCompetitionChMqtt',
components: {
ChiClone
},
data() {
return {
};
},
mounted() {
},
methods: {
},
};
</script>
<style lang="less" scoped></style>

1
src/App.vue
View File

@ -10,6 +10,7 @@ export default {
data() {
return {};
},
created() {},
methods: {},
components: {},
};

874
src/components/ChiClone.vue
View File

@ -1,122 +1,185 @@
<!-- 斥候MQTT云 -->
<template>
<div class="Clone">
<!-- 设置树形控件 -->
<div v-click-outside="closeMenu">
<!-- <el-button type="info" plain @click="dialogVisible = true">斥侯MQTT云</el-button> -->
<div v-show="dialogVisible" class="tree_menu">
<el-tree :data="datas" :props="defaultProps" @node-click="treeNodeClick"></el-tree>
<!-- 树形控件右键组件 -->
</div>
</div>
<div class="pas_params" v-show="add_passage">
<div class="content">
<div class="con_left">
<el-form :label-position="labelPosition" :rules="rules" ref="ruleForm">
<el-row>
<el-col :span="24">
<el-form-item>
<el-checkbox v-model="mqtt_qiyong">启用</el-checkbox>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="服务器IP:" :label-width="formLabelWidth" prop="mqtt_ip">
<el-row>
<el-col :span="5">
<el-input v-model="mqtt_ip1" style="width: 43px; height: 30px;"></el-input>
</el-col>
<el-col :span="1">.
</el-col>
<el-col :span="5">
<el-input v-model="mqtt_ip2" style="width: 43px; height: 30px;"></el-input>
</el-col>
<el-col :span="1">.</el-col>
<el-col :span="5">
<el-input v-model="mqtt_ip3" style="width: 43px; height: 30px;"></el-input>
</el-col>
<el-col :span="1">.</el-col>
<el-col :span="5">
<el-input v-model="mqtt_ip4" style="width: 43px; height: 30px;"></el-input>
</el-col>
</el-row>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="网关SN:" :label-width="formLabelWidth" prop="mqtt_wgsn">
<el-input v-model="mqtt_wgsn" placeholder=""
style="width: 200px;height:30px"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="端口:" :label-width="formLabelWidth" prop="mqtt_port">
<el-input v-model="mqtt_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="Keep Alive(s):" :label-width="formLabelWidth" prop="mqtt_keepalive">
<el-input v-model="mqtt_keepalive" placeholder="64"
style="width: 200px;height:30px"></el-input>
<div class="infos">2-60000</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="TLS加密:" :label-width="formLabelWidth" prop="mqtt_tls">
<el-switch v-model="mqtt_tls"></el-switch>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="清除Session:" :label-width="formLabelWidth" prop="mqtt_clearsession">
<el-switch v-model="mqtt_clearsession"></el-switch>
</el-form-item>
</el-col>
</el-row>
<h3 class="info_play">信息发布</h3>
<el-divider></el-divider>
<div class="Clone">
<!-- 设置树形控件 -->
<div v-click-outside="closeMenu">
<!-- <el-button type="info" plain @click="dialogVisible = true">斥侯MQTT云</el-button> -->
<div v-show="dialogVisible" class="tree_menu">
<el-tree
:data="datas"
:props="defaultProps"
@node-click="treeNodeClick"
></el-tree>
<!-- 树形控件右键组件 -->
</div>
</div>
<div class="pas_params" v-show="add_passage">
<div class="content">
<div class="con_left">
<el-form
:label-position="labelPosition"
:rules="rules"
ref="ruleForm"
>
<el-row>
<el-col :span="24">
<el-form-item>
<el-checkbox v-model="mqtt_qiyong">启用</el-checkbox>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item
label="服务器IP:"
:label-width="formLabelWidth"
prop="mqtt_ip"
>
<el-row>
<el-col :span="5">
<el-input
v-model="mqtt_ip1"
style="width: 43px; height: 30px"
></el-input>
</el-col>
<el-col :span="1">. </el-col>
<el-col :span="5">
<el-input
v-model="mqtt_ip2"
style="width: 43px; height: 30px"
></el-input>
</el-col>
<el-col :span="1">.</el-col>
<el-col :span="5">
<el-input
v-model="mqtt_ip3"
style="width: 43px; height: 30px"
></el-input>
</el-col>
<el-col :span="1">.</el-col>
<el-col :span="5">
<el-input
v-model="mqtt_ip4"
style="width: 43px; height: 30px"
></el-input>
</el-col>
</el-row>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item
label="网关SN:"
:label-width="formLabelWidth"
prop="mqtt_wgsn"
>
<el-input
v-model="mqtt_wgsn"
placeholder=""
style="width: 200px; height: 30px"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item
label="端口:"
:label-width="formLabelWidth"
prop="mqtt_port"
>
<el-input
v-model="mqtt_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="Keep Alive(s):"
:label-width="formLabelWidth"
prop="mqtt_keepalive"
>
<el-input
v-model="mqtt_keepalive"
placeholder="64"
style="width: 200px; height: 30px"
></el-input>
<div class="infos">2-60000</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item
label="TLS加密:"
:label-width="formLabelWidth"
prop="mqtt_tls"
>
<el-switch v-model="mqtt_tls"></el-switch>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item
label="清除Session:"
:label-width="formLabelWidth"
prop="mqtt_clearsession"
>
<el-switch v-model="mqtt_clearsession"></el-switch>
</el-form-item>
</el-col>
</el-row>
<h3 class="info_play">信息发布</h3>
<el-divider></el-divider>
<el-row>
<el-col :span="12">
<el-form-item>
<el-row>
<el-col :span="12">
<el-form-item label="Qos(MQTT):" :label-width="formLabelWidth"
prop="upload_week">
<el-select v-model="mqtt_qos" placeholder="请选择" 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-col>
</el-row>
</el-form-item>
</el-col>
<!-- <el-col :span="12">
<el-row>
<el-col :span="12">
<el-form-item>
<el-row>
<el-col :span="12">
<el-form-item
label="Qos(MQTT):"
:label-width="formLabelWidth"
prop="upload_week"
>
<el-select
v-model="mqtt_qos"
placeholder="请选择"
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-col>
</el-row>
</el-form-item>
</el-col>
<!-- <el-col :span="12">
<el-form-item label="retained:" :label-width="formLabelWidth" prop="retained">
<el-switch v-model="value1"></el-switch>
</el-form-item>
</el-col> -->
</el-row>
<!-- <el-row>
</el-row>
<!-- <el-row>
<el-col :span="12">
<el-form-item label="入口函数:" :label-width="formLabelWidth" prop="upload_week">
<el-input v-model="input1" placeholder="64" style="width: 200px;height:30px"></el-input>
</el-form-item>
</el-col>
</el-row> -->
<!-- <el-row>
<!-- <el-row>
<el-col :span="12">
<el-form-item label="函数代码:" :label-width="formLabelWidth" prop="upload_week">
<prism-editor class="my-editor height-300" v-model="code" :highlight="highlighter"
@ -124,33 +187,16 @@
</el-form-item>
</el-col>
</el-row> -->
<div class="con_left_footer">
<el-button type="primary" @click="add_passage = false">保 存</el-button>
<el-button @click="add_passage = false">取 消</el-button>
</div>
</el-form>
</div>
<div>
<div class="con_right">
<el-menu class="el-menu-demo" mode="horizontal" @select="handleSelect">
<el-menu-item index="1">添加</el-menu-item>
<el-menu-item index="2">保存</el-menu-item>
<el-menu-item index="3">删除</el-menu-item>
</el-menu>
</div>
<el-table ref="singleTable" :data="tableData" style="width: 100%">
<el-table-column type="index">
</el-table-column>
<el-table-column property="mqtt_cjd_sbmc" label="设备名称">
</el-table-column>
<el-table-column property="mqtt_cjd_tagid" label="TagID">
</el-table-column>
</el-table>
</div>
<div class="con_left_footer">
<el-button type="primary" @click="add_passage = false"
>保 存</el-button
>
<el-button @click="add_passage = false">取 消</el-button>
</div>
</el-form>
</div>
<!-- 添加按钮下显示出来的弹框信息 -->
<div>
<<<<<<< HEAD
<el-dialog title="选择点" :visible.sync="choose_point" width="30%">
<el-tree :data="points" show-checkbox node-key="id" :default-expanded-keys="[1, 2]"
:default-checked-keys="[3, 4, 5, 6]" :props="defaultProps">
@ -160,8 +206,50 @@
<el-button @click="choose_point = false">取 消</el-button>
</span>
</el-dialog>
=======
<div class="con_right">
<el-menu
class="el-menu-demo"
mode="horizontal"
@select="handleSelect"
>
<el-menu-item index="1">添加</el-menu-item>
<el-menu-item index="2">保存</el-menu-item>
<el-menu-item index="3">删除</el-menu-item>
</el-menu>
</div>
<el-table ref="singleTable" :data="tableData" style="width: 100%">
<el-table-column type="index"> </el-table-column>
<el-table-column property="mqtt_cjd_sbmc" label="设备名称">
</el-table-column>
<el-table-column property="mqtt_cjd_tagid" label="TagID">
</el-table-column>
</el-table>
>>>>>>> bc01ac6b0082d031596737d0f308cae975b5f2cb
</div>
</div>
</div>
<!-- 添加按钮下显示出来的弹框信息 -->
<div>
<el-dialog title="选择点" :visible.sync="choose_point" width="30%">
<el-tree
:data="points"
show-checkbox
node-key="id"
:default-expanded-keys="[1, 2]"
:default-checked-keys="[3, 4, 5, 6]"
:props="defaultProps"
>
</el-tree>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="choose_point = false"
>保 存</el-button
>
<el-button @click="choose_point = false">取 消</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
<script>
@ -174,29 +262,88 @@ import "prismjs/components/prism-javascript";
import "prismjs/themes/prism-tomorrow.css"; // import syntax highlighting styles
export default {
name: 'ChiClone',
components: {
PrismEditor
},
data() {
return {
mqtt_qiyong: true,
mqtt_ip: "",
mqtt_ip1: "",
mqtt_ip2: "",
mqtt_ip3: "",
mqtt_ip4: "",
mqtt_wgsn: "",
mqtt_port: "",
mqtt_keepalive: "",
mqtt_tls: false,
mqtt_clearsession: false,
// mqtt_sssjfbzt:"",
mqtt_qos: "0",
// code: 'console.log("Hello World")',
// lineNumbers: true, // true为编辑模式， false只展示不可编辑
points: [
name: "ChiClone",
components: {
PrismEditor,
},
data() {
return {
mqtt_qiyong: true,
mqtt_ip: "",
mqtt_ip1: "",
mqtt_ip2: "",
mqtt_ip3: "",
mqtt_ip4: "",
mqtt_wgsn: "",
mqtt_port: "",
mqtt_keepalive: "",
mqtt_tls: false,
mqtt_clearsession: false,
// mqtt_sssjfbzt:"",
mqtt_qos: "0",
// code: 'console.log("Hello World")',
// lineNumbers: true, // true为编辑模式， false只展示不可编辑
points: [
{
id: 1,
label: "Device1",
children: [
{
id: 3,
label: "tag0001",
},
{
id: 4,
label: "tag0002",
},
],
},
{
id: 2,
label: "Device1",
children: [
{
id: 5,
label: "tag0003",
},
{
id: 6,
label: "tag0004",
},
],
},
],
choose_point: false,
options1: [
{
value: "0",
label: "0",
},
{
value: "1",
label: "1",
},
{
value: "2",
label: "2",
},
],
labelPosition: "left",
formLabelWidth: "114px",
input1: 192,
add_passage: false,
rightMenu: "",
dialogVisible: true,
menuShow: false,
datas: [
{
label: "Gateway",
children: [
{
label: "数据采集",
children: [
{
<<<<<<< HEAD
id: 1,
label: 'Device1',
children: [
@ -256,63 +403,45 @@ export default {
label: '系统点',
},
]
=======
label: "I/O点",
>>>>>>> bc01ac6b0082d031596737d0f308cae975b5f2cb
},
{
label: "上云服务",
children: [
{
label: "标准 MQTT"
},
{
label: "AWS loT"
}]
}]
}],
defaultProps: {
children: 'children',
label: 'label'
label: "用户点",
},
{
label: "计算点",
},
{
label: "系统点",
},
],
},
tableData: [{
mqtt_cjd_sbmc: 'Device1',
mqtt_cjd_tagid: 'Device1.tag0001',
}],
rules: {
server_ip: [
{ required: true, message: '请输入服务器IP', trigger: 'blur' },
],
port_number: [
{ required: true, message: '请输入端口', trigger: 'blur' },
],
gateway_id: [
{ required: true, message: '请输入网关ID', trigger: 'blur' },
],
data_theme: [
{ required: true, message: '请输入主题', trigger: 'blur' },
],
upload_mode: [
{ required: true, message: '请输入上传模式', trigger: 'blur' },
],
upload_week: [
{ required: true, message: '请输入上传周期', trigger: 'blur' },
],
data_filter: [
{ required: true, message: '请输入数据过滤', trigger: 'blur' },
],
{
label: "上云服务",
children: [
{
label: "标准 MQTT",
},
{
label: "AWS loT",
},
],
},
};
},
mounted() {
},
methods: {
treeNodeClick() {
this.add_passage = true;
],
},
getDriveName() {
this.diag_drive = true;
],
defaultProps: {
children: "children",
label: "label",
},
tableData: [
{
mqtt_cjd_sbmc: "Device1",
mqtt_cjd_tagid: "Device1.tag0001",
},
<<<<<<< HEAD
handleSelect(key) {
console.log(key);
if (key == 1 && this.isAdd == false) {
@ -358,153 +487,228 @@ export default {
document.body.removeEventListener('click', el.event, true)
},
},
=======
],
rules: {
server_ip: [
{ required: true, message: "请输入服务器IP", trigger: "blur" },
],
port_number: [
{ required: true, message: "请输入端口", trigger: "blur" },
],
gateway_id: [
{ required: true, message: "请输入网关ID", trigger: "blur" },
],
data_theme: [
{ required: true, message: "请输入主题", trigger: "blur" },
],
upload_mode: [
{ required: true, message: "请输入上传模式", trigger: "blur" },
],
upload_week: [
{ required: true, message: "请输入上传周期", trigger: "blur" },
],
data_filter: [
{ required: true, message: "请输入数据过滤", trigger: "blur" },
],
},
};
},
mounted() {},
methods: {
treeNodeClick() {
this.add_passage = true;
},
getDriveName() {
this.diag_drive = true;
},
handleSelect(key) {
console.log(key);
if (key == 1) {
this.choose_point = true;
}
},
highlighter(code) {
return highlight(code, languages.js); //returns html
},
closeMenu(ev) {
console.log({ ev });
this.dialogVisible = false;
},
},
directives: {
"click-outside": {
bind: function (el, binding, vnode) {
console.log("el", el);
console.log("binding", binding);
el.event = function (event) {
// 检查点击是否发生在节点之内（包括子节点）
if (!(el == event.target || el.contains(event.target))) {
// 如果没有，则触发调用
// 若绑定值为函数，则执行
// 这里我们可以通过钩子函数中的 vnode.context，来获取当前组件的作用域
if (typeof vnode.context[binding.expression] == "function") {
vnode.context[binding.expression](event);
}
}
};
// 绑定事件
// 设置为true，代表在DOM树中，注册了该listener的元素，会先于它下方的任何事件目标，接收到该事件。
document.body.addEventListener("click", el.event, true);
},
unbind: function (el) {
// 解绑事件
document.body.removeEventListener("click", el.event, true);
},
>>>>>>> bc01ac6b0082d031596737d0f308cae975b5f2cb
},
},
};
</script>
<style lang="less" scoped>
.tree_menu {
position: absolute;
width: 286px;
height: 753px;
left: 64px;
top: 104px;
width: 286px;
height: 753px;
line-height: 20px;
border-radius: 3px;
background-color: rgba(255, 255, 255, 1);
text-align: center;
border: 1px solid rgba(220, 220, 220, 1);
position: absolute;
width: 286px;
height: 753px;
left: 64px;
top: 104px;
width: 286px;
height: 753px;
line-height: 20px;
border-radius: 3px;
background-color: rgba(255, 255, 255, 1);
text-align: center;
border: 1px solid rgba(220, 220, 220, 1);
}
/deep/ .pas_params {
.info_play {
width: 56px;
height: 20px;
color: rgba(16, 16, 16, 1);
.info_play {
width: 56px;
height: 20px;
color: rgba(16, 16, 16, 1);
font-size: 14px;
text-align: left;
}
.el-divider--horizontal {
margin: 8px 0;
}
.el-button {
width: 80px;
height: 30px;
line-height: 0.5;
}
.el-col-12:last-child {
padding-right: 150px;
}
.el-col-12:first-child {
padding-right: 28px;
}
.el-row {
height: 40px;
display: flex;
align-items: flex-start;
.el-col-1 {
text-align: center;
line-height: 52px;
height: 20px;
}
.el-col-9 {
padding-left: 30px;
}
}
.el-input__inner {
height: 30px;
text-align: left;
padding: 0px 8px;
}
.content {
position: absolute;
left: 362px;
top: 104px;
width: 1220px;
height: 836px;
line-height: 20px;
padding-left: 36px;
background-color: rgba(255, 255, 255, 1);
color: rgba(16, 16, 16, 1);
font-size: 14px;
border: 1px solid rgba(187, 187, 187, 1);
display: flex;
justify-content: flex-start;
align-items: flex-start;
.el-form-item {
margin-bottom: 0px;
}
/deep/ .con_left {
.el-con-5 {
width: 43px;
}
}
.con_left {
width: 709px;
position: relative;
.my-editor {
background: #2d2d2d;
color: #ccc;
font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
font-size: 14px;
text-align: left;
}
line-height: 1.5;
padding: 5px;
}
.el-divider--horizontal {
margin: 8px 0;
}
/* optional */
.prism-editor__textarea:focus {
outline: none;
}
.el-button {
width: 80px;
height: 30px;
line-height: 0.5;
}
/* not required: */
.height-300 {
width: 491px;
height: 300px;
}
.el-col-12:last-child {
padding-right: 150px;
}
.el-col-12:first-child {
padding-right: 28px;
}
.el-row {
height: 40px;
display: flex;
align-items: flex-start;
.el-col-1 {
text-align: center;
line-height: 52px;
height: 20px;
}
.el-col-9 {
padding-left: 30px;
}
}
.el-input__inner {
height: 30px;
text-align: left;
padding: 0px 8px;
}
.content {
.infos {
width: 60px;
position: absolute;
left: 362px;
top: 104px;
width: 1220px;
height: 836px;
line-height: 20px;
padding-left: 36px;
background-color: rgba(255, 255, 255, 1);
color: rgba(16, 16, 16, 1);
font-size: 14px;
border: 1px solid rgba(187, 187, 187, 1);
display: flex;
justify-content: flex-start;
align-items: flex-start;
left: 208px;
top: 0;
}
.el-form-item {
margin-bottom: 0px;
}
/deep/ .con_left {
.el-con-5 {
width: 43px;
}
}
.con_left {
width: 709px;
position: relative;
.my-editor {
background: #2d2d2d;
color: #ccc;
font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
font-size: 14px;
line-height: 1.5;
padding: 5px;
}
/* optional */
.prism-editor__textarea:focus {
outline: none;
}
/* not required: */
.height-300 {
width: 491px;
height: 300px;
}
.infos {
width: 60px;
position: absolute;
left: 208px;
top: 0;
}
.con_left_footer {
position: absolute;
left: 499px;
top: 720px;
}
}
.con_right {
width: 480px;
.dialog-footer {
.el-button {
width: 80px;
height: 30px;
line-height: 0.5;
}
}
}
.con_left_footer {
position: absolute;
left: 499px;
top: 720px;
}
}
.con_right {
width: 480px;
.dialog-footer {
.el-button {
width: 80px;
height: 30px;
line-height: 0.5;
}
}
}
}
}
</style>

344
src/components/ChiGate.vue
View File

@ -1,185 +1,209 @@
<!-- 斥候IP设置——无线网关页面 -->
<template>
<div>
<!-- <el-button type="info" plain @click="getShow">斥候IP设置——无线网关</el-button> -->
<div class="gateway" v-show="isShow">
<div class="title">
<p class="title_l">IP配置</p>
<i class="el-icon-close title_r" @click="isShow = false"></i>
</div>
<el-divider></el-divider>
<div class="content">
<el-form :label-position="labelPosition" :rules="rules" ref="ruleForm">
<el-row>
<el-col :span="24">
<el-form-item label="客户端SSID:" :label-width="formLabelWidth" prop="ippz_ssid">
<el-input v-model="ippz_ssid" placeholder="请输入WIFI名字"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="认证方式:" :label-width="formLabelWidth">
<el-select v-model="ippz_rzfs" placeholder="开放式">
<el-option v-for="item in options1" :key="item.value" :label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="加密方式:" :label-width="formLabelWidth">
<el-select v-model="ippz_jmfs" placeholder="NONE">
<el-option v-for="item in options2" :key="item.value" :label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="密码:" :label-width="formLabelWidth" prop="ippz_mm">
<el-input v-model="ippz_mm" placeholder="请输入wifi密码"></el-input>
</el-form-item>
</el-col>
</el-row>
<div class="footer">
<el-button type="primary">保 存</el-button>
<el-button @click="isShow = false">取 消</el-button>
</div>
</el-form>
</div>
</div>
<div>
<!-- <el-button type="info" plain @click="getShow">斥候IP设置——无线网关</el-button> -->
<div class="gateway" v-show="isShow">
<div class="title">
<p class="title_l">IP配置</p>
<i class="el-icon-close title_r" @click="isShow = false"></i>
</div>
<el-divider></el-divider>
<div class="content">
<el-form :label-position="labelPosition" :rules="rules" ref="ruleForm">
<el-row>
<el-col :span="24">
<el-form-item
label="客户端SSID:"
:label-width="formLabelWidth"
prop="ippz_ssid"
>
<el-input
v-model="ippz_ssid"
placeholder="请输入WIFI名字"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="认证方式:" :label-width="formLabelWidth">
<el-select v-model="ippz_rzfs" placeholder="开放式">
<el-option
v-for="item in options1"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="加密方式:" :label-width="formLabelWidth">
<el-select v-model="ippz_jmfs" placeholder="NONE">
<el-option
v-for="item in options2"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item
label="密码:"
:label-width="formLabelWidth"
prop="ippz_mm"
>
<el-input
v-model="ippz_mm"
placeholder="请输入wifi密码"
></el-input>
</el-form-item>
</el-col>
</el-row>
<div class="footer">
<el-button type="primary">保 存</el-button>
<el-button @click="isShow = false">取 消</el-button>
</div>
</el-form>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'ChiGate',
name: "ChiGate",
data() {
return {
ippz_ssid: "",
ippz_rzfs: "开放式", //答案：WPA2-PSK
ippz_jmfs: "NONE", //答案：AES
ippz_mm: "",
options1: [
{
value: "开放式",
label: "开放式",
},
{
value: "共享式",
label: "共享式",
},
{
value: "WPA-PSK",
label: "WPA-PSK",
},
{
value: "WPA",
label: "WPA",
},
{
value: "WPA2-PSK",
label: "WPA2-PSK",
},
{
value: "WPA2",
label: "WPA2",
},
],
options2: [
{
value: "NONE",
label: "NONE",
},
{
value: "WEP40",
label: "WEP40",
},
{
value: "WEP104",
label: "WEP104",
},
{
value: "AES",
label: "AES",
},
],
labelPosition: "left",
formLabelWidth: "116px",
value: "测试",
count: 0,
isShow: true,
rules: {
ippz_ssid: [
{ required: true, message: "请输入客户端SSID", trigger: "blur" },
],
ippz_mm: [{ required: true, message: "请输入密码", trigger: "blur" }],
},
};
},
data() {
return {
ippz_ssid:"",
ippz_rzfs: "开放式", //答案：WPA2-PSK
ippz_jmfs: "NONE",//答案：AES
ippz_mm:"",
options1: [
{
value: '开放式',
label: '开放式'
}, {
value: '共享式',
label: '共享式'
}, {
value: 'WPA-PSK',
label: 'WPA-PSK'
}, {
value: 'WPA',
label: 'WPA'
}, {
value: 'WPA2-PSK',
label: 'WPA2-PSK'
}, {
value: 'WPA2',
label: 'WPA2'
}
],
options2: [
{
value: 'NONE',
label: 'NONE'
}, {
value: 'WEP40',
label: 'WEP40'
}, {
value: 'WEP104',
label: 'WEP104'
}, {
value: 'AES',
label: 'AES'
}
],
labelPosition: "left",
formLabelWidth: "116px",
value: "测试",
count: 0,
isShow: true,
rules: {
ippz_ssid: [
{ required: true, message: '请输入客户端SSID', trigger: 'blur' },
],
ippz_mm: [
{ required: true, message: '请输入密码', trigger: 'blur' },
],
},
};
},
mounted() {},
mounted() {
},
methods: {
},
methods: {},
};
</script>
<style lang="less" scoped>
.gateway {
position: absolute;
left: 648px;
top: 226px;
width: 470px;
height: 384px;
line-height: 20px;
background-color: rgba(255, 255, 255, 1);
text-align: center;
border: 1px solid rgba(187, 187, 187, 1);
position: absolute;
left: 648px;
top: 226px;
width: 470px;
height: 384px;
line-height: 20px;
background-color: rgba(255, 255, 255, 1);
text-align: center;
border: 1px solid rgba(187, 187, 187, 1);
.el-divider--horizontal {
margin: 10px 0;
.el-divider--horizontal {
margin: 10px 0;
}
.title {
margin: 13px 6px 0px 25px;
display: flex;
justify-content: space-between;
.title_l {
width: 53px;
height: 26px;
color: rgba(16, 16, 16, 1);
font-size: 18px;
text-align: left;
}
.title {
margin: 13px 6px 0px 25px;
display: flex;
justify-content: space-between;
.title_l {
width: 53px;
height: 26px;
color: rgba(16, 16, 16, 1);
font-size: 18px;
text-align: left;
}
.title_r {
width: 24px;
height: 24px;
cursor: pointer;
color: rgba(111, 103, 103, 1);
}
.title_r {
width: 24px;
height: 24px;
cursor: pointer;
color: rgba(111, 103, 103, 1);
}
}
/deep/ .content {
margin-left: 62px;
margin-right: 114px;
/deep/ .content {
margin-left: 62px;
margin-right: 114px;
.el-input__inner {
width: 200px;
height: 30px;
}
.el-input__inner {
width: 200px;
height: 30px;
}
}
/deep/ .footer {
.el-button {
width: 80px;
height: 30px;
line-height: 0.5;
}
/deep/ .footer {
.el-button {
width: 80px;
height: 30px;
line-height: 0.5;
}
}
}
</style>

71
src/components/PolicyManagement.vue
View File

@ -2,7 +2,9 @@
<div>
<!-- <el-button @click="dialogVisible = true">策略管理</el-button> -->
<el-dialog title="策略管理" :visible.sync="dialogVisible" width="50%">
<el-button style="margin-bottom: 10px" @click="addPolicy">新增策略</el-button>
<el-button style="margin-bottom: 10px" @click="addPolicy"
>新增策略</el-button
>
<el-table :data="tableData" style="width: 100%" border>
<el-table-column label="序号">
<template slot-scope="scope">
@ -12,8 +14,11 @@
<el-table-column prop="clgl_name" label="名称"> </el-table-column>
<el-table-column prop="clgl_qidong" label="是否启动">
<template slot-scope="scope">
<el-switch v-model="scope.row.clgl_qidong" @change="handleSwitchChange(scope.row)"></el-switch>
</template></el-table-column>
<el-switch
v-model="scope.row.clgl_qidong"
@change="handleSwitchChange(scope.row)"
></el-switch> </template
></el-table-column>
<el-table-column prop="clgl_xy" label="协议"> </el-table-column>
<el-table-column prop="clgl_gzms" label="工作模式"> </el-table-column>
<el-table-column prop="clgl_ydx" label="源对象"> </el-table-column>
@ -28,7 +33,9 @@
<el-table-column prop="clgl_mddk" label="目的端口"> </el-table-column>
<el-table-column fixed="right" label="操作" width="100">
<template slot-scope="scope">
<el-button @click="handleClick(scope.row)" type="text" size="small">编辑</el-button>
<el-button @click="handleClick(scope.row)" type="text" size="small"
>编辑</el-button
>
<el-button type="text" size="small">删除</el-button>
</template>
</el-table-column>
@ -59,7 +66,7 @@ export default {
{
label: "无线区策略",
value: "无线区策略",
}
},
],
options2: [
{
@ -73,13 +80,15 @@ export default {
{
label: "DNP3",
value: "DNP3",
}, {
},
{
label: "S7",
value: "S7",
}, {
},
{
label: "EC104",
value: "EC104",
}
},
],
options3: [
{
@ -89,30 +98,31 @@ export default {
{
label: "路由模式",
value: "路由模式",
}, {
},
{
label: "透明模式",
value: "透明模式",
}
},
],
options4: [
{
label: "有线区交换机",
value: "有线区交换机"
value: "有线区交换机",
},
{
label: "无线区路由器",
value: "无线区路由器"
}
value: "无线区路由器",
},
],
options5: [
{
label: "拒绝",
value: "拒绝"
value: "拒绝",
},
{
label: "允许",
value: "允许"
}
value: "允许",
},
],
options6: [
{
@ -122,7 +132,8 @@ export default {
{
label: "读输入状态",
value: "读输入状态",
}, {
},
{
label: "读线保持寄存器",
value: "读线保持寄存器",
},
@ -133,14 +144,15 @@ export default {
{
label: "强制单个线圈",
value: "强制单个线圈",
}, {
},
{
label: "预置单个寄存器",
value: "预置单个寄存器",
},
{
label: "强制多个寄存器",
value: "强制多个寄存器",
}
},
],
options7: [
{
@ -150,25 +162,27 @@ export default {
{
label: "无线区路由器命令",
value: "无线区路由器命令",
}
},
],
options8: [
{
label: "有线区网闸（外网）",
value: "有线区网闸（外网）",
}, {
},
{
label: "无线区网闸（外网）",
value: "无线区网闸（外网）",
}
},
],
options9: [
{
label: "有线区网闸（内网）",
value: "有线区网闸（内网）",
}, {
},
{
label: "无线区网闸（内网）",
value: "无线区网闸（内网）",
}
},
],
dialogVisible: true,
labelPosition: "left",
@ -252,10 +266,15 @@ export default {
flag: false,
};
},
watch: {
$route(to, from) {
this.dialogVisible = true;
},
},
methods: {
addPolicy() {
this.$router.push("/addstrategy")
}
this.$router.push("/addstrategy");
},
},
};
</script>

12
src/router/index.js
View File

@ -7,6 +7,11 @@ const routes = [
path: "/",
component: () => import("../views/Index.vue"),
},
{
path: "/cockpit",
name: "cockpit",
component: () => import("../views/Cockpit.vue"),
},
{
path: "/datacollect",
name: "datacollect",
@ -30,7 +35,7 @@ const routes = [
{
path: "/dbcollectiongate",
name: "dbcollectiongate",
component: () => import("../views/DbCollectiongate.vue")
component: () => import("../views/DbCollectiongate.vue"),
},
// db网关-数据采集配置-网口配置
{
@ -164,11 +169,6 @@ const routes = [
name: "ntmaintenance",
component: () => import("../views/NtMaintenance.vue"),
},
{
path: "/cockpit",
name: "cockpit",
component: () => import("../views/Cockpit.vue"),
},
];
const router = new VueRouter({

8
src/util/chartConfig.js
View File

@ -22,6 +22,7 @@ export let productChart = {
fontSize: 10,
},
interval: 0, //代表显示所有x轴标签显示
rotate: 20,
},
},
yAxis: {
@ -77,6 +78,7 @@ export let mainshaftChart = {
fontSize: 10,
},
interval: 0, //代表显示所有x轴标签显示
rotate: 20,
},
},
yAxis: {
@ -173,6 +175,7 @@ export let loadChartChart = {
fontSize: 10,
},
interval: 0, //代表显示所有x轴标签显示
rotate: 20,
},
},
yAxis: {
@ -246,6 +249,7 @@ export let ratedChart = {
fontSize: 10,
},
interval: 0, //代表显示所有x轴标签显示
rotate: 20,
},
},
yAxis: {
@ -304,6 +308,7 @@ export let CuttingSpeedChart = {
fontSize: 10,
},
interval: 0, //代表显示所有x轴标签显示
rotate: 20,
},
},
yAxis: {
@ -386,7 +391,7 @@ export let stopChart = {
tooltip: {
//悬浮框
show: true, // 是否显示
trigger: "item", //
// trigger: "item", //
},
xAxis: {
type: "category",
@ -410,6 +415,7 @@ export let stopChart = {
fontSize: 10,
},
interval: 0, //代表显示所有x轴标签显示
rotate: 20,
},
},
yAxis: {

2
src/views/ChMqtt.vue
View File

@ -8,7 +8,7 @@
</template>
<script>
import ChiClone from '@/components/ChiClone.vue';
import ChiClone from "@/components/ChiClone.vue";
export default {
name: 'InternetCompetitionChMqtt',
components: {

132
src/views/Cockpit.vue
View File

@ -1,11 +1,5 @@
<template>
<div class="container">
<div class="btns">
<div class="btnOne">提交</div>
<div class="btnTwo">网关配置</div>
<div class="btnThree">网关维护</div>
<div class="btnFour">网关监控</div>
</div>
<div class="title">
<img src="../assets/image/工业互联网驾驶舱文字_03.png" alt="" />
<span class="date">{{ data }}</span>
@ -44,35 +38,38 @@
</p>
<div id="productChart"></div>
</div>
<div class="mainshaftChart">
<p>
<span>主轴转换监控</span>
</p>
<div id="mainshaftChart"></div>
</div>
<div class="loadChart">
<p>
<span>负载电流监控</span>
</p>
<div id="loadChart"></div>
</div>
<div class="ratedChart">
<p>
<span>额定电流监控</span>
</p>
<div id="ratedChart"></div>
</div>
<div class="two">
<p>
<span>急停状态监控</span>
</p>
<div id="two"></div>
</div>
<div class="one">
<p>
<span>切削速度监控</span>
</p>
<div id="one"></div>
<div class="chartsDiv">
<div class="mainshaftChart">
<p>
<span>主轴转换监控</span>
</p>
<div id="mainshaftChart"></div>
</div>
<div class="two">
<p>
<span>急停状态监控</span>
</p>
<div id="two"></div>
</div>
<div class="one">
<p>
<span>切削速度监控</span>
</p>
<div id="one"></div>
</div>
<div class="ratedChart">
<p>
<span>额定电流监控</span>
</p>
<div id="ratedChart"></div>
</div>
</div>
</div>
</div>
@ -170,41 +167,11 @@ export default {
width: 100vw;
height: 100vh;
background-color: #fff;
background-image: url("../assets/image/图片 2 Copy@1x.png");
// background-image: url("../assets/image/图片 2 Copy@1x.png");
background-size: cover; /* 图像大小适应容器 */
background-repeat: no-repeat; /* 防止图像平铺 */
background-position: center; /* 图像在容器中居中 */
.btns {
div {
width: 146px;
height: 39px;
position: absolute;
background-image: url("../assets/image/未选中-文字背景_06.png");
background-size: cover; /* 图像大小适应容器 */
background-repeat: no-repeat; /* 防止图像平铺 */
background-position: center; /* 图像在容器中居中 */
color: #fff;
font-size: 20px;
text-align: center;
line-height: 39px;
right: 10px;
font-family: "Microsoft Yahei";
}
.btnOne {
top: 80px;
}
.btnTwo {
top: 129px;
}
.btnThree {
top: 178px;
}
.btnFour {
top: 227px;
color: #6b92fd;
background-image: url("../assets/image/选中-文字背景_07.png");
}
}
.title {
height: 11%;
display: flex;
@ -279,30 +246,35 @@ export default {
margin-left: 45px;
position: relative;
}
.mainshaftChart {
margin-left: 45px;
margin-top: 45px;
position: relative;
}
// .mainshaftChart {
// margin-left: 45px;
// margin-top: 45px;
// position: relative;
// }
.loadChart {
position: absolute;
right: 45px;
top: 180px;
}
.ratedChart {
position: absolute;
right: 45px;
top: 533px;
}
.one {
position: absolute;
right: 560px;
top: 533px;
}
.two {
position: absolute;
left: 560px;
top: 533px;
// .ratedChart {
// position: absolute;
// right: 45px;
// top: 533px;
// }
// .one {
// position: absolute;
// right: 560px;
// top: 533px;
// }
// .two {
// position: absolute;
// left: 560px;
// top: 533px;
// }
.chartsDiv {
display: flex;
justify-content: space-between;
margin: 45px;
}
.one,
.two,

118
src/views/Index.vue
View File

@ -8,113 +8,63 @@
<router-link to="/wirelessgatewayip">db网关-ip配置-无线网关</router-link>
<router-link to="/wiredgatewayip">db网关-ip配置-有线网关</router-link>
<router-link to="/dbcollectiongate">db网关-数据采集配置-网关配置</router-link>
<router-link to="/channelconfig">db网关-数据采集配置-网口通道配置</router-link>
<router-link to="/dbcollectserial">db网关-数据采集配置-串口通道配置</router-link>
<router-link to="/dbcollectdevice">db网关-数据采集配置-设备配置</router-link>
<router-link to="/dbcollectiongate"
>db网关-数据采集配置-网关配置</router-link
>
<router-link to="/channelconfig"
>db网关-数据采集配置-网口通道配置</router-link
>
<router-link to="/dbcollectserial"
>db网关-数据采集配置-串口通道配置</router-link
>
<router-link to="/dbcollectdevice"
>db网关-数据采集配置-设备配置</router-link
>
<router-link to="/dbcollect">db网关-数据采集配置-采集点配置</router-link>
<router-link to="/mqttconfig">db-网关-MQTT上云-MQTT1配置</router-link>
<router-link to="/chwirelessgatewayip">斥候工业网关-ip配置-无线网关</router-link>
<router-link to="/chwiredgatewayip">斥候工业网关-ip配置-有线网关</router-link>
<router-link to="/gatewayconfiguration">斥候工业网关-数据采集配置-网关配置</router-link>
<router-link to="/configuration">斥候工业网关-数据采集配置-设备配置</router-link>
<router-link to="/collectionpoint">斥候工业网关-数据采集配置-采集点配置</router-link>
<router-link to="/chwirelessgatewayip"
>斥候工业网关-ip配置-无线网关</router-link
>
<router-link to="/chwiredgatewayip"
>斥候工业网关-ip配置-有线网关</router-link
>
<router-link to="/gatewayconfiguration"
>斥候工业网关-数据采集配置-网关配置</router-link
>
<router-link to="/configuration"
>斥候工业网关-数据采集配置-设备配置</router-link
>
<router-link to="/collectionpoint"
>斥候工业网关-数据采集配置-采集点配置</router-link
>
<router-link to="/chmqtt">斥候工业网关-数据上云配置-MQTT上云</router-link>
<router-link to="/ckipconfig">串口服务器-Ip配置</router-link>
<router-link to="/ckportconfig">串口服务器-端口配置</router-link>
<router-link to="/towifi">串口服务器-485towifi-串口及网络协议设置</router-link>
<router-link to="/towifi"
>串口服务器-485towifi-串口及网络协议设置</router-link
>
<router-link to="/cknet">串口服务器-485towifi-网口配置</router-link>
<router-link to="/ckwireless">串口服务器-485towifi-无线配置</router-link>
<router-link to="/networkmanagement">工业网闸配置-网络管理</router-link>
<router-link to="/objmanagement">工业网闸配置-对象管理</router-link>
<router-link to="/strategyManagement">工业网闸配置-策略管理</router-link>
<router-link to="/addstrategy">工业网闸配置-策略管理-添加策略</router-link>
<router-link to="/addstrategy"
>工业网闸配置-策略管理-添加策略</router-link
>
<router-link to="/ntconfig">网络优化-网关配置</router-link>
<router-link to="/ntmaintenance">网络优化-网关维护</router-link>
<!-- 刘龙龙写的全部路由 -->
</div>
<!-- <div class="chihou">
<h2>斥候工业网关</h2>
<ChiGate></ChiGate>
<ChiWireld></ChiWireld>
<ChiGateway></ChiGateway>
<ChiDevice></ChiDevice>
<ChiCollection></ChiCollection>
<ChiClone></ChiClone>
</div> -->
<!-- <IpConfiguration></IpConfiguration>
<PortConfiguration></PortConfiguration> -->
<div>
<!-- //串口及网络协议设置 -->
<!-- <netConfiguration /> -->
<!-- 网口配置 -->
<!-- <NetworkConfiguration /> -->
<!-- 无线配置 -->
<!-- <Wireles /> -->
<!-- 网络管理 -->
<!-- <NetworkManagement /> -->
<!-- 对象管理 -->
<!-- <ObjectManagement /> -->
<!-- 策略管理 -->
<!-- <PolicyManagement /> -->
<!-- 网关配置 -->
<!-- <GatewayConfiguration /> -->
<!-- 网关维护 -->
<!-- <GatewayMaintenance /> -->
<div>
<router-view></router-view>
</div>
</div>
</div>
</template>
<script>
import CollectionView from "../components/CollectionView.vue";
import CloneView from "../components/CloneView.vue";
import ChiGate from "../components/ChiGate.vue";
import ChiWireld from "../components/ChiWireld.vue";
import ChiGateway from "../components/ChiGateway.vue";
import IpConfiguration from "../components/IpConfiguration.vue";
import PortConfiguration from "../components/PortConfiguration.vue";
import ChiDevice from "../components/ChiDevice.vue";
import ChiCollection from "../components/ChiCollection.vue";
import ChiClone from "../components/ChiClone.vue";
import netConfiguration from "../components/netConfiguration.vue";
import NetworkConfiguration from "../components/NetworkConfiguration.vue";
import Wireles from "../components/Wireles.vue";
import NetworkManagement from "../components/NetworkManagement.vue";
import ObjectManagement from "../components/ObjectManagement.vue";
import PolicyManagement from "../components/PolicyManagement.vue";
import GatewayConfiguration from "../components/GatewayConfiguration.vue";
import GatewayMaintenance from "../components/GatewayMaintenance.vue";
export default {
name: "App",
data() {
return {};
},
methods: {},
components: {
CollectionView,
CloneView,
ChiGate,
ChiWireld,
ChiGateway,
ChiDevice,
ChiCollection,
ChiClone,
IpConfiguration,
PortConfiguration,
netConfiguration,
NetworkConfiguration,
Wireles,
NetworkManagement,
ObjectManagement,
PolicyManagement,
GatewayConfiguration,
GatewayMaintenance,
},
components: {},
};
</script>