|
|
@@ -1,5 +1,12 @@
|
|
|
<template>
|
|
|
- <view class="model" v-if="showModel" @click="pageTo({url:'/admin/home/login'})"></view>
|
|
|
+ <view class="model" v-if="showModel" @click="pageTo({url:'/admin/home/login'})">
|
|
|
+ <view class="login-tip" @click.stop="pageTo({url:'/admin/home/login'})">
|
|
|
+ <view class="login-icon">🔒</view>
|
|
|
+ <view class="login-title">您尚未登录</view>
|
|
|
+ <view class="login-desc">点击此处前往登录,使用完整功能</view>
|
|
|
+ <view class="login-btn">去登录</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { mapGetters } from "vuex";
|
|
|
@@ -17,18 +24,17 @@ export default {
|
|
|
},
|
|
|
watch: {
|
|
|
getLoginInfo: {
|
|
|
+ immediate: true,
|
|
|
+ deep: true,
|
|
|
handler(newValue) {
|
|
|
- if(!this.$util.isEmpty(newValue.admin) && newValue.admin.currentShopId > 0){
|
|
|
+ if(!this.$util.isEmpty(newValue) && !this.$util.isEmpty(newValue.admin) && newValue.admin.currentShopId > 0){
|
|
|
this.showModel = false
|
|
|
- }
|
|
|
+ }else{
|
|
|
+ this.showModel = true
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- mounted() {
|
|
|
- if(this.$util.isEmpty(this.getLoginInfo.admin) || this.getLoginInfo.admin.currentShopId == 0){
|
|
|
- this.showModel = true
|
|
|
- }
|
|
|
- },
|
|
|
methods: {
|
|
|
}
|
|
|
}
|
|
|
@@ -42,6 +48,39 @@ export default {
|
|
|
width: 100vw;
|
|
|
height: 100vh;
|
|
|
background: rgba(0, 0, 0, 0.6);
|
|
|
- opacity:0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+.login-tip {
|
|
|
+ width: 560upx;
|
|
|
+ padding: 60upx 40upx;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 20upx;
|
|
|
+ text-align: center;
|
|
|
+ box-shadow: 0 8upx 32upx rgba(0, 0, 0, 0.2);
|
|
|
+}
|
|
|
+.login-icon {
|
|
|
+ font-size: 80upx;
|
|
|
+ margin-bottom: 20upx;
|
|
|
+}
|
|
|
+.login-title {
|
|
|
+ font-size: 36upx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333;
|
|
|
+ margin-bottom: 16upx;
|
|
|
+}
|
|
|
+.login-desc {
|
|
|
+ font-size: 26upx;
|
|
|
+ color: #888;
|
|
|
+ margin-bottom: 40upx;
|
|
|
+}
|
|
|
+.login-btn {
|
|
|
+ display: inline-block;
|
|
|
+ padding: 18upx 80upx;
|
|
|
+ background: #09C567;
|
|
|
+ font-size: 30upx;
|
|
|
+ border-radius: 50upx;
|
|
|
+ color: #fff;
|
|
|
}
|
|
|
</style>
|