sileya-ai
/
vr-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1.测试优化修改 

sws 2024-08-29
v1.0.0
sws 2024-08-29 16:43:29 +08:00
parent 4b7d4a95fc
commit e6600e74e3
3 changed files with 78 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

70
src/components/model-coupon/index.vue
View File

@ -7,14 +7,28 @@
<div class="coupon-theme-1-content tc">
<div class="name">满200元使用</div>
<div class="price">
<span class="size-9">¥</span>
<span class="size-24 fw-b pl-4">30</span>
<span class="size-8">¥</span>
<span class="size-30 fw-b pl-4">30</span>
</div>
</div>
<div class="coupon-btn">立即领取</div>
</div>
</div>
</template>
<template v-else-if="theme == '2'">
<div class="oh flex-row">
<div class="coupon-theme-2">
<div class="coupon-theme-2-content tc">
<div class="price">
<span class="size-8">¥</span>
<span class="size-26 fw-b pl-4">30</span>
</div>
<div class="name">满200元使用</div>
<div class="desc">指定商品可用</div>
</div>
</div>
</div>
</template>
<template v-else-if="theme == '2'"></template>
<template v-else-if="theme == '3'"></template>
<template v-else-if="theme == '4'"></template>
<template v-else-if="theme == '5'"></template>
@ -40,6 +54,7 @@ watch(
(newVal, oldValue) => {
const new_content = newVal?.content || {};
const new_style = newVal?.style || {};
console.log(new_style.common_style);
style_container.value = common_styles_computer(new_style.common_style);
},
{ immediate: true, deep: true }
@ -53,7 +68,7 @@ const theme = computed(() => props.value?.content?.theme);
height: 9rem;
border-radius: 1rem;
margin-top: 1rem;
gap: 3rem;
gap: 2rem;
.name {
padding: 0.5rem;
font-size: 1rem;
@ -61,7 +76,7 @@ const theme = computed(() => props.value?.content?.theme);
}
.price {
color: #ff3830;
padding: 1rem 0;
padding: 0.5rem 0;
}
.coupon-theme-1-content {
width: calc(100% - 1rem);
@ -71,5 +86,48 @@ const theme = computed(() => props.value?.content?.theme);
position: relative;
top: -1rem;
}
.coupon-btn {
margin: 0 auto;
width: 7.1rem;
height: 1.756rem;
line-height: 1.756rem;
text-align: center;
font-size: 0.9rem;
color: #ff3830;
background: #fff1e1;
border-radius: 2.3rem;
position: relative;
top: -0.5rem;
}
}
</style>
.coupon-theme-2 {
background-image: url('../../assets/images/components/model-coupon/theme-2-content-bg.png');
background-size: 100% 100%;
width: 8.5rem;
height: 10rem;
gap: 2rem;
.name {
font-size: 0.8rem;
color: #ff3830;
font-weight: 500;
margin-bottom: 0.5rem;
}
.desc {
font-size: 0.8rem;
color: #999;
}
.price {
color: #ff3830;
padding: 1rem 0 0.5rem 0;
}
.coupon-theme-2-content {
width: calc(100% - 1rem);
margin: 0 0.5rem;
background-image: url('../../assets/images/components/model-coupon/theme-1-bg.png');
background-size: 100% 100%;
position: relative;
top: -1rem;
}
}
</style>

16
src/components/model-coupon/model-coupon-setting.vue
View File

@ -45,9 +45,6 @@ const default_config = {
// 当为主题2时，不显示
background: [{ color: '#fff', color_percentage: undefined }],
spacing: 15,
common_style: {
background_img_url: [{ url: 'http://shopxo.com/static/upload/images/common/2024/08/28/1724815957918121.png' }],
},
},
theme_3: {
price_color: '#FF3830',
@ -116,9 +113,22 @@ const default_config = {
spacing: 10,
},
},
common_style: {
theme_default: {
background_img_url: [],
},
theme_2: {
background_img_url: [{ url: 'http://shopxo.com/static/upload/images/common/2024/08/28/1724815957918121.png' }],
},
},
};
const change_theme = (val: string) => {
if (val) {
if (val == '2') {
form.value.style.common_style = Object.assign({}, form.value.style.common_style, (<arrayIndex>default_config.common_style)[`theme_${Number(val)}`]);
} else {
form.value.style.common_style = Object.assign({}, form.value.style.common_style, default_config.common_style.theme_default);
}
form.value.style = Object.assign({}, form.value.style, (<arrayIndex>default_config.style)[`theme_${Number(val)}`]);
}
};

2
src/layout/components/main/default/coupon.ts
View File

@ -44,7 +44,7 @@ const defaultCoupoin: DefaultCoupon = {
background: [{ color: '#FFF1E1', color_percentage: undefined }],
direction: '90deg',
spacing: 10,
common_style: { ...defaultCommon, padding_left: 25, padding_right: 25, padding_top: 18, padding_bottom: 18 },
common_style: { ...defaultCommon, padding_left: 25, padding_right: 25, padding_top: 18, padding_bottom: 18, color_list: [{ color: '#fff', color_percentage: undefined }] },
},
};