<template>
  <div id="buildFloor">
    <span class="buildFloor">所属建筑楼层：</span>
    <el-cascader
      placeholder="请选择建筑楼层"
      :options="options"
      v-model="value"
      filterable
      size="small"
      :style="isWidth ? '' : 'width:160px;'"
      @change="changeCascader"
    ></el-cascader>
  </div>
</template>
<script>

import { getSpaceFloor } from '@/api/request'

export default {
  props: {
    isWidth: {
      type: Boolean,
      default: true
    },
    type: {
      type: String,
      default: "yes"
    }
  },
  data() {
    return {
      options: [
      ],
      param: {
        ProjId: this.$route.query.projId,
        secret: this.$route.query.secret
      },
      value: ['all']
    };
  },
  created() {
    this.getData()
  },
  mounted() { },
  methods: {
    //获取数据
    getData() {
      getSpaceFloor(this.param).then(res => {
        if (res.data.Result == 'success') {
          let data = this.changeArr(res.data.Content)
          data.unshift({
            value: "all",
            label: "全部"
          }, {
              value: "noKnow",
              label: "未明确建筑的设备"
            })
          data.map(item => {
            if (!!item.children) {
              item.children.unshift({
                value: 'noKnow',
                label: "未明确楼层的设备"
              })
              item.children.unshift({
                value: "all",
                label: "全部"
              })
            }
            return item
          })
          this.options = data
        } else {
          this.$message.error(res.data.ResultMsg)
        }
      }).catch(() => {
        this.$message.error("请求出错")
      })
    },
    //将数组转换成optiosn格式
    changeArr(arr) {
      return arr.map(item => {
        if (item.floors && item.floors.length && this.type == "yes") {
          return {
            value: item.id,
            label: item.infos.BuildLocalName,
            children: item.floors.map(i => {
              return {
                value: i.id,
                label: i.infos.FloorLocalName,
              }
            })
          }
        } else {
          return {
            value: item.id,
            label: item.infos.BuildLocalName,
            children: null,
            isChilren: 1,
          }
        }
      })
    },

    //改变item
    changeCascader(value) {
      this.$emit("change", value)
    }
  }
};
</script>
<style lang="less" scoped>
#buildFloor {
  float: left;
  .buildFloor {
    color: #999999;
    font-size: 14px;
  }
}
</style>
