Skip to content

梁建民 / h5

Go to a project
Commit 5fdb489e by 施宇
Options

h5zy

parent c138ee57
Expand all
Inline Side-by-side
Showing with 186 additions and 25 deletions
src/store/modules/xianhuo/xianhuo.js
...@@ -18,8 +18,9 @@ const state = { ...@@ -18,8 +18,9 @@ const state = {
classLight: {}, classLight: {},
zyFilterData: {}, //过滤数据 zyFilterData: {}, //过滤数据
zyData: [], zyData: [],
loading:false, loading: false,
finished:false finished: false,
count: 0
} }
const mutations = { const mutations = {
xianhuo(state, payload) { xianhuo(state, payload) {
...@@ -44,12 +45,18 @@ const actions = { ...@@ -44,12 +45,18 @@ const actions = {
}, payload) { }, payload) {
state.loading = true; state.loading = true;
state.finished = false; state.finished = false;
let p = payload.data.params; let p = payload.data.p;
console if(p == 1){
state.zyData = [];
}
Services.getZyData(qs.stringify(payload.data)).then((res) => { Services.getZyData(qs.stringify(payload.data)).then((res) => {
state.loading = false; state.loading = false;
let data = res.data; let data = res.data;
if (data.error_code == 0) { if (data.error_code == 0) {
let totalPage = Math.ceil(data.data.total / 10);
if (p == totalPage) {
state.finished = true;
}
if (data.data.aggs) { if (data.data.aggs) {
commit("xianhuo", { //过滤数据 commit("xianhuo", { //过滤数据
type: "filter", type: "filter",
...@@ -85,10 +92,12 @@ const actions = { ...@@ -85,10 +92,12 @@ const actions = {
} }
} else { } else {
state.loading = false;
state.finished = true;
} }
}).catch(function (err) { }).catch(function (err) {
state.loading = false; state.loading = false;
state.finished = true;
}); });
} }
} }
......
src/views/common/GoodsOne.vue
...@@ -60,7 +60,7 @@ ...@@ -60,7 +60,7 @@
</div> </div>
</div> </div>
<div class="but-shop"> <div class="but-shop">
<a href="javascript:void(0)" class="but" >我要下单</a> <a class="but" @click="placeOrder(itemchild.goods_id)">我要下单</a>
</div> </div>
</div> </div>
</div> </div>
...@@ -101,6 +101,9 @@ ...@@ -101,6 +101,9 @@
this.$set(this.dataList[index],'check',true); this.$set(this.dataList[index],'check',true);
this.$set(this.dataList[index],'checkBtn','收起梯度价格<i class="icon-top"></i>'); this.$set(this.dataList[index],'checkBtn','收起梯度价格<i class="icon-top"></i>');
} }
},
placeOrder(id){
console.log(id)
} }
}, },
components: { components: {
......
src/views/common/goodsDetail.vue 0 → 100644
<template>
<div class="details-pop" v-if="detailsData.isShow">
<div class="mui-backdrop" style="opacity:1"></div>
<div class="mui-poppicker mui-active">
<div class="close">
<i class="icon iconfont icon-guanbi"></i>
</div>
<zy></zy>
</div>
</div>
</template>
<script>
import zy from "@/views/common/zyDetail";
import ly from "@/views/common/lyDetail";
export default {
props:{
detailsData:{
type:Object,
default(){
return {}
}
}
},
components: {
zy,
ly
}
};
</script>
<style lang="scss">
.details-pop {
position: fixed;
left: 0px;
top: 0;
right: 0;
bottom: 0;
width: 100%;
z-index: 999;
overflow: hidden;
.mui-backdrop {
position: fixed;
z-index: 87;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.3);
}
.mui-poppicker {
width: 100%;
z-index: 90;
position: absolute;
top: 20%;
bottom: 0px;
background-color: #fff;
border-top: solid 1px #ccc;
-webkit-transition: 0.3s;
-webkit-transform: translateY(300px);
&.mui-active {
-webkit-transform: translateY(0px);
}
.close {
position: absolute;
top: -25px;
right: 10px;
color: #fff;
}
}
}
</style>
src/views/xianhuo/xianhuo.vue
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<div class="self-ichunt"> <div class="self-ichunt">
<div class="search-sift"> <div class="search-sift">
<!-- <div class="title-cut" v-show="zyRank"> --> <!-- <div class="title-cut" v-show="zyRank"> -->
<div class="title-cut"> <div class="title-cut" v-if="!isScrollShow">
<p class="fr xuan" @click="openRight"> <p class="fr xuan" @click="openRight">
<span class="font">筛选</span> <span class="font">筛选</span>
<i class="icon iconfont icon-shaixuan"></i> <i class="icon iconfont icon-shaixuan"></i>
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
</ul> </ul>
</div> </div>
<!-- <div class="sift-box" v-show="zyFilter||zyClass"> --> <!-- <div class="sift-box" v-show="zyFilter||zyClass"> -->
<div class="sift-box"> <div class="sift-box" v-if="!isScrollShow">
<dl :class="{'p_act': zyFilterInit == 0}"> <dl :class="{'p_act': zyFilterInit == 0}">
<dt <dt
@click="changeZyFilterInit(0)" @click="changeZyFilterInit(0)"
...@@ -137,17 +137,21 @@ ...@@ -137,17 +137,21 @@
</dd> </dd>
</dl> </dl>
</div> </div>
<div class="sosoarr" v-if="isScrollShow">
<template v-for="(v,k) in navTopStr">
<span v-if="k!=='classStr'&&k!=='rightStr'&&v">
<b>·</b>
{{v}}
</span>
<span v-if="(k=='classStr'||k=='rightStr')&&v">{{v}}</span>
</template>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="content_scroll"> </div>
<van-list <div class="content_scroll" @scroll="scrollEvent" :style="{'top':isScrollShow?'44px':'80px'}">
v-model="loadingXh" <van-list v-model="loadingXh" :finished="finished" finished-text="我是有底线的噢" @load="onLoad">
:finished="finished"
finished-text="我是有底线的噢"
@load="onLoad"
>
<GoodsOne :dataList="zyData" :isZy="isZy"></GoodsOne> <GoodsOne :dataList="zyData" :isZy="isZy"></GoodsOne>
</van-list> </van-list>
</div> </div>
...@@ -164,6 +168,7 @@ ...@@ -164,6 +168,7 @@
:class="{'backdrop':true,'zIndex': zyFilterInit!=-1}" :class="{'backdrop':true,'zIndex': zyFilterInit!=-1}"
v-if="isShowRight || zyFilterInit!=-1" v-if="isShowRight || zyFilterInit!=-1"
></div> ></div>
<goodsDetail :detailsData="detailsData"></goodsDetail>
</div> </div>
</template> </template>
<script> <script>
...@@ -172,6 +177,7 @@ import { Icon, Field, List, Cell } from "vant"; ...@@ -172,6 +177,7 @@ import { Icon, Field, List, Cell } from "vant";
import { mapState } from "vuex"; import { mapState } from "vuex";
import rightSelect from "./rightSelect"; import rightSelect from "./rightSelect";
import GoodsOne from "@/views/common/GoodsOne.vue"; import GoodsOne from "@/views/common/GoodsOne.vue";
import goodsDetail from "@/views/common/goodsDetail.vue";
export default { export default {
name: "xianhuo", name: "xianhuo",
components: { components: {
...@@ -179,11 +185,13 @@ export default { ...@@ -179,11 +185,13 @@ export default {
"van-icon": Icon, "van-icon": Icon,
rightSelect, rightSelect,
"van-list": List, "van-list": List,
GoodsOne GoodsOne,
goodsDetail
}, },
data() { data() {
return { return {
isZy:true, detailsData:{isShow:false,id:""},
isZy: true,
zyFilterInit: -1, zyFilterInit: -1,
zyRankInit: 0, //0综合 1库存多到少 2//库存少到多 3//价格高到低 4//价格低到高 zyRankInit: 0, //0综合 1库存多到少 2//库存少到多 3//价格高到低 4//价格低到高
classFilter: "", classFilter: "",
...@@ -203,7 +211,16 @@ export default { ...@@ -203,7 +211,16 @@ export default {
isShowRight: false, //是否展示右侧 isShowRight: false, //是否展示右侧
list: [], list: [],
loadingXh: false, loadingXh: false,
p: 0 p: 0,
rightFilterData: {},
navTopStr: {
classStr: "",
brandStr: "",
encapStr: "",
packingStr: "",
rightStr: ""
},
isScrollShow: false
}; };
}, },
created() {}, created() {},
...@@ -226,6 +243,7 @@ export default { ...@@ -226,6 +243,7 @@ export default {
this.loadingXh = now; this.loadingXh = now;
}, },
zyRankInit(now) { zyRankInit(now) {
this.p = 1;
this.getZyData(); this.getZyData();
}, },
classLight(now) { classLight(now) {
...@@ -243,11 +261,18 @@ export default { ...@@ -243,11 +261,18 @@ export default {
this.classFilter = this.classFilter =
this.firstClassName + "," + this.secondClass[index].class_id2_name; this.firstClassName + "," + this.secondClass[index].class_id2_name;
} }
this.navTopStr.classStr = this.classFilter;
} }
}, },
methods: { methods: {
scrollEvent(e) {
if (e.target.scrollTop > 40) {
this.isScrollShow = true;
} else {
this.isScrollShow = false;
}
},
onLoad() { onLoad() {
console.log(this.loadingXh);
this.p++; this.p++;
this.getZyData(); this.getZyData();
}, },
...@@ -257,7 +282,9 @@ export default { ...@@ -257,7 +282,9 @@ export default {
}, },
filterRight(v) { filterRight(v) {
this.isShowRight = false; this.isShowRight = false;
this.getZyData(v); this.p = 1;
this.rightFilterData = v;
this.getZyData();
}, },
openRight() { openRight() {
this.isShowRight = true; this.isShowRight = true;
...@@ -302,9 +329,10 @@ export default { ...@@ -302,9 +329,10 @@ export default {
} }
} }
}, },
getZyData(rightFilter = {}) { getZyData() {
let params = { p: this.p, offset: 10 }; let params = { p: this.p, offset: 10 };
let rightFilterStr = JSON.stringify(rightFilter); this.navTopStr.rightStr = "";
let rightFilterStr = JSON.stringify(this.rightFilterData);
if (this.addClassStr) { if (this.addClassStr) {
params["class_id/condition"] = this.addClassStr; params["class_id/condition"] = this.addClassStr;
} }
...@@ -329,10 +357,22 @@ export default { ...@@ -329,10 +357,22 @@ export default {
params["single_rank"] = 2; params["single_rank"] = 2;
} }
if (rightFilterStr !== "{}") { if (rightFilterStr !== "{}") {
if (JSON.stringify(rightFilter.filterData) !== "{}") { if (JSON.stringify(this.rightFilterData.filterData) !== "{}") {
params["attrs/nested"] = JSON.stringify(rightFilter.filterData); params["attrs/nested"] = JSON.stringify(
this.rightFilterData.filterData
);
let str = "";
for (let k in this.rightFilterData.filterData) {
let singData = this.rightFilterData.filterData[k];
if (singData.length) {
str += "." + singData.join();
}
} }
if (rightFilter.isyh) { str = str.slice(1);
console.log(str)
this.navTopStr.rightStr = str;
}
if (this.rightFilterData.isyh) {
params["avail_rank"] = 1; params["avail_rank"] = 1;
} }
} }
...@@ -416,17 +456,20 @@ export default { ...@@ -416,17 +456,20 @@ export default {
this.firstClassName = ""; this.firstClassName = "";
this.secondClassName = ""; this.secondClassName = "";
this.classFilter = ""; this.classFilter = "";
this.navTopStr.classStr = "";
} else { } else {
this.addClassStr = this.classStr; this.addClassStr = this.classStr;
this.classFilter = this.secondClassName this.classFilter = this.secondClassName
? this.firstClassName + "," + this.secondClassName ? this.firstClassName + "," + this.secondClassName
: this.firstClassName; : this.firstClassName;
this.navTopStr.classStr = this.classFilter;
} }
} else if (type == "brand") { } else if (type == "brand") {
//制造商 //制造商
this.brandStr = ""; this.brandStr = "";
this.brand = ""; this.brand = "";
if (this.isResetData) { if (this.isResetData) {
this.navTopStr.brandStr = "";
} else { } else {
for (let i = 0; i < this.zyFilterData["brand_id"].list.length; i++) { for (let i = 0; i < this.zyFilterData["brand_id"].list.length; i++) {
if (this.zyFilterData["brand_id"].list[i].check) { if (this.zyFilterData["brand_id"].list[i].check) {
...@@ -437,11 +480,13 @@ export default { ...@@ -437,11 +480,13 @@ export default {
} }
this.brandStr = this.brandStr.slice(0, -1); this.brandStr = this.brandStr.slice(0, -1);
this.brand = this.brand.slice(0, -1); this.brand = this.brand.slice(0, -1);
this.navTopStr.brandStr = this.brand;
} else if (type == "encap") { } else if (type == "encap") {
//封装规格 //封装规格
this.encapStr = ""; this.encapStr = "";
this.encap = ""; this.encap = "";
if (this.isResetData) { if (this.isResetData) {
this.navTopStr.encapStr = "";
} else { } else {
for (let i = 0; i < this.zyFilterData["encap"].list.length; i++) { for (let i = 0; i < this.zyFilterData["encap"].list.length; i++) {
if (this.zyFilterData["encap"].list[i].check) { if (this.zyFilterData["encap"].list[i].check) {
...@@ -453,11 +498,13 @@ export default { ...@@ -453,11 +498,13 @@ export default {
this.encapStr = this.encapStr.slice(0, -1); this.encapStr = this.encapStr.slice(0, -1);
this.encap = this.encap.slice(0, -1); this.encap = this.encap.slice(0, -1);
this.navTopStr.encapStr = this.encap;
} else if (type == "packing") { } else if (type == "packing") {
//包装筛选 //包装筛选
this.packingStr = ""; this.packingStr = "";
this.packing = ""; this.packing = "";
if (this.isResetData) { if (this.isResetData) {
this.navTopStr.packingStr = "";
} else { } else {
for (let i = 0; i < this.zyFilterData["packing"].list.length; i++) { for (let i = 0; i < this.zyFilterData["packing"].list.length; i++) {
if (this.zyFilterData["packing"].list[i].check) { if (this.zyFilterData["packing"].list[i].check) {
...@@ -468,7 +515,9 @@ export default { ...@@ -468,7 +515,9 @@ export default {
} }
this.packingStr = this.packingStr.slice(0, -1); this.packingStr = this.packingStr.slice(0, -1);
this.packing = this.packing.slice(0, -1); this.packing = this.packing.slice(0, -1);
this.navTopStr.packingStr = this.packing;
} }
this.p = 1;
this.getZyData(); this.getZyData();
} }
} }
...@@ -712,6 +761,34 @@ export default { ...@@ -712,6 +761,34 @@ export default {
} }
} }
} }
.sosoarr {
display: block;
position: fixed;
top: 44px;
left: 0;
right: 0;
z-index: 10;
background-color: #fff;
font-size: 15px;
font-weight: 400;
height: 44px;
line-height: 44px;
width: 100%;
-webkit-box-shadow: 0 2px 5px #eeeeee;
box-shadow: 0 2px 5px #eeeeee;
table-layout: fixed;
border-bottom: 1px solid #d6d7dc;
text-align: center;
padding: 0 15%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
b {
font-weight: bold;
font-size: 16px;
margin: 0 3px;
}
}
} }
} }
.content_scroll { .content_scroll {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment