emis-frontend/src/views/emis/EmisBaseTools/backup/RegionPcdCasPicker.vue

<template>
    <el-cascader
      :size="size"
      :props="props"
      :key="resetCascader"
      @change="handleChange"
      v-model="svalue"
      style="width: 100%"
      clearable
      filterable
    ></el-cascader>
</template>
<script>

import { listEmisRegion } from "@/api/emis/emisRegion";
export default {
  name: "RegionPcdCasPicker",
  props: {
      value: {
        type: [String, Number],
        required: false
      },
      countryCode: {
        type: String,
        required: false
      },
      size:{
        type: String,
        required: false
      },
      regionType:{
        type: Number,
        required: false
      }

  },
  data() {
    return {
      resetCascader:0,
      svalue: this.value,
      props: {
        // checkStrictly: true,
        lazy: false,
        lazyLoad: (node, resolve) => {
          // const { level } = node;
          const nodes = [];
          // level: 层级
          // node 节点数据
          // 一级菜单数据

          // 为1代表第一次请求
          // let type = level == 0 ? "1" : node.value;
          // let parentCode = node.value;

          this.queryRegion(node.level,node.value)
            .then((res) => {
              if (res.code != 200) {
                // this.msgFn("error", res.message);
                return;
              }
              // 节点数组
              res.rows.map((item) => {
                // {value:'',label:'全部'}
                let obj = {
                  value: item.regionCode,
                  label: item.regionName,
                  leaf: this.regionType==2?true:this.regionType==3? node.level >= 1:false,
                };
                nodes.push(obj);
              });
              // resolve 节点返回
              resolve(nodes);
            })
            .catch((error) => {
              console.log(error);
            });
        },
      },
    };
  },
  watch: {
      value(newVal) {
        this.svalue = newVal;
      },
      svalue(newVal, oldVal) {
        if (newVal !== oldVal) {
          this.$emit("input", this.svalue);
        }
      },
      countryCode(newVal) {
        this.queryRegion(0,0);
        this.resetCascader++
      }
  },
  created() {
    this.queryRegion(0,0);
  },
  methods: {
    // 获取省市区
    async queryRegion(level,parentCode) {

      if(this.countryCode == null  || this.countryCode==''){
        let res = {'regionCode':'0','regionName':'无父级'}
         return res;
      }

      if(this.regionType==1){
         let res = {'regionCode':'0','regionName':'无父级'}
         return res;
      };

      if(this.regionType==2){
        let queryParams = {countryCode:this.countryCode,regionType:1};
        let res=await listEmisRegion(queryParams);
        return res;
      }

      if(this.regionType==3){
        if(level==0){
          let queryParams = {countryCode:this.countryCode,regionType:1};
          let res=await listEmisRegion(queryParams);
          return res;
        }else{
          let queryParams = {parentCode:parentCode};
          let res=await listEmisRegion(queryParams);
          return res;
        }
      }

    },
    handleChange(value) {
      console.log(value);
    },
  },
};
</script>
<style lang="scss" scoped>
.con {
  display: inline-block;
}

.el-radio__inner {
    border-radius: 0;
    border: 0;
    width: 170px;
    height: 34px;
    background-color: transparent;
    cursor: pointer;
    box-sizing: border-box;
    position: absolute;
    top: -18px;
    left: -19px;
}

.el-radio__input.is-checked .el-radio__inner {
    background: transparent;
}

</style>