修改页面显示

src/components/base/image-empty/index.vue

@@ -1,5 +1,5 @@
 <template>
-    <el-image :src="is_obj(image) ? image?.url || '' : image" class="flex align-c jc-c w h radius-sm" fit="cover" @load="on_load">
+    <el-image :src="is_obj(image) ? image?.url || '' : image" class="flex align-c jc-c w h radius-sm" :fit="fit" @load="on_load">
         <template #error>
             <div class="image-slot" :style="errorStyle">
                 <img :src="error_image" :style="errorImgStyle" />
@@ -9,6 +9,7 @@
 </template>
 <script setup lang="ts">
 import { is_obj } from '@/utils';
+import type { ImageProps } from 'element-plus';
 const props = defineProps({
     errorImgStyle: {
         type: String,
@@ -18,6 +19,10 @@ const props = defineProps({
         type: String,
         default: () => '',
     },
+    fit: {
+        type: String as PropType<ImageProps['fit']>,
+        default: () => 'cover',
+    },
 });
 const image = defineModel({ type: [Object, String], default: () => {} });
 const error_image = ref(new URL(`../../../assets/images/empty.png`, import.meta.url).href);

src/components/model-carousel/index.vue

@@ -25,12 +25,12 @@
         >
             <swiper-slide v-for="(item, index) in form.carousel_list" :key="index">
                 <div class="item-image flex jc-c align-c w h" :style="img_style">
-                    <image-empty v-model="item.carousel_img[0]" :style="img_style" error-style="width:5rem;height:5rem"></image-empty>
+                    <image-empty v-model="item.carousel_img[0]" :style="img_style" :fit="img_fit" error-style="width:5rem;height:5rem"></image-empty>
                 </div>
             </swiper-slide>
             <swiper-slide v-for="(item, index1) in seat_list" :key="index1">
                 <div class="item-image flex jc-c align-c w h" :style="img_style">
-                    <image-empty v-model="item.carousel_img[0]" :style="img_style" error-style="width:5rem;height:5rem"></image-empty>
+                    <image-empty v-model="item.carousel_img[0]" :style="img_style" :fit="img_fit" error-style="width:5rem;height:5rem"></image-empty>
                 </div>
             </swiper-slide>
             <div v-if="new_style.is_show" :class="{'dot-center': new_style.indicator_location == 'center', 'dot-right': new_style.indicator_location == 'flex-end' }" class="dot flex abs">
@@ -221,9 +221,6 @@ const slideChange = (swiper: { realIndex: number }) => {
     .item-image {
         background: #F8FDFF;
         height: v-bind(newHeight);
-        :deep(.el-image__inner) {
-            object-fit: v-bind(img_fit);
-        }
     }
 }
 </style>

src/components/model-data-magic/components/product-list-show.vue

@@ -63,7 +63,7 @@
     <template v-else>
         <div class="flex-col gap-20 align-c w h">
             <template v-if="props.flex === 'row'">
-                <div v-for="(item, index) in split_list" :key="index" class="flex-row gap-10 align-c w h">
+                <div v-for="(item, index) in split_list" :key="index" class="flex-row gap-10 align-c w h shop-max-height">
                     <template v-if="!isEmpty(item.new_cover)">
                         <image-empty v-model="item.new_cover[0]" :style="contentImgRadius"></image-empty>
                     </template>
@@ -142,6 +142,9 @@ watchEffect(() => {
     bottom: 0.4rem;
     border-radius: 0.8rem;
 }
+.shop-max-height{
+    max-height: 33%;
+}
 .half-width {
     width: 50%;
 }

src/components/model-data-magic/index.vue

@@ -174,6 +174,42 @@ const background_style = (item: any) => {
 const style_actived_color = (item: any, index: number) => {
    return item.actived_index == index ? `background: ${ item.data_style.actived_color };` : ''
 }
+// 设置默认值
+const default_list = {
+    title: '测试商品标题',
+    min_original_price: '41.2',
+    show_original_price_symbol: '￥',
+    show_original_price_unit: '/ 台',
+    min_price: '51',
+    show_price_symbol: '￥',
+    show_price_unit: '/ 台',
+    sales_count: '1000',
+    images: '',
+    new_cover: [],
+    plugins_view_icon_data: [
+        {
+            name: '满减活动',
+            bg_color: '#EA3323',
+            br_color: '',
+            color: '#fff',
+            url: '',
+        },
+        {
+            name: '包邮',
+            bg_color: '',
+            br_color: '#EA3323',
+            color: '#EA3323',
+            url: '',
+        },
+        {
+            name: '领劵',
+            bg_color: '',
+            br_color: '#EA9223',
+            color: '#EA9223',
+            url: '',
+        },
+    ],
+};
 /*
 ** 组装产品的数据
 ** @param {Array} list 商品列表
@@ -197,7 +233,7 @@ const commodity_list = (list: any[], num: number) => {
         }
         return nav_list;
     } else {
-        return [];
+        return [{ split_list: Array(num).fill(default_list)}];
     }
 }
 const old_list = ref<any>({});

src/components/model-seckill/index.vue

@@ -159,11 +159,13 @@
 </template>
 <script setup lang="ts">
 import { background_computer, common_styles_computer, get_math, gradient_computer, gradient_handle, padding_computer, radius_computer } from '@/utils';
-import { isEmpty, cloneDeep } from 'lodash';
+import { isEmpty, cloneDeep, throttle } from 'lodash';
+import SeckillAPI from '@/api/seckill';
 import { online_url } from '@/utils';
 import { Swiper, SwiperSlide } from 'swiper/vue';
 import { Autoplay } from 'swiper/modules';
 import 'swiper/css';
+import { da } from 'element-plus/es/locale';
 const modules = [Autoplay];
 
 const props = defineProps({
@@ -274,7 +276,15 @@ const default_list = {
 };
 const list = ref<data_list[]>([]);
 onBeforeMount(() => {
-    list.value = Array(4).fill(default_list);
+    SeckillAPI.getSeckillList((res: any) => {
+        const data = res.data;
+        console.log(data);
+        if (!isEmpty(data.current)) {
+            list.value = data.current.goods;
+        } else {
+            list.value = Array(4).fill(default_list);
+        }
+    });
 })
 // 商品间距
 const content_outer_spacing = computed(() => new_style.value.content_outer_spacing);
@@ -354,6 +364,7 @@ const autoplay = ref<boolean | object>(false);
 const slides_per_group = ref(1);
 // 内容参数的集合
 watchEffect(() => {
+    
     // 是否滚动
     if (new_style.value.is_roll) {
         autoplay.value = {

src/components/model-seckill/model-seckill-content.vue

@@ -61,9 +61,9 @@
             <div class="divider-line"></div>
             <card-container>
                 <div class="mb-12">商品设置</div>
-                <el-form-item label="商品数量">
+                <!-- <el-form-item label="商品数量">
                     <slider v-model="form.shop_number" :max="50"></slider>
-                </el-form-item>
+                </el-form-item> -->
                 <el-form-item label="展示信息">
                     <el-checkbox-group v-model="form.is_show">
                         <el-checkbox v-for="item in base_list.list_show_list" :key="item.value" :value="item.value">{{ item.name }}</el-checkbox>

src/components/page-settings/index.vue

@@ -5,7 +5,7 @@
                 <img class="img" :style="`Filter: brightness(${ new_style.function_buttons_type == 'black' ? 0 : 100 })`" src="@/assets/images/layout/main/main-top.png" />
             </div>
             <div class="model-head tc re mlr-12 mt-6">
-                <div v-if="['1', '2', '3'].includes(form.theme)" class="flex align-c jc-c h gap-16" :style="[{ 'justify-content': form?.indicator_location || 'center', 'padding-right': form?.indicator_location == 'flex-end' ? '90px' : '0'}, text_style]">
+                <div v-if="['1', '2', '3'].includes(form.theme)" class="flex align-c jc-c h gap-16" :style="[{ 'justify-content': form?.indicator_location || 'center', 'padding-right': form.indicator_location == 'flex-end' || form.theme == 3 ? '95px' : '0'}, 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>
@@ -19,7 +19,7 @@
                 <div v-else-if="['4', '5'].includes(form.theme)" class="flex 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" name="arrow-right" size="12" color="0"></icon></div>
                     <template v-if="['5'].includes(form.theme)">
-                        <div class="flex-1" style="padding-right:90px">
+                        <div class="flex-1" style="padding-right:95px">
                             <model-search :value="pageData.com_data" :is-page-settings="true"></model-search>
                         </div>
                     </template>

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

@@ -41,7 +41,7 @@
                         <el-radio value="white">白色</el-radio>
                     </el-radio-group>
                 </el-form-item>
-                <el-form-item label="沉浸样式">
+                <el-form-item v-if="form.header_background_type == 'transparent'" label="沉浸样式">
                     <el-radio-group v-model="form.immersive_style">
                         <el-radio :value="true">开启</el-radio>
                         <el-radio :value="false">关闭</el-radio>