|
@@ -0,0 +1,239 @@
|
|
|
|
+<template>
|
|
|
|
+ <div>
|
|
|
|
+ <div class="hello">您好,</div>
|
|
|
|
+ <div class="welcom">欢迎来到长春惠吉宝</div>
|
|
|
|
+ <div style="margin-top: 30px">
|
|
|
|
+ <el-form ref="form" :model="form" :rules="rules">
|
|
|
|
+ <el-form-item label="" prop="organId">
|
|
|
|
+ <el-select
|
|
|
|
+ :disabled="isOrganid"
|
|
|
|
+ v-model="form.organId"
|
|
|
|
+ placeholder="请选择单位"
|
|
|
|
+ >
|
|
|
|
+ <el-option
|
|
|
|
+ v-for="(item, i) in data"
|
|
|
|
+ :key="i"
|
|
|
|
+ :label="item.name"
|
|
|
|
+ :value="item.value"
|
|
|
|
+ ></el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <!-- <el-form-item label="" prop="channelDeptName" style="display:none">
|
|
|
|
+ <el-input v-model="form.channelDeptName"></el-input>
|
|
|
|
+ </el-form-item> -->
|
|
|
|
+ <el-form-item label="" prop="name">
|
|
|
|
+ <el-input
|
|
|
|
+ v-model="form.name"
|
|
|
|
+ :disabled="isName"
|
|
|
|
+ placeholder="请输入姓名"
|
|
|
|
+ ></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="" prop="phone">
|
|
|
|
+ <el-input
|
|
|
|
+ :disabled="isPhone"
|
|
|
|
+ type="number"
|
|
|
|
+ v-model="form.phone"
|
|
|
|
+ placeholder="请输入联系方式"
|
|
|
|
+ ></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="" prop="jobNumber">
|
|
|
|
+ <el-input
|
|
|
|
+ :disabled="isjobNumber"
|
|
|
|
+ v-model="form.jobNumber"
|
|
|
|
+ placeholder="请输入工号(非必填)"
|
|
|
|
+ ></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="" v-if="showBtn">
|
|
|
|
+ <el-button class="btn" @click="submitForm('form')"
|
|
|
|
+ >生成二维码</el-button
|
|
|
|
+ >
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- <div class="btn">生成二维码</div> -->
|
|
|
|
+ <div class="qrcode">
|
|
|
|
+ <img :src="src" alt="" style="width: 100%" />
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+<script>
|
|
|
|
+import openId from "../util/getOpenId";
|
|
|
|
+import { Message } from "element-ui";
|
|
|
|
+import { getInfo, getQrcode } from "../api";
|
|
|
|
+export default {
|
|
|
|
+ name: "index",
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ showBtn: true,
|
|
|
|
+ data: [
|
|
|
|
+ { name: "平安财险", value: "1348991942926540802" },
|
|
|
|
+ { name: "太平财险", value: "1348992060643876866" },
|
|
|
|
+ { name: "中国人寿", value: "1348992328710234114" },
|
|
|
|
+ { name: "其他渠道", value: "1348992428849242114" },
|
|
|
|
+ ],
|
|
|
|
+ src: "",
|
|
|
|
+ form: {
|
|
|
|
+ organId: "",
|
|
|
|
+ name: "",
|
|
|
|
+ phone: "",
|
|
|
|
+ jobNumber: "",
|
|
|
|
+ channelDeptName: "",
|
|
|
|
+ openId: "",
|
|
|
|
+ },
|
|
|
|
+ isOrganid: false,
|
|
|
|
+ isName: false,
|
|
|
|
+ isPhone: false,
|
|
|
|
+ isjobNumber: false,
|
|
|
|
+ rules: {
|
|
|
|
+ organId: [
|
|
|
|
+ { required: true, message: "请选择单位名称", trigger: "change" },
|
|
|
|
+ ],
|
|
|
|
+ name: [{ required: true, message: "请输入姓名", trigger: "change" }],
|
|
|
|
+ phone: [
|
|
|
|
+ { required: true, message: "请输入联系方式", trigger: "change" },
|
|
|
|
+ ],
|
|
|
|
+ },
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ submitForm(formName) {
|
|
|
|
+ // 表单验证
|
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
|
+ console.log(valid);
|
|
|
|
+ if (valid) {
|
|
|
|
+ for (let i = 0; i < this.data.length; i++) {
|
|
|
|
+ if (this.form.organId == this.data[i].value) {
|
|
|
|
+ this.form.channelDeptName = this.data[i].name;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ console.log(this.form);
|
|
|
|
+ this.submit();
|
|
|
|
+ // alert('提交成功!')
|
|
|
|
+ } else {
|
|
|
|
+ console.log("error submit!");
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ async findArr(openId) {
|
|
|
|
+ let params = {
|
|
|
|
+ openId: openId,
|
|
|
|
+ };
|
|
|
|
+ const result = await getInfo(params);
|
|
|
|
+ console.log(result, "我是查询结果");
|
|
|
|
+ if (result.data) {
|
|
|
|
+ this.showBtn = false;
|
|
|
|
+ this.form.phone = result.data.phone;
|
|
|
|
+ this.form.name = result.data.name;
|
|
|
|
+ this.form.organId = result.data.channelDeptName;
|
|
|
|
+ this.form.jobNumber = result.data.jobNumber
|
|
|
|
+ this.src = result.data.channelQrCode;
|
|
|
|
+ this.isOrganid = true;
|
|
|
|
+ this.isName = true;
|
|
|
|
+ this.isPhone = true;
|
|
|
|
+ this.isjobNumber = true;
|
|
|
|
+ } else {
|
|
|
|
+ this.showBtn = true;
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ async submit() {
|
|
|
|
+ const result = await getQrcode(this.form);
|
|
|
|
+ console.log(result, "我是提交结果");
|
|
|
|
+ if (result.data) {
|
|
|
|
+ this.showBtn = false;
|
|
|
|
+ this.src = result.data.channelQrCode;
|
|
|
|
+ this.isOrganid = true;
|
|
|
|
+ this.isName = true;
|
|
|
|
+ this.isPhone = true;
|
|
|
|
+ this.isjobNumber = true;
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ async mounted() {
|
|
|
|
+ openId.getOpenId(() => {
|
|
|
|
+ let openId = window.localStorage.getItem("openId");
|
|
|
|
+ // let openId = "oCmQb5t9OfG9lOR_by2WWidjAgqU";
|
|
|
|
+ this.form.openId = openId;
|
|
|
|
+ this.findArr(openId);
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+};
|
|
|
|
+</script>
|
|
|
|
+<style scoped lang="less">
|
|
|
|
+.hello {
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ font-weight: 900;
|
|
|
|
+ text-indent: 30px;
|
|
|
|
+ margin-top: 20px;
|
|
|
|
+}
|
|
|
|
+.welcom {
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ font-weight: 900;
|
|
|
|
+ text-indent: 30px;
|
|
|
|
+ margin-top: 5px;
|
|
|
|
+}
|
|
|
|
+.el-select,
|
|
|
|
+.el-input {
|
|
|
|
+ width: 80%;
|
|
|
|
+ margin-left: 10%;
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.el-select /deep/ .el-input /deep/ .el-input__inner {
|
|
|
|
+ border: 0px solid #dcdfe6;
|
|
|
|
+ border-bottom: 1px solid #dcdfe6;
|
|
|
|
+}
|
|
|
|
+.el-form-item
|
|
|
|
+ /deep/
|
|
|
|
+ .el-form-item__content
|
|
|
|
+ /deep/.el-input
|
|
|
|
+ /deep/
|
|
|
|
+ .el-input__inner {
|
|
|
|
+ border: 0px solid #dcdfe6;
|
|
|
|
+ border-bottom: 1px solid #dcdfe6;
|
|
|
|
+}
|
|
|
|
+.el-input /deep/ .el-input__inner {
|
|
|
|
+ border: 0px solid #dcdfe6;
|
|
|
|
+ border-bottom: 1px solid #dcdfe6;
|
|
|
|
+}
|
|
|
|
+.el-form-item /deep/ .el-form-item__content /deep/ .el-form-item__error {
|
|
|
|
+ left: 12%;
|
|
|
|
+}
|
|
|
|
+.el-form-item {
|
|
|
|
+ margin-bottom: 22px;
|
|
|
|
+}
|
|
|
|
+.btn {
|
|
|
|
+ width: 80%;
|
|
|
|
+ margin-left: 10%;
|
|
|
|
+ border-radius: 5px;
|
|
|
|
+ margin-top: 0px;
|
|
|
|
+ height: 40px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ line-height: 16px;
|
|
|
|
+ color: #fff;
|
|
|
|
+ font-size: 15px;
|
|
|
|
+ font-weight: 600;
|
|
|
|
+ background: linear-gradient(to right, #ff6203, #fd9f55);
|
|
|
|
+}
|
|
|
|
+.qrcode {
|
|
|
|
+ width: 200px;
|
|
|
|
+ height: 200px;
|
|
|
|
+ // border: 1px solid red;
|
|
|
|
+ margin: 5px auto;
|
|
|
|
+}
|
|
|
|
+.el-button:focus,
|
|
|
|
+.el-button:hover {
|
|
|
|
+ color: #fff !important;
|
|
|
|
+}
|
|
|
|
+.el-form-item /deep/ .el-form-item__content /deep/ .el-form-item__error {
|
|
|
|
+ left: 12%;
|
|
|
|
+}
|
|
|
|
+.el-form-item
|
|
|
|
+ /deep/
|
|
|
|
+ .el-form-item__content
|
|
|
|
+ /deep/
|
|
|
|
+ .is-disabled
|
|
|
|
+ .el-input__inner {
|
|
|
|
+ color: #000;
|
|
|
|
+}
|
|
|
|
+</style>
|