123 lines
2.9 KiB
HTML
123 lines
2.9 KiB
HTML
<script type="text/x-template" id="ms-mattention">
|
||
<div class="interaction-like interaction-btn" :class="{thumbsUpchecked:thumbsUp == true}">
|
||
<i :class="icon" @click="saveAttention()"></i>
|
||
<span class="value">
|
||
{{attentionTotal}}
|
||
</span>
|
||
</div>
|
||
</script>
|
||
<script>
|
||
Vue.component('ms-mattention',{
|
||
template: "#ms-mattention",
|
||
name: "ms-mattention",
|
||
props:{
|
||
// 业务编号
|
||
dataId:{
|
||
type: String
|
||
},
|
||
// 类型
|
||
dataType:{
|
||
type: String
|
||
},
|
||
// 图标
|
||
icon:{
|
||
type: String
|
||
},
|
||
// 标题
|
||
label:{
|
||
type: String
|
||
}
|
||
},
|
||
data: function(){
|
||
return{
|
||
// 数量
|
||
attentionTotal: 0,
|
||
thumbsUp: false,
|
||
}
|
||
},
|
||
methods: {
|
||
// 保存
|
||
saveAttention: function () {
|
||
var that = this
|
||
ms.http.post( ms.base + "/people/attention/collection/save.do", {
|
||
dataId: that.dataId,
|
||
dataType: that.dataType,
|
||
collectionDataTitle: that.label,
|
||
}).then(function (res) {
|
||
if (res.result) {
|
||
that.attentionTotals(that.dataType)
|
||
that.thumbsUp = res.data;
|
||
}
|
||
});
|
||
},
|
||
// 关注数量
|
||
attentionTotals: function (dataType) {
|
||
var that = this;
|
||
//用户-关注接口
|
||
ms.http.post(ms.base + "/attention/collection/queryCollectionCount.do", {
|
||
dataIds: that.dataId,
|
||
dataType: dataType
|
||
}).then(function (res) {
|
||
if(res.result && res.data.rows.length > 0){
|
||
that.attentionTotal = 0;
|
||
res.data.rows.forEach(function (item) {
|
||
if (item.dataId == that.dataId) {
|
||
that.attentionTotal = item.dataCount;
|
||
if (item.isLike) {
|
||
that.thumbsUp = item.isLike;
|
||
}
|
||
}
|
||
})
|
||
} else {
|
||
that.attentionTotal = 0
|
||
}
|
||
}).catch(function (err) {
|
||
that.$notify({
|
||
title: '提示',
|
||
dangerouslyUseHTMLString: true,
|
||
message: '需要安装关注插件才能使用，请先进入后台MStore安装关注插件使用。<span style="color: #409EFF; text-decoration: underline;">'
|
||
+'<a href="http://store.mingsoft.net/#/detail?id=265&type=plugin" target="_blank">点击查看关注插件</a></span>',
|
||
type: 'warning'
|
||
});
|
||
})
|
||
},
|
||
},
|
||
created: function () {
|
||
this.icon = "iconfont "+this.icon+" label"
|
||
this.attentionTotals(this.dataType)
|
||
}
|
||
})
|
||
</script>
|
||
<style scoped>
|
||
.news-detail .detail-bottom-interaction .interaction-like {
|
||
min-height: 50px;
|
||
margin-right: 20px;
|
||
align-items: center;
|
||
flex-wrap: nowrap;
|
||
flex-direction: row;
|
||
display: flex;
|
||
flex-shrink: 0;
|
||
width: unset;
|
||
box-sizing: border-box;
|
||
margin-top: 0px;
|
||
height: 100%;
|
||
}
|
||
|
||
.news-detail .detail-bottom-interaction .interaction-like .label {
|
||
margin-right: 5px;
|
||
font-size: 28PX;
|
||
margin-top: -8px;
|
||
}
|
||
|
||
.news-detail .detail-bottom-interaction .interaction-like .value {
|
||
margin-right: 0px;
|
||
flex-direction: row;
|
||
word-wrap: break-word;
|
||
display: inline-block;
|
||
}
|
||
|
||
.interaction-btn {
|
||
cursor: pointer;
|
||
}
|
||
</style>
|