|
|
@@ -0,0 +1,397 @@
|
|
|
+<template>
|
|
|
+ <div class="login_content">
|
|
|
+ <!-- <el-button type="primary" @click="login()">登录</el-button> -->
|
|
|
+ <div class="login_box" v-show="islogin">
|
|
|
+ <div style="padding: 0px 20px">
|
|
|
+ <div class="login_title">
|
|
|
+ <span>绑定账号</span>
|
|
|
+ </div>
|
|
|
+ <el-form label-position="right" label-width="80px" style="margin-top: 30px">
|
|
|
+ <el-form-item label="登录账号">
|
|
|
+ <el-input
|
|
|
+ v-model="phoneNum"
|
|
|
+ auto-complete="off"
|
|
|
+ placeholder="请输入登录账号"
|
|
|
+ style="width: 100%"
|
|
|
+ @keyup.enter.native="findPhone"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="密码">
|
|
|
+ <el-input
|
|
|
+ v-model="password"
|
|
|
+ auto-complete="off"
|
|
|
+ placeholder="请输入密码"
|
|
|
+ type="password"
|
|
|
+ style="width: 100%"
|
|
|
+ @keyup.enter.native="findPhone"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div style="display: flex; justify-content: flex-end">
|
|
|
+ <el-button type="text" @click="islogin = false">立即注册</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="login_button">
|
|
|
+ <button @click="findPhone()">登录</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="login_box" v-show="!islogin">
|
|
|
+ <div style="padding: 0px 20px">
|
|
|
+ <div class="login_title">
|
|
|
+ <span>劳动教育校园端端平台</span>
|
|
|
+ </div>
|
|
|
+ <el-form
|
|
|
+ label-position="right"
|
|
|
+ label-width="80px"
|
|
|
+ style="margin-top: 30px"
|
|
|
+ :rules="rules2"
|
|
|
+ ref="ruleForm2"
|
|
|
+ :model="registerForm"
|
|
|
+ >
|
|
|
+ <el-form-item label="登录账号" prop="phone">
|
|
|
+ <el-input
|
|
|
+ v-model="registerForm.rphoneNum"
|
|
|
+ auto-complete="off"
|
|
|
+ placeholder="请输入登录账号"
|
|
|
+ style="width: 100%"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="密码" prop="pass">
|
|
|
+ <el-input
|
|
|
+ v-model="registerForm.rpassword"
|
|
|
+ auto-complete="off"
|
|
|
+ placeholder="请输入密码"
|
|
|
+ type="password"
|
|
|
+ style="width: 100%"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="确认密码" prop="checkPass">
|
|
|
+ <el-input
|
|
|
+ v-model="registerForm.repassword"
|
|
|
+ auto-complete="off"
|
|
|
+ placeholder="请再输入一遍密码"
|
|
|
+ type="password"
|
|
|
+ style="width: 100%"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="选择学校" prop="school">
|
|
|
+ <el-select
|
|
|
+ filterable
|
|
|
+ allow-create
|
|
|
+ default-first-option
|
|
|
+ v-model="registerForm.school"
|
|
|
+ style="width: 80%"
|
|
|
+ placeholder="请选择学校"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in schoolArray"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.name"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div style="display: flex; justify-content: flex-end">
|
|
|
+ <el-button type="text" @click="islogin = true">返回登录</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="login_button">
|
|
|
+ <button @click="register()">注册</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ // 验证手机
|
|
|
+ var checkPhone = (rule, value, callback) => {
|
|
|
+ var _this = this;
|
|
|
+ let reg = /^1\d{10}$/;
|
|
|
+ if (_this.registerForm.rphoneNum === "") {
|
|
|
+ callback(new Error("请输入登录账号"));
|
|
|
+ } else {
|
|
|
+ let params = { phone: _this.registerForm.rphoneNum };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "findPhone", params)
|
|
|
+ .then((res) => {
|
|
|
+ if (res.data[0].length > 0) {
|
|
|
+ callback(new Error("此登录账号已注册"));
|
|
|
+ } else {
|
|
|
+ callback();
|
|
|
+ }
|
|
|
+ console.log(res.data[0]);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ callback();
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ };
|
|
|
+ var validatePass = (rule, value, callback) => {
|
|
|
+ var _this = this;
|
|
|
+ if (_this.registerForm.rpassword === "") {
|
|
|
+ callback(new Error("请输入密码"));
|
|
|
+ } else {
|
|
|
+ if (_this.registerForm.rpassword.length < 6) {
|
|
|
+ callback(new Error("输入的密码需不少于6位"));
|
|
|
+ } else if (_this.registerForm.repassword !== "") {
|
|
|
+ _this.$refs.ruleForm2.validateField("checkPass");
|
|
|
+ }
|
|
|
+ callback();
|
|
|
+ }
|
|
|
+ };
|
|
|
+ var validatePass2 = (rule, value, callback) => {
|
|
|
+ var _this = this;
|
|
|
+ if (_this.registerForm.repassword === "") {
|
|
|
+ callback(new Error("请再次输入密码"));
|
|
|
+ } else if (
|
|
|
+ _this.registerForm.repassword !== _this.registerForm.rpassword
|
|
|
+ ) {
|
|
|
+ callback(new Error("两次输入密码不一致!"));
|
|
|
+ } else {
|
|
|
+ callback();
|
|
|
+ }
|
|
|
+ };
|
|
|
+ return {
|
|
|
+ islogin: true,
|
|
|
+ phoneNum: "",
|
|
|
+ password: "",
|
|
|
+ sqlPassword: "",
|
|
|
+ openId: this.$route.query.yuser,
|
|
|
+ schoolArray: [],
|
|
|
+ now: "",
|
|
|
+ userInfo: [],
|
|
|
+ registerForm: {
|
|
|
+ rphoneNum: "",
|
|
|
+ rpassword: "",
|
|
|
+ repassword: "",
|
|
|
+ school: "",
|
|
|
+ },
|
|
|
+ rules2: {
|
|
|
+ phone: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ validator: checkPhone,
|
|
|
+ trigger: ["blur", "change"],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ pass: [{ required: true, validator: validatePass, trigger: "blur" }],
|
|
|
+ checkPass: [
|
|
|
+ { required: true, validator: validatePass2, trigger: "blur" },
|
|
|
+ ],
|
|
|
+ school: [
|
|
|
+ { required: true, message: "请选择活动区域", trigger: "blur" },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getOrg();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ time() {
|
|
|
+ if (!this.now) {
|
|
|
+ this.now = new Date().getTime();
|
|
|
+ return true;
|
|
|
+ } else {
|
|
|
+ let time = new Date().getTime();
|
|
|
+ if (time - this.now > 3000) {
|
|
|
+ this.now = time;
|
|
|
+ return true;
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //查询学校
|
|
|
+ getOrg() {
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "getAllOrg", "")
|
|
|
+ .then((res) => {
|
|
|
+ this.schoolArray = res.data[0];
|
|
|
+ console.log(res.data[0]);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ register() {
|
|
|
+ this.$refs.ruleForm2.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ if (this.time()) {
|
|
|
+ let params = [
|
|
|
+ {
|
|
|
+ unname: this.registerForm.rphoneNum,
|
|
|
+ upassword: this.registerForm.repassword,
|
|
|
+ sid: "",
|
|
|
+ type: 4,
|
|
|
+ oid: this.registerForm.school,
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ this.ajax
|
|
|
+ .post(this.$store.state.api + "registerSchool", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.$message({
|
|
|
+ message: "注册成功",
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ this.registerForm = {
|
|
|
+ rphoneNum: "",
|
|
|
+ rpassword: "",
|
|
|
+ repassword: "",
|
|
|
+ school: "",
|
|
|
+ };
|
|
|
+ this.islogin = true;
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ this.$message.error("注册失败");
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ findPhone() {
|
|
|
+ if (this.phoneNum === "") {
|
|
|
+ this.$message.error("请输入账号");
|
|
|
+ return;
|
|
|
+ } else if (this.password === "") {
|
|
|
+ this.$message.error("请输入密码");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let params = { phone: this.phoneNum };
|
|
|
+ this.ajax
|
|
|
+ .get(this.$store.state.api + "findPhone", params)
|
|
|
+ .then((res) => {
|
|
|
+ if (res.data[0].length > 0) {
|
|
|
+ if (res.data[0][0].type == 4) {
|
|
|
+ // this.sqlPassword = res.data[0][0].userpassword;
|
|
|
+ } else {
|
|
|
+ this.$message.error("您的账号不是管理员账号");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$message.error("请使用管理员账号登录");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.login();
|
|
|
+ console.log(res.data[0][0]);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ login() {
|
|
|
+ if (this.time()) {
|
|
|
+ // this.$store.commit("update", ["isLogin", true]);
|
|
|
+ // window.sessionStorage.setItem("login", true);
|
|
|
+ // this.$router.push("/");
|
|
|
+ var _this = this;
|
|
|
+ let params = [
|
|
|
+ {
|
|
|
+ uname: this.phoneNum,
|
|
|
+ upassword: this.password,
|
|
|
+ openId: this.openId,
|
|
|
+ // sqlpassword: this.sqlPassword,
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ _this.ajax
|
|
|
+ .post(_this.$store.state.api + "loginBYingShuo", params)
|
|
|
+ .then((res) => {
|
|
|
+ debugger
|
|
|
+ if (res.data.status == "1") {
|
|
|
+ _this.$cookies.set("yingshuo", "1", -1);
|
|
|
+ _this.$message({
|
|
|
+ message: "登录成功",
|
|
|
+ type: "success",
|
|
|
+ });
|
|
|
+ _this.userInfo = res.data[1][0];
|
|
|
+ _this.$cookies.set("Alogin", "1", -1);
|
|
|
+ // _this.$cookies.set("userid",_this.userInfo.userid,-1)
|
|
|
+ _this.$cookies.set("AuserInfo", _this.userInfo, -1);
|
|
|
+ _this.$store.commit("update", ["isLogin", true]);
|
|
|
+ _this.$store.commit("update", ["userInfo", _this.userInfo]);
|
|
|
+ // console.log(_this.$store.state);
|
|
|
+ this.$router.push("/");
|
|
|
+ } else {
|
|
|
+ _this.$message.error("密码错误");
|
|
|
+ }
|
|
|
+ console.log(res.data);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ _this.$message.error("登录失败");
|
|
|
+ console.error(err);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.login_content {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ height: calc(100% - (67.5px * 2));
|
|
|
+ /* position: absolute; */
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.login_box {
|
|
|
+ width: 23%;
|
|
|
+ min-width: 400px;
|
|
|
+ margin: 0 auto;
|
|
|
+ background: #fff;
|
|
|
+ padding: 20px;
|
|
|
+ box-shadow: 0 0 20px #eee;
|
|
|
+}
|
|
|
+
|
|
|
+/* .userLogin img {
|
|
|
+ width: 50%;
|
|
|
+ display: inline-block;
|
|
|
+ width: 18px;
|
|
|
+ padding-right: 5px;
|
|
|
+ border-right: 1px solid #2a97ff;
|
|
|
+ position: absolute;
|
|
|
+ top: 8px;
|
|
|
+ left: 10px;
|
|
|
+ z-index: 999;
|
|
|
+} */
|
|
|
+
|
|
|
+/* .el-input >>> input {
|
|
|
+ width: 100%;
|
|
|
+ padding: 15px 0 15px 40px;
|
|
|
+ outline: none;
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ font-size: 14px;
|
|
|
+} */
|
|
|
+/* .userLogin {
|
|
|
+ margin-top: 25px;
|
|
|
+ position: relative;
|
|
|
+} */
|
|
|
+.login_button {
|
|
|
+ margin-top: 10px;
|
|
|
+}
|
|
|
+.login_button button {
|
|
|
+ width: 100%;
|
|
|
+ color: #fff;
|
|
|
+ background: #2a97ff;
|
|
|
+ padding: 10px;
|
|
|
+ border-radius: 10px;
|
|
|
+ border: none;
|
|
|
+ font-size: 18px;
|
|
|
+ text-align: center;
|
|
|
+ outline: none;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.login_title {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 26px;
|
|
|
+ font-weight: 600;
|
|
|
+}
|
|
|
+</style>
|
