Merge branch 'master' of ssh://10.10.101.21/source/mall-web-ssr into HEAD

# Conflicts:
#	store/index.js

assets/font/iconfont.css

@@ -44,3 +44,4 @@
 
 .icon-arrow-right:before { content: "\e621"; }
 
+.icon-chuyidong:before { content: "\e617"; }

assets/scss/common.scss

@@ -248,5 +248,36 @@
 .aside-enter, .aside-leave-active {
   opacity: 0
 }
+// 轮播
+.swiper-pagination-bullet{
+  width: 12px !important;
+  height: 12px !important;
+  opacity: 1 !important;
+  background: none !important;
+  border: #fff 1px solid;
+}
+.swiper-pagination-bullet.swiper-pagination-bullet-active{
+  background: #fff !important;
+}
+.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets{
+  bottom: 20px !important;
+}
+.swiper-button-prev i,.swiper-button-next i{
+  font-size: 40px;
+  color: #fff;
+  opacity: 1;
+  font-weight: 900;
+  text-shadow: 2px 0px 5px #333;
+}
 
-
+.swiper-button-prev,.swiper-button-next{
+  background: none !important;
+  width: 40px !important;
+  height: 80px !important;
+  line-height: 80px;
+  margin-top: -45px !important;
+  opacity: .6;
+}
+.swiper-button-prev:hover,.swiper-button-next:hover{
+  opacity: 1;
+}

assets/scss/help.css

@@ -0,0 +1,249 @@
+/* main */
+#main>.container .left {
+  width: 200px;
+  float: left;
+  background-color: #fff;
+  margin-top: 16px;
+}
+
+#main>.container .right {
+  width: 975px;
+  float: right;
+  font-size: 12px;
+  margin-top: 16px;
+  background: #fff;
+  border: #e8e8e8 1px solid;
+  margin-bottom: 20px;
+}
+.help-list{
+  width: 200px;
+  background: #fff;
+  border: #e8e8e8 1px solid;
+}
+.help-list h2{
+  background: #5078cb;
+  line-height: 34px;
+  height: 34px;
+  color: #fff;
+  font-size: 14px;
+  text-align: center;
+  margin: 0;
+}
+.help-list ul{
+  width: 200px;
+  display: inline-block;
+}
+.help-list li {
+  line-height: 33px;
+  font-size: 14px;
+  color: #333;
+  float: left;
+  width: 100%;
+  padding-left: 10px;
+}
+
+.help-list li a {
+  display: block;
+  padding-left: 15px;
+  text-decoration: none;
+  color: #333;
+  background:url("/images/help/openblack.png") no-repeat left;
+}
+
+.help-list li a:hover{
+  color: #5078cb;
+  cursor: pointer;
+}
+.help-list ul.list-body {
+  /*display: none;*/
+  color: #666;
+}
+
+.help-list ul.list-body.active {
+  display: block;
+}
+.help-list ul.list-body li {
+  float: none;
+  background-image: none;
+  min-height: 26px;
+  line-height: 26px;
+  font-size: 12px;
+}
+
+.help-list ul.list-body li a {
+  padding-left: 15px;
+  display: block;
+  color: rgb(50,50,50);
+  background: none;
+}
+
+.help-list ul.list-body li a:hover {
+  color: #5078cb;
+  cursor: pointer;
+}
+.help-list ul.list-body li a.cur,.help-list ul li a.cur{
+  text-decoration: none;
+  font-size: 14px;
+  background:url("/images/help/openblackR.png") no-repeat left;
+}
+
+/*
+帮助中心中心内容*/
+.help-center{
+  width: 100%;
+  padding-bottom: 20px;
+}
+.help-center .help-head{
+  width: 100%;
+  height: 60px;
+  line-height: 60px;
+  border-bottom: #dcdcdc 1px dotted;
+}
+.help-center .help-head img{
+  margin-left: 30px;
+  vertical-align: middle;
+}
+.help-center-title{
+  width: 100%;
+  height: 50px;
+  line-height: 50px;
+  padding-left: 30px;
+  margin-bottom: 10px;
+}
+.help-center-title a{
+  font-size: 16px;
+  color: #646464;
+  margin-right: 6px;
+  vertical-align: middle;
+}
+.help-center-title a.box{
+  color: #646464;
+  border: #ccc 1px solid;
+  padding: 1px 10px;
+  margin-right: 8px;
+  line-height: 23px;
+}
+.help-center-title a:hover{
+  color: #5078cb;
+}
+.help-center-title a.box:hover{
+  border: #5078cb 1px solid;
+}
+.help-center-title a.box i{
+  font-size: 8px;
+  font-weight: inherit;
+}
+.help-center-title a i{
+  margin-left: 10px;
+}
+.help-center-home{
+  width: 910px;
+  margin: 0 auto;
+  border: #e8e8e8 1px solid;
+  padding: 0 15px 15px 15px;
+  padding-top: 10px;
+}
+.help-center-home h4{
+  height: 40px;
+  line-height: 40px;
+  font-size: 16px;
+  padding-left: 20px;
+  margin: 0;
+  font-weight: bold;
+}
+.help-center-home .row{
+  line-height: 30px;
+  max-width: 400px;
+  margin-left: 18px;
+  margin-bottom: 30px;
+}
+.help-center-home .row em{
+  margin-right: 6px;
+  width: 3px;
+  height: 3px;
+  display: inline-block;
+  background: #323232;
+  border-radius: 100%;
+  float: left;
+  position: relative;
+  top: 12px;
+}
+.help-center-home .row div{
+  width: 33.3333%;
+  float: left;
+}
+.help-center-home .row div:hover a{
+  color: #5078cb;
+  text-decoration: underline;
+}
+.help-center-home .row div:hover em{
+  background: #5078cb;
+}
+.help-center-home .row a{
+  font-size: 12px;
+  color: #323232;
+}
+
+.help-center-list,.help-center-details{
+  width: 910px;
+  margin: 0 auto;
+  border: #e8e8e8 1px solid;
+  padding: 0 15px 15px 15px;
+  padding-top: 10px;
+}
+.help-center-list h4{
+  height: 40px;
+  line-height: 40px;
+  font-size: 14px;
+  padding-left: 20px;
+  margin: 0;
+}
+.help-center-list ul{
+  width: 100%;
+  margin-left: 20px;
+}
+.help-center-list ul li{
+  display: block;
+  line-height: 25px;
+}
+.help-center-list ul li a{
+  color: #323232;
+  font-size: 14px;
+}
+.help-center-list ul li em{
+  margin-right: 6px;
+  width: 3px;
+  height: 3px;
+  display: inline-block;
+  background: #323232;
+  border-radius: 100%;
+  float: left;
+  position: relative;
+  top: 12px;
+}
+.help-center-list ul li:hover a{
+  color: #5078cb;
+  text-decoration: underline;
+}
+.help-center-list ul li:hover em{
+  background: #5078cb;
+}
+.help-center-details{
+  padding: 15px 20px 20px 20px;
+}
+.help-center-details .title {
+  font-size: 16px;
+  margin-bottom: 10px;
+  font-weight: bold;
+}
+.dot{
+  font-size: 16px;
+  margin-right: 6px;
+  position: relative;
+  top: 2px;
+  margin-left: 2px;
+}
+.help-center-title a.box i{
+  position: relative;
+  top: -2px;
+}

assets/scss/reset.scss

@@ -17,7 +17,9 @@ body {
 article,aside,dialog,footer,header,section,footer,nav,figure,menu {
   display: block
 }
-
+.container{
+  padding: 0;
+}
 h1,
 h2,
 h3,
@@ -28,7 +30,9 @@ h6 {
   font-family: inherit;
   line-height: inherit;
 }
-
+a:focus{
+  text-decoration: none !important;
+}
 h1 {
   font-size: $font-size-h1;
   font-weight: 500;

components/default/Footer.vue

@@ -89,6 +89,10 @@
 </script>
 <style lang="scss" scoped>
   @import '~assets/scss/variables';
+  .footer-guide h5{
+    font-size: 16px;
+    margin-bottom: 10px;
+  }
   .footer {
     font-size: $font-size-small;
     background-color: $grey-bg;

components/default/Header.vue

@@ -37,7 +37,7 @@
             <a class="item" href="http://account.ubtob.com/sso/register">注册</a>
             <nuxt-link class="item" :to="'/'">商城首页</nuxt-link>
           </template>
-          <nuxt-link class="item" to="/help">帮助中心</nuxt-link>
+          <nuxt-link class="item" to="/help/home">帮助中心</nuxt-link>
         </div>
       </div>
     </nav>
@@ -88,6 +88,10 @@
   }
 </script>
 <style lang="scss" scoped>
+  .header .navbar{
+    min-height: inherit;
+    border-radius: 0;
+  }
   @import '~assets/scss/mixins';
   @import '~assets/scss/variables';
 
@@ -123,7 +127,7 @@
           float: left;
 
           .navbar-logo {
-            margin-bottom: -2px;
+            margin-bottom: 2px;
           }
 
           .navbar-slogan {

components/default/RightBar.vue

@@ -2,32 +2,42 @@
   <div class="right-bar">
     <ul class="right-bar-center">
       <li class="right-bar-item">
-        <nuxt-link to="/user/cart">
+        <nuxt-link to="/user/cart" class="title">
           <i class="iconfont icon-shopping-cart icon-xlg"></i>
         </nuxt-link>
-
+        <div class="sidebar-menu"><a href="" title="我的购物车" target="_blank">我的购物车<em><span>(<span>10</span>)</span></em></a></div>
       </li>
       <li class="right-bar-item">
-        <a @click="onLeaveMessageClick()">
+        <a @click="onLeaveMessageClick()" class="title">
           <i class="iconfont icon-liuyan icon-xlg"></i>
         </a>
+        <div class="sidebar-menu"><a href="" title="留言板" target="_blank">留言板</a></div>
       </li>
       <li class="right-bar-item contact-menu">
-        <a href="http://wpa.qq.com/msgrd?v=3&uin=3432892085&site=www.ubtoc.com&menu=yes" target="_blank">
+        <a href="http://wpa.qq.com/msgrd?v=3&uin=3432892085&site=www.ubtoc.com&menu=yes" target="_blank" class="title">
           <i class="iconfont icon-kefu icon-xlg"></i>
         </a>
+        <div class="contact-us sidebar-menu">
+          <p>在线客服：<img src="/images/all/songguo.png" /><a href="http://wpa.qq.com/msgrd?v=3&uin=3432892085&site=www.ubtoc.com&menu=yes" class="contact-btn" target="_blank">联系客服</a></p>
+          <p>服务电话：400-830-1818</p>
+          <p>服务邮箱：yrsc@usoftchina.com</p>
+          <p>工作时间：</p>
+          <p>周一至周五 9:00-18:00</p>
+        </div>
       </li>
     </ul>
     <ul class="right-bar-bottom">
       <li class="right-bar-item">
-        <nuxt-link to="/user/browsingHistory">
+        <nuxt-link to="/user/browsingHistory" class="title">
           <i class="iconfont icon-zuji icon-xlg"></i>
         </nuxt-link>
+        <div class="sidebar-menu"><a href="" title="浏览记录" target="_blank">浏览记录</a></div>
       </li>
       <li class="right-bar-item">
-        <a @click="toTop()">
+        <a @click="toTop()" class="title">
           <i class="iconfont icon-arrow-up icon-xlg"></i>
         </a>
+        <div class="sidebar-menu"><a @click="toTop()" title="返回顶部" target="_blank">返回顶部</a></div>
       </li>
     </ul>
   </div>
@@ -52,6 +62,87 @@
   }
 </script>
 <style lang="scss" scoped>
+  em,i{
+    font-style: inherit;
+  }
+  .right-bar ul li{
+    position: relative;
+  }
+  .right-bar ul li .sidebar-menu {
+    position: absolute;
+    display: block;
+    right: -100%;
+    top: 0px;
+    bottom: 0;
+    width: 120px;
+    line-height: 38px;
+    height: 38px;
+    color: #ffffff;
+    background: #555;
+    -webkit-transform: translateX(100%);
+    -moz-transform: translateX(100%);
+    -ms-transform: translateX(100%);
+    -o-transform: translateX(100%);
+    transform: translateX(100%);
+    -webkit-transition: transform .5s;
+    -moz-transition: transform .5s;
+    -ms-transition: transform .5s;
+    -o-transition: transform .5s;
+    transition: transform .5s;
+    z-index: 19;
+  }
+  .right-bar ul li .sidebar-menu a{
+    background-color: #555555;
+  }
+  .right-bar ul li:hover a{
+    background-color: #555555;
+  }
+  .right-bar ul li:hover .sidebar-menu {
+    display: block;
+    -webkit-transform: translateX(-72px);
+    -moz-transform: translateX(-72px);
+    -ms-transform: translateX(-72px);
+    -o-transform: translateX(-72px);
+    transform: translateX(-72px);
+  }
+  .right-bar ul li .contact-us{
+    /*right: 200px;*/
+    height: 180px;
+    padding-top: 10px;
+    width: 210px;
+    top: -76px;
+  }
+  .right-bar ul li .contact-us p{
+    line-height: 33px;
+    text-align: left;
+    padding-left: 10px;
+    margin-bottom: 0;
+    white-space: nowrap;
+    font-size: 12px;
+  }
+  .right-bar ul li .contact-us .contact-btn{
+    width: 62px;
+    height: 18px;
+    line-height: 18px;
+    background: #ef7f03;
+    display: inline-block;
+    text-align: center;
+    color: #fff;
+    font-size: 12px;
+    border-radius: 5px;
+    padding: 0;
+  }
+  .right-bar-item{
+    width: 36px;
+    height: 38px;
+  }
+  .right-bar .right-bar-item a.title{
+    display: inline-block;
+    width: 36px;
+    height: 38px;
+    line-height: 38px;
+    padding: 0;
+  }
   .right-bar {
     position: fixed;
     z-index: 1000;
@@ -80,7 +171,6 @@
       a {
         position: relative;
         display: block;
-        padding: 5px 0;
         width: 100%;
         color: #fff;
         background-color: #5078CB;
@@ -91,6 +181,7 @@
         -o-transition: background-color ease 0.5s;
         transition: background-color ease 0.5s;
         z-index: 20;
+        font-size: 12px;
       }
     }
   }

components/help/helpHeader.vue

@@ -0,0 +1,122 @@
+<template>
+  <div class="user_center">
+    <div class="wrap">
+      <div class="wid1190">
+        <div class="fl">
+          <nuxt-link :to="'/'"><img src="/images/help/logo.png"/></nuxt-link>
+          <!--<span>我的商城<a ng-href="{{homeUrl}}">返回商城首页</a> </span>-->
+        </div>
+        <!--<div class="nav">
+            <ul>
+                <li ng-class="{'active' : active == 'home'}"><a href="#home" class="active">首页</a></li>
+                <li ng-class="{'active' : active == 'message'}" ><a href="#message">消息（0）</a></li>
+                <li ng-class="{'active' : active == 'browsing-history'}" s><a href="#browsing-history">浏览历史</a></li>
+            </ul>
+        </div>-->
+        <!--<div id="mall-search" class="search-right fr" ng-controller="SearchCtrl">
+            <input type="text" ng-model="keyword" ng-change="onChange()" ng-search="search()" ng-focus="onFocus()" ng-blur="onBlur()" ng-keyup="onKeyup()"placeholder="型号/类别/品牌" />
+            <a class="seek" ng-click="search()">搜索</a>
+            <ul class="association" ng-show="associate || associateEnter" ng-mouseenter="onAssociateEnter()" ng-mouseleave="onAssociateLeave()">
+                <li ng-repeat="as in associates" ng-bind="as" ng-class="{'active': $index==selectIndex}"
+                    ng-click="onAssociateClick(as)"></li>
+            </ul>
+        </div>-->
+        <span class="help-title">帮助中心</span>
+      </div>
+      </div>
+  </div>
+</template>
+<script>
+  export default {
+    name: 'helpHeader'
+  }
+</script>
+<style>
+  .user_center {
+    width: 100%;
+    margin: 0px auto;
+    height: 80px;
+    background: #5078cb;
+  }
+  .wid1190{
+    width: 100%;
+    display: inline-block;
+  }
+  .user_center .fl {
+    width: 230px;
+    position: relative;
+  }
+
+  .user_center .fl a img {
+    float: left;
+    margin-top: 15px;
+  }
+
+  .user_center .fl span {
+    font-size: 18px;
+    color: #fff;
+    position: relative;
+    top: 15px;
+    left: 10px;
+  }
+
+  .user_center .fl span a {
+    width: 86px;
+    height: 20px;
+    display: inline-block;
+    text-align: center;
+    color: #fff;
+    font-size: 11px;
+    border: #fff 1px solid;
+    border-radius: 10px;
+    line-height: 20px;
+  }
+
+  .user_center .fl span a:hover {
+    background: #d2272d;
+    color: #fff;
+  }
+
+  .user_center .nav {
+    background: none;
+    width: 500px;
+    float: left;
+    margin-left: 20px;
+    line-height: 80px;
+    margin-bottom: 0px;
+  }
+
+  .user_center .nav ul {
+    width: 100%;
+    margin: 0px auto;
+  }
+
+  .user_center .nav ul li {
+    font-size: 18px;
+    width: 120px;
+    float: left;
+    text-align: center;
+    position: relative;
+  }
+
+  .user_center .nav ul li a {
+    color: #fff;
+    height: 30px;
+    display: inline-block;
+    line-height: 30px;
+    font-size: 14px;
+    width: 100%;
+    display: inline-block;
+  }
+  .user_center .wrap{
+    width: 1190px;
+    margin: 0 auto;
+  }
+  .help-title{
+    float: right;
+    line-height: 80px;
+    font-size: 24px;
+    color: #fff;
+    margin-right: 20px;
+  }
+</style>

components/help/index.js

@@ -0,0 +1,4 @@
+import left from './left.vue'
+import helpHeader from './helpHeader.vue'
+
+export { left, helpHeader }

components/help/left.vue

@@ -0,0 +1,115 @@
+<template>
+  <div class="help-list">
+    <h2>帮助中心</h2>
+    <ul class="list-unstyled" style="margin-top: 10px;">
+      <li v-for="nav01 in helps">
+        <a :class="{'cur': nav01.isHide}" @click="toggleNav(nav01)"><span>{{nav01.item}}</span></a>
+        <ul class="list-unstyled list-body" v-if="!nav01.isHide">
+          <li v-for="nav02 in nav01.children">
+            <nuxt-link :to="`/help/helpList/${nav02.id}`"><span v-text="nav02.item"></span></nuxt-link>
+          </li>
+        </ul>
+      </li>
+    </ul>
+  </div>
+</template>
+<script>
+  export default {
+    name: 'left',
+    data () {
+      return {
+        navShow: { 122: false }
+      }
+    },
+    computed: {
+      helps () {
+        return this.$store.state.help.snapsho.data
+      }
+    },
+    methods: {
+      toggleNav (nav) {
+        nav.isHide = !nav.isHide
+      }
+    }
+  }
+</script>
+<style>
+  .help-list{
+    width: 200px;
+    background: #fff;
+    border: #e8e8e8 1px solid;
+  }
+  .help-list h2{
+    background: #5078cb;
+    line-height: 34px;
+    height: 34px;
+    color: #fff;
+    font-size: 14px;
+    text-align: center;
+    margin: 0;
+  }
+  .help-list ul{
+    width: 200px;
+    display: inline-block;
+  }
+  .help-list li {
+    position: relative;
+    line-height: 33px;
+    font-size: 14px;
+    color: #333;
+    float: left;
+    width: 100%;
+    padding-left: 10px;
+  }
+
+  .help-list li a {
+    display: block;
+    padding-left: 15px;
+    text-decoration: none;
+    color: #333;
+  }
+
+  .help-list li a:hover{
+    color: #5078cb;
+    cursor: pointer;
+  }
+  .help-list ul.list-body {
+    /*display: none;*/
+    color: #666;
+  }
+
+  .help-list ul.list-body.active {
+    display: block;
+  }
+  .help-list ul.list-body li {
+    float: none;
+    background-image: none;
+    min-height: 26px;
+    line-height: 26px;
+    font-size: 12px;
+  }
+
+  .help-list ul.list-body li a {
+    padding-left: 15px;
+    display: block;
+    color: rgb(50,50,50);
+    background: none;
+  }
+
+  .help-list ul.list-body li a:hover {
+    color: #5078cb;
+    cursor: pointer;
+  }
+  .help-list ul.list-body li a.cur,.help-list ul li a.cur{
+    text-decoration: none;
+    font-size: 14px;
+  }
+  .help-list .operate-icon {
+    position: absolute;
+    right: 20px;
+    top: 1px;
+  }
+  .help-list li>ul>li>ul>li {
+    padding-left: 30px;
+  }
+</style>

components/home/Advert.vue

@@ -64,7 +64,7 @@
 
   .advert-slide {
     text-align: center;
-    margin-bottom: $xlg-pad;
+    /*margin-bottom: $xlg-pad;*/
 
     .swiper-container {
       height: 100px;

components/home/Carousel.vue

@@ -12,6 +12,8 @@
             </div>
           </div>
           <div class="swiper-pagination swiper-pagination-bullets"></div>
+          <div class="swiper-button-prev"><i class="iconfont icon-arrow-left"></i></div>
+          <div class="swiper-button-next"><i class="iconfont icon-arrow-right"></i></div>
         </div>
       </div>
     </div>
@@ -30,6 +32,8 @@
           mousewheelControl: true,
           effect: 'fade',
           lazyLoading: true,
+          prevButton: '.swiper-button-prev',
+          nextButton: '.swiper-button-next',
           onTransitionStart: (swiper) => {
             // 不要通过vue刷新dom，会导致pagination无法刷新
             // this.activeSlide = swiper.activeIndex

components/home/Nav.vue

@@ -36,7 +36,9 @@
 <style lang="scss" scoped>
   @import '~assets/scss/variables';
   $nav-height: 40px;
-
+ .container{
+    padding: 0;
+  }
   .nav-list {
     background-color: rgb(244, 248, 255);
     height: $nav-height;

components/home/News.vue

@@ -6,7 +6,7 @@
       </h2>
       <ul class="title-list">
         <li v-for="n in news5" class="item">
-          <nuxt-link :to="`/news/${n.id}`">
+          <nuxt-link :to="`/news/${n.id}`" target="_blank">
             {{ n.title }}
           </nuxt-link>
         </li>
@@ -14,7 +14,7 @@
       </ul>
       <ul class="thumbnail-list">
         <li v-for="n in news3" class="item">
-          <nuxt-link :to="`/news/${n.id}`">
+          <nuxt-link :to="`/news/${n.id}`" target="_blank">
             <img :src="n.thumbnail">
             <span>{{ n.title }}</span>
           </nuxt-link>

components/home/Partner.vue

@@ -45,7 +45,9 @@
 </script>
 <style lang="scss" scoped>
   @import '~assets/scss/variables';
-
+  .partner-container h3{
+    font-size: 24px;
+  }
   .partner {
     text-align: center;
     margin-bottom: $xlg-pad;

components/home/floor/Floor.vue

@@ -24,6 +24,15 @@
   }
 </script>
 <style lang="scss" scoped>
+  .floor h3 {
+    width: 100%;
+    height: 70px;
+    font-size: 24px;
+    padding-top: 0;
+    margin: 0;
+    line-height: 100px;
+    color: #333;
+  }
   .floor {
 
     ul {
@@ -134,6 +143,7 @@
           -webkit-box-orient: vertical;
           -webkit-line-clamp: 2;
           word-break: break-all;
+          display: inherit;
         }
 
         .floor-item-body {

components/home/floor/FloorList.vue

@@ -25,7 +25,10 @@
 </script>
 <style lang="scss" scoped>
   @import '~assets/scss/variables';
-
+  /*add*/
+  .floor-list .container{
+    padding: 0;
+  }
   .floor-list {
     margin-bottom: $xlg-pad;
   }

components/main/Search.vue

@@ -136,7 +136,9 @@
 </script>
 <style lang="scss" scoped>
   @import '~assets/scss/variables';
-
+  .form-control{
+    border-radius: 0;
+  }
   .search-box {
     width: 470px;
     height: 40px;
@@ -150,6 +152,7 @@
     .search-btn {
       font-size: 16px;
       width: 78px;
+      border-radius: 0;
     }
 
     .search-hot {

components/provider/Carousel.vue

@@ -7,8 +7,8 @@
         </div>
       </div>
       <div class="swiper-pagination swiper-pagination-bullets"></div>
-      <div class="swiper-button-prev"></div>
-      <div class="swiper-button-next"></div>
+      <div class="swiper-button-prev"><i class="iconfont icon-arrow-left"></i></div>
+      <div class="swiper-button-next"><i class="iconfont icon-arrow-right"></i></div>
     </div>
   </div>
 </template>

components/provider/Suppliers.vue

@@ -31,7 +31,7 @@
           <a class="store-name" :href="'/store/' + store.uuid" target="_blank"><div :title="store.storeName">{{store.storeName}}</div></a>
           <div class="store-message">
             <span>商家介绍：</span>
-            <span>{{store.description}}</span>
+            <span>{{store.description.slice(0,160)}}<em v-if="store.description.length > 160">...</em></span>
           </div>
         </td>
         <td class="vertical-middle">
@@ -139,14 +139,14 @@ export default {
 	}
 
 	#store-list table>tbody .store-message {
-		color: #999;
-		width: 95%;
-		overflow: hidden;
-		text-overflow: ellipsis;
-		display: -webkit-box;
-		-webkit-box-orient: vertical;
-		-webkit-line-clamp: 3;
-		line-height: 18px;
+    color: #999;
+    width: 95%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
+    line-height: 18px;
 	}
 	#store-list table>tbody tr td{
 		padding: 15px;

components/store/CommodityList.vue

@@ -0,0 +1,437 @@
+<template>
+  <div id="goods-list-fragment">
+    <div class="container" style="width: 1190px; padding: 0;">
+      <div class="title-area">
+        <div class="category-title">
+          <span style="line-height: 34px;">产品分类</span>
+        </div>
+        <div class="category-content">
+          <el-tree :data="kinds" :props="defaultProps" accordion :highlight-current="true" @current-change="handlerCurrentNode"></el-tree>
+        </div>
+      </div>
+      <!-- 产品列表 -->
+      <div class="goods-area">
+        <div class="row" style="margin: 0;width: 970px;">
+          <div class="col-md-3 btn-group btn-group-sm" style="padding: 0;">
+            <a type="button" class="btn btn-default btn-line btn-info">产品列表</a>
+          </div>
+          <div class="col-md-4 col-md-offset-5" style="padding: 0;">
+            <div class="input-group">
+              <input type="search" class="form-control" id="search_input" title="code" placeholder="请输入要筛选的原厂型号"
+                     v-model="searchCode" @search="goodsSearch(searchCode)"/>
+              <span class="input-group-btn">
+							<button type="button" class="btn" id="search_btn" @click="goodsSearch(searchCode)">&nbsp;筛&nbsp;选&nbsp;</button>
+						</span>
+            </div>
+          </div>
+        </div>
+
+        <!-- 列表展示 -->
+        <table class="goodslist" style="width: 970px">
+          <thead>
+          <tr style="height: 40px;">
+            <th width="90"></th>
+            <th width="150">品牌/型号</th>
+            <th width="100">包装/生产日期</th>
+            <th width="90">库存</th>
+            <th width="90">数量</th>
+            <th width="90">香港交货<span style="font-size: 12px;">($)</span></th>
+            <th width="100">大陆交货<span style="font-size: 12px;">(￥)</span></th>
+            <th width="100">交期</th>
+            <th width="100">操作</th>
+          </tr>
+          </thead>
+          <tbody id="goodslist-content">
+          <tr v-for="commodity in commodities.content">
+            <td class="commodity-icon">
+              <a :href="'/store/' + commodity.storeid + '/' + commodity.batchCode" target="_blank">
+                <div class="img"><img :src="commodity.img || '/images/store/common/default.png'"/></div>
+              </a>
+            </td>
+            <td class="brand-code">
+              <div class="brand" v-text="commodity.brandNameEn"></div>
+              <div class="code" v-text="commodity.code"></div>
+            </td>
+            <td>
+              <div class="package" v-text="commodity.packaging || '暂无包装信息'"></div>
+              <div class="date" v-text="commodity.produceDate">2016-12-01</div>
+            </td>
+            <td style="text-align: left;vertical-align: middle;">
+              <div class="goods">
+                库存：<span v-text="commodity.reserve">31500</span>
+              </div>
+              <div class="from">
+                起拍：<span v-text="commodity.minBuyQty">300</span>
+              </div>
+              <div class="multiple">
+                倍数：<span>1</span>
+              </div>
+            </td>
+            <td>
+              <div v-for="price in commodity.prices" v-text="price.start + '+'"></div>
+            </td>
+            <td>
+              <div v-show="commodity.currencyName.indexOf('USD')==-1 || !commodity.prices">
+                <span>—</span>
+              </div>
+              <div v-for="price in commodity.prices" v-text="price.uSDPrice"></div>
+            </td>
+            <td>
+              <div v-show="commodity.currencyName.indexOf('RMB')==-1 || !commodity.prices">
+                <span>—</span>
+              </div>
+              <div v-for="price in commodity.prices" v-text="price.rMBPrice"></div>
+            </td>
+            <td>
+              <div v-if="commodity.b2cMinDelivery">交期：{{commodity.b2cMinDelivery || 0}}-{{commodity.b2cMaxDelivery || 0}}天</div>
+            </td>
+            <td>
+              <div>
+                <button class="btn btn-primary btn-buy-now" ng-click="addToCart(commodity, true, commodity.minBuyQty, commodity.currencyName)"><span class="watch">立即购买</span></button>
+              </div>
+              <div>
+                <button class="btn btn-add-cart" ng-click="addToCart(commodity, false, commodity.minBuyQty, commodity.currencyName)"><span class="watch">加入购物车</span></button>
+              </div>
+            </td>
+          </tr>
+          <tr v-if="!commodities.content || commodities.content.length == 0">
+            <td colspan="10">
+              <div class="text-center">
+                <div class="col-xs-offset-3 col-xs-2">
+                  <img src="/images/all/empty-cart.png">
+                </div>
+                <div class="col-xs-4 txt-info">
+                  <p class="grey f16">暂无器件信息</p>
+                  <i class="iconfont">&#xe610;</i>&nbsp;<a href="javascript:history.go(-1)">返回上一页</a>
+                </div>
+              </div>
+            </td>
+          </tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+
+function getAllLeafIds (kind) {
+  if (!kind) {
+    return null
+  }
+  if (kind.isLeaf === 1) {
+    return kind.id
+  } else {
+    if (!kind.children || kind.children.length === 0) {
+      return null
+    }
+    let ids = []
+    for (let i = 0; i < kind.children.length; i++) {
+      ids.push(getAllLeafIds(kind.children[i]))
+    }
+    return ids.join('-')
+  }
+}
+
+export default {
+  name: 'commodity-list',
+  props: ['kinds'],
+  data () {
+    return {
+      defaultProps: {
+        children: 'children',
+        label: 'nameCn'
+      },
+      pageParams: {
+        page: 1,
+        count: 6
+      },
+      searchCode: '',
+      parentKindId: 0,
+      ids: null
+    }
+  },
+  computed: {
+    commodities () {
+      return this.$store.state.shop.storeInfo.storeCommodity.data
+    }
+  },
+  methods: {
+    handlerCurrentNode (data, node) {
+      this.searchCode = ''
+      if (this.parentKindId === data.id) {
+        this.parentKindId = 0
+        this.ids = null
+        console.log('取消选中状态')
+      } else {
+        if (data.level === 1) {
+          this.parentKindId = data.id
+        }
+        this.ids = getAllLeafIds(data)
+      }
+      console.log('data', data.id + '-' + data.nameCn)
+      this.pageParams.page = 1
+
+      this.pageCommodity(this.pageParams, this.ids)
+    },
+    goodsSearch (keyword) {
+      console.log(keyword)
+      this.pageParams.page = 1
+
+      this.pageCommodity(this.pageParams, this.ids, keyword)
+    },
+    async pageCommodity (pageParams, kindId, keyword) {
+      let params = { storeid: this.$route.params.uuid, origin: 'store', kindUuid: kindId, code: keyword }
+      params.page = pageParams.page
+      params.count = pageParams.count
+
+      let { data } = await this.$http.get('/api/commodity/commodities', { params })
+      this.$store.commit('shop/storeInfo/GET_STORE_COMMODITY_SUCCESS', data)
+    }
+  }
+}
+</script>
+<style scoped>
+  #goods-list-fragment{
+		font-family: "Microsoft Yahei", "微软雅黑";
+	}
+	#goods-list-fragment .category-title {
+		height: 34px;
+		background-color: #5078cb;
+		font-size: 14px;
+		color: rgb(255,255,255);
+		font-weight: 600;
+		text-align: center;
+	}
+
+	#goods-list-fragment .category-content li {
+		line-height: 33px;
+		font-size: 14px;
+		color: #333;
+		float: left;
+		width: 100%;
+		padding-left: 10px;
+	}
+
+	#goods-list-fragment .category-content li a {
+		display: block;
+		padding-left: 15px;
+		text-decoration: none;
+		color: #333;
+		/* background:url("static/img/store/default/openblackR.png") no-repeat left; */
+	}
+
+	#goods-list-fragment .category-content li a:hover{
+		color: #5078cb;
+		cursor: pointer;
+	}
+
+	#goods-list-fragment .category-content ul.list-body {
+		display: none;
+		color: #666;
+	}
+
+	#goods-list-fragment .category-content ul.list-body.active {
+		display: block;
+	}
+
+	#goods-list-fragment .category-content ul.list-body li {
+		float: none;
+		background-image: none;
+		min-height: 26px;
+		line-height: 26px;
+		font-size: 12px;
+	}
+
+	#goods-list-fragment .category-content ul.list-body li a {
+		padding-left: 15px;
+		display: block;
+		color: rgb(50,50,50);
+		background: none;
+	}
+
+	#goods-list-fragment .category-content ul.list-body li a:hover {
+		color: #5078cb;
+		cursor: pointer;
+	}
+
+	#goods-list-fragment .category-content ul.list-body li a.cur {
+		text-decoration: none;
+		font-size: 14px;
+		/* background:url("static/img/store/default/openblackR.png") no-repeat left; */
+	}
+
+	#goods-list-fragment .title-area {
+		margin-bottom: 30px;
+		width: 200px;
+		float: left;
+	}
+	#goods-list-fragment .category-content{
+		border: 1px solid #e8e8e8;
+	}
+	/* goods-area */
+	#goods-list-fragment .goods-area {
+		margin-left: 20px;
+		float: left;
+		margin-bottom: 30px;
+	}
+
+	#goods-list-fragment .goods-area .btn-line {
+		border-radius: 0;
+	}
+
+
+	#goods-list-fragment .btn-info.btn-line {
+		background-color: #5078CB;
+		color: #fff;
+		font-weight: 600;
+	}
+
+	#goods-list-fragment .btn-line {
+		height: 34px;
+		width: 150px;
+		border: 1px solid #5078cb;
+		background-color: #fff;
+		color: rgb(80,120,203);
+		font-weight: 600;
+	}
+
+	#goods-list-fragment .btn-line:hover {
+		background-color: #5078CB;
+		color: #fff;
+	}
+
+	/* 物品列表 */
+	#goods-list-fragment .goodslist .brand-code {
+		font-size: 14px;
+		text-align: center;
+	}
+
+	#goods-list-fragment #search_btn {
+		background: #5078CB;
+		color: #FFFFFF;
+	}
+
+	#goods-list-fragment #search_input {
+		font-size: 14px;
+	}
+
+	#goods-list-fragment .brand-code .code {
+		font-weight: 600;
+	}
+
+	#goods-list-fragment .goodslist th {
+		color: rgb(50,50,50);
+		font-size: 14px;
+		font-weight: 600;
+		background-color: #f7f7f7;
+		text-align: center;
+	}
+
+	#goods-list-fragment .category-content a.selected-node,
+	#goods-list-fragment .category-content ul.list-body li a.selected-node {
+		color: #5078cb;
+	}
+
+	#goods-list-fragment .category-content a.selected-parent-node,
+	#goods-list-fragment .category-content ul.list-body li a.selected-parent-node {
+		/* background:url("static/img/store/default/openblack.png") no-repeat left; */
+	}
+
+	#goods-list-fragment .goodslist tbody>tr {
+		border: 1px solid #e8e8e8;
+	}
+	#goods-list-fragment .goodslist tbody>tr td.commodity-icon .img{
+		border: 1px solid #e8e8e8;
+		margin: 10px;
+		width: 80px;
+		height: 80px;
+		overflow: hidden;
+		line-height: 75px;
+	}
+	#goods-list-fragment .goodslist tbody>tr td.commodity-icon .img>img {
+		width: 80px;
+		height: 80px;
+	}
+	#goods-list-fragment .goodslist td {
+		font-size: 12px;
+		color: #333;
+		text-align: center;
+		line-height: 20px;
+	}
+
+	/* 物品列表按钮 */
+	#goods-list-fragment .btn-buy-now {
+		background-color: #5078CB;
+		color: #fff;
+		width: 80px;
+		height: 30px;
+		font-size: 12px;
+		border: 1px solid #5078cb;
+	}
+
+	#goods-list-fragment .btn-add-cart {
+		margin-top: 10px;
+		color: #214797;
+		width: 80px;
+		height: 30px;
+		font-size: 12px;
+		background-color: #fff;
+		border: 1px solid #e8e8e8;
+	}
+	#goods-list-fragment .btn-buy-now:hover{
+		background: #214797;
+	}
+	#goods-list-fragment .btn-add-cart:hover{
+		background-color: #5078CB;
+		color: #fff;
+	}
+	.category-content{
+		min-height: 243px;
+	}
+	.no-record{
+		font-size: 14px;
+		color: #999;
+		text-align: center;
+		line-height: 200px;
+	}
+	.no-record i{
+		margin-right: 5px;
+	}
+	.text-center{
+		text-align: center;
+		margin-top: 30px;
+	}
+	.text-center  .col-xs-2  img{
+		margin: 50px 0 50px 95px;
+		vertical-align: middle;
+	}
+	.text-center .txt-info{
+		font-size: 14px;
+		margin-top: 70px;
+	}
+	.text-center  .col-xs-4  p{
+		color: #999;
+		margin-top: 3px;
+		margin-bottom: 2px;
+	}
+	.text-center  .txt-info a{
+		font-size: 14px;
+	}
+	.text-center  .col-xs-4 i{
+		color: #5078cb;
+		font-size: 14px;
+	}
+	.goodslist{
+		margin-bottom: 16px;
+	}
+
+	@font-face {
+    font-family: 'iconfont';  /* project id 357960 */
+    src: url('//at.alicdn.com/t/font_27kjyd082ezpk3xr.eot');
+    src: url('//at.alicdn.com/t/font_27kjyd082ezpk3xr.eot?#iefix') format('embedded-opentype'),
+    url('//at.alicdn.com/t/font_27kjyd082ezpk3xr.woff') format('woff'),
+    url('//at.alicdn.com/t/font_27kjyd082ezpk3xr.ttf') format('truetype'),
+    url('//at.alicdn.com/t/font_27kjyd082ezpk3xr.svg#iconfont') format('svg');
+  }
+</style>

components/store/RecommendProduct.vue

@@ -0,0 +1,209 @@
+<template>
+  <div id="recommend-fragment" v-if="commodities && commodities.length > 0">
+    <div class="recommend-list">
+      <ul>
+        <li ng-repeat="commodity in commodities">
+          <div class="img"><a href="javascript:void(0);"><img ng-src="commodity.comImg"/></a></div>
+          <div class="content">
+            <p ng-bind="commodity.comCode">MRFE6S9045NF001</p>
+            <p class="color666" ng-bind="commodity.brandNameCn">PANFAEFQ</p>
+            <p class="price" ng-if="commodity.minPriceRMB">¥ commodity.minPriceRMB</p>
+            <p class="price" ng-if="!commodity.minPriceRMB">$ commodity.minPriceUSD || 0</p>
+          </div>
+          <div class="hover-show" ng-href="commodity.batchCode ? 'store/' + storeInfo.uuid + '#/batchInfo/' + commodity.batchCode : ''">
+            <a ng-href="commodity.batchCode ? 'store/' + storeInfo.uuid + '#/batchInfo/' + commodity.batchCode : ''" class="href">
+              <div class="title" ng-bind="commodity.comCode">MRFE6S9045NF001</div>
+              <div class="type" ng-bind="commodity.brandNameCn">PANFAEFQ</div>
+              <div class="hr"><span>抢购价</span></div>
+              <div class="price" ng-if="commodity.minPriceRMB">¥ commodity.minPriceRMB</div>
+              <div class="price" ng-if="!commodity.minPriceRMB">$ commodity.minPriceUSD || 0</div>
+            </a>
+            <div class="by-cart"><button title="加入购物车" ng-click="addToCart(commodity, false, commodity.minBuyQty, commodity.currency)"><img src="static/img/icon/cart-blue.png"/></button></div>
+            <div class="buy-now"><button title="立即购买" ng-click="addToCart(commodity, true, commodity.minBuyQty, commodity.currency)">立即购买</button></div>
+          </div>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+<script>
+
+export default {
+  name: 'recommend-product',
+  computed: {
+    commodities () {
+      return this.$store.state.shop.recommend.products.data
+    }
+  }
+}
+</script>
+<style scoped>
+  #recommend-fragment{
+		width: 1190px;
+		margin: 0 auto;
+	}
+	.recommend-list{
+		width: 100%;
+		margin: 0 auto;
+		display: inline-block;
+	}
+	#recommend-fragment ul{
+		width: 100%;
+		margin: 0 auto;
+		display: inline-block;
+		-webkit-padding-start: 0;
+	}
+	#recommend-fragment ul li{
+		float: left;
+		width: 218px;
+		height: 260px;
+		border: #d2d2d2 1px solid;
+		position: relative;
+		overflow: hidden;
+		margin-right: 25px;
+		margin-bottom: 20px;
+	}
+	#recommend-fragment ul li:nth-child(5n){
+		margin-right: 0;
+	}
+	#recommend-fragment ul li .img{
+		height: 175px;
+		text-align: center;
+		line-height: 170px;
+	}
+	#recommend-fragment ul li .img img{
+		max-width: 120px;
+		max-height: 120px;
+	}
+	#recommend-fragment ul li .content{
+		width: 100%;
+		margin: 0 auto;
+	}
+	#recommend-fragment ul li .content p{
+		width: 90%;
+		display: inline-block;
+		line-height: 22px;
+		font-size: 14px;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		margin-bottom: 0;
+		padding-left: 10px;
+	}
+	#recommend-fragment ul li .content p.price{
+		color: #ff9000;
+		font-size: 16px;
+		font-weight: bold;
+	}
+	.color666{
+		color: #666;
+	}
+	#recommend-fragment ul li .hover-show{
+		width: 100%;
+		height: 100%;
+		position: absolute;
+		top: 100%;
+		left: 0;
+		background: rgba(80,120,203,.85);
+		padding: 30px 10px;
+	}
+	#recommend-fragment ul li:hover .hover-show{
+		top: 0;
+		transition: top .5s ease-in;
+	}
+	#recommend-fragment ul li .hover-show div{
+		width: 100%;
+		margin: 0 auto;
+		text-align: left;
+		color: #fff;
+		line-height: 25px;
+	}
+	#recommend-fragment ul li .hover-show .title{
+		font-size: 18px;
+		margin-top: 8px;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		overflow: hidden;
+		margin-bottom: 0;
+	}
+	#recommend-fragment ul li .hover-show .type{
+		font-size: 14px;
+	}
+	#recommend-fragment ul li .hover-show .hr{
+		text-align: center;
+		margin-top: 5px;
+	}
+	#recommend-fragment ul li .hover-show .hr span{
+		font-size: 16px;
+		position: relative;
+	}
+	#recommend-fragment ul li .hover-show .hr span:before,#recommend-fragment ul li .hover-show .hr span:after{
+		content: '';
+		position: absolute;
+		display: inline-block;
+		width: 65px;
+		height: 1px;
+		background: #fff;
+		top: 10px;
+	}
+	#recommend-fragment ul li .hover-show .hr span:before{
+		left: 53px;
+	}
+	#recommend-fragment ul li .hover-show .hr span:after{
+		right: 53px;
+	}
+	#recommend-fragment ul li .hover-show .price{
+		font-size: 20px;
+		text-align: center;
+		line-height: 48px;
+	}
+	#recommend-fragment ul li .hover-show .by-cart,#recommend-fragment ul li .hover-show .buy-now{
+		text-align: center;
+		position: absolute;
+	}
+	#recommend-fragment ul li .hover-show .by-cart{
+		bottom: 50px;
+	}
+	#recommend-fragment ul li .hover-show .buy-now{
+		bottom: 15px;
+	}
+	#recommend-fragment ul li .hover-show .by-cart button{
+		display: inline-block;
+		width: 38px;
+		height: 38px;
+		border-radius: 100%;
+		background: #fff;
+		line-height: 38px;
+		margin-bottom: 5px;
+		cursor: pointer;
+		border: none;
+		z-index: 100;
+		position: relative;
+	}
+	#recommend-fragment ul li .hover-show .buy-now button{
+		display: inline-block;
+		width: 90px;
+		height: 34px;
+		text-align: center;
+		font-size: 14px;
+		border-radius: 4px;
+		background: #df1b0f;
+		line-height: 34px;
+		color: #fff;
+		cursor: pointer;
+		border: none;
+		z-index: 100;
+		position: relative;
+	}
+	#recommend-fragment ul li .hover-show .buy-now button:hover{
+		background: #f00;
+	}
+	#recommend-fragment ul li a.href{
+		display: inline-block;
+		position: relative;
+		z-index: 10;
+		width: 100%;
+		text-align: center;
+		height: 260px;
+	}
+</style>

components/store/index.js

@@ -3,5 +3,7 @@ import StoreTitle from './StoreTitle.vue'
 import BaseInfo from './BaseInfo.vue'
 import ComponentInfo from './ComponentInfo.vue'
 import CommodityInfo from './CommodityInfo.vue'
+import CommodityList from './CommodityList.vue'
+import RecommendProduct from './RecommendProduct.vue'
 
-export { StoreHeader, StoreTitle, BaseInfo, ComponentInfo, CommodityInfo }
+export { StoreHeader, StoreTitle, BaseInfo, ComponentInfo, CommodityInfo, CommodityList, RecommendProduct }

nuxt.config.js

@@ -94,8 +94,7 @@ module.exports = {
     src: '~plugins/vue-empty.js',
     ssr: false
   }, {
-    src: '~plugins/element-ui.js',
-    ssr: false
+    src: '~plugins/element-ui.js'
   }],
   proxyTable: ['/api/**', '/search/**', '/user/**', '/login/**', '/logout/**']
 }

pages/help/helpDetail/_id.vue

@@ -0,0 +1,74 @@
+<template>
+  <div>
+    <help-header></help-header>
+  <div id="main">
+    <div class="container" style="padding: 0; width: 1190px;">
+      <div style="display: inline-block; width: 100%; margin: 0 auto">
+        <div class="left">
+          <left></left>
+        </div>
+        <div class="right">
+          <div class="help-center">
+            <div class="help-head"><img src="/images/help/help-title.png"></div>
+            <div class="help-center-title">
+              <a v-bind:href="'/help/home'" style="font-size: 14px">帮助中心首页<i class="fa fa-angle-right"></i></a>
+              <span>
+              <nuxt-link :to="`/help/home`" class="box" style="font-size: 16px">
+                <span>{{helpTitle.item}}</span><i class="fa fa-close"></i></nuxt-link>
+                <i class="dot fa fa-angle-right"></i>
+              </span>
+              <nuxt-link :to="`/help/helpList/{$helpDetail.navId}`" class="box" style="font-size: 14px"><span v-text="helpDetail.title"></span><i class="fa fa-close"></i></nuxt-link>
+            </div>
+            <!--文章详情-->
+            <div class="help-center-details" style="color: #000">
+              <div class="ql-container ql-snow" v-html="helpDetail.article"></div>
+              <div v-if="helpDetail.length == 0" style="color: #999;">暂无数据！</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    </div>
+</div>
+</template>
+<script>
+  import { left, helpHeader } from '~components/help'
+  export default {
+    name: 'help',
+    components: {
+      left,
+      helpHeader
+    },
+    fetch ({ store, route }) {
+      console.log(route.params)
+      return Promise.all([
+        store.dispatch('loadHelpSnapsho', { parentId: 0 }),
+        store.dispatch('loadHelpDetail', route.params)
+        // store.dispatch('loadHelpTitle', route)
+      ])
+    },
+    computed: {
+      helpTitle () {
+        return this.$store.state.help.title.data
+      },
+      helpDetail () {
+        return this.$store.state.help.detail.data
+      }
+    }
+  }
+</script>
+<style>
+  @import '~assets/scss/help.css';
+  .help-center-details .ql-container img {
+    max-width: 840px;
+  }
+  .ql-container.ql-snow{
+    border: none;
+  }
+  .ql-container.ql-snow p{
+    font-size: 16px;
+  }
+  .ql-container.ql-snow .ql-editor{
+    padding: 0;
+  }
+</style>

pages/help/helpList/_id.vue

@@ -0,0 +1,65 @@
+<template>
+  <div>
+    <help-header></help-header>
+  <div id="main">
+    <div class="container" style="padding: 0; width: 1190px;">
+      <div style="display: inline-block; width: 100%; margin: 0 auto">
+        <div class="left">
+          <left></left>
+        </div>
+        <div class="right">
+          <div class="help-center">
+            <div class="help-head"><img src="/images/help/help-title.png"></div>
+            <div class="help-center-title">
+              <a v-bind:href="'/help/home'" style="font-size: 14px">帮助中心首页<i class="fa fa-angle-right"></i></a>
+              <span>
+                <nuxt-link :to="`/help/home`" class="box" style="font-size: 16px"><span>{{helpTitle.item}}</span><i class="fa fa-close"></i></nuxt-link>
+              </span>
+            </div>
+            <!-- 文章列表-->
+            <div class="help-center-list">
+              <h4>问题知识列表</h4>
+              <ul>
+                <li v-for="list in helpList">
+                  <em></em>
+                  <nuxt-link :to="`/help/helpDetail/${list.num}`" v-text="list.title" :title="list.title"></nuxt-link>
+                </li>
+                <li v-if="helpList.length == 0" style="color: #999;">暂无数据！</li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+</template>
+<script>
+  import { left, helpHeader } from '~components/help'
+  export default {
+    name: 'help',
+    components: {
+      left,
+      helpHeader
+    },
+    fetch ({ store, route }) {
+      console.log(route.params)
+      return Promise.all([
+        store.dispatch('loadHelpSnapsho', { parentId: 0 }),
+        store.dispatch('loadHelpList', { navId: route.params.id }),
+        store.dispatch('loadHelpTitle', route.params)
+      ])
+    },
+    computed: {
+      helpTitle () {
+        return this.$store.state.help.title.data
+      },
+      helpList () {
+        return this.$store.state.help.helplist.data
+      }
+    }
+  }
+</script>
+<style>
+  @import '~assets/scss/help.css';
+</style>

pages/help/home.vue

@@ -0,0 +1,55 @@
+<template>
+  <div>
+    <help-header></help-header>
+  <div id="main">
+    <div class="container" style="padding: 0; width: 1190px;">
+      <div style="display: inline-block; width: 100%; margin: 0 auto">
+        <div class="left">
+          <left></left>
+        </div>
+        <div class="right">
+          <div class="help-center">
+            <div class="help-head"><img src="/images/help/help-title.png"></div>
+            <div class="help-center-title">
+              <a style="font-size: 14px" v-bind:href="'/help/home'">帮助中心首页</a>
+            </div>
+            <div class="help-center-home">
+              <div v-for="nav01 in helpNav">
+                <h4 v-text="nav01.item"></h4>
+                <div class="row">
+                  <div v-for="nav02 in nav01.children">
+                    <em></em><nuxt-link :to="`/help/helpList/${nav02.id}`" v-text="nav02.item"></nuxt-link>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  </div>
+</template>
+<script>
+  import { left, helpHeader } from '~components/help'
+  export default {
+    name: 'help',
+    components: {
+      left,
+      helpHeader
+    },
+    fetch ({ store }) {
+      return Promise.all([
+        store.dispatch('loadHelpSnapsho', { parentId: 0 })
+      ])
+    },
+    computed: {
+      helpNav () {
+        return this.$store.state.help.snapsho.data
+      }
+    }
+  }
+</script>
+<style>
+  @import '~assets/scss/help.css';
+</style>

pages/store/_uuid/_batchCode.vue

@@ -9,17 +9,6 @@ import { ComponentInfo, CommodityInfo } from '~components/store'
 
 export default {
   layout: 'shop',
-  data () {
-    return {
-      uuid: this.$route.params.uuid,
-      batchCode: this.$route.params.batchCode,
-      breadcrumbs: [
-        { name: '商城首页', to: {} },
-        { name: '商城首页', to: {} },
-        { name: '商城首页', to: {} }
-      ]
-    }
-  },
   fetch ({ store, route }) {
     return Promise.all([
       store.dispatch('shop/findStoreInfoFromUuid', route.params),

pages/store/_uuid/index.vue

@@ -1,9 +1,12 @@
 <template>
   <div class="container">
-    <span style="font-size: 24px;">{{uuid}}</span>
+    <recommend-product/>
+    <commodity-list :kinds="kinds"/>
   </div>
 </template>
 <script>
+import axios from '~plugins/axios'
+import { CommodityList, RecommendProduct } from '~components/store'
 
 export default {
   layout: 'shop',
@@ -12,10 +15,20 @@ export default {
       uuid: this.$route.params.uuid
     }
   },
-  fetch ({ store, route }) {
+  fetch ({ store, params }) {
     return Promise.all([
-      store.dispatch('shop/findStoreInfoFromUuid', route.params)
+      store.dispatch('shop/findStoreInfoFromUuid', params),
+      store.dispatch('shop/findRecommendProducts', params),
+      store.dispatch('shop/pageCommoditiesOfStore', params.uuid, { page: 1, count: 6 })
     ])
+  },
+  async asyncData ({ params }) {
+    let { data } = await axios.get('/api/commodity/components/kinds', { params: { StoreUuid: params.uuid } })
+    return { kinds: data }
+  },
+  components: {
+    RecommendProduct,
+    CommodityList
   }
 }
 </script>

plugins/element-ui.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
-import { Breadcrumb, BreadcrumbItem } from 'element-ui'
+import { Breadcrumb, BreadcrumbItem, Tree } from 'element-ui'
 
 Vue.use(Breadcrumb)
 Vue.use(BreadcrumbItem)
+Vue.use(Tree)

store/help.js

@@ -0,0 +1,61 @@
+export const state = () => ({
+  snapsho: {
+    fetching: false,
+    data: []
+  },
+  helplist: {
+    fetching: false,
+    data: []
+  },
+  detail: {
+    fetching: false,
+    data: []
+  },
+  title: {
+    fetching: false,
+    data: []
+  }
+})
+
+export const mutations = {
+  REQUEST_SNAPSHO (state) {
+    state.snapsho.fetching = true
+  },
+  GET_SNAPSHO_FAILURE (state) {
+    state.snapsho.fetching = false
+  },
+  GET_SNAPSHO_SUCCESS (state, result) {
+    state.snapsho.fetching = false
+    state.snapsho.data = result
+  },
+  REQUEST_HELPLIST (state) {
+    state.helplist.fetching = true
+  },
+  GET_HELPLIST_FAILURE (state) {
+    state.helplist.fetching = false
+  },
+  GET_HELPLIST_SUCCESS (state, result) {
+    state.helplist.fetching = false
+    state.helplist.data = result
+  },
+  REQUEST_DETAIL (state) {
+    state.detail.fetching = true
+  },
+  GET_DETAIL_FAILURE (state) {
+    state.detail.fetching = false
+  },
+  GET_DETAIL_SUCCESS (state, result) {
+    state.detail.fetching = false
+    state.detail.data = result
+  },
+  REQUEST_TITLE (state) {
+    state.title.fetching = true
+  },
+  GET_TITLE_FAILURE (state) {
+    state.title.fetching = false
+  },
+  GET_TITLE_SUCCESS (state, result) {
+    state.title.fetching = false
+    state.title.data = result
+  }
+}

store/help/help.js

@@ -0,0 +1,14 @@
+import axios from '~plugins/axios'
+
+export const actions = {
+  // 获取帮助中心信息
+  loadHelpSnapsho ({ commit }, params = {}) {
+    commit('help/option/REQUEST_SNAPSHO')
+    return axios.get('api/help-service/helps', {params})
+      .then(response => {
+        commit('help/option/GET_SNAPSHO_SUCCESS', response.data)
+      }, err => {
+        commit('help/option/GET_SNAPSHO_FAILURE', err)
+      })
+  }
+}

store/help/option.js

@@ -0,0 +1,23 @@
+export const state = () => ({
+  snapshot: {
+    fetching: false,
+    data: []
+  },
+  detail: {
+    fetching: false,
+    data: []
+  }
+})
+
+export const mutations = {
+  REQUEST_SNAPSHO (state) {
+    state.snapsho.fetching = true
+  },
+  GET_SNAPSHO_FAILURE (state) {
+    state.snapsho.fetching = false
+  },
+  GET_SNAPSHO_SUCCESS (state, result) {
+    state.snapsho.fetching = false
+    state.snapsho.data = result
+  }
+}

store/index.js

@@ -1,4 +1,4 @@
-import axios from '~plugins/axios'
+import axios from '~plugins/axios'
 
 export const actions = {
   // 全局服务初始化
@@ -82,6 +82,38 @@ export const actions = {
         commit('news/GET_SNAPSHOT_FAILURE', err)
       })
   },
+  // 获取快讯页新闻
+  loadAllNews ({ commit }, params = {}) {
+    commit('newsPage/REQUEST_ALLNEWS')
+    return axios.get('/api/news/created', {params})
+      .then(response => {
+        commit('newsPage/GET_ALLNEWS_SUCCESS', response.data)
+      }, err => {
+        commit('newsPage/GET_ALLNEWS_FAILURE', err)
+      })
+  },
+  // 获取详细新闻
+  loadDetailNews ({ commit }, params = {}) {
+    console.log(params.id)
+    let id = params.id
+    commit('detailNews/REQUEST_DETAILNEWS', params)
+    return axios.get(`/api/news/${id}`)
+      .then(response => {
+        commit('detailNews/GET_DETAILNEWS_SUCCESS', response.data)
+      }, err => {
+        commit('detailNews/GET_DETAILNEWS_FAILURE', err)
+      })
+  },
+  // 获取热点新闻
+  loadHotNews ({ commit }, params = {}) {
+    commit('hotNews/REQUEST_HOTNEWS')
+    return axios.get('/api/news/viewCount', {params})
+      .then(response => {
+        commit('hotNews/GET_HOTNEWS_SUCCESS', response.data)
+      }, err => {
+        commit('hotNews/GET_HOTNEWS_FAILURE', err)
+      })
+  },
   // 获取器件统计信息
   loadProductCounts ({ commit }, params = {}) {
     commit('product/common/REQUEST_COUNTS')

store/shop.js

@@ -27,5 +27,28 @@ export const actions = {
       }, err => {
         commit('storeInfo/GET_COMMODITY_FAILURE', err)
       })
+  },
+  findRecommendProducts ({ commit }, params = {}) {
+    params.condition = 'store_uuid'
+    commit('recommend/REQUEST_PRODUCTS')
+    return axios.get('/api/recommend/products', { params })
+      .then(response => {
+        commit('recommend/GET_PRODUCTS_SUCCESS', response.data)
+      }, err => {
+        commit('recommend/GET_PRODUCTS_FAILURE', err)
+      })
+  },
+  pageCommoditiesOfStore ({ commit }, uuid = '', pageParams = { page: 1, count: 6 }, code) {
+    let params = { storeid: uuid, origin: 'store', code: code }
+    params.page = pageParams.page
+    params.count = pageParams.count
+    console.log(1)
+    commit('storeInfo/REQUEST_STORE_COMMODITY')
+    return axios.get('/api/commodity/commodities', { params })
+      .then(response => {
+        commit('storeInfo/GET_STORE_COMMODITY_SUCCESS', response.data)
+      }, err => {
+        commit('storeInfo/GET_STORE_COMMODITY_FAILURE', err)
+      })
   }
 }

store/shop/recommend.js

@@ -0,0 +1,22 @@
+/**
+ * 店铺推荐信息
+ */
+export const state = () => ({
+  products: {
+    fetching: false,
+    data: []
+  }
+})
+
+export const mutations = {
+  REQUEST_PRODUCTS (state) {
+    state.products.fetching = true
+  },
+  GET_PRODUCTS_FAILURE (state) {
+    state.products.fetching = false
+  },
+  GET_PRODUCTS_SUCCESS (state, result = []) {
+    state.products.fetching = false
+    state.products.data = result
+  }
+}

store/shop/storeInfo.js

@@ -13,6 +13,10 @@ export const state = () => ({
   component: {
     fetching: false,
     data: {}
+  },
+  storeCommodity: {
+    fetching: false,
+    data: {}
   }
 })
 
@@ -46,5 +50,15 @@ export const mutations = {
   GET_COMPONENT_SUCCESS (state, result = {}) {
     state.component.fetching = false
     state.component.data = result
+  },
+  REQUEST_STORE_COMMODITY (state) {
+    state.storeCommodity.fetching = true
+  },
+  GET_STORE_COMMODITY_FAILURE (state) {
+    state.storeCommodity.fetching = false
+  },
+  GET_STORE_COMMODITY_SUCCESS (state, result = {}) {
+    state.storeCommodity.fetching = false
+    state.storeCommodity.data = result
   }
 }