import {
   getArea
 } from '../../api/index'
 Component({
   properties: {
     // placeholder为选择器的默认提示文字
     placeholder: {
       type: String,
       value: '请选择省市地区',
     },
     // value为选择器的默认值，类型为数组
     value: {
       type: Array,
       value: [],
       // observer监听value的变化，如果有值则调用setLabel方法设置选择器的label
       observer(selectedValues) {
         if (selectedValues && selectedValues.length) {
           this.resetValus(selectedValues)
           this.setLabel();
         }
       }
     }
   },
   data: {
     // label为选择器的显示值
     label: '',
     // range为选择器的可选项，类型为数组，包含三个数组，分别为省、市、区/县
     range: [],
     // pickerValue为选择器的选中值，类型为数组，包含三个数字，分别为省、市、区/县的下标
     pickerValue: [],
     // addressList为选择器的数据源，类型为数组，包含省、市、区/县的信息
     addressList: [],
   },
   // attached生命周期函数，在组件实例进入页面节点树时执行
   attached() {
     this.initData()
   },

   methods: {
     initData() {
       let list = wx.getStorageSync('addressList') || []
       if (list && list.length) {
         this.setData({
           addressList: list
         })
         this.resetValus(list)
         this.setLabel();
         if (!this.data.value.length) {
           this.initRange();
         }
       } else {
         getArea({
           "level": "",
           "pid": ""
         }).then(res => {
           var tl = []
           if (res && res.data && res.data.length) {
             res.data.forEach(element => {
               let tc = []
               if (element.children && element.children.length) {
                 element.children.forEach(c => {
                   let ta = []
                   if (c.children && c.children.length) {
                     c.children.forEach(a => {
                       ta.push({
                         label: a.name,
                         value: a.id,
                         regionLevel: '3',
                         parentRegionCode: c.id
                       })
                     })
                   }
                   tc.push({
                     label: c.name,
                     value: c.id,
                     regionLevel: "2",
                     children: ta,
                     parentRegionCode: element.id
                   })
                 })
               }
               tl.push({
                 label: element.name,
                 value: element.id,
                 regionLevel: "1",
                 children: tc,
                 parentRegionCode: "0"
               })
             });
           }
           wx.setStorageSync('addressList', tl)
           this.setData({
             addressList: tl
           })
           this.resetValus()
           this.setLabel();
           if (!this.data.value.length) {
             this.initRange();
           }
         })
       }
     },
     resetValus(selectedValues) {
       selectedValues = selectedValues || this.data.value
       let temVal = []
       let tlable = ''
       if (selectedValues.length == 3) {
         var v1 = selectedValues[0]
         var v2 = selectedValues[1]
         var v3 = selectedValues[2]
         var t1, t2, t3;
         this.data.addressList.forEach(item => {
           if (v1 && v1.length == 6 &&
             v2 && v2.length == 6 &&
             v3 && v3.length == 6) {
             if (item.value.indexOf(v1) == 0) {
               t1 = item.value
               if (item.children) {
                 item.children.forEach(item2 => {
                   if (item2.value.indexOf(v2) == 0) {
                     if (item2.children) {
                       item2.children.forEach(item3 => {
                         if (item3.value.indexOf(v3) == 0) {
                           tlable = item.label + "-" + item2.label + '-' + item3.label
                           t1 = item.value
                           t2 = item2.value
                           t3 = item3.value
                           temVal = [t1, t2, t3]
                           // this.value = temVal
                           // this.data.label=tlable
                           this.triggerEvent("change", {
                             value: temVal,
                             label: tlable
                           });
                           this.setData({
                             value: temVal,
                             label: tlable
                           })
                         }
                       })
                     }
                   }
                 })
               }
             }
           }
         })
       }
     },
     // getAddressItem方法用于将地址信息转换为选择器可用的格式
     getAddressItem(data) {
       return {
         label: data.label,
         value: data.value
       };
     },
     // setAddressList方法用于将地址列表转换为选择器可用的格式
     setAddressList(list) {
       return list.map((v) => this.getAddressItem(v));
     },
     // getAddressByCode方法用于根据value值获取地址信息及其在数组中的下标
     getAddressByCode(list = [], value) {
       let index = list.findIndex(item => item.value === value);
       return [index, list[index] || {}];
     },
     // openChildren方法用于根据value值打开下一级选择器
     openChildren(list, keys) {
       let result = [];
       const handle = (arr, keys) => {
         let newarr = arr.map((v, index) => {
           if (keys && keys.length) {
             let [currentKey, ...nextKey] = keys;
             if (currentKey === index && Array.isArray(v.children)) {
               handle(v.children, nextKey);
             }
           }
           return this.getAddressItem(v);
         });
         result.push(newarr);
       }
       handle(list, keys);
       return result.reverse();
     },
     // onChange方法为选择器的change事件处理函数，用于设置label和触发change事件
     onChange(e) {
       let [r1, r2, r3] = this.data.range;
       const [v1, v2, v3] = e.detail.value;
       const selected = [r1[v1], r2[v2], r3[v3]];
       const values = selected.map(v => v.value);
       const label = selected.map(v => v.label).join('-');

       this.triggerEvent("change", {
         value: values,
         label: label
       });
       this.setData({
         label: label
       });
     },
     // columnChange方法为选择器的columnchange事件处理函数，用于设置range和pickerValue
     columnChange(e) {
       const {
         column,
         value
       } = e.detail;
       this.setColumn(column, value);
     },
     // setColumn方法用于设置range和pickerValue
     setColumn(column, value) {
       let addressList = this.data.addressList;
       if (!addressList || addressList.length === 0) return;
       let [r1, r2, r3] = this.data.range;
       if (column === 0) {
         r2 = this.setAddressList(addressList[value].children);
         r3 = this.setAddressList(addressList[value].children[0].children);
         this.setData({
           pickerValue: [value, 0, 0]
         });
       } else if (column === 1) {
         const [v1] = this.data.pickerValue;
         r3 = this.setAddressList(addressList[v1].children[value].children);
         this.setData({
           pickerValue: [v1, value, 0]
         });
       }
       this.setData({
         range: [r1, r2, r3]
       });
     },
     // setLabel方法用于设置label
     setLabel() {
       let addressList = this.data.addressList;
       if (addressList && addressList.length) {
         const [v1, v2, v3] = this.data.value;
         const [s1, {
           label: t1,
           children: l1
         }] = this.getAddressByCode(addressList, v1);
         const [s2, {
           label: t2,
           children: l2
         }] = this.getAddressByCode(l1, v2);
         const [s3, {
           label: t3
         }] = this.getAddressByCode(l2, v3);
         const label = [t1, t2, t3].filter(v => v).join('-');

         const pickerValue = [s1, s2, s3];
         const range = this.openChildren(addressList, [s1, s2, s3]);
         if (label.length) {
           this.setData({
             label,
             range,
             pickerValue
           });
         }
       }
     },
     // initRange方法用于初始化range
     initRange() {
       if (!this.data.value.length) {
         const range = this.openChildren(this.data.addressList, [0, 0, 0]);
         this.setData({
           range
         });
       }
     },

   },
 });