2022-01-12 界面异常处理

This commit is contained in:
Jackie
2022-01-12 17:03:44 +08:00
parent 589b9c1f30
commit 2fb79c9d87
4 changed files with 139 additions and 61 deletions

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
/.idea/

Binary file not shown.

View File

@ -1,6 +1,6 @@
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>授权中心</title> <title>授权中心</title>
@ -19,36 +19,45 @@
<div class="logo-image"></div> <div class="logo-image"></div>
</div> </div>
</div> </div>
<div class="card-main"> <div class="card-main">
<div class="main"> <div class="main">
<div class="top"> <div class="top">
<div class="labe">授权企业详情</div> <div class="labe">授权企业详情</div>
</div> </div>
<div class="company"> <div class="company">
<div class="company-det"> <div class="company-det">
<div class="company-lint"> <div class="company-lint">
<div class="company-name"> <div class="company-name">
<div class="company-logo"> <div class="company-logo">
<img src="http://www.crtech.cn/images/logo.png"> <img src="themes/img/logo.png">
</div> </div>
<div style="margin-left: 20px;">{{single.company.name}}</div> <div style="margin-left: 20px;">{{companyName}}</div>
</div> </div>
<div style="margin: 10px;"> <div style="margin: 10px;">
<div class="address">地址:{{single.company.address}}</div> <div class="address">地址:{{companyAddress}}</div>
<div class="des">简介:{{single.company.introduce}}</div> <div class="des">简介:{{companyIntroduce}}</div>
<div class="des">授权码:<span style="color: green">已生成</span> <span><el-link <div class="des">授权码:<span style="color: green">已生成</span> <span><el-link
type="primary" :underline="false" type="primary" :underline="false"
style=" font-size: 12px;margin-left: 8px;" @click="dialogCodeVisible = true">查看</el-link></span></div> style=" font-size: 12px;margin-left: 8px;"
@click="dialogCodeVisible = true">查看</el-link></span></div>
<div class="des">授权文件:<span style="color: green">正常</span> <div class="des">授权文件:<span style="color: green">正常</span>
<span> <span>
<el-link type="primary" :underline="false" style=" font-size: 12px;margin-left: 8px;" @click="dialogTableVisible = true">更换授权文件</el-link></span></div> <el-link type="primary" :underline="false"
style=" font-size: 12px;margin-left: 8px;"
@click="dialogTableVisible = true">更换授权文件</el-link>
</span>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="card-main"> <div class="card-main">
<div class="main"> <div class="main">
<div class="top"> <div class="top">
@ -56,36 +65,43 @@
</div> </div>
<div class="pubg"> <div class="pubg">
<div class="applist"> <div class="applist">
<div class="app" v-for="(item,i) in single.applist"> <div class="app" v-for="(item,i) in single.applist" @click="showDetail(item)">
<div class="app-det"> <div class="app-det">
<img :src="item.logo ? item.logo : 'themes/img/mk.png'"> <img :src="item.logo ? item.logo : 'themes/img/mk.png'">
</div> </div>
<div class="app-name">{{item.name}}</div> <div class="app-name">{{item.name}}</div>
<div class="app-des">版本:{{item.version}}</div> <div class="app-des">版本:{{item.version}}</div>
<div class="app-license">{{item.grade == 'custom' ? '定制授权' : item.gradeName}}</div> <div class="app-license">{{item.grade == 'custom' ? '定制授权' : item.gradeName}}</div>
<div class="app-time" style="color: green" v-if="new Date().getTime() < new Date(item.expiryTime).getTime()"> {{item.expiryTime | dateFilter('YYYY-MM-DD')}}到期</div> <div class="app-time" style="color: green"
v-if="new Date().getTime() < new Date(item.expiryTime).getTime()"> {{item.expiryTime |
dateFilter('YYYY-MM-DD')}}到期
</div>
<div v-else style="color: red">已过期</div> <div v-else style="color: red">已过期</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<el-dialog title="授权码" :visible.sync="dialogCodeVisible"> <el-dialog title="授权码" :visible.sync="dialogCodeVisible">
<div slot="header" class="clearfix">
<span>本机授权码</span>
<el-button style="float: right; padding: 3px 0;" icon="el-icon-document-copy" @click="copy()" type="text">复制授权码</el-button>
</div>
<div class="demo-input-suffix"> <div class="demo-input-suffix">
<el-input type="textarea" ref="copy" autosize="true" v-model="single.code" resize="none" readonly="true"></el-input> <el-button style="float: right; margin-top: -25px" icon="el-icon-document-copy" @click="copy()" type="text">
复制授权码
</el-button>
<el-input type="textarea" ref="copy" autosize="true" v-model="single.code" resize="none"
readonly="true">
</el-input>
</div> </div>
</el-dialog> </el-dialog>
<el-dialog title="授权文件修改" :visible.sync="dialogTableVisible"> <el-dialog title="授权文件修改" :visible.sync="dialogTableVisible">
<div slot="header"> <div slot="header">
<span>上传授权文件</span> <span>上传授权文件</span>
</div> </div>
<span class="tip"></span> <span class="tip"></span>
<div align="center"> <div align="center">
<el-upload class="upload-demo" accept enctype="multipart/form-data" drag action="/xinadmin/upload" multiple="false" show-file-list="false" <el-upload class="upload-demo" accept enctype="multipart/form-data" drag action="/xinadmin/upload"
multiple="false" show-file-list="false"
drag="true" auto-upload="true" limit="1" :on-success="Success"> drag="true" auto-upload="true" limit="1" :on-success="Success">
<i class="el-icon-upload" style="height: 10px;"></i> <i class="el-icon-upload" style="height: 10px;"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div> <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
@ -93,18 +109,35 @@
</el-upload> </el-upload>
</div> </div>
</el-dialog> </el-dialog>
<el-dialog :title="rightDialogTitle" :modal-append-to-body="true" :visible.sync="rightDialogVisible"
:close-on-click-modal="false" :close-on-press-escape="false" @close="closeDetail">
<div style="max-height: 500px;overflow-y: auto">
<el-table :data="tableData" size="mini" row-key="code" ref="tableData" border>
<el-table-column prop="description" label="权限"></el-table-column>
<el-table-column prop="value" label="参数"></el-table-column>
</el-table>
</div>
</el-dialog>
</div> </div>
<script> <script>
Vue.filter("dateFilter", function (date, formatPattern) { Vue.filter("dateFilter", function (date, formatPattern) {
return moment(date).format(formatPattern || "YYYY-MM-DD HH:mm:ss"); return moment(date).format(formatPattern || "YYYY-MM-DD HH:mm:ss");
}); });
new Vue({ const home = new Vue({
el: '#app', el: '#app',
data() { data() {
return { return {
single: {}, single: [],
dialogCodeVisible: false, dialogCodeVisible: false,
dialogTableVisible: false dialogTableVisible: false,
rightDialogVisible: false,
rightDialogTitle: '',
tableData: [],
companyName: '',
companyAddress: '',
companyIntroduce: ''
} }
}, },
created: function () { created: function () {
@ -113,18 +146,16 @@
}, },
//绑定方法 //绑定方法
methods: { methods: {
copy() {
this.$refs.copy.select()
document.execCommand('Copy')
this.$message.success('已复制到剪贴板')
},
singlecode() { singlecode() {
const that = this; const that = this;
axios.get('/xinadmin/single', {}).then(function (res) { axios.get('/xinadmin/single', {}).then(function (res) {
if (res.data) { if (res.data) {
if(res.data.license){ if (res.data.license) {
that.single = res.data; that.single = res.data;
}else{ that.companyName = res.data.company.name;
that.companyAddress = res.data.company.address;
that.companyIntroduce = res.data.company.introduce;
} else {
location.href = "index.jsp" location.href = "index.jsp"
} }
} }
@ -132,26 +163,31 @@
console.log(error) console.log(error)
}) })
}, },
uploadfile() { checkLogin() {
this.$refs.upload.submit()
},
checkLogin(){
const token = sessionStorage.getItem("token"); const token = sessionStorage.getItem("token");
if(token == null){ if (token == null) {
location.href = "login.jsp" location.href = "login.jsp"
}else{ } else {
const str = new Date().getTime() const str = new Date().getTime()
if((+token + (2*60*60*1000) < str)){ if ((+token + (2 * 60 * 60 * 1000) < str)) {
location.href = "login.jsp" location.href = "login.jsp"
} }
} }
}, },
copy() {
this.$refs.copy.select()
document.execCommand('Copy')
this.$message.success('已复制到剪贴板')
},
uploadfile() {
this.$refs.upload.submit()
},
Success(response, file, fileList) { Success(response, file, fileList) {
if(response.state == "success"){ if (response.state == "success") {
this.dialogTableVisible = false; this.dialogTableVisible = false;
this.$notify({ this.$notify({
title: '成功', title: '成功',
duration:2000, duration: 2000,
message: '校验通过', message: '校验通过',
type: 'success' type: 'success'
}); });
@ -164,7 +200,7 @@
axios.get('/xinadmin/adminstarter', {}).then(function (res) { axios.get('/xinadmin/adminstarter', {}).then(function (res) {
that.$notify({ that.$notify({
title: '重启中', title: '重启中',
duration:2000, duration: 2000,
message: '正在重启相关应用,请稍侯....', message: '正在重启相关应用,请稍侯....',
type: 'info' type: 'info'
}); });
@ -177,17 +213,55 @@
}).catch(() => { }).catch(() => {
that.$notify({ that.$notify({
title: '警告', title: '警告',
duration:2000, duration: 2000,
message: '应用尚未重启,授权尚未生效,请稍后手动重启', message: '应用尚未重启,授权尚未生效,请稍后手动重启',
type: 'warning' type: 'warning'
}); });
}); });
}else{ } else {
this.$notify.error({ this.$notify.error({
title: '上传失败', title: '上传失败',
message: response.error message: response.error
}); });
} }
},
showDetail(item) {
this.rightDialogVisible = true;
this.rightDialogTitle = item.name + "授权参数详情";
let ary = new Array();
let data = item.params;
if (data != null) {
for (let i in data) {
let desc = data[i].name;
let value = data[i].value;
let valueType = data[i].valueType;
if (valueType == "number") {
if (value == -1)
value = "未限制数量";
else
value = "当前允许最大数量为: " + value + " , 请勿超出限制";
} else if (valueType == "boolean") {
if (value == data[i].falseDefault)
value = "未拥有此功能(或权限)";
else if (value == data[i].trueDefault)
value = "已拥有此功能(或权限)";
}
let param = {
code: i,
description: desc,
value: value,
};
ary.push(param);
}
}
this.tableData = ary;
},
closeDetail() {
this.rightDialogVisible = false;
this.rightDialogTitle = '';
this.tableData = [];
} }
} }
}) })

View File

@ -9,17 +9,17 @@
<link rel="stylesheet" href="themes/css/index.css" type="text/css"> <link rel="stylesheet" href="themes/css/index.css" type="text/css">
</head> </head>
<style> <style>
.header{ .header {
height: 60px; height: 60px;
width: 100%; width: 100%;
} }
.header .logo{ .header .logo {
height: 60px; height: 60px;
width: 260px; width: 260px;
} }
.header .logo-image{ .header .logo-image {
height: 100%; height: 100%;
width: 100%; width: 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
@ -27,15 +27,18 @@
background-size: 90%; background-size: 90%;
background-image: url('themes/img/xin.png'); background-image: url('themes/img/xin.png');
} }
.el-form{
.el-form {
width: 480px; width: 480px;
margin: auto; margin: auto;
margin-top: 40px; margin-top: 40px;
} }
.el-input__inner { .el-input__inner {
border: 0 !important; border: 0 !important;
padding: 0; padding: 0;
} }
.admin { .admin {
display: flex; display: flex;
align-items: center; align-items: center;
@ -76,7 +79,8 @@
width: 80%; width: 80%;
margin: 40px auto; margin: 40px auto;
} }
.title{
.title {
height: 60px; height: 60px;
width: 100%; width: 100%;
text-align: center; text-align: center;
@ -85,6 +89,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.system { .system {
font-size: 20px; font-size: 20px;
font-weight: 600; font-weight: 600;
@ -111,15 +116,13 @@
<i class="el-icon-key iconinfo"></i> <i class="el-icon-key iconinfo"></i>
<el-input placeholder="请输入密码" ref="pass" v-model="user.pass" type="password" show-password></el-input> <el-input placeholder="请输入密码" ref="pass" v-model="user.pass" type="password" show-password></el-input>
</div> </div>
<div class="remenber"> <div>
<el-checkbox-group> <el-checkbox label="记住密码" name="type" style="float: left" ></el-checkbox>
<el-checkbox label="记住密码" name="type"></el-checkbox> <div style="float: left;margin-left: 400px;margin-top: -30px;">
</el-checkbox-group>
<div>
<el-button type="text">忘记密码?</el-button> <el-button type="text">忘记密码?</el-button>
</div> </div>
</div> </div>
<div style="text-align: center;"> <div style="margin-top: 10px">
<el-button type="primary" style="width: 100%;" @click="login">登陆</el-button> <el-button type="primary" style="width: 100%;" @click="login">登陆</el-button>
</div> </div>
</el-form> </el-form>
@ -133,48 +136,48 @@
return { return {
user: { user: {
name: '', name: '',
pass:'' pass: ''
}, },
} }
}, },
created: function () { created: function () {
this.checkLogin(); // this.checkLogin();
}, },
methods: { methods: {
login() { login() {
if(!this.user.name){ if (!this.user.name) {
this.$message.error("用户名不能为空"); this.$message.error("用户名不能为空");
this.$refs.name.select() this.$refs.name.select()
return false; return false;
}else if(this.user.pass == ""){ } else if (this.user.pass == "") {
this.$refs.pass.select() this.$refs.pass.select()
this.$message.error("密码不能为空"); this.$message.error("密码不能为空");
return false; return false;
} }
const that = this; const that = this;
const data = { const data = {
name:this.user.name, name: this.user.name,
pass:this.user.pass pass: this.user.pass
} }
axios.post('/xinadmin/login', data).then(function (res) { axios.post('/xinadmin/login', data).then(function (res) {
console.log(res.data) console.log(res.data)
if (res.data.state == "success") { if (res.data.state == "success") {
sessionStorage.setItem("token",res.data.token); sessionStorage.setItem("token", res.data.token);
if(res.data.edit == 0){ if (res.data.edit == 0) {
location.href = "editpass.jsp"; location.href = "editpass.jsp";
}else{ } else {
location.href = "home.jsp"; location.href = "home.jsp";
} }
}else{ } else {
that.$message.error(res.data.mes); that.$message.error(res.data.mes);
} }
}) })
}, },
checkLogin(){ checkLogin() {
const token = sessionStorage.getItem("token"); const token = sessionStorage.getItem("token");
const str = new Date().getTime() const str = new Date().getTime()
if(token){ if (token) {
if((+token + (2*60*60*1000) > str)){ if ((+token + (2 * 60 * 60 * 1000) > str)) {
location.href = "home.jsp" location.href = "home.jsp"
} }
} }