feat(订单): 添加买卖订单类型切换功能并优化订单详情页

refactor(优惠券): 重构红包选择弹窗界面和交互逻辑

feat(答疑): 增加买书答疑页面并优化UI展示

fix(订单确认): 修复订单金额计算和优惠展示问题

style: 统一页面样式和布局规范

pages-car/components/red-packet-popup.vue

@@ -1,32 +1,72 @@
 <template>
-    <u-popup v-model="show" mode="bottom" border-radius="24">
+    <u-popup v-model="show" mode="bottom" border-radius="24" :safe-area-inset-bottom="true">
         <view class="red-packet-popup">
             <view class="popup-header">
-                <text>选择红包</text>
-                <u-icon name="close" size="28" color="#999" class="close-icon" @click="close"></u-icon>
+                <text>优惠详情</text>
+                <view class="close-btn" @click="close">
+                    <u-icon name="close" size="24" color="#666"></u-icon>
+                </view>
+            </view>
+
+            <view class="filter-tabs" v-if="list && list.length > 0">
+                <view class="tab" :class="{ active: currentTab === 'all' }" @click="currentTab = 'all'">全部</view>
+                <view class="tab" :class="{ active: currentTab === 'unavailable' }" @click="currentTab = 'unavailable'">不可用</view>
             </view>
 
             <scroll-view scroll-y class="packet-list" v-if="list && list.length > 0">
-                <view class="packet-item" v-for="(item, index) in list" :key="index" @click="selectPacket(index)">
-                    <view class="packet-info">
-                        <view class="packet-name">{{ item.couponName }} ¥{{ item.faceMoney }}</view>
-                        <view class="packet-desc">满{{ item.thresholdMoney }}元可用</view>
+                <!-- 可用红包 -->
+                <template v-if="currentTab === 'all'">
+                    <view class="packet-item available" v-for="(item, index) in availableList" :key="index" @click="selectPacket(item)">
+                        <view class="packet-main">
+                            <view class="packet-left">
+                                <text class="currency">¥</text>
+                                <text class="amount">{{ item.faceMoney }}</text>
+                            </view>
+                            <view class="packet-right">
+                                <view class="packet-name">{{ item.couponName }}</view>
+                                <view class="packet-rule">{{ item.thresholdMoney == 0 ? '无门槛' : '满' + item.thresholdMoney + '元可用' }}</view>
+                            </view>
+                            <view class="packet-check">
+                                <u-icon name="checkmark-circle-fill" size="40"
+                                    :color="selectedItem && selectedItem.userCouponId === item.userCouponId ? '#ff4500' : '#e0e0e0'"></u-icon>
+                            </view>
+                        </view>
                         <view class="packet-time">{{ item.effectStartTime }}至{{ item.effectEndTime }}</view>
                     </view>
-                    <view class="packet-check">
-                        <u-icon name="checkmark-circle-fill" size="40"
-                            :color="selectedIndex === index ? '#ff4500' : '#ccc'"></u-icon>
+                </template>
+
+                <!-- 不可用红包 -->
+                <template v-if="unavailableList.length > 0 && (currentTab === 'all' || currentTab === 'unavailable')">
+                    <view class="section-title" v-if="currentTab === 'all'">本单不可用红包</view>
+                    <view class="packet-item unavailable" v-for="(item, index) in unavailableList" :key="index">
+                        <view class="packet-main">
+                            <view class="packet-left">
+                                <text class="currency">¥</text>
+                                <text class="amount">{{ item.faceMoney }}</text>
+                            </view>
+                            <view class="packet-right">
+                                <view class="packet-name">{{ item.couponName }}</view>
+                                <view class="packet-rule">{{ item.thresholdMoney == 0 ? '无门槛' : '满' + item.thresholdMoney + '元可用' }}</view>
+                            </view>
+                            <view class="packet-check">
+                                <view class="disabled-radio"></view>
+                            </view>
+                        </view>
+                        <view class="packet-reason">
+                            本单不可用原因：{{ item.unavailableReason || '不满足使用条件' }}
+                        </view>
                     </view>
-                </view>
+                </template>
             </scroll-view>
+
             <view class="empty-state" v-else>
                 <image src="https://shuhi.oss-cn-qingdao.aliyuncs.com/mini/no-data.png"
                     style="width: 260rpx; height: 260rpx" mode="aspectFit"></image>
-                <view class="empty-text">暂无可用红包</view>
+                <view class="empty-text">暂无红包</view>
             </view>
 
             <view class="popup-footer" v-if="list && list.length > 0">
-                <u-button type="primary" shape="circle" @click="confirm">确认</u-button>
+                <u-button type="primary" shape="circle" @click="confirm" :custom-style="btnStyle">确定</u-button>
             </view>
         </view>
     </u-popup>
@@ -47,12 +87,30 @@
         data() {
             return {
                 show: false,
-                selectedIndex: -1,
+                currentTab: 'all',
+                selectedItem: null,
+                btnStyle: {
+                    background: 'linear-gradient(90deg, #ff6b00, #ff4500)',
+                    color: '#fff',
+                    border: 'none'
+                }
+            }
+        },
+        computed: {
+            availableList() {
+                return this.list.filter(item => item.status === 1);
+            },
+            unavailableList() {
+                return this.list.filter(item => item.status === 0);
             }
         },
         watch: {
             value(val) {
                 this.show = val;
+                if (val) {
+                    // 重置 tab
+                    this.currentTab = 'all';
+                }
             },
             show(val) {
                 this.$emit('input', val);
@@ -62,20 +120,16 @@
             close() {
                 this.show = false;
             },
-            selectPacket(index) {
-                if (this.selectedIndex === index) {
+            selectPacket(item) {
+                if (this.selectedItem && this.selectedItem.userCouponId === item.userCouponId) {
                     // 如果点击的是已选中的项，则取消选中
-                    this.selectedIndex = -1;
+                    this.selectedItem = null;
                 } else {
-                    this.selectedIndex = index;
+                    this.selectedItem = item;
                 }
             },
             confirm() {
-                if (this.list && this.list.length > 0 && this.selectedIndex !== -1) {
-                    this.$emit('confirm', this.list[this.selectedIndex]);
-                } else {
-                    this.$emit('confirm', null);
-                }
+                this.$emit('confirm', this.selectedItem);
                 this.close();
             }
         }
@@ -91,54 +145,163 @@
         overflow: hidden;
 
         .popup-header {
+            display: flex;
+            justify-content: center;
+            align-items: center;
             padding: 30rpx;
-            text-align: center;
+            position: relative;
             font-size: 32rpx;
             font-weight: bold;
-            position: sticky;
-            top: 0;
+            color: #333;
             background-color: #fff;
-            border-bottom: 1rpx solid #eee;
 
-            .close-icon {
+            .close-btn {
                 position: absolute;
                 right: 30rpx;
-                top: 40rpx;
+                top: 50%;
+                transform: translateY(-50%);
+                width: 50rpx;
+                height: 50rpx;
+                background-color: #f5f5f5;
+                border-radius: 50%;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+            }
+        }
+
+        .filter-tabs {
+            display: flex;
+            padding: 0 30rpx;
+            margin-bottom: 20rpx;
+            background-color: #fff;
+            padding-bottom: 10rpx;
+
+            .tab {
+                padding: 12rpx 30rpx;
+                border-radius: 8rpx;
+                font-size: 26rpx;
+                margin-right: 20rpx;
+                background-color: #f5f5f5;
+                color: #333;
+                transition: all 0.3s;
+
+                &.active {
+                    background-color: #fff0e6;
+                    color: #ff4500;
+                    font-weight: bold;
+                }
             }
         }
 
         .packet-list {
             flex: 1;
-            padding: 20rpx;
             box-sizing: border-box;
-            height: 600rpx; // Give it a fixed height for scroll
+            height: 600rpx;
             overflow-y: auto;
+            padding-top: 20rpx;
+            padding-bottom: 40rpx;
+
+            .section-title {
+                font-size: 30rpx;
+                color: #333;
+                font-weight: bold;
+                margin: 10rpx 30rpx 20rpx;
+            }
 
             .packet-item {
-                display: flex;
-                align-items: center;
-                padding: 20rpx 30rpx;
-                border-bottom: 1rpx solid #f5f5f5;
+                margin: 0 30rpx 20rpx;
+                border-radius: 16rpx;
+                overflow: hidden;
+                background-color: #fffaf7;
 
-                .packet-info {
-                    flex: 1;
+                &.available {
+                    box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.04);
+                    border: 1rpx solid #f9f9f9;
 
-                    .packet-name {
-                        font-size: 30rpx;
+                    .packet-left {
                         color: #ff4500;
-                        font-weight: bold;
-                        margin-bottom: 10rpx;
                     }
-
-                    .packet-desc {
-                        font-size: 26rpx;
+                    .packet-name {
                         color: #333;
-                        margin-bottom: 6rpx;
                     }
-
+                    .packet-rule {
+                        color: #666;
+                    }
                     .packet-time {
+                        padding: 16rpx 24rpx;
                         font-size: 22rpx;
                         color: #999;
+                        background-color: #fffaf7;
+                        border-top: 1rpx dashed #ffe6e6;
+                    }
+                }
+
+                &.unavailable {
+                    background-color: #fefefe;
+                    .packet-left {
+                        color: #999;
+                    }
+                    .packet-name {
+                        color: #666;
+                    }
+                    .packet-rule {
+                        color: #999;
+                    }
+                    .packet-reason {
+                        padding: 20rpx 24rpx;
+                        font-size: 24rpx;
+                        color: #999;
+                        border-top: 1rpx dashed #eee;
+                        background-color: #fafafa;
+                    }
+                }
+
+                .packet-main {
+                    display: flex;
+                    align-items: center;
+                    padding: 30rpx 24rpx;
+                }
+
+                .packet-left {
+                    width: 150rpx;
+                    display: flex;
+                    align-items: baseline;
+
+                    .currency {
+                        font-size: 28rpx;
+                        margin-right: 4rpx;
+                    }
+                    .amount {
+                        font-size: 48rpx;
+                        font-weight: bold;
+                    }
+                }
+
+                .packet-right {
+                    flex: 1;
+                    margin-left: 10rpx;
+
+                    .packet-name {
+                        font-size: 30rpx;
+                        font-weight: bold;
+                        margin-bottom: 8rpx;
+                    }
+                    .packet-rule {
+                        font-size: 24rpx;
+                    }
+                }
+
+                .packet-check {
+                    margin-left: 20rpx;
+
+                    .disabled-radio {
+                        width: 40rpx;
+                        height: 40rpx;
+                        border-radius: 50%;
+                        border: 2rpx solid #ddd;
+                        background-color: #eee;
+                        box-sizing: border-box;
                     }
                 }
             }
@@ -160,7 +323,8 @@
 
         .popup-footer {
             padding: 20rpx 40rpx;
-            padding-bottom: env(safe-area-inset-bottom);
+            background-color: #fff;
+            box-shadow: 0 -4rpx 10rpx rgba(0, 0, 0, 0.02);
         }
     }
 </style>

pages-car/pages/confirm-order.vue

@@ -56,9 +56,9 @@
             <view class="order-summary">
                 <view class="total">
                     共<text class="num">{{ preOrder.totalQuantity }}</text>本
-                    <text class="reduce-text" v-if="totalDiscountAmount > 0" @click="openDiscountDetail">已降¥{{
-                        totalDiscountAmount }}</text>
-                    合计: <text class="price">¥{{ finalTotalMoney }}</text>
+                    <text class="reduce-text" v-if="preOrder.totalDiscountMoney > 0" @click="openDiscountDetail">已降¥{{
+                        preOrder.totalDiscountMoney }}</text>
+                    合计: <text class="price">¥{{ preOrder.payMoney }}</text>
                 </view>
                 <u-button type="primary" shape="circle" @click="submitOrder">提交订单</u-button>
             </view>
@@ -78,9 +78,13 @@
                         @click="showDiscountDetail = false"></u-icon>
                 </view>
                 <view class="discount-list">
-                    <view class="discount-item" v-for="(item, index) in discountDetails" :key="index">
-                        <text class="label">{{ item.label }}</text>
-                        <text class="amount">-¥{{ item.amount }}</text>
+                    <view class="discount-item" v-for="(item, index) in preOrder.discountList" :key="index" v-if="preOrder.discountList && preOrder.discountList.length > 0">
+                        <text class="label">{{ item.discountActivityMsg }}</text>
+                        <text class="amount">-¥{{ item.discountMoney }}</text>
+                    </view>
+                    <view class="discount-item" v-if="preOrder.totalReduceMoney > 0">
+                        <text class="label">分享降价</text>
+                        <text class="amount">-¥{{ preOrder.totalReduceMoney }}</text>
                     </view>
                 </view>
                 <view class="popup-footer">
@@ -149,52 +153,8 @@
             },
             finalTotalMoney() {
                 let total = parseFloat(this.preOrder.payMoney || 0);
-                if (this.selectedPacket && this.selectedPacket.faceMoney) {
-                    total -= parseFloat(this.selectedPacket.faceMoney);
-                }
                 return total < 0 ? '0.00' : total.toFixed(2);
             },
-            totalDiscountAmount() {
-                let total = 0;
-                // 1. 活动优惠
-                if (this.preOrder.discountMoney) {
-                    total += parseFloat(this.preOrder.discountMoney);
-                }
-                // 2. 红包
-                if (this.selectedPacket && this.selectedPacket.faceMoney) {
-                    total += parseFloat(this.selectedPacket.faceMoney);
-                }
-                // 3. 分享降价
-                if (this.preOrder.totalReduceMoney) {
-                    total += parseFloat(this.preOrder.totalReduceMoney);
-                }
-                return total.toFixed(2);
-            },
-            discountDetails() {
-                const list = [];
-                // 1. 惊喜红包 (红包)
-                if (this.selectedPacket && this.selectedPacket.faceMoney > 0) {
-                    list.push({
-                        label: this.selectedPacket.couponName,
-                        amount: parseFloat(this.selectedPacket.faceMoney).toFixed(2)
-                    });
-                }
-                // 2. 分享降价
-                if (this.preOrder.totalReduceMoney > 0) {
-                    list.push({
-                        label: '分享降价',
-                        amount: parseFloat(this.preOrder.totalReduceMoney).toFixed(2)
-                    });
-                }
-                // 3. 活动优惠 (每满减等)
-                if (this.preOrder.discountMoney > 0) {
-                    list.push({
-                        label: this.preOrder.discountDesc || '活动优惠',
-                        amount: parseFloat(this.preOrder.discountMoney).toFixed(2)
-                    });
-                }
-                return list;
-            }
         },
         onLoad(options) {
             // 从本地存储获取提交订单数据
@@ -237,6 +197,7 @@
                 } else {
                     this.submitData.userCouponIds = [];
                 }
+                this.refreshPreOrderData();
             },
 
             onStockShortageConfirm(option) {
@@ -262,7 +223,8 @@
                 uni.showLoading({ title: '加载中' });
                 this.$u.api.preSubmitOrderAjax({
                     cartIdList: this.submitData.cartIdList,
-                    addressId: this.submitData.addressId
+                    addressId: this.submitData.addressId,
+                    userCouponIds: this.submitData.userCouponIds
                 }).then(res => {
                     uni.hideLoading();
                     if (res.code == 200) {

pages-mine/components/partner-order-item.vue

@@ -42,6 +42,10 @@
                 type: Object,
                 default: () => ({}),
             },
+            type: {
+                type: [String, Number],
+                default: 0
+            }
         },
         data() {
             return {
@@ -81,7 +85,7 @@
         },
         computed: {
             isBuy() {
-                return this.order.type == '2';
+                return this.type == 1 || this.order.type == '2';
             },
             currentOrderStatusText() {
                 if (this.isBuy) {

pages-mine/pages/partner/order-detail.vue

@@ -1,16 +1,23 @@
 <template>
     <view class="order-detail">
-        <!-- 标签页 -->
-        <view class="tabs-wrapper">
-            <u-tabs :list="tabList" :current="currentTab" @change="handleTabChange" :is-scroll="false"
-                active-color="#38C148" bar-width="60"></u-tabs>
+        <view class="sticky-header">
+            <!-- 订单类型切换 -->
+            <view class="type-tabs-wrapper">
+                <u-subsection :list="typeList" :current="currentType" @change="handleTypeChange" active-color="#38C148" mode="subsection"></u-subsection>
+            </view>
+
+            <!-- 标签页 -->
+            <view class="tabs-wrapper">
+                <u-tabs :list="tabList" :current="currentTab" @change="handleTabChange" :is-scroll="false"
+                    active-color="#38C148" bar-width="60"></u-tabs>
+            </view>
         </view>
 
         <!-- 订单列表 -->
         <page-scroll :page-size="12" @updateList="handleUpdateList" ref="pageRef" slotEmpty
-            url="/token/userPartner/geOrderList" :params="params" :immediate="false">
+            :url="currentUrl" :params="params" :immediate="false">
             <view v-if="orderList.length > 0" class="pad-20">
-                <partner-order-item v-for="order in orderList" :key="order.orderNo" :order="order"></partner-order-item>
+                <partner-order-item v-for="order in orderList" :key="order.orderNo || order.orderId" :order="order" :type="currentType"></partner-order-item>
             </view>
         </page-scroll>
     </view>
@@ -27,6 +34,12 @@ export default {
     },
     data() {
         return {
+            typeList: [
+                { name: '卖书订单' },
+                { name: '买书订单' }
+            ],
+            currentType: 0,
+            currentUrl: '/token/userPartner/geOrderList',
             tabList: [{
                 name: '全部',
                 status: ""
@@ -76,6 +89,15 @@ export default {
             })
         },
 
+        handleTypeChange(index) {
+            this.currentType = index
+            this.currentUrl = index === 0 ? '/token/userPartner/geOrderList' : '/token/userPartner/getShopOrderList'
+            this.orderList = []
+            this.$nextTick(() => {
+                this.loadOrders(true, this.params)
+            })
+        },
+
         handleTabChange(index) {
             this.currentTab = index
             this.params.status = this.tabList[index].status
@@ -94,13 +116,22 @@ export default {
     min-height: 100vh;
     background-color: #F5F5F5;
 
-    .tabs-wrapper {
+    .sticky-header {
         position: sticky;
         top: 0;
         z-index: 99;
         background: #FFFFFF;
     }
 
+    .type-tabs-wrapper {
+        padding: 20rpx 30rpx 0;
+        background-color: #FFFFFF;
+    }
+
+    .tabs-wrapper {
+        background: #FFFFFF;
+    }
+
     .pad-20 {
         padding: 20rpx;
     }

pages-mine/pages/rules-for-sellbooks.vue

@@ -1,8 +1,16 @@
 <template>
-    <view class="rules-page" v-if="!loading">
+    <view class="rules-page">
+        <!-- 头部选项卡 -->
+        <view class="sticky-header">
+            <view class="type-tabs-wrapper">
+                <view class="type-tab" :class="{ active: currentTab === 0 }" @click="handleTabChange(0)">卖书答疑</view>
+                <view class="type-tab" :class="{ active: currentTab === 1 }" @click="handleTabChange(1)">买书答疑</view>
+            </view>
+        </view>
+
         <!-- 折叠面板 -->
-        <view class="collapse-container">
-            <u-collapse :accordion="true" @change="changeHandler">
+        <view class="collapse-container" v-if="!loading && faqList.length > 0">
+            <u-collapse :accordion="true" @change="changeHandler" ref="collapse">
                 <u-collapse-item
                     v-for="(item, index) in faqList"
                     :key="index"
@@ -14,20 +22,18 @@
                 >
                     <template #title>
                         <view class="custom-title">
-                            <view class="number-circle">{{ index + 1 }}</view>
                             <text class="title-text">{{ item.subTitle }}</text>
                         </view>
                     </template>
                     <view class="collapse-content">
                         <u-parse :html="item.subContent" class="rich-text-style"></u-parse>
-                        <!-- <rich-text :nodes="item.subContent" class="rich-text-style"></rich-text> -->
                     </view>
                 </u-collapse-item>
             </u-collapse>
         </view>
 
         <!-- 空状态 -->
-        <view v-if="faqList.length === 0" class="empty-state">
+        <view v-if="!loading && faqList.length === 0" class="empty-state">
             <u-empty mode="data" text="暂无数据"></u-empty>
         </view>
 
@@ -56,16 +62,25 @@
 export default {
     data() {
         return {
-            pageTitle: "卖书规则",
+            currentTab: 0,
             faqList: [], // FAQ列表数据
             loading: false,
             selectedIndex: -1,
         };
     },
     onLoad() {
+        uni.setNavigationBarTitle({
+            title: "买卖答疑"
+        });
         this.getFaqData();
     },
     methods: {
+        handleTabChange(index) {
+            if (this.currentTab === index) return;
+            this.currentTab = index;
+            this.selectedIndex = -1;
+            this.getFaqData();
+        },
         navigateToCustomerService() {
             uni.navigateTo({
                 url: '/pages-mine/pages/customer-service'
@@ -74,15 +89,12 @@ export default {
         // 获取FAQ数据
         getFaqData() {
             this.loading = true;
+            const code = this.currentTab === 0 ? 'faq' : 'faqShop';
             this.$u.http
-                .get("/token/getArticleTwo?code=faq")
+                .get("/token/getArticleTwo?code=" + code)
                 .then((res) => {
                     if (res.code === 200) {
-                        // 根据接口返回的数据结构进行处理
-                        this.pageTitle = res.data.title || "卖书规则";
-
-                        // 根据接口返回的数据结构处理
-                        if (res.data.subArticleList && res.data.subArticleList.length > 0) {
+                        if (res.data && res.data.subArticleList && res.data.subArticleList.length > 0) {
                             this.faqList = res.data.subArticleList;
                         } else {
                             this.faqList = [];
@@ -113,24 +125,53 @@ export default {
 .rules-page {
     min-height: 100vh;
     background-color: #f5f5f5;
-    padding: 20rpx 30rpx;
     padding-bottom: 120rpx;
 }
 
-.rules-container {
-    padding: 30rpx;
+.sticky-header {
+    position: sticky;
+    top: 0;
+    z-index: 99;
+    background: #f5f5f5;
 }
 
-.page-title {
-    font-size: 36rpx;
-    font-weight: bold;
-    color: #333;
-    margin-bottom: 30rpx;
+.type-tabs-wrapper {
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    height: 88rpx;
+    background-color: #f5f5f5;
+}
+
+.type-tab {
+    flex: 1;
     text-align: center;
+    font-size: 30rpx;
+    color: #666;
+    line-height: 88rpx;
+    position: relative;
+    background-color: transparent;
+}
+
+.type-tab.active {
+    color: #38c148;
+    font-weight: bold;
+}
+
+.type-tab.active::after {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 60rpx;
+    height: 4rpx;
+    background-color: #38c148;
+    border-radius: 4rpx;
 }
 
 .collapse-container {
-    background-color: #f5f5f5;
+    background-color: #ffffff;
     overflow: hidden;
 }
 
@@ -140,30 +181,18 @@ export default {
     flex: 1;
 }
 
-.number-circle {
-    width: 40rpx;
-    height: 40rpx;
-    border-radius: 50%;
-    background-color: #38c148;
-    color: white;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 28rpx;
-    margin-right: 20rpx;
-    flex-shrink: 0;
-}
-
 .title-text {
     font-size: 28rpx;
     color: #333;
     flex: 1;
 }
 
-.sub-content {
-    font-size: 26rpx;
-    color: #666;
-    line-height: 1.6;
+.collapse-content {
+    color: #444444;
+    font-size: 28rpx;
+    padding: 20rpx 0;
+    height: auto;
+    overflow: visible;
 }
 
 .empty-state {
@@ -200,38 +229,30 @@ export default {
     color: #ffffff;
     text-align: center;
 }
-.collapse-content {
-    color: #444444;
-    font-size: 28rpx;
-    padding: 10rpx 0;
-    height: auto;
-    overflow: visible;
-}
-.rich-text-style {
-    width: 100%;
-}
-.rich-text-style img {
-    max-width: 100%;
-    height: auto !important;
-    border-radius: 10rpx;
-    margin-top: 10rpx;
-    display: block;
-}
 
 ::v-deep .u-collapse-item {
-    margin-bottom: 20rpx;
-    border-radius: 10rpx;
+    border-bottom: 1px solid #f0f0f0;
     overflow: visible;
     background-color: #ffffff;
     padding: 0 30rpx;
 }
 
+::v-deep .u-collapse-item:last-child {
+    border-bottom: none;
+}
+
 ::v-deep .active-item .u-collapse-body {
     height: fit-content !important;
 }
 
-/* 添加rich-text内容样式 */
 ::v-deep .rich-text-style {
     width: 100%;
 }
+::v-deep .rich-text-style img {
+    max-width: 100%;
+    height: auto !important;
+    border-radius: 10rpx;
+    margin-top: 10rpx;
+    display: block;
+}
 </style>

pages.json

@@ -232,7 +232,7 @@
                 {
                     "path": "pages/rules-for-sellbooks",
                     "style": {
-                        "navigationBarTitleText": "卖书规则"
+                        "navigationBarTitleText": "买卖答疑"
                     }
                 },
                 {