页面UI更新

components/AssistantConsultationShell.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="consultation-container safe-area-inset-bottom">
     <view class="consultation-header">
-      <view class="header-back" @click="$emit('back')">
+      <view class="header-back" @click="handleHeaderBack">
         <text class="iconfont icon-arrow-left"></text>
       </view>
       <view class="header-title">{{ headerTitle }}</view>
@@ -19,24 +19,25 @@
       </view>
     </view>
 
-    <u-popup
-      v-model="agreementPopupVisible"
-      :safe-area-inset-bottom="true"
-      mode="bottom"
-      height="88%"
-      border-radius="20"
-      :closeable="true"
-      z-index="20000"
+    <page-container
+      :show="agreementPopupVisible"
+      position="bottom"
+      round
+      overlay
+      custom-style="height:88%;"
+      @clickoverlay="closeAgreement"
+      @afterleave="closeAgreement"
     >
       <view class="agreement-popup">
         <view class="agreement-header">
           <text class="agreement-title">{{ currentAgreementName || '协议详情' }}</text>
+          <view class="agreement-close" @click="closeAgreement">×</view>
         </view>
-        <view class="agreement-content">
+        <scroll-view scroll-y class="agreement-content" :show-scrollbar="true">
           <u-parse :html="agreementContent"></u-parse>
-        </view>
+        </scroll-view>
       </view>
-    </u-popup>
+    </page-container>
 
     <scroll-view class="messages-scroll" scroll-y="true" :scroll-into-view="scrollIntoView" scroll-with-animation>
       <view class="messages-container">
@@ -235,6 +236,16 @@ export default {
     },
   },
   methods: {
+    handleHeaderBack() {
+      if (this.showAgreement) {
+        this.closeAgreement();
+        return;
+      }
+      this.$emit('back');
+    },
+    closeAgreement() {
+      this.$emit('update:showAgreement', false);
+    },
     answerButtonClass(answer, index) {
       const answers = this.currentQuestionAnswers
       const totalAnswers = answers.length
@@ -517,12 +528,24 @@ export default {
 }
 
 .agreement-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
   padding: 30rpx 50rpx 20rpx;
   border-bottom: 1rpx solid #e5e7eb;
   background: #fff;
-  position: sticky;
-  top: 0;
-  z-index: 10;
+  flex-shrink: 0;
+}
+
+.agreement-close {
+  width: 48rpx;
+  height: 48rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 40rpx;
+  color: #64748b;
+  line-height: 1;
 }
 
 .agreement-title {
@@ -530,12 +553,15 @@ export default {
   font-weight: 600;
   color: #1e293b;
   line-height: 1.5;
+  flex: 1;
+  min-width: 0;
 }
 
 .agreement-content {
   flex: 1;
+  height: 0;
+  min-height: 200rpx;
   padding: 30rpx 50rpx 40rpx;
-  overflow-y: auto;
-  min-height: 0;
+  box-sizing: border-box;
 }
 </style>