{"version":3,"sources":["webpack:///./src/views/components/TreeSelect.vue","webpack:///src/views/components/TreeSelect.vue","webpack:///./src/views/components/TreeSelect.vue?2689","webpack:///./src/views/components/TreeSelect.vue?86c7","webpack:///./src/views/components/TreeSelect.vue?0670"],"names":["render","_vm","this","_c","_self","attrs","valueTitle","clearable","on","clearHandle","staticClass","ref","accordion","options","props","value","defaultExpandedKey","handleNodeClick","staticRenderFns","name","type","Object","default","label","children","Array","String","Boolean","data","valueId","watch","initHandle","mounted","methods","$refs","selectTree","getNode","setCurrentKey","initScroll","$nextTick","scrollWrap","document","querySelectorAll","scrollBar","style","cssText","forEach","ele","width","node","$emit","clearSelected","allNode","element","classList","remove","component"],"mappings":"gJAAA,IAAIA,EAAS,WAAkB,IAAIC,EAAIC,KAAKC,EAAGF,EAAIG,MAAMD,GAAG,OAAOA,EAAG,YAAY,CAACE,MAAM,CAAC,MAAQJ,EAAIK,WAAW,UAAYL,EAAIM,WAAWC,GAAG,CAAC,MAAQP,EAAIQ,cAAc,CAACN,EAAG,YAAY,CAACO,YAAY,UAAUL,MAAM,CAAC,MAAQJ,EAAIK,WAAW,MAAQL,EAAIK,aAAa,CAACH,EAAG,UAAU,CAACQ,IAAI,aAAaN,MAAM,CAAC,GAAK,cAAc,UAAYJ,EAAIW,UAAU,KAAOX,EAAIY,QAAQ,MAAQZ,EAAIa,MAAM,WAAWb,EAAIa,MAAMC,MAAM,wBAAwBd,EAAIe,oBAAoBR,GAAG,CAAC,aAAaP,EAAIgB,oBAAoB,IAAI,IAErfC,EAAkB,GCgBP,G,oBAAA,CACfC,KAAA,aACAL,MAAA,CAEAA,MAAA,CACAM,KAAAC,OACAC,aAAA,CACAP,MAAA,KACAQ,MAAA,QACAC,SAAA,cAKAX,QAAA,CAAAO,KAAAK,MAAAH,YAAA,IAGAP,MAAA,CAAAK,KAAAM,OAAAJ,QAAA,MAGAf,UAAA,CAAAa,KAAAO,QAAAL,SAAA,GAGAV,UAAA,CAAAQ,KAAAO,QAAAL,SAAA,IAEAM,OACA,OACAC,QAAA,KACAvB,WAAA,GACAU,mBAAA,KAIAc,MAAA,CACAf,QACA,KAAAc,QAAA,KAAAd,MACA,KAAAgB,eAGAC,UACA,KAAAH,QAAA,KAAAd,MACA,KAAAgB,cAEAE,QAAA,CAEAF,aACA,KAAAF,SACA,KAAAvB,WAAA,KAAA4B,MAAAC,WAAAC,QAAA,KAAAP,SAAAD,KAAA,KAAAd,MAAAS,OACA,KAAAW,MAAAC,WAAAE,cAAA,KAAAR,SACA,KAAAb,mBAAA,MAAAa,UAEA,KAAApB,cAEA,KAAA6B,cAIAA,aACA,KAAAC,UAAA,KACA,MAAAC,EAAAC,SAAAC,iBAAA,8CACAC,EAAAF,SAAAC,iBAAA,oCACAF,EAAAI,MAAAC,QAAA,mDACAF,EAAAG,QAAAC,KAAAH,MAAAI,MAAA,MAKA/B,gBAAAgC,GACA,KAAA3C,WAAA2C,EAAA,KAAAnC,MAAAS,OACA,KAAAM,QAAAoB,EAAA,KAAAnC,MAAAC,OACA,KAAAmC,MAAA,gBAAArB,SACA,KAAAb,mBAAA,IAIAP,cACA,KAAAH,WAAA,GACA,KAAAuB,QAAA,KACA,KAAAb,mBAAA,GACA,KAAAmC,gBACA,KAAAD,MAAA,kBAIAC,gBACA,MAAAC,EAAAX,SAAAC,iBAAA,8BACAU,EAAAN,QAAAO,KAAAC,UAAAC,OAAA,mBCxGkW,I,wBCQ9VC,EAAY,eACd,EACAxD,EACAkB,GACA,EACA,KACA,WACA,MAIa,aAAAsC,E,2CCnBf","file":"js/chunk-2edbc428.b2abbf45.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('el-select',{attrs:{\"value\":_vm.valueTitle,\"clearable\":_vm.clearable},on:{\"clear\":_vm.clearHandle}},[_c('el-option',{staticClass:\"options\",attrs:{\"value\":_vm.valueTitle,\"label\":_vm.valueTitle}},[_c('el-tree',{ref:\"selectTree\",attrs:{\"id\":\"tree-option\",\"accordion\":_vm.accordion,\"data\":_vm.options,\"props\":_vm.props,\"node-key\":_vm.props.value,\"default-expanded-keys\":_vm.defaultExpandedKey},on:{\"node-click\":_vm.handleNodeClick}})],1)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <el-select :value=\"valueTitle\" :clearable=\"clearable\" @clear=\"clearHandle\">\n    <el-option :value=\"valueTitle\" :label=\"valueTitle\" class=\"options\">\n      <el-tree\n        id=\"tree-option\"\n        ref=\"selectTree\"\n        :accordion=\"accordion\"\n        :data=\"options\"\n        :props=\"props\"\n        :node-key=\"props.value\"\n        :default-expanded-keys=\"defaultExpandedKey\"\n        @node-click=\"handleNodeClick\"\n      />\n    </el-option>\n  </el-select>\n</template>\n\n<script>\nexport default {\n  name: 'TreeSelect',\n  props: {\n    // 配置项\n    props: {\n      type: Object,\n      default: () => ({\n        value: 'id', // ID字段名\n        label: 'title', // 显示名称\n        children: 'children' // 子级字段名\n      })\n    },\n\n    // 选项列表数据(树形结构的对象数组)\n    options: { type: Array, default: () => [] },\n\n    // 初始值\n    value: { type: String, default: null },\n\n    // 可清空选项\n    clearable: { type: Boolean, default: true },\n\n    // 自动收起\n    accordion: { type: Boolean, default: false }\n  },\n  data() {\n    return {\n      valueId: null,\n      valueTitle: '',\n      defaultExpandedKey: []\n    }\n  },\n\n  watch: {\n    value() {\n      this.valueId = this.value\n      this.initHandle()\n    }\n  },\n  mounted() {\n    this.valueId = this.value // 初始值\n    this.initHandle()\n  },\n  methods: {\n    // 初始化值\n    initHandle() {\n      if (this.valueId) {\n        this.valueTitle = this.$refs.selectTree.getNode(this.valueId).data[this.props.label] // 初始化显示\n        this.$refs.selectTree.setCurrentKey(this.valueId) // 设置默认选中\n        this.defaultExpandedKey = [this.valueId] // 设置默认展开\n      } else {\n        this.clearHandle()\n      }\n      this.initScroll()\n    },\n\n    // 初始化滚动条\n    initScroll() {\n      this.$nextTick(() => {\n        const scrollWrap = document.querySelectorAll('.el-scrollbar .el-select-dropdown__wrap')[0]\n        const scrollBar = document.querySelectorAll('.el-scrollbar .el-scrollbar__bar')\n        scrollWrap.style.cssText = 'margin: 0px; max-height: none; overflow: hidden;'\n        scrollBar.forEach((ele) => (ele.style.width = 0))\n      })\n    },\n\n    // 切换选项\n    handleNodeClick(node) {\n      this.valueTitle = node[this.props.label]\n      this.valueId = node[this.props.value]\n      this.$emit('getValue', this.valueId)\n      this.defaultExpandedKey = []\n    },\n\n    // 清除选中\n    clearHandle() {\n      this.valueTitle = ''\n      this.valueId = null\n      this.defaultExpandedKey = []\n      this.clearSelected()\n      this.$emit('getValue', null)\n    },\n\n    // 清空选中样式\n    clearSelected() {\n      const allNode = document.querySelectorAll('#tree-option .el-tree-node')\n      allNode.forEach((element) => element.classList.remove('is-current'))\n    }\n  }\n}\n</script>\n\n<style scoped>\n.el-scrollbar .el-scrollbar__view .el-select-dropdown__item {\n  height: auto;\n  max-height: 274px;\n  padding: 0;\n  overflow: hidden;\n  overflow-y: auto;\n}\n.el-select-dropdown__item.selected {\n  font-weight: normal;\n}\nul li >>> .el-tree .el-tree-node__content {\n  height: auto;\n  padding: 0 20px;\n}\n.el-tree-node__label {\n  font-weight: normal;\n}\n.el-tree >>> .is-current .el-tree-node__label {\n  color: #409eff;\n  font-weight: 700;\n}\n.el-tree >>> .is-current .el-tree-node__children .el-tree-node__label {\n  color: #606266;\n  font-weight: normal;\n}\n</style>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TreeSelect.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TreeSelect.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./TreeSelect.vue?vue&type=template&id=761b2108&scoped=true\"\nimport script from \"./TreeSelect.vue?vue&type=script&lang=js\"\nexport * from \"./TreeSelect.vue?vue&type=script&lang=js\"\nimport style0 from \"./TreeSelect.vue?vue&type=style&index=0&id=761b2108&prod&scoped=true&lang=css\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"761b2108\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./TreeSelect.vue?vue&type=style&index=0&id=761b2108&prod&scoped=true&lang=css\""],"sourceRoot":""}