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.
306 lines
7.7 KiB
306 lines
7.7 KiB
7 months ago
|
<template>
|
||
|
<view class="content">
|
||
|
<!-- <view class="bgtoptxt" @click="$getpage('/pages/index/foodList')">查看全部</view> -->
|
||
|
<view class="bgtop" v-if="xllist.midPic!=''" :style="{background: 'url('+$geturl(xllist.midPic)+') no-repeat'}"></view>
|
||
|
<!-- <view class="bgtop" v-if="xllist.midPic==''" :style="{background: 'url('+getImg3('960noimg.png')+') no-repeat'}"></view> -->
|
||
|
<image v-if="xllist.channel_id==117||xllist.channel_id==116" @click="toOther()" class="yudingimg" :src="$getimg('lijigoumai.png')" mode="aspectFill"></image>
|
||
|
<view class="bgboxs">
|
||
|
<view class="xwtitle">
|
||
|
<view class="tit">
|
||
|
<view class="icon">
|
||
|
<image v-if="xllist.channel_id==92" :src="$getimg('wf-x-ms-icon.png')" mode=""></image> <!-- 美食 -->
|
||
|
<image v-if="xllist.channel_id==121" :src="$getimg('wf-x-tc-icon.png')" mode=""></image> <!-- 特产 -->
|
||
|
<image v-if="xllist.channel_id==76" :src="$getimg('icon-yyyc.png')" mode=""></image> <!-- 非遗 -->
|
||
|
<image v-if="xllist.channel_id==116" :src="$getimg('wf-x-wc-icon.png')" mode=""></image> <!-- 文创 -->
|
||
|
</view>
|
||
|
<view class="titwz">{{xllist.title }}</view>
|
||
|
</view>
|
||
|
<!-- <view class="xqtimeright" style="right: 150rpx;display: flex;align-items: center;">
|
||
|
<image :src="$getimg('icon-sc.png')" mode="" class="xwdzimg" style="margin-right: 10rpx;"></image>
|
||
|
{{xllist.collectCount}}
|
||
|
</view> -->
|
||
|
<view class="xqtimeright">
|
||
|
<text class="sjsj">{{xllist.upsNum}}</text>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="xwnr">
|
||
|
<view class="xwnrdiv" v-html="xllist.content"></view>
|
||
|
</view>
|
||
|
<view class="xwdzAllfotter">
|
||
|
<view :class="['xwdzAll',!candz?'active':'']" @click="dzsclick">
|
||
|
<image :src="!candz?$getimg('icon-dzxz.png'):$getimg('icon-dianzhan.png')" mode="" class="xwdzimg"></image>
|
||
|
<view :class="['xwdzsl',!candz?'active':'']">{{ xllist.upsNum}}</view>
|
||
|
</view>
|
||
|
<!-- <view :class="['xwdzAll',xllist.isCollect?'active':'']" style="margin-left: 20rpx;" @click="soucan">
|
||
|
<image :src="xllist.isCollect?$getimg('icon-scxz.png'):$getimg('icon-sc.png')" mode="" class="xwdzimg"></image>
|
||
|
<view :class="['xwdzsl',xllist.isCollect?'active':'']">{{ xllist.collectCount}}</view>
|
||
|
</view> -->
|
||
|
</view>
|
||
|
</view>
|
||
|
<pingjia :info="pjinfo"></pingjia>
|
||
|
</view>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
var web = require('@/components/utils/request.js');
|
||
|
import pingjia from '@/components/utils/zixunpj.vue';
|
||
|
export default {
|
||
|
components:{pingjia},
|
||
|
data() {
|
||
|
return {
|
||
|
id: 0,
|
||
|
xllist: {},
|
||
|
candz:true, //是否可以点赞
|
||
|
dzarr:[], //点赞缓存列表
|
||
|
pjinfo: {
|
||
|
id: ''
|
||
|
},
|
||
|
};
|
||
|
},
|
||
|
onLoad(option) {
|
||
|
this.id = option.id;
|
||
|
this.pjinfo.id=option.id;
|
||
|
var pages = getCurrentPages();
|
||
|
var page = pages[pages.length - 1].route;
|
||
|
// this.share.path='/'+page+'?id='+this.id;
|
||
|
// this.shareline.query={id:this.id}
|
||
|
this.getdatas();
|
||
|
try {
|
||
|
let tmpstr = uni.getStorageSync('dianzan'); //获取缓存中的点赞列表
|
||
|
if(tmpstr){
|
||
|
this.dzarr = tmpstr.split(',');
|
||
|
}
|
||
|
if(this.dzarr.indexOf(this.id) > -1){ //判断是否点赞过
|
||
|
this.candz = false; //点赞过则不能点
|
||
|
}
|
||
|
} catch (e) {
|
||
|
this.candz = true;
|
||
|
}
|
||
|
},
|
||
|
onReady() {},
|
||
|
onShareAppMessage() {},
|
||
|
methods: {
|
||
|
|
||
|
getImg(url) {
|
||
|
return 'https://cs.tour-ma.com' + url;
|
||
|
},
|
||
|
getdatas() {
|
||
|
//获取数据
|
||
|
var para = {
|
||
|
id: this.id
|
||
|
};
|
||
|
var url = '/newsdetail.jspx';
|
||
|
var that = this;
|
||
|
web.httpPost(that, url, para, function(res) {
|
||
|
if (res.data.status == 200) {
|
||
|
var tmp = res.data;
|
||
|
if(tmp.content!=undefined){
|
||
|
tmp.content = tmp.content.replace(/src="/gi, 'src="https://cs.tour-ma.com');
|
||
|
|
||
|
tmp.content = tmp.content.replace(/<img[^>]*>/gi, function(match, capture) {
|
||
|
return match.replace(/style\s*?=\s*?([‘"])[\s\S]*?\1/gi, 'style="max-width:100%;height:auto;width:100%;"'); // 替换style
|
||
|
});
|
||
|
tmp.content = tmp.content.replace(/<img[^>]*>/gi, function(match, capture) {
|
||
|
return match.replace(/<img /gi, '<img style="max-width:100%;height:auto;width:100%;"'); // 替换style
|
||
|
});
|
||
|
}
|
||
|
that.xllist = tmp;
|
||
|
}
|
||
|
});
|
||
|
},
|
||
|
soucan(id){
|
||
|
if(this.xllist.isCollect){
|
||
|
var type=2;
|
||
|
}else{
|
||
|
var type=1;
|
||
|
}
|
||
|
var url='/content/add_collections.jspx';
|
||
|
var para={
|
||
|
contentId:this.xllist.id,
|
||
|
type:type//1-收藏, 2-取消收藏
|
||
|
}
|
||
|
var that=this;
|
||
|
web.httpPost(that,url,para,function(res){
|
||
|
that.getdatas();
|
||
|
})
|
||
|
},
|
||
|
dzsclick() {
|
||
|
if(!this.candz){return}
|
||
|
//点赞缓存处理
|
||
|
try {
|
||
|
if(this.dzarr.indexOf(this.id) > -1){
|
||
|
this.candz = false;
|
||
|
}else{
|
||
|
this.dzarr.push(this.id);
|
||
|
uni.setStorageSync('dianzan',this.dzarr.toString()); //加到缓存数组里
|
||
|
this.candz = false; //改为不能点
|
||
|
}
|
||
|
} catch (e) {
|
||
|
this.candz = true;
|
||
|
}
|
||
|
var url = '/content_up.jspx?contentId=' + this.id;
|
||
|
var para = {};
|
||
|
var that = this;
|
||
|
web.httpGejqr(that, url, para, function(res) {
|
||
|
uni.showToast({
|
||
|
title: '点赞成功!'
|
||
|
});
|
||
|
that.getdatas();
|
||
|
});
|
||
|
},
|
||
|
toOther(){
|
||
|
uni.navigateToMiniProgram({
|
||
|
appId:'wx8ece732cc3a87e0f',
|
||
|
path:'pages/index/index',
|
||
|
envVersion:'release',
|
||
|
extraData: {
|
||
|
},
|
||
|
success(res) {
|
||
|
console.log("chenggong");
|
||
|
},
|
||
|
fail(e){
|
||
|
console.log(e);
|
||
|
}
|
||
|
})
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss">
|
||
|
$url:'https://cs.tour-ma.com/r/cms/www/m/changshu/';
|
||
|
page {
|
||
|
background: #ffffff;
|
||
|
}
|
||
|
.content {
|
||
|
width: 750rpx;
|
||
|
// padding-top: 30upx;
|
||
|
overflow-x: hidden;
|
||
|
.bgtoptxt{
|
||
|
font-size: 26upx;
|
||
|
font-weight: 500;
|
||
|
color: #FFFFFF;
|
||
|
background: linear-gradient(0deg, #3269F7 0%, #4A9AF9 100%);
|
||
|
border-radius: 26upx;
|
||
|
width: 160upx;
|
||
|
height: 56upx;
|
||
|
line-height: 56upx;
|
||
|
text-align: center;
|
||
|
margin: 0upx 0 30upx 30upx;
|
||
|
}
|
||
|
.bgtop{
|
||
|
width: 100%;
|
||
|
height: 460upx;
|
||
|
background-size: 100% 100% !important;
|
||
|
}
|
||
|
.bgboxs{
|
||
|
width: 100%;
|
||
|
margin: -40rpx auto 0;
|
||
|
background: #fff;
|
||
|
border-radius: 30rpx 30rpx 0rpx 0rpx;
|
||
|
.xwtitle {
|
||
|
font-size: 40upx;
|
||
|
font-weight: bold;
|
||
|
color: #333333;
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
padding: 50rpx 20rpx 0;
|
||
|
position: relative;
|
||
|
.tit{
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
}
|
||
|
.icon{
|
||
|
width: 62upx;
|
||
|
height: 56upx;
|
||
|
margin-right: 10rpx;
|
||
|
image{
|
||
|
display: block;
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
.xqtimeright {
|
||
|
font-size: 24rpx;
|
||
|
position: absolute;
|
||
|
right: 50rpx;
|
||
|
image{
|
||
|
width: 28rpx;
|
||
|
height: 28rpx;
|
||
|
}
|
||
|
}
|
||
|
.xqtimeright .sjsj::before {
|
||
|
content: '';
|
||
|
display: inline-block;
|
||
|
width: 28rpx;
|
||
|
height: 28rpx;
|
||
|
background: url( $url+"icon-dianzhan.png") no-repeat;
|
||
|
background-size: 100% auto;
|
||
|
margin-right: 10rpx;
|
||
|
margin-top: -9rpx;
|
||
|
vertical-align: middle;
|
||
|
}
|
||
|
.xwnr {
|
||
|
font-size: 24upx;
|
||
|
font-weight: 500;
|
||
|
color: #666;
|
||
|
width: 90%;
|
||
|
margin: 30upx auto 0 auto;
|
||
|
line-height: 1.6;
|
||
|
.xwnrdiv {
|
||
|
margin: 0rpx 0rpx 55rpx 0rpx;
|
||
|
line-height: 2;
|
||
|
}
|
||
|
}
|
||
|
.xwdzAllfotter {
|
||
|
display: flex;
|
||
|
flex-direction: row;
|
||
|
align-items: center;
|
||
|
justify-content: center;
|
||
|
margin-bottom: 40rpx;
|
||
|
.xwdzAll {
|
||
|
overflow: hidden;
|
||
|
border: 1rpx solid #d6d6d6;
|
||
|
border-radius: 35rpx;
|
||
|
display: flex;
|
||
|
flex-direction: row;
|
||
|
align-items: center;
|
||
|
width: 155rpx;
|
||
|
justify-content: center;
|
||
|
height: 70rpx;
|
||
|
.xwdzimg {
|
||
|
width: 32rpx;
|
||
|
height: 32rpx;
|
||
|
float: left;
|
||
|
margin-right: 10rpx;
|
||
|
}
|
||
|
.xwdzsl {
|
||
|
font-size: 28rpx;
|
||
|
font-family: Microsoft YaHei;
|
||
|
font-weight: bold;
|
||
|
color: #111111;
|
||
|
margin: 0rpx 0rpx 0rpx 18rpx;
|
||
|
float: left;
|
||
|
&.active {
|
||
|
color: #ff3335;
|
||
|
}
|
||
|
}
|
||
|
&.active{
|
||
|
border: 1rpx solid #ff3334;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
.yudingimg{
|
||
|
width: 110rpx;
|
||
|
height: 110rpx;
|
||
|
position: fixed;
|
||
|
top: 278rpx;
|
||
|
right: 50rpx;
|
||
|
z-index: 999;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
</style>
|