243 lines
6.4 KiB
Vue
243 lines
6.4 KiB
Vue
<template>
|
||
<el-form
|
||
ref="loginForm"
|
||
:model="form"
|
||
:rules="rules"
|
||
label-width="0"
|
||
size="large"
|
||
>
|
||
<el-form-item prop="user">
|
||
<el-input
|
||
v-model="form.user"
|
||
prefix-icon="el-icon-user"
|
||
clearable
|
||
:placeholder="$t('login.userPlaceholder')"
|
||
>
|
||
<template #append>
|
||
<el-select v-model="userType" style="width: 130px">
|
||
<el-option :label="$t('login.admin')" value="admin"></el-option>
|
||
<el-option :label="$t('login.user')" value="user"></el-option>
|
||
</el-select>
|
||
</template>
|
||
</el-input>
|
||
</el-form-item>
|
||
<el-form-item prop="password">
|
||
<el-input
|
||
v-model="form.password"
|
||
prefix-icon="el-icon-lock"
|
||
clearable
|
||
show-password
|
||
:placeholder="$t('login.PWPlaceholder')"
|
||
></el-input>
|
||
</el-form-item>
|
||
<el-form-item style="margin-bottom: 10px">
|
||
<el-col :span="12" class="login-reg">
|
||
<el-link @click="visitors">{{$t('login.fangke')}}</el-link>
|
||
</el-col>
|
||
<el-col :span="12" class="login-forgot">
|
||
<router-link to="/reset_password"
|
||
>{{ $t("login.forgetPassword") }}？</router-link
|
||
>
|
||
</el-col>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button
|
||
type="primary"
|
||
style="width: 100%"
|
||
:loading="islogin"
|
||
round
|
||
@click="login"
|
||
>{{ $t("login.signIn") }}</el-button
|
||
>
|
||
</el-form-item>
|
||
|
||
<!-- <div class="login-reg">
|
||
{{ $t("login.noAccount") }}
|
||
<router-link to="/user_register">{{
|
||
$t("login.createAccount")
|
||
}}</router-link>
|
||
</div>-->
|
||
</el-form>
|
||
<sc-dialog v-model="visitorsdialog" draggable title="创建访客账号">
|
||
<el-form
|
||
ref="dialogForms"
|
||
:model="visitorform"
|
||
label-width="120px"
|
||
>
|
||
<el-row>
|
||
<el-col :md="24" :sm="24">
|
||
<el-form-item label="姓名" prop="name">
|
||
<el-input
|
||
v-model="visitorform.name"
|
||
placeholder="请输入姓名"
|
||
clearable
|
||
></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row>
|
||
<el-col :md="24" :sm="24">
|
||
<el-form-item label="用户名" prop="username">
|
||
<el-input
|
||
v-model="visitorform.username"
|
||
placeholder="请输入用户名"
|
||
clearable
|
||
></el-input>
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
<template #footer>
|
||
<el-button @click="visitorsdialog = false">取 消</el-button>
|
||
<el-button type="primary" @click="submitvisitor">确 定</el-button>
|
||
</template>
|
||
</sc-dialog>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
userType: "admin",
|
||
visitorsdialog:false,
|
||
visitorform:{},
|
||
form: {
|
||
user: "admin",
|
||
password: "admin",
|
||
autologin: false,
|
||
},
|
||
rules: {
|
||
user: [
|
||
{
|
||
required: true,
|
||
message: this.$t("login.userError"),
|
||
trigger: "blur",
|
||
},
|
||
],
|
||
password: [
|
||
{
|
||
required: true,
|
||
message: this.$t("login.PWError"),
|
||
trigger: "blur",
|
||
},
|
||
],
|
||
},
|
||
islogin: false,
|
||
};
|
||
},
|
||
watch: {
|
||
userType(val) {
|
||
if (val == "admin") {
|
||
this.form.user = "admin";
|
||
this.form.password = "admin";
|
||
} else if (val == "user") {
|
||
this.form.user = "user";
|
||
this.form.password = "user";
|
||
}
|
||
},
|
||
},
|
||
mounted() {},
|
||
methods: {
|
||
async login() {
|
||
var validate = await this.$refs.loginForm.validate().catch(() => {});
|
||
if (!validate) {
|
||
return false;
|
||
}
|
||
|
||
this.islogin = true;
|
||
var data = {
|
||
username: this.form.user,
|
||
// password: this.$TOOL.crypto.MD5(this.form.password)
|
||
password: this.form.password,
|
||
};
|
||
//获取token
|
||
try {
|
||
var res = await this.$API.auth.token.post(data);
|
||
this.$TOOL.cookie.set("TOKEN", res.access, {
|
||
expires: this.form.autologin ? 24 * 60 * 60 : 0,
|
||
});
|
||
try {
|
||
var res1 = await this.$API.auth.info.get();
|
||
this.$TOOL.data.set("USER_INFO", res1);
|
||
this.$TOOL.data.set("PERMISSIONS", Object.keys(res1.perms));
|
||
this.$router.replace({
|
||
path: "/",
|
||
});
|
||
this.$message.success("Login Success 登录成功");
|
||
this.islogin = false;
|
||
} catch (err) {
|
||
this.islogin = false;
|
||
console.log(err);}
|
||
} catch (err) {
|
||
this.islogin = false;
|
||
console.log(err);
|
||
}
|
||
// var res = await this.$API.auth.token.post(data)
|
||
// console.log(res, err)
|
||
// if(!res){
|
||
// this.islogin = false
|
||
// this.$message.warning(res.err_msg)
|
||
// return false
|
||
// }else{
|
||
// this.$TOOL.cookie.set("TOKEN", res.token, {
|
||
// expires: this.form.autologin? 24*60*60 : 0
|
||
// })
|
||
// }
|
||
// if(user.code == 200){
|
||
|
||
// this.$TOOL.data.set("USER_INFO", user.data.userInfo)
|
||
// }else{
|
||
|
||
// }
|
||
//获取菜单
|
||
// var menu = null
|
||
// if(this.form.user == 'admin'){
|
||
// menu = await this.$API.system.menu.myMenus.get()
|
||
// }else{
|
||
// menu = await this.$API.demo.menu.get()
|
||
// }
|
||
// if(menu.code == 200){
|
||
// if(menu.data.menu.length==0){
|
||
// this.islogin = false
|
||
// this.$alert("当前用户无任何菜单权限，请联系系统管理员", "无权限访问", {
|
||
// type: 'error',
|
||
// center: true
|
||
// })
|
||
// return false
|
||
// }
|
||
// this.$TOOL.data.set("MENU", menu.data.menu)
|
||
// this.$TOOL.data.set("PERMISSIONS", menu.data.permissions)
|
||
// }else{
|
||
// this.islogin = false
|
||
// this.$message.warning(menu.message)
|
||
// return false
|
||
// }
|
||
|
||
// this.$router.replace({
|
||
// path: '/'
|
||
// })
|
||
// this.$message.success("Login Success 登录成功")
|
||
// this.islogin = false
|
||
},
|
||
visitors(){
|
||
this.visitorsdialog=true;
|
||
},
|
||
submitvisitor(){
|
||
this.$API.vm.visitor.createz
|
||
.req(this.visitorform)
|
||
.then((res) => {
|
||
this.$message.success("创建成功!");
|
||
this.visitorsdialog = false;
|
||
return res;
|
||
})
|
||
.catch((err) => {
|
||
return err;
|
||
});
|
||
}
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style>
|
||
</style>
|