From efad6058c9c9ee6ba754dc9cc61c8d744cd199b8 Mon Sep 17 00:00:00 2001
From: licp <lichunping@guanfang.com.cn>
Date: 星期一, 06 一月 2025 10:30:31 +0800
Subject: [PATCH] 完成设备模块搬迁
---
src/components/view/a6-device.vue | 268 +++++++++++++++++++++++++++++++++++++++++++++++++++--
1 files changed, 256 insertions(+), 12 deletions(-)
diff --git a/src/components/view/a6-device.vue b/src/components/view/a6-device.vue
index 1b660a4..168f9ef 100644
--- a/src/components/view/a6-device.vue
+++ b/src/components/view/a6-device.vue
@@ -1,40 +1,284 @@
<template>
<div class="device-page">
<div class="device-left">
- <el-input placeholder="杈撳叆璁惧鍚嶇О" suffix-icon="el-icon-search" v-model="search" size="small"
- style="margin-bottom: 5px;" clearable></el-input>
+ <el-input v-model="deviceName" class="div_left_input" clearable placeholder="杈撳叆璁惧鍚嶇О"
+ size="small" suffix-icon="el-icon-search" @blur="searchFilter" @clear="searchFilter"
+ @keyup.enter.native="searchFilter"></el-input>
+ <el-tree ref="tree" v-loading="loading" :data="list" :expand-on-click-node="false"
+ :filter-node-method="filterNode" :props="{ children: 'children', label: 'label' }" highlight-current node-key="id"
+ style="height:calc(100% - 46px);
+ overflow-y: scroll;
+ scrollbar-width: none;" @node-click="handleNodeClick" @node-expand="nodeOpen" @node-collapse="nodeClose">
+ <div slot-scope="{ node, data }" class="custom-tree-node">
+ <el-row style="width: 100%;">
+ <el-col :span="21" :title="data.label">
+ <span class="single-line-ellipsis" style="width: 100%;display: inline-block;">
+ <i :class="`node_i ${data.children != undefined
+ ? data.code === '[1]'
+ ? 'el-icon-folder-opened'
+ : 'el-icon-folder'
+ : 'el-icon-tickets'
+ }`
+ "></i>
+ {{ data.label }}
+ </span>
+ </el-col>
+ </el-row>
+ </div>
+ </el-tree>
</div>
- <div class="device-right"></div>
+ <div class="device-right">
+ <div v-if="isShowAll">
+ <el-tabs v-model="menuListActiveName" class="main_right" type="border-card">
+ <el-tab-pane label="璁惧鎬昏" name="璁惧鎬昏">
+ <overview v-if="menuListActiveName == '璁惧鎬昏'" :clickNodeVal="clickNodeVal" />
+ </el-tab-pane>
+ <el-tab-pane label="璁惧宸ュ叿鏄庣粏" name="璁惧宸ュ叿鏄庣粏">
+ <management v-if="menuListActiveName == '璁惧宸ュ叿鏄庣粏'" :clickNodeVal="clickNodeVal" />
+ </el-tab-pane>
+<!-- <el-tab-pane label="璧勬簮棰勫畾" name="璧勬簮棰勫畾">-->
+<!-- <resourceReservation v-if="menuListActiveName == '璧勬簮棰勫畾'" :clickNodeVal="clickNodeVal"/>-->
+<!-- </el-tab-pane>-->
+ <el-tab-pane label="璁惧鏍″噯璁″垝" name="璁惧鏍″噯璁″垝">
+ <equipment-calibration-plan v-if="menuListActiveName == '璁惧鏍″噯璁″垝'" :clickNodeVal="clickNodeVal"></equipment-calibration-plan>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧鏍告煡璁″垝" name="璁惧鏍告煡璁″垝">
+ <equipment-verification-plan v-if="menuListActiveName == '璁惧鏍告煡璁″垝'" :clickNodeVal="clickNodeVal"></equipment-verification-plan>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧淇濆吇璁″垝" name="璁惧淇濆吇璁″垝">
+ <equipment-maintenance-plan v-if="menuListActiveName == '璁惧淇濆吇璁″垝'" :clickNodeVal="clickNodeVal"></equipment-maintenance-plan>
+ </el-tab-pane>
+ <el-tab-pane label="閲忓�兼函婧愯鍒�" name="閲忓�兼函婧愯鍒�">
+ <quantity-value-traceability-plan v-if="menuListActiveName == '閲忓�兼函婧愯鍒�'" :clickNodeVal="clickNodeVal"></quantity-value-traceability-plan>
+ </el-tab-pane>
+ <el-tab-pane label="鍒╃敤澶栭儴浠櫒璁惧" name="鍒╃敤澶栭儴浠櫒璁惧">
+ <using-external-instruments v-if="menuListActiveName == '鍒╃敤澶栭儴浠櫒璁惧'" :clickNodeVal="clickNodeVal"></using-external-instruments>
+ </el-tab-pane>
+ </el-tabs>
+ </div>
+ <div v-if="!isShowAll">
+ <el-tabs v-model="tabListActiveName" class="main_right" type="border-card" @tab-click="handleClick">
+<!-- <el-tab-pane label="璁惧杩愯鎬昏" name="璁惧杩愯鎬昏">-->
+<!-- <operationOverview v-if="tabListActiveName == '璁惧杩愯鎬昏'" :clickNodeVal="clickNodeVal"/>-->
+<!-- </el-tab-pane>-->
+ <el-tab-pane label="璁惧妗ｆ" name="璁惧妗ｆ">
+ <files v-if="tabListActiveName == '璁惧妗ｆ'" :clickNodeVal="clickNodeVal"/>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧楠屾敹" name="璁惧楠屾敹">
+<!-- <checkAndAccept v-if="tabListActiveName == '璁惧楠屾敹'" :clickNodeVal="clickNodeVal"/>-->
+ <equipment-acceptance v-if="tabListActiveName == '璁惧楠屾敹'" :clickNodeVal="clickNodeVal"></equipment-acceptance>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧鏍″噯" name="璁惧鏍″噯">
+ <calibration v-if="tabListActiveName == '璁惧鏍″噯'" :clickNodeVal="clickNodeVal"/>
+ </el-tab-pane>
+<!-- <el-tab-pane label="璁惧鏍告煡" name="璁惧鏍告煡">-->
+<!-- <check v-if="tabListActiveName == '璁惧鏍告煡'" :clickNodeVal="clickNodeVal"/>-->
+<!-- </el-tab-pane>-->
+ <el-tab-pane label="璁惧缁存姢" name="璁惧缁存姢">
+ <maintenance v-if="tabListActiveName == '璁惧缁存姢'" :clickNodeVal="clickNodeVal"/>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧鍊熺敤" name="璁惧鍊熺敤">
+ <borrow v-if="tabListActiveName == '璁惧鍊熺敤'" :clickNodeVal="clickNodeVal" />
+ </el-tab-pane>
+<!-- <el-tab-pane label="璁惧鏁呴殰" name="璁惧鏁呴殰">-->
+<!-- <fault v-if="tabListActiveName == '璁惧鏁呴殰'" :clickNodeVal="clickNodeVal" />-->
+<!-- </el-tab-pane>-->
+ <el-tab-pane label="浣跨敤璁板綍" name="浣跨敤璁板綍">
+ <record v-if="tabListActiveName == '浣跨敤璁板綍'" :clickNodeVal="clickNodeVal"/>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧鍋滅敤/鍚敤" name="璁惧鍋滅敤/鍚敤">
+ <state v-if="tabListActiveName == '璁惧鍋滅敤/鍚敤'" :clickNodeVal="clickNodeVal"/>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧鎶ュ簾" name="璁惧鎶ュ簾">
+ <equipment-scrap v-if="tabListActiveName == '璁惧鎶ュ簾'" :clickNodeVal="clickNodeVal"/>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧鏁呴殰涓庣淮淇�" name="璁惧鏁呴殰涓庣淮淇�">
+ <equipment-failure v-if="tabListActiveName == '璁惧鏁呴殰涓庣淮淇�'" :clickNodeVal="clickNodeVal"/>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧鐐规" name="璁惧鐐规">
+ <inspection-of-equipment v-if="tabListActiveName == '璁惧鐐规'" :clickNodeVal="clickNodeVal"/>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧浜嬫晠" name="璁惧浜嬫晠">
+ <equipment-accident v-if="tabListActiveName == '璁惧浜嬫晠'" :clickNodeVal="clickNodeVal"/>
+ </el-tab-pane>
+ <el-tab-pane label="浣滀笟鎸囧涔�" name="浣滀笟鎸囧涔�">
+ <operationInstruction v-if="tabListActiveName == '浣滀笟鎸囧涔�'" :clickNodeVal="clickNodeVal"/>
+ </el-tab-pane>
+ </el-tabs>
+ </div>
+ </div>
</div>
</template>
<script>
+import operationOverview from "../do/a6-device/operation-overview.vue";
+import files from "../do/a6-device/files.vue";
+import checkAndAccept from "../do/a6-device/check-and-accept.vue";
+import calibration from "../do/a6-device/calibration.vue";
+import check from "../do/a6-device/check.vue";
+import maintenance from "../do/a6-device/maintenance.vue";
+import borrow from "../do/a6-device/borrow.vue";
+import fault from "../do/a6-device/fault.vue";
+import record from "../do/a6-device/record.vue";
+import state from "../do/a6-device/state.vue";
+import management from "../do/a6-device/management.vue";
+import overview from "../do/a6-device/device-overview.vue";
+import resourceReservation from "../do/a6-device/resource-reservation.vue";
+import operationInstruction from "../do/a6-device/operation-instruction.vue";
+import EquipmentCalibrationPlan from "../equipment/equipment-calibration-plan.vue";
+import EquipmentVerificationPlan from "../equipment/equipment-verification-plan.vue";
+import UsingExternalInstruments from "../equipment/using-external-instruments.vue";
+import EquipmentScrap from "../equipment/equipment-scrap.vue";
+import EquipmentFailure from "../equipment/equipment-failure.vue";
+import InspectionOfEquipment from "../equipment/inspection-of-equipment.vue";
+import EquipmentAccident from "../equipment/equipment-accident.vue";
+import EquipmentMaintenancePlan from "../equipment/equipment-maintenance-plan.vue";
+import EquipmentAcceptance from "../equipment/equipment-acceptance.vue";
+import QuantityValueTraceabilityPlan from "../equipment/quantity-value-traceability-plan.vue";
export default {
- data(){
+ components: {
+ QuantityValueTraceabilityPlan,
+ EquipmentAcceptance,
+ EquipmentMaintenancePlan,
+ EquipmentAccident,
+ InspectionOfEquipment,
+ EquipmentFailure,
+ EquipmentScrap,
+ UsingExternalInstruments,
+ EquipmentVerificationPlan,
+ EquipmentCalibrationPlan,
+ operationOverview,
+ files,
+ checkAndAccept,
+ calibration,
+ check,
+ maintenance,
+ borrow,
+ fault,
+ record,
+ state,
+ management,
+ overview,
+ resourceReservation,
+ operationInstruction
+ },
+ data() {
return {
- search:''
- }
+ isShowAll: true,
+ deviceName: "", // 渚ц竟鏍忔悳绱�
+ loading: false,
+ tabListActiveName: '璁惧妗ｆ',
+ menuListActiveName: '璁惧鎬昏',
+ list: [],
+ clickNodeVal: {}
+ };
+ },
+ mounted() {
+ // 鍒濆鍖栬皟鐢�
+ this.geList();
+ },
+ methods: {
+ handleClick(tab, event) {
+ },
+ searchFilter() {
+ this.$refs.tree.filter(this.deviceName)
+ },
+ filterNode(value, data) {
+ if (!value) return true;
+ return data.label.indexOf(value) !== -1;
+ },
+ // 鐖剁骇
+ geList() {
+ this.loading = true;
+ this.$axios.get(
+ this.$api.deviceScope.treeDevice
+ ).then(res => {
+ let data = res.data;
+ this.list = data;
+ this.loading = false
+ });
+ },
+ handleNodeClick(val, node, el) {
+ // 鐐瑰嚮涓存椂缂撳瓨
+ this.clickNodeVal = val;
+ // 瀛樺偍鐖剁骇鑺傜偣绾ф暟
+ this.clickNodeVal.level = node.level
+ this.clickNodeVal.parent = node.parent.data
+ // 鏄惁鏄剧ず璁惧璇︽儏
+ if (!val.value) {
+ this.isShowAll = true
+ } else {
+ this.isShowAll = false
+ }
+ },
+ nodeOpen(data, node, el) {
+ $($(el.$el).find(".node_i")[0]).attr(
+ "class",
+ "node_i el-icon-folder-opened"
+ );
+ },
+ nodeClose(data, node, el) {
+ $($(el.$el).find(".node_i")[0]).attr("class", "node_i el-icon-folder");
+ },
}
-}
+};
</script>
<style scoped>
-.device-page{
+.device-page {
display: flex;
padding-top: 10px;
padding-bottom: 10px;
box-sizing: border-box;
+ width: 100%;
}
-.device-left{
- width: 200px;
+
+.device-left {
+ width: 250px;
height: 100%;
background: #fff;
margin-right: 10px;
border-radius: 16px;
+ box-sizing: border-box;
+ padding: 10px 16px;
+ flex-shrink: 0;
}
-.device-right{
+
+.device-right {
background: #fff;
- flex: 1;
+ width: calc(100% - 260px);
+ height: 100%;
border-radius: 16px;
+ box-sizing: border-box;
+ padding: 10px 16px;
+}
+
+.showLargeCategory {
+ width: 100%;
+ height: 100%;
+}
+
+.device-right-content {
+ /* margin-top: 10px; */
+ height: calc(100% - 42px);
+ width: 100%;
+}
+.custom-tree-node {
+ width: 100%;
+ /* line-height: 32px; */
+ font-size: 14px;
+}
+
+.node_i {
+ color: orange;
+ font-size: 18px;
+}
+
+.main_right {
+ height: calc(100% - 5px);
+ overflow: hidden;
+}
+>>>.el-tabs__content {
+ padding-top: 0;
}
</style>
--
Gitblit v1.9.3