|
@@ -0,0 +1,275 @@
|
|
|
|
|
+<template>
|
|
|
|
|
+ <div style="padding: 10px 15px">
|
|
|
|
|
+ <el-card class="box-card">
|
|
|
|
|
+ <template #header>
|
|
|
|
|
+ <div class="card-header">
|
|
|
|
|
+ <span>网关管理-新增</span>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <el-button type="warning" @click="">复位</el-button>
|
|
|
|
|
+ <el-button type="primary" @click="">保存</el-button>
|
|
|
|
|
+ <el-button type="primary" plain @click="router.back();">返回</el-button>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <el-row>
|
|
|
|
|
+ <el-col :span="24">
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ <el-descriptions :column="4">
|
|
|
|
|
+ <el-descriptions-item>
|
|
|
|
|
+ <template #label>
|
|
|
|
|
+ <div style="display: inline-block;min-width: 100px;text-align: right">
|
|
|
|
|
+ <span style="color: red">*</span> 名称
|
|
|
|
|
+ </div>
|
|
|
|
|
+
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="content-w">
|
|
|
|
|
+ <el-input placeholder="请输入"/>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item>
|
|
|
|
|
+ <template #label>
|
|
|
|
|
+ <div style="display: inline-block;min-width: 100px;text-align: right">
|
|
|
|
|
+ <span style="color: red">*</span> 序列号
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="content-w">
|
|
|
|
|
+ <el-input placeholder="请输入"/>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+
|
|
|
|
|
+ <el-descriptions-item>
|
|
|
|
|
+ <template #label>
|
|
|
|
|
+ <div style="display: inline-block;min-width: 100px;text-align: right">
|
|
|
|
|
+ <span style="color: red">*</span> 网关ID
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="content-w">
|
|
|
|
|
+ <el-input placeholder="请输入"/>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item >
|
|
|
|
|
+ <template #label>
|
|
|
|
|
+ <div style="display: inline-block;min-width: 100px;text-align: right">
|
|
|
|
|
+ 状态
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="content-w">
|
|
|
|
|
+ <el-input placeholder="请输入"/>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+
|
|
|
|
|
+ <el-descriptions-item >
|
|
|
|
|
+ <template #label>
|
|
|
|
|
+ <div style="display: inline-block;min-width: 100px;text-align: right">
|
|
|
|
|
+ 远程控制
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="content-w">
|
|
|
|
|
+ <el-input placeholder="请输入"/>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+
|
|
|
|
|
+ <el-descriptions-item >
|
|
|
|
|
+ <template #label>
|
|
|
|
|
+ <div style="display: inline-block;min-width: 100px;text-align: right">
|
|
|
|
|
+ 流量控制
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="content-w">
|
|
|
|
|
+ <el-input placeholder="请输入"/>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+
|
|
|
|
|
+ <el-descriptions-item >
|
|
|
|
|
+ <template #label>
|
|
|
|
|
+ <div style="display: inline-block;min-width: 100px;text-align: right">
|
|
|
|
|
+ 所属服务
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="content-w">
|
|
|
|
|
+ <el-input placeholder="请输入"/>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ <el-descriptions-item >
|
|
|
|
|
+ <template #label>
|
|
|
|
|
+ <div style="display: inline-block;min-width: 100px;text-align: right">
|
|
|
|
|
+ 版本
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="content-w">
|
|
|
|
|
+ <el-input placeholder="请输入"/>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ <el-descriptions-item :span="2">
|
|
|
|
|
+ <template #label>
|
|
|
|
|
+ <div style="display: inline-block;min-width: 100px;text-align: right; vertical-align: top;">
|
|
|
|
|
+ 描述
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div class="content-w" style="min-width: 550px">
|
|
|
|
|
+ <el-input type="textarea" :line-count="5" show-word-limit maxlength="200" placeholder="请输入描述"/>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+
|
|
|
|
|
+ </el-descriptions>
|
|
|
|
|
+
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+
|
|
|
|
|
+ </el-row>
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ </el-card>
|
|
|
|
|
+
|
|
|
|
|
+ <el-card class="box-card" style="margin-top: 20px">
|
|
|
|
|
+ <template #header>
|
|
|
|
|
+ <div class="card-header">
|
|
|
|
|
+ <span>设备台账</span>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <el-button type="primary" plain @click="addshow = true">添加</el-button>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <el-row>
|
|
|
|
|
+ <el-col :span="24">
|
|
|
|
|
+ <el-table :data="tabledata" border>
|
|
|
|
|
+ <el-table-column type="selection" width="55" />
|
|
|
|
|
+ <el-table-column label="上层位置"></el-table-column>
|
|
|
|
|
+ <el-table-column label="设备编码"></el-table-column>
|
|
|
|
|
+ <el-table-column label="备用编码"></el-table-column>
|
|
|
|
|
+ <el-table-column label="设备名称"></el-table-column>
|
|
|
|
|
+ <el-table-column label="设备信息"></el-table-column>
|
|
|
|
|
+ <el-table-column label="所属公司"></el-table-column>
|
|
|
|
|
+ <el-table-column label="所属组织机构"></el-table-column>
|
|
|
|
|
+ <el-table-column label="所属类型"></el-table-column>
|
|
|
|
|
+ <el-table-column label="负责人"></el-table-column>
|
|
|
|
|
+ <el-table-column label="安装日期"></el-table-column>
|
|
|
|
|
+ <el-table-column label="安装地点地址"></el-table-column>
|
|
|
|
|
+ <el-table-column label="关联设备Id"></el-table-column>
|
|
|
|
|
+ <el-table-column label="标签"></el-table-column>
|
|
|
|
|
+ <el-table-column label="状态"></el-table-column>
|
|
|
|
|
+ <el-table-column label="保修期结束日期"></el-table-column>
|
|
|
|
|
+ <el-table-column label="制造日期"></el-table-column>
|
|
|
|
|
+ <el-table-column label="资产编码"></el-table-column>
|
|
|
|
|
+ <el-table-column label="资产编号"></el-table-column>
|
|
|
|
|
+ <el-table-column label="使用证编号"></el-table-column>
|
|
|
|
|
+ <el-table-column label="安全级别"></el-table-column>
|
|
|
|
|
+ <el-table-column label="使用年限"></el-table-column>
|
|
|
|
|
+ <el-table-column label="变动日期"></el-table-column>
|
|
|
|
|
+ <el-table-column label="供货厂家"></el-table-column>
|
|
|
|
|
+ <el-table-column label="创建人"></el-table-column>
|
|
|
|
|
+ <el-table-column label="创建时间"></el-table-column>
|
|
|
|
|
+ <el-table-column label="更新人"></el-table-column>
|
|
|
|
|
+ <el-table-column label="更新时间"></el-table-column>
|
|
|
|
|
+ <el-table-column label="备注"></el-table-column>
|
|
|
|
|
+ <el-table-column label="设备编码"></el-table-column>
|
|
|
|
|
+ <el-table-column label="操作" fixed="right" ></el-table-column>
|
|
|
|
|
+
|
|
|
|
|
+ </el-table>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="24" style="margin-top: 10px;">
|
|
|
|
|
+ <el-pagination style="float: right;"
|
|
|
|
|
+ small
|
|
|
|
|
+ background
|
|
|
|
|
+ layout="prev, pager, next"
|
|
|
|
|
+ :total="50"
|
|
|
|
|
+ class="mt-4"
|
|
|
|
|
+ />
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+
|
|
|
|
|
+ </el-row>
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </el-card>
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ <el-dialog
|
|
|
|
|
+ title="设备台账"
|
|
|
|
|
+ v-model="addshow">
|
|
|
|
|
+
|
|
|
|
|
+ <el-table height="400px">
|
|
|
|
|
+ <el-table-column type="selection" width="55" fixed="left" />
|
|
|
|
|
+ <el-table-column label="上层位置"></el-table-column>
|
|
|
|
|
+ <el-table-column label="设备编码"></el-table-column>
|
|
|
|
|
+ <el-table-column label="备用编码"></el-table-column>
|
|
|
|
|
+ <el-table-column label="设备名称"></el-table-column>
|
|
|
|
|
+ <el-table-column label="设备信息"></el-table-column>
|
|
|
|
|
+ <el-table-column label="所属公司"></el-table-column>
|
|
|
|
|
+ <el-table-column label="所属组织机构"></el-table-column>
|
|
|
|
|
+ <el-table-column label="所属类型"></el-table-column>
|
|
|
|
|
+ <el-table-column label="负责人"></el-table-column>
|
|
|
|
|
+ <el-table-column label="安装日期"></el-table-column>
|
|
|
|
|
+ <el-table-column label="安装地点地址"></el-table-column>
|
|
|
|
|
+ <el-table-column label="关联设备Id"></el-table-column>
|
|
|
|
|
+ <el-table-column label="标签"></el-table-column>
|
|
|
|
|
+ <el-table-column label="状态"></el-table-column>
|
|
|
|
|
+ <el-table-column label="保修期结束日期"></el-table-column>
|
|
|
|
|
+ <el-table-column label="制造日期"></el-table-column>
|
|
|
|
|
+ <el-table-column label="资产编码"></el-table-column>
|
|
|
|
|
+ <el-table-column label="资产编号"></el-table-column>
|
|
|
|
|
+ <el-table-column label="使用证编号"></el-table-column>
|
|
|
|
|
+ <el-table-column label="安全级别"></el-table-column>
|
|
|
|
|
+ <el-table-column label="使用年限"></el-table-column>
|
|
|
|
|
+ <el-table-column label="变动日期"></el-table-column>
|
|
|
|
|
+ <el-table-column label="供货厂家"></el-table-column>
|
|
|
|
|
+ <el-table-column label="创建人"></el-table-column>
|
|
|
|
|
+ <el-table-column label="创建时间"></el-table-column>
|
|
|
|
|
+ <el-table-column label="更新人"></el-table-column>
|
|
|
|
|
+ <el-table-column label="更新时间"></el-table-column>
|
|
|
|
|
+ <el-table-column label="备注"></el-table-column>
|
|
|
|
|
+ <el-table-column label="设备编码"></el-table-column>
|
|
|
|
|
+
|
|
|
|
|
+ </el-table>
|
|
|
|
|
+
|
|
|
|
|
+ <div style="text-align: center;display: flex;justify-content: center;margin-top: 10px" >
|
|
|
|
|
+
|
|
|
|
|
+ <el-pagination
|
|
|
|
|
+ small
|
|
|
|
|
+ background
|
|
|
|
|
+ layout="prev, pager, next"
|
|
|
|
|
+ :total="50"
|
|
|
|
|
+ class="mt-4"
|
|
|
|
|
+ />
|
|
|
|
|
+
|
|
|
|
|
+ </div>
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ </el-dialog>
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ </div>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+<script setup lang="ts" >
|
|
|
|
|
+import {ref} from "vue";
|
|
|
|
|
+import {useRoute, useRouter} from "vue-router";
|
|
|
|
|
+import ModbusTcp from "@/views/data/modbusTcp/index.vue";
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+const route = useRoute();
|
|
|
|
|
+const router = useRouter();
|
|
|
|
|
+
|
|
|
|
|
+const addshow = ref(false);
|
|
|
|
|
+const tabledata = ref([1]);
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+</script>
|
|
|
|
|
+
|
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
|
+.card-header {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-direction: row;
|
|
|
|
|
+ justify-content: space-between;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.content-w {
|
|
|
|
|
+ display: inline-flex;
|
|
|
|
|
+ max-width: 180px;
|
|
|
|
|
+}
|
|
|
|
|
+</style>
|