1

src/api/enterprisePurchase/searchConfig/types.ts

@@ -53,6 +53,16 @@ export interface SearchConfigVO {
    */
   leftAdLink: string;
 
+  /**
+   * 分类设置主题色
+   */
+  categoryThemeColor: string;
+
+  /**
+   * 头部分类主题色
+   */
+  headerThemeColor: string;
+
   /**
    * 备注
    */
@@ -112,6 +122,16 @@ export interface SearchConfigForm extends BaseEntity {
    */
   leftAdLink?: string;
 
+  /**
+   * 分类设置主题色
+   */
+  categoryThemeColor?: string;
+
+  /**
+   * 头部分类主题色
+   */
+  headerThemeColor?: string;
+
   /**
    * 备注
    */

src/views/enterprisePurchase/index.vue

@@ -123,21 +123,21 @@
               @mouseenter="leftAdHover = true"
               @mouseleave="leftAdHover = false"
             >
-              <img v-if="form.leftAdImage" :src="form.leftAdImage" class="left-ad-img" alt="左侧广告" />
+              <img v-if="leftAdForm.leftAdImage" :src="leftAdForm.leftAdImage" class="left-ad-img" alt="左侧广告" />
               <div v-else class="left-ad-empty" @click="triggerUpload('leftAd')">
                 <el-icon :size="40"><Plus /></el-icon>
                 <p>点击上传广告图</p>
               </div>
-              <div class="ad-actions" v-show="leftAdHover && form.leftAdImage">
+              <div class="ad-actions" v-show="leftAdHover && leftAdForm.leftAdImage">
                 <el-button type="primary" icon="Edit" circle @click="triggerUpload('leftAd')" title="更换图片" />
                 <el-button type="danger" icon="Delete" circle @click="handleDeleteLeftAd" title="删除图片" />
               </div>
             </div>
 
-            <div class="left-ad-settings" v-if="form.leftAdImage">
+            <div class="left-ad-settings" v-if="leftAdForm.leftAdImage">
               <el-form label-width="90px" label-position="left">
                 <el-form-item label="跳转地址：">
-                  <el-input v-model="form.leftAdLink" placeholder="请输入以 http:// 或 https:// 开头的地址" class="settings-input-ad" />
+                  <el-input v-model="leftAdForm.leftAdLink" placeholder="请输入以 http:// 或 https:// 开头的地址" class="settings-input-ad" />
                 </el-form-item>
               </el-form>
               <div class="left-ad-tip">
@@ -1542,7 +1542,8 @@ import {
   ArrowUp,
   ArrowDown
 } from '@element-plus/icons-vue';
-
+import { any } from 'vue-types';
+const uploadAction = import.meta.env.VITE_APP_BASE_API + '/resource/oss/upload';
 const defaultPlaceholder =
   'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9IiNmMmYyZjIiLz48dGV4dCB4PSI1MCUiIHk9IjUwJSIgZG9taW5hbnQtYmFzZWxpbmU9Im1pZGRsZSIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZm9udC1zaXplPSIxMiIgZmlsbD0iI2JmYmZiZiI+5pys5peg5Zu+54mHPC90ZXh0Pjwvc3ZnPg==';
 
@@ -1570,6 +1571,13 @@ const form = reactive({
   rightBtnIcon: '',
   rightBtnText: '',
   rightBtnLink: '',
+
+  categoryThemeColor: '',
+  headerThemeColor: ''
+});
+
+const leftAdForm = reactive({
+  id: null,
   leftAdImage: '',
   leftAdLink: ''
 });
@@ -1581,14 +1589,20 @@ const leftAdId = ref<string | number>('');
 const handleMainSave = async () => {
   try {
     let res;
-    if (activeSubTab.value == 'search') {
+    if (activeSubTab.value == 'search' || activeSubTab.value == 'category' || activeSubTab.value == 'headerCategory') {
       // 构建提交数据，过滤空的热词
+      form.categoryThemeColor = categoryThemeColor.value;
+      form.headerThemeColor = headerThemeColor.value;
       const submitData = {
         ...form,
         hotWordList: form.hotWordsList.filter((item) => item.name && item.name.trim() !== '')
       };
-      // 无ID则新增
-      res = await addSearchConfig(submitData);
+      if (form.id) {
+        res = await updateSearchConfig(submitData);
+      } else {
+        // 无ID则新增
+        res = await addSearchConfig(submitData);
+      }
 
       if (res.code === 200) {
         ElMessage.success('配置保存成功');
@@ -1622,9 +1636,9 @@ const getCurrentAdLeftBtn = async () => {
     const res = await getCurrentAdLeft();
     if (res.code === 200 && res.data) {
       // 回显数据到表单
-      form.id = res.data.id || null;
-      form.leftAdImage = res.data.imageUrl || '';
-      form.leftAdLink = res.data.link || '';
+      leftAdForm.id = res.data.id || null;
+      leftAdForm.leftAdImage = res.data.imageUrl || '';
+      leftAdForm.leftAdLink = res.data.link || '';
     }
   } catch (error) {
     console.error('获取配置失败:', error);
@@ -1645,8 +1659,11 @@ const getCurrentSearch = async () => {
       form.rightBtnIcon = res.data.rightBtnIcon || '';
       form.rightBtnText = res.data.rightBtnText || '';
       form.rightBtnLink = res.data.rightBtnLink || '';
-      form.leftAdImage = res.data.leftAdImage || '';
-      form.leftAdLink = res.data.leftAdLink || '';
+
+      form.categoryThemeColor = res.data.categoryThemeColor || '';
+      form.headerThemeColor = res.data.headerThemeColor || '';
+      categoryThemeColor.value = form.categoryThemeColor;
+      headerThemeColor.value = form.headerThemeColor;
 
       // 处理热词列表
       if (res.data.hotWordList && Array.isArray(res.data.hotWordList)) {
@@ -1848,7 +1865,7 @@ const moveRow = async (index: number, direction: number) => {
 // 颜色转换工具：Hex 转 RGBA
 const hexToRgba = (hex, opacity) => {
   if (!hex) return `rgba(255, 255, 255, ${opacity})`;
-  let r = parseInt(hex.slice(1, 3), 16);
+  let r = parseInt(hex.slice(1, 3), 16) ;
   let g = parseInt(hex.slice(3, 5), 16);
   let b = parseInt(hex.slice(5, 7), 16);
   return `rgba(${r}, ${g}, ${b}, ${opacity})`;
@@ -1875,21 +1892,21 @@ const onFileChange = (e) => {
   reader.onload = (event) => {
     const base64 = event.target.result;
     if (uploadTarget.value === 'leftAd') {
-      form.leftAdImage = base64;
+      leftAdForm.leftAdImage = base64 as any;
     } else if (uploadTarget.value === 'carousel') {
-      carouselForm.image = base64;
+      carouselForm.image = base64 as any;
     } else if (uploadTarget.value === 'rightBtnIcon') {
-      form.rightBtnIcon = base64;
+      form.rightBtnIcon = base64 as any;
     } else if (uploadTarget.value === 'categoryIcon') {
-      categoryForm.icon = base64;
+      categoryForm.icon = base64 as any;
     } else if (uploadTarget.value === 'headerIcon') {
-      headerForm.icon = base64;
+      headerForm.icon = base64 as any;
     } else if (uploadTarget.value === 'scenarioImg') {
-      scenarioForm.image = base64;
+      scenarioForm.image = base64 as any;
     } else if (uploadTarget.value === 'quickEntryIcon') {
-      quickEntryForm.icon = base64;
+      quickEntryForm.icon = base64 as any;
     } else if (uploadTarget.value === 'recommendIcon') {
-      recommendForm.icon = base64;
+      recommendForm.icon = base64 as any;
     }
     ElMessage.success('图片上传成功');
     e.target.value = '';
@@ -1906,8 +1923,9 @@ const fetchLeftAdConfig = async () => {
     if (res.code === 200 && res.rows && res.rows.length > 0) {
       const adData = res.rows[0];
       leftAdId.value = adData.id;
-      form.leftAdImage = adData.imageUrl || '';
-      form.leftAdLink = adData.link || '';
+      leftAdForm.id = adData.id;
+      leftAdForm.leftAdImage = adData.imageUrl || '';
+      leftAdForm.leftAdLink = adData.link || '';
     }
   } catch (error) {
     console.error('获取左侧广告配置失败:', error);
@@ -1917,20 +1935,20 @@ const fetchLeftAdConfig = async () => {
 // 保存左侧广告配置
 const saveLeftAdConfig = async () => {
   try {
-    if (!form.leftAdImage) {
+    if (!leftAdForm.leftAdImage) {
       ElMessage.warning('请先上传广告图片');
       return;
     }
 
     const submitData: AdLeftForm = {
-      id: leftAdId.value || undefined,
-      imageUrl: form.leftAdImage,
-      link: form.leftAdLink,
+      id: leftAdId.value || leftAdForm.id || undefined,
+      imageUrl: leftAdForm.leftAdImage,
+      link: leftAdForm.leftAdLink,
       status: 1 // 默认启用
     };
 
     let res;
-    if (leftAdId.value) {
+    if (submitData.id) {
       // 有ID则更新
       res = await updateAdLeft(submitData);
     } else {
@@ -1943,6 +1961,7 @@ const saveLeftAdConfig = async () => {
       // 如果是新增，保存返回的ID
       if (!leftAdId.value && res.data) {
         leftAdId.value = res.data.id;
+        leftAdForm.id = leftAdId.value;
       }
       // 重新获取最新配置
       await fetchLeftAdConfig();
@@ -1970,15 +1989,16 @@ const handleDeleteLeftAd = () => {
             ElMessage.success('删除成功');
             // 清空表单数据
             leftAdId.value = '';
-            form.leftAdImage = '';
-            form.leftAdLink = '';
+            leftAdForm.id = leftAdId.value;
+            leftAdForm.leftAdImage = '';
+            leftAdForm.leftAdLink = '';
           } else {
             ElMessage.error(res.msg || '删除失败');
           }
         } else {
           // 如果没有ID，直接清空表单
-          form.leftAdImage = '';
-          form.leftAdLink = '';
+          leftAdForm.leftAdImage = '';
+          leftAdForm.leftAdLink = '';
           ElMessage.success('已清除');
         }
       } catch (error) {