From fe1942c2479d3024d867ab65849737c3e5e7542f Mon Sep 17 00:00:00 2001
From: 疯狂的狮子Li <15040126243@163.com>
Date: 星期三, 19 六月 2024 10:16:21 +0800
Subject: [PATCH] update 更换三方回调方案
---
src/components/IconSelect/index.vue | 26 ++++++++++++--------------
1 files changed, 12 insertions(+), 14 deletions(-)
diff --git a/src/components/IconSelect/index.vue b/src/components/IconSelect/index.vue
index 1cd0023..3bfde4d 100644
--- a/src/components/IconSelect/index.vue
+++ b/src/components/IconSelect/index.vue
@@ -1,6 +1,6 @@
<template>
- <div class="relative" :style="{ width: width }">
- <el-input v-model="modelValue" readonly @click="visible = !visible" placeholder="鐐瑰嚮閫夋嫨鍥炬爣">
+ <div class="relative" :style="{ 'width': width }">
+ <el-input v-model="modelValue" readonly placeholder="鐐瑰嚮閫夋嫨鍥炬爣" @click="visible = !visible">
<template #prepend>
<svg-icon :icon-class="modelValue" />
</template>
@@ -8,18 +8,18 @@
<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]">
+ <div class="cursor-pointer text-[#999] absolute right-[10px] top-0 height-[32px] leading-[32px]" @click="visible = !visible">
<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-input v-model="filterValue" class="p-2" 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', {active: modelValue == iconName}]" @click="selectedIcon(iconName)">
+ <li :class="['icon-item', { active: modelValue == iconName }]" @click="selectedIcon(iconName)">
<svg-icon color="var(--el-text-color-regular)" :icon-class="iconName" />
</li>
</el-tooltip>
@@ -50,13 +50,11 @@
*/
const filterIcons = () => {
if (filterValue.value) {
- iconNames.value = icons.filter(iconName =>
- iconName.includes(filterValue.value)
- );
+ iconNames.value = icons.filter((iconName) => iconName.includes(filterValue.value));
} else {
iconNames.value = icons;
}
-}
+};
/**
* 閫夋嫨鍥炬爣
* @param iconName 閫夋嫨鐨勫浘鏍囧悕绉�
@@ -64,12 +62,12 @@
const selectedIcon = (iconName: string) => {
emit('update:modelValue', iconName);
visible.value = false;
-}
+};
</script>
<style scoped lang="scss">
.el-scrollbar {
- max-height: calc(50vh - 100px)!important;
+ max-height: calc(50vh - 100px) !important;
overflow-y: auto;
}
.el-divider--horizontal {
@@ -99,8 +97,8 @@
}
}
.active {
- border-color: var(--el-color-primary);
- color: var(--el-color-primary);
- }
+ border-color: var(--el-color-primary);
+ color: var(--el-color-primary);
+ }
}
</style>
--
Gitblit v1.9.3