zoujing/YGChatCS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 调整样式

Browse Source
This commit is contained in:
zoujing
2026-06-05 11:46:15 +08:00
parent 3e06ae544b
commit fa04507134
3 changed files with 14 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/pages/ChatMain/ChatLongAnswer/ParsedValueView.vue
View File

@@ -19,11 +19,11 @@
<template v-else-if="shouldRenderQuestionSuggest"> <template v-else-if="shouldRenderQuestionSuggest">
<view class="detail-action-label">继续追问</view> <view class="detail-action-label">继续追问</view>
<view class="detail-faq-wrap"> <scroll-view class="detail-faq-wrap" scroll-x>
<view v-for="question in questionSuggestItems" :key="question" class="detail-faq-chip" @click="sendReply(question)"> <view v-for="question in questionSuggestItems" :key="question" class="detail-faq-chip" @click="sendReply(question)">
{{ question }} {{ question }}
</view> </view>
</view> </scroll-view>
</template> </template>
<template v-else-if="shouldRenderCommodityList"> <template v-else-if="shouldRenderCommodityList">
@@ -35,6 +35,7 @@
v-for="commodity in commodityItems" v-for="commodity in commodityItems"
:key="commodity.commodity_id || commodity.commodity_name" :key="commodity.commodity_id || commodity.commodity_name"
class="detail-product-card" class="detail-product-card"
:class="{ 'detail-product-card--full': isSingleCommodity }"
> >
<image <image
v-if="commodity.commodity_photo" v-if="commodity.commodity_photo"
@@ -299,6 +300,7 @@ const getCommodityItems = (value) => {
}; };
const commodityItems = computed(() => getCommodityItems(displayValue.value)); const commodityItems = computed(() => getCommodityItems(displayValue.value));
const isSingleCommodity = computed(() => commodityItems.value.length === 1);
const getPhotoItems = (value) => { const getPhotoItems = (value) => {
if (!isArrayValue(value)) return []; if (!isArrayValue(value)) return [];

2
src/pages/ChatMain/ChatLongAnswer/index.vue
View File

@@ -7,7 +7,7 @@
<!-- ✅ 滚动区域 --> <!-- ✅ 滚动区域 -->
<scroll-view class="flex-full overflow-hidden chat-scroll" scroll-y :scroll-into-view="scrollIntoViewId" scroll-with-animation @scroll="onScroll" @touchstart="onTouchStart" @touchend="onTouchEnd" @touchcancel="onTouchEnd"> <scroll-view class="flex-full overflow-hidden chat-scroll" scroll-y :scroll-into-view="scrollIntoViewId" scroll-with-animation @scroll="onScroll" @touchstart="onTouchStart" @touchend="onTouchEnd" @touchcancel="onTouchEnd">
<view class="flex flex-col pt-12 px-16 pb-24 border-box gap-2"> <view class="flex flex-col pt-12 px-16 pb-24 border-box gap-8">
<view v-if="headerSections.title || headerSections.tag" class="long-answer-header"> <view v-if="headerSections.title || headerSections.tag" class="long-answer-header">
<view v-if="headerSections.title" class="long-answer-title"> <view v-if="headerSections.title" class="long-answer-title">
{{ headerSections.title.contentValue }} {{ headerSections.title.contentValue }}

10
src/pages/ChatMain/ChatLongAnswer/styles/ParsedValueView.scss
View File

@@ -61,7 +61,7 @@
} }
.detail-action-label { .detail-action-label {
padding: 0 0 10px; padding: 12px 0 10px;
color: #94a3b8; color: #94a3b8;
font-size: 10px; font-size: 10px;
font-weight: 900; font-weight: 900;
@@ -148,6 +148,7 @@
.detail-product-card { .detail-product-card {
width: 220px; width: 220px;
box-sizing: border-box;
flex-shrink: 0; flex-shrink: 0;
overflow: hidden; overflow: hidden;
border: 1px solid #f1f5f9; border: 1px solid #f1f5f9;
@@ -156,6 +157,10 @@
box-shadow: 0 2px 12px rgba(15, 23, 42, 0.04); box-shadow: 0 2px 12px rgba(15, 23, 42, 0.04);
} }
.detail-product-card--full {
width: 100%;
}
.detail-product-image { .detail-product-image {
width: 100%; width: 100%;
height: 110px; height: 110px;
@@ -322,12 +327,15 @@
} }
.detail-faq-wrap { .detail-faq-wrap {
width: 100%;
margin: 0; margin: 0;
white-space: nowrap;
} }
.detail-faq-chip { .detail-faq-chip {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
flex-shrink: 0;
gap: 5px; gap: 5px;
margin: 0 6px 8px 0; margin: 0 6px 8px 0;
padding: 8px 13px; padding: 8px 13px;