feat: 更新 moment-item 组件，优化展示逻辑，添加案例名称和空间信息支持

packages/app/src/components/moment-item.vue

@@ -116,44 +116,59 @@ onMounted(async () => {
       <div v-if="isVideo" class="aspect-[1.64/1] rounded-lg overflow-hidden my-6" @click.stop>
         <video class="w-full h-full" :src="options.bannerUrls[0]"></video>
       </div>
-      <view
-        v-if="!isVideo"
-        :class="[
-          props.options.bannerUrls?.length > 1 ? 'grid grid-cols-3 grid-gap-1' : 'w-full',
-          'my-6',
-        ]"
-      >
-        <template v-for="it of props.options.bannerUrls" :key="it">
-          <view
-            v-if="options.circleType === '1'"
+      <view v-if="!isVideo" class="my-6">
+        <template v-if="options.circleType === '1'">
+          <div
             :class="[
-              props.options.bannerUrls?.length > 1 ? 'aspect-square' : '',
-              'rounded-lg overflow-hidden',
-              imgClass,
+              props.options.bannerUrls?.length > 1 ? 'grid grid-cols-3 grid-gap-1' : 'w-full',
+              '',
             ]"
           >
-            <wd-img
-              custom-class="vertical-bottom"
-              :width="'100%'"
-              :src="it"
-              :height="props.options.bannerUrls?.length > 1 ? '100%' : 'auto'"
-              :mode="props.options.bannerUrls?.length > 1 ? 'aspectFill' : 'widthFix'"
-            ></wd-img>
-          </view>
-          <view class="aspect-[1.64/1] rounded-lg overflow-hidden" v-else>
-            <wd-img
-              custom-class="vertical-bottom"
-              width="100%"
-              height="100%"
-              :src="it"
-              mode="aspectFill"
-            ></wd-img>
-          </view>
+            <template v-for="it of props.options.bannerUrls" :key="it">
+              <view
+                :class="[
+                  props.options.bannerUrls?.length > 1 ? 'aspect-square' : '',
+                  'rounded-lg overflow-hidden',
+                  imgClass,
+                ]"
+              >
+                <wd-img
+                  custom-class="vertical-bottom"
+                  :width="'100%'"
+                  :src="it"
+                  :height="props.options.bannerUrls?.length > 1 ? '100%' : 'auto'"
+                  :mode="props.options.bannerUrls?.length > 1 ? 'aspectFill' : 'widthFix'"
+                ></wd-img>
+              </view>
+            </template>
+          </div>
         </template>
+        <view class="aspect-[1.64/1] rounded-lg overflow-hidden" v-else>
+          <wd-img
+            custom-class="vertical-bottom"
+            width="100%"
+            height="100%"
+            :src="options.bannerUrls[0]"
+            mode="aspectFill"
+          ></wd-img>
+        </view>
       </view>
       <view class="text-[rgba(0,0,0,0.85)] text-4 font-400 my-1">
-        {{ props.options.circleDesc }}
+        <template v-if="options.circleType === '2'">
+          <span>{{ options.circleType }}</span>
+          <span class="mx-4">|</span>
+          <span>{{ options.caseName }}</span>
+        </template>
+        <template v-else>{{ options.circleDesc }}</template>
       </view>
+      <div
+        v-if="options.circleType === '2'"
+        class="mt-4 text-black/40 text-sm font-normal font-['PingFang_SC']"
+      >
+        <!-- 龙湖狮山天街生活广场三期·780 m²·全案定制 -->
+        <!-- {{ options.spaceAddr }}·{{ options.spaceType }}·{{ options.designStyle }} -->
+        {{ options.circleDesc }}
+      </div>
       <view class="my-5.5 flex flex-wrap gap-3.5">
         <template v-if="props.options.tagName !== ''">
           <template v-for="it of props.options.tagName?.split(',')" :key="it">

packages/app/src/core/libs/requests.ts

@@ -1031,4 +1031,6 @@ export interface CircleRes {
   upvoteCount?: number
   ownUpvote: boolean
   reviewCount: number
+  caseName?: string
+  spaceExtent?: string
 }

packages/app/src/pages/home/moment/index.vue

@@ -31,6 +31,7 @@ import { usePermissions } from '../../../composables/permissions'
 import mpHtml from 'mp-html/dist/uni-app/components/mp-html/mp-html.vue'
 import WdInput from 'wot-design-uni/components/wd-input/wd-input.vue'
 import { getRect, addUnit } from 'wot-design-uni/components/common/util'
+import Card from '@/components/card.vue'
 
 const { features } = usePermissions()
 const userStore = useUserStore()
@@ -201,10 +202,40 @@ onShareAppMessage(async ({ from, target }) => {
         <video width="100%" class="w-full aspect-[1.64/1]" :src="data?.bannerUrls[0]"></video>
       </template>
     </template>
+    <template v-if="data.circleType === '2'">
+      <div>
+        <wd-img width="100%" mode="widthFix" :src="data.bannerUrls[0]"></wd-img>
+        <div class="relative">
+          <div
+            class="absolute top-0 left-3.5 right-3.5 box-border h-full flex items-center justify-center"
+          >
+            <div class="w-full px-4 py-7 bg-white rounded-2xl shadow">
+              <div class="text-black/90 text-xl font-normal font-['PingFang_SC']">
+                设计案例：{{ data?.caseName }}
+              </div>
+              <div class="mt-4 flex items-center justify-between text-black/40 text-sm">
+                <div class="font-normal font-['PingFang_SC']">类别:{{ data.spaceType }}</div>
+                |
+                <div class="text-black/40 text-sm font-normal font-['PingFang_SC']">
+                  风格:{{ data.designStyle }}
+                </div>
+                |
+                <div class="text-black/40 text-sm font-normal font-['PingFang_SC']">
+                  面积:{{ data.spaceExtent }}
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </template>
+    <div v-if="data.circleType === '2'" class="mt-24 px-3.5">
+      <SectionHeading custom-class="" title="案例描述"></SectionHeading>
+    </div>
     <view v-if="data.circleType === '3'">
       <mpHtml :content="data.detailsDesc"></mpHtml>
     </view>
-    <view class="m-3.5">
+    <view class="m-3.5" :class="data.circleType === '2' ? 'mx-7' : ''">
       <div class="text-black/90 text-base font-normal font-['PingFang_SC']">
         {{ data?.circleDesc }}
       </div>
@@ -216,6 +247,14 @@ onShareAppMessage(async ({ from, target }) => {
           </template>
         </template>
       </view>
+    </view>
+    <div v-if="data.circleType === '2'" class="mb-4">
+      <SectionHeading custom-class="mx-3.5 my-7" title="效果图"></SectionHeading>
+      <template v-for="(it, i) in data?.bannerUrls.slice(1, data?.bannerUrls?.length)" :key="i">
+        <wd-img width="100%" mode="widthFix" :src="it"></wd-img>
+      </template>
+    </div>
+    <div class="mx-3.5">
       <div class="text-black/30 text-xs font-normal font-['PingFang_SC'] leading-[10.18px]">
         {{ dayjs(data.createTime).format('YYYY-MM-DD HH:mm') }}
       </div>
@@ -288,7 +327,7 @@ onShareAppMessage(async ({ from, target }) => {
           </view>
         </template>
       </view>
-    </view>
+    </div>
     <BottomAppBar fixed placeholder border custom-class="">
       <div class="bg-white flex items-center">
         <div class="w-[168px] bg-[#f6f6f6] rounded-[60px] px-3.5 py-2 flex items-center">