<!--
 * @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="treeData"
      :show-all-levels="false"
      :disabled="isNoneDivision"
      :props="props"
      @change="onChange"
      v-if="isShow"
    ></el-cascader>
    <el-input v-model="text" placeholder="" :disabled="!isShow" v-else />
  </div>
</template>
<script>
import { mapState } from "vuex";
export default {
  data() {
    return {
      //区划的禁用
      district: "",
      treeData: [],
      text: null,
      compartment: [], // 整理后
      isShow: true,
      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() {
      let treeData = JSON.parse(localStorage.getItem("TREE_DATA"));
      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,
            });
          });
        }
      });

      let userInfo = JSON.parse(sessionStorage.getItem("USER_INFO"));
      // console.log(userInfo.lawLevel);
      // 市级
      if (userInfo.lawLevel == "市级") {
        this.treeData = this.compartment;
      }
      // 县级
      else if (userInfo.lawLevel == "县级") {
        this.district = userInfo.permissionCode;
        this.treeData = this.compartment.filter(
          (item) => item.value === this.district
        );
      }
      // 镇级
      else if (userInfo.lawLevel == "镇级") {
        this.isShow = false;
        this.text = userInfo.permissionDescription;
      } else {
        this.treeData = this.compartment;
      }

      // this.district = "320582403"
      // console.log(JSON.stringify(this.compartment));
      this.$emit("quhuadizhi", this.compartment);
    },
    onChange(e) {
      console.log(e);
      console.log(e[e.length - 1]);
      this.$emit("quhua",e[e.length - 1]);
      this.$emit("change",e[e.length - 1]);
      // 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>
