feat(设置): 拆分通知设置并优化界面样式

- 将通知设置拆分为独立的"邮箱提醒"和"Telegram通知"标签页
- 移除设置项中的user-select样式以改善交互体验
- 优化导入选择框的宽度样式
- 配置Vite开发服务器支持外部访问

cwd-admin/src/styles/components/setting.less

@@ -57,7 +57,6 @@
   justify-content: space-between;
   align-items: center;
   padding: 6px 0;
-  user-select: none;
   transition: background-color 0.2s;
 }
 

cwd-admin/src/views/DataView/index.vue

@@ -24,7 +24,7 @@
 
       <div class="action-row">
         <span class="action-label">导入:</span>
-        <select v-model="importSource" class="form-select" style="margin-right: 8px; width: 160px;">
+        <select v-model="importSource" class="form-select" style="min-width:120px;">
           <option value="cwd">CWD (.json)</option>
           <option value="twikoo">Twikoo (.json)</option>
           <option value="artalk">Artalk (.json)</option>

cwd-admin/src/views/SettingsView/index.vue

@@ -38,10 +38,18 @@
         <button
           type="button"
           class="settings-tab"
-          :class="{ 'settings-tab-active': activeTab === 'notify' }"
+          :class="{ 'settings-tab-active': activeTab === 'emailNotify' }"
-          @click="activeTab = 'notify'"
+          @click="activeTab = 'emailNotify'"
         >
-          通知设置
+          邮箱提醒
+        </button>
+        <button
+          type="button"
+          class="settings-tab"
+          :class="{ 'settings-tab-active': activeTab === 'telegramNotify' }"
+          @click="activeTab = 'telegramNotify'"
+        >
+          Telegram 通知
         </button>
       </div>
       <transition name="tab-fade" mode="out-in">
@@ -258,7 +266,7 @@
               </div>
             </div>
           </template>
-          <template v-else-if="activeTab === 'notify'">
+          <template v-else-if="activeTab === 'emailNotify'">
             <div class="card">
               <div class="card-header">
                 <div class="card-title">通知邮箱设置</div>
@@ -402,6 +410,8 @@
                 </div>
               </div>
             </div>
+          </template>
+          <template v-else-if="activeTab === 'telegramNotify'">
             <div class="card">
               <div class="card-header">
                 <div class="card-title">Telegram 通知设置</div>
@@ -597,7 +607,9 @@ const savingTelegram = ref(false);
 const settingUpWebhook = ref(false);
 const testingTelegram = ref(false);
 
-const activeTab = ref<"comment" | "feature" | "display" | "notify">("comment");
+const activeTab = ref<"comment" | "feature" | "display" | "emailNotify" | "telegramNotify">(
+  "comment",
+);
 
 function addAllowedDomainsFromInput() {
   const raw = allowedDomainInput.value;

cwd-admin/vite.config.ts

@@ -4,6 +4,7 @@ import vue from '@vitejs/plugin-vue';
 export default defineConfig({
 	plugins: [vue()],
 	server: {
+		host: true,
 		port: 1226,
 	},
 });