<template>
  <div id="">
    <a-select
      v-model:value="value"
      placeholder="请选择"
      size="small"
      :filter-option="false"
      @search="filterMethod"
      @change="chooseChange">
      <a-select-option v-for="item in searchDataList" :key="item.id" :value="item.id">
        <span style="float: left">{{ item.pnm }}</span>
        <span style="float: right; color: #8492a6; font-size: 13px" v-if="item.id.length == 6">督查机构</span>
        <span style="float: right; color: #8492a6; font-size: 13px" v-if="item.id.length == 9">督查批次</span>
        <span style="float: right; color: #8492a6; font-size: 13px" v-if="item.id.length == 12">督查组</span>
      </a-select-option>
    </a-select>
  </div>
</template>

<script>
import { getVillageList_ny, submitInsertCun } from '../api/duChaTianBao.js';
import request from '../utils/gw_ajax_request.js';
import inuptWithXiang from './inuptWithXiang.vue';
export default {
  props: ['rootCode', 'initalValue', 'orgType'],
  components: {
    inuptWithXiang: inuptWithXiang,
  },
  data() {
    return {
      dataList: [],
      value: '',
      dialogVisible: false,
      searchDataList: [],
      timeout: null,
      xianlistData: [],
      newCunForm: {
        adAbbrName: '',
        adFcode: '',
        adFullName: '',
        adName: '',
      },
    };
  },
  computed: {
    userId: () =>
      localStorage.getItem('persId')
        ? localStorage.getItem('persId')
        : '1098101939614724096',
  },
  mounted() {
    this.value = this.initalValue;
    console.log(this.value);
    this.getLeftTreeData();
  },
  watch: {
    rootCode: function () {
      this.querySearchAsync();
    },
    initalValue: function () {
      this.value = this.initalValue;
      console.log(this.value);
      this.querySearchAsync();
    },
  },
  methods: {
    getLeftTreeData() {
      request
        .get('/dc/organization/base/getAllNode', {
          params: { userId: this.userId, orgType: this.orgType },
        })
        .then((res) => {
          const data = res.data;
          console.log(data);
          this.searchDataList = data;
          // _self.duChaType = _self.treeData[0].id.substring(2,3);
        });
    },
    provTreeSelectChangeHandler: function (params) {
      console.log(params);
      this.newCunForm.adFcode = params.code;
    },
    chooseChange: function (p) {
      console.log(p);
      this.searchDataList.forEach((element) => {
        if (element.id == p) {
          console.log(element);
          this.$emit('selectDuChaTreeNode', {
            code: element.id,
            name: element.pnm,
          });
        }
      });
    },
    filterMethod: function (text) {
      console.log(text);
      this.value = text;
      request
        .get('/dc/organization/base/getAllNode', {
          params: { userId: this.userId, orgType: '001' },
        })
        .then((res) => {
          const data = res.data;
          console.log(data);
          const filterResult = [];
          data.forEach((element) => {
            if (element.pnm.indexOf(text) >= 0) {
              filterResult.push(element);
            }
          });
          this.searchDataList = filterResult;
          // _self.duChaType = _self.treeData[0].id.substring(2,3);
        });
    },
  },
};
</script>

<style lang="less" scoped>

</style>
