From 97187b246b94dd58cb585ebaed7e8644d2f00119 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期一, 03 四月 2023 00:26:04 +0800 Subject: [PATCH] update 调整代码格式 --- src/components/TreeSelect/index.vue | 80 ++++++++++++++++++++------------------- 1 files changed, 41 insertions(+), 39 deletions(-) diff --git a/src/components/TreeSelect/index.vue b/src/components/TreeSelect/index.vue index 4ff0e76..8f80377 100644 --- a/src/components/TreeSelect/index.vue +++ b/src/components/TreeSelect/index.vue @@ -28,83 +28,85 @@ </div> </template> -<script setup> - -const { proxy } = getCurrentInstance(); +<script setup lang="ts"> +import { ElTreeSelect } from 'element-plus' const props = defineProps({ /* 閰嶇疆椤� */ objMap: { - type: Object, - default: () => { - return { - value: 'id', // ID瀛楁鍚� - label: 'label', // 鏄剧ず鍚嶇О - children: 'children' // 瀛愮骇瀛楁鍚� - } + type: Object, + default: () => { + return { + value: 'id', // ID瀛楁鍚� + label: 'label', // 鏄剧ず鍚嶇О + children: 'children' // 瀛愮骇瀛楁鍚� } + } }, /* 鑷姩鏀惰捣 */ accordion: { - type: Boolean, - default: () => { - return false - } + type: Boolean, + default: () => { + return false + } }, /**褰撳墠鍙屽悜鏁版嵁缁戝畾鐨勫�� */ value: { - type: [String, Number], - default: '' + type: [String, Number], + default: '' }, /**褰撳墠鐨勬暟鎹� */ options: { - type: Array, - default: () => [] + type: Array, + default: () => [] }, /**杈撳叆妗嗗唴閮ㄧ殑鏂囧瓧 */ placeholder: { - type: String, - default: '' + type: String, + default: '' } }) + + +const selectTree = ref(ElTreeSelect); const emit = defineEmits(['update:value']); const valueId = computed({ get: () => props.value, set: (val) => { - emit('update:value', val) + emit('update:value', val) } }); const valueTitle = ref(''); -const defaultExpandedKey = ref([]); +const defaultExpandedKey = ref<any[]>([]); function initHandle() { nextTick(() => { - const selectedValue = valueId.value; - if(selectedValue !== null && typeof (selectedValue) !== 'undefined') { - const node = proxy.$refs.selectTree.getNode(selectedValue) - if (node) { - valueTitle.value = node.data[props.objMap.label] - proxy.$refs.selectTree.setCurrentKey(selectedValue) // 璁剧疆榛樿閫変腑 - defaultExpandedKey.value = [selectedValue] // 璁剧疆榛樿灞曞紑 - } - } else { - clearHandle() + const selectedValue = valueId.value; + if(selectedValue !== null && typeof (selectedValue) !== 'undefined') { + const node = selectTree.value.getNode(selectedValue) + if (node) { + valueTitle.value = node.data[props.objMap.label] + selectTree.value.setCurrentKey(selectedValue) // 璁剧疆榛樿閫変腑 + defaultExpandedKey.value = [selectedValue] // 璁剧疆榛樿灞曞紑 } + } else { + clearHandle() + } }) } -function handleNodeClick(node) { +function handleNodeClick(node: any) { valueTitle.value = node[props.objMap.label] valueId.value = node[props.objMap.value]; defaultExpandedKey.value = []; - proxy.$refs.treeSelect.blur() + selectTree.value.blur() selectFilterData('') } -function selectFilterData(val) { - proxy.$refs.selectTree.filter(val) +function selectFilterData(val: any) { + selectTree.value.filter(val) } -function filterNode(value, data) { +function filterNode(value: any, data: any) { if (!value) return true return data[props.objMap['label']].indexOf(value) !== -1 } @@ -128,7 +130,7 @@ }) </script> -<style lang='scss' scoped> +<style lang="scss" scoped> @import "@/assets/styles/variables.module.scss"; .el-scrollbar .el-scrollbar__view .el-select-dropdown__item { padding: 0; @@ -153,4 +155,4 @@ background-color: mix(#fff, $--color-primary, 90%); color: $--color-primary; } -</style> \ No newline at end of file +</style> -- Gitblit v1.9.3