修改页面显示

master
于肖磊 2024-10-18 15:15:51 +08:00
parent ccc889b2f1
commit e998b632a6
5 changed files with 59 additions and 35 deletions

View File

@ -7,12 +7,12 @@
data: {
//
//
request_url: 'http://shopxo.com/',
// request_url:'https://new.shopxo.vip/',
// request_url: 'http://shopxo.com/',
request_url:'https://new.shopxo.vip/',
// publicpublichttps://d1.shopxo.vip/public/
static_url: 'http://shopxo.com/',
// static_url:'https://new.shopxo.vip/',
// static_url: 'http://shopxo.com/',
static_url:'https://new.shopxo.vip/',
// default
system_type: 'default',

View File

@ -141,8 +141,8 @@
default: '',
},
propKey: {
type: String,
default: '',
type: Number,
default: 0,
},
},
components: {

View File

@ -35,7 +35,7 @@
props: {
propKey: {
type: [Number, String],
default: '',
default: '',
},
propValue: {
type: Object,

View File

@ -23,9 +23,12 @@
<imageEmpty :propImageSrc="item.images" :propStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
</view>
</block>
<view class="flex-col flex-1 jc-sb content gap-10" :style="content_style">
<view v-if="is_show('title') || is_show('simple_desc') || is_show('price') || is_show('original_price') || is_show('sales_count') || is_show('plugins_view_icon') || form.is_shop_show == '1'" class="flex-col flex-1 jc-sb content gap-10" :style="content_style">
<view class="flex-col gap-10 top-title">
<view v-if="is_show('title')" :class="text_line" :style="title_style">{{ item.title }}</view>
<view v-if="is_show('title') || (['0', '1', '2', '3', '5'].includes(theme) && is_show('simple_desc'))" class="flex-col" :style="{'gap': new_style.title_simple_desc_spacing * 2 + 'rpx' }">
<view v-if="is_show('title')" :class="text_line" :style="title_style">{{ item.title }}</view>
<view v-if="['0', '1', '2', '3', '5'].includes(theme) && is_show('simple_desc')" class="text-line-1" :style="simple_desc">{{ item.simple_desc }}</view>
</view>
<view v-if="show_content && is_show('plugins_view_icon') && !isEmpty(item.plugins_view_icon_data)" class="flex-row gap-5 align-c">
<view v-for="(icon_data, icon_index) in item.plugins_view_icon_data" :key="icon_index" class="radius text-size-xsss padding-horizontal-xs" :style="{ background: icon_data.bg_color, color: icon_data.color, border: '1rpx solid' + (!isEmpty(icon_data.br_color) ? icon_data.br_color : icon_data.bg_color) }">{{ icon_data.name }}</view>
</view>
@ -113,9 +116,12 @@
<imageEmpty :propImageSrc="item.images" :propStyle="content_img_radius" propErrorStyle="width: 100rpx;height: 100rpx;"></imageEmpty>
</view>
</block>
<view class="flex-col flex-1 jc-sb content gap-10" :style="content_style">
<view v-if="is_show('title') || is_show('simple_desc') || is_show('price') || is_show('plugins_view_icon') || is_show('original_price') || form.is_shop_show == '1'" class="flex-col flex-1 jc-sb content gap-10" :style="content_style">
<view class="flex-col gap-10 top-title">
<view v-if="is_show('title')" :class="text_line" :style="title_style">{{ item.title }}</view>
<view v-if="is_show('title') || (['0', '1', '2', '3', '5'].includes(theme) && is_show('simple_desc'))" class="flex-col" :style="{'gap': new_style.title_simple_desc_spacing * 2 + 'rpx' }">
<view v-if="is_show('title')" :class="text_line" :style="title_style">{{ item.title }}</view>
<view v-if="['0', '1', '2', '3', '5'].includes(theme) && is_show('simple_desc')" class="text-line-1" :style="simple_desc">{{ item.simple_desc }}</view>
</view>
<view v-if="show_content && is_show('plugins_view_icon') && !isEmpty(item.plugins_view_icon_data)" class="flex-row gap-5 align-c">
<view v-for="(icon_data, icon_index) in item.plugins_view_icon_data" :key="icon_index" class="radius text-size-xsss padding-horizontal-xs" :style="{ background: icon_data.bg_color, color: icon_data.color, border: '1rpx solid' + (!isEmpty(icon_data.br_color) ? icon_data.br_color : icon_data.bg_color) }">{{ icon_data.name }}</view>
</view>
@ -219,6 +225,7 @@
sold_number_style: '',
score_style: '',
button_style: '',
simple_desc: '',
};
},
computed: {
@ -277,11 +284,12 @@
style_container: this.propIsCommonStyle ? common_styles_computer(new_style.common_style) : '', //
style_img_container: this.propIsCommonStyle ? common_img_computer(new_style.common_style) : '', //
//
title_style: this.trends_config(new_style, 'title'),
title_style: this.trends_config(new_style, 'title', 'title', new_form.theme),
price_style: this.trends_config(new_style, 'price'),
sold_number_style: this.trends_config(new_style, 'sold_number'),
score_style: this.trends_config(new_style, 'score'),
button_style: this.trends_config(new_style, 'button', 'gradient'),
simple_desc: this.trends_config(new_style, 'simple_desc', 'desc'),
shop_content_list: this.get_shop_content_list(new_list, new_form),
is_show_cart: new_form.shop_button_effect == '1',
});
@ -382,14 +390,22 @@
return this.form.is_show.includes(index);
},
//
trends_config(new_style, key, type) {
return this.style_config(new_style[`shop_${key}_typeface`], new_style[`shop_${key}_size`], new_style[`shop_${key}_color`], type);
trends_config(new_style, key, type, theme) {
return this.style_config(new_style[`shop_${key}_typeface`], new_style[`shop_${key}_size`], new_style[`shop_${key}_color`], type, theme);
},
//
style_config(typeface, size, color, type) {
style_config(typeface, size, color, type, theme) {
let style = `font-weight:${typeface}; font-size: ${size * 2}rpx;`;
if (type == 'gradient') {
style += this.button_gradient;
} else if (type == 'title') {
if (['1', '6'].includes(theme)) {
style += `line-height: ${size}px;height: ${size}px;color: ${color};`;
} else if (['0', '2', '3', '4', '5'].includes(theme)) {
style += `line-height: ${size > 0 ? size + 3 : 0}px;height: ${size > 0 ? (size + 3) * 2 : 0}px;color: ${color};`;
}
} else if (type == 'desc') {
style += `line-height: ${size}px;height: ${size}px;color: ${color};`;
} else {
style += `color: ${color};`;
}

View File

@ -37,7 +37,7 @@
</view>
</view>
<template v-if="form.shop_style_type != '3'">
<view class="flex-row flex-wrap wh-auto ht-auto" :style="{ gap: content_outer_spacing * 2 + 'rpx' }">
<view class="flex-row flex-wrap wh-auto ht-auto" :style="{ gap: content_outer_spacing }">
<view v-for="(item, index) in sckill_list" :key="index" :class="layout_type" :style="layout_type_style + content_radius + (form.shop_style_type == '1' ? content_padding : '')" :data-value="item.goods_url" @tap="url_event">
<template v-if="!isEmpty(item)">
<view class="oh pr">
@ -52,10 +52,13 @@
</view>
</view>
</template>
<view class="flex-col gap-10 wh-auto flex-1 jc-sb" :style="content_style">
<view v-if="is_show('title') || is_show('simple_desc') || is_show('price') || is_show('original_price') || form.is_shop_show == '1'" class="flex-col gap-10 wh-auto flex-1 jc-sb" :style="content_style">
<view class="flex-col gap-10 wh-auto">
<!-- 标题 -->
<view v-if="is_show('title')" :style="title_style" class="text-line-2 multi-text">{{ item.title }}</view>
<view v-if="is_show('title') || is_show('simple_desc')" class="flex-col" :style="{'gap': new_style.title_simple_desc_spacing * 2 + 'rpx' }">
<view v-if="is_show('title')" :style="title_style" class="text-line-2">{{ item.title }}</view>
<view v-if="is_show('simple_desc')" class="text-line-1" :style="simple_desc">{{ item.simple_desc }}</view>
</view>
<!-- 进度条 -->
<!-- <view v-if="form.shop_style_type == '1'" class="flex-row align-c gap-6">
<view class="re flex-1">
@ -114,10 +117,13 @@
</view>
</view>
</template>
<view class="flex-col gap-10 wh-auto flex-1 jc-sb" :style="content_style">
<view v-if="is_show('title') || is_show('simple_desc') || is_show('price') || is_show('original_price') || form.is_shop_show == '1'" class="flex-col gap-10 wh-auto flex-1 jc-sb" :style="content_style">
<view class="flex-col gap-10 wh-auto">
<!-- 标题 -->
<view v-if="is_show('title')" :style="title_style" class="text-line-2 multi-text">{{ item.title }}</view>
<view v-if="is_show('title') || is_show('simple_desc')" class="flex-col" :style="{'gap': new_style.title_simple_desc_spacing * 2 + 'rpx' }">
<view v-if="is_show('title')" :style="title_style" class="text-line-2">{{ item.title }}</view>
<view v-if="is_show('simple_desc')" class="text-line-1" :style="simple_desc">{{ item.simple_desc }}</view>
</view>
<!-- 进度条 -->
<!-- <view v-if="form.shop_style_type == '1'" class="flex-row align-c gap-6">
<view class="re flex-1">
@ -226,6 +232,7 @@
title_style: '',
price_style: '',
button_style: '',
simple_desc: '',
sckill_list: [],
};
},
@ -267,8 +274,8 @@
const { status, time_first_text } = data.current.time;
this.setData({
seckill_time: {
end_time: data.current.time_end,
start_time: data.current.time_start,
time_end_number: Number(data.current.time_end_number + '000'),
time_start_number: Number(data.current.time_start_number + '000'),
status: status,
time_first_text: time_first_text,
},
@ -290,7 +297,7 @@
seckill_head_img_style: this.get_seckill_head_style(new_style, '2'),
style_container: common_styles_computer(new_style.common_style) + 'box-sizing: border-box;',
style_img_container: common_img_computer(new_style.common_style),
content_outer_spacing: new_style.content_outer_spacing,
content_outer_spacing: new_style.content_outer_spacing + 'px',
content_outer_spacing_magin: new_style.content_outer_spacing * 2 + 'rpx',
content_radius: radius_computer(new_style.shop_radius),
content_padding: padding_computer(new_style.shop_padding) + 'box-sizing: border-box;',
@ -301,9 +308,10 @@
corner_marker: this.get_corner_marker(new_style),
slides_per_group: new_style.rolling_fashion == 'translation' ? new_form.carousel_col : 1,
//
title_style: this.trends_config(new_style, 'title'),
title_style: this.trends_config(new_style, 'title', 'title'),
price_style: this.trends_config(new_style, 'price'),
button_style: this.trends_config(new_style, 'button', 'gradient'),
simple_desc: this.trends_config(new_style, 'simple_desc', 'desc'),
list: this.get_shop_content_list(new_list, new_form, new_style),
sckill_list: new_list,
});
@ -370,16 +378,12 @@
}
},
updateCountdown() {
let end_time = this.seckill_time.end_time;
let time_end_number = this.seckill_time.time_end_number;
if (this.seckill_time.status === 0) {
end_time = this.seckill_time.start_time;
time_end_number = this.seckill_time.time_start_number;
}
//
let time = new Date(end_time.replace(/-/g, '/')).getTime();
if (isEmpty(time)) {
time = new Date(end_time).getTime();
}
const distance = time - new Date().getTime();
//
const distance = time_end_number - new Date().getTime();
//
if (distance <= 1000) {
clearInterval(this.intervalId);
@ -387,8 +391,8 @@
if (this.seckill_time.status === 0) {
this.setData({
seckill_time: {
end_time: this.seckill_time.time_end,
start_time: this.seckill_time.time_start,
time_end_number: this.seckill_time.time_end_number,
time_start_number: this.seckill_time.time_start_number,
status: 1,
time_first_text: '距结束',
},
@ -456,6 +460,10 @@
let style = `font-weight:${typeface}; font-size: ${size * 2}rpx;`;
if (type == 'gradient') {
style += this.button_gradient;
} else if (type == 'title') {
style += `line-height: ${size > 0 ? size + 3 : 0}px;height: ${size > 0 ? (size + 3) * 2 : 0}px;color: ${color};`;
} else if (type == 'desc') {
style += `line-height: ${size}px;height: ${size}px;color: ${color};`;
} else {
style += `color: ${color};`;
}
@ -470,7 +478,7 @@
}
// (gap * gap) /
let gap = (new_style.content_outer_spacing * (model_number - 1)) / model_number;
return `calc(${100 / model_number}% - ${gap * 2}rpx)`;
return `calc(${100 / model_number}% - ${gap}px)`;
},
is_show(index) {
return this.form.is_show.includes(index);