修改页面显示

src/components/common/custom-module/model-image/index.vue

@@ -15,7 +15,7 @@ const props = defineProps({
         required: true
     },
     sourceList: {
-        type: Object,
+        type: [Object, Array],
         default: () => {
             return {};
         }

src/components/model-article-tabs/model-article-tabs-content.vue

@@ -7,7 +7,7 @@
                     <div class="flex-row align-c gap-10">
                         <el-switch v-model="form.tabs_top_up" active-value="1" inactive-value="0" :disabled="is_immersion_model" />
                         <el-tooltip effect="dark" :show-after="200" :hide-after="200" content="<span>开启沉浸样式时，选项卡置顶功能禁用</span>" raw-content placement="top">
-                            <icon name="tips" size="16"></icon>
+                            <icon name="miaosha-hdgz" size="16"></icon>
                         </el-tooltip>
                     </div>
                 </el-form-item>

src/components/model-custom/index.vue

@@ -1,5 +1,5 @@
 <template>
-    <div ref="container" class="custom-other" :style="style_container">
+    <div class="custom-other" :style="style_container">
         <div class="w h" :style="style_img_container">
             <div class="w h re">
                 <div v-for="item in form.custom_list" :key="item.id" class="main-content" :style="{'left': percentage_count(item.location.x, div_width) , 'top': percentage_count(item.location.y, form.height), 'width': percentage_count(item.com_data.com_width, div_width), 'height': percentage_count(item.com_data.com_height, form.height)}">

src/components/model-custom/model-custom-setting.vue

@@ -1,10 +1,10 @@
 <template>
     <div class="w">
         <template v-if="type == '1'">
-            <model-custom-content :value="value.content" @update:value="content_update"></model-custom-content>
+            <model-custom-content :value="value.content"></model-custom-content>
         </template>
         <template v-if="type == '2'">
-            <model-custom-styles :value="value.style" @update:value="style_update"></model-custom-styles>
+            <model-custom-styles :value="value.style"></model-custom-styles>
         </template>
     </div>
 </template>
@@ -19,12 +19,5 @@ const props = defineProps({
         default: () => ({}),
     },
 });
-const form = reactive(props.value);
-const content_update = (value: any) => {
-    form.content = value;
-};
-const style_update = (value: any) => {
-    form.style = value;
-};
 </script>
 <style lang="scss" scoped></style>

src/components/model-custom/model-custom-styles.vue

@@ -1,10 +1,9 @@
 <template>
     <div class="w">
-        <common-styles :value="form.common_style" @update:value="common_style_update" />
+        <common-styles :value="value.common_style" />
     </div>
 </template>
 <script setup lang="ts">
-import { pick } from 'lodash';
 const props = defineProps({
     value: {
         type: Object,
@@ -12,16 +11,6 @@ const props = defineProps({
     }
 });
 
-// 默认值
-const state = reactive({
-    form: props.value
-});
-// 如果需要解构，确保使用toRefs
-const { form } = toRefs(state);
-
-const common_style_update = (value: any) => {
-    form.value.common_style = value;
-};
 </script>
 <style lang="scss" scoped>
 .topic {

src/components/model-goods-tabs/model-goods-tabs-content.vue

@@ -7,7 +7,7 @@
                     <div class="flex-row align-c gap-10">
                         <el-switch v-model="form.tabs_top_up" active-value="1" inactive-value="0" :disabled="is_immersion_model"/>
                         <el-tooltip effect="dark" :show-after="200" :hide-after="200" content="<span>开启沉浸样式时，选项卡置顶功能禁用</span>" raw-content placement="top">
-                            <icon name="tips" size="16"></icon>
+                            <icon name="miaosha-hdgz" size="16"></icon>
                         </el-tooltip>
                     </div>
                 </el-form-item>

src/components/model-notice/index.vue

@@ -154,11 +154,9 @@ watchEffect(() => {
     height: v-bind(container_height);
     overflow: hidden;
     padding: 0 1rem;
-    background: #fff;
 }
 .news-card {
     padding: 1.5rem;
-    background: #fff;
 }
 .num {
     padding-right: 0.7rem;

src/components/page-settings/index.vue

@@ -12,8 +12,10 @@
                     <div class="model-head-content flex-row align-c jc-sb gap-16 re">
                         <div v-if="['1', '2', '3'].includes(form.theme)" class="flex-1">
                             <div class="flex-row align-c jc-c h gap-16" :class="position_class" :style="[{ 'justify-content': form?.indicator_location || 'center' }, text_style]">
-                                <template v-if="['2', '3'].includes(form.theme)">
-                                    <div class="logo-outer-style"><image-empty v-model="form.logo[0]" class="logo-style" error-img-style="width:2rem;height:2rem;"></image-empty></div>
+                                <template v-if="['2', '3'].includes(form.theme) && form.logo.length > 0">
+                                    <div class="logo-outer-style">
+                                        <img class="logo-style" :src="form.logo[0].url" />
+                                    </div>
                                 </template>
                                 <div v-if="['1', '2'].includes(form.theme)">{{ form.title }}</div>
                                 <template v-if="['3', '5'].includes(form.theme)">
@@ -25,8 +27,8 @@
                         </div>
                         <div v-else-if="['4', '5'].includes(form.theme)" class="flex-1 flex-row align-c h gap-10">
                             <div class="flex-row gap-2">
-                                <icon name="position" size="12" color="0"></icon><span class="size-14 cr-3 text-line-1">{{ form.positioning_name }}</span>
-                                <icon v-if="form.is_arrows_show == '1'" name="arrow-right" size="12" color="0"></icon>
+                                <icon name="location" size="12" color="0"></icon><span class="size-14 cr-3 text-line-1">{{ form.positioning_name }}</span>
+                                <icon v-if="form.is_arrows_show == '1'" name="arrow-bottom" size="12" color="0"></icon>
                             </div>
                             <template v-if="['5'].includes(form.theme)">
                                 <div class="flex-1">

src/components/page-settings/page-setting.vue

@@ -7,8 +7,10 @@
     </template>
 </template>
 <script setup lang="ts">
-import { cloneDeep } from 'lodash';
+import { cloneDeep, isEmpty } from 'lodash';
 import { get_math } from '@/utils';
+import { commonStore } from '@/store';
+const common_store = commonStore();
 const props = defineProps({
     type: {
         type: String,
@@ -22,6 +24,7 @@ const props = defineProps({
 const default_data = {
     content: {
         indicator_location: 'flex-start',
+        logo: [],
         icon_setting: [
             { id: get_math(), img: [], icon: 'applet-me-message-acquiesce', link: {} },
         ],
@@ -67,6 +70,10 @@ const default_data = {
         },
     }
 }
+const common_config = computed(() => {
+    const { site_logo_app, site_logo_wap, site_logo} = common_store.common.config;
+    return !isEmpty(site_logo_app) ? site_logo_app : !isEmpty(site_logo_wap) ? site_logo_wap : site_logo;
+});
 const default_config = {
     style: {
         theme_1: {
@@ -76,11 +83,15 @@ const default_config = {
             style: {}
         },
         theme_2: {
-            content: {},
+            content: {
+                logo: [{ id: 1, url: common_config, original: '', title: '', ext: '.png', type: 'img' }],
+            },
             style: {}
         },
         theme_3: {
-            content: {},
+            content: {
+                logo: [{ id: 1, url: common_config, original: '', title: '', ext: '.png', type: 'img' }],
+            },
             style: {}
         },
         theme_4: {

src/components/page-settings/page-styles.vue

@@ -48,7 +48,7 @@
                     <div class="flex-row align-c gap-10">
                         <el-switch v-model="form.immersive_style" active-value="1" inactive-value="0" :disabled="is_have_tabs" @change="change_immersive_style"></el-switch>
                         <el-tooltip effect="dark" :show-after="200" :hide-after="200" content="<span>开启沉浸样式时，不可添加选项卡和选项卡轮播。<br/>并且商品选项卡和文章选项卡的选项卡置顶功能禁用</span>" raw-content placement="top">
-                            <icon name="tips" size="16"></icon>
+                            <icon name="miaosha-hdgz" size="16"></icon>
                         </el-tooltip>
                     </div>
                 </el-form-item>

src/store/modules/common.ts

@@ -24,6 +24,9 @@ export const commonStore = defineStore('common', () => {
             currency_symbol: '',
             attachment_host: '',
             store_diy_url: '',
+            site_logo_app: '',
+            site_logo_wap: '',
+            site_logo: '',
         } as any, // 基础数据配置参数
     });
     // 存储链接数据

src/utils/index.ts

@@ -119,7 +119,7 @@ export function gradient_handle(color_list: color_list[], direction: string, is_
         new_color_list.forEach((item: any, index: number) => {
             container_common_styles += `${item.color ? item.color : 'rgb(255 255 255 / 0%)'}`;
             if (color_list.length == 1) {
-                container_common_styles += ` ${item.color_percentage || 0}%, ${item.color} 100%`;
+                container_common_styles += ` ${item.color_percentage || 0}%, ${item.color ? item.color : 'rgb(255 255 255 / 0%)'} 100%`;
             } else {
                 if (typeof item.color_percentage === 'number') {
                     if (index == color_list.length - 1) {