Merge branch 'lx-test' of 47.94.45.65:angelo/web-base-h5 into lx-online

pages/login/index.vue

@@ -1,26 +1,26 @@
-
 <template>
   <view class="main">
     <view class="title">
       {{ '会员登录' }}
     </view>
-    <u-form :model="loginForm"
-            labelWidth="auto"
-            ref="uForm">
+    <u-form :model="loginForm" labelWidth="auto" ref="uForm">
       <view class="view-class pa">
         <!-- <view class="account-s">
-        
+
         </view> -->
-        <u-form-item label=""
-                     prop="username">
-          <u-input v-model="loginForm.username"
-                   clearable
-                   placeholder-class="place-class"
-                   class="border-color "
-                   :placeholder="'会员账号'">
-            <image class="tou"
-                   slot="prefix"
-                   src="../../static/images/login/index-icon4.png"></image>
+        <u-form-item label="" prop="username">
+          <u-input
+            v-model="loginForm.username"
+            clearable
+            placeholder-class="place-class"
+            class="border-color"
+            :placeholder="'会员账号'"
+          >
+            <image
+              class="tou"
+              slot="prefix"
+              src="../../static/images/login/index-icon4.png"
+            ></image>
           </u-input>
         </u-form-item>
         <!-- <view class="close-s"
@@ -33,62 +33,98 @@
         <!-- <view class="account-s widths">
 				<image src="../../static/images/login/index-icon2.png"></image>
 			</view> -->
-        <u-form-item label=""
-                     prop="password">
-          <u-input placeholder-style="color:#333"
-                   :type="password"
-                   class="border-color"
-                   v-model="loginForm.password"
-                   :placeholder="'登录密码'">
-            <image class="mm"
-                   slot="prefix"
-                   src="../../static/images/login/index-icon2.png"></image>
+        <u-form-item label="" prop="password">
+          <u-input
+            placeholder-style="color:#333"
+            :type="password"
+            class="border-color"
+            v-model="loginForm.password"
+            :placeholder="'登录密码'"
+          >
+            <image
+              class="mm"
+              slot="prefix"
+              src="../../static/images/login/index-icon2.png"
+            ></image>
             <view slot="suffix">
-              <view v-if="password=='text'"
-                    @click="changeFlagTap('password')">
-                <image class="eye"
-                       src="../../static/images/login/icon1.png"></image>
+              <view
+                v-if="password == 'text'"
+                @click="changeFlagTap('password')"
+              >
+                <image
+                  class="eye"
+                  src="../../static/images/login/icon1.png"
+                ></image>
               </view>
-              <view v-else
-                    @click="changeFlagTap('text')">
-                <image class="eye"
-                       src="../../static/images/login/icon2.png"></image>
+              <view v-else @click="changeFlagTap('text')">
+                <image
+                  class="eye"
+                  src="../../static/images/login/icon2.png"
+                ></image>
               </view>
             </view>
           </u-input>
         </u-form-item>
-
       </view>
       <view class="view-class">
         <!-- <view class="account-s yzm">
 		  	<image src="../../static/images/login/index-icon1.png"></image>
 		  </view> -->
-        <u-form-item label=""
-                     prop="code">
-          <u-input v-model="loginForm.code"
-                   placeholder-class="place-class"
-                   class="border-color"
-                   :placeholder="'验证码'">
-            <image class="mm"
-                   slot="prefix"
-                   src="../../static/images/login/index-icon1.png"></image>
-            <img :src="codeUrl"
-                 slot="suffix"
-                 style="height: 38px;"
-                 @click="getVerifyCode" />
+        <u-form-item label="" prop="code">
+          <u-input
+            v-model="loginForm.code"
+            placeholder-class="place-class"
+            class="border-color"
+            :placeholder="'验证码'"
+          >
+            <image
+              class="mm"
+              slot="prefix"
+              src="../../static/images/login/index-icon1.png"
+            ></image>
+            <img
+              :src="codeUrl"
+              slot="suffix"
+              style="height: 38px"
+              @click="getVerifyCode"
+            />
           </u-input>
-
         </u-form-item>
       </view>
     </u-form>
-    <u-button type="success"
-              shape="circle"
-              class="btn"
-              :loading="isLoading"
-              :loadingText="'登录中'"
-              @click="toLogin">{{'登录'}}</u-button>
-    <view class="paswwrod_btn"
-          @click="submit">{{'忘记密码'}}</view>
+    <u-button
+      type="success"
+      shape="circle"
+      class="btn"
+      :loading="isLoading"
+      :loadingText="'登录中'"
+      @click="toLogin"
+      >{{ '登录' }}</u-button
+    >
+    <view class="paswwrod_btn" @click="submit">{{ '忘记密码' }}</view>
+
+    <view class="beian-container">
+      <div style="height: 25px"></div>
+      <div class="beian-content">
+        <a
+          class="beian-link jicpb"
+          href="https://beian.miit.gov.cn/#/Integrated/index"
+          target="_blank"
+          title="工信部备案查询"
+        >
+          京ICP备17001692号-7
+        </a>
+        <span class="beian-separator">|</span>
+        <a
+          class="beian-link jgawb"
+          href="https://beian.mps.gov.cn/#/query/webSearch?code=11022902000492"
+          target="_blank"
+          title="公安部备案查询"
+        >
+          京公网安备11022902000492号
+        </a>
+      </div>
+    </view>
   </view>
 </template>
 
@@ -116,7 +152,7 @@ export default {
   },
   onLoad() {
     this.getVerifyCode()
-    this.loginForm.username = uni.getStorageSync('username')||''
+    this.loginForm.username = uni.getStorageSync('username') || ''
     // this.getLanguage()
   },
   methods: {
@@ -135,13 +171,13 @@ export default {
       this.loginForm.username = ''
     },
     getVerifyCode() {
-      api.captchaImage().then((res) => {
+      api.captchaImage().then(res => {
         this.codeUrl = 'data:image/gif;base64,' + res.img
         this.loginForm.uuid = res.uuid
       })
     },
     toLogin() {
-      api.login(this.loginForm).then((res) => {
+      api.login(this.loginForm).then(res => {
         this.isLoading = false
         if (!res) {
           // uni.showToast({
@@ -165,15 +201,15 @@ export default {
           url: url,
           method: 'GET',
           responseType: 'arraybuffer',
-          success: (res) => {},
-          fail: (err) => {
+          success: res => {},
+          fail: err => {
             reject(err)
           },
         })
       })
     },
     getUseInfo() {
-      store.dispatch('GetInfo').then((res) => {
+      store.dispatch('GetInfo').then(res => {
         uni.switchTab({ url: '/pages/index/index' })
         // 目前强制跳首页
         // if (res.data.loginType == 1) {
@@ -239,7 +275,7 @@ body {
   text-align: center;
 }
 .btn {
-  background-color: #005BAC;
+  background-color: #005bac;
   border: none;
   height: 92rpx;
   line-height: 92rpx;
@@ -329,4 +365,83 @@ body {
 .pa {
   padding: 7px 20rpx;
 }
-</style>
+
+/* 备案容器 */
+.beian-container {
+  background-color: #ffffff; /* 深色背景 */
+  padding: 16px 0;
+  text-align: center;
+  font-size: 12px;
+  line-height: 1.5;
+  margin-top: 20px;
+  border-radius: 8px 8px 0 0;
+}
+
+/* 备案内容 */
+.beian-content {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 12px;
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 16px;
+}
+
+/* 备案链接 */
+.beian-link {
+  color: #749ae3;
+  text-decoration: none;
+  padding: 4px 8px;
+  border-radius: 4px;
+  transition: all 0.3s ease;
+  display: inline-block;
+}
+
+/* 悬停效果 */
+.beian-link:hover {
+  color: #fff;
+  background-color: rgba(116, 154, 227, 0.2);
+  transform: translateY(-1px);
+  box-shadow: 0 2px 8px rgba(116, 154, 227, 0.3);
+}
+
+/* 分隔符 */
+.beian-separator {
+  color: #749ae3;
+  opacity: 0.6;
+}
+
+/* 响应式设计 */
+@media screen and (max-width: 480px) {
+  .beian-content {
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .beian-separator {
+    display: none;
+  }
+
+  .beian-link {
+    font-size: 11px;
+  }
+}
+
+/* 动画效果 */
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.beian-container {
+  animation: fadeIn 0.5s ease-out;
+}
+</style>