| | |
| | | <template> |
| | | <el-form class="login-form" |
| | | status-icon |
| | | :rules="loginRules" |
| | | ref="loginForm" |
| | | :model="loginForm" |
| | | label-width="0"> |
| | | <el-form-item prop="phone"> |
| | | <el-input size="small" |
| | | @keyup.enter.native="handleLogin" |
| | | v-model="loginForm.phone" |
| | | auto-complete="off" |
| | | :placeholder="$t('login.phone')"> |
| | | <i slot="prefix" |
| | | class="icon-shouji"/> |
| | | <el-form |
| | | class="login-form" |
| | | status-icon |
| | | :rules="loginRules" |
| | | ref="loginForm" |
| | | :model="loginForm" |
| | | label-width="0" |
| | | > |
| | | <el-form-item prop="username"> |
| | | <el-input |
| | | size="small" |
| | | @keyup.enter.native="handleLogin" |
| | | v-model="loginForm.username" |
| | | auto-complete="off" |
| | | :placeholder="$t('login.username')" |
| | | > |
| | | <i slot="prefix" class="icon-yonghu" /> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item prop="code"> |
| | | <el-input size="small" |
| | | @keyup.enter.native="handleLogin" |
| | | v-model="loginForm.code" |
| | | auto-complete="off" |
| | | :placeholder="$t('login.code')"> |
| | | <i slot="prefix" |
| | | class="icon-yanzhengma" |
| | | style="margin-top:6px;"/> |
| | | <template slot="append"> |
| | | <span @click="handleSend" |
| | | class="msg-text" |
| | | :class="[{display:msgKey}]">{{msgText}}</span> |
| | | </template> |
| | | <el-form-item prop="password"> |
| | | <el-input |
| | | size="small" |
| | | @keyup.enter.native="handleLogin" |
| | | v-model="loginForm.password" |
| | | auto-complete="off" |
| | | show-password |
| | | :placeholder="$t('login.password')" |
| | | > |
| | | <i slot="prefix" class="icon-mima" /> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button size="small" |
| | | type="primary" |
| | | @click.native.prevent="handleLogin" |
| | | class="login-submit">{{$t('login.submit')}}</el-button> |
| | | <el-form-item prop="password2"> |
| | | <el-input |
| | | size="small" |
| | | @keyup.enter.native="handleLogin" |
| | | v-model="loginForm.password2" |
| | | auto-complete="off" |
| | | show-password |
| | | :placeholder="$t('login.password2')" |
| | | > |
| | | <i slot="prefix" class="icon-mima" /> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item prop="sname"> |
| | | <el-input |
| | | size="small" |
| | | @keyup.enter.native="handleLogin" |
| | | v-model="loginForm.sname" |
| | | auto-complete="off" |
| | | :placeholder="$t('login.name')" |
| | | > |
| | | <i slot="prefix" class="icon-yonghu" /> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item prop="cardid"> |
| | | <el-input |
| | | size="small" |
| | | v-model="loginForm.cardid" |
| | | auto-complete="off" |
| | | :placeholder="$t('login.cardid')" |
| | | > |
| | | <i slot="prefix" class="icon-shouji" /> |
| | | </el-input> |
| | | </el-form-item> |
| | | <avue-input-tree |
| | | style="width: 580px !important" |
| | | :defaultExpandAll="loginForm.defaultFlag" |
| | | v-model="loginForm.deptid" |
| | | placeholder="请选择部门" |
| | | type="tree" |
| | | :dic="dic" |
| | | ></avue-input-tree> |
| | | <el-form-item class="z-login-submit-prv"> |
| | | <el-button |
| | | size="small" |
| | | type="primary" |
| | | @click.native.prevent="handleLogin" |
| | | class="z-login-submit" |
| | | >{{ $t("login.zc") }} |
| | | </el-button> |
| | | <el-button size="small" @click.native.prevent="gbs" class="z-login-submit" |
| | | >{{ $t("login.gb") }} |
| | | </el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </template> |
| | | |
| | | <script> |
| | | import { isvalidatemobile } from "@/util/validate"; |
| | | import { inster } from "@/api/zc/zc"; |
| | | import { ss, rs } from "@/api/system/dept"; |
| | | import { mapGetters } from "vuex"; |
| | | |
| | | export default { |
| | | name: "codelogin", |
| | | data() { |
| | | const validatePhone = (rule, value, callback) => { |
| | | if (isvalidatemobile(value)[0]) { |
| | | callback(new Error(isvalidatemobile(value)[1])); |
| | | const validatePass = (rule, value, callback) => { |
| | | if (value === "") { |
| | | callback(new Error("请输入密码")); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }; |
| | | const validateCode = (rule, value, callback) => { |
| | | if (value.length !== 4) { |
| | | callback(new Error("请输入4位数的验证码")); |
| | | const validatePass2 = (rule, value, callback) => { |
| | | if (value === "") { |
| | | callback(new Error("请再次输入密码")); |
| | | } else if (value !== this.loginForm.password) { |
| | | callback(new Error("两次输入密码不一致!")); |
| | | } else { |
| | | callback(); |
| | | } |
| | | }; |
| | | const validateIdNo = (rule, value, callback) => { |
| | | let id18 = |
| | | /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/; |
| | | let id15 = |
| | | /^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$/; |
| | | if ( |
| | | !id18.test(this.loginForm.cardid) && |
| | | !id15.test(this.loginForm.cardid) |
| | | ) { |
| | | callback(new Error("请输入正确的身份证号格式")); |
| | | } else { |
| | | callback(); |
| | | } |
| | |
| | | return { |
| | | msgText: "", |
| | | msgTime: "", |
| | | dic: [], |
| | | dicr: [], |
| | | msgKey: false, |
| | | loginForm: { |
| | | phone: "", |
| | | code: "" |
| | | cardid: "", |
| | | username: "", |
| | | sname: "", |
| | | password: "", |
| | | deptid: "", |
| | | roleid: "", |
| | | password2: "", |
| | | }, |
| | | value: "", |
| | | options: [], |
| | | loginRules: { |
| | | phone: [{ required: true, trigger: "blur", validator: validatePhone }], |
| | | code: [{ required: true, trigger: "blur", validator: validateCode }] |
| | | } |
| | | cardid: [{ required: true, trigger: "blur", validator: validateIdNo }], |
| | | password: [ |
| | | { required: true, validator: validatePass, trigger: "blur" }, |
| | | ], |
| | | password2: [ |
| | | { required: true, validator: validatePass2, trigger: "blur" }, |
| | | ], |
| | | username: [ |
| | | { required: true, message: "请输入用户名", trigger: "blur" }, |
| | | ], |
| | | }, |
| | | passwordType: "password", |
| | | passwordTypes: "password2", |
| | | }; |
| | | }, |
| | | created() { |
| | | this.msgText = this.config.MSGINIT; |
| | | this.msgTime = this.config.MSGTIME; |
| | | // defaultFlag |
| | | }, |
| | | mounted() {}, |
| | | mounted() { |
| | | var that = this; |
| | | ss().then((res) => { |
| | | console.log(that.ergodicData(res.data.data), 898989); |
| | | that.dic = that.ergodicData(res.data.data); |
| | | }); |
| | | }, |
| | | computed: { |
| | | ...mapGetters(["tagWel"]), |
| | | config() { |
| | | return { |
| | | MSGINIT: this.$t("login.msgText"), |
| | | MSGSCUCCESS: this.$t("login.msgSuccess"), |
| | | MSGTIME: 60 |
| | | MSGTIME: 60, |
| | | }; |
| | | } |
| | | }, |
| | | }, |
| | | props: [], |
| | | methods: { |
| | | ergodicData(val) { |
| | | var arr = []; |
| | | |
| | | val.forEach((item, index) => { |
| | | arr.push({ |
| | | label: item.title, |
| | | value: item.value, |
| | | id: item.id, |
| | | parent_id: item.parent_id, |
| | | }); |
| | | |
| | | if (item.hasChildren == true) { |
| | | var arrOne = []; |
| | | |
| | | if (item.children && item.children.length > 0) { |
| | | item.children.forEach((childItem, childIndex) => { |
| | | arrOne.push({ |
| | | label: childItem.title, |
| | | value: childItem.value, |
| | | id: childItem.id, |
| | | parent_id: childItem.parent_id, |
| | | }); |
| | | |
| | | if (childItem.hasChildren == true) { |
| | | var arrTwo = []; |
| | | |
| | | if (childItem.children && childItem.children.length > 0) { |
| | | childItem.children.forEach((findItem, findIndex) => { |
| | | arrTwo.push({ |
| | | label: findItem.title, |
| | | value: findItem.value, |
| | | id: findItem.id, |
| | | parent_id: findItem.parent_id, |
| | | }); |
| | | }); |
| | | } |
| | | |
| | | arrOne[childIndex].children = arrTwo; |
| | | } |
| | | }); |
| | | } |
| | | |
| | | arr[index].children = arrOne; |
| | | } |
| | | }); |
| | | |
| | | return arr; |
| | | }, |
| | | |
| | | clearValidate(formName) { |
| | | this.$refs[formName].clearValidate(); |
| | | }, |
| | | async allmedia() { |
| | | ss().then((res) => { |
| | | console.log(res, 1323); |
| | | res.data.data.forEach((element) => { |
| | | this.options.push({ |
| | | deptname: element.dept_name, |
| | | deptid: element.deptid, |
| | | }); |
| | | }); |
| | | }); |
| | | }, |
| | | refreshCode(row) { |
| | | inster(row).then((res) => { |
| | | this.loginForm.cardid = ""; |
| | | this.loginForm.username = ""; |
| | | this.loginForm.sname = ""; |
| | | this.loginForm.password = ""; |
| | | this.loginForm.password2 = ""; |
| | | this.loginForm.deptid = ""; |
| | | this.loginForm.defaultFlag = false; |
| | | this.$notify({ |
| | | title: "注册成功,待审核", |
| | | type: "warning", |
| | | }); |
| | | }); |
| | | var z = document.querySelector(".z"); |
| | | z.style.display = "none"; |
| | | this.clearValidate("loginForm"); |
| | | this.clearValidate("loginForm"); |
| | | }, |
| | | gb() { |
| | | this.loginForm.cardid = ""; |
| | | this.loginForm.username = ""; |
| | | this.loginForm.sname = ""; |
| | | this.loginForm.password = ""; |
| | | this.loginForm.password2 = ""; |
| | | this.loginForm.deptid = ""; |
| | | this.loginForm.defaultFlag = false; |
| | | var zs = document.querySelector(".z"); |
| | | zs.style.display = "none"; |
| | | this.clearValidate("loginForm"); |
| | | }, |
| | | handleSend() { |
| | | if (this.msgKey) return; |
| | | this.msgText = this.msgTime + this.config.MSGSCUCCESS; |
| | |
| | | } |
| | | }, 1000); |
| | | }, |
| | | showPassword() { |
| | | this.passwordType === "" |
| | | ? (this.passwordType = "password") |
| | | : (this.passwordType = ""); |
| | | }, |
| | | showPasswords() { |
| | | this.passwordType === "" |
| | | ? (this.passwordType = "password2") |
| | | : (this.passwordType = ""); |
| | | }, |
| | | handleLogin() { |
| | | this.$refs.loginForm.validate(valid => { |
| | | this.$refs.loginForm.validate((valid) => { |
| | | if (valid) { |
| | | this.$store.dispatch("LoginByPhone", this.loginForm).then(() => { |
| | | this.$router.push({ path: this.tagWel.value }); |
| | | }); |
| | | this.refreshCode(this.loginForm); |
| | | this.message("dahsiofhiusa"); |
| | | return Promise.reject(new Error("注册成功,待审核")); |
| | | } |
| | | }); |
| | | } |
| | | } |
| | | }, |
| | | gbs() { |
| | | this.gb(); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | |
| | | text-align: center; |
| | | cursor: pointer; |
| | | } |
| | | |
| | | .msg-text.display { |
| | | color: #ccc; |
| | | } |
| | | |
| | | .z-login-submit-prv { |
| | | margin-top: 25px; |
| | | padding: 0 10%; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .z-login-submit-prv > div { |
| | | width: 80%; |
| | | display: flex; |
| | | } |
| | | |
| | | .z-login-submit { |
| | | flex: 1; |
| | | height: 45px; |
| | | border: 1px solid #409eff; |
| | | background: none; |
| | | font-size: 18px; |
| | | letter-spacing: 2px; |
| | | font-weight: 300; |
| | | color: #409eff; |
| | | cursor: pointer; |
| | | font-family: "neo"; |
| | | -webkit-transition: 0.25s; |
| | | transition: 0.25s; |
| | | } |
| | | </style> |