update: 更新

modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/login.vue

 <template>
   <div class="login">
-    <img src="@/assets/img/background.png" />
+    <img src="@/assets/img/background.png" class="login-background" />
     <div class="login-con" v-if="!isEmbedThridPlatForm">
-      <card :bordered="false">
-        <p slot="title" style="text-align: center">&nbsp;&nbsp;{{ appTitle }}</p>
-        <div class="form-con">
-          <a-form ref="loginForm" :rules="rules" :model="loginState">
-            <a-form-item name="loginname">
-              <a-input
-                size="large"
-                v-model:value="loginState.loginname"
-                placeholder="请输入用户名"
-                @pressEnter="handleSubmit">
-								<template #prefix>
-									<user-outlined />
-								</template>
-							</a-input>
-            </a-form-item>
-            <a-form-item name="password">
-              <a-input-password
-                size="large"
-                v-model:value="loginState.password"
-                type="password"
-                placeholder="请输入密码"
-                @pressEnter="handleSubmit">
-								<template #prefix>
-									<lock-outlined />
-								</template>
-							</a-input-password>
-            </a-form-item>
-            <a-form-item>
-              <a-button @click="handleSubmit" type="primary" class="login_btn">
-                登录
-              </a-button>
-              <a-button @click="goReset" type="success" class="login_reset">
-								重置
-              </a-button>
-            </a-form-item>
-
-            <a-form-item>
-              <div style="text-align: center">
-                <span class="form_tipinfo">其他登录方式</span>
-              </div>
-              <div style="text-align: center">
-                <div class="sign-btn" @click="handleThridLogin('DINGDING')">
-                  <img src="@/assets/img/dingding.svg" class="third-svg-container" draggable="false" />
+      <card :bordered="false" class="login-card">
+        <div slot="title" class="login-header">
+          <p class="login-caption" style="text-align: center">桌面端应用示例</p>
+        </div>
+        <div  class="login-content">
+          <div class="form-con">
+            <a-form ref="loginForm" :rules="rules" :model="loginState">
+              <a-form-item name="loginname">
+                <a-input
+                  size="large"
+                  v-model:value="loginState.loginname"
+                  placeholder="请输入用户名"
+                  @pressEnter="handleSubmit">
+                  <template #prefix>
+                    <user-outlined />
+                  </template>
+                </a-input>
+              </a-form-item>
+              <a-form-item name="password">
+                <a-input-password
+                  size="large"
+                  v-model:value="loginState.password"
+                  type="password"
+                  placeholder="请输入密码"
+                  @pressEnter="handleSubmit">
+                  <template #prefix>
+                    <lock-outlined />
+                  </template>
+                </a-input-password>
+              </a-form-item>
+              <a-form-item>
+                <a-button @click="handleSubmit" type="primary" class="login_btn">
+                  登录
+                </a-button>
+                <a-button @click="goReset" type="success" class="login_reset">
+                  重置
+                </a-button>
+              </a-form-item>
+              <a-form-item>
+                <div style="text-align: center">
+                  <span class="form_tipinfo">其他登录方式</span>
                 </div>
-                <div class="sign-btn" @click="handleThridLogin('WXWORK')">
-                  <img src="@/assets/img/qiyeweixin.svg" class="third-svg-container" draggable="false" />
+                <div style="text-align: center">
+                  <div class="sign-btn" @click="handleThridLogin('DINGDING')">
+                    <img src="@/assets/img/dingding.svg" class="third-svg-container" draggable="false" />
+                  </div>
+                  <div class="sign-btn" @click="handleThridLogin('WXWORK')">
+                    <img src="@/assets/img/qiyeweixin.svg" class="third-svg-container" draggable="false" />
+                  </div>
                 </div>
-              </div>
-            </a-form-item>
-          </a-form>
-          <p class="login-tip">
-            {{ this.loginTip }}
-          </p>
+              </a-form-item>
+            </a-form>
+            <p class="login-tip">\{{loginTip}}</p>
+          </div>
         </div>
       </card>
       <div class="log_footer">
         <div class="copyright">
-          <a href="https://www.ibizlab.cn/" target="_blank">{{ appTitle }} is based on ibizlab .</a>
+          <a href="https://www.ibizlab.cn/" target="_blank"> is based on ibizlab .</a>
         </div>
       </div>
     </div>
     <div class="login-loadding-container" v-if="isEmbedThridPlatForm">
       <div class="content-loadding">
         <span>第三方登录跳转中</span>
-        <div class="loading">
-          <span></span>
-          <span></span>
-          <span></span>
-          <span></span>
-          <span></span>
-        </div>
+        <!-- loading待补充 -->
       </div>
     </div>
   </div>
@@ -392,180 +387,4 @@ const getNeedLocation = () => {
   }
   return baseUrl;
 };
-</script>
-
-<style lang='scss'>
-.login {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-  -ms-flex-direction: column;
-  flex-direction: column;
-  min-height: 100%;
-  background: #108cee;
-  > img {
-    width: 100vw;
-    height: 100vh;
-  }
-
-  &-con {
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 20%;
-    margin: auto;
-    width: 450px;
-    .ivu-card-head {
-      padding: 30px 0px 20px 0px;
-      border-bottom: 0px;
-      > p {
-        height: 30px;
-        line-height: 30px;
-        font-size: 20px;
-        color: #666666;
-        font-weight: 600;
-      }
-    }
-    &-header {
-      font-size: 16px;
-      font-weight: 300;
-      text-align: center;
-      padding: 30px 0;
-    }
-    .form-con {
-      padding: 0px 20px 0px 20px;
-      > i-button {
-        width: 170px;
-        height: 40px;
-      }
-    }
-    .login-tip {
-      font-size: 10px;
-      text-align: center;
-      color: red;
-      height: 30px;
-    }
-  }
-  &-loadding-container {
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 70%;
-    margin: auto;
-    width: 450px;
-  }
-}
-
-.login_btn {
-  width: 175px;
-  height: 40px;
-  font-size: 18px;
-  font-family: MicrosoftYaHei;
-}
-.login_reset {
-  width: 175px;
-  height: 40px;
-  font-size: 18px;
-  font-family: MicrosoftYaHei;
-  float: right;
-}
-
-.form_tipinfo {
-  font-family: MicrosoftYaHei-Bold;
-  font-size: 14px;
-  font-weight: bold;
-  font-stretch: normal;
-  line-height: 24px;
-  letter-spacing: 0px;
-  color: #666666;
-}
-
-.form_tipinfo_more {
-  font-family: MicrosoftYaHei;
-  font-size: 14px;
-  font-weight: normal;
-  letter-spacing: 0px;
-  color: #666666;
-}
-.log_footer {
-  display: block;
-  padding: 0 16px;
-  margin: 48px 0 24px;
-  text-align: center;
-  color: #212529;
-}
-
-.log_footer a {
-  color: white;
-  text-decoration: none;
-}
-
-.sign-btn {
-  display: inline-block;
-  cursor: pointer;
-  margin-left: 10px;
-}
-
-.third-svg-container {
-  display: inline-block;
-  width: 40px;
-  height: 40px;
-  line-height: 40px;
-  text-align: center;
-  padding-top: 1px;
-  border-radius: 4px;
-  margin-bottom: -20px;
-  margin-top: 10px;
-}
-.content-loadding {
-  display: flex;
-  > span {
-    font-size: 24px;
-    color: #fff;
-  }
-}
-.loading {
-  width: 150px;
-  height: 15px;
-  margin: 0 auto;
-  margin-top: 12px;
-  padding-left: 12px;
-  > span {
-    display: inline-block;
-    width: 15px;
-    height: 100%;
-    margin-right: 5px;
-    border-radius: 50%;
-    background: #fff;
-    -webkit-animation: load 1.04s ease infinite;
-  }
-  > span:last-child {
-    margin-right: 0px;
-  }
-  > span:nth-child(1) {
-    -webkit-animation-delay: 0.13s;
-  }
-  > span:nth-child(2) {
-    -webkit-animation-delay: 0.26s;
-  }
-  > span:nth-child(3) {
-    -webkit-animation-delay: 0.39s;
-  }
-  > span:nth-child(4) {
-    -webkit-animation-delay: 0.52s;
-  }
-  > span:nth-child(5) {
-    -webkit-animation-delay: 0.65s;
-  }
-}
-@-webkit-keyframes load {
-  0% {
-    opacity: 1;
-  }
-  100% {
-    opacity: 0;
-  }
-}
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file

modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/style/components/common/index.scss

-@use './app-split.scss';
\ No newline at end of file
+@use './app-split.scss';
+@use './login.scss';
\ No newline at end of file

modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/style/components/common/login.scss

+.login {
+  display: flex;
+  flex-direction: column;
+  min-height: 100%;
+  .login-background {
+    width: 100vw;
+    height: 100vh;
+  }
+  .login-con {
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 20%;
+    margin: auto;
+    width: 450px;
+    .login-card {
+      display: block;
+      background-color: #fff;
+      border-radius: 4px;
+      .login-header {
+        padding: 30px 0px 20px 0px;
+        .login-caption {
+          height: 30px;
+          line-height: 30px;
+          font-size: 20px;
+          color: #666666;
+          font-weight: 600;
+        }
+      }
+      .login-content {
+        padding: 16px;
+        .form-con {
+          padding: 0px 20px 0px 20px;
+        }
+      }
+    }
+  }
+  .login-loadding-container {
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 70%;
+    margin: auto;
+    width: 450px;
+  }
+
+  .login_btn {
+    width: 175px;
+    height: 40px;
+    font-size: 18px;
+    font-family: MicrosoftYaHei;
+  }
+  .login_reset {
+    width: 175px;
+    height: 40px;
+    font-size: 18px;
+    font-family: MicrosoftYaHei;
+    float: right;
+  }
+  .login-tip {
+    font-size: 10px;
+    text-align: center;
+    color: red;
+    height: 30px;
+    padding-top: 10px;
+    margin: 0;
+  }
+  .form_tipinfo {
+    font-family: MicrosoftYaHei-Bold;
+    font-size: 14px;
+    font-weight: bold;
+    font-stretch: normal;
+    line-height: 24px;
+    letter-spacing: 0px;
+    color: #666666;
+  }
+  .log_footer {
+    display: block;
+    padding: 0 16px;
+    margin: 48px 0 24px;
+    text-align: center;
+    color: #212529;
+  }
+  .log_footer a {
+    color: white;
+    text-decoration: none;
+  }
+  .sign-btn {
+    display: inline-block;
+    cursor: pointer;
+    margin-left: 10px;
+  }
+  .third-svg-container {
+    display: inline-block;
+    width: 40px;
+    height: 40px;
+    line-height: 40px;
+    text-align: center;
+    padding-top: 1px;
+    border-radius: 4px;
+    margin-bottom: -20px;
+    margin-top: 10px;
+  }
+  .content-loadding {
+    display: flex;
+    > span {
+      font-size: 24px;
+      color: #fff;
+    }
+  }
+}