123 lines
4.2 KiB
HTML
123 lines
4.2 KiB
HTML
|
<html xmlns:th="http://www.thymeleaf.org">
|
||
|
<head>
|
||
|
<meta charset="UTF-8">
|
||
|
<title>序列号</title>
|
||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
|
||
|
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
|
||
|
<link rel="stylesheet" href="src/assets/layui/css/layui.css" />
|
||
|
<link rel="stylesheet" href="src/assets/css/public.css" />
|
||
|
</head>
|
||
|
<body style="min-width: 710px;min-height: 320px;">
|
||
|
<div id="number-box">
|
||
|
<div class="f-left num-logo">
|
||
|
<img src="src/assets/images/301logo-1.png" />
|
||
|
</div>
|
||
|
<div class="f-left num-c">
|
||
|
<p>请输入序列号:</p>
|
||
|
<ul class="num-list" id="num-list">
|
||
|
<li class="f-left">
|
||
|
<input type="text" ref="regCode1" v-model="regCode1" id="regCode1" class="layui-input"/>
|
||
|
</li>
|
||
|
<li class="f-left">
|
||
|
<input type="text" ref="regCode2" v-model="regCode2" id="regCode2" class="layui-input"/>
|
||
|
</li>
|
||
|
<li class="f-left">
|
||
|
<input type="text" ref="regCode3" v-model="regCode3" id="regCode3" class="layui-input"/>
|
||
|
</li>
|
||
|
<li class="f-left">
|
||
|
<input type="text" ref="regCode4" v-model="regCode4" id="regCode4" class="layui-input"/>
|
||
|
</li>
|
||
|
<li class="num-tips-no" v-bind:class="{ numNo: errMsg}">
|
||
|
<p><i class="layui-icon layui-icon-tips"></i>{{errMsg}}</p>
|
||
|
<!--numNo 错误-li-class-->
|
||
|
</li><li class="num-tips-no">
|
||
|
<p><i class="layui-icon layui-icon-auz"></i>请确认</p>
|
||
|
<!--numYes 正确-li-class -->
|
||
|
</li>
|
||
|
</ul>
|
||
|
<div class="num-btn">
|
||
|
<button type="button" id="sub" class="layui-btn layui-btn-normal">确认</button>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
<script src="src/assets/js/jquery-1.8.3.js"></script>
|
||
|
<script type="text/javascript" src="src/assets/layui/layui.js" ></script>
|
||
|
<script src="node_modules/vue/dist/vue.js"></script>
|
||
|
<script>
|
||
|
const {ipcRenderer} = require('electron');
|
||
|
layui.use(['layer'], function(){
|
||
|
var layer = layui.layer;
|
||
|
});
|
||
|
var app = new Vue({
|
||
|
el:'#num-list',
|
||
|
data:{
|
||
|
regCode1:'',
|
||
|
regCode2:'',
|
||
|
regCode3:'',
|
||
|
regCode4:'',
|
||
|
errMsg:''
|
||
|
},
|
||
|
watch:{
|
||
|
regCode1:function(newRegCode1, oldRegCode1){
|
||
|
if(newRegCode1.length>4){
|
||
|
this.regCode1 = newRegCode1.substr(0,4)
|
||
|
this.regCode2 = newRegCode1.substr(4,newRegCode1.length-4)
|
||
|
$(this.$refs.regCode2).focus();
|
||
|
}
|
||
|
},
|
||
|
regCode2:function(newRegCode2, oldRegCode2){
|
||
|
if(newRegCode2.length>4){
|
||
|
this.regCode2 = newRegCode2.substr(0,4)
|
||
|
this.regCode3 = newRegCode2.substr(4,newRegCode2.length)
|
||
|
$(this.$refs.regCode3).focus();
|
||
|
}
|
||
|
if(newRegCode2.length==0){
|
||
|
$(this.$refs.regCode1).focus();
|
||
|
}
|
||
|
},
|
||
|
regCode3:function(newRegCode3, oldRegCode3){
|
||
|
if(newRegCode3.length>4){
|
||
|
this.regCode3 = newRegCode3.substr(0,4)
|
||
|
this.regCode4 = newRegCode3.substr(4,newRegCode3.length)
|
||
|
$(this.$refs.regCode4).focus();
|
||
|
}
|
||
|
if(newRegCode3.length==0){
|
||
|
$(this.$refs.regCode2).focus();
|
||
|
}
|
||
|
},
|
||
|
regCode4:function(newRegCode4, oldRegCode4){
|
||
|
console.info(newRegCode4)
|
||
|
if(newRegCode4.length>=4){
|
||
|
this.regCode4 = newRegCode4.substr(0,4)
|
||
|
}
|
||
|
if(newRegCode4.length==0){
|
||
|
$(this.$refs.regCode3).focus();
|
||
|
}
|
||
|
}
|
||
|
},
|
||
|
computed: {
|
||
|
regCode: {
|
||
|
get:function() {
|
||
|
return this.regCode1 + this.regCode2 + this.regCode3 + this.regCode4
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
})
|
||
|
$("#sub").click(function () {
|
||
|
if(app.regCode.length<16){
|
||
|
app.errMsg = '请先填写注册码!'
|
||
|
}else{
|
||
|
var regCode = app.regCode
|
||
|
var aa = ipcRenderer.sendSync('asynchronous-reg',regCode);
|
||
|
if(aa.status!=1){
|
||
|
app.errMsg= aa.message
|
||
|
}
|
||
|
}
|
||
|
|
||
|
})
|
||
|
|
||
|
|
||
|
</script>
|
||
|
</body>
|
||
|
</html>
|