项目之按销量价格排序操作
<el-tabs v-model="activeName" @tab-click="priceFun" >
<el-tab-pane label="按销量排序" name="hot"></el-tab-pane>
<el-tab-pane label="按价格由高到低" name="toLow"></el-tab-pane>
<el-tab-pane label="按价格由低到高" name="toHigh"></el-tab-pane>
</el-tabs>
methods:{
priceFun:function(tab,event){
if(tab.name=="toHigh"){
console.log(tab.name);
function compare(property){
return function(a,b){
var value1 = a[property];
var value2 = b[property];
console.log('价格由高到低');
return value1 - value2;//价由高到低
}
}
return this.productList.sort(compare('price'));
}
else if(tab.name=="toLow"){
function compare(property){
return function(a,b){
var value1 = a[property];
var value2 = b[property];
console.log('价格由高到低');
return value2 - value1;//价由低到高
}
}
return this.productList.sort(compare('price'));
}
else if(tab.name=="hot"){
function compare(property){
return function(a,b){
var value1 = a[property];
var value2 = b[property];
console.log('价格由高到低');
return value1 - value2;//按销量
}
}
console.log("按销量");
return this.productList.sort(compare('pid'));
}
},
添加购物车模块
<el-button :type="item.buttonType" class="toCart"
@click="toCar(item)" :disabled="item.isDisabled">{{item.buttonText}}</el-button>
toCar(item){
console.log("哈哈哈哈哈哈");
var uname=document.cookie.split(";")[0].split("=")[1];
if(uname=="undefined"||uname==undefined){
this.$alert('你好!请登录', '加入购物车失败', {
confirmButtonText: '去登录',
callback: action => {
window.location.href="http://localhost:8080/#/login";
return ;
}
});
}else{
var params = new URLSearchParams()
params.append('uname', uname);
params.append('pid', item.pid);
axios.post("http://localhost/to_cart.php",params)
.then(res=>{
console.log(res);
if(res.data.result==true||res.data.result=="true"){
const h = this.$createElement;
this.$notify({
title: '提示',
message: h('i', { style: 'color: teal'}, '宝贝已加入购物车'),
duration:2000
});
item.buttonType="success";
item.isDisabled=true;
item.buttonText="已加入购物车";
}else{
alert("添加失败!");
}
})
}
}