iconify

.env.development

@@ -5,6 +5,7 @@ NODE_ENV = development
 VUE_APP_TITLE = EasyDo智能生产运营平台
 
 # 接口地址
+VUE_APP_ICONIFY_BASEURL = https://api.iconify.design
 VUE_APP_ZEROAPI_BASEURL = http://www.qdeasydo.com
 # VUE_APP_MES_BASEURL = http://www.qdeasydo.com/mes
 # VUE_APP_MES_BASEURL = http://192.168.101.93:8200

src/api/model/common.js

@@ -3,6 +3,14 @@ import config from "@/config"
 import http from "@/utils/request"
 
 export default {
+    iconify: {
+        name: "图标查询",
+		url: `${config.API_URL}/iconify-api`,
+		get: async function (params = {}) {
+			return await http.get(`${this.url}/search`, params, config);
+		}
+    },
+
     minio: {
 		name: "文件上传",
 		url: `${config.API_URL}/mes/file`,

src/components/scIconSelect/index.vue

@@ -19,13 +19,10 @@
                 <el-tab-pane v-for="item in tabsData" :key="item.name" lazy :name="item.name">
                     <template #label>{{ item.name }}<el-tag type="info" size="small">{{ item.icons.length }}</el-tag></template>
 
-                    <div class="sc-icon-select__list">
+                    <div v-loading="loading" class="sc-icon-select__list">
                         <el-scrollbar>
                             <ul @click="selectIcon">
-                                <template v-if="!item.icons.length">
-                                    <el-empty :image-size="100" description="未查询到相关图标" />
-                                    <sc-iconify :icon="searchText" @load="load"></sc-iconify>
-                                </template>
+                                <el-empty v-if="!item.icons.length" :image-size="100" description="未查询到相关图标" />
                                 <li :class="icon == value ? 'select-icon' : ''" v-for="icon in item.icons" :key="icon">
                                     <span :data-icon="icon"></span>
                                     <sc-iconify :icon="icon"></sc-iconify>
@@ -56,8 +53,13 @@ export default {
 
     data() {
         return {
+            loading: false,
             activeName: "默认",
-            tabsData: XEUtils.clone(config.icons, true),
+            iconifys: [],
+            tabsData: [
+                ...XEUtils.clone(config.icons, true),
+                { name: "Iconify", icons: [] }
+            ],
 
             value: "",
             dialogVisible: false,
@@ -81,18 +83,20 @@ export default {
 
     mounted() {
         this.value = this.modelValue;
-        if (this.modelValue) {
-            this.activeName = config.selectIcon(this.modelValue).prefix ? config.selectIcon(this.modelValue).name : "Iconify";
-            this.tabsData[2].icons.push(this.modelValue);
-        }
     },
 
     methods: {
         open() {
             if (this.disabled) return false;
             this.dialogVisible = true;
+
             this.searchText = "";
-            if (this.value && !config.selectIcon(this.value).prefix) this.tabsData[2].icons = XEUtils.uniq([...this.tabsData[2].icons, this.value]);
+            this.activeName = this.value ? config.selectIcon(this.value).name || "Iconify" : "默认";
+            if (this.activeName == "Iconify") {
+                this.iconifys = XEUtils.uniq([...this.iconifys, this.value]);
+                this.tabsData[2].icons = XEUtils.clone(this.iconifys, true);
+            }
+
             nextTick(() => document.querySelector(".select-icon")?.scrollIntoView({ block: "center" }));
         },
 
@@ -107,22 +111,23 @@ export default {
             this.dialogVisible = false;
         },
 
-        search(text) {
+         search: XEUtils.debounce(async function(text) {
             let filterData = XEUtils.clone(config.icons, true);
-            if (this.value && !config.selectIcon(this.value).prefix) filterData[2].icons = XEUtils.uniq([...filterData[2].icons, this.value]);
+            let iconifyIcons = XEUtils.clone(this.iconifys, true)
 
             if (text) {
-                XEUtils.arrayEach(filterData, item => {
-                    item.icons = XEUtils.filter(item.icons, icon => icon.toLowerCase().includes(text.toLowerCase()))
-                })
+                XEUtils.arrayEach(filterData, item => item.icons = XEUtils.filter(item.icons, icon => icon.toLowerCase().includes(text.toLowerCase())));
+                
+                this.loading = true;
+                iconifyIcons = await this.fetchIconify(text);
+                this.loading = false;
             }
             
-            this.tabsData = filterData;
-        },
+            this.tabsData = [...filterData, { name: "Iconify", icons: iconifyIcons }];
+        }, 600),
 
-        load() {
-            this.activeName = "Iconify";
-            this.tabsData[2].icons = XEUtils.uniq([...this.tabsData[2].icons, this.searchText]);
+        fetchIconify(query) {
+            return new Promise(resolve => this.$API.common.iconify.get({ limit: 99999, query }).then(res => resolve(res.icons)).catch(() => resolve([])));
         }
     }
 }

src/components/scIconify/index.vue

@@ -1,7 +1,7 @@
 <template>
     <el-icon :style="{ fontSize: size + 'px' }" class="sc-iconify-icon" :color="color">
         <component v-if="config.selectIcon(icon).prefix" :is="config.selectIcon(icon).prefix + icon" />
-        <Icon v-else :icon="icon" @load="$emit('load')" />
+        <Icon v-else :icon="icon" />
     </el-icon>
 </template>
 

src/components/scTable/index.vue

@@ -94,7 +94,6 @@ const gridOptions = reactive({
     keepSource: true,
     layouts: props.layouts,
     formConfig: {
-        enabled: true,
         span: 6,
         titleAlign: "right",
         className: "vxe-table-query",
@@ -176,7 +175,6 @@ const gridOptions = reactive({
         ...props.editConfig
     },
     pagerConfig: {
-        enabled: true,
         pageSizes: config.pageSizes,
         layouts: config.layouts,
         currentPage: 1,

src/components/scUpload/file.vue

@@ -49,7 +49,7 @@ export default {
         multiple: { type: Boolean, default: true },
         disabled: { type: Boolean, default: false },
         hideAdd: { type: Boolean, default: false },
-        onSuccess: { type: Function, default: () => { return true } },
+        onSuccess: { type: Function, default: () => true },
         params: { type: Object, default: () => ({}) }
     },
 

src/config/iconSelect.js

@@ -4,8 +4,7 @@ import * as scIcons from "@/assets/icons"
 
 const icons = [
     { name: "默认", prefix: "el-icon-", icons: Object.keys(elIcons) },
-    { name: "扩展", prefix: "sc-icon-", icons: Object.keys(scIcons.default) },
-    { name: "Iconify", icons: [] }
+    { name: "扩展", prefix: "sc-icon-", icons: Object.keys(scIcons.default) }
 ]
 
 function selectIcon(menuIcon) {

src/config/index.js

@@ -15,7 +15,7 @@ const DEFAULT_CONFIG = {
 	TOKEN_NAME: "Authorization",
 
 	//Token前缀，注意最后有个空格，如不需要需设置空字符串
-	TOKEN_PREFIX: "",
+	TOKEN_PREFIX: "Bearer",
 
 	//追加其他头
 	HEADERS: {},

src/config/table.js

@@ -8,7 +8,7 @@ export default {
     exportExcludeFields: ["checkbox", "radio"],
     
     queryData: function ({ formConfig: { data }, pagerConfig: { enabled, currentPage, pageSize } }, paramsColumns) {
-        const query = enabled && { current: currentPage, size: pageSize } || {}
+        const query = enabled === false ? {} : { current: currentPage, size: pageSize }
         XEUtils.arrayEach(paramsColumns, item => {
             if (item.defaultValue) XEUtils.set(query, item.column, item.defaultValue)
             if (!valueIsNull(data, item.field || item.column)) XEUtils.set(query, item.column, XEUtils.get(data, item.field || item.column))

src/utils/request.js

@@ -12,8 +12,9 @@ axios.defaults.timeout = sysConfig.TIMEOUT
 axios.interceptors.request.use(
 	(config) => {
 		let token = tool.cookie.get("MES_TOKEN");
-		if (token) {
-			config.headers[sysConfig.TOKEN_NAME] = sysConfig.TOKEN_PREFIX + token
+         
+		if (token && XEUtils.startsWith(token, sysConfig.TOKEN_PREFIX)) {
+			config.headers[sysConfig.TOKEN_NAME] = token
 		}
 		if (!sysConfig.REQUEST_CACHE && config.method == "get") {
 			config.params = config.params || {};

vue.config.js

@@ -28,6 +28,13 @@ module.exports = defineConfig({
                 target: process.env.VUE_APP_ZEROAPI_BASEURL,
                 changeOrigin: true,
                 pathRewrite: {}
+            },
+            "/iconify-api": {
+                target: process.env.VUE_APP_ICONIFY_BASEURL,
+                changeOrigin: true,
+                pathRewrite: {
+					"^/iconify-api": ""
+                }
             }
 		}
 	},