|
@@ -1,36 +1,56 @@
|
|
|
<template>
|
|
<template>
|
|
|
|
|
+ <!--通用内容首页小分块组件-->
|
|
|
<FlexCol width="100%">
|
|
<FlexCol width="100%">
|
|
|
<!-- 分类 -->
|
|
<!-- 分类 -->
|
|
|
<template v-for="category in categoryDatas" :key="category.title">
|
|
<template v-for="category in categoryDatas" :key="category.title">
|
|
|
<HomeTitle
|
|
<HomeTitle
|
|
|
:title="category.title"
|
|
:title="category.title"
|
|
|
- showMore
|
|
|
|
|
|
|
+ :showMore="category.showMore !== false"
|
|
|
moreText="更多"
|
|
moreText="更多"
|
|
|
@clickMore="category.morePage"
|
|
@clickMore="category.morePage"
|
|
|
/>
|
|
/>
|
|
|
<SimplePageContentLoader :loader="category.data" >
|
|
<SimplePageContentLoader :loader="category.data" >
|
|
|
<FlexCol>
|
|
<FlexCol>
|
|
|
- <template v-if="category.type !== 'article'">
|
|
|
|
|
- <Box2LineImageRightShadow
|
|
|
|
|
- v-for="(item, i) in category.data.content.value"
|
|
|
|
|
- titleColor="title-text"
|
|
|
|
|
- fixSize
|
|
|
|
|
- :key="i"
|
|
|
|
|
|
|
+ <template v-if="category.type === 'article'">
|
|
|
|
|
+ <Box2LineRightShadow
|
|
|
|
|
+ v-for="(item, i) in category.data.content.value"
|
|
|
|
|
+ :key="i"
|
|
|
:title="item.title"
|
|
:title="item.title"
|
|
|
:desc="item.desc"
|
|
:desc="item.desc"
|
|
|
- :image="item.image"
|
|
|
|
|
:tags="(item.bottomTags as string[])"
|
|
:tags="(item.bottomTags as string[])"
|
|
|
- @click="category.detailPage(item.id)"
|
|
|
|
|
|
|
+ @click="category.detailPage(item)"
|
|
|
/>
|
|
/>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
+ <template v-else-if="category.type === 'large-image2'">
|
|
|
|
|
+ <scroll-view scroll-x>
|
|
|
|
|
+ <FlexRow>
|
|
|
|
|
+ <Box2LineLargeImageUserShadow
|
|
|
|
|
+ v-for="(item, i) in category.data.content.value"
|
|
|
|
|
+ classNames="width-2-3 mr-2"
|
|
|
|
|
+ titleColor="title-text"
|
|
|
|
|
+ fixSize
|
|
|
|
|
+ title1
|
|
|
|
|
+ :key="i"
|
|
|
|
|
+ :title="item.title"
|
|
|
|
|
+ :desc="item.desc"
|
|
|
|
|
+ :image="item.image"
|
|
|
|
|
+ :tags="(item.bottomTags as string[])"
|
|
|
|
|
+ @click="category.detailPage(item)"
|
|
|
|
|
+ />
|
|
|
|
|
+ </FlexRow>
|
|
|
|
|
+ </scroll-view>
|
|
|
|
|
+ </template>
|
|
|
<template v-else>
|
|
<template v-else>
|
|
|
- <Box2LineRightShadow
|
|
|
|
|
- v-for="(item, i) in category.data.content.value"
|
|
|
|
|
- :key="i"
|
|
|
|
|
|
|
+ <Box2LineImageRightShadow
|
|
|
|
|
+ v-for="(item, i) in category.data.content.value"
|
|
|
|
|
+ titleColor="title-text"
|
|
|
|
|
+ fixSize
|
|
|
|
|
+ :key="i"
|
|
|
:title="item.title"
|
|
:title="item.title"
|
|
|
:desc="item.desc"
|
|
:desc="item.desc"
|
|
|
|
|
+ :image="item.image"
|
|
|
:tags="(item.bottomTags as string[])"
|
|
:tags="(item.bottomTags as string[])"
|
|
|
- @click="category.detailPage(item.id)"
|
|
|
|
|
|
|
+ @click="category.detailPage(item)"
|
|
|
/>
|
|
/>
|
|
|
</template>
|
|
</template>
|
|
|
</FlexCol>
|
|
</FlexCol>
|
|
@@ -46,19 +66,22 @@ import Box2LineImageRightShadow from '@/pages/parts/Box2LineImageRightShadow.vue
|
|
|
import Box2LineRightShadow from '@/pages/parts/Box2LineRightShadow.vue';
|
|
import Box2LineRightShadow from '@/pages/parts/Box2LineRightShadow.vue';
|
|
|
import FlexCol from '@/components/layout/FlexCol.vue';
|
|
import FlexCol from '@/components/layout/FlexCol.vue';
|
|
|
import type { PropType } from 'vue';
|
|
import type { PropType } from 'vue';
|
|
|
-import { CommonContentApi, GetContentListParams } from '@/api/CommonContent';
|
|
|
|
|
-import { navHomePageMiniCommonDetailGo, navHomePageMiniCommonListGo, resolveCommonContentFormData, type IHomeCommonCategoryBlock } from './CommonContent';
|
|
|
|
|
|
|
+import { CommonContentApi, GetContentListItem, GetContentListParams } from '@/api/CommonContent';
|
|
|
|
|
+import { navCommonDetail, navCommonList, resolveCommonContentFormData, resolveCommonContentGetPageDetailUrlAuto, type IHomeCommonCategoryBlock } from './CommonContent';
|
|
|
import { useSimpleDataLoader } from '@/common/composeabe/SimpleDataLoader';
|
|
import { useSimpleDataLoader } from '@/common/composeabe/SimpleDataLoader';
|
|
|
import { navTo } from '@/components/utils/PageAction';
|
|
import { navTo } from '@/components/utils/PageAction';
|
|
|
import { DateUtils } from '@imengyu/imengyu-utils';
|
|
import { DateUtils } from '@imengyu/imengyu-utils';
|
|
|
|
|
+import FlexRow from '@/components/layout/FlexRow.vue';
|
|
|
|
|
+import Box2LineLargeImageUserShadow from '@/pages/parts/Box2LineLargeImageUserShadow.vue';
|
|
|
|
|
|
|
|
export interface CategoryDefine {
|
|
export interface CategoryDefine {
|
|
|
title: string;
|
|
title: string;
|
|
|
content: CommonContentApi|IHomeCommonCategoryBlock;
|
|
content: CommonContentApi|IHomeCommonCategoryBlock;
|
|
|
- type?: 'article'|''|undefined;
|
|
|
|
|
|
|
+ type?: 'article'|'large-image2'|''|undefined;
|
|
|
detailPage?: string;
|
|
detailPage?: string;
|
|
|
morePage?: string;
|
|
morePage?: string;
|
|
|
noFrom?: boolean;
|
|
noFrom?: boolean;
|
|
|
|
|
+ showMore?: boolean;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
const props = defineProps({
|
|
const props = defineProps({
|
|
@@ -70,19 +93,23 @@ const props = defineProps({
|
|
|
|
|
|
|
|
const categoryDatas = props.categoryDefine.map(item => ({
|
|
const categoryDatas = props.categoryDefine.map(item => ({
|
|
|
...item,
|
|
...item,
|
|
|
- detailPage: (id: number) => {
|
|
|
|
|
|
|
+ detailPage: (dataItem: GetContentListItem) => {
|
|
|
|
|
+ const id = dataItem.id;
|
|
|
if (item.content instanceof CommonContentApi) {
|
|
if (item.content instanceof CommonContentApi) {
|
|
|
if (item.detailPage) {
|
|
if (item.detailPage) {
|
|
|
- navTo(item.detailPage, { id });
|
|
|
|
|
|
|
+ if (item.detailPage === 'byContent')
|
|
|
|
|
+ navTo(resolveCommonContentGetPageDetailUrlAuto(dataItem), { id });
|
|
|
|
|
+ else
|
|
|
|
|
+ navTo(item.detailPage, { id });
|
|
|
} else {
|
|
} else {
|
|
|
- navHomePageMiniCommonDetailGo({
|
|
|
|
|
|
|
+ navCommonDetail({
|
|
|
id,
|
|
id,
|
|
|
mainBodyColumnId: item.content.mainBodyColumnId,
|
|
mainBodyColumnId: item.content.mainBodyColumnId,
|
|
|
modelId: item.content.modelId,
|
|
modelId: item.content.modelId,
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
|
} else {
|
|
} else {
|
|
|
- item.content.goDetail(id);
|
|
|
|
|
|
|
+ item.content.goDetail(dataItem);
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
morePage: () => {
|
|
morePage: () => {
|
|
@@ -90,7 +117,7 @@ const categoryDatas = props.categoryDefine.map(item => ({
|
|
|
if (item.morePage) {
|
|
if (item.morePage) {
|
|
|
navTo(item.morePage, {});
|
|
navTo(item.morePage, {});
|
|
|
} else {
|
|
} else {
|
|
|
- navHomePageMiniCommonListGo({
|
|
|
|
|
|
|
+ navCommonList({
|
|
|
title: item.title,
|
|
title: item.title,
|
|
|
mainBodyColumnId: item.content.mainBodyColumnId,
|
|
mainBodyColumnId: item.content.mainBodyColumnId,
|
|
|
modelId: item.content.modelId,
|
|
modelId: item.content.modelId,
|