1、设备管理页面设备种类字段改成重要程度字段；新增设备异常状态字段，若表格记录的设备状态不为正常时，则标红此表格记录 2、设备利用率、设备开动率、班次...

zhaowei

2024-09-13 65a5e8c7ec6d6eab78b76c5831eaf40c30e23c61

 src/views/mdc/common/BaseTree.vue

@@ -1,58 +1,64 @@
<template>
  <a-card class="tree_con" :loading="cardLoading" :bordered="false" >
  <a-card class="tree_con" :loading="cardLoading" :bordered="false">
    <a-spin :spinning="loading">
      <a-alert type="info" :showIcon="false" style="margin-right: 54px;padding-left: 5px">
        <div slot="message">
          <span v-if="this.currSelected.title">{{ getCurrSelectedTitle() }}</span>
          <a v-if="this.currSelected.title" style="margin-left: 10px" @click="onClearSelected">取消</a>
          <span v-else>无</span>
      <div style="display: flex;flex-direction: column;height: 100%">
        <div>
          <a-alert type="info" :showIcon="false" style="margin-right: 54px;padding-left: 5px">
            <div slot="message">
              <span v-if="this.currSelected.title">{{ getCurrSelectedTitle() }}</span>
              <a v-if="this.currSelected.title" style="margin-left: 10px" @click="onClearSelected">取消</a>
              <span v-else>无</span>
            </div>
          </a-alert>
          <div class="drawer-bottom-button">
            <a-dropdown :trigger="['click']" placement="bottomCenter">
              <a-menu slot="overlay">
                <a-menu-item key="1" @click="expandAll">展开所有</a-menu-item>
                <a-menu-item key="2" @click="closeAll">合并所有</a-menu-item>
                <a-menu-item key="3" @click="refreshTree">刷新</a-menu-item>
              </a-menu>
              <a-button>
                <a-icon type="bars"/>
              </a-button>
            </a-dropdown>
          </div>
        </div>
      </a-alert>
      <div class="drawer-bootom-button">
        <a-dropdown :trigger="['click']" placement="bottomCenter">
          <a-menu slot="overlay">
            <a-menu-item key="1" @click="expandAll">展开所有</a-menu-item>
            <a-menu-item key="2" @click="closeAll">合并所有</a-menu-item>
            <a-menu-item key="3" @click="refreshTree">刷新</a-menu-item>
          </a-menu>
          <a-button>
            <a-icon type="bars"/>
          </a-button>
        </a-dropdown>
      </div>
      <a-input-search @search="handleSearch" style="width:100%;margin-top: 10px" placeholder="检索 类别编码/名称" allowClear
                      v-model="searchInput" @change="handleChange"/>
      <!-- showLine -->
      <a-tree showLine ref="tree" :checkStrictly="checkStrictly" :expandedKeys.sync="expandedKeys"
              :selectedKeys="selectedKeys" :dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
              :treeData="treeDataSource"
              :autoExpandParent="autoExpandParent" @select="onSelect" @expand="onExpand" slots="{}">
        <template slot="title" slot-scope="{ title, parentId, entity, key}">
        <a-input-search @search="handleSearch" style="width:100%;margin-top: 10px" placeholder="检索 类别编码/名称" allowClear
                        v-model="searchInput" @change="handleChange"/>
        <!-- showLine -->
        <div style="flex: 1;overflow:auto;margin-top: 10px">
          <a-tree showLine ref="tree" :checkStrictly="checkStrictly" :expandedKeys.sync="expandedKeys"
                  :selectedKeys="selectedKeys" :dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
                  :treeData="treeDataSource"
                  :autoExpandParent="autoExpandParent" @select="onSelect" @expand="onExpand" slots="{}">
            <template slot="title" slot-scope="{ title, parentId, entity, key}">
          <span v-if="title.indexOf(searchValue) > -1">
            {{ title.substr(0, title.indexOf(searchValue)) }}
            <span class="replaceSearch">{{ searchValue }}</span>
            {{ title.substr(title.indexOf(searchValue) + searchValue.length) }}
          </span>
          <span v-else>{{ title }}</span>
          <a-dropdown v-if="!editDisable && entity.parentId == -1" :trigger="['click']" placement="bottomCenter">
            <a-menu slot="overlay">
              <a-menu-item>
                <a href="javascript:;" @click="handleEdit(entity)">编辑</a>
              </a-menu-item>
              <a-menu-item>
                <a href="javascript:;" @click="batchDel(entity)">
                  删除
                </a>
              </a-menu-item>
            </a-menu>
            <span :style="{position: 'absolute',right: 0}">
              <span v-else>{{ title }}</span>
              <a-dropdown v-if="!editDisable && entity.parentId == -1" :trigger="['click']" placement="bottomCenter">
                <a-menu slot="overlay">
                  <a-menu-item>
                    <a href="javascript:;" @click="handleEdit(entity)">编辑</a>
                  </a-menu-item>
                  <a-menu-item>
                    <a href="javascript:;" @click="batchDel(entity)">
                      删除
                    </a>
                  </a-menu-item>
                </a-menu>
                <span :style="{position: 'absolute',right: 0}">
              <a-icon type="down"/>
            </span>
          </a-dropdown>
        </template>
      </a-tree>
              </a-dropdown>
            </template>
          </a-tree>
        </div>
      </div>
    </a-spin>
    <tier-model ref="tierModalForm"  @ok="modalFormOk"></tier-model>
    <tier-model ref="tierModalForm" @ok="modalFormOk"></tier-model>
  </a-card>
</template>

@@ -64,7 +70,7 @@
  } from '@/api/manage'
  import Tooltip from 'ant-design-vue/es/tooltip'
  import TierModel from './modules/baseTree/TierModel'
  import {mapActions} from 'vuex'
  import { mapActions } from 'vuex'

  export default {
    name: 'BaseTree',
@@ -74,6 +80,10 @@
        default() {
          return true
        }
      },
      filterAbnormalDeviceKey: {
        type: String,
        default: ''
      }
    },
    components: {
@@ -99,7 +109,7 @@
        allTreeKeys: [],
        currSelected: {},
        hiding: false,
        mathChange:''
        mathChange: ''
      }
    }
    ,
@@ -112,21 +122,23 @@
      ...mapActions(['QueryProduction']),
      getCurrSelectedTitle() {
        return !this.currSelected.title ? '' : this.currSelected.title
      }
      ,
      },
      /**
       * 取消车间选中项
       */
      onClearSelected() {
        this.hiding = true
        this.currSelected = {}
        this.selectedKeys = []
        // console.log('发送')
        // this.$bus.$emit('treeClearSelected','重置列表')
        this.$emit('sendSelectBaseTree', '')
      },

      onSelect(selectedKeys, e) {
        this.hiding = false
        let record = e.node.dataRef
        this.currSelected = Object.assign({}, record)
        this.selectedKeys = [record.key]
        console.log(this.selectedKeys)
        this.$emit('sendSelectBaseTree', this.selectedKeys)
      },
      handleEdit(entity) {
@@ -141,16 +153,17 @@
      queryTreeData() {
        this.loading = true
        this.cardLoading = true
        this.QueryProduction().then(res => {
        this.QueryProduction(this.filterAbnormalDeviceKey).then(res => {
          if (res.success) {
            this.dataList = []
            this.allTreeKeys = []
            this.treeDataSource = res.result
            this.generateList(res.result)
            this.expandedKeys = this.allTreeKeys
          } else {
            this.$message.warn(res.message)
          }
        }).finally(() =>{
        }).finally(() => {
          this.loading = false
          this.cardLoading = false
        })
@@ -167,13 +180,12 @@
        //   this.loading = false
        //   this.cardLoading = false
        // })
      }
      ,
      },
      handleChange() {
        let search = this.searchInput
        let expandedKeys = this.dataList
          .map(item => {
            if(item.title !=null){
            if (item.title != null) {
              if (item.title.indexOf(search) > -1) {
                return this.getParentKey(item.key, this.treeDataSource)
              }
@@ -186,14 +198,13 @@
          searchValue: search,
          autoExpandParent: true
        })
      }
      ,
      },
      handleSearch(value) {
        let search = value
        let expandedKeys = this.dataList
          .map(item => {

            if(item.title !=null){
            if (item.title != null) {
              if (item.title.indexOf(search) > -1) {
                return this.getParentKey(item.key, this.treeDataSource)
              }
@@ -206,8 +217,7 @@
          searchValue: search,
          autoExpandParent: true
        })
      }
      ,
      },
      getParentKey(key, tree) {
        let parentKey
        for (let i = 0; i < tree.length; i++) {
@@ -223,7 +233,6 @@
        }
        return parentKey
      },

      generateList(data) {
        for (let i = 0; i < data.length; i++) {
          const node = data[i]
@@ -255,7 +264,11 @@
        }
        let ids = entity.id
        if (!ids) {
          this.$message.warning('请选择一条记录！')
          // this.$message.warning('请选择一条记录！')
          this.$notification.warning({
            message: '消息',
            description: '请选择一条记录'
          })
          return
        } else {
          var that = this
@@ -267,7 +280,7 @@
              deleteAction(that.url.deleteBatch, { ids: ids }).then((res) => {
                if (res.success) {
                  that.$message.success(res.message)
                  that.queryTreeData();
                  that.queryTreeData()
                } else {
                  that.$message.warning(res.message)
                }
@@ -279,19 +292,17 @@
        }
      },
      modalFormOk(val) {
        console.log("mmm")
        console.log('mmm')
        // 新增/修改 成功时，重载列表
        this.queryTreeData()
        // 新增/修改 成功时，重载列表
      }

    }
    ,
    },
    //监听
    watch: {
      currSelected(val) { //监听currSelected 变化，将变化后的数值传递给 getCurrSelected 事件
        this.$emit('getCurrSelected', val)
      },
      }
    }
  }
</script>
@@ -342,10 +353,6 @@
    overflow-y: hidden;
  }

  #app .desktop {
    height: auto !important;
  }

  /** Button按钮间距 */
  .ant-btn {
    margin-left: 3px;
@@ -355,7 +362,7 @@
    padding: 5px 15px 5px 37px;
  }

  .drawer-bootom-button {
  .drawer-bottom-button {
    position: absolute;
    top: 1px;
    /* padding: 10px 16px; */
@@ -364,34 +371,42 @@
    background: #fff;
    border-radius: 0 0 2px 2px;
  }
  @media screen and (min-width: 1920px){
    .tree_con{
      height: 748px!important;
      overflow: scroll;

  .tree_con {
    overflow: hidden;
  }

  @media screen and (min-width: 1920px) {
    .tree_con {
      height: 748px !important;
    }
  }
  @media screen and (min-width: 1680px) and (max-width: 1920px){
    .tree_con{
      height: 748px!important;
      overflow: scroll;

  @media screen and (min-width: 1680px) and (max-width: 1920px) {
    .tree_con {
      height: 748px !important;
    }
  }
  @media screen and (min-width: 1400px) and (max-width: 1680px){
    .tree_con{
      height: 600px!important;
      overflow: scroll;

  @media screen and (min-width: 1400px) and (max-width: 1680px) {
    .tree_con {
      height: 600px !important;
    }
  }
  @media screen and (min-width: 1280px) and (max-width: 1400px){
    .tree_con{
      height: 501px!important;
      overflow: scroll;

  @media screen and (min-width: 1280px) and (max-width: 1400px) {
    .tree_con {
      height: 501px !important;
    }
  }
  @media screen and (max-width: 1280px){
    .tree_con{
      height: 501px!important;
      overflow: scroll;

  @media screen and (max-width: 1280px) {
    .tree_con {
      height: 501px !important;
    }
  }

  /deep/ .ant-card-body, /deep/ .ant-spin-nested-loading, /deep/ .ant-spin-container {
    height: 100%;
  }
</style>