Skip to content

梁建民 / h5

Go to a project
Commit d70b25ad by 施宇
Options

h5zy

parent d5954be2
Inline Side-by-side
Showing with 515 additions and 210 deletions
src/api/index.js
...@@ -39,6 +39,8 @@ switch (window.location.hostname) { ...@@ -39,6 +39,8 @@ switch (window.location.hostname) {
urlPc = 'http://www.liexin.com/v3/'; urlPc = 'http://www.liexin.com/v3/';
zyApi = 'http://soso12.ichunt.com'; zyApi = 'http://soso12.ichunt.com';
lyApi = 'http://soso12.ichunt.com'; lyApi = 'http://soso12.ichunt.com';
// zyApi = 'https://szso.ichunt.com';
// lyApi = 'https://szso.ichunt.com';
break; break;
default: default:
//本地proxy配置参考vue.config.js //本地proxy配置参考vue.config.js
...@@ -288,7 +290,10 @@ export const apis = { ...@@ -288,7 +290,10 @@ export const apis = {
searchLyEs: lyApi + '/search/es/index', searchLyEs: lyApi + '/search/es/index',
/**供应商接口**/ /**供应商接口**/
supplierApi: productionUrl + 'api/supplierApi', supplierApi: productionUrl + 'api/supplierApi',
/****获取弹出商品信息 */
goodDetail: productionUrlApi + '/goods/detail',
/****获取zy默认class查询 */
defaultClass:productionUrl+'api/defaultClass'
}; };
...@@ -440,17 +445,23 @@ export const services = { ...@@ -440,17 +445,23 @@ export const services = {
orderInfo(params) { orderInfo(params) {
return axios.post(apis.orderInfo, params) return axios.post(apis.orderInfo, params)
}, },
getZyData(params){ getZyData(params) {
return axios.post(apis.searchZy,params) return axios.post(apis.searchZy, params)
},
getLyData(params) {
return axios.post(apis.searchLy, params)
},
getLyEsData(params) {
return axios.post(apis.searchLyEs, params)
}, },
getLyData(params){ supplierApi(params) {
return axios.post(apis.searchLy,params) return axios.post(apis.supplierApi, params)
}, },
getLyEsData(params){ goodDetail(params) {
return axios.post(apis.searchLyEs,params) return axios.post(apis.goodDetail, params)
}, },
supplierApi(params){ defaultClass(params){
return axios.post(apis.supplierApi,params) return axios.post(apis.defaultClass,params)
} }
}; };
\ No newline at end of file
src/store/modules/gooddetail/gooddetail.js 0 → 100644
import Vue from 'vue'
import {
Toast
} from 'vant';
import {
services as Services
} from '../../../api/index'
import util
from '../../../util/index';
var qs = require('qs');
Vue.use(Toast);
const state = {
goodDetail: {},
startNum: 1, //起订量
multipleNum: 1, //倍数
aggregateNum: 0, //一组的数量
stockNum: 0, //库存，
zyladderArr: [] //阶梯价
}
const mutations = {
changGoodDetai(state, payload) {
let data = payload.data
state.goodDetail = data;
if (data.min_buy) {
state.startNum = util.aggxde(data.min_buy)
}
if (data.mpl) {
state.multipleNum = util.aggxde(data.mpl)
}
if (data.min_mpq) {
state.aggregateNum = util.aggxde(data.min_mpq)
}
if (data.goods_number) {
state.stockNum = util.aggxde(data.goods_number)
}
if(data.tiered){
for(let i=0;i<data.tiered.length;i++){
}
}
}
}
const actions = {
getDetailData({
commit
}, payload) {
const toast = Toast.loading({
message: '加载中...',
duration: 0
});
state.goodDetail = {};
Services.goodDetail(qs.stringify(payload.data)).then((res) => {
toast.clear()
let data = res.data;
if (data.err_code == 0) {
commit("changGoodDetai", { //过滤数据
data: data.data
})
} else {
}
}).catch(function (err) {
toast.clear()
});
}
}
export default {
state,
actions,
mutations
}
\ No newline at end of file
src/store/modules/xianhuo/xianhuo.js
import Vue from 'vue' import Vue from 'vue'
import {
Toast
} from 'vant';
import { import {
services as Services services as Services
} from '../../../api/index' } from '../../../api/index'
var qs = require('qs'); var qs = require('qs');
Vue.use(Toast);
const state = { const state = {
zyFilter: false, zyFilter: false,
zyClass: false, zyClass: false,
......
src/store/store.js
...@@ -18,6 +18,7 @@ import aboutus from './modules/aboutUs/index' ...@@ -18,6 +18,7 @@ import aboutus from './modules/aboutUs/index'
import chain from './modules/chain/chain' import chain from './modules/chain/chain'
import xianhuo from './modules/xianhuo/xianhuo' import xianhuo from './modules/xianhuo/xianhuo'
import lxshop from './modules/lxshop/lxshop' import lxshop from './modules/lxshop/lxshop'
import gooddetail from './modules/gooddetail/gooddetail'
Vue.use(Vuex) Vue.use(Vuex)
...@@ -41,6 +42,7 @@ export default new Vuex.Store({ ...@@ -41,6 +42,7 @@ export default new Vuex.Store({
aboutus, aboutus,
chain, chain,
xianhuo, xianhuo,
lxshop lxshop,
gooddetail
} }
}) })
src/views/common/GoodsOne.vue
...@@ -2,9 +2,16 @@ ...@@ -2,9 +2,16 @@
<section> <section>
<div class="block oneDataGoods" v-for="(itemchild,indexdata) in dataList"> <div class="block oneDataGoods" v-for="(itemchild,indexdata) in dataList">
<dl class="mui-row img-box"> <dl class="mui-row img-box">
<a :href="isZy?('https://m.ichunt.com/item/'+itemchild.goods_id+'.html?ptag=selfshop'):('https://m.ichunt.com/goods_'+itemchild.goods_id+'.html?ptag=lxshop')"> <a
:href="isZy?('https://m.ichunt.com/item/'+itemchild.goods_id+'.html?ptag=selfshop'):('https://m.ichunt.com/goods_'+itemchild.goods_id+'.html?ptag=lxshop')"
>
<dt v-lazy-container="{selector:'img'}"> <dt v-lazy-container="{selector:'img'}">
<img class="lazy img-lazy" :alt="itemchild.goods_name_temp" :data-src="isZy?itemchild.goods_images:itemchild.goods_img" data-error="https://www.ichunt.com/v3/dist/res/m/images/materiel_img_3.png" /> <img
class="lazy img-lazy"
:alt="itemchild.goods_name_temp"
:data-src="isZy?itemchild.goods_images:itemchild.goods_img"
data-error="https://www.ichunt.com/v3/dist/res/m/images/materiel_img_3.png"
>
</dt> </dt>
<dd> <dd>
<template v-if="isZy"> <template v-if="isZy">
...@@ -12,21 +19,28 @@ ...@@ -12,21 +19,28 @@
<p v-if="itemchild.class_name2">分类：{{itemchild.class_name2}}</p> <p v-if="itemchild.class_name2">分类：{{itemchild.class_name2}}</p>
<p>制造商：{{itemchild.brand_name}}</p> <p>制造商：{{itemchild.brand_name}}</p>
<p v-if="itemchild.encap">封装：{{itemchild.encap}}</p> <p v-if="itemchild.encap">封装：{{itemchild.encap}}</p>
<p>库存： <p>
库存：
<span v-html="itemchild.stock"></span> <span v-html="itemchild.stock"></span>
(<span v-html="itemchild.purchase_info"></span>) (
<span v-html="itemchild.purchase_info"></span>)
</p> </p>
</template> </template>
<template v-else> <template v-else>
<h4>{{itemchild.goods_name_temp}}</h4> <h4>{{itemchild.goods_name_temp}}</h4>
<p>制造商：{{itemchild.brand_name||'- -'}}</p> <p>制造商：{{itemchild.brand_name||'- -'}}</p>
<p> <p>
库存：<span v-html="itemchild.stock||0"></span> 库存：
<span v-html="itemchild.stock||0"></span>
</p>
<p>
起订：
<span v-html="itemchild.moq||1"></span>
</p> </p>
<p> <p>
起订：<span v-html="itemchild.moq||1"></span> MPQ：
<span v-html="itemchild.mpq||1"></span>
</p> </p>
<p>MPQ：<span v-html="itemchild.mpq||1"></span></p>
</template> </template>
</dd> </dd>
</a> </a>
...@@ -34,29 +48,43 @@ ...@@ -34,29 +48,43 @@
<div class="mui-row block-but"> <div class="mui-row block-but">
<div class="morePrice"> <div class="morePrice">
<template v-if="isZy"> <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}" > <div
class="mui-row list_data"
v-for="(itemPrice,index) in itemchild.ladder_price"
:class="{'dataNo':(index>(limitLength-1))&&!itemchild.check}"
>
<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" v-html="itemPrice.purchases+'+'"></p>
<p class="mui-col-sm-6 mui-col-xs-6">￥{{itemPrice.price_cn}}</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.length==0"> <div class="mui-row list_data f-fff" v-if="itemchild.ladder_price.length==0">
<p class="mui-col-sm-6 mui-col-xs-6" >- -</p> <p class="mui-col-sm-6 mui-col-xs-6">- -</p>
<p class="mui-col-sm-6 mui-col-xs-6">- -</p> <p class="mui-col-sm-6 mui-col-xs-6">- -</p>
</div> </div>
</template> </template>
<template v-else> <template v-else>
<div class="mui-row list_data" v-for="(itemPrice,index) in itemchild.ladder_price" :class="{'dataNo':(index>(limitLength-1))&&!itemchild.check}" > <div
class="mui-row list_data"
v-for="(itemPrice,index) in itemchild.ladder_price"
:class="{'dataNo':(index>(limitLength-1))&&!itemchild.check}"
>
<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" 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_cn}}</p>
<p class="mui-col-sm-4 mui-col-xs-4">${{itemPrice.price_us}}</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" v-if="itemchild.ladder_price.length==0"> <div class="mui-row list_data f-fff" v-if="itemchild.ladder_price.length==0">
<p class="mui-col-sm-4 mui-col-xs-4" >- -</p> <p class="mui-col-sm-4 mui-col-xs-4">- -</p>
<p class="mui-col-sm-4 mui-col-xs-4">- -</p> <p class="mui-col-sm-4 mui-col-xs-4">- -</p>
<p class="mui-col-sm-4 mui-col-xs-4">- -</p> <p class="mui-col-sm-4 mui-col-xs-4">- -</p>
</div> </div>
</template> </template>
<div class="more-height" v-if="itemchild.ladder_price.length>limitLength" @click="priceRow(indexdata)" v-html="itemchild.checkBtn||defaultBtn"> <div
更多梯度价格<i class="icon-bot"></i> class="more-height"
v-if="itemchild.ladder_price.length>limitLength"
@click="priceRow(indexdata)"
v-html="itemchild.checkBtn||defaultBtn"
>
更多梯度价格
<i class="icon-bot"></i>
</div> </div>
</div> </div>
<div class="but-shop"> <div class="but-shop">
...@@ -67,94 +95,208 @@ ...@@ -67,94 +95,208 @@
</section> </section>
</template> </template>
<script> <script>
import Vue from 'vue'; import Vue from "vue";
import {Lazyload} from 'vant'; import { Lazyload } from "vant";
Vue.use(Lazyload); Vue.use(Lazyload);
export default { export default {
name: "GoodsOne", name: "GoodsOne",
props: { props: {
dataList: {//数组数据 dataList: {
//数组数据
type: Array, type: Array,
default: [] default: []
}, },
isZy:{//是否自营 isZy: {
//是否自营
type: Boolean, type: Boolean,
default: false default: false
} }
}, },
data() { data() {
return { return {
limitLength:3, limitLength: 3,
defaultBtn:'更多梯度价格<i class="icon-bot"></i>' defaultBtn: '更多梯度价格<i class="icon-bot"></i>'
}; };
}, },
watch:{ watch: {},
},
mounted() {}, mounted() {},
methods: { methods: {
priceRow:function(index){ priceRow: function(index) {
if(this.dataList[index]['check']){ if (this.dataList[index]["check"]) {
this.$set(this.dataList[index],'check',false); this.$set(this.dataList[index], "check", false);
this.$set(this.dataList[index],'checkBtn','更多梯度价格<i class="icon-bot"></i>'); this.$set(
}else{ this.dataList[index],
this.$set(this.dataList[index],'check',true); "checkBtn",
this.$set(this.dataList[index],'checkBtn','收起梯度价格<i class="icon-top"></i>'); '更多梯度价格<i class="icon-bot"></i>'
);
} else {
this.$set(this.dataList[index], "check", true);
this.$set(
this.dataList[index],
"checkBtn",
'收起梯度价格<i class="icon-top"></i>'
);
} }
}, },
placeOrder(id){ placeOrder(id) {
console.log(id) this.$emit("placeOrder", id);
} }
}, },
components: { components: {}
};
}
};
</script> </script>
<style lang="scss" > <style lang="scss" >
.oneDataGoods{ .oneDataGoods {
&.block{ &.block {
padding:5px 10px 0 0; margin-left: 10px; padding: 5px 10px 0 0;
margin-left: 10px;
border-top: 1px solid #d6d7dc; border-top: 1px solid #d6d7dc;
.img-box{ .img-box {
padding: 10px 10px 0 0; padding: 10px 10px 0 0;
dt{ dt {
position: relative; float: left; height:80px; width: 80px; position: relative;
span{ position: absolute; top: 0; right: 0; background:#e10601; display:block; padding: 0px 3px; height: 12px;line-height: 12px; border-radius: 2px; font-size: 10px; color: #fff; } float: left;
img{ border: 1px solid #e5e5e5; height: 80px;width: 80px; display: block; } height: 80px;
width: 80px;
span {
position: absolute;
top: 0;
right: 0;
background: #e10601;
display: block;
padding: 0px 3px;
height: 12px;
line-height: 12px;
border-radius: 2px;
font-size: 10px;
color: #fff;
}
img {
border: 1px solid #e5e5e5;
height: 80px;
width: 80px;
display: block;
} }
dd{ }
dd {
padding-left: 90px; padding-left: 90px;
h4{ h4 {
font-size: 16px; color: #333; height: 20px; font-size: 16px;
font-weight: 400; overflow:hidden; color: #333;
text-overflow:ellipsis;white-space: nowrap; height: 20px;
.f-red{ font-weight: 400; color: #1080d0;} font-weight: 400;
} overflow: hidden;
h5{ height: 21px; padding-bottom: 9px; overflow: hidden; text-overflow: ellipsis;
span{padding: 0 5px; display:inline-block; background:#ffa200; height:12px;line-height: 12px; border-radius: 2px; font-size: 12px; color: #fff;} white-space: nowrap;
} .f-red {
p{ font-size: 12px; color: #666; height: 16px; line-height: 16px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap; } font-weight: 400;
} color: #1080d0;
} }
.icon-hint span{ display: inline-block; height: 18px; line-height: 19px; color: #fff; background: #ffa200; margin-right: 5px; border-radius: 3px; padding: 0 9px; font-size: 12px; } }
.block .icon-hint i{font-size: 13px; margin-right: 4px;} h5 {
.block-but{ height: 21px;
padding:5px 0 10px 0; padding-left: 0; vertical-align: middle; display: table; width: 100%; padding-bottom: 9px;
.morePrice{ overflow: hidden;
color: #666; font-size: 12px; width: 100%; span {
.list_data{height: 19px;&.dataNo{display: none;}&.f-fff{p{color:rgba(255,255,255,0)!important;}}} padding: 0 5px;
p{ font-size: 12px; color: #666; line-height: 19px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap; } display: inline-block;
} background: #ffa200;
.but-shop{ width: 25%; vertical-align: middle; display: table-cell;} height: 12px;
.but{height: 30px; float: right; line-height:30px;padding: 0 20px; width:100px; font-size: 14px; line-height: 12px;
display: block;color:#fff;background: #1080d0;text-align: center;cursor: pointer;box-sizing: border-box; border-radius: 2px;
font-size: 12px;
color: #fff;
}
}
p {
font-size: 12px;
color: #666;
height: 16px;
line-height: 16px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
.icon-hint span {
display: inline-block;
height: 18px;
line-height: 19px;
color: #fff;
background: #ffa200;
margin-right: 5px;
border-radius: 3px;
padding: 0 9px;
font-size: 12px;
}
.block .icon-hint i {
font-size: 13px;
margin-right: 4px;
}
.block-but {
padding: 5px 0 10px 0;
padding-left: 0;
vertical-align: middle;
display: table;
width: 100%;
.morePrice {
color: #666;
font-size: 12px;
width: 100%;
.list_data {
height: 19px;
&.dataNo {
display: none;
}
&.f-fff {
p {
color: rgba(255, 255, 255, 0) !important;
}
}
}
p {
font-size: 12px;
color: #666;
line-height: 19px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.but-shop {
width: 25%;
vertical-align: middle;
display: table-cell;
}
.but {
height: 30px;
float: right;
line-height: 30px;
padding: 0 20px;
width: 100px;
font-size: 14px;
display: block;
color: #fff;
background: #1080d0;
text-align: center;
cursor: pointer;
box-sizing: border-box;
border-radius: 4px; border-radius: 4px;
} }
} }
.more-height,.zkxk{ font-size: 12px; margin-right: 10%; height: 24px; line-height:24px; border: 1px solid #e5e5e5; text-align: center; color: #666; } .more-height,
.icon-bot{ .zkxk {
font-size: 12px;
margin-right: 10%;
height: 24px;
line-height: 24px;
border: 1px solid #e5e5e5;
text-align: center;
color: #666;
}
.icon-bot {
top: 9px; top: 9px;
position: relative; position: relative;
content: ""; content: "";
...@@ -166,7 +308,7 @@ ...@@ -166,7 +308,7 @@
border-width: 4px; border-width: 4px;
margin-left: 5px; margin-left: 5px;
} }
.icon-top{ .icon-top {
bottom: 9px; bottom: 9px;
position: relative; position: relative;
content: ""; content: "";
...@@ -179,5 +321,5 @@ ...@@ -179,5 +321,5 @@
margin-left: 5px; margin-left: 5px;
} }
} }
} }
</style> </style>
src/views/common/goodsDetail.vue
<template> <template>
<div class="details-pop" v-if="detailsData.isShow"> <div class="details-pop" v-if="detailsData.isShow">
<div class="mui-backdrop" style="opacity:1"></div> <div class="mui-backdrop" style="opacity:1" @click="detailsData.isShow = false"></div>
<div class="mui-poppicker mui-active"> <div class="mui-poppicker mui-active">
<div class="close"> <div class="close" @click="detailsData.isShow = false">
<i class="icon iconfont icon-guanbi"></i> <i class="icon iconfont icon-guanbi"></i>
</div> </div>
<zy></zy> <zy v-if="goodDetail.goods_type==3||goodDetail.goods_type==4"></zy>
<ly v-if="goodDetail.goods_type==1||goodDetail.goods_type==2"></ly>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import zy from "@/views/common/zyDetail"; import zy from "@/views/common/zyDetail";
import ly from "@/views/common/lyDetail"; import ly from "@/views/common/lyDetail";
import { mapState } from "vuex";
export default { export default {
props:{ props: {
detailsData:{ detailsData: {
type:Object, type: Object,
default(){ default() {
return {} return {};
} }
},
test1: {
type: String,
default: "1"
} }
}, },
components: { components: {
zy, zy,
ly ly
},
computed: {
...mapState({
goodDetail: state => state.gooddetail.goodDetail
})
},
watch: {
detailsData: {
handler(newV, oldV) {
if (newV.isShow) {
this.$store.dispatch({
type: "getDetailData",
data: { id: newV.id }
});
}
},
deep: true
},
} }
}; };
</script> </script>
......
src/views/common/lyDetail.vue
<template>
<div>111111</div>
</template>
src/views/common/zyDetail.vue
...@@ -3,11 +3,11 @@ ...@@ -3,11 +3,11 @@
<div class="details-head"> <div class="details-head">
<div class="head_top clr"> <div class="head_top clr">
<div class="head_top_left fl"> <div class="head_top_left fl">
<img src="http://img.ichunt.com/images/goods/41/04/410405ade11b761554234b1d2b12f491.png"> <img :src="goodDetail.brand_logo">
</div> </div>
<div class="head_top_right"> <div class="head_top_right">
<h4> <h4>
<strong>贴片电阻 5.6kΩ(562) 0402 ±5% 1/16W</strong> <strong>{{goodDetail.sku_name}}</strong>
</h4> </h4>
<p class="icon-hint"></p> <p class="icon-hint"></p>
</div> </div>
...@@ -15,64 +15,45 @@ ...@@ -15,64 +15,45 @@
<ul class="head_bottom clr"> <ul class="head_bottom clr">
<li class="fl"> <li class="fl">
<b>型号</b> <b>型号</b>
<span>0402WGJ0562TCE</span> <span>{{goodDetail.goods_name}}</span>
</li> </li>
<li class="fl"> <li class="fl">
<b>供应商</b> <b>供应商</b>
<span>猎芯自营</span> <span>{{goodDetail.supplier_name}}</span>
</li> </li>
<li class="fl"> <li class="fl">
<b>制造商</b> <b>制造商</b>
<span>UniOhm(厚声)</span> <span>{{goodDetail.brand_name}}</span>
</li> </li>
<li class="fl"> <li class="fl">
<b>封装</b> <b>封装</b>
<span>0402</span> <span>{{goodDetail.encap?goodDetail.encap:'--'}}</span>
</li> </li>
<li class="fl"> <li class="fl">
<b>类别</b> <b>类别</b>
<span>贴片电阻</span> <span>{{goodDetail.class2_name}}</span>
</li> </li>
<li class="fl"> <li class="fl">
<b>起订量</b> <b>起订量</b>
<font class="f-orange"> <font class="f-orange" v-html="goodDetail.min_buy?goodDetail.min_buy:'1'"></font>
<font class="asfgdpoer urnvewjei klzxcvbnm bmeruwulu"></font> {{goodDetail.goods_unit_name}}
<font class="asfgdqwer ewjeilwei sieurnvew mqwwertyu"></font>
<font class="asfgdqwer nmqwwerty bmeruwulu vewjeilwe"></font>
</font>个
</li> </li>
<li class="fl"> <li class="fl">
<b>倍数</b> <b>倍数</b>
<font class="f-orange"> <font class="f-orange" v-html="goodDetail.mpl?goodDetail.mpl:'1'"></font>
<font class="asfgdpoer nmqwwerty ilweiskvn jeilweisk"></font> {{goodDetail.goods_unit_name}}
<font class="asfgdpolk kdsieurnv cvbnmqwwe cvbnmqwwe"></font>
<font class="asfgdtyhg dsieurnve hjklzxcvb miqplmzac"></font>
</font>个
</li> </li>
<li class="fl"> <li class="fl">
<b>一圆盘</b> <b v-html="'一'+goodDetail.mpq_unit_name"></b>
<span <span
class="f-orange" class="f-orange"
guid3 v-html="(goodDetail.min_mpq?goodDetail.min_mpq:'0')+goodDetail.goods_unit_name"
guid2="<font class=&quot;asfgdpoer nmqwwerty ilweiskvn jeilweisk&quot;></font><font class=&quot;asfgdpolk kdsieurnv cvbnmqwwe cvbnmqwwe&quot;></font><font class=&quot;asfgdtyhg dsieurnve hjklzxcvb miqplmzac&quot;></font>" ></span>
guid="<font class=&quot;asfgdwdsa klzxcvbnm zacbmeruw ghjklzxcv&quot;></font><font class=&quot;asfgdpoqw eruwulurj lweiskvnx meruwulur&quot;></font><font class=&quot;asfgdpolk xcvbnmqww nvewjeilw rjlauejri&quot;></font><font class=&quot;asfgdpolk auejrifkf jklzxcvbn bmeruwulu&quot;></font><font class=&quot;asfgdpoqw pkxmiqplm miqplmzac uiopkdsie&quot;></font>"
>
<font class="asfgdwdsa klzxcvbnm zacbmeruw ghjklzxcv"></font>
<font class="asfgdpoqw eruwulurj lweiskvnx meruwulur"></font>
<font class="asfgdpolk xcvbnmqww nvewjeilw rjlauejri"></font>
<font class="asfgdpolk auejrifkf jklzxcvbn bmeruwulu"></font>
<font class="asfgdpoqw pkxmiqplm miqplmzac uiopkdsie"></font>个
</span>
</li> </li>
<li class="fl"> <li class="fl">
<b class>库存</b> <b class>库存</b>
<font class="f-orange"> <font class="f-orange" v-html="goodDetail.goods_number?goodDetail.goods_number:'0'"></font>
<font class="asfgdwsxz ertyuiopk cvbnmqwwe ruwulurjl"></font> {{goodDetail.goods_unit_name}}
<font class="asfgdpogk cvbnmqwwe fghjklzxc fghjklzxc"></font>
<font class="asfgdpehg auejrifkf dsieurnve eurnvewje"></font>
<font class="asfgdpoqw jlauejrif kxmiqplmz xcvbnmqww"></font>
<font class="asfgdtyhg zacbmeruw rjlauejri rjlauejri"></font>
</font>个
</li> </li>
<li class="fl"> <li class="fl">
<b class="f-orange">国内现货，当天发货</b> <b class="f-orange">国内现货，当天发货</b>
...@@ -80,7 +61,8 @@ ...@@ -80,7 +61,8 @@
<li <li
class="fl" class="fl"
style=" width: 100%; overflow:hidden;text-overflow:ellipsis;white-space: nowrap;color: #999;" style=" width: 100%; overflow:hidden;text-overflow:ellipsis;white-space: nowrap;color: #999;"
>描述：贴片电阻 5.6kΩ(562) 0402 ±5% 1/16W</li> v-if="goodDetail.sku_name"
>描述：{{goodDetail.sku_name}}</li>
</ul> </ul>
</div> </div>
<div class="details-cont" style="top: 210px;"> <div class="details-cont" style="top: 210px;">
...@@ -88,90 +70,71 @@ ...@@ -88,90 +70,71 @@
<table> <table>
<tbody> <tbody>
<tr> <tr>
<th>数量</th> <template v-if="goodDetail.ac_type == 1">
<th>人民币</th> <th class="xs-3">数量</th>
<th class="xs-3">原价(含税)</th>
<th class="xs-3">抢购价(含税)</th>
</template>
<template v-if="goodDetail.ac_type == 2 || goodDetail.ac_type == 3">
<th class="xs-3">数量</th>
<th class="xs-3">原价(含税)</th>
<th class="xs-3">优惠价(含税)</th>
</template>
<template v-else>
<th class="xs-6">数量</th>
<th class="xs-6">人民币</th>
</template>
</tr> </tr>
</tbody> </tbody>
<tbody> <tbody>
<tr> <template v-if="goodDetail.tiered">
<td> <tr v-for="(v,k) in goodDetail.tiered" v-if="k<3||isShowMore">
<span> <template
<font class="asfgdrfdf lzxcvbnmq vbnmqwwer ilweiskvn"></font> v-if="goodDetail.ac_type == 1 || goodDetail.ac_type == 2 || goodDetail.ac_type == 3"
<font class="asfgdpoqw wertyuiop qplmzacbm fghjklzxc"></font> >
<font class="asfgdtyhg qplmzacbm yuiopkdsi sieurnvew"></font> <td class="xs-3">
</span>+ <span v-html="v.purchases+'+'"></span>
</td>
<td>
<span>¥0.0018</span>
</td>
</tr>
<tr>
<td>
<span>
<font class="asfgderfd jlauejrif zacbmeruw cbmeruwul"></font>
<font class="asfgdpolk urnvewjei uejrifkfg rjlauejri"></font>
<font class="asfgdpolk iqplmzacb uwulurjla iqplmzacb"></font>
<font class="asfgdtyhg eruwulurj yuiopkdsi kdsieurnv"></font>
</span>+
</td>
<td>
<span>¥0.0016</span>
</td>
</tr>
<tr>
<td>
<span>
<font class="asfgdrtyh urjlauejr zxcvbnmqw plmzacbme"></font>
<font class="asfgdpoqw zacbmeruw iqplmzacb iopkdsieu"></font>
<font class="asfgdpoqw meruwulur ruwulurjl eruwulurj"></font>
<font class="asfgdtyhg lweiskvnx kxmiqplmz nmqwwerty"></font>
</span>+
</td>
<td>
<span>¥0.0016</span>
</td> </td>
</tr> <td class="xs-3">
<tr> <span v-html="v.price_cn+'￥'"></span>
<td>
<span>
<font class="asfgderfd eruwulurj ieurnvewj dwpkxmiqp"></font>
<font class="asfgdqwer eruwulurj auejrifkf iopkdsieu"></font>
<font class="asfgdtyhg mqwwertyu urnvewjei wertyuiop"></font>
<font class="asfgdpoqw bnmqwwert ghjklzxcv wjeilweis"></font>
<font class="asfgdpoqw pkxmiqplm kxmiqplmz ieurnvewj"></font>
</span>+
</td> </td>
<td> <td class="xs-3">
<span>¥0.0015</span> <span v-html="v.price_ac+'￥'"></span>
</td> </td>
</tr> </template>
<tr> <template v-else>
<td> <td class="xs-6">
<span> <span v-html="v.purchases+'+'"></span>
<font class="asfgdrtyh zacbmeruw vbnmqwwer iqplmzacb"></font>
<font class="asfgdtyhg eurnvewje jlauejrif opkdsieur"></font>
<font class="asfgdpoqw rifkfghjk jrifkfghj cbmeruwul"></font>
<font class="asfgdpolk uwulurjla eruwulurj dsieurnve"></font>
<font class="asfgdpolk bnmqwwert xcvbnmqww urnvewjei"></font>
</span>+
</td> </td>
<td> <td class="xs-6">
<span>¥0.0014</span> <span v-html="v.price_cn+'￥'"></span>
</td> </td>
</template>
</tr> </tr>
</template>
</tbody> </tbody>
</table> </table>
<div class="zkxk"> <template v-if="goodDetail.tiered">
<div
class="zkxk"
v-if="goodDetail.tiered.length>3&&!isShowMore"
@click="isShowMore=!isShowMore"
>
更多梯度价格
<i class="icon-bot"></i>
</div>
<div class="zkxk" v-if="isShowMore" @click="isShowMore=!isShowMore">
收起梯度价格 收起梯度价格
<i class="icon-top"></i> <i class="icon-top"></i>
</div> </div>
</template>
</div> </div>
<div class="price"> <div class="price">
<dl class="clr"> <dl class="clr">
<dt>购买形式</dt> <dt>购买形式</dt>
<dd class="tab"> <dd class="tab">
<span guid="33" class="act">按个购买</span> <span class="act" v-html="'按'+goodDetail.goods_unit_name+'购买'"></span>
<span guid="44" class="panshuggpo">按圆盘购买</span> <span v-html="'按'+goodDetail.mpq_unit_name+'购买'"></span>
</dd> </dd>
</dl> </dl>
<dl class="clr"> <dl class="clr">
...@@ -219,6 +182,36 @@ ...@@ -219,6 +182,36 @@
</div> </div>
</div> </div>
</template> </template>
<script>
import { mapState } from "vuex";
export default {
data() {
return {
isShowMore: false,
singleNum: 0,
ypNum: 0,
singlePrice: 0,
total: 0,
tipText: ""
};
},
computed: {
...mapState({
goodDetail: state => state.gooddetail.goodDetail
})
},
watch: {
goodDetail: {
handler(newV, oldV) {
console.log(1111)
},
deep: true
}
},
methods: {}
};
</script>
<style lang="scss"> <style lang="scss">
@function remFun($rem) { @function remFun($rem) {
@return $rem * 50/37.5; @return $rem * 50/37.5;
...@@ -299,11 +292,19 @@ ...@@ -299,11 +292,19 @@
text-align: center; text-align: center;
color: #666666; color: #666666;
border: 1px solid #d9d9d9; border: 1px solid #d9d9d9;
.xs-6 {
width: 50%;
}
.xs-4 {
width: 33.33%;
}
.xs-3 {
width: 25%;
}
th { th {
border: 1px solid #d9d9d9; border: 1px solid #d9d9d9;
font-weight: 400; font-weight: 400;
color: #666; color: #666;
width: 50%;
} }
td { td {
border: 1px solid #d9d9d9; border: 1px solid #d9d9d9;
...@@ -330,6 +331,18 @@ ...@@ -330,6 +331,18 @@
border-width: 4px; border-width: 4px;
margin-left: 5px; margin-left: 5px;
} }
.icon-bot {
top: 9px;
position: relative;
content: "";
height: 0;
width: 0;
pointer-events: none;
border: solid transparent;
border-top-color: #4d4d4d;
border-width: 4px;
margin-left: 5px;
}
} }
} }
.price { .price {
......
src/views/xianhuo/xianhuo.vue
...@@ -151,8 +151,14 @@ ...@@ -151,8 +151,14 @@
</div> </div>
</div> </div>
<div class="content_scroll" @scroll="scrollEvent" :style="{'top':isScrollShow?'44px':'80px'}"> <div class="content_scroll" @scroll="scrollEvent" :style="{'top':isScrollShow?'44px':'80px'}">
<van-list v-model="loadingXh" :finished="finished" finished-text="我是有底线的噢" @load="onLoad"> <van-list
<GoodsOne :dataList="zyData" :isZy="isZy"></GoodsOne> v-model="loadingXh"
:finished="finished"
finished-text="我是有底线的噢"
@load="onLoad"
:immediate-check="false"
>
<GoodsOne :dataList="zyData" :isZy="isZy" @placeOrder="placeOrder"></GoodsOne>
</van-list> </van-list>
</div> </div>
</div> </div>
...@@ -179,6 +185,8 @@ import { mapState } from "vuex"; ...@@ -179,6 +185,8 @@ 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"; import goodsDetail from "@/views/common/goodsDetail.vue";
import SideBar from "@/views/common/SideBar.vue";
import { services as Services } from "../../api/index";
export default { export default {
name: "xianhuo", name: "xianhuo",
components: { components: {
...@@ -187,14 +195,15 @@ export default { ...@@ -187,14 +195,15 @@ export default {
rightSelect, rightSelect,
"van-list": List, "van-list": List,
GoodsOne, GoodsOne,
goodsDetail goodsDetail,
SideBar
}, },
data() { data() {
return { return {
detailsData:{isShow:false,id:""}, detailsData: { isShow: false, id: "" },
isWindow:true, isWindow: true,
carshow:true, carshow: true,
isZy:true, isZy: true,
zyFilterInit: -1, zyFilterInit: -1,
zyRankInit: 0, //0综合 1库存多到少 2//库存少到多 3//价格高到低 4//价格低到高 zyRankInit: 0, //0综合 1库存多到少 2//库存少到多 3//价格高到低 4//价格低到高
classFilter: "", classFilter: "",
...@@ -214,7 +223,7 @@ export default { ...@@ -214,7 +223,7 @@ export default {
isShowRight: false, //是否展示右侧 isShowRight: false, //是否展示右侧
list: [], list: [],
loadingXh: false, loadingXh: false,
p: 0, p: 1,
rightFilterData: {}, rightFilterData: {},
navTopStr: { navTopStr: {
classStr: "", classStr: "",
...@@ -226,7 +235,9 @@ export default { ...@@ -226,7 +235,9 @@ export default {
isScrollShow: false isScrollShow: false
}; };
}, },
created() {}, created() {
this.getDefaultClass();
},
computed: { computed: {
...mapState({ ...mapState({
zyFilter: state => state.xianhuo.zyFilter, zyFilter: state => state.xianhuo.zyFilter,
...@@ -250,7 +261,7 @@ export default { ...@@ -250,7 +261,7 @@ export default {
this.getZyData(); this.getZyData();
}, },
classLight(now) { classLight(now) {
this.secondClass = now.class_id2_list; this.secondClass = now.class_id2_list || [];
this.firstCheckId = now.class_id1; this.firstCheckId = now.class_id1;
this.firstClassName = now.class_id1_name; this.firstClassName = now.class_id1_name;
let index = this.secondClass.findIndex((val, index, arr) => { let index = this.secondClass.findIndex((val, index, arr) => {
...@@ -268,12 +279,38 @@ export default { ...@@ -268,12 +279,38 @@ export default {
} }
}, },
methods: { methods: {
getDefaultClass() {
Services.defaultClass()
.then(res => {
if (res.data.err_code == 0) {
this.classStr = res.data.data;
this.addClassStr = res.data.data;
this.getZyData();
} else {
}
})
.catch(err => {});
},
placeOrder(id) {
this.detailsData = {
isShow: true,
id: id
};
},
scrollEvent(e) { scrollEvent(e) {
if (
this.navTopStr.classStr ||
this.navTopStr.brandStr ||
this.navTopStr.encapStr ||
this.navTopStr.packingStr ||
this.navTopStr.rightStr
) {
if (e.target.scrollTop > 40) { if (e.target.scrollTop > 40) {
this.isScrollShow = true; this.isScrollShow = true;
} else { } else {
this.isScrollShow = false; this.isScrollShow = false;
} }
}
}, },
onLoad() { onLoad() {
this.p++; this.p++;
...@@ -372,7 +409,7 @@ export default { ...@@ -372,7 +409,7 @@ export default {
} }
} }
str = str.slice(1); str = str.slice(1);
console.log(str) console.log(str);
this.navTopStr.rightStr = str; this.navTopStr.rightStr = str;
} }
if (this.rightFilterData.isyh) { if (this.rightFilterData.isyh) {
......
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