Просмотр исходного кода

登录页和隐私协议弹窗

leo 1 день назад
Родитель
Сommit
7fd90381fd
5 измененных файлов с 1124 добавлено и 291 удалено
  1. 90 29
      App.vue
  2. BIN
      pages/login/assets/logo.png
  3. 367 259
      pages/login/login.vue
  4. 665 0
      pages/login/loginOld.vue
  5. 2 3
      util/api.js

+ 90 - 29
App.vue

@@ -1,35 +1,96 @@
 <script>
-	import { fetchPermissionList } from './util/QueryPermission.js';
+import { fetchPermissionList } from './util/QueryPermission.js';
 
-	export default {
-		onLaunch: function() {
-			// 已登录时提前拉取权限列表,保证“未经过首页”等特殊入口也能拿到权限数据(非阻塞)
-			if (uni.getStorageSync('session_key')) {
-				fetchPermissionList();
-			}
-		},
-		onShow: function() {
-			console.log('App Show')
-		},
-		onHide: function() {
-			console.log('App Hide')
-		}
-	}
+export default {
+  onLaunch: function () {
+    console.log(' APP onLaunch');
+    // 全局隐私协议检查:首次启动时通过原生 uni.showModal 弹出
+    if (!uni.getStorageSync('privacy_agreed')) {
+      this.showPrivacyModal();
+    } else {
+      // 已同意过,直接执行初始化
+      this.doAfterPrivacy();
+    }
+  },
+  methods: {
+    // 独立的隐私协议弹窗方法(避免递归调用 onLaunch)
+    showPrivacyModal() {
+      uni.showModal({
+        title: '用户服务与隐私协议',
+        content:
+          '欢迎使用本应用!在您首次使用前,请认真阅读《用户服务与隐私协议》。我们将遵循"最小必要"原则,仅收集实现服务所必需的信息(微信昵称、头像、手机号、位置信息、设备信息等),不会主动向第三方共享您的个人信息。',
+        confirmText: '同意并继续',
+        cancelText: '不同意',
+        success: (res) => {
+          if (res.confirm) {
+            // 用户同意,记录状态并执行初始化
+            uni.setStorageSync('privacy_agreed', true);
+            this.doAfterPrivacy();
+          } else {
+            // 用户不同意,二次确认
+            uni.showModal({
+              title: '提示',
+              content: '您需要同意隐私协议才能使用本应用',
+              confirmText: '再次查看完整协议',
+              cancelText: '退出应用',
+              success: (res2) => {
+                if (res2.confirm) {
+                  // 跳转到完整协议页面
+                  uni.navigateTo({
+                    url: '/pages/login/agreement',
+                  });
+                  // 同时重新弹出摘要弹窗让用户做最终决定
+                  setTimeout(() => {
+                    this.showPrivacyModal();
+                  }, 500);
+                } else {
+                  // 退出应用
+                  // #ifdef APP-PLUS
+                  plus.runtime.quit();
+                  // #endif
+                }
+              },
+            });
+          }
+        },
+        fail: () => {
+          // 弹窗失败(如 App 启动早期),延迟重试
+          setTimeout(() => {
+            this.showPrivacyModal();
+          }, 300);
+        },
+      });
+    },
+    // 隐私协议同意后才执行的初始化逻辑
+    doAfterPrivacy() {
+      // 已登录时提前拉取权限列表,保证"未经过首页"等特殊入口也能拿到权限数据(非阻塞)
+      if (uni.getStorageSync('session_key')) {
+        fetchPermissionList();
+      }
+    },
+  },
+  onShow: function () {
+    console.log('App Show');
+  },
+  onHide: function () {
+    console.log('App Hide');
+  },
+};
 </script>
 <style lang="scss">
-	@import "./static/font/iconfont.css";
-	@import "./static/iconfont/iconfont.css";
-	html {
-		box-sizing: border-box;
-		font-size: 28rpx !important;
-	}
+@import './static/font/iconfont.css';
+@import './static/iconfont/iconfont.css';
+html {
+  box-sizing: border-box;
+  font-size: 28rpx !important;
+}
 
-	.status_bar {
-		height: 44px;
-		width: 100%;
-		background-color: #FFFFFF;
-		position: fixed;
-		top: 0;
-		z-index: 99999;
-	}
+.status_bar {
+  height: 44px;
+  width: 100%;
+  background-color: #ffffff;
+  position: fixed;
+  top: 0;
+  z-index: 99999;
+}
 </style>

BIN
pages/login/assets/logo.png


+ 367 - 259
pages/login/login.vue

@@ -1,98 +1,119 @@
 <template>
-  <view class="bg-img">
-    <!-- <view class="status_bar"></view> -->
-    <view class="apptitle" @longpress="logoTime">
-      {{ $isneutral ? '云飞智控' : '智控' }}
+  <view class="login-container">
+    <!-- 顶部渐变背景区域 -->
+    <view class="header-bg"></view>
+
+    <!-- Logo 区域(长按显示设置按钮) -->
+    <view class="logo-section" @longpress="logoTime">
+      <view class="logo-circle">
+        <image
+          src="./assets/logo.png"
+          class="logo-img"
+          mode="aspectFit"
+        ></image>
+      </view>
+      <text class="app-title">{{
+        $isneutral ? '智慧农业大数据平台' : '云飞智控'
+      }}</text>
     </view>
-    <view class="set" @click="set" v-if="setTF">
-      <u-icon name="setting-fill" size="50" color="#fff"></u-icon>
+
+    <!-- 设置按钮(长按 Logo 显示) -->
+    <view class="set-btn" @click="set" v-if="setTF">
+      <u-icon name="setting-fill" size="44" color="#24b35d"></u-icon>
     </view>
-    <view class="formbox">
+
+    <!-- 登录表单卡片 -->
+    <view class="form-card">
       <form @submit="formSubmit">
-        <view class="uni-form-item uni-column">
-          <view class="username">
-            <u-icon
-              name="account"
-              size="36"
-              style="margin-right: 30rpx; color: #fff"
-            ></u-icon>
-            <u-input
-              class="uni-input"
-              name="username"
-              v-model="formdata.username"
-              placeholder-class="icon iconfont icon-bianji1"
-              placeholder="请输入用户名"
-              placeholderStyle="color:#ffffff;"
-              color="#FFFFFF"
-              @blur="blur"
-            />
-          </view>
-          <view class="passwold">
-            <u-icon
-              name="lock"
-              size="36"
-              style="margin-right: 30rpx; color: #fff"
-            ></u-icon>
-            <u-input
-              v-model="formdata.passwold"
-              type="password"
-              :password-icon="true"
-              :clearable="false"
-              placeholder="请输入密码"
-              @confirm="formSubmit"
-              @input="passwoldddata"
-              placeholderStyle="color:#fff;"
-              suffixIconStyle="color:#fff;"
-              color="#fff"
-              class="uni-input"
-            />
-          </view>
-          <view class="aboutpass">
-            <u-checkbox-group>
-              <u-checkbox
-                v-model="checked"
-                :label-disabled="false"
-                size="28"
-                @change="rempass"
-                >记住密码</u-checkbox
-              >
-            </u-checkbox-group>
-          </view>
-          <view class="uni-btn-v">
-            <button form-type="submit" @click="denglu">登 录</button>
-          </view>
-          <!--用户隐私协议-->
-          <view class="agreement">
-            <u-checkbox-group>
-              <u-checkbox
-                v-model="agree"
-                shape="circle"
-                size="28"
-                active-color="#2979ff"
-                :label-disabled="false"
-                >我已阅读并同意
-              </u-checkbox>
-            </u-checkbox-group>
-            <text class="agree-link" @click="goAgreement"
-              >《用户隐私协议》</text
+        <!-- 账号输入 -->
+        <view class="form-item">
+          <u-icon name="account" size="36" color="#999"></u-icon>
+          <u-input
+            v-model="formdata.username"
+            class="form-input"
+            placeholder="请输入账号/手机号"
+            placeholderStyle="color:#BBBBBB;"
+            color="#333"
+            :border="false"
+            @blur="blur"
+          />
+        </view>
+
+        <!-- 密码输入 -->
+        <view class="form-item">
+          <u-icon name="lock" size="36" color="#999"></u-icon>
+          <u-input
+            v-model="formdata.passwold"
+            type="password"
+            :password-icon="true"
+            :clearable="false"
+            placeholder="请输入密码"
+            placeholderStyle="color:#BBBBBB;"
+            suffixIconStyle="color:#999;"
+            color="#333"
+            :border="false"
+            class="form-input"
+            @confirm="formSubmit"
+            @input="passwoldddata"
+          />
+        </view>
+
+        <!-- 记住密码 -->
+        <view class="form-extra">
+          <u-checkbox-group>
+            <u-checkbox
+              v-model="checked"
+              shape="square"
+              size="28"
+              active-color="#24b35d"
+              :label-disabled="false"
+              @change="rempass"
+              >记住密码</u-checkbox
             >
-          </view>
+          </u-checkbox-group>
+        </view>
+
+        <!-- 登录按钮 -->
+        <view class="login-btn-wrap">
+          <button form-type="submit" class="login-btn" @click="denglu">
+            登 录
+          </button>
+        </view>
+
+        <!-- 用户隐私协议 -->
+        <view class="agreement">
+          <u-checkbox-group>
+            <u-checkbox
+              v-model="agree"
+              shape="circle"
+              size="26"
+              active-color="#24b35d"
+              :label-disabled="false"
+            >
+              我已阅读并同意
+            </u-checkbox>
+          </u-checkbox-group>
+          <text class="agree-link" @click="goAgreement">《用户隐私协议》</text>
         </view>
       </form>
     </view>
-    <!-- <view class="bg">
-			<image :src="$imageURL+ '/bigdata_app'+'/image/login/850c9307f4ef2d7dc6db1049711ab55.jpg'" mode=""></image>
-		</view> -->
+
+    <!-- 底部版本号 -->
+    <view class="version-footer">
+      <text class="version-text">V{{ appVersion || '1.0.0' }}</text>
+    </view>
+
+    <!-- 设置服务器地址弹窗 -->
     <view class="setbg" v-if="setbgtf">
       <view class="mengban" @click.stop="setbgtf = !setbgtf"></view>
       <view class="set_http">
         <view class="set_http_top">
           <u-icon name="close" size="40" @click="setbgtf = !setbgtf"></u-icon>
-          <p>设置服务器地址</p>
+          <text class="set_title">设置服务器地址</text>
           <u-icon name="checkbox-mark" size="40" @click="sethttp"></u-icon>
         </view>
         <view class="set_http_bot">
-          <p>服务器访问地址</p>
+          <text class="set_label">服务器访问地址</text>
           <view class="set_http_bot_input">
             <input
               type="text"
@@ -107,7 +128,7 @@
           <scroll-view scroll-y="true" class="scroll-Y" v-if="arrowtf">
             <view
               :id="'demo' + index"
-              class="scroll-view-item uni-bg-red"
+              class="scroll-view-item"
               v-for="(item, index) in httparr"
               :key="index"
               @click="value = item"
@@ -117,6 +138,8 @@
         </view>
       </view>
     </view>
+
+    <!-- 升级弹窗 -->
     <u-modal
       title="升级中请勿随意操作"
       :show-confirm-button="false"
@@ -126,7 +149,7 @@
       <view class="upgradeBox">
         <u-line-progress
           v-show="isShow"
-          active-color="#19be6b"
+          active-color="#24b35d"
           :striped="true"
           :percent="percentNum"
           :striped-active="true"
@@ -150,17 +173,26 @@ export default {
       value: 'https://web.hnyfwlw.com',
       httparr: ['https://web.hnyfwlw.com'],
       arrowtf: false,
-      showA: false, //
+      showA: false,
       contentA: '',
-      isShow: false, //进度条
-      percentNum: 0, //在线下载进度
+      isShow: false,
+      percentNum: 0,
       passvalue: false,
       turnover: true,
       agree: false,
+      appVersion: '',
     };
   },
   onLoad() {},
   onShow() {
+    // 获取当前 app 版本号
+    // #ifdef APP-PLUS
+    this.appVersion = plus.runtime.version;
+    // #endif
+    // #ifndef APP-PLUS
+    this.appVersion = '1.0.0';
+    // #endif
+    // 恢复记住的密码
     uni.getStorage({
       key: 'user_pass',
       success: (res) => {
@@ -172,12 +204,14 @@ export default {
         }
       },
     });
+    // 恢复记住的用户名
     uni.getStorage({
       key: 'user_name',
       success: (res) => {
         this.formdata.username = res.data;
       },
     });
+    // 恢复服务器地址
     uni.getStorage({
       key: 'http',
       success: (res) => {
@@ -195,6 +229,7 @@ export default {
     this.getEquipList();
   },
   methods: {
+    // 版本检测
     async getEquipList() {
       const res = await this.$myRequest({
         url: '/api/api_gateway?method=home.homes.app_version_record',
@@ -225,7 +260,6 @@ export default {
                   this.isShow = true;
                   this.upgrade();
                 } else if (res.cancel) {
-                  // plus.runtime.quit();
                   console.log('用户点击取消');
                   uni.showModal({
                     title: '是否每次进入提示更新?',
@@ -278,24 +312,24 @@ export default {
         }
       }
     },
+    // 应用升级下载
     upgrade() {
       console.log(this.appName);
-      // var url = this.value + "/app_file/" + this.appName
       var appName = '';
       if (this.$isneutral) {
-        appName = 'big_data'; //云飞
+        appName = 'big_data'; // 云飞
       } else {
-        appName = 'big_data2'; //中性
+        appName = 'big_data2'; // 中性
       }
       var url = 'https://hnyfwlw.com/app/' + appName + '.apk';
       const downloadTask = uni.downloadFile({
-        url: url, //仅为示例,并非真实的资源
+        url: url,
         success: (res) => {
           console.log(res);
           if (res.statusCode === 200) {
             console.log('下载成功');
             console.log(
-              '安装包下载成功,即将安装:' + JSON.stringify(res, null, 4)
+              '安装包下载成功,即将安装:' + JSON.stringify(res, null, 4),
             );
             plus.runtime.openFile(res.tempFilePath);
             this.showA = false;
@@ -316,7 +350,25 @@ export default {
         }
       });
     },
+    // 登录表单提交
     async formSubmit() {
+      // 1. 必填校验:用户名
+      if (!this.formdata.username || !this.formdata.username.trim()) {
+        uni.showToast({
+          title: '请输入账号/手机号',
+          icon: 'none',
+        });
+        return;
+      }
+      // 2. 必填校验:密码
+      if (!this.formdata.passwold) {
+        uni.showToast({
+          title: '请输入密码',
+          icon: 'none',
+        });
+        return;
+      }
+      // 3. 隐私协议校验
       if (!this.agree) {
         uni.showToast({
           title: '请先阅读并同意用户隐私协议',
@@ -324,34 +376,56 @@ export default {
         });
         return;
       }
-      const res = await this.$myRequest({
-        url: '/api/api_gateway?method=user.login.login_user',
-        data: {
-          username: this.formdata.username,
-          password: this.formdata.passwold,
-        },
-      });
+      // 4. 发起登录请求(仅成功时才继续后续流程)
+      try {
+        const res = await this.$myRequest({
+          url: '/api/api_gateway?method=user.login.login_user',
+          data: {
+            username: this.formdata.username,
+            password: this.formdata.passwold,
+          },
+        });
 
-      let session_key = res.session_key;
-      uni.setStorage({
-        key: 'session_key',
-        data: session_key,
-        success: () => {
-          // 登录前清除可能残留的权限缓存,再用新账号拉取
-          this.$resetPermissionList()
-          this.$fetchPermissionList()
-          uni.switchTab({
-            url: '../index/index',
+        // 兼容:登录接口可能直接返回 session_key,也可能在 data 里
+        let session_key = res.session_key || (res.data && res.data.session_key);
+        if (!session_key) {
+          uni.showToast({
+            title: res.msg || res.message || '登录失败,请检查账号密码',
+            icon: 'none',
           });
-        },
-      });
+          return;
+        }
+
+        // 5. 登录成功,存储 session_key 并跳转
+        uni.setStorage({
+          key: 'session_key',
+          data: session_key,
+          success: () => {
+            // 登录前清除可能残留的权限缓存,再用新账号拉取
+            this.$resetPermissionList();
+            this.$fetchPermissionList();
+            uni.switchTab({
+              url: '../index/index',
+            });
+          },
+        });
+      } catch (err) {
+        // 网络错误或接口抛错,提示后不再往下走
+        console.log('登录请求失败:', err);
+        uni.showToast({
+          title: (err && err.message) || '网络异常,请稍后重试',
+          icon: 'none',
+        });
+      }
     },
+    // 密码输入过滤中文
     passwoldddata() {
       this.formdata.passwold = this.formdata.passwold.replace(
         /[\u4E00-\u9FA5]/g,
-        ''
+        '',
       );
     },
+    // 记住密码
     rempass(val) {
       this.passvalue = val.value;
       if (val.value) {
@@ -364,6 +438,7 @@ export default {
         });
       }
     },
+    // 用户名失焦保存
     blur(val) {
       uni.setStorage({
         key: 'user_name',
@@ -373,18 +448,20 @@ export default {
         },
       });
     },
+    // 长按标题触发设置按钮显示
     logoTime() {
       this.setTF = true;
     },
+    // 打开设置弹窗
     set() {
       this.setbgtf = true;
     },
+    // 保存服务器地址设置
     sethttp() {
       uni.setStorage({
         key: 'http',
         data: this.value,
         success: () => {
-          // console.log(this.value);
           this.setbgtf = false;
           uni.showToast({
             title: '修改成功',
@@ -397,9 +474,11 @@ export default {
         },
       });
     },
+    // 服务器地址下拉展开/收起
     arrow() {
       this.arrowtf = !this.arrowtf;
     },
+    // 登录时处理记住密码
     denglu() {
       if (this.passvalue) {
         uni.setStorage({
@@ -418,6 +497,7 @@ export default {
         });
       }
     },
+    // 跳转用户隐私协议
     goAgreement() {
       uni.navigateTo({
         url: './agreement',
@@ -427,146 +507,183 @@ export default {
 };
 </script>
 
-<style lang="scss">
-.bg-img {
+<style lang="scss" scoped>
+/* 页面整体容器 */
+.login-container {
   height: 100vh;
-  background-image: url(../../static/images/login/bg.png);
-  background-size: 100% 100%;
-  padding-top: 500rpx;
+  width: 100%;
+  background: linear-gradient(180deg, #e8f7ef 0%, #f5f9f6 45%, #ffffff 100%);
+  position: relative;
+  overflow: hidden;
   box-sizing: border-box;
 }
-.apptitle {
-  font-size: 52rpx;
-  color: #fff;
-  width: 80%;
-  margin: 0 auto 40rpx;
-}
-.logo {
+
+/* 顶部淡绿色渐变背景层 */
+.header-bg {
+  position: absolute;
+  top: 0;
+  left: 0;
   width: 100%;
-  height: 340rpx;
-  text-align: center;
+  height: 420rpx;
+  background: linear-gradient(180deg, #c8ecdb 0%, #e8f7ef 100%);
+  z-index: 0;
+}
+
+/* Logo 区域 */
+.logo-section {
+  position: relative;
+  z-index: 1;
   display: flex;
+  flex-direction: column;
   align-items: center;
-  padding-top: 240rpx;
+  padding-top: 160rpx;
+}
 
-  image {
-    width: 280rpx;
-    margin: 0 auto;
-    height: 120rpx;
-  }
+/* 绿色圆形 Logo */
+.logo-circle {
+  width: 160rpx;
+  height: 160rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 32rpx;
 }
 
-.set {
+/* Logo 内的真实图片 */
+.logo-img {
+  width: 80%;
+  height: 80%;
+}
+
+/* 应用标题 */
+.app-title {
+  font-size: 40rpx;
+  color: #333333;
+  font-weight: 500;
+  letter-spacing: 2rpx;
+}
+
+/* 设置按钮 */
+.set-btn {
   position: absolute;
-  right: 50rpx;
-  top: 150rpx;
+  right: 40rpx;
+  top: 80rpx;
+  z-index: 10;
 }
 
-.bg {
-  width: 100%;
-  position: fixed;
-  bottom: 0;
-  left: 0;
-  z-index: -1;
+/* 登录表单(无卡片,直接平铺) */
+.form-card {
+  position: relative;
+  z-index: 1;
+  width: 640rpx;
+  margin: 72rpx auto 0;
+  padding: 0 16rpx;
+}
 
-  image {
-    width: 100%;
+/* 表单输入项 */
+.form-item {
+  display: flex;
+  align-items: center;
+  border-bottom: 1rpx solid #e5e5e5;
+  padding: 28rpx 0;
+
+  .form-input {
+    flex: 1;
+    margin-left: 20rpx;
+    font-size: 28rpx;
+  }
+
+  ::v-deep .uni-input-input {
+    color: #333333 !important;
+    font-size: 28rpx !important;
+  }
+
+  ::v-deep .uicon-eye,
+  ::v-deep .uicon-eye-off {
+    color: #bbbbbb !important;
   }
 }
 
-::v-deep .u-input__right-icon {
-  line-height: 35px !important;
+/* 表单附加项:记住密码 */
+.form-extra {
+  margin-top: 24rpx;
+  display: flex;
+  align-items: center;
+
+  ::v-deep .u-checkbox__label {
+    font-size: 26rpx;
+    color: #666666;
+    margin-left: 8rpx;
+  }
+
+  ::v-deep .u-checkbox__icon-wrap {
+    border-color: #cccccc;
+  }
 }
-.uni-form-item {
-  width: 100%;
 
-  .username {
-    width: 80%;
-    margin: 0 auto;
-    display: flex;
-    margin-bottom: 40rpx;
-    padding-bottom: 10rpx;
-    border-bottom: 2rpx solid rgba(249, 249, 249, 0.4);
+/* 登录按钮 */
+.login-btn-wrap {
+  margin-top: 48rpx;
 
-    .u-icon__icon {
-      margin-top: 17rpx;
-    }
+  .login-btn {
+    width: 100%;
+    height: 96rpx;
+    line-height: 96rpx;
+    background: linear-gradient(135deg, #24b35d 0%, #1a9e4e 100%);
+    border-radius: 48rpx;
+    color: #ffffff;
+    font-size: 32rpx;
+    font-weight: 500;
+    border: none;
+    box-shadow: 0 8rpx 24rpx rgba(36, 179, 93, 0.3);
 
-    .uni-input {
-      width: 100%;
-      color: #fff;
-    }
-    ::v-deep .uni-input-input {
-      color: #fff;
+    &::after {
+      border: none;
     }
   }
+}
 
-  .passwold {
-    width: 80%;
-    margin: 0 auto;
-    display: flex;
-    margin-bottom: 40rpx;
-    padding-bottom: 10rpx;
-    border-bottom: 2rpx solid rgba(249, 249, 249, 0.4);
+/* 用户隐私协议 */
+.agreement {
+  margin-top: 28rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 
-    .u-icon__icon {
-      margin-top: 17rpx;
-    }
-    ::v-deep .uni-input-input {
-      color: #fff;
-    }
-    .uni-input {
-      width: 100%;
-      color: #fff;
-    }
-    ::v-deep .uicon-eye {
-      color: #fff !important;
-    }
+  ::v-deep .u-checkbox__label {
+    font-size: 22rpx;
+    color: #999999;
+    margin-left: 4rpx;
   }
 
-  .aboutpass {
-    width: 80%;
-    margin: 0 auto;
-    display: flex;
-    justify-content: flex-end;
+  ::v-deep .u-checkbox__icon-wrap {
+    border-color: #cccccc;
+  }
 
-    p {
-      color: #fff;
-      font-size: 28rpx;
-    }
-    ::v-deep .uicon-checkbox-mark {
-      border-color: #ff0000;
-      // color: #f00 !important;
-    }
-    ::v-deep .u-checkbox__label {
-      font-size: 28rpx;
-      color: #fff;
-      margin-right: 0;
-    }
+  .agree-link {
+    font-size: 22rpx;
+    color: #24b35d;
+    margin-left: 4rpx;
   }
+}
 
-  .uni-btn-v {
-    width: 80%;
-    margin: 112rpx auto 0;
-    position: relative;
-    z-index: 100;
+/* 底部版本号 */
+.version-footer {
+  position: absolute;
+  bottom: 60rpx;
+  left: 0;
+  width: 100%;
+  text-align: center;
+  z-index: 1;
 
-    button {
-      width: 100%;
-      height: 90rpx;
-      line-height: 90rpx;
-      color: #ffffff;
-      font-size: 36rpx;
-      background-image: linear-gradient(
-        to bottom,
-        rgba(249, 249, 249, 0.6),
-        rgba(249, 249, 249, 0.1)
-      );
-      color: #5dc18b;
-    }
+  .version-text {
+    font-size: 24rpx;
+    color: #bbbbbb;
+    letter-spacing: 4rpx;
   }
 }
 
+/* 服务器设置弹窗 */
 .setbg {
   width: 100%;
   height: 100vh;
@@ -591,75 +708,66 @@ export default {
     .set_http_top {
       display: flex;
       justify-content: space-around;
-      background-color: #5dc18b;
-      height: 60px;
-      line-height: 60px;
+      align-items: center;
+      background-color: #24b35d;
+      height: 100rpx;
+      line-height: 100rpx;
       color: #ffffff;
-      border-top-right-radius: 20px;
-      border-top-left-radius: 20px;
-      font-size: 32rpx;
+      border-top-right-radius: 20rpx;
+      border-top-left-radius: 20rpx;
+
+      .set_title {
+        font-size: 30rpx;
+      }
     }
 
     .set_http_bot {
-      height: 150px;
       background-color: #ffffff;
-      border-bottom-right-radius: 20px;
-      border-bottom-left-radius: 20px;
-      padding: 30px;
+      border-bottom-right-radius: 20rpx;
+      border-bottom-left-radius: 20rpx;
+      padding: 30rpx;
+
+      .set_label {
+        font-size: 26rpx;
+        color: #666666;
+      }
 
       .set_http_bot_input {
         margin-top: 20rpx;
-        border: 2rpx solid #bdb6a6;
-        border-radius: 20rpx;
-        padding: 10rpx 40rpx 0 20rpx;
-        font-size: 32rpx;
-        height: 30px;
+        border: 2rpx solid #eeeeee;
+        border-radius: 12rpx;
+        padding: 16rpx 24rpx;
+        font-size: 28rpx;
         display: flex;
         justify-content: space-between;
+        align-items: center;
 
         input {
           width: 90%;
+          font-size: 28rpx;
         }
       }
     }
 
     .scroll-Y {
-      border: 2rpx solid #d0d0d0;
-      border-radius: 20rpx;
+      border: 2rpx solid #eeeeee;
+      border-radius: 12rpx;
+      margin-top: 16rpx;
 
       .scroll-view-item {
-        padding-left: 20rpx;
+        padding: 0 20rpx;
         height: 70rpx;
-        font-size: 28rpx;
+        font-size: 26rpx;
         line-height: 70rpx;
-        border-bottom: 2rpx solid #d0d0d0;
+        border-bottom: 2rpx solid #f5f5f5;
+        color: #333333;
       }
     }
   }
 }
 
+/* 升级进度框 */
 .upgradeBox {
   padding: 15rpx;
 }
-.agreement {
-  width: 80%;
-  margin: 40rpx auto 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-  /deep/.u-checkbox__label {
-    font-size: 24rpx;
-    color: #fff;
-    margin-right: 0;
-  }
-  /deep/.u-checkbox__icon-wrap {
-    border-color: rgba(255, 255, 255, 0.8);
-  }
-  .agree-link {
-    font-size: 24rpx;
-    color: #fff;
-    text-decoration: underline;
-  }
-}
 </style>

+ 665 - 0
pages/login/loginOld.vue

@@ -0,0 +1,665 @@
+<template>
+  <view class="bg-img">
+    <!-- <view class="status_bar"></view> -->
+    <view class="apptitle" @longpress="logoTime">
+      {{ $isneutral ? '云飞智控' : '智控' }}
+    </view>
+    <view class="set" @click="set" v-if="setTF">
+      <u-icon name="setting-fill" size="50" color="#fff"></u-icon>
+    </view>
+    <view class="formbox">
+      <form @submit="formSubmit">
+        <view class="uni-form-item uni-column">
+          <view class="username">
+            <u-icon
+              name="account"
+              size="36"
+              style="margin-right: 30rpx; color: #fff"
+            ></u-icon>
+            <u-input
+              class="uni-input"
+              name="username"
+              v-model="formdata.username"
+              placeholder-class="icon iconfont icon-bianji1"
+              placeholder="请输入用户名"
+              placeholderStyle="color:#ffffff;"
+              color="#FFFFFF"
+              @blur="blur"
+            />
+          </view>
+          <view class="passwold">
+            <u-icon
+              name="lock"
+              size="36"
+              style="margin-right: 30rpx; color: #fff"
+            ></u-icon>
+            <u-input
+              v-model="formdata.passwold"
+              type="password"
+              :password-icon="true"
+              :clearable="false"
+              placeholder="请输入密码"
+              @confirm="formSubmit"
+              @input="passwoldddata"
+              placeholderStyle="color:#fff;"
+              suffixIconStyle="color:#fff;"
+              color="#fff"
+              class="uni-input"
+            />
+          </view>
+          <view class="aboutpass">
+            <u-checkbox-group>
+              <u-checkbox
+                v-model="checked"
+                :label-disabled="false"
+                size="28"
+                @change="rempass"
+                >记住密码</u-checkbox
+              >
+            </u-checkbox-group>
+          </view>
+          <view class="uni-btn-v">
+            <button form-type="submit" @click="denglu">登 录</button>
+          </view>
+          <!--用户隐私协议-->
+          <view class="agreement">
+            <u-checkbox-group>
+              <u-checkbox
+                v-model="agree"
+                shape="circle"
+                size="28"
+                active-color="#2979ff"
+                :label-disabled="false"
+                >我已阅读并同意
+              </u-checkbox>
+            </u-checkbox-group>
+            <text class="agree-link" @click="goAgreement"
+              >《用户隐私协议》</text
+            >
+          </view>
+        </view>
+      </form>
+    </view>
+    <!-- <view class="bg">
+			<image :src="$imageURL+ '/bigdata_app'+'/image/login/850c9307f4ef2d7dc6db1049711ab55.jpg'" mode=""></image>
+		</view> -->
+    <view class="setbg" v-if="setbgtf">
+      <view class="mengban" @click.stop="setbgtf = !setbgtf"></view>
+      <view class="set_http">
+        <view class="set_http_top">
+          <u-icon name="close" size="40" @click="setbgtf = !setbgtf"></u-icon>
+          <p>设置服务器地址</p>
+          <u-icon name="checkbox-mark" size="40" @click="sethttp"></u-icon>
+        </view>
+        <view class="set_http_bot">
+          <p>服务器访问地址</p>
+          <view class="set_http_bot_input">
+            <input
+              type="text"
+              v-model="value"
+              placeholder="请在此处输入服务器地址(http://...)"
+            />
+            <u-icon
+              :name="arrowtf ? 'arrow-up' : 'arrow-down'"
+              @click="arrow"
+            ></u-icon>
+          </view>
+          <scroll-view scroll-y="true" class="scroll-Y" v-if="arrowtf">
+            <view
+              :id="'demo' + index"
+              class="scroll-view-item uni-bg-red"
+              v-for="(item, index) in httparr"
+              :key="index"
+              @click="value = item"
+              >{{ item }}</view
+            >
+          </scroll-view>
+        </view>
+      </view>
+    </view>
+    <u-modal
+      title="升级中请勿随意操作"
+      :show-confirm-button="false"
+      v-model="showA"
+      :content="contentA"
+    >
+      <view class="upgradeBox">
+        <u-line-progress
+          v-show="isShow"
+          active-color="#19be6b"
+          :striped="true"
+          :percent="percentNum"
+          :striped-active="true"
+        ></u-line-progress>
+      </view>
+    </u-modal>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      checked: false,
+      formdata: {
+        username: '',
+        passwold: '',
+      },
+      setbgtf: false,
+      setTF: false,
+      value: 'https://web.hnyfwlw.com',
+      httparr: ['https://web.hnyfwlw.com'],
+      arrowtf: false,
+      showA: false, //
+      contentA: '',
+      isShow: false, //进度条
+      percentNum: 0, //在线下载进度
+      passvalue: false,
+      turnover: true,
+      agree: false,
+    };
+  },
+  onLoad() {},
+  onShow() {
+    uni.getStorage({
+      key: 'user_pass',
+      success: (res) => {
+        if (res.data) {
+          this.formdata.passwold = res.data;
+          this.checked = true;
+        } else {
+          this.checked = false;
+        }
+      },
+    });
+    uni.getStorage({
+      key: 'user_name',
+      success: (res) => {
+        this.formdata.username = res.data;
+      },
+    });
+    uni.getStorage({
+      key: 'http',
+      success: (res) => {
+        this.value = res.data;
+      },
+    });
+    console.log(this.value);
+    uni.getStorage({
+      key: 'turnover',
+      success: (res) => {
+        console.log(res.data);
+        this.turnover = res.data;
+      },
+    });
+    this.getEquipList();
+  },
+  methods: {
+    async getEquipList() {
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=home.homes.app_version_record',
+        data: {
+          ret: 'first',
+        },
+      });
+      console.log(res);
+      this.appName = res[0].app_name;
+      this.versions = Number(res[0].app_num.match(/\d+/g).join(''));
+      var id = Number(plus.runtime.version.match(/\d+/g).join(''));
+      console.log(this.versions, plus.runtime.version);
+      if (this.percentNum > 0) {
+        console.log('更新中');
+      } else {
+        console.log(this.turnover);
+        if (this.turnover) {
+          if (this.versions > id) {
+            uni.showModal({
+              title: '检测到有新版本,是否更新?',
+              content: '建议更新,不更新可能会出现部分数据无法获取!',
+              confirmText: '更新',
+              cancelText: '不更新',
+              success: (res) => {
+                if (res.confirm) {
+                  console.log('用户点击确定');
+                  this.showA = true;
+                  this.isShow = true;
+                  this.upgrade();
+                } else if (res.cancel) {
+                  // plus.runtime.quit();
+                  console.log('用户点击取消');
+                  uni.showModal({
+                    title: '是否每次进入提示更新?',
+                    content: '不再提示后可在<我的>-<关于我们>-<版本更新>中更新',
+                    confirmText: '提示',
+                    cancelText: '不再提示',
+                    success: (res) => {
+                      if (res.confirm) {
+                        console.log('用户点击确定');
+                        uni.setStorage({
+                          key: 'turnover',
+                          data: true,
+                        });
+                      } else if (res.cancel) {
+                        uni.setStorage({
+                          key: 'turnover',
+                          data: false,
+                        });
+                      }
+                    },
+                  });
+                }
+              },
+            });
+          } else {
+            uni.getStorage({
+              key: 'session_key',
+              success: (res) => {
+                console.log(res);
+                if (res.data != '') {
+                  uni.switchTab({
+                    url: '../index/index',
+                  });
+                }
+              },
+            });
+          }
+        } else {
+          uni.getStorage({
+            key: 'session_key',
+            success: (res) => {
+              console.log(res);
+              if (res.data != '') {
+                uni.switchTab({
+                  url: '../index/index',
+                });
+              }
+            },
+          });
+        }
+      }
+    },
+    upgrade() {
+      console.log(this.appName);
+      // var url = this.value + "/app_file/" + this.appName
+      var appName = '';
+      if (this.$isneutral) {
+        appName = 'big_data'; //云飞
+      } else {
+        appName = 'big_data2'; //中性
+      }
+      var url = 'https://hnyfwlw.com/app/' + appName + '.apk';
+      const downloadTask = uni.downloadFile({
+        url: url, //仅为示例,并非真实的资源
+        success: (res) => {
+          console.log(res);
+          if (res.statusCode === 200) {
+            console.log('下载成功');
+            console.log(
+              '安装包下载成功,即将安装:' + JSON.stringify(res, null, 4)
+            );
+            plus.runtime.openFile(res.tempFilePath);
+            this.showA = false;
+            this.isShow = false;
+          }
+        },
+        fail: (err) => {
+          console.log(err);
+        },
+        complete: (com) => {
+          console.log(com);
+        },
+      });
+      downloadTask.onProgressUpdate((res) => {
+        this.percentNum = res.progress;
+        if (res.progress == 100) {
+          console.log('下载完成了');
+        }
+      });
+    },
+    async formSubmit() {
+      if (!this.agree) {
+        uni.showToast({
+          title: '请先阅读并同意用户隐私协议',
+          icon: 'none',
+        });
+        return;
+      }
+      const res = await this.$myRequest({
+        url: '/api/api_gateway?method=user.login.login_user',
+        data: {
+          username: this.formdata.username,
+          password: this.formdata.passwold,
+        },
+      });
+
+      let session_key = res.session_key;
+      uni.setStorage({
+        key: 'session_key',
+        data: session_key,
+        success: () => {
+          // 登录前清除可能残留的权限缓存,再用新账号拉取
+          this.$resetPermissionList()
+          this.$fetchPermissionList()
+          uni.switchTab({
+            url: '../index/index',
+          });
+        },
+      });
+    },
+    passwoldddata() {
+      this.formdata.passwold = this.formdata.passwold.replace(
+        /[\u4E00-\u9FA5]/g,
+        ''
+      );
+    },
+    rempass(val) {
+      this.passvalue = val.value;
+      if (val.value) {
+        uni.setStorage({
+          key: 'user_pass',
+          data: this.formdata.passwold,
+          success: function () {
+            console.log('success');
+          },
+        });
+      }
+    },
+    blur(val) {
+      uni.setStorage({
+        key: 'user_name',
+        data: val,
+        success: function () {
+          console.log('success');
+        },
+      });
+    },
+    logoTime() {
+      this.setTF = true;
+    },
+    set() {
+      this.setbgtf = true;
+    },
+    sethttp() {
+      uni.setStorage({
+        key: 'http',
+        data: this.value,
+        success: () => {
+          // console.log(this.value);
+          this.setbgtf = false;
+          uni.showToast({
+            title: '修改成功',
+            icon: 'none',
+          });
+          this.getEquipList();
+          uni.removeStorage({
+            key: 'session_key',
+          });
+        },
+      });
+    },
+    arrow() {
+      this.arrowtf = !this.arrowtf;
+    },
+    denglu() {
+      if (this.passvalue) {
+        uni.setStorage({
+          key: 'user_pass',
+          data: this.formdata.passwold,
+          success: function () {
+            console.log('success');
+          },
+        });
+      } else {
+        uni.removeStorage({
+          key: 'user_pass',
+          success: function () {
+            console.log('success');
+          },
+        });
+      }
+    },
+    goAgreement() {
+      uni.navigateTo({
+        url: './agreement',
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss">
+.bg-img {
+  height: 100vh;
+  background-image: url(../../static/images/login/bg.png);
+  background-size: 100% 100%;
+  padding-top: 500rpx;
+  box-sizing: border-box;
+}
+.apptitle {
+  font-size: 52rpx;
+  color: #fff;
+  width: 80%;
+  margin: 0 auto 40rpx;
+}
+.logo {
+  width: 100%;
+  height: 340rpx;
+  text-align: center;
+  display: flex;
+  align-items: center;
+  padding-top: 240rpx;
+
+  image {
+    width: 280rpx;
+    margin: 0 auto;
+    height: 120rpx;
+  }
+}
+
+.set {
+  position: absolute;
+  right: 50rpx;
+  top: 150rpx;
+}
+
+.bg {
+  width: 100%;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  z-index: -1;
+
+  image {
+    width: 100%;
+  }
+}
+
+::v-deep .u-input__right-icon {
+  line-height: 35px !important;
+}
+.uni-form-item {
+  width: 100%;
+
+  .username {
+    width: 80%;
+    margin: 0 auto;
+    display: flex;
+    margin-bottom: 40rpx;
+    padding-bottom: 10rpx;
+    border-bottom: 2rpx solid rgba(249, 249, 249, 0.4);
+
+    .u-icon__icon {
+      margin-top: 17rpx;
+    }
+
+    .uni-input {
+      width: 100%;
+      color: #fff;
+    }
+    ::v-deep .uni-input-input {
+      color: #fff;
+    }
+  }
+
+  .passwold {
+    width: 80%;
+    margin: 0 auto;
+    display: flex;
+    margin-bottom: 40rpx;
+    padding-bottom: 10rpx;
+    border-bottom: 2rpx solid rgba(249, 249, 249, 0.4);
+
+    .u-icon__icon {
+      margin-top: 17rpx;
+    }
+    ::v-deep .uni-input-input {
+      color: #fff;
+    }
+    .uni-input {
+      width: 100%;
+      color: #fff;
+    }
+    ::v-deep .uicon-eye {
+      color: #fff !important;
+    }
+  }
+
+  .aboutpass {
+    width: 80%;
+    margin: 0 auto;
+    display: flex;
+    justify-content: flex-end;
+
+    p {
+      color: #fff;
+      font-size: 28rpx;
+    }
+    ::v-deep .uicon-checkbox-mark {
+      border-color: #ff0000;
+      // color: #f00 !important;
+    }
+    ::v-deep .u-checkbox__label {
+      font-size: 28rpx;
+      color: #fff;
+      margin-right: 0;
+    }
+  }
+
+  .uni-btn-v {
+    width: 80%;
+    margin: 112rpx auto 0;
+    position: relative;
+    z-index: 100;
+
+    button {
+      width: 100%;
+      height: 90rpx;
+      line-height: 90rpx;
+      color: #ffffff;
+      font-size: 36rpx;
+      background-image: linear-gradient(
+        to bottom,
+        rgba(249, 249, 249, 0.6),
+        rgba(249, 249, 249, 0.1)
+      );
+      color: #5dc18b;
+    }
+  }
+}
+
+.setbg {
+  width: 100%;
+  height: 100vh;
+  position: absolute;
+  top: 0;
+  z-index: 99999;
+
+  .mengban {
+    width: 100%;
+    height: 100vh;
+    position: absolute;
+    top: 0;
+    background-color: rgba($color: #000000, $alpha: 0.5);
+  }
+
+  .set_http {
+    position: absolute;
+    width: 90%;
+    left: 5%;
+    top: 30%;
+
+    .set_http_top {
+      display: flex;
+      justify-content: space-around;
+      background-color: #5dc18b;
+      height: 60px;
+      line-height: 60px;
+      color: #ffffff;
+      border-top-right-radius: 20px;
+      border-top-left-radius: 20px;
+      font-size: 32rpx;
+    }
+
+    .set_http_bot {
+      height: 150px;
+      background-color: #ffffff;
+      border-bottom-right-radius: 20px;
+      border-bottom-left-radius: 20px;
+      padding: 30px;
+
+      .set_http_bot_input {
+        margin-top: 20rpx;
+        border: 2rpx solid #bdb6a6;
+        border-radius: 20rpx;
+        padding: 10rpx 40rpx 0 20rpx;
+        font-size: 32rpx;
+        height: 30px;
+        display: flex;
+        justify-content: space-between;
+
+        input {
+          width: 90%;
+        }
+      }
+    }
+
+    .scroll-Y {
+      border: 2rpx solid #d0d0d0;
+      border-radius: 20rpx;
+
+      .scroll-view-item {
+        padding-left: 20rpx;
+        height: 70rpx;
+        font-size: 28rpx;
+        line-height: 70rpx;
+        border-bottom: 2rpx solid #d0d0d0;
+      }
+    }
+  }
+}
+
+.upgradeBox {
+  padding: 15rpx;
+}
+.agreement {
+  width: 80%;
+  margin: 40rpx auto 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  /deep/.u-checkbox__label {
+    font-size: 24rpx;
+    color: #fff;
+    margin-right: 0;
+  }
+  /deep/.u-checkbox__icon-wrap {
+    border-color: rgba(255, 255, 255, 0.8);
+  }
+  .agree-link {
+    font-size: 24rpx;
+    color: #fff;
+    text-decoration: underline;
+  }
+}
+</style>

+ 2 - 3
util/api.js

@@ -1,4 +1,3 @@
-
 import config from './neutral.js';
 export const myRequest = (options) => {
   let BASE_URL = uni.getStorageSync('http');
@@ -12,8 +11,8 @@ export const myRequest = (options) => {
     // BASE_URL = 'http://218.28.198.186:10508';
     // BASE_URL = 'http://8.136.98.49:8002';
   }
-  BASE_URL = config.productAPI;
-  // BASE_URL = config.developAPI;
+  // BASE_URL = config.productAPI;
+  BASE_URL = config.developAPI;
   var session_key = '';
   session_key = uni.getStorageSync('session_key');
   let url = '';