兼容至IE9

components/common/page/pageComponent.vue

@@ -1,22 +1,43 @@
 <template>
-  <div style="float: right; margin: 30px 0;">
+  <div style="float: right; margin: 30px 0;" class="page-wrap">
     <el-pagination
       :current-page.sync="current"
       :page-size="pageSize"
-      layout="prev, pager, next, jumper"
+      layout="prev, pager, next"
       :total="total"
       @current-change="handleCurrentChange"
       v-if="total/pageSize>=1">
     </el-pagination>
+    <ul v-if="total/pageSize>=1" class="pagination" style="float:right;margin-left:20px;">
+        <li>
+          <input type="text" class="page-number" v-model="nowPage">
+        </li>
+        <li>
+          <a class="page-a" @click="changePage">GO</a>
+        </li>
+    </ul>
   </div>
 </template>
 
 <script>
   export default {
+    data () {
+      return {
+        nowPage: this.current
+      }
+    },
+    watch: {
+      current: function () {
+        this.nowPage = this.current
+      }
+    },
     props: ['current', 'total', 'pageSize'],
     methods: {
       handleCurrentChange: function (changedPage) {
         this.$emit('childEvent', changedPage)
+      },
+      changePage: function () {
+        this.$emit('childEvent', this.nowPage)
       }
     }
   }
@@ -63,4 +84,50 @@
     background-color: #fff;
     cursor: not-allowed;
   }
+  .pagination {
+    display: inline-block;
+    padding-left: 0;
+    margin: 20px 0;
+    border-radius: 4px;
+  }
+  .pagination>li {
+    display: inline;
+  }
+  input.page-number {
+    vertical-align: inherit;
+    display: inline-block;
+    width: 40px;
+    height: 31px;
+    padding: 6px 6px;
+    font-size: 14px;
+    line-height: 1.42857143;
+    color: #9B9792;
+    text-align: center;
+    background-color: #F6F5F4;
+    background-image: none;
+    border: 1px solid #ccc;
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
+    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
+  }
+  .page-a {
+    background: #5078cb !important;
+    color: #fff !important;
+    float: right!important;
+  }
+  .page-a {
+    color: #fff;
+    border-color: #4574e8;
+    padding: 6px 6px!important;
+    font-size: 14px!important;
+    border-top-right-radius: 4px!important;
+    border-bottom-right-radius: 4px!important;
+    text-decoration: none;
+    height: 31px;
+  }
+  .page-wrap ul, .page-wrap div {
+    display: inline-block;
+    margin: 0;
+  }
 </style>

components/search/GoodList.vue

@@ -56,7 +56,7 @@
           <tr v-for="item in good_list.components">
             <td>
               <nuxt-link :to="`/product/component/${item.uuid}`">
-                <img width="80px" height="80px" :src="item.img?item.img:'http://static.usoftmall.com/img/all/default.png?_v=1499336134257'">
+                <img width="80px" height="80px" :src="item.img?item.img:'/images/component/default.png'">
               </nuxt-link>
             </td>
             <td class="brand-code">
@@ -122,10 +122,10 @@
                 <span>—</span>
               </div>
               <div v-if="item.reserve > 0">
-                <button class="btn btn-primary btn-buy-now" ><span class="watch">立即购买</span></button>
+                <a href="/user#/order/pay/524241737332303137303830313030303030303036" class="btn btn-primary btn-buy-now" ><span class="watch">立即购买</span></a>
               </div>
               <div v-if="item.reserve > 0">
-                <button class="btn btn-add-cart"><span class="watch">加入购物车</span></button>
+                <a class="btn btn-add-cart"><span class="watch">加入购物车</span></a>
               </div>
             </td>
           </tr>
@@ -138,7 +138,7 @@
         </table>
       </div>
       <page :total="total_count" :page-size="pageSize"
-      :current="nowPage" v-on:childEvent="listenPage"></page>
+      :current="nowPage" @childEvent="listenPage"></page>
     </div>
   </div>
 </template>
@@ -422,6 +422,7 @@
     height: 30px;
     font-size: 12px;
     border: 1px solid #5078cb;
+    padding-top: 8px;
   }
 
   .product-list .btn-add-cart {
@@ -432,6 +433,7 @@
     font-size: 12px;
     background-color: #fff;
     border: 1px solid #e8e8e8;
+    padding-top: 8px;
   }
   .product-list .btn-buy-now:hover{
     background: #214797;

components/search/Kind.vue

@@ -60,28 +60,7 @@
       <div class="sl-value">
         <ul class="list-inline" >
           <li><a class="f14" @click="restore('store')">全部</a></li>
-          <li v-if="getType(list_store_type,store_type_co)">
-            <div class="f14" style="color: #999;" v-if="!getType(list_store_type,store_type_co)&&!co_click_flag">寄售</div>
-            <a class="f14" v-if="getType(list_store_type,store_type_co)&&!co_click_flag" @click="click_store_type('CONSIGNMENT')">寄售</a>
-            <span v-if="co_click_flag" @click="cancel_store_type('CONSIGNMENT')">
-              <div class="sl-filter">
-                <a class="text-num" >寄售</a>
-                <span><i class="fa fa-close"></i></span>
-              </div>
-            </span>
-          </li>
-          <li v-if="getType(list_store_type,store_type_di)">
-            <div class="f14" style="color: #999;" v-if="!getType(list_store_type,store_type_di)&&!di_click_flag">经销</div>
-            <a class="f14" v-if="getType(list_store_type,store_type_di)&&!di_click_flag" @click="click_store_type('DISTRIBUTION')">经销</a>
-            <span v-if="di_click_flag" @click="cancel_store_type('DISTRIBUTION')">
-              <div class="sl-filter">
-                <a class="text-num" >经销</a>
-                <span><i class="fa fa-close"></i></span>
-              </div>
-            </span>
-          </li>
           <li v-if="getType(list_store_type,store_type_or)">
-            <div class="f14" style="color: #999;" v-if="!getType(list_store_type,store_type_or)&&!or_click_flag">原厂</div>
             <a class="f14" v-if="getType(list_store_type,store_type_or)&&!or_click_flag" @click="click_store_type('ORIGINAL_FACTORY')">原厂</a>
             <span v-if="or_click_flag" @click="cancel_store_type('ORIGINAL_FACTORY')">
               <div class="sl-filter">
@@ -91,7 +70,6 @@
             </span>
           </li>
           <li v-if="getType(list_store_type,store_type_ag)">
-            <div class="f14" style="color: #999;" v-if="!getType(list_store_type,store_type_ag)&&!ag_click_flag">代理</div>
             <a class="f14" v-if="getType(list_store_type,store_type_ag)&&!ag_click_flag" @click="click_store_type('AGENCY')">代理</a>
             <span v-if="ag_click_flag" @click="cancel_store_type('AGENCY')">
               <div class="sl-filter" >
@@ -100,29 +78,26 @@
               </div>
             </span>
           </li>
-          <li v-if="!getType(list_store_type,store_type_co)">
-            <div class="f14" style="color: #999;" v-if="!getType(list_store_type,store_type_co)&&!co_click_flag">寄售</div>
-            <a class="f14" v-if="getType(list_store_type,store_type_co)&&!co_click_flag" @click="click_store_type('CONSIGNMENT')">寄售</a>
-            <span v-if="co_click_flag" @click="cancel_store_type('CONSIGNMENT')">
+          <li v-if="getType(list_store_type,store_type_di)">
+            <a class="f14" v-if="getType(list_store_type,store_type_di)&&!di_click_flag" @click="click_store_type('DISTRIBUTION')">经销</a>
+            <span v-if="di_click_flag" @click="cancel_store_type('DISTRIBUTION')">
               <div class="sl-filter">
-                <a class="text-num" >寄售</a>
+                <a class="text-num" >经销</a>
                 <span><i class="fa fa-close"></i></span>
               </div>
             </span>
           </li>
-          <li v-if="!getType(list_store_type,store_type_di)">
-            <div class="f14" style="color: #999;" v-if="!getType(list_store_type,store_type_di)&&!di_click_flag">经销</div>
-            <a class="f14" v-if="getType(list_store_type,store_type_di)&&!di_click_flag" @click="click_store_type('DISTRIBUTION')">经销</a>
-            <span v-if="di_click_flag" @click="cancel_store_type('DISTRIBUTION')">
+          <li v-if="getType(list_store_type,store_type_co)">
+            <a class="f14" v-if="getType(list_store_type,store_type_co)&&!co_click_flag" @click="click_store_type('CONSIGNMENT')">寄售</a>
+            <span v-if="co_click_flag" @click="cancel_store_type('CONSIGNMENT')">
               <div class="sl-filter">
-                <a class="text-num" >经销</a>
+                <a class="text-num" >寄售</a>
                 <span><i class="fa fa-close"></i></span>
               </div>
             </span>
           </li>
           <li v-if="!getType(list_store_type,store_type_or)">
             <div class="f14" style="color: #999;" v-if="!getType(list_store_type,store_type_or)&&!or_click_flag">原厂</div>
-            <a class="f14" v-if="getType(list_store_type,store_type_or)&&!or_click_flag" @click="click_store_type('ORIGINAL_FACTORY')">原厂</a>
             <span v-if="or_click_flag" @click="cancel_store_type('ORIGINAL_FACTORY')">
               <div class="sl-filter">
                 <a class="text-num" >原厂</a>
@@ -132,7 +107,6 @@
           </li>
           <li v-if="!getType(list_store_type,store_type_ag)">
             <div class="f14" style="color: #999;" v-if="!getType(list_store_type,store_type_ag)&&!ag_click_flag">代理</div>
-            <a class="f14" v-if="getType(list_store_type,store_type_ag)&&!ag_click_flag" @click="click_store_type('AGENCY')">代理</a>
             <span v-if="ag_click_flag" @click="cancel_store_type('AGENCY')">
               <div class="sl-filter" >
                 <a class="text-num" >代理</a>
@@ -140,6 +114,24 @@
               </div>
             </span>
           </li>
+          <li v-if="!getType(list_store_type,store_type_di)">
+            <div class="f14" style="color: #999;" v-if="!getType(list_store_type,store_type_di)&&!di_click_flag">经销</div>
+            <span v-if="di_click_flag" @click="cancel_store_type('DISTRIBUTION')">
+              <div class="sl-filter">
+                <a class="text-num" >经销</a>
+                <span><i class="fa fa-close"></i></span>
+              </div>
+            </span>
+          </li>
+          <li v-if="!getType(list_store_type,store_type_co)">
+            <div class="f14" style="color: #999;" v-if="!getType(list_store_type,store_type_co)&&!co_click_flag">寄售</div>
+            <span v-if="co_click_flag" @click="cancel_store_type('CONSIGNMENT')">
+              <div class="sl-filter">
+                <a class="text-num" >寄售</a>
+                <span><i class="fa fa-close"></i></span>
+              </div>
+            </span>
+          </li>
         </ul>
       </div>