Skip to content

C
campSite
Commit 02a336a0 authored by 杨梦雪's avatar 杨梦雪
Browse files
Options

多形式活动-邀请码

parent b8a7d420
Hide whitespace changes
Inline Side-by-side
Showing with 296 additions and 212 deletions
src/components/index/SignUp/invitation.vue
View file @ 02a336a0
...@@ -62,226 +62,245 @@ ...@@ -62,226 +62,245 @@
<div class="btn"> <div class="btn">
<el-button @click="next()">提交/跳过</el-button> <el-button @click="next()">提交/跳过</el-button>
</div> </div>
<!-- 多形式报名邀请码报错弹框 -->
<cueDialog :dialogVisible="dialogVisible" :msg="msg"></cueDialog>
</div> </div>
</template> </template>
<script> <script>
/* eslint-disable */ /* eslint-disable */
import { setInviteCode } from "r/index/signUp"; import {setInviteCode} from "r/index/signUp";
export default { import cueDialog from "c/index/cueDialog";
name: "Invitation",
props: { invitation_code: String }, export default {
data() { name: "Invitation",
return { props: {invitation_code: String},
invatation1: "", components:{cueDialog},
invatation2: "", data() {
invatation3: "", return {
invatation4: "", invatation1: "",
inputFlag: true, invatation2: "",
}; invatation3: "",
}, invatation4: "",
created() { inputFlag: true,
if (this.invitation_code) { dialogVisible: false,
let a = this.invitation_code.split("-"); msg: null,
this.invatation1 = a[0]; };
this.invatation2 = a[1];
this.invatation3 = a[2];
this.invatation4 = a[3];
this.inputFlag = false;
// console.log(a[0])
}
},
watch: {
invatation1: function () {
// /\n/g(删除制表符 /t的正则)
this.invatation1 = this.invatation1
.replace(/[\W]/g, "")
// .replace(/\n/g,"")
// .replace("/\n/g",'')
.toUpperCase()
.substring(0, 4);
},
invatation2: function () {
this.invatation2 = this.invatation2
.replace(/[\W]/g, "")
.toUpperCase()
.substring(0, 4);
},
invatation3: function () {
this.invatation3 = this.invatation3
.replace(/[\W]/g, "")
.toUpperCase()
.substring(0, 4);
},
invatation4: function () {
this.invatation4 = this.invatation4
.replace(/[\W]/g, "")
.toUpperCase()
.substring(0, 4);
}, },
}, created() {
methods: { if (this.invitation_code) {
// next() { let a = this.invitation_code.split("-");
// this.$router.push("/signUp/referInfo"); this.invatation1 = a[0];
// }, this.invatation2 = a[1];
//第一个输入框 this.invatation3 = a[2];
changeValue1(e) { this.invatation4 = a[3];
const code = e.trim(); this.inputFlag = false;
console.log(code, "输入111"); // console.log(a[0])
if (code.indexOf("-") !== -1) {
//如果是复制过来的带'-'邀请码
let copyCode = code.split("-");
// console.log(copyCode, "输入222");
this.invatation1 = copyCode[0];
this.invatation2 = copyCode[1];
this.invatation3 = copyCode[2];
this.invatation4 = copyCode[3];
this.$refs.input3.focus();
} else if (code.length > 4) {
this.changeValue(code.substring(0, 4));
} else {
this.changeValue(code);
} }
}, },
// 输入框 watch: {
changeValue(e) { invatation1: function () {
if (e.length >= 4) { // /\n/g(删除制表符 /t的正则)
// console.log(e, "length"); this.invatation1 = this.invatation1
// console.log(this.currentIndex, "this.currentIndex"); .replace(/[\W]/g, "")
switch (this.currentIndex) { // .replace(/\n/g,"")
case 0: // .replace("/\n/g",'')
// console.log(this.text0.length); .toUpperCase()
if (this.invatation1.length >= 4) { .substring(0, 4);
// this.$nextTick(() => { },
invatation2: function () {
this.invatation2 = this.invatation2
.replace(/[\W]/g, "")
.toUpperCase()
.substring(0, 4);
},
invatation3: function () {
this.invatation3 = this.invatation3
.replace(/[\W]/g, "")
.toUpperCase()
.substring(0, 4);
},
invatation4: function () {
this.invatation4 = this.invatation4
.replace(/[\W]/g, "")
.toUpperCase()
.substring(0, 4);
},
},
methods: {
//第一个输入框
changeValue1(e) {
const code = e.trim();
// console.log(code, "输入111");
if (code.indexOf("-") !== -1) {
//如果是复制过来的带'-'邀请码
let copyCode = code.split("-");
// console.log(copyCode, "输入222");
this.invatation1 = copyCode[0];
this.invatation2 = copyCode[1];
this.invatation3 = copyCode[2];
this.invatation4 = copyCode[3];
this.$refs.input3.focus();
} else if (code.length > 4) {
this.changeValue(code.substring(0, 4));
} else {
this.changeValue(code);
}
},
// 输入框
changeValue(e) {
if (e.length >= 4) {
// console.log(e, "length");
// console.log(this.currentIndex, "this.currentIndex");
switch (this.currentIndex) {
case 0:
// console.log(this.text0.length);
if (this.invatation1.length >= 4) {
// this.$nextTick(() => {
this.$refs.input1.focus();
// })
}
break;
case 1:
if (this.invatation2.length >= 4) {
this.$refs.input2.focus();
}
break;
case 2:
if (this.invatation3.length >= 4) {
this.$refs.input3.focus();
}
break;
case 3:
if (this.invatation4.length >= 4) {
this.$refs.input3.focus();
}
break;
default:
break;
}
} else if (e.length === 0) {
switch (this.currentIndex) {
case 0:
this.$refs.input0.focus();
break;
case 1:
this.$refs.input0.focus();
break;
case 2:
this.$refs.input1.focus(); this.$refs.input1.focus();
// }) break;
} case 3:
break;
case 1:
if (this.invatation2.length >= 4) {
this.$refs.input2.focus(); this.$refs.input2.focus();
} break;
break; default:
case 2: break;
if (this.invatation3.length >= 4) { }
this.$refs.input3.focus(); } else {
}
break;
case 3:
if (this.invatation4.length >= 4) {
this.$refs.input3.focus();
}
break;
default:
break;
} }
} else if (e.length === 0) { },
switch (this.currentIndex) { getFocus(index, e) {
case 0: this.currentIndex = index;
this.$refs.input0.focus(); },
break;
case 1:
this.$refs.input0.focus();
break;
case 2:
this.$refs.input1.focus();
break;
case 3:
this.$refs.input2.focus();
break;
default:
break;
}
} else {
}
},
getFocus(index, e) {
this.currentIndex = index;
},
// 下一步
async next() {
// console.log(111);
let code;
if (
this.invatation1 == "" &&
this.invatation2 == "" &&
this.invatation3 == "" &&
this.invatation4 == ""
) {
code =
this.invatation1 +
this.invatation2 +
this.invatation3 +
this.invatation4;
} else {
code =
this.invatation1 +
"-" +
this.invatation2 +
"-" +
this.invatation3 +
"-" +
this.invatation4;
}
setInviteCode({ code: code }).then((res) => { // 下一步
// console.log(res, "code"); async next() {
if (res.data.code !== 200) { // console.log(111);
return this.$message.error(res.data.message); let code;
if (
this.invatation1 == "" &&
this.invatation2 == "" &&
this.invatation3 == "" &&
this.invatation4 == ""
) {
code =
this.invatation1 +
this.invatation2 +
this.invatation3 +
this.invatation4;
} else {
code =
this.invatation1 +
"-" +
this.invatation2 +
"-" +
this.invatation3 +
"-" +
this.invatation4;
} }
this.$emit("getstatus", res.data.status);
}); setInviteCode({code: code}).then((res) => {
// console.log(res, "code");
if (res.data.code !== 200) {
return this.$message.error(res.data.message);
}
if (res.data.code == 4000346 || res.data.code == 4000347) {
this.dialogVisible = true;
this.msg = res.data.message
return;
}
this.$emit("getstatus", res.data.status);
});
},
}, },
}, };
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "a/scss/btn"; @import "a/scss/btn";
.flex {
display: flex; .flex {
} display: flex;
.invitation { }
.iv_content {
justify-content: center; .invitation {
height: 44px; .iv_content {
::v-deep .el-input__inner { justify-content: center;
width: 110px; height: 44px;
height: 38px;
border-radius: 4px; ::v-deep .el-input__inner {
border: 2px solid var(--color); width: 110px;
margin-right: 15px; height: 38px;
border-radius: 4px;
border: 2px solid var(--color);
margin-right: 15px;
}
.code_titile {
height: 16px;
font-size: 16px;
font-weight: 600;
color: #1b1419;
line-height: 48px;
margin-right: 10px;
}
.errorCode {
margin-top: 10px;
}
} }
.code_titile {
height: 16px; .tips {
font-size: 16px; font-size: 14px;
font-weight: 600; font-weight: 500;
color: #1b1419; // color: #a7a2a6;
line-height: 48px; color: var(--color);
margin-right: 10px; line-height: 23px;
margin: 30px 0;
// text-align: center;
flex-direction: column;
align-items: center; /*垂直居中*/
width: 100%;
height: 100%;
} }
.errorCode { .errorCode {
margin-top: 10px; font-size: 12px;
font-weight: 400;
color: #d7373f;
line-height: 12px;
} }
} }
.tips {
font-size: 14px;
font-weight: 500;
// color: #a7a2a6;
color: var(--color);
line-height: 23px;
margin: 30px 0;
// text-align: center;
flex-direction: column;
align-items: center; /*垂直居中*/
width: 100%;
height: 100%;
}
.errorCode {
font-size: 12px;
font-weight: 400;
color: #d7373f;
line-height: 12px;
}
}
</style> </style>
src/components/index/SignUp/referInfo.vue
View file @ 02a336a0
...@@ -929,6 +929,8 @@ ...@@ -929,6 +929,8 @@
<el-button @click="confirm">提交资料</el-button> <el-button @click="confirm">提交资料</el-button>
</div> </div>
</el-form> </el-form>
<!-- 多形式报名邀请码报错弹框 -->
<cueDialog :dialogVisible="cueDialogVisible" :msg="msg"></cueDialog>
</div> </div>
</template> </template>
...@@ -946,10 +948,12 @@ ...@@ -946,10 +948,12 @@
import {upload} from "r/index/network"; import {upload} from "r/index/network";
import validator from "common/validator"; import validator from "common/validator";
import area from "config/area"; import area from "config/area";
import cueDialog from "c/index/cueDialog";
export default { export default {
name: "referInfo", name: "referInfo",
props: {invitation_code: String}, props: {invitation_code: String},
components:{cueDialog},
data() { data() {
const validateContent = (rule, value, callback) => { const validateContent = (rule, value, callback) => {
if (!this.referForm.birthday) { if (!this.referForm.birthday) {
...@@ -973,6 +977,8 @@ ...@@ -973,6 +977,8 @@
} }
}; };
return { return {
cueDialogVisible:false,
msg:null,
configJson: {}, configJson: {},
isUploading: false, // 图片上传蒙层 isUploading: false, // 图片上传蒙层
isCode: false, // 邀请码是否禁用 isCode: false, // 邀请码是否禁用
...@@ -2005,7 +2011,6 @@ ...@@ -2005,7 +2011,6 @@
obj.code = _this.referForm.code; obj.code = _this.referForm.code;
} }
setAccount(obj).then((res) => { setAccount(obj).then((res) => {
// console.log(res, "setAccount");
if (res.data.code != 200) { if (res.data.code != 200) {
if (res.data.code == 400068) { if (res.data.code == 400068) {
this.$parent.statuss(); this.$parent.statuss();
...@@ -2013,11 +2018,13 @@ ...@@ -2013,11 +2018,13 @@
} }
return this.$message.error(res.data.message); return this.$message.error(res.data.message);
} }
// console.log(3333); if (res.data.code == 4000346 || res.data.code == 4000347) {
this.dialogVisible = true;
this.msg = res.data.message
return;
}
this.$emit("getstatus", res.data.status); this.$emit("getstatus", res.data.status);
this.$message.success(res.data.message); this.$message.success(res.data.message);
// let code = this.$store.state.indexIdentity;
// this.$router.push("/signUp/check?code=" + code);
this.referForm = res.data.data; this.referForm = res.data.data;
}); });
......
src/components/index/cueDialog.vue 0 → 100644
View file @ 02a336a0
<template>
<el-dialog
:visible.sync="dialogVisibleFU"
width="30%"
:before-close="handleClose">
<div class="multiform">
<img src="../../assets/img/cue.png"/>
<span>{{msgFU}}</span>
</div>
</el-dialog>
</template>
<script>
export default {
name: "cueDialog",
props: {dialogVisible: Boolean , msg: String,},
data() {
return {
dialogVisibleFU: this.dialogVisible,
msgFU: this.msg,
};
},
methods: {
handleClose(done) {
done();
},
},
watch: {
dialogVisible() {
this.dialogVisibleFU = this.dialogVisible;
},
signTitle() {
this.msgFU = this.msg;
},
}
}
</script>
<style lang="scss" scoped>
.multiform {
display: flex;
flex-direction: column;
align-items: center;
img {
width: 35px;
height: 35px;
margin-bottom: 16px;
}
}
::v-deep .el-dialog__body {
padding: 10px 30px 35px 30px;
}
</style>
src/views/index/recruit/Index.vue
View file @ 02a336a0
...@@ -2,12 +2,12 @@ ...@@ -2,12 +2,12 @@
<div class="recruit"> <div class="recruit">
<el-header height="104px"> <el-header height="104px">
<Header></Header> <Header></Header>
<div class="notify flex"> <!-- <div class="notify flex">-->
<div class="flex"> <!-- <div class="flex">-->
<img class="notify_img" src="../../../assets/img/notify.png" alt="" /> <!-- <img class="notify_img" src="../../../assets/img/notify.png" alt="" />-->
</div> <!-- </div>-->
<div>注意：本次活动报名有人数限制，当前共有{{ info.order_num }}人申请，剩余名额为{{info.student_num}}人</div> <!-- <div>注意：本次活动报名有人数限制，当前共有{{ info.order_num }}人申请，剩余名额为{{info.student_num}}人</div>-->
</div> <!-- </div>-->
<div class="bg-top"></div> <div class="bg-top"></div>
</el-header> </el-header>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment