立即购买

app.html

@@ -6,7 +6,7 @@
   <link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" />
   <link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/element-ui/1.3.7/theme-default/index.css" />
   <!--<link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_0d1jjt5tukcblnmi.css"/>-->
-  <link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_452262_0c0tncbpq6umzpvi.css">
+  <link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_452262_6hf7erbfhh9.css">
   <link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/Swiper/3.4.2/css/swiper.css" />
   {{ HEAD }}
   <script>

pages/mobile/center/user/doPay/_ids.vue

@@ -6,7 +6,7 @@
     <div class="content-line md-pay">
       <h1>收款账户</h1>
       <div class="info-line clearfix">
-        <div class="fl">平台代收&nbsp;<i class="inline-block">i</i></div>
+        <div class="fl">平台代收&nbsp;<i class="inline-block" @click="showRemind = true">i</i></div>
         <div class="fr"><span class="inline-block text-ellipse">{{accountData.branchname}}</span></div>
       </div>
       <div class="info-line clearfix">
@@ -56,6 +56,12 @@
       <nuxt-link to="/mobile/order?type=buyer" class="operate inline-block">前往订单中心</nuxt-link>
       <a class="operate inline-block active" @click="submit">提交</a>
     </div>
+    <div class="mobile-modal" v-if="showRemind">
+      <div class="consignment-modal">
+        <div class="cm-content">货款将由优软商城在银行开立的第三方账户暂为保管，待您确定收货后，商城再和卖家结算。</div>
+        <div class="cm-foot" @click="showRemind = false">我知道了</div>
+      </div>
+    </div>
     <remind-box :title="remindText" :timeoutCount="timeoutCount"></remind-box>
   </div>
 </template>
@@ -70,7 +76,8 @@
         remindText: '',
         timeoutCount: '',
         showMore: false,
-        imgUrl: null
+        imgUrl: null,
+        showRemind: false
       }
     },
     components: {
@@ -309,5 +316,25 @@
         }
       }
     }
+    .consignment-modal {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      width: 6.3rem;
+      margin-left: -3.15rem;
+      margin-top: -1.36rem;
+      background: #fff;
+      border-radius: .15rem;
+      font-size: .32rem;
+      .cm-content {
+        padding: .39rem .42rem .25rem;
+        border-bottom: 1px solid #f4f4f4;
+      }
+      .cm-foot {
+        padding: .27rem 0;
+        color: #3f84f6;
+        text-align: center;
+      }
+    }
   }
 </style>

pages/mobile/product/_batchCode.vue

@@ -80,7 +80,7 @@
         </div>
 
       </div>
-      <div class="content-line link cl-price2">
+    <!--  <div class="content-line link cl-price2">
         <ul class="clearfix">
           <nuxt-link :to="`/mobile/shop/${storeInfo.uuid}`" tag="li" class="text-ellipse inline-block price-level">
             <i class="iconfont icon-dianpu"></i>
@@ -95,7 +95,7 @@
             <p class="lastOne" :class="{'active': component.attach && component.attach !== '' && component.attach !== '1'}">数据手册</p>
           </li>
         </ul>
-      </div>
+      </div>-->
     </div>
     <div class="params-wrap">
       <div class="wrap-title"><span class="line"></span>产品参数</div>
@@ -109,6 +109,26 @@
         <p>卖家上传的产品暂无参数,请 <b @click="showStoreInfo = true">联系卖家</b> 了解具体详情</p>
       </div>
     </div>
+    <div class="operate-bottom">
+      <div class="inline-block ob-ope">
+        <nuxt-link :to="`/mobile/shop/${storeInfo.uuid}`" class="item inline-block">
+          <i class="iconfont icon-dianpu"></i>
+          <p>查看店铺</p>
+        </nuxt-link>
+        <a class="item inline-block" @click="showStoreInfo = true">
+          <i class="iconfont icon-duihua"></i>
+          <p>联系卖家</p>
+        </a>
+        <a class="item inline-block" @click="goAttach(component.attach)" :class="{'active': component.attach && component.attach !== '' && component.attach !== '1'}">
+          <i class="iconfont icon-pdf"></i>
+          <p>数据手册</p>
+        </a>
+      </div>
+      <div class="inline-block ob-buy">
+        <button @click="buy(false)">加入购物车</button>
+        <button @click="buy(true)">立即购买</button>
+      </div>
+    </div>
     <div class="mobile-modal" v-if="showStoreInfo" @touchmove="preventTouchMove($event)">
       <div class="mobile-modal-box mobile-link-en">
         <div class="mobile-modal-header">联系方式<i @click="showStoreInfo = false" class="icon-guanbi iconfont"></i></div>
@@ -199,9 +219,9 @@
 //            window.location.href = url
           } else {
             if (!url) {
-              this.onRemind('该产品暂无数据手册')
+              this.setRemindText('该产品暂无数据手册')
             } else {
-              this.onRemind('数据手册地址错误')
+              this.setRemindText('数据手册地址错误')
             }
           }
         } else {
@@ -215,13 +235,13 @@
             this.$store.dispatch('shop/StoreFocus', {storeName: this.storeInfo.storeName, storeid: this.storeInfo.id})
               .then(response => {
                 this.$store.dispatch('shop/StoreFocusList', {id: this.storeInfo.id})
-                this.onRemind('关注成功')
+                this.setRemindText('关注成功')
               })
           } else {
             this.$http.post('/trade/storeFocus/delete/storeId', [this.storeInfo.id])
               .then(response => {
                 this.$store.dispatch('shop/StoreFocusList', {id: this.storeInfo.id})
-                this.onRemind('取消成功')
+                this.setRemindText('取消成功')
               })
           }
         } else {
@@ -229,9 +249,12 @@
           this.showLoginBox = true
         }
       },
-      onRemind: function (str) {
+      setRemindText: function (str) {
         this.remindText = str
         this.remindCount++
+      },
+      buy: function (flag) {
+        this.baseUtils.buyOrCar(flag, null, this, this.commodity, '/mobile/center/user/pay/')
       }
     }
   }
@@ -547,6 +570,53 @@
         padding-left: 1rem;
       }
     }
+    .operate-bottom {
+      height: 1rem;
+      position: fixed;
+      background: #fff;
+      bottom: .98rem;
+      width: 100%;
+      border-top: 1px solid #ccc;
+      > div {
+        height: 100%;
+      }
+      .ob-ope {
+        /*width: 3.72rem;*/
+        width: 49.5%;
+        .item {
+          width: 33.3%;
+          text-align: center;
+          p {
+            font-size: .24rem;
+            color: #666;
+          }
+          i {
+            color: #2e2d2c;
+            font-size: .4rem;
+            margin: .1rem 0 .04rem;
+            display: inline-block;
+          }
+          &.active {
+            .icon-pdf {
+              color: #eb062b;
+            }
+          }
+        }
+      }
+      .ob-buy {
+        width: 50.5%;
+        button {
+          width: 50%;
+          height: 100%;
+          color: #fff;
+          background: #ff9c00;
+          border: none;
+          &:last-child {
+            background: #f80915;
+          }
+        }
+      }
+    }
   }
   .com-none-state {
     padding: .2rem 0;

utils/baseUtils.js

@@ -7,7 +7,7 @@ const NULL_ARR = ['空', '没', '无', '-', '—', 'null', '#N/A']
  *  $this: 当前对象
  *  item: 操作对象
  * */
-const _buyOrCar = function (isBuy, event, $this, item) {
+const _buyOrCar = function (isBuy, event, $this, item, url = '/user#/order/pay/') {
   if (event) event.stopPropagation()
   if (!$this.$store.state.option.user.logged) {
     $this.$http.get('/login/page', {params: {returnUrl: window.location.href}}).then(response => {
@@ -36,22 +36,22 @@ const _buyOrCar = function (isBuy, event, $this, item) {
                   type: 'success'
                 })
                 window.setTimeout(function () {
-                  window.location.href = '/user#/order/pay/' + _enidfilter(response.data.data.orderid)
+                  window.location.href = url + _enidfilter(response.data.data.orderid)
                 }, 1000)
               } else {
-                window.location.href = '/user#/order/pay/' + _enidfilter(response.data.data.orderid)
+                window.location.href = url + _enidfilter(response.data.data.orderid)
               }
             } else {
               if (response.data.data && response.data.data.unvailable === 1) {
-                $this.$message.error('产品信息已失效，请刷新页面')
+                _setMessage($this, '产品信息已失效，请刷新页面', $this.isMobile, false)
               } else {
-                $this.$message.error(response.data.message)
+                _setMessage($this, response.data.message, $this.isMobile, false)
               }
             }
           }, err => {
             console.log(err)
             if (item.minBuyQty > item.reserve) {
-              $this.$message.error('商品' + item.code + '的库存已经不满足起订量')
+              _setMessage($this, '商品' + item.code + '的库存已经不满足起订量', $this.isMobile, false)
             }
           })
       } else {
@@ -68,24 +68,18 @@ const _buyOrCar = function (isBuy, event, $this, item) {
           .then(response => {
             if (response.data.success) {
               if (response.data.message) {
-                $this.$message({
-                  message: '添加购物车成功，但商品信息有更新',
-                  type: 'success'
-                })
+                _setMessage($this, '添加购物车成功，但商品信息有更新', $this.isMobile, true)
               } else {
-                $this.$message({
-                  message: '添加购物车成功',
-                  type: 'success'
-                })
+                _setMessage($this, '添加购物车成功', $this.isMobile, true)
               }
             } else {
               // if (response.data.code === 2) {
               //   $this.$message.error('库存已不满足起订量')
               // } else
               if (response.data.message === '该产品已失效') {
-                $this.$message.error(response.data.message + '，请刷新页面')
+                _setMessage($this, response.data.message + '，请刷新页面', $this.isMobile, false)
               } else {
-                $this.$message.error(response.data.message)
+                _setMessage($this, response.data.message, $this.isMobile, false)
               }
             }
           })
@@ -352,11 +346,15 @@ const _filterStringEllipsis = (str, len) => {
 * @str 提示信息
 * @isMobile 是否移动端
 * */
-const _setMessage = ($this, str = '系统错误', isMobile) => {
+const _setMessage = ($this, str = '系统错误', isMobile, isSuccess = false) => {
   if (isMobile) {
     $this.setRemindText(str)
   } else {
-    $this.$message.error(str)
+    if (isSuccess) {
+      $this.$message.success(str)
+    } else {
+      $this.$message.error(str)
+    }
   }
 }