|
|
@@ -10,7 +10,7 @@ $(document).ready(function () {
|
|
|
}
|
|
|
|
|
|
|
|
|
- 数据提交 = function(name = '地址',json = '数据',result = '回调') {
|
|
|
+ POST = function(name = '地址',json = '数据',result = '回调') {
|
|
|
$.post('http://localhost:13131/'+name,json,function(data){
|
|
|
result(data);
|
|
|
})
|
|
|
@@ -131,221 +131,233 @@ background-color: rgb(53, 185, 149);
|
|
|
`)
|
|
|
|
|
|
//----------------------------------------------------------------------------------------------
|
|
|
- Vue.component('login',{
|
|
|
- template:`
|
|
|
- <div type="login" v-on:click="on.button.exit()" v-bind:style="style.box" align="center">
|
|
|
- <div v-bind:style="style.frame">
|
|
|
- <label v-bind:style="style.label">
|
|
|
- <span v-bind:style="style.head">登录</span>
|
|
|
- </label>
|
|
|
- <label v-bind:style="style.label">
|
|
|
- <span v-bind:style="style.i">*</span>
|
|
|
- <span v-bind:style="style.title">账号</span>
|
|
|
- <input maxlength="9" v-on:focus="on.input.focus()" v-on:blur="on.input.blur()" v-bind:style="style.input"/>
|
|
|
- </label>
|
|
|
- <span v-bind:style="style.info"></span>
|
|
|
- <label v-bind:style="style.label">
|
|
|
- <span v-bind:style="style.i">*</span>
|
|
|
- <span v-bind:style="style.title">密码</span>
|
|
|
- <input maxlength="16" v-on:focus="on.input.focus()" v-on:blur="on.input.blur()" v-bind:style="style.input"/>
|
|
|
- </label>
|
|
|
- <span v-bind:style="style.info"></span>
|
|
|
- <label v-bind:style="style.label">
|
|
|
- <button v-on:click="on.button.QR_code()" v-bind:style="[style.button,style.button[2]]">扫码</button>
|
|
|
- <button v-on:click="on.button.login()" v-bind:style="[style.button,style.button[2]]">登录</button>
|
|
|
- <button v-on:click="on.button.exit()" type="quit" v-bind:style="[style.button,style.button[1]]">关闭</button>
|
|
|
- </label>
|
|
|
- <label v-bind:style="style.qr.box">
|
|
|
- <img v-bind:style="style.qr.img" width="100" height="100" alt=""/>
|
|
|
- <br/>
|
|
|
- <button v-on:click="on.button.account_login()" v-bind:style="style.qr.button" >账号登录</button>
|
|
|
- </label>
|
|
|
- </div>
|
|
|
- </div>`,
|
|
|
- data:function () {
|
|
|
- return {
|
|
|
- style:{
|
|
|
- box:{
|
|
|
- width:'100%',
|
|
|
- height:'100%',
|
|
|
- position:'fixed',
|
|
|
- zIndex:$('*').length * 2,
|
|
|
- background:'rgba(0,0,0,.2)'
|
|
|
- },
|
|
|
- frame:{
|
|
|
- display:'inline-grid',
|
|
|
- position: 'absolute',
|
|
|
- top:0,
|
|
|
- bottom:0,
|
|
|
- left:0,
|
|
|
- right:0,
|
|
|
- margin:'auto',
|
|
|
- width:'300px',
|
|
|
- height:'200px',
|
|
|
- borderRadius:'2.5px',
|
|
|
- padding:'20px 50px',
|
|
|
- background: '#FFF',
|
|
|
- },
|
|
|
- label:{
|
|
|
- height:'30px',
|
|
|
- },
|
|
|
- head:{
|
|
|
- lineHeight: '24px',
|
|
|
- fontSize: '18px',
|
|
|
- color: '#303133',
|
|
|
- },
|
|
|
- i:{
|
|
|
- color:'red',
|
|
|
- },
|
|
|
- title:{
|
|
|
- letterSpacing: '2.5px',
|
|
|
- marginRight:'5px',
|
|
|
- fontSize:'14px',
|
|
|
- color: '#606266',
|
|
|
- height:'30px',
|
|
|
- lineHeight:'30px',
|
|
|
- },
|
|
|
- input:{
|
|
|
- padding: '5px 10px',
|
|
|
- width: '200px',
|
|
|
- height: '20px',
|
|
|
- border:'1px solid #c3c3c3',
|
|
|
- borderRadius: '2.5px',
|
|
|
- outline:'none',
|
|
|
- },
|
|
|
- button:{
|
|
|
- cursor:'pointer',
|
|
|
- marginRight: '15px',
|
|
|
- float:'right',
|
|
|
- height:'30px',
|
|
|
- width:'70px',
|
|
|
- border:'none',
|
|
|
- borderRadius:'2.5px',
|
|
|
- outline: 'none',
|
|
|
- 1:{
|
|
|
- border:'1px solid #c3c3c3',
|
|
|
- background:'#FFF',
|
|
|
- color:'black'
|
|
|
- },
|
|
|
- 2:{
|
|
|
- border:'1px solid #409EFF',
|
|
|
- background:'#409EFF',
|
|
|
- color:'#FFF'
|
|
|
+
|
|
|
+ is_my = function(func){
|
|
|
+ let if_script = setInterval(function () {
|
|
|
+ if($('script[src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"]').is($('script'))){
|
|
|
+ setTimeout(function () {
|
|
|
+ func();
|
|
|
+ },300);
|
|
|
+ clearInterval(if_script);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ Vue.component('login',{
|
|
|
+ template:`
|
|
|
+ <div type="login" v-on:click="on.button.exit()" v-bind:style="style.box" align="center">
|
|
|
+ <div v-bind:style="style.frame">
|
|
|
+ <label v-bind:style="style.label">
|
|
|
+ <span v-bind:style="style.head">登录</span>
|
|
|
+ </label>
|
|
|
+ <label v-bind:style="style.label">
|
|
|
+ <span v-bind:style="style.i">*</span>
|
|
|
+ <span v-bind:style="style.title">账号</span>
|
|
|
+ <input maxlength="9" v-on:focus="on.input.focus()" v-on:blur="on.input.blur()" v-bind:style="style.input"/>
|
|
|
+ </label>
|
|
|
+ <span v-bind:style="style.info"></span>
|
|
|
+ <label v-bind:style="style.label">
|
|
|
+ <span v-bind:style="style.i">*</span>
|
|
|
+ <span v-bind:style="style.title">密码</span>
|
|
|
+ <input maxlength="16" v-on:focus="on.input.focus()" v-on:blur="on.input.blur()" v-bind:style="style.input"/>
|
|
|
+ </label>
|
|
|
+ <span v-bind:style="style.info"></span>
|
|
|
+ <label v-bind:style="style.label">
|
|
|
+ <button v-on:click="on.button.QR_code()" v-bind:style="[style.button,style.button[2]]">扫码</button>
|
|
|
+ <button v-on:click="on.button.login()" v-bind:style="[style.button,style.button[2]]">登录</button>
|
|
|
+ <button v-on:click="on.button.exit()" type="quit" v-bind:style="[style.button,style.button[1]]">关闭</button>
|
|
|
+ </label>
|
|
|
+ <label v-bind:style="style.qr.box">
|
|
|
+ <img v-bind:style="style.qr.img" width="100" height="100" alt=""/>
|
|
|
+ <br/>
|
|
|
+ <button v-on:click="on.button.account_login()" v-bind:style="style.qr.button" >账号登录</button>
|
|
|
+ </label>
|
|
|
+ </div>
|
|
|
+ </div>`,
|
|
|
+ data:function () {
|
|
|
+ return {
|
|
|
+ style:{
|
|
|
+ box:{
|
|
|
+ width:'100%',
|
|
|
+ height:'100%',
|
|
|
+ position:'fixed',
|
|
|
+ zIndex:$('*').length * 2,
|
|
|
+ background:'rgba(0,0,0,.2)'
|
|
|
+ },
|
|
|
+ frame:{
|
|
|
+ display:'inline-grid',
|
|
|
+ position: 'absolute',
|
|
|
+ top:0,
|
|
|
+ bottom:0,
|
|
|
+ left:0,
|
|
|
+ right:0,
|
|
|
+ margin:'auto',
|
|
|
+ width:'300px',
|
|
|
+ height:'200px',
|
|
|
+ borderRadius:'2.5px',
|
|
|
+ padding:'20px 50px',
|
|
|
+ background: '#FFF',
|
|
|
+ },
|
|
|
+ label:{
|
|
|
+ height:'30px',
|
|
|
+ },
|
|
|
+ head:{
|
|
|
+ lineHeight: '24px',
|
|
|
+ fontSize: '18px',
|
|
|
+ color: '#303133',
|
|
|
+ },
|
|
|
+ i:{
|
|
|
+ color:'red',
|
|
|
+ },
|
|
|
+ title:{
|
|
|
+ letterSpacing: '2.5px',
|
|
|
+ marginRight:'5px',
|
|
|
+ fontSize:'14px',
|
|
|
+ color: '#606266',
|
|
|
+ height:'30px',
|
|
|
+ lineHeight:'30px',
|
|
|
+ },
|
|
|
+ input:{
|
|
|
+ padding: '5px 10px',
|
|
|
+ width: '200px',
|
|
|
+ height: '20px',
|
|
|
+ border:'1px solid #c3c3c3',
|
|
|
+ borderRadius: '2.5px',
|
|
|
+ outline:'none',
|
|
|
+ },
|
|
|
+ button:{
|
|
|
+ cursor:'pointer',
|
|
|
+ marginRight: '15px',
|
|
|
+ float:'right',
|
|
|
+ height:'30px',
|
|
|
+ width:'70px',
|
|
|
+ border:'none',
|
|
|
+ borderRadius:'2.5px',
|
|
|
+ outline: 'none',
|
|
|
+ 1:{
|
|
|
+ border:'1px solid #c3c3c3',
|
|
|
+ background:'#FFF',
|
|
|
+ color:'black'
|
|
|
+ },
|
|
|
+ 2:{
|
|
|
+ border:'1px solid #409EFF',
|
|
|
+ background:'#409EFF',
|
|
|
+ color:'#FFF'
|
|
|
|
|
|
- }
|
|
|
- },
|
|
|
- info:{
|
|
|
- textAlign:'left',
|
|
|
- margin:'0 70px',
|
|
|
- height:'15px',
|
|
|
- letterSpacing:'2px',
|
|
|
- lineHeight: '15px',
|
|
|
- color:'red',
|
|
|
- fontSize: '10px',
|
|
|
- },
|
|
|
- qr:{
|
|
|
- box:{
|
|
|
- display:'none',
|
|
|
- height:'150px',
|
|
|
- },
|
|
|
- img:{
|
|
|
- borderRadius:'2.5px',
|
|
|
- },
|
|
|
- button:{
|
|
|
- cursor: 'pointer',
|
|
|
- marginTop:'15px',
|
|
|
- height:'30px',
|
|
|
- background:'#FFF',
|
|
|
- border:'1px solid #c3c3c3',
|
|
|
- outline:'none',
|
|
|
- width:'150px',
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- on:{
|
|
|
- input:{
|
|
|
- focus:function () {
|
|
|
- event.target.style.borderColor = '#409EFF';
|
|
|
- },
|
|
|
- blur:function () {
|
|
|
- var input = event.target;
|
|
|
- var info = $(input).parent('label').next('span')[0];
|
|
|
- var title = $(input).prev('span')[0].innerText;
|
|
|
- if ($(input).val() === defaultStatus||$(input).val()===null){
|
|
|
- info.innerText = title+'不能为空';
|
|
|
- } else if ($(input).val().indexOf(' ') !== -1){
|
|
|
- info.innerText = title+'不能包含空格';
|
|
|
- } else {
|
|
|
- info.innerText = '';
|
|
|
- }
|
|
|
- input.style.borderColor = '#c3c3c3';
|
|
|
- }
|
|
|
- },
|
|
|
- button:{
|
|
|
- exit:function () {
|
|
|
- if ($("div[type='login']").is(event.target) || $("button[type='quit']").is(event.target)){
|
|
|
- $("div[type='login']").css('display','none');
|
|
|
- }
|
|
|
- },
|
|
|
- login:function () {
|
|
|
- var message = $(event.target).parent('label').prevAll('label');
|
|
|
- var account = $(message[1]).find('input').val();
|
|
|
- var password = $(message[0]).find('input').val();
|
|
|
- var account_info = $(message[1]).next('span')[0];
|
|
|
- var password_info = $(message[0]).next('span')[0];
|
|
|
- var account_title = $(message[1]).find('span').eq(1).text();
|
|
|
- var password_title = $(message[0]).find('span').eq(1).text();
|
|
|
- if (account === defaultStatus||account===null){
|
|
|
- account_info.innerText = account_title+'不能为空';
|
|
|
- } else if (account.indexOf(' ') !== -1){
|
|
|
- account_info.innerText = password_title+'不能包含空格';
|
|
|
- }
|
|
|
- if (password === defaultStatus||password ===null){
|
|
|
- password_info.innerText = password_title+'不能为空';
|
|
|
- } else if (password.indexOf(' ') !== -1){
|
|
|
- password_info.innerText = password_title+'不能包含空格';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ info:{
|
|
|
+ textAlign:'left',
|
|
|
+ margin:'0 70px',
|
|
|
+ height:'15px',
|
|
|
+ letterSpacing:'2px',
|
|
|
+ lineHeight: '15px',
|
|
|
+ color:'red',
|
|
|
+ fontSize: '10px',
|
|
|
+ },
|
|
|
+ qr:{
|
|
|
+ box:{
|
|
|
+ display:'none',
|
|
|
+ height:'150px',
|
|
|
+ },
|
|
|
+ img:{
|
|
|
+ borderRadius:'2.5px',
|
|
|
+ },
|
|
|
+ button:{
|
|
|
+ cursor: 'pointer',
|
|
|
+ marginTop:'15px',
|
|
|
+ height:'30px',
|
|
|
+ background:'#FFF',
|
|
|
+ border:'1px solid #c3c3c3',
|
|
|
+ outline:'none',
|
|
|
+ width:'150px',
|
|
|
+ }
|
|
|
}
|
|
|
- if (account !== defaultStatus
|
|
|
- &&account!==null
|
|
|
- &&account.indexOf(' ') === -1
|
|
|
- &&password !== defaultStatus
|
|
|
- &&password !==null
|
|
|
- &&password.indexOf(' ') === -1){
|
|
|
-
|
|
|
- $.post('http://127.0.0.1:13141/login',{
|
|
|
- account:account,
|
|
|
- password:password,
|
|
|
- },function (data) {
|
|
|
- alert_s(data.msg);
|
|
|
- if (data.error === 1){
|
|
|
- $.cookie('uuid',data.uuid,{exports:15});
|
|
|
- document.location.href = document.location.href;
|
|
|
+ },
|
|
|
+ on:{
|
|
|
+ input:{
|
|
|
+ focus:function () {
|
|
|
+ event.target.style.borderColor = '#409EFF';
|
|
|
+ },
|
|
|
+ blur:function () {
|
|
|
+ var input = event.target;
|
|
|
+ var info = $(input).parent('label').next('span')[0];
|
|
|
+ var title = $(input).prev('span')[0].innerText;
|
|
|
+ if ($(input).val() === defaultStatus||$(input).val()===null){
|
|
|
+ info.innerText = title+'不能为空';
|
|
|
+ } else if ($(input).val().indexOf(' ') !== -1){
|
|
|
+ info.innerText = title+'不能包含空格';
|
|
|
+ } else {
|
|
|
+ info.innerText = '';
|
|
|
+ }
|
|
|
+ input.style.borderColor = '#c3c3c3';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ button:{
|
|
|
+ exit:function () {
|
|
|
+ if ($("div[type='login']").is(event.target) || $("button[type='quit']").is(event.target)){
|
|
|
+ $("div[type='login']").css('display','none');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ login:function () {
|
|
|
+ var message = $(event.target).parent('label').prevAll('label');
|
|
|
+ var account = $(message[1]).find('input').val();
|
|
|
+ var password = $(message[0]).find('input').val();
|
|
|
+ var account_info = $(message[1]).next('span')[0];
|
|
|
+ var password_info = $(message[0]).next('span')[0];
|
|
|
+ var account_title = $(message[1]).find('span').eq(1).text();
|
|
|
+ var password_title = $(message[0]).find('span').eq(1).text();
|
|
|
+ if (account === defaultStatus||account===null){
|
|
|
+ account_info.innerText = account_title+'不能为空';
|
|
|
+ } else if (account.indexOf(' ') !== -1){
|
|
|
+ account_info.innerText = password_title+'不能包含空格';
|
|
|
}
|
|
|
- })
|
|
|
+ if (password === defaultStatus||password ===null){
|
|
|
+ password_info.innerText = password_title+'不能为空';
|
|
|
+ } else if (password.indexOf(' ') !== -1){
|
|
|
+ password_info.innerText = password_title+'不能包含空格';
|
|
|
+ }
|
|
|
+ if (account !== defaultStatus
|
|
|
+ &&account!==null
|
|
|
+ &&account.indexOf(' ') === -1
|
|
|
+ &&password !== defaultStatus
|
|
|
+ &&password !==null
|
|
|
+ &&password.indexOf(' ') === -1){
|
|
|
|
|
|
- }
|
|
|
- },
|
|
|
- QR_code:function(){
|
|
|
- let qr_info = {
|
|
|
- time:new Date(),
|
|
|
+ POST('login',{
|
|
|
+ account:account,
|
|
|
+ password:password,
|
|
|
+ },function (data) {
|
|
|
+ alert_s(data.msg);
|
|
|
+ if (data.error === 1){
|
|
|
+ $.cookie('uuid',data.uuid,{exports:15});
|
|
|
+ document.location.href = document.location.href;
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ QR_code:function(){
|
|
|
+ let qr_info = {
|
|
|
+ time:new Date(),
|
|
|
|
|
|
+ }
|
|
|
+ $(event.target).parent('label').next('label').find('img').attr('src','http://qrs.kegood.com/?url='+JSON.stringify(qr_info))
|
|
|
+ $(event.target).parent('label').parent('div').find('label').css('display','none')
|
|
|
+ $(event.target).parent('label').prevAll('span').css('display','none')
|
|
|
+ $(event.target).parent('label').parent('div').find('label')[0].style.display = 'block';
|
|
|
+ $(event.target).parent('label').parent('div').find('label')[4].style.display = 'block';
|
|
|
+ },
|
|
|
+ account_login:function () {
|
|
|
+ $(event.target).parent('label').parent('div').find('label').css('display','block')
|
|
|
+ $(event.target).parent('label').parent('div').find('label')[4].style.display = 'none';
|
|
|
+ }
|
|
|
}
|
|
|
- $(event.target).parent('label').next('label').find('img').attr('src','http://qrs.kegood.com/?url='+JSON.stringify(qr_info))
|
|
|
- $(event.target).parent('label').parent('div').find('label').css('display','none')
|
|
|
- $(event.target).parent('label').parent('div').find('label')[0].style.display = 'block';
|
|
|
- $(event.target).parent('label').parent('div').find('label')[4].style.display = 'block';
|
|
|
- },
|
|
|
- account_login:function () {
|
|
|
- $(event.target).parent('label').parent('div').find('label').css('display','block')
|
|
|
- $(event.target).parent('label').parent('div').find('label')[4].style.display = 'none';
|
|
|
}
|
|
|
- }
|
|
|
+ };
|
|
|
}
|
|
|
- };
|
|
|
- }
|
|
|
- });
|
|
|
- new Vue({
|
|
|
- el:'#ifame'
|
|
|
- })
|
|
|
-
|
|
|
+ });
|
|
|
+ new Vue({
|
|
|
+ el:'#ifame'
|
|
|
+ })
|
|
|
})
|
