|
|
@@ -2,66 +2,54 @@
|
|
|
<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>
|
|
|
- <div>
|
|
|
- <el-button type="primary" plain >
|
|
|
- 添加
|
|
|
- </el-button>
|
|
|
+ <el-card class="box-card">
|
|
|
+ <template #header>
|
|
|
+ <div class="card-header">
|
|
|
+ <span>设备台账区域</span>
|
|
|
+ <div>
|
|
|
+ <el-button type="primary" plain>
|
|
|
+ 添加
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="tree">
|
|
|
+ <LayTree :data="treeList" :tail-node-icon="false" :onlyIconControl="true" v-model:selectedKey="selectedKey"
|
|
|
+ @node-click="handleClick">
|
|
|
+ <template #title="{ data }">
|
|
|
+ {{ data.name }}
|
|
|
+ </template>
|
|
|
+ </LayTree>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <div class="tree">
|
|
|
- <LayTree
|
|
|
- :data="data"
|
|
|
- :tail-node-icon="false"
|
|
|
- :onlyIconControl="true"
|
|
|
- v-model:selectedKey="selectedKey"
|
|
|
- @node-click="handleClick"
|
|
|
- >
|
|
|
- </LayTree>
|
|
|
- </div>
|
|
|
- </el-card>
|
|
|
+ </el-card>
|
|
|
</el-col>
|
|
|
|
|
|
<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="
|
|
|
+ <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>
|
|
|
+ <el-input v-model="searchform.name" placeholder="设备名称"></el-input>
|
|
|
</div>
|
|
|
- <div
|
|
|
- style="
|
|
|
+ <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>
|
|
|
+ <el-input v-model="searchform.sn" placeholder="设备编码"></el-input>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div>
|
|
|
- <el-button type="primary" plain>重置</el-button>
|
|
|
- <el-button type="primary">搜索</el-button>
|
|
|
+ <el-button type="primary" plain @click="requery">重置</el-button>
|
|
|
+ <el-button type="primary" @click="getlistEquipmentSbook">搜索</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-card>
|
|
|
@@ -75,44 +63,24 @@
|
|
|
<el-button type="danger">批量删除</el-button>
|
|
|
<el-button type="primary" plain>显示字段</el-button>
|
|
|
</div>
|
|
|
- </div></template>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
|
|
|
<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 type="selection" width="55" />
|
|
|
+ <el-table-column v-for="item in columns.filter(i => i.visible)" :prop="item.prop"
|
|
|
+ :label="item.label"></el-table-column>
|
|
|
+ <el-table-column label="设备类型">
|
|
|
+ <template #default="scope">
|
|
|
+ {{ getTypeName(scope.row) }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column label="操作">
|
|
|
<template #default="scope">
|
|
|
<div>
|
|
|
- <el-button link >
|
|
|
+ <el-button link>
|
|
|
<el-tooltip effect="dark" content="详情">
|
|
|
<el-icon>
|
|
|
<Memo />
|
|
|
@@ -121,10 +89,9 @@
|
|
|
</el-button>
|
|
|
<el-popconfirm title="确定删除该标签?">
|
|
|
<template #reference>
|
|
|
- <el-button link
|
|
|
- ><el-tooltip effect="dark" content="删除"
|
|
|
- ><el-icon><Delete /></el-icon></el-tooltip
|
|
|
- ></el-button>
|
|
|
+ <el-button link><el-tooltip effect="dark" content="删除"><el-icon>
|
|
|
+ <Delete />
|
|
|
+ </el-icon></el-tooltip></el-button>
|
|
|
</template>
|
|
|
</el-popconfirm>
|
|
|
</div>
|
|
|
@@ -135,13 +102,8 @@
|
|
|
|
|
|
</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-pagination style="float: right;" small background layout="prev, pager, next" :total="pagedata.total"
|
|
|
+ :page-size="pagedata.size" :current-page="pagedata.current" @current-change="onchangepage" class="mt-4" />
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</el-card>
|
|
|
@@ -153,64 +115,139 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts" name="Units">
|
|
|
-import {ref} from "vue";
|
|
|
+import { ref,toRaw } from "vue";
|
|
|
import { LayTree } from "@layui/layui-vue";
|
|
|
import "@layui/layui-vue/lib/index.css";
|
|
|
-import {useRoute, useRouter} from "vue-router";
|
|
|
+
|
|
|
+import { useRoute, useRouter } from "vue-router";
|
|
|
+import { listEquipmentOrganizational } from "@/api/data/equipmentOrganizational"
|
|
|
+import { listEquipmentSbook } from "@/api/data/equipmentSbook"
|
|
|
+import { getDicts } from '@/api/system/dict/data'
|
|
|
+
|
|
|
|
|
|
|
|
|
const route = useRoute();
|
|
|
const router = useRouter();
|
|
|
|
|
|
+const { proxy } = getCurrentInstance();
|
|
|
|
|
|
-const goadd = ()=>{
|
|
|
+const goadd = () => {
|
|
|
router.push("/device/equipmentdash/add")
|
|
|
}
|
|
|
|
|
|
const handleClick = (node) => {
|
|
|
- console.log("Click Node:" + JSON.stringify(node));
|
|
|
+ //console.log("Click Node:" + JSON.stringify(node));
|
|
|
+ searchform.value.equipmentTreeId = node.id
|
|
|
+ getlistEquipmentSbook();
|
|
|
};
|
|
|
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 treeList = ref([]);
|
|
|
+const typeList = ref([]);
|
|
|
+
|
|
|
+const pagedata = ref({
|
|
|
+ total: 0,
|
|
|
+ size: 10,
|
|
|
+ current: 1
|
|
|
+});
|
|
|
+
|
|
|
+const devicetabledata = ref([]);
|
|
|
const searchform = ref({
|
|
|
- devicename: "",
|
|
|
- devicesn:""
|
|
|
+ name: "",
|
|
|
+ sn: "",
|
|
|
+ equipmentTreeId:""
|
|
|
});
|
|
|
+
|
|
|
+const columns = ref([
|
|
|
+ // {label: '上层位置', prop: 'v', visible: true},
|
|
|
+ { label: '上层位置', prop: 'deptName', visible: true },
|
|
|
+ { label: '设备编码', prop: 'sn', visible: true },
|
|
|
+ { label: '备用编码', prop: 'spareSn', visible: true },
|
|
|
+ { label: '设备名称', prop: 'name', visible: true },
|
|
|
+ { label: '设备信息', prop: 'equipment.name', visible: true },
|
|
|
+ //{label: '所属公司', prop: 'parity', visible: true},
|
|
|
+ { label: '所属组织机构', prop: 'deptName', visible: true },
|
|
|
+ // { label: '所属类型', prop: 'apiUrl', visible: true },
|
|
|
+ { label: '负责人', prop: 'uuid', visible: true },
|
|
|
+ { label: '安装日期', prop: 'installationDate', visible: true },
|
|
|
+ { label: '安装地点地址', prop: 'address', visible: true },
|
|
|
+ // {label: '关联设备Id', prop: 'protocolDesc', visible: true},
|
|
|
+ { label: '标签', prop: 'tagids', visible: true },
|
|
|
+ { label: '状态', prop: 'status', visible: true },
|
|
|
+ { label: '保修期结束日期', prop: 'endOfWarrantyPeriod', visible: true },
|
|
|
+ { label: '制造日期', prop: 'manufacturingDate', visible: true },
|
|
|
+ { label: '资产编码', prop: 'assetNo', visible: true },
|
|
|
+ { label: '资产编号', prop: 'serialNumber', visible: true },
|
|
|
+ { label: '使用证编号', prop: 'useCertificateNo', visible: true },
|
|
|
+ { label: '安全级别', prop: 'securityLevel', visible: true },
|
|
|
+ { label: '使用年限', prop: 'usefulLife', visible: true },
|
|
|
+ { label: '变动日期', prop: 'changeDate', visible: true },
|
|
|
+ { label: '供货厂家', prop: 'supplier', visible: true },
|
|
|
+ { label: '创建人', prop: 'createBy', visible: true },
|
|
|
+ { label: '创建时间', prop: 'createTime', visible: true },
|
|
|
+ { label: '更新人', prop: 'updateBy', visible: true },
|
|
|
+ { label: '更新时间', prop: 'updateTime', visible: true },
|
|
|
+ { label: '备注', prop: 'remark', visible: true },
|
|
|
+])
|
|
|
+
|
|
|
+const onchangepage = (page) => {
|
|
|
+ pagedata.value.current = page;
|
|
|
+ getlistEquipmentSbook();
|
|
|
+}
|
|
|
+
|
|
|
+const getTreedata = () => {
|
|
|
+ listEquipmentOrganizational({ pageSize: 10000 }).then(res => {
|
|
|
+ const { rows, total, page, size } = res;
|
|
|
+ treeList.value = proxy.handleTree(res.rows, "id", "parentId");
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// function getlistEquipmentSbook(){
|
|
|
+// listEquipmentSbook({ ...searchform.value, pageSize: pagedata.value.size, pageNum: pagedata.value.current }).then(res => {
|
|
|
+// const { rows, total, page, size } = res;
|
|
|
+// devicetabledata.value = res.rows
|
|
|
+// })
|
|
|
+// }
|
|
|
+
|
|
|
+const requery = () => {
|
|
|
+ searchform.value = {
|
|
|
+ name: "",
|
|
|
+ sn: "",
|
|
|
+ equipmentTreeId:''
|
|
|
+ }
|
|
|
+ getlistEquipmentSbook();
|
|
|
+}
|
|
|
+
|
|
|
+const getlistEquipmentSbook = () => {
|
|
|
+ listEquipmentSbook({ ...searchform.value, pageSize: pagedata.value.size, pageNum: pagedata.value.current }).then(res => {
|
|
|
+ const { rows, total, page, size } = res;
|
|
|
+ devicetabledata.value = res.rows
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const getDictsData = () => {
|
|
|
+ getDicts("equipment_type").then(res => {
|
|
|
+ typeList.value = res.data;
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const getTypeName = (scope) => {
|
|
|
+ var equipment = toRaw(scope)
|
|
|
+ if (equipment != null) {
|
|
|
+ for (var index in typeList.value) {
|
|
|
+ var obj = toRaw(typeList.value[index]);
|
|
|
+ console.log(obj.dictValue);
|
|
|
+ console.log(equipment.equipmentTypeId);
|
|
|
+ if (obj.dictValue == equipment.equipmentTypeId) {
|
|
|
+ console.log(obj.dictLabel);
|
|
|
+ return obj.dictLabel
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+getTreedata();
|
|
|
+getlistEquipmentSbook();
|
|
|
+getDictsData();
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
@@ -221,6 +258,7 @@ const searchform = ref({
|
|
|
}
|
|
|
|
|
|
.tree {
|
|
|
+
|
|
|
*,
|
|
|
*:before,
|
|
|
*:after {
|