89 lines
2.1 KiB
Vue
89 lines
2.1 KiB
Vue
<template>
|
||
<div class="back">
|
||
<!-- {{ $store.state.userinfo }} -->
|
||
<div class="box">
|
||
<div>
|
||
<p>学生名：</p>
|
||
<el-input v-model="user" placeholder="请输入用户名"></el-input>
|
||
</div>
|
||
<div>
|
||
<p>密码：</p>
|
||
<el-input
|
||
v-model="pwd"
|
||
show-password
|
||
placeholder="请输入密码"
|
||
></el-input>
|
||
</div>
|
||
<div class="button">
|
||
<el-button @click="register" type="primary">添加</el-button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
<style scoped>
|
||
.back {
|
||
background-image: url("../assets/1.jpg");
|
||
width: 100%;
|
||
height: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background-size: cover;
|
||
}
|
||
.box {
|
||
width: 400px;
|
||
height: 200px;
|
||
background-color: #fff;
|
||
box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
|
||
border-radius: 10px;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: space-around;
|
||
}
|
||
.box > div {
|
||
width: 80%;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.box > div > p {
|
||
flex-shrink: 0;
|
||
width: 80px;
|
||
}
|
||
.button {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
}
|
||
</style>
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
user: "",
|
||
pwd: "",
|
||
};
|
||
},
|
||
methods: {
|
||
register() {
|
||
this.axios
|
||
.get("/addstu", {
|
||
params: {
|
||
pwd: this.pwd,
|
||
user: this.user,
|
||
},
|
||
})
|
||
.then((res) => {
|
||
console.log(res.data);
|
||
if (res.data.code == 1) {
|
||
this.$message.error("添加失败");
|
||
} else {
|
||
this.$message({
|
||
message: "添加成功",
|
||
type: "success",
|
||
});
|
||
}
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script> |