refine: 登录拦截样式

Author: feige996

src/pages/demo/route-interceptor/index.vue

@@ -1,12 +1,11 @@
 <route lang="json5" type="page">
 {
-  needLogin: true,
   style: { navigationBarTitleText: '登陆拦截' },
 }
 </route>
 
 <template>
-  <view class="mt-8 text-center">
+  <view class="mt-8 text-center p-4">
     <view class="">登陆拦截的时候的登录有如下3种情况</view>
     <view class="">1.登录动作有单独的登录页面，需要通过重定向处理</view>
     <view class="">
@@ -16,8 +15,8 @@
     <view class="leading-10">
       用户是否已登录：<text>{{ isLogined ? '是' : '否' }}</text>
     </view>
-    <button v-if="!isLogined" @click="setUserInfo">登陆</button>
-    <button v-else @click="clearUserInfo" class="mt-4">登出</button>
+    <button v-if="!isLogined" @click="setUserInfo" class="mt-4" type="primary">登陆</button>
+    <button v-else @click="clearUserInfo" class="mt-4" type="warn">登出</button>
   </view>
 </template>
 

src/pages/demo/route-interceptor/login-auto.vue

@@ -8,7 +8,7 @@
 </route>
 
 <template>
-  <view class="mt-8 text-center">
+  <view class="mt-8 text-center p-4">
     <view class="">
       自动登录，通常在小程序里面都会先自动登录，所以都是登录状态，无需拦截。这个项目不方便演示，后续开个新项目演示
     </view>

src/pages/demo/route-interceptor/login-model.vue

@@ -5,12 +5,12 @@
 </route>
 
 <template>
-  <view class="mt-8 text-center">
+  <view class="mt-8 text-center p-4">
     <view class="leading-10">
       用户是否已登录：<text>{{ isLogined ? '是' : '否' }}</text>
     </view>
     <view>这里有一个按钮（比如点赞按钮），点击这个按钮需要先登录</view>
-    <button @tap="onClick">点赞菲鸽</button>
+    <button type="primary" @tap="onClick" class="mt-4">点赞菲鸽</button>
     <uv-modal
       ref="modal"
       title="登陆"

src/pages/demo/route-interceptor/login-page.vue

@@ -6,7 +6,7 @@
 </route>
 
 <template>
-  <view class="mt-8 text-center">
+  <view class="mt-8 text-center p-4">
     <view class="leading-10">
       用户是否已登录：<text>{{ isLogined ? '是' : '否' }}</text>
     </view>