From f1205c344f71962ece5e1b7c457066bb39e2df82 Mon Sep 17 00:00:00 2001
From: wujingling0908 <2.com>
Date: Mon, 28 Sep 2026 15:23:53 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BA=A7=E5=93=81=E6=B6=88=E6=81=AF=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/images/chat/base-tag.svg |   1 +
 src/assets/style/chat.css           |   3 +-
 src/components/product/index.vue    | 199 ++++++++++++++++++----------
 3 files changed, 132 insertions(+), 71 deletions(-)
 create mode 100644 src/assets/images/chat/base-tag.svg

diff --git a/src/assets/images/chat/base-tag.svg b/src/assets/images/chat/base-tag.svg
new file mode 100644
index 0000000..f4df93f
--- /dev/null
+++ b/src/assets/images/chat/base-tag.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="65" height="24" viewBox="0 0 65 24"><path d="M0,0L0,11.999998C0,18.627417,5.3725834,24,12.000002,24L65,24L65,12.000002C65,5.3725834,59.627419,0,53,0L0,0Z" fill="#FDEEDE" fill-opacity="1"/><g><path d="M9.92400002,7.4759998L9.92400002,8.435999899999999L11.9520001,8.435999899999999L11.9520001,12.1919994L9.74400002,12.1919994L9.74400002,13.1759996L12.036,13.1759996C11.484,13.752,10.6800001,14.232,9.60000002,14.616L10.188,15.576C10.9200001,15.216,11.556000000000001,14.82,12.0840001,14.375999L12.0840001,15.336L14.448,15.336L14.448,16.284L10.344,16.284L10.344,17.34L19.572001,17.34L19.572001,16.284L15.552,16.284L15.552,15.336L17.8920002,15.336L17.8920002,14.352C18.444000199999998,14.82,19.128,15.228,19.956,15.588L20.424,14.604C19.368000000000002,14.243999,18.54,13.776,17.951999700000002,13.1759996L20.244,13.1759996L20.244,12.1919994L18.036000299999998,12.1919994L18.036000299999998,8.435999899999999L20.064,8.435999899999999L20.064,7.4759998L18.036000299999998,7.4759998L18.036000299999998,6.6479998L16.9320002,6.6479998L16.9320002,7.4759998L13.0560002,7.4759998L13.0560002,6.6479998L11.9520001,6.6479998L11.9520001,7.4759998L9.92400002,7.4759998ZM12.132,14.328C12.54,13.968,12.8759999,13.584,13.152000000000001,13.1759996L16.8239999,13.1759996C17.088000299999997,13.584,17.4359999,13.968,17.868000000000002,14.328L15.552,14.328L15.552,13.4879999L14.448,13.4879999L14.448,14.328L12.132,14.328ZM13.0560002,12.1919994L13.0560002,11.5440006L16.9320002,11.5440006L16.9320002,12.1919994L13.0560002,12.1919994ZM13.0560002,10.6560001L13.0560002,10.0079999L16.9320002,10.0079999L16.9320002,10.6560001L13.0560002,10.6560001ZM13.0560002,9.1199999L13.0560002,8.435999899999999L16.9320002,8.435999899999999L16.9320002,9.1199999L13.0560002,9.1199999ZM21.828,8.7719998L21.828,9.8639998L25.524,9.8639998C24.66,11.8559999,23.28,13.5,21.384,14.772L22.044,15.84C24.084,14.28,25.548,12.2880001,26.412001,9.8639998L26.424,9.8639998L26.424,14.28L24.048000000000002,14.28L24.048000000000002,15.372L26.424,15.372L26.424,17.736L27.576,17.736L27.576,15.372L30.048,15.372L30.048,14.28L27.576,14.28L27.576,9.8639998L27.587999,9.8639998C28.392,12.0120001,29.796001,13.956,31.799999,15.684L32.58,14.7C30.636,13.2840004,29.268,11.6639996,28.476,9.8639998L32.16,9.8639998L32.16,8.7719998L27.576,8.7719998L27.576,6.6960001L26.424,6.6960001L26.424,8.7719998L21.828,8.7719998ZM33.708,7.0559998L33.708,8.123999600000001L34.848,8.123999600000001L34.848,11.2919998L33.492001,11.2919998L33.492001,12.3959999L34.823999,12.3959999C34.728001,14.436,34.296,15.948,33.516001,16.932000000000002L34.367999999999995,17.676000000000002C35.327999,16.536,35.867999999999995,14.772,35.976,12.3959999L37.5,12.3959999L37.5,17.652L38.664,17.652L38.664,12.3959999L39.948,12.3959999L39.948,11.2919998L38.664,11.2919998L38.664,8.123999600000001L39.768,8.123999600000001L39.768,7.0559998L33.708,7.0559998ZM36,8.123999600000001L37.5,8.123999600000001L37.5,11.2919998L36,11.2919998L36,8.123999600000001ZM43.104,6.6960001C42.228001,7.632,41.112,8.3879995,39.756001,8.963999699999999L40.236000000000004,10.0079999C41.664001,9.3600001,42.863998,8.5440001,43.848,7.5599995L43.104,6.6960001ZM43.632,9.9000001C42.743999,10.932000200000001,41.627998,11.7600002,40.260000000000005,12.3839998L40.739999999999995,13.4160004C42.18,12.7200003,43.391998,11.8319998,44.375999,10.7639999L43.632,9.9000001ZM43.919998,13.224C42.816002,14.64,41.400002,15.792,39.672001,16.656L40.164,17.712C41.940002,16.752000000000002,43.452,15.552,44.675999,14.088L43.919998,13.224ZM50.411999,6.54C50.363998,6.9960003,50.279999,7.4160004,50.172001,7.8240004L46.02,7.8240004L46.02,8.9159999L49.751999,8.9159999C49.560001,9.2880001,49.32,9.6240001,49.043999,9.9239998C48.299999,10.704,47.099998,11.3039999,45.419998,11.724L45.863998,12.7799997C47.279999,12.408,48.383999,11.9279995,49.200001,11.3519998C49.764,11.8080006,50.304001,12.3000002,50.807999,12.8280001L51.599998,12.0359993C50.987999,11.4959998,50.436001,11.052,49.944,10.691999899999999L49.98,10.6560001C50.400002,10.152000000000001,50.748001,9.5759997,51.012001,8.9159999L51.060001,8.9159999C51.647999,10.5120001,53.256001,11.7840004,55.896,12.7439995L56.496002,11.7600002C54.216,11.064000100000001,52.788002,10.1160002,52.211998,8.9159999L55.872002,8.9159999L55.872002,7.8240004L51.348,7.8240004C51.431999,7.4639997000000005,51.504002,7.0799999,51.552002,6.6599998L50.411999,6.54ZM46.584,13.644C46.368,14.676,46.02,15.636,45.528,16.524L46.512001,17.136C47.015999,16.224,47.411999,15.144,47.700001,13.896L46.584,13.644ZM51.396,13.1879997L50.400002,13.512C50.771999,14.112,51.119999,14.82,51.444,15.624L52.487999,15.156C52.175999,14.448,51.816002,13.788,51.396,13.1879997ZM55.007999,13.4519997L53.916,13.8C54.468002,14.664,54.984001,15.648,55.440002,16.776L56.484001,16.308C56.063999,15.288,55.571999,14.34,55.007999,13.4519997ZM52.692001,17.484C53.16,17.484,53.507999,17.375999999999998,53.736,17.172C54,16.956,54.167999,16.308,54.264,15.204L53.183998,14.856C53.136002,15.6,53.052002,16.032,52.931999,16.164C52.835999,16.308,52.692001,16.380000000000003,52.475998,16.380000000000003L49.98,16.380000000000003C49.644001,16.380000000000003,49.487999,16.212,49.487999,15.888L49.487999,13.608L48.335999,13.608L48.335999,16.116C48.335999,17.028,48.756001,17.484,49.619999,17.484L52.692001,17.484Z" fill="#A56033" fill-opacity="1"/></g></svg>
\ No newline at end of file
diff --git a/src/assets/style/chat.css b/src/assets/style/chat.css
index c1c7f8d..c434cd2 100644
--- a/src/assets/style/chat.css
+++ b/src/assets/style/chat.css
@@ -180,7 +180,8 @@ img.avatarUrl-img[lazy="loading"] {
 }
 .noPadding{
   padding: 0 !important;
-  border-radius: 30rem !important;
+  border-radius: 12rem !important;
+  background: linear-gradient(360deg, #ffffffb3 0%, #f7f8ff 99%) !important;
 }
 .content-left-main.text-folding-box {
   padding: 11rem 14rem 0 14rem !important;
diff --git a/src/components/product/index.vue b/src/components/product/index.vue
index 4c5e098..9fe626a 100644
--- a/src/components/product/index.vue
+++ b/src/components/product/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <div class="product_body">
-      <div :class="{ hiddenMore: showTotal }" class="bg_white" ref="productEl">
+      <div :class="{ hiddenMore: showTotal }" ref="productEl">
         <!-- 产品头部 -->
         <div class="product_top">
           <div class="title_body">
@@ -28,6 +28,7 @@
         <div class="product_main">
           <div class="product_modules">
             <div class="base_module">
+              <div class="tag"></div>
               <!-- 列表集合 -->
               <div class="list" v-for="item in baseModuleData" :key="item.id" v-show="!!item.val">
                 <div class="list_label">{{ item.key }}:</div>
@@ -42,19 +43,25 @@
             <!-- 保险责任 -->
             <div class="more_module">
               <div class="top_right_bg">
+                <div class="tag">保险责任</div>
                 <!-- 列表集合 -->
                 <div class="list" v-for="item in resultData.insDuty" :key="item.key">
                   <div class="list_label">
-                    <span class="list_label_span">
-                      {{ item.key }}:
-                    </span>
+                    <span class="list_label_span"> {{ item.key }}: </span>
                   </div>
                   <div class="list_content" v-if="item.isRender" v-html="item.completedData"></div>
                   <div class="list_content" v-else>
                     <template v-for="(completedItem, cIdx) in item.completedData" :key="cIdx">
-                      <span class="more_text" v-if="typeof completedItem === 'string'"
-                        v-html="completedItem"></span>
-                      <span class="more_button" v-else @click="showImgPopup(completedItem.urlValue)">
+                      <span
+                        class="more_text"
+                        v-if="typeof completedItem === 'string'"
+                        v-html="completedItem"
+                      ></span>
+                      <span
+                        class="more_button"
+                        v-else
+                        @click="showImgPopup(completedItem.urlValue)"
+                      >
                         {{ completedItem.urlkey }}
                       </span>
                     </template>
@@ -68,28 +75,48 @@
         <!-- 产品底部 -->
         <div class="product_bottom">
           <div class="bottom_modules">
-            <div class="img_module" :class="bottomModuleNum ? 'min_witch' : ''" v-show="!!item.url"
-              v-for="item in bottomModulesData" :key="item.id">
+            <div
+              class="img_module"
+              :class="bottomModuleNum ? 'min_witch' : ''"
+              v-show="!!item.url"
+              v-for="item in bottomModulesData"
+              :key="item.id"
+            >
               <img @click="clickBottomBtn(item.name)" :src="item.src" />
             </div>
           </div>
         </div>
         <!-- 关联问 -->
         <div class="content-question-answer" v-if="intents && intents.length > 0">
-          <button :class="hasClicked ? 'answer-items setGrey' : 'answer-items'"
-            v-for="(items, index) in intents" :key="index" @click.stop="richCallAnswer(items)">
+          <button
+            :class="hasClicked ? 'answer-items setGrey' : 'answer-items'"
+            v-for="(items, index) in intents"
+            :key="index"
+            @click.stop="richCallAnswer(items)"
+          >
             {{ items.intent }}
           </button>
         </div>
       </div>
       <!-- 展开拉起 -->
-      <div class="unfold-box" :class="exchangeButton ? 'unfold-bg' : 'unfold-style'" v-if="showExchangeButton">
-        <a href="javascript:;" @click="showTotalIntro">{{ exchangeButton ? "展开" : "收起"
-          }}<em class="look-more-icon" :class="!exchangeButton ? 'active' : ''"></em></a>
+      <div
+        class="unfold-box"
+        :class="exchangeButton ? 'unfold-bg' : 'unfold-style'"
+        v-if="showExchangeButton"
+      >
+        <a href="javascript:;" @click="showTotalIntro"
+          >{{ exchangeButton ? '展开' : '收起'
+          }}<em class="look-more-icon" :class="!exchangeButton ? 'active' : ''"></em
+        ></a>
       </div>
       <!-- 弹出层 -->
-      <van-popup class="popup" :style="{ height: '85%', borderRadius: '10rem 10rem 0rem 0rem' }"
-        v-model:show="popUpFlag" teleport="body" position="bottom">
+      <van-popup
+        class="popup"
+        :style="{ height: '85%', borderRadius: '10rem 10rem 0rem 0rem' }"
+        v-model:show="popUpFlag"
+        teleport="body"
+        position="bottom"
+      >
         <div class="detaill_body">
           <div class="detaill_title">
             {{ detaillTitle }}
@@ -98,8 +125,12 @@
           <div class="detaill_content" v-show="nowPopType === 'tkyw'">
             <div v-html="tkywValue"></div>
           </div>
-          <img :style="{ width: '100%', maxWidth: 'none' }" class="product_img" :src="productImgUrl"
-            v-if="!!productImgUrl && nowPopType === 'img'" />
+          <img
+            :style="{ width: '100%', maxWidth: 'none' }"
+            class="product_img"
+            :src="productImgUrl"
+            v-if="!!productImgUrl && nowPopType === 'img'"
+          />
         </div>
       </van-popup>
     </div>
@@ -292,8 +323,17 @@ function showGraph(item) {
 <style lang="scss" scoped>
 .hiddenMore {
   height: 205rem;
+  overflow: hidden;
+}
+.unfold-box {
+  height: 52rem;
+  background: linear-gradient(0deg, #ffffff 56%, #ffffff4d 103%);
+  backdrop-filter: blur(16rem);
+  font-family: PingFang SC;
+  font-size: 12rem;
+  font-weight: 500;
+  color: #025cea;
 }
-
 .product_body {
   line-height: normal;
   letter-spacing: 0.5rem;
@@ -304,32 +344,32 @@ function showGraph(item) {
   margin-bottom: 6rem;
 
   .bg_white {
-    background: #fff;
     border-radius: 8rem;
     overflow: hidden;
   }
 
   .product_top {
-    color: #fff;
-    border-bottom: #f0ecec 0.01rem solid;
-
     .title_body {
-      font-size: 13rem;
+      font-size: 18rem;
+      font-weight: 600;
       width: 100%;
       min-height: 0.5rem;
-      background-image: url('../../assets/images/product/banner.png');
+      // background: linear-gradient(96deg, #055deae6 4%, #137cfee6 55%, #d5dffbe6 125%);
+      // border-image: linear-gradient(105deg, #c9dcff 47%, #ffffffb0 111%) 1;
       background-size: cover;
       background-repeat: no-repeat;
       border-radius: 0.36rem 0.36rem 0 0;
-      padding: 8rem;
+      padding: 8rem 16rem;
       display: flex;
       align-items: center;
 
       .title {
-        font-size: 15rem;
+        font-size: 16rem;
+        color: #17204d;
+        font-family: PingFang SC;
         display: flex;
         align-items: center;
-        font-weight: 500;
+        font-weight: 600;
         position: relative;
 
         .text_content {
@@ -338,13 +378,15 @@ function showGraph(item) {
         }
 
         .mark {
-          font-size: 12rem;
-          background: #fff;
           letter-spacing: 0rem;
-          color: #4f95fd;
-          padding: 0rem 4rem 0rem 4rem;
-          border-radius: 5rem 5rem 5rem 0rem;
-          font-weight: 700;
+          background: rgba(76, 101, 245, 0.08);
+          color: #025cea;
+          padding: 2rem 6rem;
+          border-radius: 4rem;
+          font-family: PingFang SC;
+          font-size: 12rem;
+          font-weight: 500;
+          line-height: 16rem;
           position: absolute;
           top: 1rem;
           right: -4rem;
@@ -370,8 +412,8 @@ function showGraph(item) {
 
         span {
           flex: 1;
-          font-size: 12rem;
-          color: #777777;
+          font-size: 14rem;
+          color: #7e849f;
           letter-spacing: 0.1rem;
         }
       }
@@ -395,60 +437,75 @@ function showGraph(item) {
     padding: 0.31rem 0rem;
 
     .product_modules {
+      padding: 0 16rem 16rem;
+
       .base_module {
-        background: #fef8ed;
-        background-image: url('../../assets/images/product/base.png');
+        background: #ffffff;
         background-size: 65rem;
-        background-repeat: no-repeat;
-        background-position: top right;
-        padding: 16rem;
-        border-radius: 0.3rem;
+        position: relative;
+        padding: 16rem 8rem;
         margin-bottom: 11rem;
         letter-spacing: 0;
+        border-radius: 12rem;
+        .tag {
+          position: absolute;
+          top: 0rem;
+          right: 0;
+          background: url('../../assets/images/chat/base-tag.svg');
+          height: 24rem;
+          width: 65rem;
+          content: '';
+        }
       }
 
       .more_module {
-        border-radius: 0.3rem;
-
         .top_right_bg {
-          background-image: url('../../assets/images/product/more.png');
-          background-size: 65rem;
-          background-repeat: no-repeat;
-          background-position: top right;
-          padding: 16rem;
+          padding: 16rem 8rem;
+          background: #fff;
           border-radius: 12rem;
+          position: relative;
           letter-spacing: 0;
+          .tag {
+            position: absolute;
+            font-size: 12rem;
+            border-radius: 0rem 12rem 0rem 12rem;
+            background: rgba(2, 92, 234, 0.1);
+            width: 64rem;
+            height: 25rem;
+            top: 0rem;
+            line-height: 26rem;
+            right: 0;
+            font-weight: 500;
+            text-align: center;
+            content: '';
+            color: #025cea;
+          }
         }
-
-        background: #edf4ff;
-        background-image: url('../../assets/images/product/productBg.png');
-        background-size: 470rem;
-        background-repeat: no-repeat;
-        background-position: top right;
-
         .tip {
-          color: #aaa;
-          text-align: right;
-          font-size: 12rem;
+          color: #b5bace;
+          font-size: 14rem;
+          font-weight: normal;
+          font-family: PingFang SC;
         }
       }
 
       .list {
-        color: #5b5b5b;
+        color: #17204d;
         display: flex;
         line-height: 18rem;
 
         .list_label {
-          width: 80rem;
-          font-weight: 700;
-          font-size: 14rem;
-          color: #000;
+          width: 96rem;
+          font-family: PingFang SC;
+          font-weight: 600;
+          font-size: 16rem;
+          color: #17204d;
         }
 
         .list_content {
           flex: 1;
           font-weight: 400;
-          font-size: 14rem;
+          font-size: 16rem;
           display: flex;
           align-items: center;
           word-break: normal;
@@ -482,7 +539,7 @@ function showGraph(item) {
           }
 
           .more_button::after {
-            content: "";
+            content: '';
             width: 0.35rem;
             height: 0.35rem;
             background-image: url('../../assets/images/product/arrow.png');
@@ -511,7 +568,7 @@ function showGraph(item) {
       }
 
       .list:nth-child(n):not(:last-child) {
-        margin-bottom: 15rem;
+        margin-bottom: 8rem;
       }
 
       .top_right_bg > .list:nth-child(n):not(:last-child) {
@@ -530,10 +587,12 @@ function showGraph(item) {
           width: unset;
           line-height: 18rem;
           margin-bottom: 7rem;
+          white-space: nowrap;
 
           .list_label_span {
-            font-weight: 700;
-            border-bottom: 1rem solid #000;
+            font-weight: 400;
+            font-size: 16rem;
+            font-family: PingFang SC;
           }
         }
       }
@@ -610,7 +669,7 @@ function showGraph(item) {
     position: relative;
 
     &::after {
-      content: " ";
+      content: ' ';
       position: absolute;
       bottom: -6rem;
       left: 0;