Merge branch 'dev-sws' into dev-yxl
commit
8b31c93016
|
|
@ -4,7 +4,7 @@
|
|||
<card-container class="mb-8">
|
||||
<div class="mb-12">展示设置</div>
|
||||
<el-form-item label="选择风格">
|
||||
<theme-select v-model="form.theme" :data="base_list.themeList"></theme-select>
|
||||
<theme-select v-model="form.theme" :data="base_list.themeList" @update:model-value="themeChange"></theme-select>
|
||||
</el-form-item>
|
||||
</card-container>
|
||||
<card-container class="common-content-height">
|
||||
|
|
@ -46,6 +46,14 @@ const props = defineProps({
|
|||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
styles: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
defaultConfig: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
});
|
||||
const form = reactive(props.value);
|
||||
const url_value_dialog_visible = ref(false);
|
||||
|
|
@ -55,16 +63,20 @@ const base_list = reactive({
|
|||
{ name: '手动', value: '1' },
|
||||
],
|
||||
themeList: [
|
||||
// { name: '风格1', url: new URL(`../../assets/images/components/model-coupon/theme-1.png`, import.meta.url).href },
|
||||
// { name: '风格2', url: new URL(`../../assets/images/components/model-coupon/theme-2.png`, import.meta.url).href },
|
||||
// { name: '风格3', url: new URL(`../../assets/images/components/model-coupon/theme-3.png`, import.meta.url).href },
|
||||
// { name: '风格3', url: new URL(`../../assets/images/components/model-coupon/theme-3.png`, import.meta.url).href },
|
||||
// { name: '风格4', url: new URL(`../../assets/images/components/model-coupon/theme-4.png`, import.meta.url).href },
|
||||
// { name: '风格5', url: new URL(`../../assets/images/components/model-coupon/theme-5.png`, import.meta.url).href },
|
||||
// { name: '风格6', url: new URL(`../../assets/images/components/model-coupon/theme-6.png`, import.meta.url).href },
|
||||
// { name: '风格7', url: new URL(`../../assets/images/components/model-coupon/theme-7.png`, import.meta.url).href },
|
||||
{ id: '1', name: '风格1', url: new URL(`../../assets/images/components/model-coupon/theme-1.png`, import.meta.url).href },
|
||||
{ id: '2', name: '风格2', url: new URL(`../../assets/images/components/model-coupon/theme-2.png`, import.meta.url).href },
|
||||
{ id: '3', name: '风格3', url: new URL(`../../assets/images/components/model-coupon/theme-3.png`, import.meta.url).href },
|
||||
{ id: '4', name: '风格3', url: new URL(`../../assets/images/components/model-coupon/theme-3.png`, import.meta.url).href },
|
||||
{ id: '5', name: '风格4', url: new URL(`../../assets/images/components/model-coupon/theme-4.png`, import.meta.url).href },
|
||||
{ id: '6', name: '风格5', url: new URL(`../../assets/images/components/model-coupon/theme-5.png`, import.meta.url).href },
|
||||
{ id: '7', name: '风格6', url: new URL(`../../assets/images/components/model-coupon/theme-6.png`, import.meta.url).href },
|
||||
{ id: '8', name: '风格7', url: new URL(`../../assets/images/components/model-coupon/theme-7.png`, import.meta.url).href },
|
||||
],
|
||||
});
|
||||
const emit = defineEmits(['update:change-theme']);
|
||||
const themeChange = (val: string) => {
|
||||
emit('update:change-theme', val);
|
||||
};
|
||||
const remove = (index: number) => {
|
||||
form.data_list.splice(index, 1);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<div class="setting-content">
|
||||
<template v-if="type == '1'">
|
||||
<model-coupon-content :value="value.content" :styles="value.style" :default-config="default_config"></model-coupon-content>
|
||||
<model-coupon-content :value="form.content" @update:change-theme="change_theme"></model-coupon-content>
|
||||
</template>
|
||||
<template v-else-if="type == '2'">
|
||||
<model-coupon-styles :value="value.style" :content="value.content" :default-config="default_config"></model-coupon-styles>
|
||||
<model-coupon-styles :value="form.style"></model-coupon-styles>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -19,6 +19,7 @@ const props = defineProps({
|
|||
default: () => {},
|
||||
},
|
||||
});
|
||||
const form = ref(props.value);
|
||||
const default_config = {
|
||||
style: {
|
||||
theme_1: {
|
||||
|
|
@ -71,7 +72,7 @@ const default_config = {
|
|||
// 当为主题34时,间距不给予修改,优惠券沾满整行
|
||||
spacing: 0,
|
||||
},
|
||||
theme5: {
|
||||
theme_5: {
|
||||
price_color: '#FF3830',
|
||||
name_color: '#FF3830',
|
||||
// 主题5时不显示
|
||||
|
|
@ -84,7 +85,7 @@ const default_config = {
|
|||
background: [{ color: '#FFF1E1', color_percentage: '' }],
|
||||
spacing: 10,
|
||||
},
|
||||
theme6: {
|
||||
theme_6: {
|
||||
price_color: '#FF3830',
|
||||
name_color: '#666',
|
||||
// 主题6时不显示
|
||||
|
|
@ -97,7 +98,7 @@ const default_config = {
|
|||
background: [{ color: '#FF3830', color_percentage: '' }],
|
||||
spacing: 10,
|
||||
},
|
||||
theme7: {
|
||||
theme_7: {
|
||||
price_color: '#fff',
|
||||
name_color: '#fff',
|
||||
// 主题7时不显示
|
||||
|
|
@ -115,4 +116,21 @@ const default_config = {
|
|||
},
|
||||
},
|
||||
};
|
||||
const change_theme = (val: string) => {
|
||||
if (val === '1') {
|
||||
form.value.style = default_config.style.theme_1;
|
||||
} else if (val === '2') {
|
||||
form.value.style = default_config.style.theme_2;
|
||||
} else if (val === '3') {
|
||||
form.value.style = default_config.style.theme_3;
|
||||
} else if (val === '4') {
|
||||
form.value.style = default_config.style.theme_4;
|
||||
} else if (val === '5') {
|
||||
form.value.style = default_config.style.theme_5;
|
||||
} else if (val === '6') {
|
||||
form.value.style = default_config.style.theme_6;
|
||||
} else if (val === '7') {
|
||||
form.value.style = default_config.style.theme_7;
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ interface DefaultCoupon {
|
|||
}
|
||||
const defaultCoupoin: DefaultCoupon = {
|
||||
content: {
|
||||
theme: '风格1',
|
||||
theme: '1',
|
||||
data_type: '0',
|
||||
number: 4,
|
||||
title: '先领券 再购物',
|
||||
|
|
|
|||
Loading…
Reference in New Issue