修改显示问题

src/pages/product/p_details.vue

@@ -1,89 +1,165 @@
 <template>
-    <view class="container">
-        <!-- 轮播图 -->
-        <swiper-banner imgScale="1:1" :imgArr="detail.goods_img" :duration="1000" :interval="5000" :circular="true" :autoplay="true" :indicator-dots="true" indicator-active-color="#12B280" indicator-color="rgba(255, 255, 255, .82)"></swiper-banner>
-        <!-- 轮播图-end -->
-        <!-- 价格信息栏 -->
-        <view class="price_info flex_r flex_ac flex_jb">
-            <view v-if="type == 5" class="price">
-                <span v-if="Number(detail.cost_price) != 0">{{ detail.cost_price }}元</span>
-                <span v-if="Number(detail.cha_bao) != 0 && Number(detail.cost_price) != 0">+</span>
-                <span v-if="Number(detail.cha_bao) != 0">{{ detail.cha_bao }}茶宝</span>
-            </view>
-            <view v-else class="price" :class="type == 2 ? 'samll' : ''">
-                <text>￥{{ type == 2 ? detail.trade_price : detail.cost_price }}</text>
-                <text v-if="type == 6" class="p_favour">{{detail.original_price}}</text>
-            </view>
-            <view class="price_span flex_r flex_ac flex_je">
-                <view class="triangle"></view>
-                <view class="span_conten flex_r flex_ac flex_jc">{{ tidyTpye(goodsDa.type) }}</view>
-            </view>
+  <view class="container">
+    <!-- 轮播图 -->
+    <swiper-banner
+      imgScale="1:1"
+      :imgArr="detail.goods_img"
+      :duration="1000"
+      :interval="5000"
+      :circular="true"
+      :autoplay="true"
+      :indicator-dots="true"
+      indicator-active-color="#12B280"
+      indicator-color="rgba(255, 255, 255, .82)"
+    ></swiper-banner>
+    <!-- 轮播图-end -->
+    <!-- 价格信息栏 -->
+    <view class="price_info flex_r flex_ac flex_jb">
+      <view v-if="type == 5" class="price">
+        <span v-if="Number(detail.cost_price) != 0"
+          >{{ detail.cost_price }}元</span
+        >
+        <span
+          v-if="Number(detail.cha_bao) != 0 && Number(detail.cost_price) != 0"
+          >+</span
+        >
+        <span v-if="Number(detail.cha_bao) != 0">{{ detail.cha_bao }}茶宝</span>
+      </view>
+      <view v-else class="price" :class="type == 2 ? 'samll' : ''">
+        <view>
+          <text class="p_favour" v-if="(type == 2)"
+            >￥{{ detail.trade_price }}  + {{detail.trade_num}}批发积分 + {{detail.treasure_price}}茶宝</text
+          >
+          <text v-if="type == 6" class="p_favour">￥{{
+            detail.min_price
+          }}</text>
+          <text v-if="(type == 1)" class="p_favour">￥{{
+            detail.cost_price
+          }}</text>
+          <text class="p_favour" v-if="(type == 3 || type == 4)">
+            ￥{{detail.cost_price}}
+          </text>
+          <text class="p_favour" v-if="(type == 5)">
+            ￥{{detail.cost_price}} + + {{detail.treasure_price}}茶宝
+          </text>
         </view>
-        <!-- 价格信息栏-end -->
-        <!-- 标题信息栏 -->
-        <view class="title_info">
-            <view class="goods_name">{{ detail.goods_name }}</view>
-            <view class="goods_subName">{{ detail.goodsMsg }}</view>
+        <span class="p_trade" v-if="(type == 1)">送 {{detail.trade_give_num}} 批发积分</span>
+        <span class="p_trade" v-if="(type == 3 || type == 4)">送 {{detail.give_cha_bao}} 茶宝</span>
+      </view>
+      <view class="price_span flex_r flex_ac flex_je">
+        <view class="triangle"></view>
+        <view class="span_conten flex_r flex_ac flex_jc">{{
+          tidyTpye(goodsDa.type)
+        }}</view>
+      </view>
+    </view>
+    <!-- 价格信息栏-end -->
+    <!-- 标题信息栏 -->
+    <view class="title_info">
+      <view class="goods_name">{{ detail.goods_name }}</view>
+      <view class="goods_subName">{{ detail.goodsMsg }}</view>
+    </view>
+    <!-- 标题信息栏-end -->
+    <!-- 产品简介 -->
+    <view class="brief mar_t20">
+      <view class="brief_title flex_r flex_ac">产品简介</view>
+      <view class="brief_con">
+        <jyfParser :html="detail.goods_content" ref="jyf"></jyfParser>
+        <!-- <image :lazy-load="true" style="width: 100%;display: block;" v-for="(item,index) in detail.goodsDetailesImage" :key="index" :src="item" mode="widthFix"></image> -->
+      </view>
+    </view>
+    <!-- 产品简介-end -->
+    <!-- 底部导航组件 -->
+    <view class="option">
+      <uni-goods-nav
+        :fill="true"
+        :options="options"
+        :buttonGroup="type == 5 ? buttonGroupTea : buttonGroup"
+        @click="onClick"
+        @buttonClick="buttonClick"
+      />
+    </view>
+    <!-- 底部导航组件-end -->
+    <!-- 授权 -->
+    <authorize-module
+      v-if="showAuth"
+      :shopInfo="shopInfo"
+      @authGetTelSuccess="onauthGetTelSuccess"
+    />
+    <!-- 授权-end -->
+    <!-- 购买或加入购物车弹窗 -->
+    <uni-popup ref="shopping" type="bottom">
+      <view class="shopping">
+        <view class="close_con flex_r flex_je">
+          <image
+            class="close_img"
+            src="/static/close.png"
+            @tap="closeBtn"
+            mode=""
+          ></image>
         </view>
-        <!-- 标题信息栏-end -->
-        <!-- 产品简介 -->
-        <view class="brief mar_t20">
-            <view class="brief_title flex_r flex_ac">产品简介</view>
-            <view class="brief_con">
-                <jyfParser :html="detail.goods_content" ref="jyf"></jyfParser>
-                <!-- <image :lazy-load="true" style="width: 100%;display: block;" v-for="(item,index) in detail.goodsDetailesImage" :key="index" :src="item" mode="widthFix"></image> -->
+        <view class="goods_info flex_r">
+          <image class="goods_img" :src="detail.original_img" mode=""></image>
+          <view class="goods_con flex_c flex_jb">
+            <view class="shop_names">{{ detail.goods_name }}</view>
+            <view class="goods_msg" v-if="type == 2"
+              >{{ detail.trade_price }}元+{{ detail.trade_num }}批发积分+{{
+                detail.treasure_price
+              }}茶宝</view
+            >
+            <view class="goods_msg" v-else>￥{{ detail.cost_price }}</view>
+            <view class="num_con flex_r flex_je" v-if="type != 6">
+              <uni-number-box
+                :min="1"
+                @change="bindChange"
+                :value="buyNum"
+              ></uni-number-box>
             </view>
+            <view class="num_str flex_r flex_je" v-else>x 1</view>
+          </view>
         </view>
-        <!-- 产品简介-end -->
-        <!-- 底部导航组件 -->
-        <view class="option">
-            <uni-goods-nav :fill="true" :options="options" :buttonGroup="type == 5 ? buttonGroupTea : buttonGroup" @click="onClick" @buttonClick="buttonClick" />
+        <view class="goods_option flex_r flex_ac flex_jc" v-if="type == 2">
+          <view class="goods_raido flex_r flex_ac" @tap="setWay('1')">
+            <view
+              class="raido_img"
+              :class="pfway == '1' ? 'raido_box' : ''"
+            ></view>
+            <view class="raido_text">申请寄售</view>
+          </view>
+          <view class="goods_raido flex_r flex_ac" @tap="setWay('0')">
+            <view
+              class="raido_img"
+              :class="pfway == '0' ? 'raido_box' : ''"
+            ></view>
+            <view class="raido_text">发货邮寄</view>
+          </view>
         </view>
-        <!-- 底部导航组件-end -->
-        <!-- 授权 -->
-        <authorize-module v-if="showAuth" :shopInfo="shopInfo" @authGetTelSuccess="onauthGetTelSuccess" />
-        <!-- 授权-end -->
-        <!-- 购买或加入购物车弹窗 -->
-        <uni-popup ref="shopping" type="bottom">
-            <view class="shopping">
-                <view class="close_con flex_r flex_je">
-                    <image class="close_img" src="/static/close.png" @tap="closeBtn" mode=""></image>
-                </view>
-                <view class="goods_info flex_r">
-                    <image class="goods_img" :src="detail.original_img" mode=""></image>
-                    <view class="goods_con flex_c flex_jb">
-                        <view class="shop_names">{{ detail.goods_name }}</view>
-                        <view class="goods_msg" v-if="type == 2">{{detail.trade_price}}元+{{detail.trade_num}}批发积分+{{detail.treasure_price}}茶宝</view>
-                        <view class="goods_msg" v-else>￥{{ detail.cost_price }}</view>
-                        <view class="num_con flex_r flex_je" v-if="type != 6">
-                            <uni-number-box :min="1" @change="bindChange" :value="buyNum"></uni-number-box>
-                        </view>
-                        <view class="num_str flex_r flex_je" v-else>x 1</view>
-                    </view>
-                </view>
-                <view class="goods_option flex_r flex_ac flex_jc" v-if="type == 2">
-                    <view class="goods_raido flex_r flex_ac" @tap="setWay('1')">
-                        <view class="raido_img" :class="pfway == '1' ? 'raido_box' : ''"></view>
-                        <view class="raido_text">申请寄售</view>
-                    </view>
-                    <view class="goods_raido flex_r flex_ac" @tap="setWay('0')">
-                        <view class="raido_img" :class="pfway == '0' ? 'raido_box' : ''"></view>
-                        <view class="raido_text">发货邮寄</view>
-                    </view>
-                </view>
-                <checkbox-group class="flex_r flex_ac flex_jc" @change="checkboxChange">
-                    <label class="option_box">
-                        <checkbox value="1" :checked="checked" color="#2DB389" style="transform: scale(0.7)" />
-                        我已阅读同意<text @tap.stop="getProPage" v-if="(type != 5 && type != 6)">《购买协议》</text>
-                        <text @tap.stop="getProPage" v-else-if="(type == 5)">《兑换协议》</text>
-                        <text @tap.stop="getProPage" v-else-if="(type == 6)">《天天捡漏协议》</text>
-                    </label>
-                </checkbox-group>
-                <view class="confim flex_r flex_ac flex_jc" @tap="ToPayPage">确定</view>
-            </view>
-        </uni-popup>
-        <!-- 购买或加入购物车弹窗-end -->
-    </view>
+        <checkbox-group class="flex_r flex_ac flex_jc" @change="checkboxChange">
+          <label class="option_box">
+            <checkbox
+              value="1"
+              :checked="checked"
+              color="#2DB389"
+              style="transform: scale(0.7)"
+            />
+            我已阅读同意<text
+              @tap.stop="getProPage"
+              v-if="type != 5 && type != 6"
+              >《购买协议》</text
+            >
+            <text @tap.stop="getProPage" v-else-if="type == 5"
+              >《兑换协议》</text
+            >
+            <text @tap.stop="getProPage" v-else-if="type == 6"
+              >《天天捡漏协议》</text
+            >
+          </label>
+        </checkbox-group>
+        <view class="confim flex_r flex_ac flex_jc" @tap="ToPayPage">确定</view>
+      </view>
+    </uni-popup>
+    <!-- 购买或加入购物车弹窗-end -->
+  </view>
 </template>
 <script>
 let page = 1;
@@ -97,501 +173,524 @@ import uniGoodsNav from "@/components/uni-goods-nav/uni-goods-nav.vue";
 import uniNumberBox from "@/components/uni-number-box/uni-number-box.vue";
 import authorizeModule from "@/components/authorize-module/index";
 export default {
-    components: {
-        uniPopup,
-        jyfParser,
-        uniGoodsNav,
-        swiperBanner,
-        uniNumberBox,
-        authorizeModule,
-    },
-    data() {
-        return {
-            imgArr: ["/static/goods5.jpg"],
-            content: "",
-            options: [
-                // 底部导航跳转
-                {
-                    icon: "home",
-                    text: "主页",
-                },
-                // {
-                //  icon: 'cart',
-                //  text: '购物车',
-                //  info: 0
-                // }
-            ],
-            buttonGroup: [
-                // 底部操作按钮
-                // {
-                //  text: '加入购物车',
-                //  backgroundColor: '#ff0000',
-                //  color: '#fff'
-                // },
-                {
-                    text: "立即购买",
-                    backgroundColor: "#ffa200",
-                    color: "#fff",
-                },
-            ],
-            buttonGroupTea: [
-                // 底部操作按钮
-                // {
-                //  text: '加入购物车',
-                //  backgroundColor: '#ff0000',
-                //  color: '#fff'
-                // },
-                {
-                    text: "立即兑换",
-                    backgroundColor: "#ffa200",
-                    color: "#fff",
-                },
-            ],
-            btnIndex: 0, // 用户点击按钮事件判断 0：加入购物车；1：立即购买
-            type: null, // 商品类型，1零售 2批发 3精品 4今日值买
-            goodsId: "", // 商品ID
-            id: "", //合伙人套餐ID
-            detail: {
-                goods: {},
-            }, // 商品详情
-            checked: false, //是否选中协议
-            buyNum: 1, //购买数量
-            pfway: "1", // 批发
-            shopInfo: {}, // 商铺信息
-            showAuth: false,
-
-            userinfo: {},
-            goodsDa: {},
-            unid: '',
-        };
-    },
-    onLoad: function(e) {
-        this.userinfo = uni.getStorageSync("userinfo");
-        let token = uni.getStorageSync("token");
-        this.type = e.type;
-        this.goodsDa = e;
-        this.loadData(e);
-
-        if (e.invite && !token) this.login(e.invite);
-    },
-    onShow: function() {},
-    methods: {
-        // 商品详情信息
-        loadData(da) {
-            post("goods/goodsDetail", da).then((res) => {
-                if (res.code === 0) {
-                    this.detail = res.data.data;
-                    let imgs = [];
-                    imgs.push(this.detail.original_img);
-                    imgs.push(...this.detail.goods_img);
-                    this.detail.goods_img = imgs;
-                } else {
-                    uni.showModal({
-                        title: "提示",
-                        content: res.msg,
-                        showCancel: false,
-                        success: function(res) {
-                            if (res) {
-                                uni.navigateBack({
-                                    delta: 1,
-                                });
-                            }
-                        },
-                    });
-                }
-            });
-        },
-        // 去购买
-        ToPayPage: function() {
-            if (!this.checked) {
-                appEv.errTips("请阅读并同意购买协议");
-                return;
-            }
-            if (this.btnIndex == 0) {
-                this.toPayOrder();
-            }
-        },
-        // 创建购买订单
-        toPayOrder: function() {
-            let da = {
-                ...this.goodsDa,
-                num: Number(this.buyNum),
-                is_sell: this.type == 2 ? this.pfway : '0'
-            }
-            this.goto("/pages/to-pay-list/index", da);
-        },
-        // 添加到购物车
-        SetCartGoodsList() {},
-        // 购买数量更改
-        bindChange(e) {
-            this.buyNum = e;
+  components: {
+    uniPopup,
+    jyfParser,
+    uniGoodsNav,
+    swiperBanner,
+    uniNumberBox,
+    authorizeModule,
+  },
+  data() {
+    return {
+      imgArr: ["/static/goods5.jpg"],
+      content: "",
+      options: [
+        // 底部导航跳转
+        {
+          icon: "home",
+          text: "主页",
         },
-        // 更改批发方式
-        setWay(e) {
-            this.pfway = e;
+        // {
+        //  icon: 'cart',
+        //  text: '购物车',
+        //  info: 0
+        // }
+      ],
+      buttonGroup: [
+        // 底部操作按钮
+        // {
+        //  text: '加入购物车',
+        //  backgroundColor: '#ff0000',
+        //  color: '#fff'
+        // },
+        {
+          text: "立即购买",
+          backgroundColor: "#ffa200",
+          color: "#fff",
         },
-        // 点击同意协议
-        checkboxChange(e) {
-            let index = e.detail.value.indexOf("1");
-            if (index != -1) {
-                this.checked = true;
-            } else {
-                this.checked = false;
-            }
-        },
-        // 点击底部主页购物车等按钮
-        onClick(e) {
-            if (e.index === 0) {
-                uni.switchTab({ url: "/pages/index/index" });
-            }
-        },
-        // 点击立即购买或加入购物车
-        buttonClick: function(e) {
-            this.btnIndex = e.index;
-            this.$refs.shopping.open();
-        },
-        // 点击关闭弹窗
-        closeBtn: function() {
-            this.$refs.shopping.close();
-        },
-        getProPage() {
-            uni.navigateTo({
-                url: "/pages/pay-agreement/index?type=" + this.goodsDa.type,
-            });
+      ],
+      buttonGroupTea: [
+        // 底部操作按钮
+        // {
+        //  text: '加入购物车',
+        //  backgroundColor: '#ff0000',
+        //  color: '#fff'
+        // },
+        {
+          text: "立即兑换",
+          backgroundColor: "#ffa200",
+          color: "#fff",
         },
+      ],
+      btnIndex: 0, // 用户点击按钮事件判断 0：加入购物车；1：立即购买
+      type: null, // 商品类型，1零售 2批发 3精品 4今日值买
+      goodsId: "", // 商品ID
+      id: "", //合伙人套餐ID
+      detail: {
+        goods: {},
+      }, // 商品详情
+      checked: false, //是否选中协议
+      buyNum: 1, //购买数量
+      pfway: "1", // 批发
+      shopInfo: {}, // 商铺信息
+      showAuth: false,
+
+      userinfo: {},
+      goodsDa: {},
+      unid: "",
+    };
+  },
+  onLoad: function (e) {
+    this.userinfo = uni.getStorageSync("userinfo");
+    let token = uni.getStorageSync("token");
+    this.type = e.type;
+    this.goodsDa = e;
+    this.loadData(e);
+
+    if (e.invite && !token) this.login(e.invite);
+  },
+  onShow: function () {},
+  methods: {
+    // 商品详情信息
+    loadData(da) {
+      post("goods/goodsDetail", da).then((res) => {
+        if (res.code === 0) {
+          this.detail = res.data.data;
+          let imgs = [];
+          imgs.push(this.detail.original_img);
+          imgs.push(...this.detail.goods_img);
+          this.detail.goods_img = imgs;
+        } else {
+          uni.showModal({
+            title: "提示",
+            content: res.msg,
+            showCancel: false,
+            success: function (res) {
+              if (res) {
+                uni.navigateBack({
+                  delta: 1,
+                });
+              }
+            },
+          });
+        }
+      });
+    },
+    // 去购买
+    ToPayPage: function () {
+      if (!this.checked) {
+        appEv.errTips("请阅读并同意购买协议");
+        return;
+      }
+      if (this.btnIndex == 0) {
+        this.toPayOrder();
+      }
+    },
+    // 创建购买订单
+    toPayOrder: function () {
+      let da = {
+        ...this.goodsDa,
+        num: Number(this.buyNum),
+        is_sell: this.type == 2 ? this.pfway : "0",
+      };
+      this.goto("/pages/to-pay-list/index", da);
+    },
+    // 添加到购物车
+    SetCartGoodsList() {},
+    // 购买数量更改
+    bindChange(e) {
+      this.buyNum = e;
+    },
+    // 更改批发方式
+    setWay(e) {
+      this.pfway = e;
+    },
+    // 点击同意协议
+    checkboxChange(e) {
+      let index = e.detail.value.indexOf("1");
+      if (index != -1) {
+        this.checked = true;
+      } else {
+        this.checked = false;
+      }
+    },
+    // 点击底部主页购物车等按钮
+    onClick(e) {
+      if (e.index === 0) {
+        uni.switchTab({ url: "/pages/index/index" });
+      }
+    },
+    // 点击立即购买或加入购物车
+    buttonClick: function (e) {
+      this.btnIndex = e.index;
+      this.$refs.shopping.open();
+    },
+    // 点击关闭弹窗
+    closeBtn: function () {
+      this.$refs.shopping.close();
+    },
+    getProPage() {
+      uni.navigateTo({
+        url: "/pages/pay-agreement/index?type=" + this.goodsDa.type,
+      });
+    },
 
-
-        login(invite) {
-            let that = this;
-            // #ifdef  MP-WEIXIN
-            wx.login({
-                success(res) {
-                    if (res.code) {
-                        post("appletLogin", {
-                            invite,
-                            code: res.code,
-                        }).then((res) => {
-                            if (res.code === 0) {
-                                if (res.data.token) {
-                                    uni.setStorageSync("token", res.data.token);
-                                    that.getuserInfo();
-                                } else {
-                                    that.unid = res.data.unid;
-                                    // setTimeout(() => {
-                                    that.shopInfo = app.globalData.shopInfo;
-                                    that.showAuth = true;
-                                    // }, 1000);
-                                }
-                            }
-                        });
-                    }
-                },
-            });
-            // #endif
-        },
-        onauthGetTelSuccess(da) {
-            this.showAuth = false;
-            post("getMobile", {
-                unid: this.unid,
-                ...da.detail
+    login(invite) {
+      let that = this;
+      // #ifdef  MP-WEIXIN
+      wx.login({
+        success(res) {
+          if (res.code) {
+            post("appletLogin", {
+              invite,
+              code: res.code,
             }).then((res) => {
-                if (res.code === 0) {
-                    uni.setStorageSync("token", res.data.token);
-                    this.getuserInfo();
-                }
-            });
-        },
-        getuserInfo() {
-            post("/user/userinfo").then((res) => {
-                if (res.code === 0) {
-                    uni.setStorageSync("userinfo", res.data.data);
-                    this.userinfo = res.data.data;
+              if (res.code === 0) {
+                if (res.data.token) {
+                  uni.setStorageSync("token", res.data.token);
+                  that.getuserInfo();
+                } else {
+                  that.unid = res.data.unid;
+                  // setTimeout(() => {
+                  that.shopInfo = app.globalData.shopInfo;
+                  that.showAuth = true;
+                  // }, 1000);
                 }
+              }
             });
+          }
         },
+      });
+      // #endif
     },
-    onShareAppMessage: function() {
-        let userinfo = uni.getStorageSync("userinfo");
-        var path = "/pages/product/p_details?agentId=1" + '&id=' + this.goodsDa.id + '&type=' + this.goodsDa.type;
-        if (userinfo.invite) {
-            path = "/pages/product/p_details?invite=" + userinfo.invite + '&id=' + this.goodsDa.id + '&type=' + this.goodsDa.type;
+    onauthGetTelSuccess(da) {
+      this.showAuth = false;
+      post("getMobile", {
+        unid: this.unid,
+        ...da.detail,
+      }).then((res) => {
+        if (res.code === 0) {
+          uni.setStorageSync("token", res.data.token);
+          this.getuserInfo();
         }
-        var title = `让数字经济赋能美好生活！`;
-        return {
-            title: title,
-            path: path,
-        };
+      });
     },
+    getuserInfo() {
+      post("/user/userinfo").then((res) => {
+        if (res.code === 0) {
+          uni.setStorageSync("userinfo", res.data.data);
+          this.userinfo = res.data.data;
+        }
+      });
+    },
+  },
+  onShareAppMessage: function () {
+    let userinfo = uni.getStorageSync("userinfo");
+    var path =
+      "/pages/product/p_details?agentId=1" +
+      "&id=" +
+      this.goodsDa.id +
+      "&type=" +
+      this.goodsDa.type;
+    if (userinfo.invite) {
+      path =
+        "/pages/product/p_details?invite=" +
+        userinfo.invite +
+        "&id=" +
+        this.goodsDa.id +
+        "&type=" +
+        this.goodsDa.type;
+    }
+    var title = `让数字经济赋能美好生活！`;
+    return {
+      title: title,
+      path: path,
+    };
+  },
 };
 </script>
 <style lang="scss">
 // 页面配置
 page {
-    background: #f5f5f5;
+  background: #f5f5f5;
 }
 
 .container {
-    padding-bottom: 90rpx;
+  padding-bottom: 90rpx;
 }
 
 // 页面配置-end
 
 // 价格信息栏
 .price_span {
-    width: 283rpx;
-    height: 100%;
-    position: relative;
+  width: 283rpx;
+  height: 100%;
+  position: relative;
 }
 
 .price text {
-    // font-size: 24rpx;
-    color: #fff;
-    font-family: "SourceHanSansCN-Medium";
+  // font-size: 24rpx;
+  color: #fff;
+  font-family: "SourceHanSansCN-Medium";
 }
 
 .price_info {
-    background: #ff6d44;
-    height: 92rpx;
-    width: 100%;
-    box-sizing: border-box;
+  background: #ff6d44;
+  height: 92rpx;
+  width: 100%;
+  box-sizing: border-box;
 }
 
 .price {
-    font-size: 38rpx;
-    color: #fff;
-    font-family: "SourceHanSansCN-Medium";
-    margin-left: 20rpx;
-    .p_favour{
-        font-size: 28rpx;
-        margin-left: 20rpx;
-        text-decoration: line-through;
-        &:before{
-            content:"￥";
-        }
-    }
+  font-size: 38rpx;
+  color: #fff;
+  font-family: "SourceHanSansCN-Medium";
+  margin-left: 20rpx;
+  justify-content: flex-end;
+  align-items: flex-end;
+  text-align: end;
+  display: flex;
+  flex-direction: row;
+  // padding: 2px 0;
+  .p_favour {
+    font-size: 36rpx;
+    flex: 2;
+    // margin-left: 20rpx;
+    // text-decoration: line-through;
+    // &:before{
+    //     content:"￥";
+    // }
+  }
+  .p_trade {
+    flex: 1;
+    font-size: 20rpx;
+    display: flex;
+    margin-left:20rpx;
+  }
 }
 
 .span_conten {
-    width: calc(283rpx - 46rpx);
-    height: 100%;
-    background: #ffcabb;
-    position: relative;
-    font-size: 34rpx;
-    font-family: "SourceHanSansCN-Medium";
-    color: #682918;
+  width: calc(283rpx - 46rpx);
+  height: 100%;
+  background: #ffcabb;
+  position: relative;
+  font-size: 34rpx;
+  font-family: "SourceHanSansCN-Medium";
+  color: #682918;
 }
 
 .triangle {
-    width: 0px;
-    height: 0px;
-    border-top: 92rpx solid rgba(0, 0, 0, 0);
-    border-right: 92rpx solid rgba(0, 0, 0, 0);
-    border-bottom: 92rpx solid #ffcabb;
-    border-left: 92rpx solid rgba(0, 0, 0, 0);
-    transform: translate(-46rpx, -92rpx);
-    position: absolute;
-    top: 0;
-    left: 0;
+  width: 0px;
+  height: 0px;
+  border-top: 92rpx solid rgba(0, 0, 0, 0);
+  border-right: 92rpx solid rgba(0, 0, 0, 0);
+  border-bottom: 92rpx solid #ffcabb;
+  border-left: 92rpx solid rgba(0, 0, 0, 0);
+  transform: translate(-46rpx, -92rpx);
+  position: absolute;
+  top: 0;
+  left: 0;
 }
 
 .samll {
-    font-size: 28rpx;
-    max-width: calc(100% - 360rpx);
-    line-height: 1.3;
-    text-align: justify;
+  font-size: 28rpx;
+  max-width: calc(100% - 360rpx);
+  line-height: 1.3;
+  text-align: justify;
 }
 
 // 价格信息栏-end
 
 // 标题信息栏
 .goods_subName {
-    width: 100%;
-    overflow: hidden;
-    font-size: 22rpx;
-    color: #787878;
+  width: 100%;
+  overflow: hidden;
+  font-size: 22rpx;
+  color: #787878;
 }
 
 .title_info {
-    width: 100%;
-    overflow: hidden;
-    background: #ffffff;
-    padding: 20rpx;
-    box-sizing: border-box;
+  width: 100%;
+  overflow: hidden;
+  background: #ffffff;
+  padding: 20rpx;
+  box-sizing: border-box;
 }
 
 .goods_name {
-    width: 100%;
-    overflow: hidden;
-    font-size: 32rpx;
-    color: #1b1b1b;
-    font-family: "SourceHanSansCN-Bold";
-    font-weight: bold;
-    margin-bottom: 20rpx;
+  width: 100%;
+  overflow: hidden;
+  font-size: 32rpx;
+  color: #1b1b1b;
+  font-family: "SourceHanSansCN-Bold";
+  font-weight: bold;
+  margin-bottom: 20rpx;
 }
 
 // 标题信息栏-end
 
 // 产品简介
 .brief {
-    width: 100%;
-    overflow: hidden;
-    background-color: #fff;
+  width: 100%;
+  overflow: hidden;
+  background-color: #fff;
 }
 
 .brief_con {
-    width: 100%;
-    overflow: hidden;
-    padding: 20rpx;
-    box-sizing: border-box;
+  width: 100%;
+  overflow: hidden;
+  padding: 20rpx;
+  box-sizing: border-box;
 }
 
 .brief_title {
-    width: 100%;
-    overflow: hidden;
-    font-size: 26rpx;
-    color: #1b1b1b;
-    padding: 0 20rpx;
-    box-sizing: border-box;
-    border-bottom: 3rpx solid rgba(0, 0, 0, 0.12);
-    height: 74rpx;
+  width: 100%;
+  overflow: hidden;
+  font-size: 26rpx;
+  color: #1b1b1b;
+  padding: 0 20rpx;
+  box-sizing: border-box;
+  border-bottom: 3rpx solid rgba(0, 0, 0, 0.12);
+  height: 74rpx;
 }
 
 // 产品简介-end
 
 // 底部导航组件
 .option {
-    position: fixed;
-    width: 100%;
-    overflow: hidden;
-    left: 0;
-    bottom: 0;
+  position: fixed;
+  width: 100%;
+  overflow: hidden;
+  left: 0;
+  bottom: 0;
 }
 
 // 底部导航组件-end
 
 // 购买或加入购物车弹窗
 .option_box text {
-    color: #2db389;
+  color: #2db389;
 }
 
 .goods_raido {
-    margin-right: 180rpx;
+  margin-right: 180rpx;
 }
 
 .close_img {
-    width: 36rpx;
-    height: 36rpx;
+  width: 36rpx;
+  height: 36rpx;
 }
 
 .option_box {
-    font-size: 26rpx;
-    margin-top: 80rpx;
+  font-size: 26rpx;
+  margin-top: 80rpx;
 }
 
 .goods_raido:nth-last-child(1) {
-    margin-right: 0;
+  margin-right: 0;
 }
 
 .num_con {
-    width: 100%;
-    overflow: hidden;
-    padding-bottom: 3rpx;
+  width: 100%;
+  overflow: hidden;
+  padding-bottom: 3rpx;
 }
 
-.num_str{
-    font-size: 14px;
-    color: #989898;
+.num_str {
+  font-size: 14px;
+  color: #989898;
 }
 
 .goods_option {
-    width: 100%;
-    overflow: hidden;
-    padding-top: 50rpx;
+  width: 100%;
+  overflow: hidden;
+  padding-top: 50rpx;
 }
 
 .close_con {
-    width: 100%;
-    overflow: hidden;
-    margin-bottom: 35rpx;
+  width: 100%;
+  overflow: hidden;
+  margin-bottom: 35rpx;
 }
 
 .raido_text {
-    font-size: 26rpx;
-    color: #545454;
-    margin-left: 30rpx;
+  font-size: 26rpx;
+  color: #545454;
+  margin-left: 30rpx;
 }
 
 .goods_con {
-    width: calc(100% - 202rpx - 30rpx);
-    overflow: hidden;
+  width: calc(100% - 202rpx - 30rpx);
+  overflow: hidden;
 }
 
 .goods_img {
-    width: 202rpx;
-    height: 187rpx;
-    margin-right: 30rpx;
-    border-radius: 12rpx;
+  width: 202rpx;
+  height: 187rpx;
+  margin-right: 30rpx;
+  border-radius: 12rpx;
 }
 
 .confim {
-    width: 100%;
-    height: 80rpx;
-    border-radius: 40rpx;
-    background: #2db389;
-    color: #fff;
-    font-size: 26rpx;
-    margin-top: 44rpx;
+  width: 100%;
+  height: 80rpx;
+  border-radius: 40rpx;
+  background: #2db389;
+  color: #fff;
+  font-size: 26rpx;
+  margin-top: 44rpx;
 }
 
 .shopping {
-    width: 100%;
-    overflow: hidden;
-    padding: 20rpx;
-    box-sizing: border-box;
-    border-radius: 30rpx 30rpx 0 0;
-    background: #fff;
+  width: 100%;
+  overflow: hidden;
+  padding: 20rpx;
+  box-sizing: border-box;
+  border-radius: 30rpx 30rpx 0 0;
+  background: #fff;
 }
 
 .goods_info {
-    width: 100%;
-    overflow: hidden;
-    align-items: inherit;
-    padding-bottom: 48rpx;
-    border-bottom: 3rpx solid rgba(0, 0, 0, 0.12);
+  width: 100%;
+  overflow: hidden;
+  align-items: inherit;
+  padding-bottom: 48rpx;
+  border-bottom: 3rpx solid rgba(0, 0, 0, 0.12);
 }
 
 .shop_names {
-    width: 100%;
-    overflow: hidden;
-    font-family: "SourceHanSansCN-Bold";
-    font-weight: bold;
-    color: #1b1b1b;
-    font-size: 32rpx;
+  width: 100%;
+  overflow: hidden;
+  font-family: "SourceHanSansCN-Bold";
+  font-weight: bold;
+  color: #1b1b1b;
+  font-size: 32rpx;
 }
 
 .goods_msg {
-    width: 100%;
-    overflow: hidden;
-    font-size: 28rpx;
-    color: #18bb88;
-    font-family: "SourceHanSansCN-Medium";
-    font-weight: 500;
+  width: 100%;
+  overflow: hidden;
+  font-size: 28rpx;
+  color: #18bb88;
+  font-family: "SourceHanSansCN-Medium";
+  font-weight: 500;
 }
 
 .raido_img {
-    width: 39rpx;
-    height: 35rpx;
-    background: url(~@/static/img/weixuanzhong.png);
-    background-repeat: no-repeat;
-    background-size: 35rpx 35rpx;
-    background-position: center center;
+  width: 39rpx;
+  height: 35rpx;
+  background: url(~@/static/img/weixuanzhong.png);
+  background-repeat: no-repeat;
+  background-size: 35rpx 35rpx;
+  background-position: center center;
 }
 
 .raido_box {
-    background: url(~@/static/img/consent.png);
-    background-repeat: no-repeat;
-    background-size: 39rpx 35rpx;
-    background-position: center center;
+  background: url(~@/static/img/consent.png);
+  background-repeat: no-repeat;
+  background-size: 39rpx 35rpx;
+  background-position: center center;
 }
 
 // 购买或加入购物车弹窗-end