From dafea917c565d7e5a50c1c5e2d3d8494f03054e3 Mon Sep 17 00:00:00 2001
From: xiaozzzi <42293085+xiaozzzi@users.noreply.github.com>
Date: Thu, 2 Nov 2023 23:54:05 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=87=E6=A1=A3=E5=9B=BE=E6=A0=87=E6=94=AF?=
 =?UTF-8?q?=E6=8C=81=E4=BD=BF=E7=94=A8=E5=9B=BE=E7=89=87=E9=93=BE=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/main/resources/schema-mysql.sql       |  2 ++
 .../src/views/article/ArticleInfo.vue         |  4 ++--
 .../src/views/article/ArticleTreeTitle.vue    | 19 ++++++++++++++++---
 .../src/views/picture/PictureInfo.vue         |  2 +-
 .../src/views/picture/PictureTreeTitle.vue    | 13 +++++++++++--
 5 files changed, 32 insertions(+), 8 deletions(-)

diff --git a/blossom-backend/backend/src/main/resources/schema-mysql.sql b/blossom-backend/backend/src/main/resources/schema-mysql.sql
index a12e9d3..47400a2 100644
--- a/blossom-backend/backend/src/main/resources/schema-mysql.sql
+++ b/blossom-backend/backend/src/main/resources/schema-mysql.sql
@@ -217,6 +217,7 @@ CREATE TABLE IF NOT EXISTS `blossom_article`  (
                                     PRIMARY KEY (`id`) USING BTREE
 ) ENGINE = InnoDB AUTO_INCREMENT = 20153 CHARACTER SET = utf8mb4 COLLATE = utf8mb4_bin COMMENT = '文章，Article' ROW_FORMAT = DYNAMIC;
 
+
 -- ----------------------------
 -- Records of blossom_article
 -- ----------------------------
@@ -327,6 +328,7 @@ CREATE TABLE IF NOT EXISTS `blossom_folder`  (
                                    PRIMARY KEY (`id`) USING BTREE
 ) ENGINE = InnoDB AUTO_INCREMENT = 12035 CHARACTER SET = utf8mb4 COLLATE = utf8mb4_bin COMMENT = '文件夹，Folder' ROW_FORMAT = DYNAMIC;
 
+alter table blossom_folder modify icon varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_bin NOT NULL default '' comment '图标';
 -- ----------------------------
 -- Records of blossom_folder
 -- ----------------------------
diff --git a/blossom-editor/src/renderer/src/views/article/ArticleInfo.vue b/blossom-editor/src/renderer/src/views/article/ArticleInfo.vue
index 4376e95..68dc60e 100644
--- a/blossom-editor/src/renderer/src/views/article/ArticleInfo.vue
+++ b/blossom-editor/src/renderer/src/views/article/ArticleInfo.vue
@@ -158,11 +158,11 @@
             <el-input
               v-model="docForm.color"
               :style="{ width: '176px', '--el-input-text-color': '#000000', '--el-input-bg-color': docForm.color }"
-              placeholder="主色调">
+              placeholder="主色调 #FFFFFF">
             </el-input>
           </el-form-item>
           <el-form-item label="图标">
-            <el-input v-model="docForm.icon" style="width: 176px" placeholder="图标, wl-">
+            <el-input v-model="docForm.icon" style="width: 176px" placeholder="wl-|http|https">
               <template #append>
                 <el-tooltip content="查看所有图标" effect="blossomt" placement="top" :hide-after="0">
                   <div style="cursor: pointer; font-size: 20px" @click="openNewIconWindow()">
diff --git a/blossom-editor/src/renderer/src/views/article/ArticleTreeTitle.vue b/blossom-editor/src/renderer/src/views/article/ArticleTreeTitle.vue
index c95dd73..3a38ec3 100644
--- a/blossom-editor/src/renderer/src/views/article/ArticleTreeTitle.vue
+++ b/blossom-editor/src/renderer/src/views/article/ArticleTreeTitle.vue
@@ -4,7 +4,11 @@
       {{ props.trees.s }}
     </bl-tag>
     <div class="doc-name">
-      <svg v-if="isNotBlank(props.trees.icon)" class="icon menu-icon" aria-hidden="true">
+      <img
+        class="menu-icon-img"
+        v-if="isNotBlank(props.trees.icon) && (props.trees.icon.startsWith('http') || props.trees.icon.startsWith('https'))"
+        :src="props.trees.icon" />
+      <svg v-else-if="isNotBlank(props.trees.icon)" class="icon menu-icon" aria-hidden="true">
         <use :xlink:href="'#' + props.trees.icon"></use>
       </svg>
       <div class="name-wrapper">
@@ -89,11 +93,15 @@ $icon-size: 17px;
     flex-wrap: wrap;
     width: 100%;
 
-    .menu-icon {
+    .menu-icon,
+    .menu-icon-img {
       @include box($icon-size, $icon-size, $icon-size, $icon-size, $icon-size, $icon-size);
       margin-top: 5px;
       margin-right: 8px;
     }
+    .menu-icon-img {
+      border-radius: 2px;
+    }
 
     .name-wrapper {
       @include ellipsis();
@@ -128,12 +136,17 @@ $icon-size: 17px;
     flex-wrap: wrap;
     width: 100%;
 
-    .menu-icon {
+    .menu-icon,
+    .menu-icon-img {
       @include box($icon-size, $icon-size, $icon-size, $icon-size, $icon-size, $icon-size);
       margin-top: 5px;
       margin-right: 8px;
     }
 
+    .menu-icon-img {
+      border-radius: 2px;
+    }
+
     .name-wrapper {
       @include ellipsis();
       max-width: calc(100% - 25px);
diff --git a/blossom-editor/src/renderer/src/views/picture/PictureInfo.vue b/blossom-editor/src/renderer/src/views/picture/PictureInfo.vue
index 1c494b3..4441db5 100644
--- a/blossom-editor/src/renderer/src/views/picture/PictureInfo.vue
+++ b/blossom-editor/src/renderer/src/views/picture/PictureInfo.vue
@@ -81,7 +81,7 @@
           </el-form-item>
 
           <el-form-item label="图标">
-            <el-input v-model="docForm.icon" style="width: 176px" placeholder="图标, wl-">
+            <el-input v-model="docForm.icon" style="width: 176px" placeholder="wl-|http|https">
               <template #append>
                 <el-tooltip content="查看所有图标" effect="blossomt" placement="top" :hide-after="0">
                   <div style="cursor: pointer; font-size: 20px" @click="openNewIconWindow()">
diff --git a/blossom-editor/src/renderer/src/views/picture/PictureTreeTitle.vue b/blossom-editor/src/renderer/src/views/picture/PictureTreeTitle.vue
index 1ed8734..62703f2 100644
--- a/blossom-editor/src/renderer/src/views/picture/PictureTreeTitle.vue
+++ b/blossom-editor/src/renderer/src/views/picture/PictureTreeTitle.vue
@@ -4,7 +4,11 @@
       {{ props.trees.s }}
     </bl-tag>
     <span class="doc-name">
-      <svg v-if="isNotBlank(props.trees.icon)" class="icon menu-icon" aria-hidden="true">
+      <img
+        class="menu-icon-img"
+        v-if="isNotBlank(props.trees.icon) && (props.trees.icon.startsWith('http') || props.trees.icon.startsWith('https'))"
+        :src="props.trees.icon" />
+      <svg v-else-if="isNotBlank(props.trees.icon)" class="icon menu-icon" aria-hidden="true">
         <use :xlink:href="'#' + props.trees.icon"></use>
       </svg>
       <div class="name-wrapper">
@@ -80,12 +84,17 @@ $icon-size: 17px;
     flex-wrap: wrap;
     width: 100%;
 
-    .menu-icon {
+    .menu-icon,
+    .menu-icon-img {
       @include box($icon-size, $icon-size, $icon-size, $icon-size, $icon-size, $icon-size);
       margin-top: 5px;
       margin-right: 8px;
     }
 
+    .menu-icon-img {
+      border-radius: 2px;
+    }
+
     .name-wrapper {
       @include ellipsis();
       max-width: calc(100% - 25px);