From d43ae50abc9461a9b20b3f015ba3679ba699dfa2 Mon Sep 17 00:00:00 2001 From: LiuHao <liuhaoai545@gmail.com> Date: 星期二, 06 六月 2023 22:52:24 +0800 Subject: [PATCH] update 修改组件 去除无用引用和代码缩进 --- src/components/RightToolbar/index.vue | 77 ++++++++++++++++---------------------- 1 files changed, 33 insertions(+), 44 deletions(-) diff --git a/src/components/RightToolbar/index.vue b/src/components/RightToolbar/index.vue index becb12c..09036b7 100644 --- a/src/components/RightToolbar/index.vue +++ b/src/components/RightToolbar/index.vue @@ -12,84 +12,73 @@ </el-tooltip> </el-row> <el-dialog :title="title" v-model="open" append-to-body> - <el-transfer - :titles="['鏄剧ず', '闅愯棌']" - v-model="value" - :data="columns" - @change="dataChange" - ></el-transfer> + <el-transfer :titles="['鏄剧ず', '闅愯棌']" v-model="value" :data="columns" @change="dataChange"></el-transfer> </el-dialog> </div> </template> -<script setup> +<script setup lang="ts"> +import { propTypes } from '@/utils/propTypes'; + const props = defineProps({ - showSearch: { - type: Boolean, - default: true, - }, - columns: { - type: Array, - }, - search: { - type: Boolean, - default: true, - }, - gutter: { - type: Number, - default: 10, - }, + showSearch: propTypes.bool.def(true), + columns: { + type: Array as PropType<FieldOption[]>, + }, + search: propTypes.bool.def(true), + gutter: propTypes.number.def(10), }) const emits = defineEmits(['update:showSearch', 'queryTable']); // 鏄鹃殣鏁版嵁 -const value = ref([]); +const value = ref<Array<number>>([]); // 寮瑰嚭灞傛爣棰� const title = ref("鏄剧ず/闅愯棌"); // 鏄惁鏄剧ず寮瑰嚭灞� const open = ref(false); const style = computed(() => { - const ret = {}; - if (props.gutter) { - ret.marginRight = `${props.gutter / 2}px`; - } - return ret; + const ret: any = {}; + if (props.gutter) { + ret.marginRight = `${props.gutter / 2}px`; + } + return ret; }); // 鎼滅储 function toggleSearch() { - emits("update:showSearch", !props.showSearch); + emits("update:showSearch", !props.showSearch); } // 鍒锋柊 function refresh() { - emits("queryTable"); + emits("queryTable"); } // 鍙充晶鍒楄〃鍏冪礌鍙樺寲 -function dataChange(data) { - for (let item in props.columns) { - const key = props.columns[item].key; - props.columns[item].visible = !data.includes(key); - } +function dataChange(data: TransferKey[]) { + props.columns?.forEach((item) => { + item.visible = !data.includes(item.key); + }) } // 鎵撳紑鏄鹃殣鍒梔ialog -function showColumn() { - open.value = true; +const showColumn = () => { + open.value = true; } // 鏄鹃殣鍒楀垵濮嬮粯璁ら殣钘忓垪 -for (let item in props.columns) { - if (props.columns[item].visible === false) { - value.value.push(parseInt(item)); - } -} +onMounted(() => { + props.columns?.forEach((item) => { + if (!item.visible) { + value.value.push(item.key); + } + }) +}) </script> -<style lang='scss' scoped> +<style lang="scss" scoped> :deep(.el-transfer__button) { border-radius: 50%; display: block; @@ -102,4 +91,4 @@ .my-el-transfer { text-align: center; } -</style> \ No newline at end of file +</style> -- Gitblit v1.9.3