feat(uniapp): 新增辅助空白/辅助线/富文本楼层渲染

This commit is contained in:
pikachu1995@126.com
2026-10-12 10:26:00 +08:00
parent a32f6d2313
commit fb10038547
6 changed files with 1005 additions and 925 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -43,6 +43,9 @@
<notice v-if="item.type == 'notice'" :res="item.options" />
<promotions v-if="item.type == 'promotionDetail'" :res="item.options" />
<videoLayout v-if="item.type == 'video'" :res="item.options" />
<blank v-if="item.type == 'blank'" :res="item.options" />
<lineLayout v-if="item.type == 'line'" :res="item.options" />
<richText v-if="item.type == 'richText'" :res="item.options" />
</view>
<fetchCoupon ref="couponRef" />
</view>
@@ -78,6 +81,9 @@ import goods from '@/pages/tabbar/home/template/tpl_goods.vue'
import notice from '@/pages/tabbar/home/template/tpl_notice.vue'
import promotions from '@/pages/tabbar/home/template/tpl_promotions_detail.vue'
import fetchCoupon from '@/pages/tabbar/home/template/fetch_coupon.vue'
import blank from '@/pages/tabbar/home/template/tpl_blank.vue'
import lineLayout from '@/pages/tabbar/home/template/tpl_line.vue'
import richText from '@/pages/tabbar/home/template/tpl_rich_text.vue'
import { getFloorData } from '@/api/home'
const HOME_LAYOUT_PADDING_RPX = 16

View File

@@ -0,0 +1,15 @@
<template>
<view class="tpl-blank" :style="blankStyle"></view>
</template>
<script setup lang="ts">
import { computed } from "vue";
const props = defineProps<{ res: any }>();
const blankStyle = computed(() => ({
background: props.res?.bgColor || "#f5f5f5",
height: `${props.res?.height ?? 10}rpx`,
margin: `0 ${props.res?.paddingX ?? 0}rpx ${props.res?.pageGap ?? 10}rpx`,
}));
</script>

View File

@@ -0,0 +1,21 @@
<template>
<view class="tpl-line" :style="wrapperStyle">
<view :style="lineStyle"></view>
</view>
</template>
<script setup lang="ts">
import { computed } from "vue";
const props = defineProps<{ res: any }>();
const wrapperStyle = computed(() => ({
background: props.res?.bgColor || "#FFFFFF",
padding: `0 ${props.res?.paddingX ?? 0}rpx`,
marginBottom: `${props.res?.pageGap ?? 10}rpx`,
}));
const lineStyle = computed(() => ({
borderTop: `${props.res?.lineHeight ?? 1}rpx ${props.res?.lineStyle || "dashed"} ${props.res?.lineColor || "#979797"}`,
}));
</script>

View File

@@ -0,0 +1,26 @@
<template>
<view class="tpl-rich-text" :style="wrapperStyle">
<rich-text :nodes="processedHtml"></rich-text>
</view>
</template>
<script setup lang="ts">
import { computed } from "vue";
const props = defineProps<{ res: any }>();
const wrapperStyle = computed(() => ({
background: props.res?.bgColor || "#FFFFFF",
padding: `0 ${props.res?.paddingX ?? 12}rpx`,
marginBottom: `${props.res?.pageGap ?? 10}rpx`,
borderRadius: `${props.res?.borderRadius ?? 0}rpx`,
overflow: "hidden",
}));
// 防止富文本内图片超宽撑破布局
const processedHtml = computed(() => {
const html = props.res?.content;
if (!html) return "";
return String(html).replace(/<img/gi, '<img style="max-width:100%;height:auto;"');
});
</script>

View File

@@ -44,6 +44,9 @@
<!-- <integral v-if="item.type == 'integral'" :res="item.options" /> -->
<!-- <spike v-if="item.type == 'spike'" :res="item.options" /> -->
<videoLayout v-if="item.type == 'video'" :res="item.options" />
<blank v-if="item.type == 'blank'" :res="item.options" />
<lineLayout v-if="item.type == 'line'" :res="item.options" />
<richText v-if="item.type == 'richText'" :res="item.options" />
</div>
<u-no-network></u-no-network>
</div>
@@ -71,6 +74,9 @@ import videoLayout from '@/pages/tabbar/home/template/tpl_video'
import goods from '@/pages/tabbar/home/template/tpl_goods'
import notice from '@/pages/tabbar/home/template/tpl_notice'
import promotions from '@/pages/tabbar/home/template/tpl_promotions_detail'
import blank from '@/pages/tabbar/home/template/tpl_blank'
import lineLayout from '@/pages/tabbar/home/template/tpl_line'
import richText from '@/pages/tabbar/home/template/tpl_rich_text'
import { toSpecial, getSpecial } from '@/api/home'
import permision from '@/js_sdk/wa-permission/permission.js'
import config from '@/config/config'