|
|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
- <div class="pb_content">
|
|
|
- <div class="pb_content_body" style="position: relative; width: 100%">
|
|
|
+ <div class="pb_content" v-loading="isloading">
|
|
|
+ <div class="pb_content_body" style="position: relative">
|
|
|
<div style="width: 100%; margin: 0px auto">
|
|
|
<div class="formTop">
|
|
|
<div class="tx">
|
|
|
@@ -17,11 +17,21 @@
|
|
|
请输入地区
|
|
|
</div>
|
|
|
<div>
|
|
|
- <el-input
|
|
|
+ <!-- <el-input
|
|
|
v-model="ruleForm.region"
|
|
|
style="width: 300px"
|
|
|
placeholder="请输入市区"
|
|
|
- ></el-input>
|
|
|
+ ></el-input> -->
|
|
|
+ <el-cascader
|
|
|
+ size="large"
|
|
|
+ style="width: 300px"
|
|
|
+ clearable
|
|
|
+ :options="region"
|
|
|
+ v-model="selectedOptions"
|
|
|
+ @change="handleChange"
|
|
|
+ placeholder="请选择市区"
|
|
|
+ >
|
|
|
+ </el-cascader>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="first">
|
|
|
@@ -89,20 +99,71 @@
|
|
|
</div>
|
|
|
<div class="isButton">
|
|
|
<el-button @click="addRaceUser">确定提交</el-button>
|
|
|
+ <el-button @click="goTo('/login')">返回登录</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="copyright">
|
|
|
+ <el-dialog
|
|
|
+ :show-close="false"
|
|
|
+ title="提交成功"
|
|
|
+ :visible.sync="dialogVisibleSuccess"
|
|
|
+ :append-to-body="true"
|
|
|
+ width="600px"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :before-close="handleClose"
|
|
|
+ class="dialog_diy"
|
|
|
+ >
|
|
|
+ <div class="s_box">
|
|
|
+ <div class="s_top">
|
|
|
+ <span>恭喜您</span>
|
|
|
+ <span>成功申请广东省案例征集活动管理账号!</span>
|
|
|
+ </div>
|
|
|
+ <div class="s_content">
|
|
|
+ <div class="title">以下为您的登录账号密码</div>
|
|
|
+ <div class="content">
|
|
|
+ <div>
|
|
|
+ <span class="user">{{ num }}</span>
|
|
|
+ </div>
|
|
|
+ <div><span>密码：</span><span class="password">123456</span></div>
|
|
|
+ </div>
|
|
|
+ <div class="tips1">请截图保存好自己的账号密码</div>
|
|
|
+ <div class="tips2">复制账号和密码，登录后进行操作</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ class="tag-read"
|
|
|
+ style="
|
|
|
+ background: rgb(112, 183, 79);
|
|
|
+ border-color: rgb(112, 183, 79);
|
|
|
+ margin-right: 50px;
|
|
|
+ "
|
|
|
+ @click="copy"
|
|
|
+ :data-clipboard-text="copyText"
|
|
|
+ >复制账号</el-button
|
|
|
+ >
|
|
|
+ <el-button type="primary" @click="goTo('/login')">返回登陆</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ <!-- <div class="copyright">
|
|
|
版权所有：广州师培社教育科技有限公司 粤ICP备09132871号
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import { regionData, CodeToText } from "element-china-area-data";
|
|
|
+import Clipboard from "clipboard";
|
|
|
+const Data = regionData.filter((ele) => {
|
|
|
+ return ele.value == "440000";
|
|
|
+});
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ region: Data[0].children,
|
|
|
+ selectedOptions: [], //"440000","440100"
|
|
|
ruleForm: {
|
|
|
headportrait: "",
|
|
|
region: "",
|
|
|
@@ -117,6 +178,9 @@ export default {
|
|
|
loading: false,
|
|
|
schoolList: [],
|
|
|
num: "",
|
|
|
+ dialogVisibleSuccess: false,
|
|
|
+ copyText: "",
|
|
|
+ isloading:false,
|
|
|
};
|
|
|
},
|
|
|
// mounted() {
|
|
|
@@ -125,6 +189,22 @@ export default {
|
|
|
// });
|
|
|
// },
|
|
|
methods: {
|
|
|
+ handleClose(done) {
|
|
|
+ done();
|
|
|
+ },
|
|
|
+ goTo(path) {
|
|
|
+ this.$router.push(path);
|
|
|
+ },
|
|
|
+ handleChange() {
|
|
|
+ if (!this.selectedOptions) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ var loc = "";
|
|
|
+ for (let i = 0; i < this.selectedOptions.length; i++) {
|
|
|
+ loc += CodeToText[this.selectedOptions[i]];
|
|
|
+ }
|
|
|
+ this.ruleForm.region = "广东省" + loc;
|
|
|
+ },
|
|
|
remoteMethod(query) {
|
|
|
if (query !== "") {
|
|
|
this.loading = true;
|
|
|
@@ -142,8 +222,11 @@ export default {
|
|
|
this.options = [];
|
|
|
},
|
|
|
getSchool() {
|
|
|
+ let params = {
|
|
|
+ n: "",
|
|
|
+ };
|
|
|
this.ajax
|
|
|
- .get(this.$store.state.api + "selectOrg")
|
|
|
+ .get(this.$store.state.api + "getSchool", params)
|
|
|
.then((res) => {
|
|
|
this.schoolList = res.data[0];
|
|
|
this.list = this.schoolList.map((item) => {
|
|
|
@@ -168,6 +251,7 @@ export default {
|
|
|
this.$message.error("请填写手机号");
|
|
|
return;
|
|
|
}
|
|
|
+ this.isloading = true
|
|
|
let params = [
|
|
|
{
|
|
|
reg: this.ruleForm.region,
|
|
|
@@ -184,13 +268,30 @@ export default {
|
|
|
message: "创建成功",
|
|
|
type: "success",
|
|
|
});
|
|
|
+ this.isloading = false
|
|
|
+ this.dialogVisibleSuccess = true;
|
|
|
this.num = res.data.num;
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
+ this.isloading = false
|
|
|
this.$message.error("创建失败");
|
|
|
console.error(err);
|
|
|
});
|
|
|
},
|
|
|
+ copy() {
|
|
|
+ this.copyText = this.num;
|
|
|
+ var clipboard = new Clipboard(".tag-read");
|
|
|
+ clipboard.on("success", (e) => {
|
|
|
+ this.$message.success("复制成功");
|
|
|
+ console.log("复制成功");
|
|
|
+ clipboard.destroy(); // 释放内存
|
|
|
+ });
|
|
|
+ clipboard.on("error", (e) => {
|
|
|
+ console.log("不支持复制,该浏览器不支持自动复制");
|
|
|
+ this.$message.error("不支持复制,该浏览器不支持自动复制");
|
|
|
+ clipboard.destroy(); // 释放内存
|
|
|
+ });
|
|
|
+ },
|
|
|
},
|
|
|
created() {
|
|
|
this.getSchool();
|
|
|
@@ -199,17 +300,48 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
+.dialog_diy >>> .el-dialog__header {
|
|
|
+ background: #3c3c3c !important;
|
|
|
+ padding: 15px 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__title {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__headerbtn {
|
|
|
+ top: 19px;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__headerbtn .el-dialog__close {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__headerbtn .el-dialog__close:hover {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.dialog_diy >>> .el-dialog__body,
|
|
|
+.dialog_diy >>> .el-dialog__footer {
|
|
|
+ background: #fafafa;
|
|
|
+}
|
|
|
+.dialog_diy >>> .el-dialog__footer {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+
|
|
|
.pb_content {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
- min-height: 640px;
|
|
|
- min-width: unset;
|
|
|
- margin: 0;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+.pb_content_body {
|
|
|
background: #fff;
|
|
|
- position: relative;
|
|
|
+ padding: 20px 0;
|
|
|
+ width: 500px;
|
|
|
+ border-radius: 5px;
|
|
|
}
|
|
|
.formTop {
|
|
|
display: flex;
|
|
|
@@ -268,4 +400,55 @@ export default {
|
|
|
left: 20px;
|
|
|
bottom: 15px;
|
|
|
}
|
|
|
+
|
|
|
+.s_box {
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_top {
|
|
|
+ width: 90%;
|
|
|
+ margin: 0 auto;
|
|
|
+ border-bottom: 1px solid #eee;
|
|
|
+ padding: 20px 0;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ font-size: 22px;
|
|
|
+}
|
|
|
+.s_top span:nth-child(1) {
|
|
|
+ font-size: 26px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_content {
|
|
|
+ width: 90%;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding: 20px 0 50px;
|
|
|
+}
|
|
|
+
|
|
|
+.s_content .title {
|
|
|
+ font-size: 18px;
|
|
|
+}
|
|
|
+.s_content .content {
|
|
|
+ padding: 50px 0;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.s_content .content div + div {
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+.s_content .content .user {
|
|
|
+ font-size: 20px;
|
|
|
+ color: rgb(64, 145, 234);
|
|
|
+}
|
|
|
+.s_content .content .password {
|
|
|
+ font-size: 24px;
|
|
|
+ color: rgb(64, 145, 234);
|
|
|
+}
|
|
|
+.s_content .tips1 {
|
|
|
+ color: rgb(162, 162, 162);
|
|
|
+}
|
|
|
+.s_content .tips2 {
|
|
|
+ font-size: 18px;
|
|
|
+}
|
|
|
</style>
|
