ma-web/login.html

237 lines
7.2 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="./scripts/vue.min.js"></script>
<link rel="stylesheet" href="./scripts/elementindex.css">
<script src="./scripts/elementindex.js"></script>
<!--//vue element-ui-css element-ui-js
<script src="https://unpkg.com/vue@2.6.14/dist/vue.js"></script>
<link rel="stylesheet" href="https://unpkg.com/element-ui@2.15.5/lib/theme-chalk/index.css">
<script src="https://unpkg.com/element-ui@2.15.5/lib/index.js"></script>
-->
<script src="scripts/axiosmin.js"></script>
<!--
<script>
localStorage.setItem("online_user","");
localStorage.setItem("uuid","");
</script>
-->
<style>
/*.svg-background {
background: url(scripts/png/bg.jpg);
background-size: 100% 100%;
background-repeat: no-repeat;
background-attachment: fixed;
margin: 0;
padding: 0;
}*/
.svg-background {
background: url(scripts/png/3-1.jpg);
background-size: 100% 100%;
background-repeat: no-repeat;
background-attachment: fixed;
margin: 0;
padding: 0;
}
</style>
</head>
<body class="svg-background">
<div id="app" >
<template>
<div>
<el-form ref="loginForm" :model="form" :rules="rules" label-width="138px" class="login-box">
<h3 class="login-title" style="font-size: 50px;color: #f8f8f8;">六合维保计划管理软件</h3>
<el-form-item label="账号" prop="username">
<el-input type="text" placeholder="请输入账号" v-model="form.username" style="width: 262px;" />
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input type="password" placeholder="请输入密码" v-model="form.password" style="width: 262px;"/>
</el-form-item>
<el-form-item>
<el-button style="width: 262px;" round type="primary" v-on:click="onSubmit('loginForm')">登录</el-button>
<!--<el-button style="width: 124px;" round type="primary" v-on:click="register('loginForm')">注册</el-button>-->
</el-form-item>
</el-form>
<el-dialog title="温馨提示"
:visible.sync="dialogVisible"
width="30%"
:before-close="handleClose"
:lock-scroll ="false">
<span>请输入账号和密码</span>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
</div>
<script>
new Vue(
{
el: "#app",
data() {
return {
form: {
username: '',
password: ''
},
rules: {
username: [
{ required: true, message: '账号不可为空', trigger: 'blur' }
],
password: [
{ required: true, message: '密码不可为空', trigger: 'blur' }
]
},
dialogVisible: false
}
},
methods: {
onSubmit(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
//window.open("main.html","_self","baidu.com");
var _this = this;
axios.post('/u_ma/login', {
username: _this.$data.form.username,
password: _this.$data.form.password
})
.then(function (response) {
if (response.status != 200 || response.data.r !=0) {
if (response.data.r ==1) {
_this.$message({
message: "用户已登录!",
type: "error",
duration: 1500
});
}else{
_this.$message({
message: "登录失败,请检查用户名和密码是否正确!",
type: "error",
duration: 1500
});
}
}else{
localStorage.setItem("online_user",_this.$data.form.username);
localStorage.setItem("uuid",response.data.uuid);
localStorage.setItem("level",response.data.roleid);
localStorage.setItem("did",response.data.did);
localStorage.setItem("loc",response.data.loc);
location.href=response.data.url;
}
})
.catch(function (error) {
console.log(error);
});
}
/*else {
this.dialogVisible = true;
return false;
}*/
});
},
register(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
//window.open("main.html","_self","baidu.com");
var _this = this;
axios.post('/deescloud/registerUser', {
username: _this.$data.form.username,
password: _this.$data.form.password
})
.then(function (response) {
if (response.status != 200 || response.data.r !=0) {
if (response.data.r ==1) {
_this.$message({
message: "用户已注册!",
type: "error",
duration: 1500
});
}else{
_this.$message({
message: "注册失败!",
type: "error",
duration: 1500
});
}
}else{
_this.$message({
message: "注册成功!",
type: "success",
duration: 1500
});
}
})
.catch(function (error) {
console.log(error);
});
}
/*else {
this.dialogVisible = true;
return false;
}*/
});
},
handleClose(done) {
this.$confirm("确认关闭?")
.then(_ => {
done();
})
.catch(_ => { });
}
}
})
</script>
<style lang="scss" scoped>
.el-form-item__label {
color: #f8f8f8;
}
.login-box {
/*border: 1px solid #DCDFE6;*/
width: 500px;
margin: 180px auto;
padding: 35px 35px 15px 35px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
/*box-shadow: 0 0 25px #909399;*/
}
.login-title {
text-align: center;
margin: 0 auto 40px auto;
color: #303133;
}
</style>
</body>
</html>