yuanqu_ui/pages/order/notice.vue

<template>
  <view class="nobox">
	  <view class="notice">
		  <view class="not_box">
			  <rich-text :nodes="content"></rich-text>
		  </view>
		  <view class="not_btns flexcj">
			  <view class="not_btn btn1" @click="getSearchFn">预约查询</view>
			  <view class="not_btn btn2" @click="getOrderFn">在线预约</view>
		  </view>
		  <view>
			  <view class="lread" @click="checkflag=!checkflag">
			  	<view class="lreadl">
			  		<image :src="choseimg" v-if="checkflag"></image>
			  		<image :src="nchoseimg" v-else></image>
			  	</view>
			  	<view class="tit">我已仔细阅读并知晓预约须知，确认进入在线预约</text></view>
			  </view>
		  </view>
		  <image :src="jdiconimg" @click="getJiFn" class="jdimg"></image>
		  <view class="bbcode">版本号：ZXY_YY_1.3</view>
	  </view>
  </view>
</template>

<script>
	import {getNewsList} from "@/api/mine/order.js"
  export default {
	data(){
		return{
			choseimg:require("@/static/images/order/comes/chose.png"), 
			nchoseimg:require("@/static/images/order/comes/nchose.png"),
			jdiconimg:require("@/static/images/order/comes/jdicon.png"),
			checkflag:false,
			content:'',
			jdurl:'https://www.chinamartyrs.gov.cn/x_lsyml/dqlsyml/dqlsymlnamelist/index.html?id=340882000000,%25E5%25AE%2589%25E5%25BE%25BD%25E7%259C%2581-%25E5%25AE%2589%25E5%25BA%2586%25E5%25B8%2582-%25E6%25BD%259C%25E5%25B1%25B1%25E5%25B8%2582',
		}
	},
	onLoad: function() {
		this.getNewsList()
	},
	methods:{
		getSearchFn(){
			this.$tab.navigateTo('/pages/order/search')
		},
		getJiFn(){
			window.open(this.jdurl,'_blank')
		},
		getNewsList(){
			var params={
				type:5
			}
			getNewsList(params).then(res=>{
				if(res.code==200){
					var list=res.rows;
					if(list&&list.length){
						this.content=list[0].content
					}
				}
			})
		},
		getOrderFn(){
			if(this.checkflag){
				this.$tab.navigateTo('/pages/order/come')
			}else{
				this.$toast('请同意预约须知')
			}
			
		}
	},
	
  }
</script>

<style lang="scss" scoped>
.nobox{padding-top: 20rpx;}
.bbcode{position: absolute;width: 100%;text-align: center;left: 0;bottom: 16rpx;font-size: 24rpx;color: #666666;}
.notice{min-height: calc(100vh - 20rpx);background: #ffffff;padding: 80rpx 64rpx;box-sizing: border-box;position: relative;
	.not_box{font-size: 28rpx;font-weight: 500;color: #161616;margin-bottom: 80rpx;}
	.not_btns{margin-bottom: 42rpx;
		.not_btn{width: 278rpx;height: 90rpx;border-radius: 46rpx;display: flex;align-items: center;justify-content: center;font-size: 28rpx;font-weight: 500;
			&.btn1{background: #FFFFFF;border: 2rpx solid $com-cd3;color: $com-cd3;}
			&.btn2{background: $com-cd3;color: #ffffff;}
		}
	}
}
.jdimg{position: fixed;right: 22rpx;bottom: 72rpx;width: 156rpx;height: 156rpx;}
.lread{
	display: flex;align-items: flex-start;justify-content: center;
	.lreadl{padding-top: 4rpx;
		image{width: 24rpx;height: 24rpx;margin-right: 20rpx;}
	}
	.tit{font-size: 22rpx;font-weight: 500;color: #666666;
	}
}
</style>