123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301 |
- <template>
- <view class="content">
- <view class="detail-cont">
- <view class="title">{{item.title}}</view>
- <view class="info">
- <view class="reads">阅读数:{{item.views}}</view>
- <view class="time">{{item.createTime}}</view>
- </view>
- <!-- 正文 -->
- <view class="full-text">
- <view v-html="item.answers"></view>
- </view>
- </view>
- <view class="ad">
- <u-swiper
- :list="advImgs"
- indicator
- indicatorMode="line"
- circular
- @click="handleAdvClick"
- ></u-swiper>
- </view>
-
- </view>
- </template>
- <script>
- import {getAdvList} from '@/api/adv.js'
- import {getQuestionsById} from '@/api/index'
- export default {
- data() {
- return {
- advs:[],
- advImgs:[],
- id:null,
- item:{},
- };
- },
- onLoad(option) {
- this.id=option.id;
-
- },
- onShow() {
- this.getAdvList();
- this.getQuestionsById();
- },
- onShareAppMessage(res) {
- if(this.$isLogin()){
- return {
- title: this.item.vesselName,
- path: '/pages_index/questionsDetails?id='+this.id,
- imageUrl: 'https://hos-1309931967.cos.ap-chongqing.myqcloud.com/fs/20230106/6b459adfb1004c1a96219bcdf07e337c.png' //分享图标,路径可以是本地文件路径、代码包文件路径或者网络图片路径.支持PNG及JPG。显示图片长宽比是 5:4
- }
- }
-
- },
- //分享到朋友圈
- onShareTimeline(res) {
- if(this.utils.isLogin()){
- return {
- title: this.item.title,
- imageUrl: 'https://hos-1309931967.cos.ap-chongqing.myqcloud.com/fs/20230106/6b459adfb1004c1a96219bcdf07e337c.png' //分享图标,路径可以是本地文件路径、代码包文件路径或者网络图片路径.支持PNG及JPG。显示图片长宽比是 5:4
- }
- }
-
- },
- methods:{
- handleAdvClick(index){
- var ad=this.advs[index];
- console.log(ad.advUrl);
- if(ad.showType==1){
- uni.setStorageSync('url',ad.advUrl);
- uni.navigateTo({
- url:"h5"
- })
- }
- else if(ad.showType==2){
- uni.navigateTo({
- url:ad.advUrl
- })
- }
- else if(ad.showType==3){
- uni.setStorageSync('content',ad.content);
- uni.navigateTo({
- url:"content"
- })
- }
-
- },
- getAdvList() {
- //联网加载数据
- var that = this;
- var data = {
- advType:6
- };
- getAdvList(data).then(res => {
- if(res.code==200){
- that.advImgs=[];
- that.advs=[];
- res.data.forEach(function(element) {
- if(element.imageUrl!=null&&element.imageUrl!=""){
- that.advs.push(element);
- that.advImgs.push(element.imageUrl);
- }
- });
-
- }else{
- uni.showToast({
- icon:'none',
- title: "请求失败",
- });
- }
- });
- },
- getQuestionsById(){
- let data = {id:this.id};
- getQuestionsById(data).then(
- res => {
- if(res.code==200){
- this.item=res.data;
- }else{
- uni.showToast({
- icon:'none',
- title: "请求失败",
- });
- }
- },
- rej => {}
- );
- },
- }
- }
- </script>
- <style lang="scss">
- page{
- height: 100%;
- }
- .content{
- height: 100%;
- display: flex;
- flex-direction: column;
- }
- .detail-cont{
- flex: 1;
- padding: 40upx;
- overflow-y: auto;
- .title{
- font-size: 40upx;
- font-family: PingFang SC;
- // font-weight: bold;
- color: #222222;
- line-height: 70upx;
- }
- .info{
- display: flex;
- align-items: center;
- font-size: 24upx;
- font-family: PingFang SC;
- font-weight: 500;
- color: #999999;
- line-height: 48upx;
- margin: 23upx 0;
- .reads{
- margin-right: 30upx;
- }
- }
- .full-text{
- font-size: 36upx;
- font-family: PingFang SC;
- // font-weight: 500;
- color: #222222;
- line-height: 60upx;
- }
- }
- .ad{
- margin-bottom: 50rpx;
- width: 100%;
- padding: 15rpx;
-
- }
- .recent-reads{
- flex-shrink: 0;
- box-sizing: border-box;
- height: 121upx;
- background: #FFFFFF;
- border-top: 1px solid #F0F0F0;
- padding: 0 40upx 0 37upx;
- display: flex;
- align-items: center;
- justify-content: space-between;
- .left{
- display: flex;
- align-items: center;
- .label{
- font-size: 28upx;
- font-family: PingFang SC;
- font-weight: 500;
- color: #666666;
- line-height: 1;
- margin-right: 20upx;
- }
- .peop-box{
- display: flex;
- align-items: center;
- .head-box{
- margin-right: 28upx;
- display: flex;
- align-items: center;
- .head{
- width: 48upx;
- height: 48upx;
- border-radius: 50%;
- overflow: hidden;
- box-shadow: 0 0 0 1px #fff;
- margin-right: -10upx;
- image{
- width: 100%;
- height: 100%;
- }
- }
- }
- .arrow{
- width: 13upx;
- height: 23upx;
- }
- }
- }
- .share-btn{
- position: relative;
- width: 240upx;
- height: 80upx;
- line-height: 80upx;
- font-size: 30upx;
- font-family: PingFang SC;
- font-weight: 500;
- color: #FFFFFF;
- background: #C39A58;
- border-radius: 40upx;
- display: flex;
- align-items: center;
- justify-content: center;
- image{
- width: 32upx;
- height: 32upx;
- margin-right: 15upx;
- }
- .share{
- position: absolute;
- width: 100%;
- height: 100%;
- opacity: 0;
- }
- }
- }
- .inquiry{
- width: 131upx;
- height: 131upx;
- position: fixed;
- right: 22upx;
- bottom: 193upx;
- z-index: 99;
-
- .content{
- position: relative;
- image{
- width: 100%;
- height: 100%;
- position: absolute;
- top: 0;
- left: 0;
- z-index: 9;
- }
- .text{
- position: absolute;
- top: 70upx;
- left: 50%;
- transform: translateX(-50%);
- z-index: 10;
- font-size: 22upx;
- font-family: PingFang SC;
- font-weight: bold;
- color: #C39A58;
- line-height: 1;
- }
-
- }
-
-
- }
- .contact-btn{
- display: inline-block;
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- opacity: 0;
- z-index: 9999;
- }
- </style>
|