86 lines
2.0 KiB
Vue
86 lines
2.0 KiB
Vue
<template>
|
|
<div class="text-center width-100vw">
|
|
<img src="/loginBackground.png" class="login-background">
|
|
<div class="login-box page-center" style="width: 360px;height: 360px;">
|
|
<el-card class="box-card width-100p margin-right-l">
|
|
<div class="title-l text-center">
|
|
账号登录
|
|
</div>
|
|
<el-form ref="form" :model="form" label-position="left">
|
|
<el-form-item label="账号">
|
|
<el-input v-model="form.account"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="密码">
|
|
<el-input v-model="form.account"></el-input>
|
|
</el-form-item>
|
|
<el-form-item class="text-center">
|
|
<el-button type="primary" @click="login">立即登录</el-button>
|
|
<el-button @click="registered">立即注册</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</el-card>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
navigate: {
|
|
hide : true,
|
|
notShow: true,
|
|
},
|
|
//组件
|
|
components: {},
|
|
props : [],
|
|
//数据
|
|
data() {
|
|
return {
|
|
type: 'accountPassword',
|
|
form: {
|
|
account : '',
|
|
password: '',
|
|
},
|
|
}
|
|
},
|
|
//计算属性
|
|
computed: {},
|
|
//在实例创建完成后被立即调用
|
|
created() {
|
|
},
|
|
//实例被挂载后调用
|
|
mounted() {
|
|
},
|
|
//methods 将被混入到 Vue 实例中。可以直接通过 VM 实例访问这些方法,或者在指令表达式中使用。
|
|
methods: {
|
|
async login() {
|
|
const res = await this.$api.post('/permission/api/login', {
|
|
type: this.type,
|
|
data: this.form,
|
|
})
|
|
console.log('res',res);
|
|
},
|
|
async registered() {
|
|
const res = await this.$api.post('/permission/api/registered', {
|
|
type: this.type,
|
|
data: this.form,
|
|
})
|
|
console.log('res',res);
|
|
}
|
|
},
|
|
//包含 Vue 实例可用过滤器的哈希表。
|
|
filters: {},
|
|
//侦听器
|
|
watch: {},
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
.login-background {
|
|
width: 100vh;
|
|
height: 100vh;
|
|
}
|
|
|
|
.login-box {
|
|
}
|
|
</style>
|