From 510b43356f18aa5be351a0990c7cdc1d4478b5e7 Mon Sep 17 00:00:00 2001
From: WXL <1785969728@qq.com>
Date: 星期三, 09 七月 2025 14:27:00 +0800
Subject: [PATCH] 测试完成
---
src/components/IconSelect/index.vue | 88 +++++++++++++++++++++++++------------------
1 files changed, 51 insertions(+), 37 deletions(-)
diff --git a/src/components/IconSelect/index.vue b/src/components/IconSelect/index.vue
index b0ec9fa..aa8d5a6 100644
--- a/src/components/IconSelect/index.vue
+++ b/src/components/IconSelect/index.vue
@@ -1,12 +1,24 @@
<!-- @author zhengjie -->
+<!-- 鑷畾涔夊浘鏍囧悕绉板皝瑁� -->
<template>
<div class="icon-body">
- <el-input v-model="name" style="position: relative;" clearable placeholder="璇疯緭鍏ュ浘鏍囧悕绉�" @clear="filterIcons" @input.native="filterIcons">
+ <el-input
+ v-model="name"
+ style="position: relative"
+ clearable
+ placeholder="璇疯緭鍏ュ浘鏍囧悕绉�"
+ @clear="filterIcons"
+ @input.native="filterIcons"
+ >
<i slot="suffix" class="el-icon-search el-input__icon" />
</el-input>
<div class="icon-list">
- <div v-for="(item, index) in iconList" :key="index" @click="selectedIcon(item)">
- <svg-icon :icon-class="item" style="height: 30px;width: 16px;" />
+ <div
+ v-for="(item, index) in iconList"
+ :key="index"
+ @click="selectedIcon(item)"
+ >
+ <svg-icon :icon-class="item" style="height: 30px; width: 16px" />
<span>{{ item }}</span>
</div>
</div>
@@ -14,55 +26,57 @@
</template>
<script>
-import icons from './requireIcons'
+import icons from "./requireIcons";
export default {
- name: 'IconSelect',
+ name: "IconSelect",
data() {
return {
- name: '',
- iconList: icons
- }
+ name: "",
+ iconList: icons,
+ };
},
methods: {
filterIcons() {
- this.iconList = icons
+ this.iconList = icons;
if (this.name) {
- this.iconList = this.iconList.filter(item => item.includes(this.name))
+ this.iconList = this.iconList.filter((item) =>
+ item.includes(this.name)
+ );
}
},
selectedIcon(name) {
- this.$emit('selected', name)
- document.body.click()
+ this.$emit("selected", name);
+ document.body.click();
},
reset() {
- this.name = ''
- this.iconList = icons
- }
- }
-}
+ this.name = "";
+ this.iconList = icons;
+ },
+ },
+};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
- .icon-body {
- width: 100%;
- padding: 10px;
- .icon-list {
- height: 200px;
- overflow-y: scroll;
- div {
- height: 30px;
- line-height: 30px;
- margin-bottom: -5px;
- cursor: pointer;
- width: 33%;
- float: left;
- }
- span {
- display: inline-block;
- vertical-align: -0.15em;
- fill: currentColor;
- overflow: hidden;
- }
+.icon-body {
+ width: 100%;
+ padding: 10px;
+ .icon-list {
+ height: 200px;
+ overflow-y: scroll;
+ div {
+ height: 30px;
+ line-height: 30px;
+ margin-bottom: -5px;
+ cursor: pointer;
+ width: 33%;
+ float: left;
+ }
+ span {
+ display: inline-block;
+ vertical-align: -0.15em;
+ fill: currentColor;
+ overflow: hidden;
}
}
+}
</style>
--
Gitblit v1.9.3