<template>
  <div id="deviceList" >
    <router-link to="/ledger/facility/addfacility"></router-link>
    <router-view></router-view>
    <saga-title :mess="mess"></saga-title>
    <div class="table-main">
      <div class="search-header">
        <floor-cascader @change="changeFloor"></floor-cascader>
        <my-cascader ref="cascader" @change="changeDevice"></my-cascader>
        <el-button size="small" @click="handleLinkAssets" class="iconfont icon-batchassociation">批量关联资产</el-button>
      </div>
      <hanson-table @close="close" :graphyId="graphyId" ref="tableMain"></hanson-table>
    </div>
    <!-- <table-transfers></table-transfers> -->
    <linkassets-dialog :dialog="dialog"></linkassets-dialog>
  </div>
</template>
<script>
import sagaTitle from "@/components/ledger/lib/title";
import floorCascader from "@/components/ledger/lib/floorCascader";
import myCascader from "@/components/ledger/lib/cascader";
import hansonTable from "@/components/ledger/handsontables/device";
import tableTransfers from "@/components/ledger/tableTransfers";
import linkassetsDialog from "@/components/ledger/lib/linkassets";
import {
  getSpaceName,
  getGraphyId,
  getEquipmentFamily,
  countEquip
} from "@/api/scan/request"
import {
  mapGetters,
  mapActions
} from "vuex";
export default {
  components: {
    sagaTitle,
    floorCascader,
    myCascader,
    hansonTable,
    tableTransfers,
    linkassetsDialog
  },
  data() {
    return {
      mess: {
        perjectName: "",
        name: [
          {
            key: "设备",
            num: 0
          },
          {
            key: "资产",
            num: 0
          }
        ]
      },
      param: {
        buildId: "",
        floorId: "",
        deviceId: "",
        ProjId: "",
        secret: ""
      },
      assetGroupList: [],
      graphyId: null,
      dialog: {
        linkAssets: false
      }
    };
  },
  computed: {
    ...mapGetters("layout", [ "projectId", "projects", "secret", "userId" ])
  },
  created() {
    this.param.ProjId = this.projectId
    this.param.secret = this.secret
    this.getProjName()
    this.getCount()
    let deviceId = this.$route.params.deviceId;
    if (deviceId) {
      this.$nextTick(() => {
        this.$refs.cascader.setValue(deviceId)
      })
    }
  },
  watch: {
    projectId() {
      this.param.ProjId = this.projectId
      this.param.secret = this.secret
      this.getProjName()
      this.getCount()
    }
  },
  methods: {
    getProjName() {
      this.projects.forEach((item) => {
        if(item.id == this.projectId)
        this.mess.perjectName = item.name
      })
      // this.getEqCode()
    },
    close(val) {
      this.getCount()
      if (val && this.$refs.cascader){
        this.$refs.cascader.changeVal(val.code)
      }
        this.$refs.cascader.getData()
      //   this.$refs.tableMain.getHeaderData(this.param);
    },
    // getEqCode() {
    //   getEquipmentFamily(res => {
    //     debugger
    //     this.assetGroupList = res.Content
    //     this.getGraphyId()
    //   })
    // },
    //获取统计数量
    getCount() {
      let param = {
        Filters: "not PropertyId isNull"
      }
      countEquip({}, res => {
        this.mess.name[0].num = res.Count
      })
      countEquip(param, res => {
        this.mess.name[1].num = res.Count
      })
    },
    // getGraphyId() {
    //   let param = {
    //     ProjId: this.param.ProjId,
    //     secret: this.param.secret,
    //     type: "SystemEquip"
    //   }
    //   getGraphyId(param).then(res => {
    //     if (res.data.Result == "success") {
    //       debugger
    //       this.graphyId = res.data.graph_id
    //       if (this.$refs.tableMain)
    //         this.$refs.tableMain.setGraphyId(this.graphyId, this.assetGroupList);
    //     } else {
    //       this.$message.error("请求错误：" + res.data.ResultMsg)
    //     }
    //   }).catch(_ => {
    //     this.$message.error("请求错误")
    //   })
    // },
    //修改楼层
    changeFloor(value) {
      if (value[0]) {
        this.param.buildId = value[0]
      }
      if (value[1]) {
        this.param.floorId = value[1]
      } else {
        this.param.floorId = null
      }
      if (!!this.param.deviceId) {
        if (this.$refs.tableMain)
          this.$refs.tableMain.getHeaderData(this.param);
      }
    },

    //修改设备族
    changeDevice(value) {
      if (value.code && value.facility) {
        this.param.deviceId = value.code
        this.param.name = value.facility
        if (this.$refs.tableMain)
          this.$refs.tableMain.getHeaderData(this.param);
      }
    },
    // 批量关联资产
    handleLinkAssets() {
      this.dialog.linkAssets = true
    }
  }
};
</script>
<style lang="less" scoped>
#deviceList {
  overflow: hidden;
  height: 100%;
  background-color: #fff;
  position: relative;
  .table-main {
    position: absolute;
    top: 87px;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    // border-radius: 5px;
    // padding: 10px 0;
  }
  .search-header {
    overflow: hidden;
    padding-bottom: 10px;
    margin: 0 10px;
    border-bottom: 1px solid #bcbcbc;
    .icon-batchassociation{
      float: right;
      font-size: 12px;
      /deep/ span{
        margin-left: 5px;
      }
    }
  }
}
</style>
