From 7d39b1a68266a289f66e3126473d5ebb5bd488d1 Mon Sep 17 00:00:00 2001 From: whycq <10027870+whycq@user.noreply.gitee.com> Date: 星期三, 13 十二月 2023 18:37:42 +0800 Subject: [PATCH] # --- pages/login/login.vue | 709 ++++++++++++++++++++++++++++++++++++---------------------- 1 files changed, 437 insertions(+), 272 deletions(-) diff --git a/pages/login/login.vue b/pages/login/login.vue index e2cd849..6d7f3c6 100644 --- a/pages/login/login.vue +++ b/pages/login/login.vue @@ -1,213 +1,272 @@ - <template> - <view class="zai-box"> - - <scroll-view scroll-y class="page"> - - <view class="text-center" :style="[{animation: 'show ' + 0.4+ 's 1'}]"> - <image src="../../static/logo.png" mode='aspectFit' class="zai-logo "></image> - <view class="zai-title text-shadow ">Zoneyung</view> +<template> + <view> + <!-- 璁剧疆 --> + <view class="settings"> + <view class="settings-btn"> + <uni-icons type="gear" size="30" color="#707070" @click="settings"></uni-icons> </view> - <view class="box padding-lr-xl login-paddingtop" :style="[{animation: 'show ' + 0.6+ 's 1'}]"> - <block v-if="loginWay==1"> - <view class="cu-form-group margin-top shadow-warp" :class="[shape=='round'?'round':'']"> - <view class="title"><text class="cuIcon-people margin-right-xs"></text>璐﹀彿:</view> - <input placeholder="璇疯緭鍏ヨ处鍙�" name="input" v-model="userName"></input> - </view> - <view class="cu-form-group margin-top shadow-warp" :class="[shape=='round'?'round':'']"> - <view class="title"><text class="cuIcon-lock margin-right-xs"></text>瀵嗙爜:</view> - <input class="uni-input" placeholder="璇疯緭鍏ュ瘑鐮�" :password="!showPassword" v-model="password" /> - <view class="action text-lg"> - <text :class="[showPassword ? 'cuIcon-attention' : 'cuIcon-attentionforbid']" @click="changePassword"></text> - </view> - </view> - <view class="changeBox"> - <checkbox-group class="rember"> - <label> - <checkbox value="cb" :checked="rember" @tap="rember = !rember" style="transform:scale(0.7)" /><text>璁颁綇瀵嗙爜</text> - </label> - </checkbox-group> - <text class="changeIP" @click="changeIP()">璁剧疆IP</text> - </view> - <view class="padding text-center margin-top"> - <button class="cu-btn bg-blue lg margin-right shadow" :loading="loading" :class="[shape=='round'?'round':'']" - @tap="onLogin"><text space="emsp">{{loading ? "鐧诲綍涓�...":" 鐧诲綍 "}}</text> - </button> - </view> - </block> - - <!-- #ifdef APP-PLUS --> - <view class="padding flex flex-direction text-center"> - 褰撳墠鐗堟湰:{{version}} - </view> - <!-- #endif --> - - </view> - </scroll-view> - <!-- 鐧诲綍鍔犺浇寮圭獥 --> - <view class="cu-load load-modal" v-if="loading"> - <!-- <view class="cuIcon-emojifill text-orange"></view> --> - <image src="../../static/logo1.png" mode="aspectFit" class="round"></image> - <view class="gray-text">鐧诲綍涓�...</view> </view> + <!-- logo --> + <view class="logo"> + <view class="logo-box"> + <image src="../../static/img/logo.png" mode="aspectFit"></image> + </view> + </view> + <view class="content"> + <!-- 璐﹀彿 --> + <view class="box shadow-warp"> + <view class="box-icon"> + <uni-icons type="person" size="20" color="#707070"></uni-icons> + </view> + <view class="box-text">璐﹀彿:</view> + <view class="box-input"> + <input type="text" placeholder="璇疯緭鍏ヨ处鍙�" v-model="user.userName" + placeholder-style="font-size:14px;color:#ccc;"> + </view> + <view class="box-show"></view> + </view> + <!-- 瀵嗙爜 --> + <view class="box shadow-warp"> + <view class="box-icon"> + <uni-icons type="locked" size="20" color="#707070"></uni-icons> + </view> + <view class="box-text">瀵嗙爜:</view> + <view class="box-input"> + <input :password="!showPassword" placeholder="璇疯緭鍏ュ瘑鐮�" v-model="user.password" + placeholder-style="font-size:14px;color:#ccc;" > + </view> + <view class="box-show"> + <uni-icons type="eye-filled" size="20" color="#707070" v-if="!showPassword" @click="changePassword"></uni-icons> + <uni-icons type="eye" size="20" color="#707070" v-if="showPassword" @click="changePassword"></uni-icons> + </view> + </view> + <!-- 璁颁綇瀵嗙爜 --> + <view class="check"> + <view class="check-left"> + <view>璁颁綇瀵嗙爜</view> + </view> + <view class="check-right"> + <switch :checked='remberPassword' color="#FFCC33" style="zoom:.5" @change="remberChange"/> + </view> + </view> + </view> + <!-- 鐧诲綍鎸夐挳 --> + <view class="submit"> + <view class="" style="width: 400rpx;"> + <button type="primary" @click="onLogin()" :loading="load.loading">{{load.btnText}}</button> + </view> + + </view> + + <!-- 璁剧疆寮圭獥鍖哄煙 --> <view> - <!-- 杈撳叆妗嗙ず渚� --> <uni-popup ref="inputDialog" type="dialog"> - <uni-popup-dialog ref="inputClose" mode="input" title="璇疯緭鍏P" v-model="IP" - placeholder="璇疯緭鍏P" @confirm="dialogInputConfirm"> - </uni-popup-dialog> + <view class="popup"> + <!-- 鏍囬 --> + <view class="title">閰嶇疆</view> + <view class="popup-item"> + <view class="popup-item-left">IP:</view> + <view class="popup-item-right"><input type="text" v-model="url.ip"></view> + </view> + <view class="popup-item"> + <view class="popup-item-left">绔彛:</view> + <view class="popup-item-right"><input type="text" v-model="url.port"></view> + </view> + <view class="popup-item"> + <view class="popup-item-left">椤圭洰:</view> + <view class="popup-item-right"><input type="text" v-model="url.project"></view> + </view> + <view class="btn"> + <view class="btn-left" @click="close">鍙栨秷</view> + <view class="btn-right" @click="settingConfirm">纭</view> + </view> + </view> </uni-popup> </view> - </view> - + + <view> + <!-- 鎻愮ず绐楃ず渚� --> + <uni-popup ref="upVersion" type="dialog"> + <uni-popup-dialog :type="msgType" title="閫氱煡" :content="dialogContent" @confirm="dialogConfirm" + @close="dialogClose"></uni-popup-dialog> + </uni-popup> + </view> + + <!-- 鐗堟湰鍙� --> + <!-- #ifdef APP-PLUS --> + <view class="version"> + 褰撳墠鐗堟湰:{{version}} + </view> + <!-- #endif --> + </view> </template> <script> - // import { ACCESS_TOKEN,USER_NAME,USER_INFO } from "@/common/util/constants" - import { mapActions } from "vuex" - import md5 from '../../common/md5.js' - // import configService from '@/common/service/config.service.js'; - - export default { - data() { - return { - shape:'',//round 鍦嗗舰 - loading: false, - phoneNo: '', - smsCode: '', - showPassword: false, //鏄惁鏄剧ず鏄庢枃 - loginWay: 1, //1: 璐﹀瘑锛�2锛氶獙璇佺爜 - smsCountDown: 0, - smsCountInterval: null, - toggleDelay: false, - version:'', - //绗笁鏂圭櫥褰曠浉鍏充俊鎭� - thirdType:"", - thirdLoginInfo:"", - thirdLoginState:false, - bindingPhoneModal:false, - thirdUserUuid:'', + import md5 from '../../static/js/md5.js' + export default { + data() { + return { + version: '', + showPassword: false, + value: '', + remberPassword: true, url: { - bindingThirdPhone: '/sys/thirdLogin/bindingThirdPhone' + ip: '', + port: '', + project: '' }, - baseIP:'', - type:'', - userName:'', - password:'', - rember:true, - IP:'', - }; - }, - mounted() { - let that = this; - //缂撳瓨鐨勮处鍙� - const HCuname = uni.getStorageSync('HCuname'); - //缂撳瓨鐨勫瘑鐮� - const HCpassw = uni.getStorageSync('HCpassw'); - //鏈夌紦瀛樺氨璧嬪�肩粰鏂囨湰娌℃湁灏辨竻绌� - if (HCuname && HCpassw) { - that.userName = HCuname; - that.password = HCpassw; - } else { - that.userName = ''; - that.password = ''; + baseUrl: '', + user: { + userName: '', + password: '', + }, + load: { + loading: false, + btnText: '鐧诲綍' + }, + msgType: 'success', + filename: '', + dialogContent: '' } - const UIP = uni.getStorageSync('UIP'); - if (UIP) { - that.IP = UIP; - } else { - that.IP = ''; - } - }, - onLoad:function(){ - // #ifdef APP-PLUS - var that=this - plus.runtime.getProperty( plus.runtime.appid, function ( wgtinfo ) { - that.version=wgtinfo.version - }); - // #endif + onLoad() { + this.user = uni.getStorageSync('user') + this.url = uni.getStorageSync('url') + this.baseUrl = uni.getStorageSync('baseUrl') + if (!this.user) { + this.user = {userName: '',password: ''} + } + if (!this.url) { + this.url = {ip: '',port: '',project: ''} + } }, - computed: { - isSendSMSEnable() { - return this.smsCountDown <= 0 && this.phoneNo.length > 4; - }, - getSendBtnText() { - if (this.smsCountDown > 0) { - return this.smsCountDown + '绉掑悗鍙戦��'; - } else { - return '鍙戦�侀獙璇佺爜'; - } - }, - canSMSLogin() { - return this.userName.length > 4 && this.smsCode.length > 4; - }, - canPwdLogin() { - return this.userName.length > 4 && this.password.length > 4; - }, + onShow () { + this.getVersion() }, - methods: { - changeIP(){ + methods: { + // 鏄剧ず/闅愯棌瀵嗙爜 + changePassword() { + this.showPassword = !this.showPassword; + }, + remberChange(e) { + this.remberPassword = !this.remberPassword + }, + // 璁剧疆绐楀彛寮�鍚寜閽� + settings() { this.$refs.inputDialog.open() }, - dialogInputConfirm(type){ - this.baseUrl=type - this.IP = type - this.UIP = type - uni.setStorageSync('UIP',type) + // 璁剧疆绐楀彛纭淇敼鎸夐挳 + dialogInputConfirm() { + this.$refs.inputDialog.close() }, - checkboxChange: function(e) { - if (e.detail.value.length == 1) { - - //鑾峰彇缂撳瓨鐨勮处鍙� - uni.getStorageSync('HCuname',this.userName); - uni.getStorageSync('HCpassw',this.password); - } else { - uni.removeStorageSync('HCuname'); - uni.removeStorageSync('HCpassw'); - } + // 璁剧疆绐楀彛鍏抽棴鎸夐挳 + close() { + this.$refs.inputDialog.close() }, - onLogin: function (){ - if(!this.userName || this.userName.length==0){ - uni.showToast({title: '璇峰~鍐欒处鍙�',icon: "none"}) - return; - } - if(!this.password || this.password.length==0){ - uni.showToast({title: '璇峰~鍐欏瘑鐮�',icon: "none"}) - return; - } - uni.showLoading(); + // 淇濆瓨ip + settingConfirm() { + this.baseUrl = "http://" + this.url.ip + ':' + this.url.port + '/' + this.url.project + uni.setStorageSync('baseUrl', this.baseUrl); + uni.setStorageSync('url', this.url); + uni.setStorageSync('project','tzsk') + this.$refs.inputDialog.close() + }, + onLogin() { + let that = this uni.request({ - url: this.baseUrl + '/login.action', - data: { - mobile:this.userName, - password:md5.hex_md5(this.password) - }, - header: { + url: that.baseUrl + '/login.action', + fail(result) { + uni.showToast({ + icon: 'error', + title: '璇锋眰澶辫触' + }) + }, + data: { + username: that.user.userName, + password: md5.hex_md5(that.user.password) + }, + header: { "content-type": "application/json" - }, - success: (result) => { - let res = result.data; - uni.hideLoading(); - if (res.code == 200) { + }, + success(result) { + uni.reLaunch({ + url: '../home/home' + }); + if (result.statusCode === 404) { uni.showToast({ - title: '鐧诲綍鎴愬姛', - position: 'bottom', - duration: 1000 - }); - if(this.rember){ - uni.setStorageSync('HCuname', this.userName); - uni.setStorageSync('HCpassw', this.password); - }else{ - uni.removeStorageSync('HCuname'); - uni.removeStorageSync('HCpassw'); - } + title: '鐧诲綍澶辫触', + icon: "error" + }) + return + } + let res = result.data + if (res.code === 200) { + that.load.loading = true; + that.load.btnText = '鐧诲綍涓�'; uni.setStorageSync('token', res.data.token); + if(that.remberPassword){ + uni.setStorageSync('user', that.user); + }else{ + uni.removeStorageSync('user'); + } setTimeout(() => { - uni.navigateBack(); // 灏忕▼搴忕敤杩欎釜 鎶婇椤佃矾鐢辨斁绗竴涓� - uni.reLaunch({ - url: '../index/index' - }); - }, 1000); + uni.showToast({ + title: '鐧诲綍鎴愬姛' + }) + setTimeout(() => { + uni.reLaunch({ + url: '../home/home' + }); + }, 300) + }, 700) + } else { + uni.showToast({ + title: res.msg + }) + } + }, + }) + }, + //妫�娴嬪綋鍓嶅钩鍙帮紝濡傛灉鏄畨鍗撳垯鍚姩瀹夊崜鏇存柊 + getVersion() { + let that = this; + uni.getSystemInfo({ + success: (res) => { + if (res.platform == "android") { + that.AndroidCheckUpdate(); + } + } + }) + }, + // 鑾峰彇褰撳墠鐗堟湰鍙� + AndroidCheckUpdate() { + let that = this; + plus.runtime.getProperty(plus.runtime.appid, (wgtinfo) => { + that.version = wgtinfo.version //瀹㈡埛绔増鏈彿 + }) + setTimeout(()=>{ + that.getUpdateVersion() + },100) + }, + // 鏍¢獙鐗堟湰 + getUpdateVersion() { + let that = this + let type = 0 + if (that.baseUrl == 'http://undefined:undefined/undefined') { + return + } + + let url = that.baseUrl + '/appVersion/checkUpdate/' + that.version + '/' + type + uni.request({ + url: url, + method: 'GET', + success(res) { + console.log(res); + var res = res.data + if (res.data) { + that.filename = res.data.path + that.dialogContent = '鍙戠幇鏂扮増鏈�:' + res.data.version + ', 鏄惁绔嬪嵆鏇存柊' + that.$refs.upVersion.open() } else { uni.showToast({ title: res.msg, @@ -216,99 +275,205 @@ }) } - } - }); - }, - saveClientId(){ - var info = plus.push.getClientInfo(); - var cid = info.clientid; - this.$http.get("/sys/user/saveClientId",{params:{clientId:cid}}).then(res=>{ - this.$tip.success('鐧诲綍鎴愬姛!') - this.$Router.replaceAll({name:'index'}) + } }) }, - changePassword() { - this.showPassword = !this.showPassword; + dialogConfirm() { + this.$refs.upVersion.close() + this.downWgt() }, - loginSuccess() { - // 鐧婚檰鎴愬姛锛岄噸瀹氬悜鍒颁富椤� - this.$Router.replace({name:'index'}) + dialogClose() { + this.$refs.upVersion.close() }, - requestFailed(err) { - this.$message.warning("鐧诲綍澶辫触") + downWgt() { + let that = this; + const downloadUrl = that.baseUrl + "/appVersion/downloadApp/" + that.filename + uni.showLoading({ + title: '鏇存柊涓�︹��' + }) + const downloadTask = uni.downloadFile({ //鎵ц涓嬭浇 + url: downloadUrl, //涓嬭浇鍦板潃 + timeout: 1000 * 30, //30绉掕秴鏃舵椂闂� + success: downloadResult => { //涓嬭浇鎴愬姛 + console.log(downloadResult); + that.showdownLine = false + uni.hideLoading(); + if (downloadResult.statusCode == 200) { + uni.showModal({ + title: '', + content: '鏇存柊鎴愬姛锛岀‘瀹氱幇鍦ㄩ噸鍚悧锛�', + confirmText: '閲嶅惎', + confirmColor: '#EE8F57', + success: function(res) { + if (res.confirm == true) { + plus.runtime.install( //瀹夎 + downloadResult.tempFilePath, { + force: true + }, + function(res) { + utils.showToast('鏇存柊鎴愬姛锛岄噸鍚腑'); + plus.runtime.restart(); + } + ); + } + } + }); + } else { + uni.hideLoading(); + that.showdownLine = false + uni.showToast({ + title:'璇峰厛涓婁紶瀹夎鍖�', + icon: 'error' + }) + } + }, + fail: err => { + uni.hideLoading(); + that.showdownLine = false + that.$u.toast(downloadResult.errMsg) + }, + complete: com => { + + console.log(com) + } + }); + + // 涓嬭浇杩涘害 + downloadTask.onProgressUpdate(res => { + that.downloadNum = res.progress + console.log('涓嬭浇杩涘害' + that.downloadNum); + }); }, - }, - beforeDestroy() { - if (this.smsCountInterval) { - clearInterval(this.smsCountInterval); - } - }, - - - } + + } + } </script> - <style> - @import "../../colorui/main.css"; - @import "../../colorui/icon.css"; - @import "../../colorui/animation.css"; - - .login-paddingtop { - padding-top: 50upx; - } - - .zai-box { - padding: 0 20upx; - padding-top: 100upx; - position: relative; - } - - .zai-logo { - width: 200upx; - height: 150px; - } - - .zai-title { - font-size: 58upx; - color: #000000; - text-align: center; - } - - .input-placeholder, .zai-input { - color: #94afce; - } - - .zai-label { - padding: 60upx 0; - text-align: center; - font-size: 30upx; - color: #a7b6d0; - } - - .zai-btn { - background: #ff65a3; - color: #fff; - border: 0; - border-radius: 100upx; - font-size: 36upx; - } - - .zai-btn:after { - border: 0; - } - - /*鎸夐挳鐐瑰嚮鏁堟灉*/ - .zai-btn.button-hover { - transform: translate(1upx, 1upx); - } - .changeBox { - margin-top: 20upx; + @import url('../../static/css/wms.css/wms.css'); + /* 璁剧疆鍖哄煙 */ + .settings { + min-height: 100rpx; } - .rember { - display: inline-block; - } - .changeIP { + .settings-btn { float: right; - margin-right: 15upx; + margin-right: 10rpx; } -</style> + .logo { + height: 25%; + width: 100%; + display: flex; + justify-content: center; + } + .logo-box { + margin: auto 0; + } + image { + height: 300rpx; + } + /* 杈撳叆妗嗗尯鍩� */ + .content { + min-height: 250rpx; + /* background-color: coral; */ + width: 100%; + display: flex; + flex-direction: column; + align-items: center; + color: #606266; + } + .box { + width: 80%; + height: 100rpx; + margin-top: 30rpx; + background-color: white; + display: flex; + font-size: 14px; + align-items: center; + + } + .box-icon { + width: 80rpx; + text-align: center; + } + .box-text { + width: 100rpx; + text-align: center; + } + .box-show { + margin-left: auto; + /* margin-right: 10rpx; */ + width: 60rpx; + text-align: center; + } + input { + padding-left: 10rpx; + font-size: 14px; + color: #303133; + } + + .check { + width: 78%; + display: flex; + font-size: 12px; + color: #606266; + margin-top: 10rpx; + } + .check-right { + margin-left: auto; + } + .submit { + display: flex; + justify-content: center; + position: fixed; + width: 100%; + bottom: 100rpx; + } + .version { + position: fixed; + width: 100%; + bottom: 0; + text-align: center; + font-size: 12px; + color: #909399; + } + + + + + + + + + + + + + + + + + /* ------ */ + + .shadow-warp { + position: relative; + box-shadow: 0 0 10upx rgba(0, 0, 0, 0.1); + } + + .shadow-warp:before, + .shadow-warp:after { + position: absolute; + content: ""; + top: 20upx; + bottom: 30upx; + left: 20upx; + width: 50%; + box-shadow: 0 30upx 20upx rgba(0, 0, 0, 0.2); + transform: rotate(-3deg); + z-index: -1; + } + + .shadow-warp:after { + right: 20upx; + left: auto; + transform: rotate(3deg); + } +</style> \ No newline at end of file -- Gitblit v1.9.1