Merge remote-tracking branch 'origin/master'

cuilei

5 天以前 ba77fdc6a30c9ad0941e40319f8c4f6fe6fdf9f1

 src/views/system/modules/SelectDeviceModal.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,252 @@
<template>
  <a-modal
    :title="title"
    :visible="visible"
    @ok="handleOk"
    @cancel="handleCancel"
  >

    <a-spin :spinning="loading">
      <!-- showLine -->
      <a-form>
        <a-form-item label="车间层级：">
          <a-tree showLine ref="tree" :expandedKeys.sync="expandedKeys"
                  :treeData="treeDataSource" checkable @check="onCheck" v-model="checkedKeys"
                  @expand="onExpand">
          </a-tree>
        </a-form-item>
      </a-form>

    </a-spin>

    <template slot="footer">
      <div>
        <a-dropdown
          style="float: left"
          :trigger="['click']"
          placement="topCenter"
        >
          <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="up"/>
          </a-button>
        </a-dropdown>
        <a-popconfirm title="确定放弃编辑？" @confirm="handleCancel" okText="确定" cancelText="取消">
          <a-button style="margin-right: .8rem">关闭</a-button>
        </a-popconfirm>
        <a-button
          @click="handleOk"
          type="primary"
        >确定
        </a-button>
      </div>
    </template>

  </a-modal>
</template>

<script>
  import {
    getAction,
    postAction,
    deleteAction
  } from '@/api/manage'
  import BaseTree from '@/views/mdc/common/BaseTree'
  import DepartTree from '@/views/mdc/base/modules/DepartList/DepartListTree/DepartTree'
  import { getSystemConfigValue } from '@api/api'

  export default {
    name: 'SelectDeviceModal',
    components: {
      BaseTree, DepartTree
    },
    props: {
      editDisable: {
        type: Boolean,
        default() {
          return true
        }
      },
      title: {
        type: String
      },
      selectedProduction: {
        type: String
      }
    },
    data() {
      return {
        loading: false,
        treeDataSource: [],
        expandedKeys: [],
        checkedKeys: [],
        url: {
          getDeviceTree: '/mdc/mdcEquipment/loadTreeListByProductionIds',
          getEquipmentTree: '/eam/equipment/loadTreeListByProductionIds',
        },
        selectedWorkshopIds: '',
        dataList: [],
        allTreeKeys: [],
        visible: false,
        dataSource: [],
        //系统是否实施设备管理模块
        eamModuleFlag: false,
      }
    },
    created() {
      // this.loadEamSystemConfigValue();
      this.closeAll()
    },
    methods: {
      onExpand(expandedKeys) {
        this.expandedKeys = expandedKeys
        this.autoExpandParent = false
      },
      queryTreeData(value) {
        this.loading = true
        this.selectedWorkshopIds = value
        let url = '';
        if(this.eamModuleFlag) {
          //加载设备管理的树结构
          url = this.url.getEquipmentTree
        }else {
          //加载MDC的树结构
          url = this.url.getDeviceTree
        }
        getAction(url, { ids: value })
          .then(res => {
            if (res.success) {
              this.dataList = []
              this.allTreeKeys = []
              this.getTreeDataSouce(res.result)
              this.treeDataSource = res.result
              this.generateList(this.treeDataSource)
              this.expandedKeys = this.allTreeKeys
            } else {
              this.$notification.warning({
                message: '消息',
                description: res.message
              })
            }
          })
          .catch(err => {
            this.$notification.error({
              message: '消息',
              description: err.message
            })
          })
          .finally(() => {
            this.loading = false
          })
      },

      generateList(data) {
        for (let i = 0; i < data.length; i++) {
          const node = data[i]
          const key = node.key
          const title = node.title
          this.dataList.push({
            key,
            title: title
          })
          this.allTreeKeys.push(key)
          if (node.children) {
            this.generateList(node.children)
          }
        }
      },

      getTreeDataSouce(data) {
        data.forEach(item => {
          if (item.children && item.children.length > 0) {
            this.getTreeDataSouce(item.children)
          }
          item.key = item.equipmentId ? item.equipmentId : item.key
          item.value = item.equipmentId ? item.equipmentId : item.value
        })
      },
      expandAll() {
        this.expandedKeys = this.allTreeKeys
      },
      closeAll() {
        this.expandedKeys = ['-1']
      },
      refreshTree() {
        this.queryTreeData(this.selectedWorkshopIds)
      },
      onCheck(value, obj) {
        this.checkedKeys = value
        this.deviceNodes = obj.checkedNodes.filter(item => item.data.props.equipmentId).map(item => item.data.props.equipmentId)
      },
      handleCancel() {
        this.visible = false
      },
      handleOk() {
        this.$emit('selectFinished', this.deviceNodes)
        this.visible = false
      },
      // loadEamSystemConfigValue() {
      //   let params = {settingKey: 'has_eam_module'};
      //   getSystemConfigValue(params).then(res => {
      //     if (res.success) {
      //       this.eamModuleFlag = res.result.settingValue === '1'
      //     }
      //   })
      // },

    }
  }
</script>
<style lang="less" scoped>
  /deep/ .ant-modal {
    /*transform-origin: 337px 50px;*/
  }

  .ant-card-body .table-operator {
    margin-bottom: 18px;
  }

  .ant-table-tbody .ant-table-row td {
    padding-top: 15px;
    padding-bottom: 15px;
  }

  .anty-row-operator button {
    margin: 0 5px
  }

  .ant-btn-danger {
    background-color: #ffffff
  }

  .ant-modal-cust-warp {
    height: 100%
  }

  .ant-modal-cust-warp .ant-modal-body {
    height: calc(100% - 110px) !important;
    overflow-y: auto
  }

  .ant-modal-cust-warp .ant-modal-content {
    height: 90% !important;
    overflow-y: hidden
  }

  .drawer-bottom-button {
    position: absolute;
    bottom: 0;
    width: 100%;
    border-top: 1px solid #e8e8e8;
    padding: 10px 16px;
    text-align: right;
    left: 0;
    background: #fff;
    border-radius: 0 0 2px 2px;
  }
</style>