zyh5

src/store/modules/xianhuo/xianhuo.js

@@ -5,6 +5,7 @@ import {
 } from '../../../api/index'
 
 var qs = require('qs');
+import Util from '../../../util/index'
 
 const state = {
   zyFilter: false,
@@ -45,7 +46,10 @@ const actions = {
     if(p == 1){
       state.zyData = [];
     }
-    Services.getZyData(qs.stringify(payload.data)).then((res) => {
+    let params= Util.getParams({
+      ...payload.data
+    })
+    Services.getZyData(params).then((res) => {
       state.loading = false;
       let data = res.data;
       if (data.error_code == 0) {

src/views/common/GoodsOne.vue

@@ -46,16 +46,18 @@
         </a>
       </dl>
       <div class="mui-row block-but">
-        <div class="morePrice" :id="'morePrice'+itemchild.goods_id">
+        <div class="morePrice">
           <template v-if="isZy">
             <div
-              class="mui-row list_data"
-              v-for="(itemPrice,index) in itemchild.ladder_price"
-              :class="{'dataNo':(index>(limitLength-1))&&!itemchild.check}"
+              :id="'priceContent'+itemchild.goods_id"
+              :class="{'zyClass':itemchild.ladder_price&&itemchild.ladder_price.length<4,'zyMoreData':itemchild.ladder_price&&itemchild.ladder_price.length>3}"
             >
-              <p class="mui-col-sm-6 mui-col-xs-6" v-html="itemPrice.purchases+'+'"></p>
-              <p class="mui-col-sm-6 mui-col-xs-6">￥{{itemPrice.price_cn}}</p>
+              <div class="mui-row list_data" v-for="(itemPrice,index) in itemchild.ladder_price">
+                <p class="mui-col-sm-6 mui-col-xs-6" v-html="itemPrice.purchases+'+'"></p>
+                <p class="mui-col-sm-6 mui-col-xs-6">￥{{itemPrice.price_cn}}</p>
+              </div>
             </div>
+
             <div
               class="mui-row list_data f-fff"
               v-if="itemchild.ladder_price&&itemchild.ladder_price.length==0"
@@ -66,13 +68,14 @@
           </template>
           <template v-else>
             <div
-              class="mui-row list_data"
-              v-for="(itemPrice,index) in itemchild.ladder_price"
-              :class="{'dataNo':(index>(limitLength-1))&&!itemchild.check}"
+              :id="'priceContent'+itemchild.goods_id"
+              :class="{'lyClass':itemchild.ladder_price&&itemchild.ladder_price.length<4,'lyMoreData':itemchild.ladder_price&&itemchild.ladder_price.length>3}"
             >
-              <p class="mui-col-sm-4 mui-col-xs-4" v-html="itemPrice.purchases+'+'"></p>
-              <p class="mui-col-sm-4 mui-col-xs-4">￥{{itemPrice.price_cn}}</p>
-              <p class="mui-col-sm-4 mui-col-xs-4">${{itemPrice.price_us}}</p>
+              <div class="mui-row list_data" v-for="(itemPrice,index) in itemchild.ladder_price">
+                <p class="mui-col-sm-4 mui-col-xs-4" v-html="itemPrice.purchases+'+'"></p>
+                <p class="mui-col-sm-4 mui-col-xs-4">￥{{itemPrice.price_cn}}</p>
+                <p class="mui-col-sm-4 mui-col-xs-4">${{itemPrice.price_us}}</p>
+              </div>
             </div>
             <div
               class="mui-row list_data f-fff"
@@ -137,24 +140,27 @@ export default {
   mounted() {},
   methods: {
     priceRow: function(index, id) {
-      let dom = document.getElementById("morePrice" + id);
+      let dom = document.getElementById("priceContent" + id);
       let arrLength = this.dataList[index].ladder_price.length;
       if (this.dataList[index]["check"]) {
+        dom.style.height = "57px";
         this.$set(this.dataList[index], "check", false);
         this.$set(
           this.dataList[index],
           "checkBtn",
           '更多梯度价格<i class="icon-bot"></i>'
         );
-        dom.style.height = "81px";
       } else {
+        dom.style.height = 19 * arrLength + "px";
+        dom.style.transition = `height ${(arrLength - 3) * 0.125}s linear`;
+        dom.style.webkitTransition = `height ${(arrLength - 3) *
+          0.125}s linear`;
         this.$set(this.dataList[index], "check", true);
         this.$set(
           this.dataList[index],
           "checkBtn",
           '收起梯度价格<i class="icon-top"></i>'
         );
-        dom.style.height = "200px";
       }
     },
     placeOrder(id) {
@@ -267,8 +273,16 @@ export default {
         color: #666;
         font-size: 12px;
         width: 100%;
-        height: 81px;
-        transition: all 2s ease-in ;
+        .zyClass,
+        .lyClass {
+          height: auto !important;
+        }
+        .zyMoreData,
+        .lyMoreData {
+          height: 57px;
+          border: 1px solid transparent;
+          overflow: hidden;
+        }
         .list_data {
           height: 19px;
           &.dataNo {