<!--
 * @Descripttion: 
 * @version: 
 * @Author: JC9527
 * @Date: 2023-09-27 14:01:34
 * @LastEditors: 张涛
 * @LastEditTime: 2023-10-20 09:23:51
-->
<template>
  <div>
    <el-cascader
      size="small"
      v-model="district"
      :options="compartment"
      :show-all-levels="false"
      :disabled="isNoneDivision"
      :props="props"
      @change="getData"
    ></el-cascader>
  </div>
</template>
<script>
import { mapState } from "vuex";
export default {
  data() {
    return {
      //区划的禁用
      district: "",
      compartment: [],
      isNoneDivision: false,
      props: {
        checkStrictly: true,
        value: "value",
        label: "label",
        children: "children",
      },
    };
  },
  created() {
    this.treeList();
  },
  computed: {
    ...mapState({
      //根据存储的dept.parentId判断是哪个等级
      dept: (state) => state.user.dept,
    }),
  },
  props: {
    none: {
      type: Boolean,
      default: false,
    },
  },
  methods: {
    onClear(){
      this.district = ""
    },
    treeList() {
      if (this.dept.parentId == 0 || this.dept.leader == "admin") {
        let treeData = JSON.parse(localStorage.getItem("TREE_DATA"));
        // console.log(treeData);
        treeData.forEach((value, index) => {
          this.compartment.push({
            value: value.districtCode,
            label: value.district,
            children: [],
          });
          if (value.children.length > 0) {
            value.children.forEach((value1, index1) => {
              this.compartment[index].children.push({
                value: value1.countyCode,
                label: value1.county,
              });
            });
          }
        });
      }
      this.$emit("quhuadizhi", this.compartment);
    },
    getData(e) {
      if (!this.none) {
        if (e.length == 1) {
          this.$emit("quhua", e[0].slice(0, 7));
        } else if (e.length == 2 && e[0] == e[1]) {
          this.$emit("quhua", e[0].slice(0, 7));
        } else {
          this.$emit("quhua", e[1].slice(0, 10));
        }
      } else {
        if (e.length == 1) {
          this.$emit("quhua", e[0]);
        } else if (e.length == 2 && e[0] == e[1]) {
          this.$emit("quhua", e[0]);
        } else {
          this.$emit("quhua", e[1]);
        }
      }
    },
  },
};
</script>
<style lang="scss" scoped>
::v-deep .el-cascader {
  background-color: transparent;
  width: 210px;
  .el-input__inner {
    height: 33px;
  }
  .el-input
    .el-input__suffix
    .el-input__suffix-inner
    .el-icon-arrow-down::before {
    content: "";
    background: url(../../../assets/images/down2.png) center center no-repeat;
    background-size: cover;
    position: absolute;
    width: 10px;
    height: 7px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}
</style>
