feat(mini): align companion pages and show OTA progress

banban-mini/src/pages/chat/index.tsx

@@ -1,4 +1,6 @@
-import { View, Text, ScrollView } from '@tarojs/components'
+import { getParticipantArtwork } from '@/utils/artwork'
+import { getPageStyle } from '@/utils/page-style'
+import { View, Text, ScrollView, Image } from '@tarojs/components'
 import { useState } from 'react'
 import Taro, { useDidShow } from '@tarojs/taro'
 import { getToken } from '@/services/auth'
@@ -74,7 +76,7 @@ export default function Chat() {
   }
 
   return (
-    <View className='chat-page'>
+    <View className='chat-page' style={getPageStyle(true)}>
       <View className='page-header'>
         <Text className='page-title'>玩伴</Text>
       </View>
@@ -108,7 +110,7 @@ export default function Chat() {
               )}
             >
               <View className='guest-demo-avatar'>
-                <Text>伴</Text>
+                <Image className='conversation-avatar-art' src={getParticipantArtwork('ai')} mode='aspectFit' />
               </View>
               <View className='guest-demo-content'>
                 <Text className='guest-demo-name'>AI 玩伴</Text>
@@ -132,7 +134,7 @@ export default function Chat() {
               )}
             >
               <View className='guest-demo-avatar parent'>
-                <Text>家</Text>
+                <Image className='conversation-avatar-art' src={getParticipantArtwork('parent')} mode='aspectFit' />
               </View>
               <View className='guest-demo-content'>
                 <Text className='guest-demo-name'>家长留言</Text>
@@ -175,7 +177,7 @@ export default function Chat() {
               onClick={() => handleConversationClick(conversation)}
             >
               <View className='conversation-avatar'>
-                <Text className='avatar-icon'>{conversation.avatar}</Text>
+                <Image className='conversation-avatar-art' src={getParticipantArtwork(conversation.peerKind, conversation.roleKey)} mode='aspectFit' />
               </View>
               <View className='conversation-content'>
                 <View className='conversation-header'>