sws
parent
cad27484dd
commit
49070e7118
|
|
@ -51,9 +51,6 @@
|
|||
<el-form-item label="文章间距">
|
||||
<slider v-model="form.article_spacing"></slider>
|
||||
</el-form-item>
|
||||
<el-form-item label="文章间距">
|
||||
<slider v-model="form.article_spacing"></slider>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="article_style == '3'" label="内容宽度">
|
||||
<slider v-model="form.article_width" :max="1000"></slider>
|
||||
</el-form-item>
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@ watch(
|
|||
const new_style = newVal?.style;
|
||||
let new_data = newVal;
|
||||
new_data.content.article_check = new_data.content.tabs_list[0].article_check;
|
||||
new_data.content.article_type = new_data.content.tabs_list[0].article_type;
|
||||
new_data.content.article_category = new_data.content.tabs_list[0].article_category;
|
||||
new_data.content.number = new_data.content.tabs_list[0].number;
|
||||
new_data.content.sort = new_data.content.tabs_list[0].sort;
|
||||
new_data.content.sort_rules = new_data.content.tabs_list[0].sort_rules;
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<model-article-tabs-content :value="value.content"></model-article-tabs-content>
|
||||
</template>
|
||||
<template v-else-if="type == '2'">
|
||||
<model-article-tabs-styles :value="value.style"></model-article-tabs-styles>
|
||||
<model-article-tabs-styles :value="value.style" :content="value.content"></model-article-tabs-styles>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -65,11 +65,26 @@
|
|||
<color-picker v-model="form.page_view_color"></color-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="内容圆角">
|
||||
<radius :value="form"></radius>
|
||||
<radius :value="form.content_radius"></radius>
|
||||
</el-form-item>
|
||||
<el-form-item label="图片圆角">
|
||||
<radius :value="form.img_radius"></radius>
|
||||
</el-form-item>
|
||||
<el-form-item label="内间距">
|
||||
<padding :value="form.padding"></padding>
|
||||
</el-form-item>
|
||||
<el-form-item label="内容间距">
|
||||
<slider v-model="form.content_spacing"></slider>
|
||||
</el-form-item>
|
||||
<el-form-item label="文章间距">
|
||||
<slider v-model="form.article_spacing"></slider>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="article_style == '3'" label="内容宽度">
|
||||
<slider v-model="form.article_width" :max="1000"></slider>
|
||||
</el-form-item>
|
||||
</card-container>
|
||||
</el-form>
|
||||
<common-styles :value="form" @update:value="common_styles_update" />
|
||||
<common-styles :value="form.common_style" @update:value="common_styles_update" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
|
|
@ -79,9 +94,19 @@ const props = defineProps({
|
|||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
content: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
});
|
||||
// 默认值
|
||||
let form = ref(props.value);
|
||||
const state = reactive({
|
||||
form: props.value,
|
||||
data: props.content,
|
||||
});
|
||||
// 如果需要解构，确保使用toRefs
|
||||
const { form, data } = toRefs(state);
|
||||
const article_style = computed(() => data.value.article_style);
|
||||
const font_weight = reactive([
|
||||
{ name: '加粗', value: '500' },
|
||||
{ name: '正常', value: '400' },
|
||||
|
|
|
|||
|
|
@ -23,11 +23,10 @@ interface DefaultArticleTabs {
|
|||
tabs_top_up: boolean;
|
||||
article_style: string;
|
||||
tabs_list: articleTabsList[];
|
||||
|
||||
is_show: string[];
|
||||
};
|
||||
style: {
|
||||
tabs_checked: string[];
|
||||
tabs_checked: color_list[];
|
||||
tabs_direction: string;
|
||||
tabs_weight_checked: string;
|
||||
tabs_size_checked: number;
|
||||
|
|
@ -44,11 +43,12 @@ interface DefaultArticleTabs {
|
|||
page_view_weight: string;
|
||||
page_view_size: number;
|
||||
page_view_color: string;
|
||||
radius: number;
|
||||
radius_top_left: number;
|
||||
radius_top_right: number;
|
||||
radius_bottom_left: number;
|
||||
radius_bottom_right: number;
|
||||
content_radius: radiusStyle;
|
||||
img_radius: radiusStyle;
|
||||
padding: paddingStyle;
|
||||
article_spacing: number;
|
||||
content_spacing: number;
|
||||
article_width: number;
|
||||
common_style: object;
|
||||
};
|
||||
}
|
||||
|
|
@ -68,7 +68,10 @@ const defaultArticleTabs: DefaultArticleTabs = {
|
|||
is_show: ['0', '1'],
|
||||
},
|
||||
style: {
|
||||
tabs_checked: ['rgba(212,212,212,1)', 'rgba(255,210,210,1)'],
|
||||
tabs_checked: [
|
||||
{ color: 'rgba(212,212,212,2)', color_percentage: '' },
|
||||
{ color: 'rgba(255,210,210,1)', color_percentage: '' },
|
||||
],
|
||||
tabs_direction: '90deg',
|
||||
tabs_weight_checked: '500',
|
||||
tabs_size_checked: 14,
|
||||
|
|
@ -85,11 +88,33 @@ const defaultArticleTabs: DefaultArticleTabs = {
|
|||
page_view_weight: '400',
|
||||
page_view_size: 12,
|
||||
page_view_color: 'rgba(153, 153, 153, 1)',
|
||||
radius: 8,
|
||||
radius_top_left: 8,
|
||||
radius_top_right: 8,
|
||||
radius_bottom_left: 8,
|
||||
radius_bottom_right: 8,
|
||||
// 内容圆角
|
||||
content_radius: {
|
||||
radius: 8,
|
||||
radius_top_left: 8,
|
||||
radius_top_right: 8,
|
||||
radius_bottom_left: 8,
|
||||
radius_bottom_right: 8,
|
||||
},
|
||||
// 图片圆角
|
||||
img_radius: {
|
||||
radius: 0,
|
||||
radius_top_left: 0,
|
||||
radius_top_right: 0,
|
||||
radius_bottom_left: 0,
|
||||
radius_bottom_right: 0,
|
||||
},
|
||||
// 内间距
|
||||
padding: {
|
||||
padding: 10,
|
||||
padding_top: 10,
|
||||
padding_bottom: 10,
|
||||
padding_left: 10,
|
||||
padding_right: 10,
|
||||
},
|
||||
content_spacing: 10, // 内容间距
|
||||
article_spacing: 10, // 文章间距
|
||||
article_width: 160, // 文章宽度
|
||||
common_style: { ...defaultCommon, padding_left: 10, padding_right: 10, padding_bottom: 10 },
|
||||
},
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue