Merge branch 'fix' into feature-yc-201813

components/mobile/brand/ComponentDetail.vue

@@ -9,10 +9,10 @@
         <span>类目(产品名称)：</span>
         <span>{{component.kind.nameCn || '-'}}</span>
       </div>
-      <div class="base-detail-item">
-        <span>规&nbsp;&nbsp;&nbsp;&nbsp;格：</span>
-        <span>{{component.spec || '-'}}</span>
-      </div>
+      <!--<div class="base-detail-item">-->
+      <!--<span>规&nbsp;&nbsp;&nbsp;&nbsp;格：</span>-->
+      <!--<span>{{component.spec || '-'}}</span>-->
+      <!--</div>-->
       <div class="base-detail-item attach" @click="goAttach(component.attach)">
         <span v-if="component.attach">规格书：<img src="/images/mobile/@2x/productDetail/pdf.png" alt=""><span>查看</span></span>
         <span v-else>规格书：-</span>
@@ -33,63 +33,77 @@
       </div>
     </div>
     <div class="product-store" v-if="activeType == 'store'">
-      <table v-if="searchLists&&searchLists.length > 0">
-        <thead id="product-head">
-          <tr>
-            <th style="width: 1.55rem;">商家</th>
-            <th style="width: 1.59rem;">生产日期</th>
-            <th style="width: 2.58rem;">价格梯度</th>
-            <th style="width: 1.77rem;">交期(天)</th>
-          </tr>
-        </thead>
-        <thead class="active" v-show="isScrollOverTab">
-          <tr>
-            <th style="width: 1.55rem;">商家</th>
-            <th style="width: 1.59rem;">生产日期</th>
-            <th style="width: 2.58rem;">价格梯度</th>
-            <th style="width: 1.77rem;">交期(天)</th>
-          </tr>
-        </thead>
-        <tbody id="product-body">
-          <tr v-for="store in searchLists">
-            <td class="store-name">
-              <nuxt-link :to="'/mobile/shop/' + store.storeid">
-                {{store.storeName || '-' | storeNameFilter}}
-              </nuxt-link>
-            </td>
-            <td>
-              <div v-if="!store.packaging && !store.breakUp && !store.produceDate">-</div>
-              <div>{{store.produceDate}}</div>
-              <div>{{store.packaging}}</div>
-              <div>{{store.breakUp?'可拆卖':'不可拆卖'}}</div>
-            </td>
-            <td class="price-level-wrap">
-              <div v-if="!store.prices || store.prices.length == 0">-</div>
-              <div class="price-number fl">
-                <div v-for="price in store.prices">{{price.start}}+</div>
-              </div>
-              <div class="price-number fr">
-                <div v-for="price in store.prices" class="price-level">
-                  <span v-if="store.currencyName.indexOf('RMB')!==-1">￥{{price.rMBPrice | currency}}</span>
-                  <span v-if="store.currencyName.indexOf('USD')!==-1">${{price.uSDPrice | currency}}</span>
-                </div>
-              </div>
-            </td>
-            <td class="push-date">
-              <div v-if="store.b2cMinDelivery">
-                <span>{{store.b2cMinDelivery}}</span>
-                <span v-if="store.b2cMaxDelivery && store.b2cMaxDelivery !== store.b2cMinDelivery">-</span>
-                <span v-if="store.b2cMaxDelivery && store.b2cMaxDelivery !== store.b2cMinDelivery">{{store.b2cMaxDelivery}}</span>
-              </div>
-              <div v-if="store.minBuyQty"><span class="order-tag">订</span>{{store.minBuyQty}}起订</div>
-              <div v-if="store.reserve"><span class="order-tag reserve-tag">库</span>{{store.reserve}}</div>
-              <div v-if="!store.b2cMinDelivery">
-                <span>—</span>
-              </div>
-            </td>
-          </tr>
-        </tbody>
-      </table>
+      <div v-for="(item, index) in searchLists">
+        <div class="middle">
+          <div class="storeName" @click="goProductDetail(item)">
+            {{item.storeName || '-' | storeNameFilter}}
+          </div>
+          <div class="list">
+            <div class="fl">
+              <div class="name">品牌：</div>
+              <div class="text">{{item.brandNameEn}}</div>
+            </div>
+          </div>
+          <div class="list">
+            <div class="fl" style="width: 100%">
+              <div class="name">类目(产品名称)：</div>
+              <div class="text" style="color: #3f84f6">{{item.kindNameCn || '-'}}</div>
+            </div>
+
+          </div>
+          <div class="list">
+            <div class="fl" style="width: 100%">
+              <div class="name">型号：</div>
+              <div class="text">{{item.code || '-'}}</div>
+            </div>
+          </div>
+          <div class="list">
+            <div class="fl" style="width: 100%">
+              <div class="name">规格：</div>
+              <div class="text">{{item.spec || '-'}}</div>
+            </div>
+          </div>
+
+          <div class="list">
+            <div class="fl" style="width: 100%">
+              <div class="name">包装：</div>
+              <div class="text">{{item.packaging || '无包装信息'}}</div>
+              <div class="textinfo" v-if="item.breakUp">可拆卖</div>
+            </div>
+          </div>
+
+          <div class="list">
+            <div class="name">生产日期：</div>
+            <div class="text" :title="item.produceDate">{{item.produceDate || '-'}}</div>
+          </div>
+
+          <div class="list">
+            <div class="fl" style="width: 100%; ">
+              <div class="name">交期(天)：</div>
+              <div class="text" style="color: #ef5042" v-if="item.b2cMaxDelivery && (item.b2cMaxDelivery != item.b2cMinDelivery)" v-text="item.b2cMinDelivery + '-'+ item.b2cMaxDelivery"></div>
+              <div class="text" style="color: #ef5042" v-if="item.b2cMaxDelivery && (item.b2cMaxDelivery == item.b2cMinDelivery)" v-text="item.b2cMinDelivery"></div>
+              <div v-if="item.minBuyQty" style="display: inline-block;margin-left: 0.2rem"><span class="order-tag">订</span>{{item.minBuyQty}}起订</div>
+              <div v-if="item.reserve" style="display: inline-block;margin-left: 0.2rem"><span class="order-tag reserve-tag">库</span>{{item.reserve}}</div>
+            </div>
+          </div>
+          <div class="list">
+            <div class="name left">价格梯度<p>(pcs):</p></div>
+            <div class="table left">
+              <ul>
+                <li class="title">
+                  <div>分段数量/PCS</div>
+                  <div>分段单价</div>
+                </li>
+                <li v-for="price in item.prices">
+                  <div>{{price.start}}+</div>
+                  <div v-if="item.currencyName == 'RMB'">¥{{price.rMBPrice}}</div>
+                  <div v-else>${{price.rMBPrice}}</div>
+                </li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
     <div v-if="(storeList.totalElements == 0 && activeType == 'store') || (component.properties && component.properties.length == 0 && activeType == 'param')" class="no-store">
       <img src="/images/mobile/@2x/car@2x.png" alt="">
@@ -100,10 +114,11 @@
     <remind-box :title="collectResult" :timeoutCount="timeoutCount"></remind-box>
     <loading v-show="isSearchingMore"></loading>
     <login-box @onLoginBoxClose="showLoginBox = false" v-if="showLoginBox" :url="url"></login-box>
+    <pull-up :searchMore="fetching" :allPage="allPage" :page="params.page" @pullUpAction="getMoreStore"></pull-up>
   </div>
 </template>
 <script>
-  import {RemindBox, Loading, LoginBox} from '~components/mobile/common'
+  import {RemindBox, Loading, LoginBox, PullUp} from '~components/mobile/common'
   export default {
     data () {
       return {
@@ -134,17 +149,21 @@
     components: {
       RemindBox,
       Loading,
-      LoginBox
+      LoginBox,
+      PullUp
     },
     mounted: function () {
-      let _this = this
-      _this.$nextTick(function () {
-        window.addEventListener('scroll', function () {
-          _this.scroll()
-        }, false)
-      })
+      // let _this = this
+      // _this.$nextTick(function () {
+      //   window.addEventListener('scroll', function () {
+      //     _this.scroll()
+      //   }, false)
+      // })
     },
     computed: {
+      fetching () {
+        return this.$store.state.componentInformation.information.fetching
+      },
       component () {
         return this.$store.state.componentDetail.detail.data
       },
@@ -244,16 +263,19 @@
       }
     },
     methods: {
+      goProductDetail: function (com) {
+        this.$router.push('/mobile/shop/' + com.storeid)
+      },
       scroll: function () {
         let scrolled = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop
         if (Math.ceil(scrolled + window.screen.availHeight) >= document.body.scrollHeight && !this.isSearchingMore && this.params.page < this.allPage) {
           this.getMoreStore()
         }
-        let tbodyObj = document.getElementById('product-body')
-        let theadObj = document.getElementById('product-head')
-        if (theadObj) {
-          this.isScrollOverTab = tbodyObj.getBoundingClientRect().top - theadObj.getBoundingClientRect().height - 5 <= theadObj.getBoundingClientRect().height
-        }
+        // let tbodyObj = document.getElementById('product-body')
+        // let theadObj = document.getElementById('product-head')
+        // if (theadObj) {
+        //   this.isScrollOverTab = tbodyObj.getBoundingClientRect().top - theadObj.getBoundingClientRect().height - 5 <= theadObj.getBoundingClientRect().height
+        // }
       },
       getMoreStore: function () {
         if (!this.isSearchingMore) {
@@ -300,19 +322,21 @@
 <style lang="scss" scoped>
   .component-detail {
     font-size: .28rem;
-    margin-bottom: 1.2rem;
+    margin-bottom: 0.98rem;
     background: #f7f7f7;
     padding-top: .2rem;
+    padding-bottom: 0.2rem;
     .base-detail {
-      margin: 0 .27rem .2rem .27rem;
+      /*margin: 0 .27rem .2rem .27rem;*/
       padding: .18rem .36rem 0 .36rem;
-      border-radius: .1rem;
-      background: url('/images/mobile/@2x/productDetail/desc-bg.png')no-repeat;
+      /*border-radius: .1rem;*/
+      background: url('/images/mobile/@2x/productDetail/desc-bg2.jpg')no-repeat;
       background-size: cover;
-      height: 3.96rem;
+      height: 4.11rem;
       position: relative;
+      box-shadow: 0 0 5px #8a8a8a;
       .base-detail-item {
-        margin-top: .14rem;
+        margin-top: 0.3rem;
         position: relative;
         color: #fff;
         &:nth-child(1) {
@@ -340,7 +364,7 @@
         }
         &.product-description {
           height: 1.58rem;
-          margin-top: .2rem;
+          margin-top: .6rem;
         }
         .description {
           line-height: .4rem;
@@ -369,11 +393,13 @@
       }
     }
     .product-switch-item {
+      margin-top: 0.15rem;
       text-align: center;
       background: #fff;
+      border-bottom: 1px solid #d8d8d8;
       .mobile-switch-btn {
         background: #fff;
-        color: #666;
+        color: #333;
         display: inline-block;
         height: .64rem;
         line-height: .64rem;
@@ -421,95 +447,164 @@
         }
       }
     }
-    .product-store {
-      margin: .2rem 0;
-      table {
-        width: 100%;
-        font-size: .28rem;
-        thead {
-          background: #d5e5fb;
-          &.active {
-            position: fixed;
-            top: .88rem;
-            z-index: 2;
+    .middle {
+      .order-tag {
+        display: inline-block;
+        font-size: .18rem;
+        color: #fff;
+        font-weight: bold;
+        background: #ee1717;
+        height: .27rem;
+        width: .27rem;
+        line-height: .27rem;
+        text-align: center;
+        border-radius: .05rem;
+        position: relative;
+        top: -.05rem;
+        margin-right: .05rem;
+        &.reserve-tag {
+          background: #07bb1c;
+        }
+      }
+      text-align: left;
+      padding: 0 0 0.24rem;
+      background: #fff;
+      margin: 0.24rem 0.24rem 0;
+      border-radius: 5px;
+      border: 1px solid #e3e5e8;
+      .storeName{
+        color: #3f84f6;
+        font-size: 0.28rem;
+        line-height: 0.6rem;
+        border-bottom: 1px solid #d3d3d3;
+        margin-bottom: 0.18rem;
+        padding-left: 0.24rem;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        font-weight: bold;
+      }
+      .pms {
+        color: #f57710;
+        border: 1px solid #f57710;
+        border-radius: 0.4rem;
+        background: #fff;
+        font-size: 0.24rem;
+        height: 0.4rem;
+        line-height: 0.4rem;
+        width: 0.8rem;
+        text-align: center;
+      }
+      .list {
+        padding: 0 0.24rem;
+        .left {
+          float: left;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+        .textinfo {
+          font-size: 0.18rem;
+          margin-left: 0.1rem;
+          display: inline-block;
+          background: #3f84f6;
+          color: #fff;
+          font-weight: bold;
+          border-radius: 3px;
+          width: 0.8rem;
+          height: 0.32rem;
+          line-height: 0.32rem;
+          text-align: center
+        }
+        .button {
+          font-size: 0.3rem;
+          color: #1a58dd;
+          width: 0.92rem;
+          height: 0.43rem;
+          line-height: 0.43rem;
+          text-align: center;
+          border-radius: 5px;
+          border:1px solid #1a58dd;
+          display: inline-block;
+          margin-right: 0.2rem;
+        }
+        margin-bottom: 0.18rem;
+        &::after{
+          clear: both;
+          display: block;
+          content: ' ';
+          visibility: hidden;
+          zoom: 1;
+        }
+        .fl {
+          width: 4.4rem;
+          float: left;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+        .fr {
+          text-align: left;
+          width: 2.6rem;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+        &.list-long {
+          .fl {
+            width: 100% !important;
           }
-          tr {
-            th {
-              font-weight: bold;
+        }
+        .name {
+          color: #333;
+          font-size: 0.28rem;
+          display: inline-block;
+        }
+        .text {
+          display: inline-block;
+          color: #333;
+          font-size: 0.28rem
+        }
+        .table {
+          width: 5rem;
+          margin-bottom: 0;
+          margin-top: 0;
+          margin-left: 0.1rem;
+          li {
+            height: 0.43rem;
+            line-height: 0.43rem;
+            border-left: .01rem solid #c5c5c5;
+            font-size: .28rem;
+            &::after {
+              clear: both;
+              display: block;
+              content: ' ';
+              visibility: hidden;
+              zoom: 1;
+            }
+            div {
               text-align: center;
-              height: .78rem;
-              line-height: .78rem;
-              >span {
-               font-size: .22rem;
-              }
+              width: 50%;
+              float: left;
+              border-right: .01rem solid #c5c5c5;
+              border-bottom: .01rem solid #c5c5c5;
             }
-          }
-        }
-        tbody {
-          background: #fff;
-          tr {
-            border-bottom: 0.2rem solid #f7f7f7;
-            td {
-              padding: .2rem .1rem;
-              &.store-name {
-                color: #418bf6;
-                a {
-                  padding: 0;
-                  display: block;
-                  width: 1.2rem;
-                  overflow: hidden;
-                  margin-left: .16rem;
-                }
-              }
-              &.price-level-wrap {
-                text-align: center;
-              }
-              > div {
-                overflow: hidden;
-                text-overflow: ellipsis;
-                white-space: nowrap;
-                max-width: 1.58rem;
-              }
-              .price-number {
-                display: inline-block;
-                vertical-align: middle;
-                margin-bottom: 0;
-                width: .9rem;
-              }
-              div {
-                margin-bottom: .2rem;
-                text-align: left;
-                &:last-child {
-                  margin-bottom: 0;
-                }
-              }
-              &.push-date {
-              text-align: left;
-                div {
-                  text-align: left;
-                }
+            &:nth-child(odd) {
+              background: #ddd;
+              color: #333;
+              font-size: 0.28rem;
             }
-              .price-level:last-child {
-                color: #fc5708;
-              }
-              .order-tag {
-                display: inline-block;
-                font-size: .18rem;
-                color: #fff;
-                font-weight: bold;
-                background: #ee1717;
-                height: .27rem;
-                width: .27rem;
-                line-height: .27rem;
-                text-align: center;
-                border-radius: .05rem;
-                position: relative;
-                top: -.05rem;
-                margin-right: .05rem;
-                &.reserve-tag {
-                  background: #07bb1c;
-                }
-              }
+            &:nth-child(even) {
+              background: #fcfcfc;
+              color: #333;
+              font-size: 0.28rem;
+            }
+            &:nth-last-of-type(1){
+              color: #f31919;
+            }
+            &.title {
+              font-size: 0.28rem;
+              color: #333;
             }
           }
         }

components/mobile/store/StoreDetail.vue

@@ -138,30 +138,8 @@
                 <div v-if="item.reserve" style="display: inline-block;margin-left: 0.2rem"><span class="order-tag reserve-tag">库</span>{{item.reserve}}</div>
               </div>
             </div>
-            <!--<div class="list">-->
-              <!--<div class="fl">-->
-                <!--<div class="name">最小包装数：</div>-->
-                <!--<div class="text">{{item.minPackQty}}</div>-->
-              <!--</div>-->
-              <!--<div class="fr">-->
-                <!--<div class="name">库存：</div>-->
-                <!--<div class="text">{{item.reserve}}</div>-->
-              <!--</div>-->
-            <!--</div>-->
-
-            <!--<div class="list">-->
-              <!--<div class="fl">-->
-                <!--<div class="name">包装方式：</div>-->
-                <!--<div class="text">{{item.packaging || '无包装信息'}}</div>-->
-              <!--</div>-->
-              <!--<div class="fr">-->
-                <!--<div class="name">最小起订量：</div>-->
-                <!--<div class="text" style="color: #f31919">{{item.minBuyQty}}</div>-->
-              <!--</div>-->
-            <!--</div>-->
-
             <div class="list">
-              <div class="name left">价格梯度：<p>(pcs):</p></div>
+              <div class="name left">价格梯度<p>(pcs):</p></div>
               <div class="table left">
                 <ul>
                   <li class="title">
@@ -180,62 +158,7 @@
           </div>
           </div>
       </div>
-      <!--<table v-if="commodities.content&&commodities.content.length > 0">-->
-        <!--<thead id="product-head" >-->
-          <!--<tr>-->
-            <!--<th style="width: 1.77rem;">型号/品牌</th>-->
-            <!--<th style="width: 1.75rem;">包装</th>-->
-            <!--<th style="width: 2.2rem;">价格梯度</th>-->
-            <!--<th style="width: 1.77rem;">交期(天)</th>-->
-          <!--</tr>-->
-        <!--</thead>-->
-        <!--<thead class="active" v-show="isScrollOverTab">-->
-          <!--<tr>-->
-            <!--<th style="width: 1.77rem;">型号/品牌</th>-->
-            <!--<th style="width: 1.75rem;">包装</th>-->
-            <!--<th style="width: 2.2rem;">价格梯度</th>-->
-            <!--<th style="width: 1.77rem;">交期(天)</th>-->
-          <!--</tr>-->
-        <!--</thead>-->
-        <!--<tbody id="product-body">-->
-        <!--<tr v-for="commodity in searchLists" @click="goProductDetail(commodity)">-->
-          <!--<td class="store-name">-->
-            <!--<div>{{commodity.code}}</div>-->
-            <!--<div>{{commodity.brandNameCn}}</div>-->
-          <!--</td>-->
-          <!--<td>-->
-            <!--<div v-if="!commodity.packaging && !commodity.breakUp && !commodity.produceDate">-</div>-->
-            <!--<div>{{commodity.packaging}}</div>-->
-            <!--<div>{{commodity.breakUp?'可拆卖':'不可拆卖'}}</div>-->
-            <!--<div>{{commodity.produceDate}}</div>-->
-          <!--</td>-->
-          <!--<td class="price-level-wrap">-->
-            <!--<div v-if="!commodity.prices || commodity.prices.length == 0">-</div>-->
-            <!--<div class="price-number fl">-->
-              <!--<div v-for="price in commodity.prices">{{price.start}}+</div>-->
-            <!--</div>-->
-            <!--<div class="price-number fr">-->
-              <!--<div v-for="price in commodity.prices" class="price-level">-->
-                <!--<span v-if="commodity.currencyName.indexOf('RMB')!==-1">¥{{price.rMBPrice | currency}}</span>-->
-                <!--<span v-if="commodity.currencyName.indexOf('USD')!==-1">${{price.uSDPrice | currency}}</span>-->
-              <!--</div>-->
-            <!--</div>-->
-          <!--</td>-->
-          <!--<td>-->
-            <!--<div v-if="commodity.b2cMinDelivery">-->
-              <!--<span>{{commodity.b2cMinDelivery}}</span>-->
-              <!--<span v-if="commodity.b2cMaxDelivery && commodity.b2cMaxDelivery !== commodity.b2cMinDelivery">-</span>-->
-              <!--<span v-if="commodity.b2cMaxDelivery && commodity.b2cMaxDelivery !== commodity.b2cMinDelivery">{{commodity.b2cMaxDelivery}}</span>-->
-            <!--</div>-->
-            <!--<div v-if="commodity.minBuyQty"><span class="order-tag">订</span>{{commodity.minBuyQty}}起订</div>-->
-            <!--<div v-if="commodity.reserve"><span class="order-tag reserve-tag">库</span>{{commodity.reserve}}</div>-->
-            <!--<div v-if="!commodity.b2cMinDelivery">-->
-              <!--<span>—</span>-->
-            <!--</div>-->
-          <!--</td>-->
-        <!--</tr>-->
-        <!--</tbody>-->
-      <!--</table>-->
+
       <empty-status :type="isSearch ? 'search' : 'collect'"
                     :text="isSearch ? `抱歉，暂无与“${remindKeyword}”匹配的产品信息`: '抱歉，暂无产品信息'"
                     :showLink="false"
@@ -570,81 +493,6 @@
         }
       }
     }
-    .providerList {
-      border-top: .31rem solid #f1f3f7;
-      .content {
-        padding: 0.24rem 0.24rem;
-        background: #fff;
-        .linetext {
-          margin-bottom: 0.24rem;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-          &:nth-last-of-type(1){
-            margin-bottom: 0rem;
-          }
-        }
-        .fl {
-          float: left;
-          border-right: 1px dashed #e0e0e4;
-          width: 4.68rem;
-        }
-        .fr {
-          float: right;
-          margin: 0.18rem 0.24rem;
-          margin-right: 0rem;
-          font-size: 0.3rem;
-          &.addtop {
-            margin-top: 0.6rem;
-            .add {
-              background: #0067e7;
-              color: #fff;
-              &.noadd{
-                background: #cccbcb;
-                color: #fff;
-                border:1px solid #cccbcb;
-              }
-            }
-          }
-          div {
-            width: 2.1rem;
-            height: 0.6rem;
-            text-align: center;
-            line-height: 0.6rem;
-            border-radius: 3px;
-            &.look{
-              background: #0067e7;
-              color: #fff;
-            }
-            &.add{
-              background: #fff;
-              color: #0067e7;
-              border: 1px solid #0067e7;
-            }
-            &.delete{
-              background: #fff;
-              color: #f70415;
-              border: 1px solid #f70415;
-            }
-            &.noadd{
-              background: #cccbcb;
-              color: #fff;
-              border:1px solid #cccbcb;
-            }
-          }
-          div:nth-child(1){
-            margin-bottom: 0.26rem
-          }
-        }
-        &::after{
-          clear: both;
-          display: block;
-          content: ' ';
-          visibility: hidden;
-          zoom: 1;
-        }
-      }
-    }
     .middle {
       .order-tag {
         display: inline-block;
@@ -669,6 +517,7 @@
       background: #fff;
       margin: 0.24rem 0.24rem 0;
       border-radius: 5px;
+      border: 1px solid #e3e5e8;
       .pms {
         color: #f57710;
         border: 1px solid #f57710;
@@ -753,6 +602,7 @@
           width: 5rem;
           margin-bottom: 0;
           margin-top: 0;
+          margin-left: 0.1rem;
           li {
             height: 0.43rem;
             line-height: 0.43rem;

pages/mobile/center/vendor/product.vue

@@ -1050,7 +1050,7 @@
       text-align: center;
     }
     .list {
-      height: 0.46rem;
+      /*height: 0.46rem;*/
       .left {
         float: left;
         overflow: hidden;
@@ -1062,7 +1062,7 @@
         font-size: 0.3rem;
       }
       .button {
-        font-size: 0.28rem;
+        font-size: 0.26rem;
         color: #1a58dd;
         width: 0.92rem;
         text-align: center;
@@ -1070,6 +1070,8 @@
         border:1px solid #1a58dd;
         display: inline-block;
         margin-right: 0.2rem;
+        line-height: 0.4rem;
+        height: 0.4rem;
       }
       margin-bottom: 0.18rem;
       &::after{

pages/mobile/shop/index.vue

@@ -22,10 +22,21 @@
               <img :src="item.logoUrl || '/images/component/default.png'">
             </div>
             <div class="list-item-phone">
-              <p>电话：<span>{{item.enterprise.enTel}}</span></p>
+              <!--<div v-if="store.enterprise.enPhone"> <a :href="'tel:' + store.enterprise.enPhone" @click="clickPhone = true" :class="{'click-phone': clickPhone}">{{store.enterprise.enPhone}}</a></div>-->
+              <!--<div v-else><span>-</span></div>-->
+              <!--<p>电话：<span>{{item.enterprise.enTel || '-'}}</span></p>-->
+              <p v-if="item.enterprise.enTel" @click.stop="">
+                电话：<a :href="'tel:' + item.enterprise.enTel" >{{item.enterprise.enTel}}</a>
+              </p>
+              <p v-else>电话：<span>-</span></p>
+              <!--<p>手机：<span>{{item.enterprise.enPhone || '-'}}</span></p>-->
+              <p v-if="item.enterprise.enPhone" @click.stop="">
+                手机：<a :href="'tel:' + item.enterprise.enPhone" >{{item.enterprise.enPhone}}</a>
+              </p>
+              <p v-else>手机：<span>-</span></p>
               <p>传真：<span>{{item.enterprise.enFax}}</span></p>
               <!--<p>商家介绍： <nuxt-link :to="'/mobile/merchantDescription/'+item.uuid">点击查看</nuxt-link></p>-->
-              <p>联系商家：<a @click="selectStoreInfo(item, $event)">点击查看</a></p>
+              <!--<p>联系商家：<a @click="selectStoreInfo(item, $event)">点击查看</a></p>-->
               <i class="iconfont icon-shoucang" :style="item.isFocus=='true'?'color:#ff7800':'color:#bbb'" @click="focusStore(item, $event)"></i>
             </div>
           </div>
@@ -288,6 +299,9 @@
       border-bottom: .1rem solid #e2e4e6;
      /* padding-bottom:.1rem;*/
       box-shadow: 0 .03rem .01rem 0 #cdcbcb96;
+      .click-phone{
+        color: #f44336;
+      }
       h3{
         font-size: .32rem;
         line-height: .4rem;