Browse Source

未登录组件多处有引用,不正常显示问题修复

shizhongqi 3 months ago
parent
commit
ef5802d9e8
2 changed files with 48 additions and 12 deletions
  1. 0 3
      hdApp/src/admin/home/me.vue
  2. 48 9
      hdApp/src/components/not-login.vue

+ 0 - 3
hdApp/src/admin/home/me.vue

@@ -186,7 +186,6 @@
         <view class="bottom-version">闽ICP备15017325号-11A</view>
       </view>
     </template>
-    <NotLogin></NotLogin>
     
     <!-- 修改名称弹出框 -->
     <uni-popup ref="editPopup" type="center" :animation="false">
@@ -242,7 +241,6 @@ import DorpdownSelect from "@/components/module/dorpdownSelect";
 import { selectShop } from "@/mixins";
 import { list } from "@/mixins";
 import { mapGetters } from "vuex";
-import NotLogin from "@/components/not-login";
 import ModalModule from "@/components/plugin/modal";
 import { clearLogin } from "@/api/admin";
 import { APP_VERSION } from "@/config";
@@ -252,7 +250,6 @@ export default {
     AppAvatarModule,
     TuiListCell,
     DorpdownSelect,
-    NotLogin,
     ModalModule
   },
   mixins: [selectShop, list],

+ 48 - 9
hdApp/src/components/not-login.vue

@@ -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>