rongzidanbao-ui/components/popup/popup.vue

<template>
	<view>
		<!-- 弹窗 -->
		<view class="bgbox" @click="getClose" v-if="type"></view>
		<!-- 弹窗 -->
		<!-- 暂存提案的弹窗 -->
		<view class="fixedbox" v-if="type=='zcta'">
			<view class="ttit">提示</view>
			<view  class="boxs">
				<view class="ztit">您有一条暂存信息还未提交</view>
				<view class="ztit">是否继续编辑？</view>
				<view class="ztit mb32">查看<text @click="getFaFn('old',type)">暂存信息</text></view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getFaFn('new',type)">重新发布</view>
				<view class="btns btn2" @click="getFaFn('old',type)">继续发布</view>
			</view>
		</view>
		<!-- 委员信息弹窗 -->
		<view class="bgbox" style="z-index: 100;" v-if="initFace=='N'"></view>
		<view class="fixedbox" style="z-index: 101;" v-if="initFace=='N'">
			<view class="ttit">提示</view>
			<view  class="boxs">
				<view class="ztit">您的认证信息暂未完善，请完善</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn2 flex1" @click="getXxwsFn">去完善</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
	import config from '@/config'
	const baseUrl = config.baseUrl
	import { getToken } from '@/utils/auth'
	export default{
		props:{
			type: {
				type: String,
				default () {
					return ''
				}
			},
			initFace:{
				type: [String,Number],
				default () {
					return 'N'
				}
			}
		},
		data(){
			return{
				
				
			}
		},
		watch:{
		},
		onShow() {
			
		},
		mounted() {		  
		},
		methods:{
			checkPermi, checkRole,
			getClose(){
				this.$emit("getClose")
			},
			getFaFn(type,ptype){
				this.$emit('getFaFn',type,ptype)
			},
			getXxwsFn(){
				this.$emit('getXxwsFn')
			}
		}
	}
</script>

<style lang="scss" scoped>
// 弹窗
.fixedbox{position: fixed;left: 136rpx;right: 136rpx;background: #fff;border-radius: 10rpx;top: 50%;transform: translateY(-50%);z-index: 10;padding: 40rpx 24rpx 52rpx;max-height: calc(100vh - 300rpx);overflow: auto;box-sizing: border-box;
	.ttit{position: relative;text-align: center;font-weight: bold;font-size: 36rpx;color: #222327;margin-bottom: 38rpx;}
	.boxs{
		.ttxt{font-weight: bold;font-size: 30rpx;color: #222327;
			text{margin-right: 6rpx;}
		}
		.ztit{font-weight: 500;font-size: 26rpx;color: #222327;text-align: center;line-height: 56rpx;text-align: center;
			text{color: #00A9F0;;margin: 0 6rpx;}
		}
}
	.fixedbtn{margin-top: 48rpx;
		.btns{width: 192rpx;height: 70rpx;border-radius: 35rpx;font-weight: bold;
font-size: 26rpx;display: flex;align-items: center;justify-content: center;box-sizing: border-box;
			&.btn1{color: #00A9F0;border: 2rpx solid #00A9F0;}
			&.btn2{color: #ffffff;background: #00A9F0;}
		}
		
	}
}

</style>