From 61417032b79f99ecb462f7f7f2263c2d98d1b558 Mon Sep 17 00:00:00 2001
From: 疯狂的狮子li <15040126243@163.com>
Date: 星期四, 20 四月 2023 18:45:29 +0800
Subject: [PATCH] fix 修复 代码生成菜单选项回显问题
---
src/components/IconSelect/index.vue | 98 ++++++++++++++++++++++++------------------------
1 files changed, 49 insertions(+), 49 deletions(-)
diff --git a/src/components/IconSelect/index.vue b/src/components/IconSelect/index.vue
index 97c601e..330c44f 100644
--- a/src/components/IconSelect/index.vue
+++ b/src/components/IconSelect/index.vue
@@ -1,16 +1,47 @@
+<template>
+ <div class="relative" :style="{ width: width }">
+ <el-input v-model="modelValue" readonly @click="visible = !visible" placeholder="鐐瑰嚮閫夋嫨鍥炬爣">
+ <template #prepend>
+ <svg-icon :icon-class="modelValue as string"></svg-icon>
+ </template>
+ </el-input>
+
+ <el-popover shadow="none" :visible="visible" placement="bottom-end" trigger="click" :width="450">
+ <template #reference>
+ <div @click="visible = !visible" class="cursor-pointer text-[#999] absolute right-[10px] top-0 height-[32px] leading-[32px]">
+ <i-ep-caret-top v-show="visible"></i-ep-caret-top>
+ <i-ep-caret-bottom v-show="!visible"></i-ep-caret-bottom>
+ </div>
+ </template>
+
+ <el-input class="p-2" v-model="filterValue" placeholder="鎼滅储鍥炬爣" clearable @input="filterIcons" />
+
+ <el-scrollbar height="w-[200px]">
+ <ul class="icon-list">
+ <el-tooltip v-for="(iconName, index) in iconNames" :key="index" :content="iconName" placement="bottom" effect="light">
+ <li class="icon-item" @click="selectedIcon(iconName)">
+ <svg-icon color="var(--el-text-color-regular)" :icon-class="iconName" />
+ </li>
+ </el-tooltip>
+ </ul>
+ </el-scrollbar>
+ </el-popover>
+ </div>
+</template>
+
<script setup lang="ts">
import icons from '@/components/IconSelect/requireIcons';
const props = defineProps({
- modelValue: {
- type: String,
- require: true
- },
- width: {
- type: String,
- require: false,
- default: '400px'
- }
+ modelValue: {
+ type: String,
+ require: true
+ },
+ width: {
+ type: String,
+ require: false,
+ default: '400px'
+ }
});
const emit = defineEmits(['update:modelValue']);
@@ -24,13 +55,13 @@
* 绛涢�夊浘鏍�
*/
const filterIcons = () => {
- if (filterValue.value) {
- iconNames.value = icons.filter(iconName =>
- iconName.includes(filterValue.value)
- );
- } else {
- iconNames.value = icons;
- }
+ if (filterValue.value) {
+ iconNames.value = icons.filter(iconName =>
+ iconName.includes(filterValue.value)
+ );
+ } else {
+ iconNames.value = icons;
+ }
}
/**
@@ -38,41 +69,10 @@
* @param iconName 閫夋嫨鐨勫浘鏍囧悕绉�
*/
const selectedIcon = (iconName: string) => {
- emit('update:modelValue', iconName);
- visible.value = false;
+ emit('update:modelValue', iconName);
+ visible.value = false;
}
</script>
-
-<template>
- <div class="relative" :style="{ width: width }">
- <el-input v-model="modelValue" readonly @click="visible = !visible" placeholder="鐐瑰嚮閫夋嫨鍥炬爣">
- <template #prepend>
- <svg-icon :icon-class="modelValue as string"></svg-icon>
- </template>
- </el-input>
-
- <el-popover shadow="none" :visible="visible" placement="bottom-end" trigger="click" :width="450">
- <template #reference>
- <div @click="visible = !visible" class="cursor-pointer text-[#999] absolute right-[10px] top-0 height-[32px] leading-[32px]">
- <i-ep-caret-top v-show="visible"></i-ep-caret-top>
- <i-ep-caret-bottom v-show="!visible"></i-ep-caret-bottom>
- </div>
- </template>
-
- <el-input class="p-2" v-model="filterValue" placeholder="鎼滅储鍥炬爣" clearable @input="filterIcons" />
-
- <el-scrollbar height="w-[200px]">
- <ul class="icon-list">
- <el-tooltip v-for="(iconName, index) in iconNames" :key="index" :content="iconName" placement="bottom" effect="light">
- <li class="icon-item" @click="selectedIcon(iconName)">
- <svg-icon color="var(--el-text-color-regular)" :icon-class="iconName" />
- </li>
- </el-tooltip>
- </ul>
- </el-scrollbar>
- </el-popover>
- </div>
-</template>
<style scoped lang="scss">
.el-divider--horizontal {
--
Gitblit v1.9.3