You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

381 lines
11 KiB

<template>
<view class="record">
<!-- #ifdef H5 -->
<view class="top_nav acea-row row-center-wrapper">
<view class="navCon acea-row row-middle">
<view class="text" :class="active == 0 ? 'on' : ''" @click="switchTab(0)">购买记录</view>
<view class="text" :class="active == 1 ? 'on2' : ''" @click="switchTab(1)">浏览记录</view>
</view>
</view>
<view class="search acea-row row-center row-middle">
<input type="text" v-model="keywords" class="search_input" placeholder="搜索商品" placeholder-class="text_gray"
@blur="search()">
</view>
<Loading :loaded="loaded" :loading="loading"></Loading>
<view class="goods_list" v-if="goodsList.length">
<view class="item acea-row" v-for="(item,index) in goodsList" :key="index">
<view class="picture">
<image :src="item.image" mode="aspectFit"></image>
</view>
<view class="goods_info acea-row row-column row-between">
<view class="name line2">{{item.store_name}}</view>
<view class="stork acea-row row-between">
<text>库存 {{item.stock}}</text>
<text>销量 {{item.sales}}</text>
<text class="pushFn" @click="pushFn(item)">推送</text>
</view>
</view>
<view class="price_info acea-row row-column row-between">
<text class="price">¥{{item.price}}</text>
</view>
</view>
</view>
<view class="empty-box" v-else>
<image src="../static/shop_record.png" v-if="active == 0"></image>
<image src="../static/view_record.png" v-if="active == 1"></image>
<view>暂无 {{active ? '浏览' : '购买'}}记录</view>
</view>
<view class="ht100"></view>
<tNav :active="2"></tNav>
<!-- #endif -->
</view>
</template>
<script>
// #ifdef H5
import tNav from '../components/tabNav.vue';
import Loading from '@/components/Loading/index.vue';
import {
initWxConfig,
initAgentConfig,
} from "@/libs/work.js";
import {
getWorkCartList,
getWorkVisitInfo,
getWorkAgentConfig
} from "@/api/work.js"
// import {
// wx
// } from "@/utils/agent.js"
export default {
data() {
return {
keywords: "",
userId: "",
loaded: false,
loading: false, //是否加载中
loadend: false, //是否加载完毕
loadTitle: '加载更多', //提示语
goodsList: [], //商品数组
active: 0, //选项状态
page: 1,
limit: 10,
}
},
components: {
Loading,
tNav
},
onLoad() {
this.userId = this.$Cache.get('work_user_id')
this.getList();
getWorkAgentConfig(window.location.href.split('#')[0]).then(res => {
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(navigator.userAgent)){
wx.agentConfig({
corpid: res.data.corpid, // 必填,企业微信的corpid,必须与当前登录的企业一致
agentid: res.data.agentid, // 必填,企业微信的应用id (e.g. 1000247)
timestamp: res.data.timestamp, // 必填,生成签名的时间戳
nonceStr: res.data.nonceStr, // 必填,生成签名的随机串
signature: res.data.signature, // 必填,签名,见附录-JS-SDK使用权限签名算法
jsApiList: ["getCurExternalContact", "getCurExternalChat", "getContext", "chooseImage", "sendChatMessage", ],
success: function(res) {
// console.log(res);
},
});
}else{
jWeixin.agentConfig({
corpid: res.data.corpid, // 必填,企业微信的corpid,必须与当前登录的企业一致
agentid: res.data.agentid, // 必填,企业微信的应用id (e.g. 1000247)
timestamp: res.data.timestamp, // 必填,生成签名的时间戳
nonceStr: res.data.nonceStr, // 必填,生成签名的随机串
signature: res.data.signature, // 必填,签名,见附录-JS-SDK使用权限签名算法
jsApiList: ["getCurExternalContact", "getCurExternalChat", "getContext", "chooseImage", "sendChatMessage", ],
success: function(res) {
// console.log(res);
},
});
}
})
},
methods: {
// 推送到商品详情
pushFn(item) {
if (/(iPhone|iPad|iPod|iOS|macintosh|mac os x)/i.test(navigator.userAgent)){
wx.invoke('sendChatMessage', {
msgtype: "news", //消息类型,必填
enterChat: true, //为true时表示发送完成之后顺便进入会话,仅移动端3.1.10及以上版本支持该字段
news: {
link: location.protocol + '://' + location.host + "/pages/goods_details/index?id=" + item.id, //H5消息页面url 必填
title: item.store_name, //H5消息标题
desc: "", //H5消息摘要
imgUrl: item.image, //H5消息封面图片URL
},
}, function(res) {
if (res.err_msg == 'sendChatMessage:ok') {
console.log('发送成功', res)
//发送成功
} else {
//发送失败
console.log('发送失败', res)
}
})
}else{
jWeixin.invoke('sendChatMessage', {
msgtype: "news", //消息类型,必填
enterChat: true, //为true时表示发送完成之后顺便进入会话,仅移动端3.1.10及以上版本支持该字段
news: {
link: location.protocol + '://' + location.host + "/pages/goods_details/index?id=" + item.id, //H5消息页面url 必填
title: item.store_name, //H5消息标题
desc: "", //H5消息摘要
imgUrl: item.image, //H5消息封面图片URL
},
}, function(res) {
if (res.err_msg == 'sendChatMessage:ok') {
console.log('发送成功', res)
//发送成功
} else {
//发送失败
console.log('发送失败', res)
}
})
}
},
switchTab(index) {
if (this.loading) return
if (index === this.active) return;
this.active = index;
this.loadend = false;
this.page = 1;
this.$set(this, 'goodsList', []);
this.getList();
},
search() {
if (this.loading) return
this.loadend = false;
this.page = 1;
this.$set(this, 'goodsList', []);
this.getList();
},
getList() {
let that = this;
let params = {};
if (that.loadend) return;
if (that.loading) return;
that.loading = true;
that.loadTitle = '加载更多';
params = {
userid: that.userId,
store_name: that.keywords,
page: that.page,
limit: that.limit,
}
if (that.active == 0) {
getWorkCartList(params).then(res => {
let list = res.data || [];
let loadend = list.length < that.limit;
that.goodsList = that.$util.SplitArray(list, that.goodsList);
that.$set(that, 'goodsList', that.goodsList);
that.loadend = loadend;
that.loading = false;
that.loadTitle = loadend ? '没有更多内容啦~' : '加载更多';
that.page = that.page + 1;
}).catch(err => {
return that.$util.Tips({
title: err
});
})
} else if (that.active == 1) {
getWorkVisitInfo(params).then(res => {
let list = res.data || [];
let loadend = list.length < that.limit;
that.goodsList = that.$util.SplitArray(list, that.goodsList);
that.$set(that, 'goodsList', that.goodsList);
that.loadend = loadend;
that.loading = false;
that.loadTitle = loadend ? '没有更多内容啦~' : '加载更多';
that.page = that.page + 1;
}).catch(err => {
return that.$util.Tips({
title: err
});
})
}
}
},
onReachBottom: function() {
this.getList();
}
}
// #endif
</script>
<style lang="scss">
/* #ifdef H5 */
.top_nav {
background: #FFFFFF;
font-size: 28rpx;
// font-family: PingFangSC-Regular, PingFang SC;
// font-weight: 400;
color: #000000;
.navCon{
width: 440rpx;
height: 60rpx;
background: #F4FAFF;
border: 1rpx solid #1A90FE;
border-radius: 30rpx;
margin: 30rpx 0 10rpx 0;
color: #1A90FE;
.text{
width: 50%;
height: 60rpx;
line-height: 60rpx;
text-align: center;
}
.on {
color: #fff;
background-color: #1A90FE;
border-radius: 30rpx 0 0 30rpx;
}
.on2{
color: #fff;
background-color: #1A90FE;
border-radius: 0 30rpx 30rpx 0;
}
}
}
.search {
height: 100rpx;
background: #FFFFFF;
.search_input {
width: 690rpx;
height: 60rpx;
background: #F5F6F9;
border-radius: 34rpx;
padding-left: 20rpx;
}
}
.text_gray {
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #CCCCCC;
text-align: center;
}
.goods_list {
.item {
position: relative;
width: 710rpx;
height: 192rpx;
border-radius: 12rpx;
margin: 20rpx auto 0;
padding: 26rpx 24rpx 26rpx;
box-sizing: border-box;
background: #FFFFFF;
.pushFn {
position: absolute;
bottom: 28rpx;
right: 24rpx;
width: 112rpx;
height: 52rpx;
border-radius: 28rpx;
border: 2rpx solid #1890FF;
font-size: 26rpx;
font-weight: 400;
line-height: 52rpx;
text-align: center;
color: #1890FF;
}
.picture {
width: 140rpx;
height: 140rpx;
border-radius: 8rpx;
image {
width: 100%;
height: 100%;
}
}
.goods_info {
width: 280rpx;
margin-left: 22rpx;
.name {
height: 80rpx;
line-height: 40rpx;
font-size: 28rpx;
color: rgba(0, 0, 0, 0.85);
}
.stork {
font-size: 24rpx;
font-weight: 400;
color: #666666;
}
}
.price_info {
margin-left: 80rpx;
.price {
font-size: 28rpx;
font-weight: 500;
color: #E93323;
}
.send_btn {
width: 112rpx;
height: 52rpx;
display: inline-block;
margin-left: 20rpx;
line-height: 52rpx;
text-align: center;
border-radius: 28rpx;
border: 1px solid #1890FF;
font-size: 26rpx;
font-weight: 400;
color: #1890FF;
}
}
}
}
.empty-box {
height: 600rpx;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
image {
width: 390rpx;
height: 264rpx;
}
}
.ht100 {
height: 120rpx;
}
/* #endif */
</style>