134 lines
3.5 KiB
Vue
134 lines
3.5 KiB
Vue
<template>
|
||
<view>
|
||
<view class="products_box">
|
||
<u-grid :border="false" col="2">
|
||
<u-grid-item v-for="(item,index) in productList" :key="index">
|
||
<u-image src="/static/products/sy_bb.png" width="354rpx" height="539rpx" :lazy-load="true">
|
||
</u-image>
|
||
<view class="bgContent">
|
||
<view>
|
||
<u-image :src="imgUrl+item.cover" width="346rpx" height="320rpx" :lazy-load="true"
|
||
@click="toDetailPage()">
|
||
</u-image>
|
||
<view class="img_tag">{{item.cate_name}}</view>
|
||
</view>
|
||
<view style="padding: 14rpx 22rpx;">
|
||
<view class="title_box">
|
||
<text class="title">{{item.name}}</text>
|
||
<u-tag :text="item.tags" type="warning" shape="circle"></u-tag>
|
||
</view>
|
||
<view class="product_desc">
|
||
{{item.title}}
|
||
</view>
|
||
<view class="releaseDate">
|
||
<u-image src="/static/products/xp_icon_sjf.png" width="22rpx" height="22rpx"
|
||
:lazy-load="true">
|
||
</u-image>
|
||
<text class="release">发布日期：</text>
|
||
<text>{{item.create_time}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<u-button v-if="type==1" type="success" text="移除" color="#0EBB5B" @click="showModal()"></u-button>
|
||
<u-button v-if="type==2" type="success" text="取消收藏" color="#0EBB5B" @click="showModal()"></u-button>
|
||
</u-grid-item>
|
||
</u-grid>
|
||
<u-modal :show="showM" :content="content" showCancelButton closeOnClickOverlay="false" @confirm="confirm"
|
||
@cancel="cancel">
|
||
</u-modal>
|
||
<view style="font-size: 24rpx;color: #A3A3A3;text-align: center;padding: 26rpx 0;"
|
||
v-if="type==1&&productList.length==0">
|
||
暂无更多浏览记录</view>
|
||
<view style="font-size: 24rpx;color: #A3A3A3;text-align: center;padding: 26rpx 0;"
|
||
v-if="type==2&&productList.length==0">
|
||
暂无更多收藏记录</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
dateFormatHistory
|
||
} from '../../utills/date.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
productId: '',
|
||
imgUrl: '',
|
||
tagsArray: [],
|
||
productList: [],
|
||
showM: false,
|
||
content: '您确定移除吗?',
|
||
productList: []
|
||
}
|
||
},
|
||
props: {
|
||
type: String
|
||
},
|
||
options: {
|
||
styleIsolation: 'shared', // 解除样式隔离
|
||
},
|
||
created() {
|
||
this.getHistoryOrCollection()
|
||
this.imgUrl = uni.getStorageSync('img_url')
|
||
},
|
||
methods: {
|
||
//获取历史记录
|
||
getHistoryOrCollection() {
|
||
this.$apiServe.getHistoryOrCollection(this.type).then(res => {
|
||
let data = res.data.data
|
||
for (const item of data) {
|
||
let tag = item.tags
|
||
this.tagsArray = tag.split(',')
|
||
item.tags = this.tagsArray[0]
|
||
item.create_time = dateFormatHistory(item.create_time)
|
||
}
|
||
// console.log('获取历史记录', res.data);
|
||
this.productId = data.id
|
||
this.productList = data
|
||
}).finally(_ => {
|
||
|
||
})
|
||
},
|
||
//移除按钮
|
||
showModal() {
|
||
this.showM = true
|
||
},
|
||
confirm() {
|
||
this.showM = false
|
||
this.$apiServe.deleteHistoryOrCollection(this.productId).then(res => {
|
||
// console.log('删除历史记录或收藏', res.data);
|
||
this.productList.splice(this.productId, 1)
|
||
}).finally(_ => {})
|
||
},
|
||
cancel() {
|
||
this.showM = false
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="less">
|
||
.u-modal__content {
|
||
padding: 43rpx 104rpx !important;
|
||
text-indent: 25rpx;
|
||
}
|
||
|
||
.u-button {
|
||
width: 150rpx !important;
|
||
height: 50rpx !important;
|
||
background: #0EBB5B;
|
||
border-radius: 10rpx !important;
|
||
margin-top: 22rpx;
|
||
margin-bottom: 50rpx;
|
||
}
|
||
|
||
.u-button__text {
|
||
font-size: 24rpx !important;
|
||
font-weight: 400;
|
||
color: #FFFFFF;
|
||
line-height: 33px;
|
||
|
||
}
|
||
</style>
|