feat: aigc样式的调整

client-configs.json

@@ -1,6 +1,6 @@
 {
   "zhinian": {
-    "clientId": "8",
+    "clientId": "6",
     "appId": "wx5e79df5996572539",
     "name": "智念",
     "placeholder": "快告诉智念您在想什么~",

src/pages/index/components/chat/ChatMainList/index.vue

@@ -9,8 +9,8 @@
     <scroll-view class="main flex-full overflow-hidden scroll-y" scroll-y :scroll-top="scrollTop"
       :scroll-with-animation="true" @scroll="handleScroll" @scrolltolower="handleScrollToLower">
       <!-- welcome栏 -->
-      <ChatTopWelcome ref="welcomeRef" :mainPageDataModel="mainPageDataModel" />
-      <NoticeMessage v-if="notitceConent"></NoticeMessage>
+      <ChatTopWelcome ref="welcomeRef" :mainPageDataModel="mainPageDataModel" :welcomeMessage="welcomeMessage" />
+      <NoticeMessage v-if="notitceConent" :noticeContent="notitceConent"></NoticeMessage>
 
       <view class="area-msg-list-content" v-for="item in chatMsgList" :key="item.msgId" :id="item.msgId">
         <template v-if="item.msgType === MessageRole.AI">
@@ -33,7 +33,7 @@
               " />
               <GeneratorPhotoComponent v-else-if="
                 item.toolCall && item.toolCall.componentName === CompName.aigcPhotoGeneratorCard
-              " />
+              " :toolCall="item.toolCall"/>
               <Feedback v-else-if="
                 item.toolCall && item.toolCall.componentName === CompName.feedbackCard
               " :toolCall="item.toolCall" />
@@ -135,7 +135,9 @@ const statusBarHeight = ref(20);
 const inputAreaRef = ref(null);
 const topNavBarRef = ref();
 const welcomeRef = ref();
-const notitceConent = ref("");
+const welcomeMessage = ref("");
+const notitceConent = ref(null);
+
 
 const holdKeyboardTimer = ref(null);
 /// focus时，点击页面的时候不收起键盘
@@ -487,6 +489,14 @@ const handleWebSocketMessage = (data) => {
   }
 
   // Welcome 消息 (messageType=4)：用于更新顶部欢迎栏内容
+  if (data.messageType && data.messageType === 'text') {
+    console.log("收到 welcome 类型消息:", data);
+    if (data.content) {
+      welcomeMessage.value = data.content;
+    }
+    return;
+  }
+
   if (data.messageType && data.messageType === 'broadcast') {
     console.log("收到 welcome 类型消息:", data);
     if (data.content) {

src/pages/index/components/chat/ChatTopWelcome/index.vue

@@ -7,7 +7,7 @@ v
           :frameHeight="spriteStyle.frameHeight" :totalFrames="spriteStyle.totalFrames" :columns="spriteStyle.columns"
           :displayWidth="spriteStyle.displayWidth" :fps="16" />
         <view class="welcome-text font-size-14 font-500 font-family-misans-vf color-171717 line-height-24">
-          {{ welcomeContent }}
+          {{ props.welcomeMessage || welcomeContent }}
         </view>
       </view>
 
@@ -23,6 +23,10 @@ import ChatMoreTips from "../ChatMoreTips/index.vue";
 import SpriteAnimator from "@/components/Sprite/SpriteAnimator.vue";
 
 const props = defineProps({
+  welcomeMessage: {
+    type: String,
+    default: "",
+  },
   mainPageDataModel: {
     type: Object,
     default: () => {

src/pages/index/components/chat/NoticeMessage/index.vue

@@ -9,7 +9,7 @@
           </view>
           <text class="font-size-16 font-500 text-color-900 ml-6">临时提醒</text>
         </view>
-        <view class="font-size-12 font-color-600 mt-8">现在拥堵严重请绕道而行现在拥堵严重，请绕道而行现在拥堵严重，请绕道而行现在拥堵严重请绕道而行现在拥堵严重，请绕道而行现在拥堵严重，请绕道而行</view>
+        <view class="font-size-12 font-color-600 mt-8">{{ props.noticeContent.eventMessageContent }}</view>
       </view>
       <image class="mt-4 object-cover absolute right-0 bottom-0 bg-image" src="./notice_bg_img.png"/>
     </view>
@@ -18,6 +18,15 @@
 </template>
 
 <script setup>
+import { defineProps } from "vue";
+
+const props = defineProps({
+  noticeContent: {
+    type: Object,
+    default: () => ({}),
+  },
+});
+
 </script>
 
 <style lang="scss" scoped>

src/pages/index/components/module/GeneratorPhotoComponent/index.vue

@@ -4,19 +4,24 @@
     <view class="w-vw"></view>
     <view class="content flex flex-col m-4 border-box rounded-24">
       <view class="flex flex-col p-6 border-box flex-items-center justify-center">
-        <image class="w-full rounded-20" src="./images/g_image.png" mode="widthFix" />
+        <image class="w-full rounded-20" :src="props.toolCall.componentNameParams.background" mode="widthFix" />
 
-        <image class="g_title mt-20" src="./images/g_title.png"  />
+        <!-- 左上角标签 -->
+        <view class="tag">
+          <view class="dot"></view>
+          <text class="tag-text">{{ props.toolCall.componentNameParams.superscript }}</text>
+        </view>
+
+        <image class="g_title mt-20" :src="props.toolCall.componentNameParams.title"  />
 
         <text class="font-size-14 font-400 color-white my-12 text-center">
-          生成合照写真，一键出片 \n
-          来到小七孔不打个卡再走吗？？？！！！
+          {{ props.toolCall.componentNameParams.description }}
         </text>
 
-        <view class="w-full border-box px-12 pb-8 flex flex-row">
+        <view class="w-full border-box px-12 pb-8 flex flex-row" @click="jumpClick">
           <view class="btn-bg w-full border-box p-4 rounded-24 flex flex-row">
             <view class="btn-bg-sub w-full border-box p-16 rounded-20 flex flex-row flex-items-center flex-justify-center color-white text-center font-size-18 font-800">
-              参加活动
+              {{ props.toolCall.componentNameParams.buttonName }}
             </view>
           </view>
         </view>
@@ -26,6 +31,35 @@
   
 </template>
 <script setup>
+import { defineProps, nextTick, onMounted, computed } from "vue";
+import {
+  SCROLL_TO_BOTTOM,
+} from "@/constant/constant";
+import { getAccessToken } from "@/constant/token";
+import { navigateTo } from "@/router";
+
+
+const props = defineProps({
+  toolCall: {
+    type: Object,
+    default: {},
+  },
+});
+
+onMounted(() => {
+  nextTick(() => {
+    setTimeout(() => {
+      uni.$emit(SCROLL_TO_BOTTOM, true);
+    }, 300);
+  });
+});
+
+const jumpClick = () => {
+  const token = getAccessToken();
+  if (props.toolCall.componentNameParams.jumpUrl) {
+    navigateTo(props.toolCall.componentNameParams.jumpUrl, { token: token }); 
+  }
+};
 
 </script>
 

src/pages/index/components/module/GeneratorPhotoComponent/styles/index.scss

@@ -7,6 +7,7 @@
   background: linear-gradient(180deg, $theme-color-100 0%, $theme-color-500 100%);
   border-radius: 24px 24px 24px 24px;
   border: 1px solid #FFFFFF;
+  position: relative;
 }
 
 .g_title {
@@ -23,3 +24,36 @@
   background: $theme-color-500;
   box-shadow: inset 0px 0px 41px 0px $theme-color-50, inset 0px 0px 15px 0px $theme-color-100;
 }
+
+/* 左上角标签容器 */
+.tag {
+  position: absolute;
+  top: 20px;
+  left: 20px;
+
+  display: flex;
+  align-items: center;
+
+  padding: 4px 8px;
+  border-radius: 999rpx;
+
+  backdrop-filter: blur(6rpx);
+  background: rgba(255,255,255,0.79);
+  box-shadow: inset 0px 1px 2px 0px rgba(255,255,255,0.46);
+}
+
+/* 小绿点 */
+.dot {
+  width: 15px;
+  height: 15px;
+  border-radius: 50%;
+  background: $theme-color-500;
+  margin-right: 8px;
+}
+
+/* 文字 */
+.tag-text {
+  font-size: 12px;
+  color: $theme-color-500;
+  font-weight: 600;
+}

src/static/scss/font-size.scss

@@ -50,3 +50,7 @@
 .font-size-32 {
   font-size: 32px;
 }
+
+.font-size-54 {
+  font-size: 54px;
+}