增加 弹窗显示

src/components/customShowModal.vue

@@ -0,0 +1,163 @@
+<template>
+<view class="model" v-if="visibleF">
+	<view class="model-con">
+		<view class="model-top" v-if="title">{{title}}</view>
+		<view :class="{'model-middle':true,'m-height':!title}">{{contents}}</view>
+		<view class="model-bottom">
+			<button type="primary" class="btn-cancel" @click="handleCancel" v-if="btnFlag2">Cancel</button>
+			<button type="default" class="btn-green" @click="handleConfirm" v-if="btnFlag" :loading="loading" :disabled="loading">{{btnTxt}}</button>
+		</view>
+	</view>
+</view>
+</template>
+
+<script setup>
+import { ref,watch } from 'vue'
+const props = defineProps({
+	visible:{
+		type:Boolean
+	},
+	title:{
+		type: String,
+	},
+	content: {
+		type: String
+	},
+	btnFlag:{
+		type:Boolean,
+		default:true
+	},
+	btnFlag2:{
+		type:Boolean,
+		default:true
+	},
+	btnTxt:{
+		type:String,
+		default:'确定'
+	}
+})
+
+let visibleF = ref(props.visible)
+let titles = ref(props.title)
+let contents = ref(props.content)
+let btnFlags = ref(props.btnFlag)
+let loading = ref(false);
+
+// 显示隐藏
+watch(() => props.visible, (newVal, oldVal) => {
+    loading.value = false;
+	visibleF = newVal
+},{
+    deep:true, // 深度监听
+    immediate:true // 立即执行
+});
+
+// 标题
+watch(() => props.title, (newVal, oldVal) => {
+	titles.value = newVal
+},{
+    deep:true,
+    immediate:true
+});
+// 内容
+watch(() => props.content, (newVal, oldVal) => {
+	contents = newVal
+},{
+    deep:true,
+    immediate:true
+});
+
+// 按钮
+watch(() => props.btnFlag, (newVal, oldVal) => {
+	btnFlags.value = newVal
+},{
+    deep:true,
+    immediate:true
+});
+
+// 调用父组件的方法
+const emit = defineEmits(['close','confirm'])
+const handleCancel = ()=>{
+	emit('close');
+}
+
+const handleConfirm = ()=>{
+	loading.value=true;
+	emit('confirm')
+}
+
+</script>
+
+<style lang="scss" scoped>
+.model {
+	position: fixed;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	background: rgba(0, 0, 0, 0.4);
+	z-index: 9999;
+	.model-con{
+		background: #fff;
+		position: fixed;
+		top:50%;
+		left:50%;
+		width:500rpx;
+		min-height: 278rpx;
+		margin-left: -270rpx;
+		margin-top:-139rpx;
+		border-radius: 24rpx;
+		padding:20rpx 20rpx 30rpx;
+	}
+	.model-top{
+		text-align: center;
+		padding:20rpx 0;
+		font-size:36rpx;
+	}
+	.model-middle{
+		// margin-top:290rpx;
+		text-align: center;
+		font-size:36rpx;
+		color:#393939;
+		.font-green{
+			color:#05A3F4;
+			font-size: 42rpx;
+			font-weight: bold;
+			padding:20rpx 0;
+		}
+	}
+	.model-middle.m-height{
+		padding:60rpx 0 20rpx;
+	}
+	.model-bottom{
+		display: flex;
+		justify-content: center;
+		margin-top:40rpx;
+		// align-items: center;
+		.btn-green,.btn-cancel{
+			background-color: #fff;
+			color:#05A3F4;
+			border-radius: 48rpx;
+			font-size:30rpx;
+			width:200rpx;
+			height:65rpx;
+			line-height: 60rpx;
+			text-align: center;
+			font-size:30rpx;
+			border: 1px solid #05A3F4;
+			margin-left:0rpx !important;
+			margin-right:0 !important;
+			&::after{
+				border:none;
+				border-radius: 37rpx;
+			}
+		}
+		.btn-green{
+			border: 1px solid #05A3F4;
+			background-color:#05A3F4;
+			color:#fff;
+			margin-left:20rpx !important;
+		}
+	}
+}
+</style>

src/main.js

@@ -3,18 +3,24 @@ import App from "./App.vue";
 import { CLIENT_ID,NETWORK_ENV } from '@/enums/cacheEnums';
 import '@/static/font/iconfont.css'
 
+// 注册自定义组件
+import customShowModal from '@/components/customShowModal.vue'
+
 // pinia
 import { createPinia } from 'pinia'
 const pinia = createPinia()
 
 
-
 export function createApp() {
 
 	const app = createSSRApp(App);
 
+	// 全局变量
 	app.config.globalProperties.$CLIENT_ID = CLIENT_ID;
 	app.config.globalProperties.$NETWORK_ENV = NETWORK_ENV;
+
+	// 全局自定义组件
+	app.component('customShowModal', customShowModal)
 	
 	app.use(pinia)
 

src/pages/login/login.vue

@@ -257,7 +257,7 @@ const submitForm = () => {
             param.runEnv = networkEnv.value;
 
             // #ifdef H5
-            param.uniqCode = 'e5687e80-526f-4522-ba7d-41d5db197a15';//h5测试用 内网-sn123456 外网-e5687e80-526f-4522-ba7d-41d5db197a15
+            param.uniqCode = '7666ac20-827a-4c23-8e2e-fbbf24564fc0';//h5测试用 内网-sn123456 外网-7666ac20-827a-4c23-8e2e-fbbf24564fc0
             let res = await login(param);
             userStore.login(res);
             uni.switchTab({ url: '/pages/home/home' })

src/pages/userinfo/userinfo.vue

@@ -87,17 +87,27 @@
             </view>
 
             <!-- 退出登录 -->
-            <button type="primary" plain="true" size="small" class="logout-btn" @click="handleLoginOut">退出登录</button>
+            <button type="primary" plain="true" size="small" class="logout-btn" @click="showModel">退出登录</button>
 
             <!-- 底部加高度来避免tabbar遮挡 -->
             <!-- <view class="bottom-height"></view> -->
       </mescroll-uni>
     </view>
+
+    <!-- 弹窗模板 -->
+    <customShowModal
+        :title="title"
+        :content="content" 
+        :visible="visible" 
+        @close="handleClose"
+        @confirm="handleLoginOut"
+        ref="showModel"
+    ></customShowModal>
 </view>
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue'
+import { ref, onMounted,getCurrentInstance } from 'vue'
 import { onLoad } from '@dcloudio/uni-app';
 import MescrollUni from 'mescroll-uni/mescroll-uni.vue';
 import { getNavBarPaddingTop } from '@/utils/system.js'
@@ -106,6 +116,7 @@ import { formatIOS } from '@/utils/status.js'
 import { showAlert } from '@/utils/message.js'
 import { useUserStore } from '@/stores/user';
 const userStore = useUserStore()
+const { proxy } = getCurrentInstance();
 
 // 1.头部导航栏
 const navBarPaddingTop = ref(0);
@@ -179,6 +190,7 @@ const downCallback = async (mescroll) => {
 
 // 3.查询是否有更新的版本显示点
 const getVersion = async ()=>{
+    let networkEnv = proxy.$NETWORK_ENV;//1-内网 2-外网
     let param = {
         // #ifdef APP-PLUS
         verNumber:systemInfo.appWgtVersion,//当前版本号
@@ -187,20 +199,35 @@ const getVersion = async ()=>{
         verNumber : systemInfo.appVersion,
         // #endif
         os: formatIOS(systemInfo.osName),//操作系统 Android  IOS
+        runEnv:networkEnv
     }
     let data = await versionCheck(param);
     isCurrent.value = data.isCurrent;
 }
 
+// 自定义弹窗
+let title = ref('');
+let content = ref('');
+let visible = ref(false);
+const showModel=()=>{
+    title.value = '提示'
+    content.value = '是否确认退出？';
+    visible.value = true;
+}
+//关闭
+const handleClose=()=>{
+    visible.value = false;
+}
+
 // 3.退出登录
 const handleLoginOut = async ()=>{
 
-    showAlert('是否确认退出？','提示',true,()=>{
+    // showAlert('是否确认退出？','提示',true,()=>{
         userStore.logout();
         uni.reLaunch({
             url: '/pages/login/login',
         });
-    })
+    // })
     
 }
 

src/pages/userinfo/version.vue

@@ -26,12 +26,13 @@
 </template>
 
 <script setup>
+import { ref, onMounted,getCurrentInstance } from 'vue'
 import { onLoad } from '@dcloudio/uni-app';
-import { ref, onMounted } from 'vue'
 import customHeader from '@/components/customHeader.vue'
 import { versionCheck } from '@/api/auth.js';
 import { getNavBarPaddingTop } from '@/utils/system.js'
 import { formatIOS } from '@/utils/status.js'
+const { proxy } = getCurrentInstance();
 
 // 初始load页面
 onLoad(async(opt) => {
@@ -49,6 +50,7 @@ onMounted(() => {
     navBarPaddingTop.value = getNavBarPaddingTop() * 2;
 })
 let getOSVesion = async()=>{
+    let networkEnv = proxy.$NETWORK_ENV;//1-内网 2-外网
     let systemInfo = uni.getSystemInfoSync();
     let param = {
         // #ifdef APP-PLUS
@@ -58,15 +60,16 @@ let getOSVesion = async()=>{
         verNumber : systemInfo.appVersion,
         // #endif
         os: formatIOS(systemInfo.osName),//操作系统 Android  IOS
+        runEnv:networkEnv
     }
     // 当前手机版本
     appVersion.value = param.appVersion;
-    console.log("appVersion=>",appVersion)
+    console.log("appVersion=>",appVersion.value)
     let data = await versionCheck(param);
     newVersion.value = data.verNumber;
     downloadURL.value = data.downloadUrl || '';
     isCurrent.value = data.isCurrent;
-    remark.value = data.remark //|| '全新的UI界面 优化了签到/打卡功能，整体流程更加简洁清晰 搜索功能全面升级 修复了已知BUG'
+    remark.value = data.remark; //|| '全新的UI界面 优化了签到/打卡功能，整体流程更加简洁清晰 搜索功能全面升级 修复了已知BUG'
 }
 
 // 下载最新版本