w-front-end / select_good · Commits

Commit 147d99b84d7534df755cc715712849ebfe734222

Authored by zhiyangdu
1 parent aca3f309

健康商城商品详情页

Inline Side-by-side
Showing 2 changed files with 115 additions and 52 deletions
src/pages/healthGoodDetails/healthGoodDetails.less
  View file @147d99b
... ... @@ -44,6 +44,7 @@
44 44 overflow: hidden;
45 45 }
46 46 .title-t{
  47 + color: #3EB781;
47 48 margin:20px 60px 10px 60px ;
48 49 display: flex;
49 50 align-items: center;
... ... @@ -59,16 +60,16 @@
59 60 }
60 61 .integral{
61 62 height: 92px;
62   - font-size: 66px;
  63 + font-size: 42px;
63 64 font-weight: 500;
64   - color: #FC1541;
  65 + color: #3EB781;
65 66 line-height: 92px;
66 67 }
67 68 .integral-in{
68 69 height: 45px;
69   - font-size: 32px;
  70 + font-size: 42px;
70 71 font-weight: 400;
71   - color: #333333;
  72 + color: #3EB781;
72 73 line-height: 45px;
73 74 margin-left: 14px;
74 75 }
... ... @@ -104,6 +105,22 @@
104 105 background-color: #B4B4B4;
105 106 }
106 107 }
  108 + /*健康商城规则说明*/
  109 + .health_desc{
  110 + font-size: 28px;
  111 + margin-left: 20px;
  112 + .health_title{
  113 + text-align: left;
  114 + font-size: 28px;
  115 + font-weight: 500;
  116 + margin-top:40px;
  117 + }
  118 + .desc{
  119 + text-align: left;
  120 + color: #666666;
  121 + margin-top: 10px;
  122 + }
  123 + }
107 124 .good-desc{
108 125 margin:40px 40px 10px 40px;
109 126 font-size: 26px;
... ...
src/pages/healthGoodDetails/healthGoodDetails.vue
  View file @147d99b
... ... @@ -42,11 +42,11 @@
42 42 <div v-if="goodsInfo && goodsInfo.title" class="title">
43 43 {{goodsInfo.title}}
44 44 </div>
45   - <!-- 积分 -->
  45 + <!-- 健康值 -->
46 46 <div class="title-t">
47 47 <span v-if="goodsInfo && goodsInfo.prices" class="price">¥{{goodsInfo.prices}}</span>
48 48 <span v-if="goodsInfo && goodsInfo.num" class="integral">{{goodsInfo.num}}</span>
49   - <span class="integral-in">积分</span>
  49 + <span class="integral-in">健康值</span>
50 50 </div>
51 51 <!-- 商品信息 -->
52 52 <div class="goods-info">
... ... @@ -55,34 +55,80 @@
55 55 </div>
56 56 <div v-if="goodsInfo && goodsInfo.content" v-html="goodsInfo.content" class="good-desc html_box">
57 57 </div>
58   - <div class="good-title">
  58 + <!-- 健康商品信息 -->
  59 + <div class="good-title">
59 60 <span class="left"></span>兑换规则<span class="right"></span>
60 61 </div>
61   - <div class="good-desc">
62   - <div v-if="goodsInfo && goodsInfo.shop_type && (goodsInfo.shop_type == 1 || goodsInfo.shop_type == 2)">
63   - <div class="text-left">
64   - 兑换此积分即可0元购买该商品；<br>
65   - 仅限此商品使用，兑换后7天内有效；
66   - </div>
67   - <div class="text-left">
68   - <span>· 正版授权</span>
69   - 所售商品均已官方授权，请放心购买；
70   - </div>
71   - <div class="text-left">
72   - <span>· 正品保障</span>
73   - 独家正品保障。
74   - </div>
  62 + <!-- 商品来源 -->
  63 + <div class="health_desc">
  64 + <div class="health_title">
  65 + 商品来源
  66 + </div>
  67 + <div class="desc">
  68 + 健康商城的商品均由网家家审核的第三方合作商家提供，请放心兑换。
  69 + </div>
  70 + </div>
  71 + <!-- 商品差异 -->
  72 + <div class="health_desc">
  73 + <div class="health_title">
  74 + 商品差异
  75 + </div>
  76 + <div class="desc">
  77 + 商品图片仅供参考，具体请以实物准。
  78 + </div>
  79 + </div>
  80 + <!-- 发货时间 -->
  81 + <div class="health_desc">
  82 + <div class="health_title">
  83 + 发货时间
  84 + </div>
  85 + <div class="desc">
  86 + 商品兑换成功后，预计3-5个工作日发货，如遇节假日及特殊情况（如疫情严重），发货可能相应延迟，您可以在活动页面中的“兑换记录”查看物流信息。
  87 + </div>
  88 + </div>
  89 + <!-- 配送方式 -->
  90 + <div class="health_desc">
  91 + <div class="health_title">
  92 + 配送方式
  93 + </div>
  94 + <div class="desc">
  95 + 商品由合作商家通过快递进行配送，配送范围覆盖全国大部分地区（港澳台地区除外）
  96 + </div>
  97 + </div>
  98 + <!-- 修改信息 -->
  99 + <div class="health_desc">
  100 + <div class="health_title">
  101 + 修改信息
  102 + </div>
  103 + <div class="desc">
  104 + 商品兑换成功后无法更改配送信息，无法退还已使用的健康值，不支持申请退换货。
  105 + </div>
  106 + </div>
  107 + <!-- 商品损坏 -->
  108 + <div class="health_desc">
  109 + <div class="health_title">
  110 + 商品损坏
  111 + </div>
  112 + <div class="desc">
  113 + 签收时请您先确认商品外包装完整，如有问题请当场拒收，拒收后可以到官方客服群申请客服协助处理。
  114 + </div>
  115 + </div>
  116 + <!-- 问题咨询 -->
  117 + <div class="health_desc">
  118 + <div class="health_title">
  119 + 问题咨询
  120 + </div>
  121 + <div class="desc">
  122 + 您在使用过程中有任何问题，请加入官方客服群咨询。
  123 + </div>
  124 + </div>
  125 + <!-- 其他 -->
  126 + <div class="health_desc">
  127 + <div class="health_title">
  128 + 其他
75 129 </div>
76   - <div v-if="goodsInfo && goodsInfo.shop_type && goodsInfo.shop_type == 2" class="text-left">
77   - 1､ 您兑换的音频内容，音频上线期间可长期收听；<br>
78   - 2､ 兑换后暂不支持退款，感谢您的支持；<br>
79   - 3､ 兑换完成后若显示异常，请10分钟之后尝试；<br>
80   - 4､您兑换的音频内容为网家家版权内容，请勿恶意转载；<br>
81   - 5､客服电话：010-65832485;<br>
82   - 6､ 具体注意事项详情可见
83   - <span @click="toLink" class="to-link">
84   - 《网家家APP购买音频内容服务协议》
85   - </span>
  130 + <div class="desc">
  131 + 收货后恶意损坏商品、恶意投诉等影响正常运营，网家家有权拒绝售后服务并追究相关责任。
86 132 </div>
87 133 </div>
88 134 <div class="good-title">
... ... @@ -96,23 +142,23 @@
96 142 </column-list-box>
97 143 </div>
98 144 </div>
99   - <!-- 有积分页脚显示 -->
  145 + <!-- 有健康值页脚显示 -->
100 146 <div v-if="goodsInfo && goodsInfo.stock != 0">
101   - <!-- 积分充足 -->
  147 + <!-- 健康值充足 -->
102 148 <div v-if="goodsInfo.grade>goodsInfo.num || goodsInfo.grade == goodsInfo.num" class="footer">
103 149 <div class="btn" @click="exchange">
104 150 立即兑换
105 151 </div>
106 152 </div>
107   - <!-- 积分不足页脚显示 -->
  153 + <!-- 健康值不足页脚显示 -->
108 154 <div v-if="goodsInfo.grade<goodsInfo.num" class="footer">
109   - <div class="desc">还差{{goodsInfo.num-goodsInfo.grade}}积分</div>
  155 + <div class="desc">还差{{goodsInfo.num-goodsInfo.grade}}健康值</div>
110 156 <div class="btn" @click="jumpClientIntegralList">
111   - 获取积分
  157 + 获取健康值
112 158 </div>
113 159 </div>
114 160 </div>
115   - <!-- 有积分商品售罄 -->
  161 + <!-- 有健康值商品售罄 -->
116 162 <div v-else-if="goodsInfo && goodsInfo.stock == 0" class="footer">
117 163 <div class="btn grey" @click="exchange">
118 164 补货中
... ... @@ -247,10 +293,10 @@ export default {
247 293 if (this.isCNLive.value) {
248 294 // 校验登录
249 295 if (this.$parent.checkLogin()) {
250   - // 提示用积分兑换兑换
  296 + // 提示用健康值兑换兑换
251 297 let options = {
252 298 title: "",
253   - message: "确定使用" + this.goodsInfo.num + "积分兑换?",
  299 + message: "确定使用" + this.goodsInfo.num + "健康值兑换?",
254 300 confirmButtonText: "确定",
255 301 confirmButtonCallback: this.addIntegralOrderconfirm,
256 302 showCancelButton: true,
... ... @@ -291,7 +337,7 @@ export default {
291 337 }
292 338 },
293 339 /**
294   - * 积分兑换接口
  340 + * 健康值兑换接口
295 341 */
296 342 addIntegralOrder () {
297 343 // 加载中提示
... ... @@ -307,7 +353,7 @@ export default {
307 353 },
308 354  
309 355 /**
310   - * 积分兑换接口回调
  356 + * 健康值兑换接口回调
311 357 * @param {Object} res [服务器返回数据]
312 358 * @param {Object} ext [扩展参数]
313 359 */
... ... @@ -347,12 +393,12 @@ export default {
347 393 // 显示通用浮层
348 394 this.$parent.$refs.showModal.showLayer();
349 395 } else if (res.code == 401) {
350   - // 获取积分商品详情页失败
  396 + // 获取健康值商品详情页失败
351 397 //
352 398 // 显示查看地址弹框
353 399 let options = {
354 400 title: "",
355   - message: "你的积分不足" + "<br>" + "赚取更多积分，请至任务列表",
  401 + message: "你的健康值不足" + "<br>" + "赚取更多健康值，请至任务列表",
356 402 messageAlign: "center",
357 403 confirmButtonText: "确定",
358 404 confirmButtonCallback: this.jumpClientIntegralList,
... ... @@ -373,7 +419,7 @@ export default {
373 419 this.$refs.itemsInfo.getItemInfo(this.goodsInfo, params.id)
374 420 },
375 421 /**
376   - * 跳转赚取积分页面
  422 + * 跳转赚取健康值页面
377 423 * @param {Object} item [数据对象]
378 424 */
379 425 jumpClientIntegralList () {
... ... @@ -402,7 +448,7 @@ export default {
402 448 }
403 449 },
404 450 /**
405   - * 积分商品详情页页面接口
  451 + * 健康值商品详情页页面接口
406 452 */
407 453 getGoodsInfo (goodsId) {
408 454 // 加载中提示
... ... @@ -417,7 +463,7 @@ export default {
417 463 },
418 464  
419 465 /**
420   - * 积分商品详情页页面接口回调
  466 + * 健康值商品详情页页面接口回调
421 467 * @param {Object} res [服务器返回数据]
422 468 * @param {Object} ext [扩展参数]
423 469 */
... ... @@ -436,12 +482,12 @@ export default {
436 482 /* 相似商品 */
437 483 } else if (res.code == 400) {
438 484  
439   - // 获取积分商品详情页失败
  485 + // 获取健康值商品详情页失败
440 486 Toast(res.message);
441 487 } else {
442 488  
443   - // 获取积分商品详情页失败
444   - Toast("获取积分商品详情页失败");
  489 + // 获取健康值商品详情页失败
  490 + Toast("获取健康值商品详情页失败");
445 491 }
446 492 },
447 493 /**
... ... @@ -463,7 +509,7 @@ export default {
463 509 //请求数据
464 510 created () {
465 511 // 设置标题
466   - this.$set(this, "title", "积分商品详情页");
  512 + this.$set(this, "title", "健康值商品详情页");
467 513 // 获取商品ID
468 514 let goodsId = this.$route.query.goodsId;
469 515 if (goodsId) {
... ... @@ -500,7 +546,7 @@ export default {
500 546 });
501 547  
502 548 // 设置标题
503   - this.$set(this.backs, 'title', '积分商品详情页');
  549 + this.$set(this.backs, 'title', '健康值商品详情页');
504 550 }
505 551  
506 552 },
... ... @@ -511,7 +557,7 @@ export default {
511 557 };
512 558 // 如果是App外，设置唤起App和微信内分享参数
513 559 // if (!this.isCNLive.value) {
514   - // // 设置积分首页唤起app参数
  560 + // // 设置健康值首页唤起app参数
515 561 // if (typeof this.$parent.getOpenApp === "function") {
516 562 // this.$parent.getOpenApp({
517 563 // type: 46,
... ...