344 lines
8.2 KiB
Vue
344 lines
8.2 KiB
Vue
<template>
|
|
<view class="myTracks" v-if="refresh">
|
|
<empty v-if="nomsg"></empty>
|
|
<view v-else v-for="(item, index) in list" :key="index">
|
|
<view class="myTracks-title" @click="gostore(item)">{{item.storeName}}</view>
|
|
<view class="myTracks-items">
|
|
<view class="myTracks-item">
|
|
<u-checkbox-group>
|
|
<u-checkbox v-model="item.___isDel" v-if="editFlag" active-color="#ff6b35" style="margin-right: 10rpx" @change="changeChecked(item)"></u-checkbox>
|
|
</u-checkbox-group>
|
|
<view class="myTracks-item-img" @click.stop="goDetail(item)">
|
|
<image :src="item.thumbnail"></image>
|
|
</view>
|
|
<view class="myTracks-item-content" @click.stop="goDetail(item)">
|
|
<view class="myTracks-item-title">
|
|
{{ item.goodsName }}
|
|
<view class="myTracks-item-title-desc"> </view>
|
|
</view>
|
|
<view class="myTracks-item-price">
|
|
￥{{ item.price | unitPrice }}
|
|
</view>
|
|
<!-- <view class="myTracks-item-btn" @click.stop="goSimilar(item)">
|
|
找相似
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="myTracks-divider"></view>
|
|
</view>
|
|
<uni-load-more :status="loadStatus"></uni-load-more>
|
|
<view v-if="editFlag">
|
|
<view class="myTracks-action-placeholder"></view>
|
|
<view class="myTracks-action">
|
|
<view class="myTracks-action-check">
|
|
<u-checkbox-group>
|
|
<u-checkbox v-model="allChecked" v-if="editFlag" active-color="#ff6b35" style="margin-right: 10rpx" @change="checkedAllitem"></u-checkbox>
|
|
全选
|
|
</u-checkbox-group>
|
|
</view>
|
|
|
|
<view>
|
|
<u-button type="warning" plain="true" @click="delAllTracks" class="myTracks-action-btn">
|
|
删除
|
|
</u-button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { myTrackList, deleteHistoryListId } from "@/api/members.js";
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
editFlag: false,
|
|
allChecked: false,
|
|
loadStatus: "more",
|
|
nomsg: false,
|
|
params: {
|
|
pageNumber: 1,
|
|
pageSize: 10,
|
|
},
|
|
refresh: true,
|
|
list: [],
|
|
};
|
|
},
|
|
onPullDownRefresh() {
|
|
this.params.pageNumber = 1;
|
|
this.list = [];
|
|
this.getList();
|
|
},
|
|
onReachBottom() {
|
|
if (this.loadStatus != "noMore") {
|
|
this.params.pageNumber++;
|
|
this.getList();
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.getList();
|
|
},
|
|
methods: {
|
|
gostore(val) {
|
|
uni.navigateTo({
|
|
url: "/pages/product/shopPage?id=" + val.storeId,
|
|
});
|
|
},
|
|
setStyle(text) {
|
|
//导航按钮文本设置
|
|
let pages = getCurrentPages();
|
|
let page = pages[pages.length - 1];
|
|
// #ifdef APP-PLUS
|
|
let currentWebview = page.$getAppWebview();
|
|
let titleNView = currentWebview.getStyle().titleNView;
|
|
titleNView.buttons[0].text = text;
|
|
if (text == "完成") {
|
|
this.list.forEach((key) => {
|
|
key.history.forEach((item) => {
|
|
this.$set(item, "___isDel", false);
|
|
});
|
|
});
|
|
}
|
|
currentWebview.setStyle({
|
|
titleNView: titleNView,
|
|
});
|
|
// #endif
|
|
// #ifdef H5
|
|
// h5 临时方案
|
|
document.getElementsByClassName("uni-btn-icon")[1].innerText = text;
|
|
// #endif
|
|
},
|
|
goDetail(item) {
|
|
//跳转详情
|
|
uni.navigateTo({
|
|
url: "/pages/product/goods?id=" + item.id + "&goodsId=" + item.goodsId,
|
|
});
|
|
},
|
|
goSimilar(item) {
|
|
//找相似
|
|
uni.navigateTo({
|
|
url:
|
|
"/pages/user/similaritem?item=" +
|
|
encodeURIComponent(JSON.stringify(item)),
|
|
});
|
|
},
|
|
getList() {
|
|
uni.showLoading({
|
|
title: "加载中",
|
|
});
|
|
myTrackList(this.params).then((res) => {
|
|
uni.stopPullDownRefresh();
|
|
uni.hideLoading();
|
|
if (res.statusCode == 200) {
|
|
res.data.result &&
|
|
res.data.result.forEach((item) => {
|
|
item.___isDel = false;
|
|
});
|
|
|
|
let data = res.data.result;
|
|
if (data.total == 0) {
|
|
this.nomsg = true;
|
|
} else if (data.total < 10) {
|
|
this.loadStatus = "noMore";
|
|
this.list.push(...data);
|
|
} else {
|
|
this.list.push(...data);
|
|
if (data.length < 10) this.loadStatus = "noMore";
|
|
}
|
|
}
|
|
});
|
|
},
|
|
changeChecked(val) {
|
|
//点击后判断是不是全选
|
|
console.log(val);
|
|
const isCheckedAll = this.list.every((key) => {
|
|
console.log(key);
|
|
return key.___isDel == val.___isDel;
|
|
});
|
|
this.allChecked = isCheckedAll;
|
|
},
|
|
checkedAllitem() {
|
|
//全选按钮
|
|
this.list.forEach((key) => {
|
|
this.$set(key, "___isDel", this.allChecked);
|
|
});
|
|
},
|
|
delAllTracks() {
|
|
let way = [];
|
|
this.list.forEach((key) => {
|
|
if (key.___isDel) {
|
|
way.push(key.goodsId);
|
|
}
|
|
});
|
|
if (way.length == 0) return false;
|
|
deleteHistoryListId(way).then((res) => {
|
|
if (res.data.code == 200) {
|
|
this.list = [];
|
|
|
|
this.allChecked = false;
|
|
|
|
this.getList();
|
|
} else {
|
|
uni.showToast({
|
|
title: res.data.message,
|
|
duration: 2000,
|
|
icon: "none",
|
|
});
|
|
}
|
|
});
|
|
},
|
|
},
|
|
onNavigationBarButtonTap(e) {
|
|
if (!this.editFlag) {
|
|
this.setStyle("完成");
|
|
} else {
|
|
this.setStyle("编辑");
|
|
}
|
|
this.editFlag = !this.editFlag;
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.myTracks {
|
|
width: 100%;
|
|
padding-top: 2rpx;
|
|
}
|
|
|
|
.myTracks-title {
|
|
width: 100%;
|
|
height: 110rpx;
|
|
padding-left: 20rpx;
|
|
font-size: 28rpx;
|
|
color: #666;
|
|
font-weight: bold;
|
|
background-color: #fff;
|
|
align-items: center;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
}
|
|
|
|
.myTracks-items {
|
|
padding-top: 2rpx;
|
|
align-items: center;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.myTracks-item {
|
|
width: 100%;
|
|
height: 226rpx;
|
|
padding-left: 20rpx;
|
|
padding-right: 20rpx;
|
|
margin-bottom: 2rpx;
|
|
// border-radius: 6/@px;
|
|
background-color: #fff;
|
|
position: relative;
|
|
align-items: center;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
}
|
|
|
|
.myTracks-item-img {
|
|
margin-right: 20rpx;
|
|
border-radius: 8rpx;
|
|
image {
|
|
width: 130rpx;
|
|
height: 130rpx;
|
|
border-radius: 8rpx;
|
|
}
|
|
}
|
|
|
|
.myTracks-item-content {
|
|
}
|
|
|
|
.myTracks-item-title {
|
|
font-size: 28rpx;
|
|
color: #333;
|
|
}
|
|
|
|
.myTracks-item-title-desc {
|
|
font-size: 28rpx;
|
|
color: #999;
|
|
}
|
|
|
|
.myTracks-item-price {
|
|
font-size: 28rpx;
|
|
color: $light-color;
|
|
padding: 10rpx 0 0 0;
|
|
}
|
|
|
|
.myTracks-item-price-now {
|
|
font-size: 28rpx;
|
|
color: $light-color;
|
|
margin: 0 10rpx;
|
|
}
|
|
|
|
.myTracks-item-price-origin {
|
|
font-size: 28rpx;
|
|
color: #999;
|
|
-webkit-text-decoration-line: line-through;
|
|
text-decoration-line: line-through;
|
|
text-decoration: line-through;
|
|
}
|
|
|
|
.myTracks-item-btn {
|
|
position: absolute;
|
|
right: 20rpx;
|
|
bottom: 20rpx;
|
|
width: 120rpx;
|
|
height: 42rpx;
|
|
background-color: #fff;
|
|
border: 1px solid $aider-light-color;
|
|
border-radius: 10rpx;
|
|
font-size: 24rpx;
|
|
color: $aider-light-color;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.myTracks-action-btn {
|
|
width: 130rpx;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
}
|
|
|
|
.myTracks-divider {
|
|
width: 100%;
|
|
height: 20rpx;
|
|
}
|
|
|
|
.myTracks-action-placeholder {
|
|
height: 110rpx;
|
|
}
|
|
|
|
.myTracks-action {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
height: 100rpx;
|
|
padding: 0 20rpx;
|
|
box-sizing: border-box;
|
|
background-color: #fff;
|
|
align-items: center;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.myTracks-action-check {
|
|
align-items: center;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
}
|
|
</style>
|