+
{{ !isEmpty(item.new_title) ? item.new_title : item.data.title }}
+
{{ field_show.includes('0') ? '2020-06-05 15:20' : '' }}
16
@@ -119,17 +119,19 @@ watch(
// 文章间距
article_spacing.value = `gap: ${new_style.article_spacing}px;`;
// 文章样式
- article_style.value = content_radius.value + content_spacing.value;
+ article_style.value = content_spacing.value;
+ style.value = '';
if (article_theme.value == '0') {
- article_style.value += content_padding.value;
- }
- if (article_theme.value == '1') {
+ article_style.value += content_padding.value + content_radius.value;
+ } else if (article_theme.value == '1') {
article_spacing_children.value = `width: calc(50% - ${new_style.article_spacing / 2}px);`;
- article_style.value += article_spacing_children.value;
- }
- if (article_theme.value == '3') {
+ article_style.value += article_spacing_children.value + content_radius.value;
+ } else if (article_theme.value == '3') {
+ style.value = `padding: 0 ${new_style.content_spacing}px;background:#fff;` + content_radius.value;
+ } else if (article_theme.value == '4') {
article_item_width.value = `${new_style.article_width}px`;
article_item_height.value = `${new_style.article_height}px`;
+ article_style.value += content_radius.value;
}
if (new_style.common_style && props.isCommonStyle) {
style_container.value = common_styles_computer(new_style.common_style);
@@ -146,7 +148,9 @@ const article_theme_class = computed(() => {
case '2':
return 'style3 flex-col';
case '3':
- return 'style4 flex-row';
+ return 'style4 flex-col';
+ case '4':
+ return 'style5 flex-row';
}
return `style${article_theme.value}`;
});
@@ -203,6 +207,14 @@ const get_auto_data_list = async (new_content: any) => {
}
}
.style4 {
+ .item {
+ width: 100%;
+ &:not(:last-child) {
+ border-bottom: 0.1rem solid #eee;
+ }
+ }
+}
+.style5 {
.item {
min-width: v-bind(article_item_width);
width: v-bind(article_item_width);
diff --git a/src/components/model-article-list/model-article-list-content.vue b/src/components/model-article-list/model-article-list-content.vue
index 77d01ea6..f120491f 100644
--- a/src/components/model-article-list/model-article-list-content.vue
+++ b/src/components/model-article-list/model-article-list-content.vue
@@ -4,7 +4,7 @@
展示设置
-
+
{{ item.name }}
@@ -77,7 +77,8 @@ const base_list = reactive({
{ name: '单列展示', value: '0' },
{ name: '两列展示(纵向)', value: '1' },
{ name: '大图展示', value: '2' },
- { name: '左右滑动展示', value: '3' },
+ { name: '无图模式', value: '3' },
+ { name: '左右滑动展示', value: '4' },
],
data_type_list: [
{ name: '选择文章', value: '0' },
@@ -118,6 +119,9 @@ const init = () => {
base_list.article_category_list = article_store.article;
}
};
+const theme_change = (val: any) => {
+ form.field_show = ['1'];
+};
const data_list_remove = (index: number) => {
form.data_list.splice(index, 1);
diff --git a/src/components/model-article-list/model-article-list-styles.vue b/src/components/model-article-list/model-article-list-styles.vue
index c6cb11d4..53689b9a 100644
--- a/src/components/model-article-list/model-article-list-styles.vue
+++ b/src/components/model-article-list/model-article-list-styles.vue
@@ -39,19 +39,23 @@
-
-
-
+
+
+
+
+
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
@@ -82,7 +86,7 @@ const state = reactive({
});
// 如果需要解构,确保使用toRefs
const { form, data } = toRefs(state);
-const article_style = computed(() => data.value.article_style);
+const theme = computed(() => data.value.theme);
const emit = defineEmits(['update:value']);
const font_weight = reactive([
{ name: '加粗', value: '500' },
diff --git a/src/components/model-article-tabs/model-article-tabs-content.vue b/src/components/model-article-tabs/model-article-tabs-content.vue
index b561fa93..bd2c6926 100644
--- a/src/components/model-article-tabs/model-article-tabs-content.vue
+++ b/src/components/model-article-tabs/model-article-tabs-content.vue
@@ -106,7 +106,8 @@ const base_list = reactive({
{ name: '单列展示', value: '0' },
{ name: '两列展示(纵向)', value: '1' },
{ name: '大图展示', value: '2' },
- { name: '左右滑动展示', value: '3' },
+ { name: '无图模式', value: '3' },
+ { name: '左右滑动展示', value: '4' },
],
data_type_list: [
{ name: '选择文章', value: '0' },
diff --git a/src/components/model-article-tabs/model-article-tabs-styles.vue b/src/components/model-article-tabs/model-article-tabs-styles.vue
index 10752256..9762d32e 100644
--- a/src/components/model-article-tabs/model-article-tabs-styles.vue
+++ b/src/components/model-article-tabs/model-article-tabs-styles.vue
@@ -67,19 +67,23 @@
-
-
-
+
+
+
+
+
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
@@ -111,7 +115,7 @@ const state = reactive({
});
// 如果需要解构,确保使用toRefs
const { form, data } = toRefs(state);
-const article_style = computed(() => data.value.article_style);
+const theme = computed(() => data.value.theme);
const font_weight = reactive([
{ name: '加粗', value: '500' },
{ name: '正常', value: '400' },