|
|
@@ -1,120 +1,202 @@
|
|
|
<template>
|
|
|
<div style="padding: 10px 15px">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="6" style="padding-right: 10px">
|
|
|
<el-card class="box-card">
|
|
|
<template #header>
|
|
|
<div class="card-header">
|
|
|
- <span>设备标签管理</span>
|
|
|
-
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- @click="
|
|
|
- detailshow = true;
|
|
|
- edittype = 1;
|
|
|
- "
|
|
|
- >添加</el-button
|
|
|
- >
|
|
|
+ <span>东门立柱摄像-详情</span>
|
|
|
</div>
|
|
|
</template>
|
|
|
- <el-row>
|
|
|
-
|
|
|
- <el-col :span="24" style="padding-left: 10px">
|
|
|
- <el-table :data="dwtabledata" :border="true" :height="gettbheight()">
|
|
|
- <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="操作">
|
|
|
- <template #default="scope">
|
|
|
- <div>
|
|
|
- <el-button
|
|
|
- link
|
|
|
- @click="
|
|
|
- detailshow = true;
|
|
|
- edittype = 2;
|
|
|
- "
|
|
|
- >
|
|
|
- <el-tooltip effect="dark" content="编辑">
|
|
|
- <el-icon>
|
|
|
- <Edit />
|
|
|
- </el-icon>
|
|
|
- </el-tooltip>
|
|
|
- </el-button>
|
|
|
- <el-popconfirm title="确定删除该标签?">
|
|
|
- <template #reference>
|
|
|
- <el-button link
|
|
|
- ><el-tooltip effect="dark" content="删除"
|
|
|
- ><el-icon><Delete /></el-icon></el-tooltip
|
|
|
- ></el-button>
|
|
|
- </template>
|
|
|
- </el-popconfirm>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
+ <div class="tree">
|
|
|
+ <LayTree
|
|
|
+ :data="data"
|
|
|
+ :tail-node-icon="false"
|
|
|
+ :onlyIconControl="true"
|
|
|
+ v-model:selectedKey="selectedKey"
|
|
|
+ @node-click="handleClick"
|
|
|
+ >
|
|
|
+ </LayTree>
|
|
|
+ </div>
|
|
|
</el-card>
|
|
|
+ </el-col>
|
|
|
|
|
|
- <el-dialog
|
|
|
- :title="`${edittype == 1 ? '新增' : edittype == 2 ? '编辑' : '查看'}设备标签`"
|
|
|
- v-model="detailshow"
|
|
|
- >
|
|
|
- <el-form :model="dwform" label-width="120px">
|
|
|
- <el-form-item label="编码">
|
|
|
- <el-input v-model="dwform.name" :disabled="edittype==3"/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="名称">
|
|
|
- <el-input v-model="dwform.name" :disabled="edittype==3"/>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="备注">
|
|
|
- <el-input type="textarea" v-model="dwform.name" :disabled="edittype==3"/>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- <template #footer>
|
|
|
- <div class="dialog-footer">
|
|
|
- <el-button @click="detailshow=false;"> 取消 </el-button>
|
|
|
- <el-button type="primary" @click="dosavedw"> 保存 </el-button>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
+ <el-col :span="18">
|
|
|
+ <el-card class="box-card">
|
|
|
+ <div style="display: flex; flex-direction: row; justify-content: space-between">
|
|
|
+ <div style="display: flex; flex-direction: row;">
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div style="font-size: 12px; width: 80px;">设备名称:</div>
|
|
|
+ <el-input
|
|
|
+ v-model="searchform.devicename"
|
|
|
+ placeholder="设备名称"
|
|
|
+ ></el-input>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ style="
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ align-items: center;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div style="font-size: 12px; width: 80px;margin-left: 10px">设备编码:</div>
|
|
|
+ <el-input
|
|
|
+ v-model="searchform.devicename"
|
|
|
+ placeholder="设备编码"
|
|
|
+ ></el-input>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-button type="primary" plain>重置</el-button>
|
|
|
+ <el-button type="primary">搜索</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
|
|
|
-<script setup lang="ts" name="Units">
|
|
|
-import { ref } from "vue";
|
|
|
+ <el-card class="box-card" style="margin-top: 10px;">
|
|
|
+ <template #header>
|
|
|
+ <div class="card-header">
|
|
|
+ <span>设备台账</span>
|
|
|
+ <div>
|
|
|
+ <el-button type="primary">添加</el-button>
|
|
|
+ <el-button type="danger">批量删除</el-button>
|
|
|
+ <el-button type="primary" plain>显示字段</el-button>
|
|
|
+ </div>
|
|
|
+ </div></template>
|
|
|
|
|
|
-const dwtypetabledata = ref([]);
|
|
|
-const dwtabledata = ref([1,1,1,1,1,1]);
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" style="padding-left: 10px">
|
|
|
+ <el-table :data="devicetabledata" :border="true">
|
|
|
+ <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="操作">
|
|
|
+ <template #default="scope">
|
|
|
+ <div>
|
|
|
+ <el-button link >
|
|
|
+ <el-tooltip effect="dark" content="详情">
|
|
|
+ <el-icon>
|
|
|
+ <Memo />
|
|
|
+ </el-icon>
|
|
|
+ </el-tooltip>
|
|
|
+ </el-button>
|
|
|
+ <el-popconfirm title="确定删除该标签?">
|
|
|
+ <template #reference>
|
|
|
+ <el-button link
|
|
|
+ ><el-tooltip effect="dark" content="删除"
|
|
|
+ ><el-icon><Delete /></el-icon></el-tooltip
|
|
|
+ ></el-button>
|
|
|
+ </template>
|
|
|
+ </el-popconfirm>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
|
|
|
-const edittype = ref(1);
|
|
|
-const detailshow = ref(false);
|
|
|
|
|
|
-const dwform = ref({
|
|
|
- id: 0,
|
|
|
- name: "",
|
|
|
- unitSymbol: "",
|
|
|
- unitName: "",
|
|
|
- isStandard: "",
|
|
|
- unitType: "",
|
|
|
- toStandardRatio: 0,
|
|
|
- toOffset: 0,
|
|
|
- remark: "",
|
|
|
- creator: "",
|
|
|
- ctime: "",
|
|
|
- modifier: "",
|
|
|
- utime: "",
|
|
|
-});
|
|
|
+ </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>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
|
|
|
-const gettbheight = () => {
|
|
|
|
|
|
- return window.innerHeight - 200;
|
|
|
-}
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
|
|
|
-const dosavedw = () => {
|
|
|
+<script setup lang="ts" name="Units">
|
|
|
+import {ref} from "vue";
|
|
|
+import { LayTree } from "@layui/layui-vue";
|
|
|
+import "@layui/layui-vue/lib/index.css";
|
|
|
|
|
|
- detailshow.value = false;
|
|
|
|
|
|
+const handleClick = (node) => {
|
|
|
+ console.log("Click Node:" + JSON.stringify(node));
|
|
|
};
|
|
|
+const selectedKey = ref(4);
|
|
|
+const data = ref([
|
|
|
+ {
|
|
|
+ title: "集团公司",
|
|
|
+ id: 1,
|
|
|
+ checked: true,
|
|
|
+ spread: true,
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ title: "示范项目",
|
|
|
+ id: 2,
|
|
|
+ spread: true,
|
|
|
+ children: [
|
|
|
+ {
|
|
|
+ title: "监测站",
|
|
|
+ id: 4,
|
|
|
+ href: "https://www.layui.com/",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "用能区域",
|
|
|
+ id: 5,
|
|
|
+ href: "https://www.layui.com/",
|
|
|
+ },
|
|
|
+
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "虚拟项目",
|
|
|
+ id: 3,
|
|
|
+ href: "https://www.layui.com/",
|
|
|
+ },
|
|
|
|
|
|
+ ],
|
|
|
+ },
|
|
|
+]);
|
|
|
+
|
|
|
+const devicetabledata = ref([1]);
|
|
|
+const searchform = ref({
|
|
|
+ devicename: "",
|
|
|
+ devicesn:""
|
|
|
+});
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
@@ -123,4 +205,12 @@ const dosavedw = () => {
|
|
|
flex-direction: row;
|
|
|
justify-content: space-between;
|
|
|
}
|
|
|
+
|
|
|
+.tree {
|
|
|
+ *,
|
|
|
+ *:before,
|
|
|
+ *:after {
|
|
|
+ box-sizing: content-box !important;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
