Merge branch 'ren' into develop

src/pages/home/home-page.vue

@@ -2,12 +2,12 @@
    * @Descrip: 主页
  * @Author: your name
  * @Date: 2019-10-10 14:25:15
- * @LastEditTime: 2019-10-15 15:02:01
+ * @LastEditTime: 2019-10-16 12:35:28
  * @LastEditors: Please set LastEditors
    -->
 <template>
   <h-view id="homePage" class="public-style" title="徐工租赁">
-    <h-header :proportion="[7,8,0]" class="bar-custom">
+    <h-header :proportion="[7,9,0]" class="bar-custom">
       <div slot="left" class="h-header-btn">
         <!-- <i class="ion-ios-arrow-back" /> -->
         <img class="locations" src="@/assets/homePage/location.png" alt="" @click="location">

src/pages/productQuery/product-detailed.vue

 <!--
-   * @Descrip: 查询首页
+   * @Descrip: 产品明细
  * @Author: your name
  * @Date: 2019-10-15 14:30:00
- * @LastEditTime: 2019-10-16 09:26:38
+ * @LastEditTime: 2019-10-16 11:15:35
  * @LastEditors: Please set LastEditors
    -->
 <template>
-  <h-view id="query" class="public-style" title="产品查询">
+  <h-view id="detailed" class="public-style" title="产品查询">
     <h-header :proportion="[5,1,1]" class="bar-custom">
       <div slot="left" class="h-header-btn">
         <img src="@/assets/userBind/arrow.png" @click="$routeGo()">
@@ -14,7 +14,88 @@
       </div>
     </h-header>
     <Tab @getTabNum="getTabNum" />
-    <h-content/>
+    <h-content v-if="tabNum === 0">
+      <list-item :item-height="44" class="second-part">
+        <item>
+          <div slot="name" class="font-color">经销商</div>
+          <span slot="content"> xxx经销商 </span>
+        </item>
+        <item>
+          <div slot="name" class="font-color">主机厂</div>
+          <span slot="content"> ****主机厂 </span>
+        </item>
+      </list-item>
+      <div class="equipment-list">经销商信息</div>
+      <list-item :item-height="44" class="second-part">
+        <item>
+          <div slot="name" class="font-color">经销商所在省份</div>
+          <span slot="content"> 江苏徐州 </span>
+        </item>
+        <item>
+          <div slot="name" class="font-color">经销商地址</div>
+          <span slot="content"> 江苏省徐州市 </span>
+        </item>
+        <item>
+          <div slot="name" class="font-color">电话号码</div>
+          <span slot="content"> 15768097665 </span>
+        </item>
+      </list-item>
+      <div class="equipment-list">产品信息</div>
+      <list-item :item-height="44" class="second-part">
+        <item>
+          <div slot="name" class="font-color">参数项</div>
+          <span slot="content"> GTZ226 </span>
+        </item>
+        <item>
+          <div slot="name" class="font-color">产品线</div>
+          <span slot="content"> 塔式起重机 </span>
+        </item>
+        <item>
+          <div slot="name" class="font-color">产品名称</div>
+          <span slot="content"> GTZ389起重机 </span>
+        </item>
+        <item>
+          <div slot="name" class="font-color">产品参考价</div>
+          <span slot="content"> 350,000.00 </span>
+        </item>
+        <item>
+          <div slot="name" class="font-color">价格有效期</div>
+          <span slot="content"> 2019-04-02 </span>
+        </item>
+      </list-item>
+    </h-content>
+    <h-content v-if="tabNum === 1">
+      <list-item :item-height="44" class="second-part">
+        <item>
+          <div slot="name" class="font-color">经销商</div>
+          <span slot="content"> xxx经销商 </span>
+        </item>
+        <item>
+          <div slot="name" class="font-color">主机厂</div>
+          <span slot="content"> ****主机厂 </span>
+        </item>
+      </list-item>
+    </h-content>
+    <h-content v-if="tabNum === 2">
+      <list-item :item-height="44" class="second-part">
+        <item>
+          <div slot="name" class="font-color">经销商</div>
+          <span slot="content"> xxx经销商 </span>
+        </item>
+        <item>
+          <div slot="name" class="font-color">主机厂</div>
+          <span slot="content"> ****主机厂 </span>
+        </item>
+      </list-item>
+    </h-content>
+    <bottom-tab class="footer-button">
+      <tab-button :class="{bgcolor: bgc_flag}" class="butt"><img src="@/assets/productQuery/trial.png" alt=""> 试算</tab-button>
+      <tab-button class="collect butt" @click.native="collect"><img :src="src" alt="">收藏</tab-button>
+    </bottom-tab>
+    <div v-if="collect_flag" class="show-collect">
+      <img src="@/assets/productQuery/success.png" alt="">
+      <p>收藏成功</p>
+    </div>
   </h-view>
 </template>
 
@@ -28,6 +109,9 @@ export default {
   data () {
     return {
       tabNum: 0,
+      bgc_flag: true,
+      collect_flag: false,
+      src: require('@/assets/productQuery/collect.png'),
     }
   },
   computed: {},
@@ -38,11 +122,19 @@ export default {
      console.log(i)
      this.tabNum = i
    },
+   collect () {
+     this.collect_flag = true
+     console.log(this.collect_flag)
+     setTimeout(() => {
+       this.collect_flag = false
+       this.src = require('@/assets/productQuery/coll-success.png')
+     }, 1500)
+   },
  },
 }
 </script>
 <style lang='less' scoped>
-#query {
+#detailed {
   .h-header-btn {
       img {
         width: 16px;
@@ -58,102 +150,91 @@ export default {
         line-height: 24px;
       }
     }
-    .hinput {
-      position: relative;
-      z-index: 50;
-      width: 100%;
-      height: 50px;
-      //border-bottom: 1px solid #cccccc70;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      background: #fff;
-      .search-box {
-        width: 93.6%;
-        height: 36px;
+  .second-part {
+    .font-color {
+    font-family: PingFangSC-Regular;
     font-size: 14px;
-        color: #B4B4B5;
+    color: #656464;
     letter-spacing: 0;
-        font-family: PingFangSC-Regular;
-        border: 1px solid rgba(56, 63, 69, 0.60);
-        border-radius: 4px;
-        display: flex;
-        flex-direction: row;
-        justify-content: center;
-        align-items: center;
-
-        input {
-          width: 90%;
-          height: 100%;
-          opacity: 0.4;
-          border: none;
-          line-height: 34px;
     }
+    span {
+      font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: rgba(56,63,69,0.60);
+      letter-spacing: 0;
     }
   }
-    .box {
+.equipment-list {
+      height: 40px;
+      line-height: 40px;
+      background-color: #fafafa;
+      color: #00469c;
+      font-size: 15px;
+      margin-left: 16px;
       position: relative;
-        width: 100%;
-        height: 79px;
-        background: #fff;
-        border-top: 1px solid #cccccc70;
-        margin-bottom: 8px;
-        .first {
+      margin-top: -10px;
+}
+.equipment-list::before {
+      content: "";
+      display: block;
+      width: 4px;
       height: 20px;
-            width: 100%;
-            display: flex;
-            flex-direction: row;
-            margin-top: 16px;
-            img {
-                width: 16px;
-                height: 16px;
-                margin-left: 16px;
-            }
-            .product-class {
-                font-family: PingFangSC-Regular;
-                font-size: 14px;
-                color: rgba(56,63,69,0.60);
-                margin-left: 8px;
+      background-color: #00469c;
+      position: absolute;
+      left: -15px;
+      top: 10px;
+}
+.footer-button {
+  .butt {
+    width: 48%;
+    margin-left: 3px;
+    border: 1px solid #00469C;
+    border-radius: 4px;
   }
-            .product {
-                font-family: PingFangSC-Regular;
-                font-size: 14px;
-                color: #383F45;
-                margin-left: 16px
+  img {
+    height: 19px;
+    width: 19px;
+    margin-top: 2px;
+    margin-right: 3px;
   }
+  .collect {
+    color: #00469C;
   }
-        .second {
-            height: 20px;
-            width: 100%;
+}
+.bgcolor {
+  background: #00469C;
+  border: 1px solid #00469C;
+  border-radius: 4px;
+  font-family: PingFangSC-Semibold;
+  color: #FFFFFF;
+}
+.show-collect {
+  width: 240px;
+  height: 100px;
+  opacity: 0.7;
+  background: #383F45;
+  border-radius: 4px;
+  position: fixed;
+    top: 0px;
+    left: 0px;
+    right: 0px;
+    bottom: 0px;
+    margin: auto;
     display: flex;
     flex-direction: row;
-            margin-top: 7px;
-            .product-class {
-                font-family: PingFangSC-Regular;
-                font-size: 14px;
-                color: rgba(56,63,69,0.60);
-                margin-left: 54px;
-            }
-            .product {
-                font-family: PingFangSC-Regular;
-                font-size: 14px;
-                color: #383F45;
-                margin-left: 16px
+    align-items: center;
+    justify-content: center;
+    p {
+      font-family: PingFangSC-Semibold;
+      font-size: 16px;
+      color: #FFFFFF;
+      margin-left: 8px;
     }
     img {
       width: 16px;
       height: 16px;
-                margin-left: 9px;
-            }
-        }
-        .arrow {
-            position: absolute;
-            top: 50%;
-            margin-top: -8px;
-            right: 20px;
-            height: 16px;
-            width: 16px;
-        }
+      margin-left: -4px;
     }
 }
+}
 </style>

src/router/index.js

@@ -2,7 +2,7 @@
  * @Description: In User Settings Edit
  * @Author: your name
  * @Date: 2019-09-24 12:34:06
- * @LastEditTime: 2019-10-16 09:29:11
+ * @LastEditTime: 2019-10-16 10:09:23
  * @LastEditors: Please set LastEditors
  */
 import Vue from 'vue'
@@ -169,7 +169,7 @@ export default new Router({
     {path: '/margin-pay-entry', component: MarginPayEntry, name: 'MarginPayEntry', meta: {keepAlive: true}},
     // 产品查询
     {path: '/query-home', component: QueryHome, name: 'QueryHome', meta: {keepAlive: true}},
-    {path: '/product-detailed', component: ProDetailed, name: 'ProDetailed', meta: {keepAlive: true}},
+    {path: '/product-detailed', component: ProDetailed, name: 'ProDetailed', meta: {keepAlive: false}},
   ],
   scrollBehavior (to, from, savedPosition) {
     if (to.hash) {