|
@@ -107,413 +107,412 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
|
-import { Vue, Component, Watch } from 'vue-property-decorator'
|
|
|
-import { userFirstLogin, getMsgCode } from '@/api/user'
|
|
|
-import { changePassword } from '@/api/base'
|
|
|
-import { regNewPassword } from '@/utils/reg'
|
|
|
-import { ElForm } from 'element-ui/types/form'
|
|
|
-const sha1Hex = require('sha1-hex')
|
|
|
-const defaultPwd = '000000'
|
|
|
-import { sysTitle } from '@/settings'
|
|
|
+ import { Vue, Component, Watch } from 'vue-property-decorator'
|
|
|
+ import { userFirstLogin, getMsgCode } from '@/api/user'
|
|
|
+ import { changePassword } from '@/api/base'
|
|
|
+ import { regNewPassword } from '@/utils/reg'
|
|
|
+ import { ElForm } from 'element-ui/types/form'
|
|
|
+ const sha1Hex = require('sha1-hex')
|
|
|
+ const defaultPwd = '000000'
|
|
|
+ import { sysTitle } from '@/settings'
|
|
|
|
|
|
-import { getUserMenu } from '@/api/user'
|
|
|
-@Component
|
|
|
-export default class Login extends Vue {
|
|
|
- name = 'Login'
|
|
|
- url = '@/assets/images/login/logo.png'
|
|
|
- title = sysTitle
|
|
|
- loginForm = {
|
|
|
- username: '',
|
|
|
- password: '',
|
|
|
- msg: ''
|
|
|
- }
|
|
|
- btnTitle = '发送验证码'
|
|
|
- btnDisabled = false
|
|
|
- time = 60
|
|
|
- loginRules = {
|
|
|
- username: [{ required: true, trigger: 'blur', message: '请输入账号' }],
|
|
|
- password: [{ required: true, trigger: 'blur', message: '请输入密码' }],
|
|
|
- msg: [{ required: true, trigger: 'blur', message: '请输入短信验证码' }]
|
|
|
- }
|
|
|
- loading = false
|
|
|
- passwordType = 'password'
|
|
|
- redirect = undefined
|
|
|
- error = 1
|
|
|
- // warning: true,
|
|
|
- msg = ''
|
|
|
- passwordDialog = false // 重置密码用弹窗显隐控制
|
|
|
- changePwd = {
|
|
|
- pass: '', // 重置密码用新密码
|
|
|
- checkPass: '' // 重置密码用确认密码
|
|
|
- }
|
|
|
- pwdRules = {}
|
|
|
- userId = ''
|
|
|
- /**是否从mydesk跳转 */
|
|
|
- isMydesk = true
|
|
|
- mydeskUrl = 'https://uac.ctg.com.cn/sso/login'
|
|
|
- get sysTitle() {
|
|
|
- return this.$store.state.settings.sysTitle
|
|
|
- }
|
|
|
- /**mydesk登录验证 */
|
|
|
- beforeMount() {
|
|
|
- const search = window.location.hash.split('?')[1]
|
|
|
- const SYS_ADDR = location.href.replace(/\#\/login.*$/, '')
|
|
|
- if (search) {
|
|
|
- const typeIndex = search.indexOf('type')
|
|
|
- const tokenIndex = search.indexOf('token')
|
|
|
- const rtype = this.getSearchString('type', search)
|
|
|
- if (typeIndex > -1 && rtype === 'mydesk') {
|
|
|
- this.isMydesk = false
|
|
|
- }
|
|
|
- if (typeIndex > -1 && tokenIndex === -1) {
|
|
|
- if (rtype === 'mydesk') {
|
|
|
- const url=SYS_ADDR + '#/login?type=mydesk';
|
|
|
- window.location.href = this.mydeskUrl + '?url=' + encodeURIComponent(url)
|
|
|
- }
|
|
|
- } else if (typeIndex > -1 && tokenIndex > -1) {
|
|
|
-
|
|
|
- const token = this.getSearchString('token', search)
|
|
|
- this.loginWithTokenCheck(token)
|
|
|
- return
|
|
|
- }
|
|
|
+ import { getUserMenu } from '@/api/user'
|
|
|
+ @Component
|
|
|
+ export default class Login extends Vue {
|
|
|
+ name = 'Login'
|
|
|
+ url = '@/assets/images/login/logo.png'
|
|
|
+ title = sysTitle
|
|
|
+ loginForm = {
|
|
|
+ username: '',
|
|
|
+ password: '',
|
|
|
+ msg: ''
|
|
|
}
|
|
|
- }
|
|
|
- mounted() {
|
|
|
- this.pwdRules = {
|
|
|
- pass: [{ required: true, validator: this.validatePwd1st, trigger: 'blur' }],
|
|
|
- checkPass: [{ required: true, validator: this.validatePwd2nd, trigger: 'blur' }]
|
|
|
+ btnTitle = '发送验证码'
|
|
|
+ btnDisabled = false
|
|
|
+ time = 60
|
|
|
+ loginRules = {
|
|
|
+ username: [{ required: true, trigger: 'blur', message: '请输入账号' }],
|
|
|
+ password: [{ required: true, trigger: 'blur', message: '请输入密码' }],
|
|
|
+ msg: [{ required: true, trigger: 'blur', message: '请输入短信验证码' }]
|
|
|
}
|
|
|
- }
|
|
|
- getSearchString(key, Url) {
|
|
|
- var str = Url
|
|
|
- //str = str.substring(1, str.length) // 获取URL中?之后的字符(去掉第一位的问号)
|
|
|
- // 以&分隔字符串,获得类似name=xiaoli这样的元素数组
|
|
|
- var arr = str.split('&')
|
|
|
- var obj = new Object()
|
|
|
- // 将每一个数组元素以=分隔并赋给obj对象
|
|
|
- for (var i = 0; i < arr.length; i++) {
|
|
|
- var tmp_arr = arr[i].split('=')
|
|
|
- obj[decodeURIComponent(tmp_arr[0])] = decodeURIComponent(tmp_arr[1])
|
|
|
+ loading = false
|
|
|
+ passwordType = 'password'
|
|
|
+ redirect = undefined
|
|
|
+ error = 1
|
|
|
+ // warning: true,
|
|
|
+ msg = ''
|
|
|
+ passwordDialog = false // 重置密码用弹窗显隐控制
|
|
|
+ changePwd = {
|
|
|
+ pass: '', // 重置密码用新密码
|
|
|
+ checkPass: '' // 重置密码用确认密码
|
|
|
}
|
|
|
- return obj[key]
|
|
|
- }
|
|
|
- /**
|
|
|
- * 根据mydesk token登录
|
|
|
- * @param {*} token
|
|
|
- */
|
|
|
- loginWithTokenCheck(token) {
|
|
|
- this.$store.dispatch('user/mydeskLogin', { token: token }).then((result) => {
|
|
|
- setTimeout(() => {
|
|
|
- //this.$router.push({ path: '/prjSelection' })
|
|
|
- this.$router.push({ path: '/' })
|
|
|
- }, 0)
|
|
|
- })
|
|
|
- }
|
|
|
- validatePwd1st(rule, value, callback) {
|
|
|
- if (value === '') {
|
|
|
- callback(new Error('请输入密码!'))
|
|
|
- } else {
|
|
|
- if (this.changePwd.pass !== '') {
|
|
|
- if (!regNewPassword().test(value)) {
|
|
|
- callback(new Error('密码位数至少12位,必须包含大小写字母和数字,不可包含非法字符!'))
|
|
|
+ pwdRules = {}
|
|
|
+ userId = ''
|
|
|
+ /**是否从mydesk跳转 */
|
|
|
+ isMydesk = true
|
|
|
+ mydeskUrl = 'https://uac.ctg.com.cn/sso/login'
|
|
|
+ get sysTitle() {
|
|
|
+ return this.$store.state.settings.sysTitle
|
|
|
+ }
|
|
|
+ /**mydesk登录验证 */
|
|
|
+ beforeMount() {
|
|
|
+ const search = window.location.hash.split('?')[1]
|
|
|
+ const SYS_ADDR = location.href.replace(/\#\/login.*$/, '')
|
|
|
+ if (search) {
|
|
|
+ const typeIndex = search.indexOf('type')
|
|
|
+ const tokenIndex = search.indexOf('token')
|
|
|
+ const rtype = this.getSearchString('type', search)
|
|
|
+ if (typeIndex > -1 && rtype === 'mydesk') {
|
|
|
+ this.isMydesk = false
|
|
|
+ }
|
|
|
+ if (typeIndex > -1 && tokenIndex === -1) {
|
|
|
+ if (rtype === 'mydesk') {
|
|
|
+ const url = SYS_ADDR + '#/login?type=mydesk'
|
|
|
+ window.location.href = this.mydeskUrl + '?url=' + encodeURIComponent(url)
|
|
|
+ }
|
|
|
+ } else if (typeIndex > -1 && tokenIndex > -1) {
|
|
|
+ const token = this.getSearchString('token', search)
|
|
|
+ this.loginWithTokenCheck(token)
|
|
|
return
|
|
|
}
|
|
|
}
|
|
|
- callback()
|
|
|
}
|
|
|
- }
|
|
|
- validatePwd2nd(rule, value, callback) {
|
|
|
- if (value === '') {
|
|
|
- callback(new Error('请再次输入密码'))
|
|
|
- } else if (value !== this.changePwd.pass && value !== '') {
|
|
|
- callback(new Error('两次输入密码不一致!'))
|
|
|
- } else {
|
|
|
- callback()
|
|
|
+ mounted() {
|
|
|
+ this.pwdRules = {
|
|
|
+ pass: [{ required: true, validator: this.validatePwd1st, trigger: 'blur' }],
|
|
|
+ checkPass: [{ required: true, validator: this.validatePwd2nd, trigger: 'blur' }]
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
- @Watch('$route', { immediate: true })
|
|
|
- changeValue(route, oldvalue) {
|
|
|
- this.redirect = route.query && route.query.redirect
|
|
|
- }
|
|
|
- // 是否显示密码
|
|
|
- showPwd() {
|
|
|
- if (this.passwordType === 'password') {
|
|
|
- this.passwordType = 'text'
|
|
|
- } else {
|
|
|
- this.passwordType = 'password'
|
|
|
+ getSearchString(key, Url) {
|
|
|
+ var str = Url
|
|
|
+ //str = str.substring(1, str.length) // 获取URL中?之后的字符(去掉第一位的问号)
|
|
|
+ // 以&分隔字符串,获得类似name=xiaoli这样的元素数组
|
|
|
+ var arr = str.split('&')
|
|
|
+ var obj = new Object()
|
|
|
+ // 将每一个数组元素以=分隔并赋给obj对象
|
|
|
+ for (var i = 0; i < arr.length; i++) {
|
|
|
+ var tmp_arr = arr[i].split('=')
|
|
|
+ obj[decodeURIComponent(tmp_arr[0])] = decodeURIComponent(tmp_arr[1])
|
|
|
+ }
|
|
|
+ return obj[key]
|
|
|
}
|
|
|
- this.$nextTick(() => {
|
|
|
- ;(this.$refs.password as HTMLElement).focus()
|
|
|
- })
|
|
|
- }
|
|
|
- // 登录
|
|
|
- handleLogin() {
|
|
|
- ;(this.$refs.loginForm as ElForm).validate((valid) => {
|
|
|
- // console.log('111222', this.loginForm)
|
|
|
- if (valid) {
|
|
|
- this.loading = true
|
|
|
- /**
|
|
|
- * 最短6位,最长16位 {6,16}
|
|
|
- * 必须包含1个数字
|
|
|
- * 必须包含2个小写字母
|
|
|
- * 必须包含2个大写字母
|
|
|
- * 必须包含1个特殊字符
|
|
|
- */
|
|
|
- // const pattern = /^.*(?=.{6,16})(?=.*\d)(?=.*[A-Z]{2,})(?=.*[a-z]{2,})(?=.*[!@#$%^&*?\(\)]).*$/
|
|
|
- /**
|
|
|
- * 最短6位,最长16位 {8,30}
|
|
|
- * 必须包含1个数字
|
|
|
- * 必须包含1个小写字母
|
|
|
- * 必须包含1个大写字母
|
|
|
- * 不必须包含1个特殊字符
|
|
|
- */
|
|
|
- // const pattern = /^.*(?=.{8,30})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*?\(\)]?).*$/
|
|
|
-
|
|
|
- this.$store
|
|
|
- .dispatch('user/login', this.loginForm)
|
|
|
- .then((res) => {
|
|
|
- const { id } = res.result
|
|
|
- // 判断是否首次登录或者重置过密码
|
|
|
- userFirstLogin(id)
|
|
|
- .then((res) => {
|
|
|
- console.log(res)
|
|
|
- // 先判断用户是否被禁用了 如果是申请的用户 还需要要判断是否同意申请了
|
|
|
- const { auditstatus, enableFlag } = res.result
|
|
|
- if (enableFlag === '0') {
|
|
|
- this.$message({
|
|
|
- message: '用户已被禁用,请先启用!',
|
|
|
- type: 'error'
|
|
|
- })
|
|
|
- this.loading = false
|
|
|
- sessionStorage.clear()
|
|
|
- return
|
|
|
- }
|
|
|
- if (auditstatus !== '2' && auditstatus !== null) {
|
|
|
- this.$message({
|
|
|
- message: auditstatus === 1 ? '账户还未审核通过!' : '账户审核未被通过!',
|
|
|
- type: 'error'
|
|
|
- })
|
|
|
- this.loading = false
|
|
|
- sessionStorage.clear()
|
|
|
- return
|
|
|
- }
|
|
|
- // 是首次登录 打开弹窗 修改密码
|
|
|
- if (res.result.firstlog === '1' && this.loginForm.password === defaultPwd) {
|
|
|
- this.userId = id
|
|
|
- this.passwordDialog = true
|
|
|
- // 清除掉用户id 防止用户没有修改密码刷新进入页面
|
|
|
- sessionStorage.removeItem('userId')
|
|
|
- this.$store.state.user.userId = undefined
|
|
|
- } else {
|
|
|
- this.loading = false
|
|
|
- setTimeout(() => {
|
|
|
- // this.$router.push({ path: '/prjSelection' })
|
|
|
- this.$router.push({ path: '/' })
|
|
|
- }, 0)
|
|
|
- }
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- sessionStorage.clear()
|
|
|
- this.loading = false
|
|
|
- })
|
|
|
- // this.$router.push({ path: '/' })
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- this.loading = false
|
|
|
- })
|
|
|
+ /**
|
|
|
+ * 根据mydesk token登录
|
|
|
+ * @param {*} token
|
|
|
+ */
|
|
|
+ loginWithTokenCheck(token) {
|
|
|
+ this.$store.dispatch('user/mydeskLogin', { token: token }).then((result) => {
|
|
|
+ setTimeout(() => {
|
|
|
+ //this.$router.push({ path: '/prjSelection' })
|
|
|
+ this.$router.push({ path: '/' })
|
|
|
+ }, 0)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ validatePwd1st(rule, value, callback) {
|
|
|
+ if (value === '') {
|
|
|
+ callback(new Error('请输入密码!'))
|
|
|
} else {
|
|
|
- console.log('error submit!!')
|
|
|
- return false
|
|
|
+ if (this.changePwd.pass !== '') {
|
|
|
+ if (!regNewPassword().test(value)) {
|
|
|
+ callback(new Error('密码位数至少12位,必须包含大小写字母和数字,不可包含非法字符!'))
|
|
|
+ return
|
|
|
+ }
|
|
|
+ }
|
|
|
+ callback()
|
|
|
}
|
|
|
- // this.$router.push('/dashboard')
|
|
|
- })
|
|
|
- }
|
|
|
- //发送验证码
|
|
|
- sendMsg() {
|
|
|
- if (this.loginForm.username === '' && this.loginForm.password === '') {
|
|
|
- this.$message.error('请输入账号')
|
|
|
- return
|
|
|
}
|
|
|
- let timer = setInterval(() => {
|
|
|
- this.time--
|
|
|
- this.btnDisabled = true
|
|
|
- this.btnTitle = `${this.time}s后重新发送`
|
|
|
- if (this.time === 0) {
|
|
|
- this.time = 60
|
|
|
- this.btnDisabled = false
|
|
|
- this.btnTitle = '发送验证码'
|
|
|
- clearInterval(timer)
|
|
|
+ validatePwd2nd(rule, value, callback) {
|
|
|
+ if (value === '') {
|
|
|
+ callback(new Error('请再次输入密码'))
|
|
|
+ } else if (value !== this.changePwd.pass && value !== '') {
|
|
|
+ callback(new Error('两次输入密码不一致!'))
|
|
|
+ } else {
|
|
|
+ callback()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ @Watch('$route', { immediate: true })
|
|
|
+ changeValue(route, oldvalue) {
|
|
|
+ this.redirect = route.query && route.query.redirect
|
|
|
+ }
|
|
|
+ // 是否显示密码
|
|
|
+ showPwd() {
|
|
|
+ if (this.passwordType === 'password') {
|
|
|
+ this.passwordType = 'text'
|
|
|
+ } else {
|
|
|
+ this.passwordType = 'password'
|
|
|
}
|
|
|
- }, 1000)
|
|
|
- getMsgCode({ username: this.loginForm.username })
|
|
|
- .then((result) => {
|
|
|
- this.$message.success(result.result)
|
|
|
- })
|
|
|
- .catch((error) => {
|
|
|
- console.log(error)
|
|
|
- })
|
|
|
- }
|
|
|
- // 修改密码弹窗
|
|
|
- handleDialogBtnClick(type) {
|
|
|
- if (type === 'cancel') {
|
|
|
this.$nextTick(() => {
|
|
|
- ;(this.$refs.changePwdForm as ElForm).resetFields()
|
|
|
+ ;(this.$refs.password as HTMLElement).focus()
|
|
|
})
|
|
|
- this.passwordDialog = false
|
|
|
- this.changePwd.pass = ''
|
|
|
- this.changePwd.checkPass = ''
|
|
|
- sessionStorage.clear()
|
|
|
- this.loading = false
|
|
|
- } else {
|
|
|
- ;(this.$refs.changePwdForm as ElForm).validate((valid) => {
|
|
|
+ }
|
|
|
+ // 登录
|
|
|
+ handleLogin() {
|
|
|
+ ;(this.$refs.loginForm as ElForm).validate((valid) => {
|
|
|
+ // console.log('111222', this.loginForm)
|
|
|
if (valid) {
|
|
|
- const data = {
|
|
|
- originalPassword: sha1Hex(defaultPwd),
|
|
|
- id: this.userId,
|
|
|
- firstlog: 0,
|
|
|
- password: sha1Hex(this.changePwd.checkPass)
|
|
|
- }
|
|
|
- changePassword(data).then((res) => {
|
|
|
- if (res.code !== -1) {
|
|
|
- this.$message({
|
|
|
- message: '密码修改成功,请您重新登录!',
|
|
|
- type: 'success'
|
|
|
- })
|
|
|
- this.passwordDialog = false
|
|
|
- this.loading = false
|
|
|
- this.changePwd.pass = ''
|
|
|
- this.changePwd.checkPass = ''
|
|
|
- this.loginForm.password = ''
|
|
|
- sessionStorage.clear()
|
|
|
- } else {
|
|
|
- this.$nextTick(() => {
|
|
|
- ;(this.$refs.changePwdForm as ElForm).resetFields()
|
|
|
- })
|
|
|
- this.passwordDialog = false
|
|
|
- this.loading = false
|
|
|
- this.changePwd.pass = ''
|
|
|
- this.changePwd.checkPass = ''
|
|
|
- sessionStorage.clear()
|
|
|
+ this.loading = true
|
|
|
+ /**
|
|
|
+ * 最短6位,最长16位 {6,16}
|
|
|
+ * 必须包含1个数字
|
|
|
+ * 必须包含2个小写字母
|
|
|
+ * 必须包含2个大写字母
|
|
|
+ * 必须包含1个特殊字符
|
|
|
+ */
|
|
|
+ // const pattern = /^.*(?=.{6,16})(?=.*\d)(?=.*[A-Z]{2,})(?=.*[a-z]{2,})(?=.*[!@#$%^&*?\(\)]).*$/
|
|
|
+ /**
|
|
|
+ * 最短6位,最长16位 {8,30}
|
|
|
+ * 必须包含1个数字
|
|
|
+ * 必须包含1个小写字母
|
|
|
+ * 必须包含1个大写字母
|
|
|
+ * 不必须包含1个特殊字符
|
|
|
+ */
|
|
|
+ // const pattern = /^.*(?=.{8,30})(?=.*\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*?\(\)]?).*$/
|
|
|
|
|
|
- this.$message({
|
|
|
- message: res.message,
|
|
|
- type: 'error'
|
|
|
- })
|
|
|
- }
|
|
|
- })
|
|
|
- } else return false
|
|
|
+ this.$store
|
|
|
+ .dispatch('user/login', this.loginForm)
|
|
|
+ .then((res) => {
|
|
|
+ const { id } = res.result
|
|
|
+ // 判断是否首次登录或者重置过密码
|
|
|
+ userFirstLogin(id)
|
|
|
+ .then((res) => {
|
|
|
+ console.log(res)
|
|
|
+ // 先判断用户是否被禁用了 如果是申请的用户 还需要要判断是否同意申请了
|
|
|
+ const { auditstatus, enableFlag } = res.result
|
|
|
+ if (enableFlag === '0') {
|
|
|
+ this.$message({
|
|
|
+ message: '用户已被禁用,请先启用!',
|
|
|
+ type: 'error'
|
|
|
+ })
|
|
|
+ this.loading = false
|
|
|
+ sessionStorage.clear()
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (auditstatus !== '2' && auditstatus !== null) {
|
|
|
+ this.$message({
|
|
|
+ message: auditstatus === 1 ? '账户还未审核通过!' : '账户审核未被通过!',
|
|
|
+ type: 'error'
|
|
|
+ })
|
|
|
+ this.loading = false
|
|
|
+ sessionStorage.clear()
|
|
|
+ return
|
|
|
+ }
|
|
|
+ // 是首次登录 打开弹窗 修改密码
|
|
|
+ if (res.result.firstlog === '1' && this.loginForm.password === defaultPwd) {
|
|
|
+ this.userId = id
|
|
|
+ this.passwordDialog = true
|
|
|
+ // 清除掉用户id 防止用户没有修改密码刷新进入页面
|
|
|
+ sessionStorage.removeItem('userId')
|
|
|
+ this.$store.state.user.userId = undefined
|
|
|
+ } else {
|
|
|
+ this.loading = false
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$router.push({ path: '/prjSelection' })
|
|
|
+ // this.$router.push({ path: '/' })
|
|
|
+ }, 0)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ sessionStorage.clear()
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ // this.$router.push({ path: '/' })
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.loading = false
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ console.log('error submit!!')
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ // this.$router.push('/dashboard')
|
|
|
})
|
|
|
}
|
|
|
+ //发送验证码
|
|
|
+ sendMsg() {
|
|
|
+ if (this.loginForm.username === '' && this.loginForm.password === '') {
|
|
|
+ this.$message.error('请输入账号')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let timer = setInterval(() => {
|
|
|
+ this.time--
|
|
|
+ this.btnDisabled = true
|
|
|
+ this.btnTitle = `${this.time}s后重新发送`
|
|
|
+ if (this.time === 0) {
|
|
|
+ this.time = 60
|
|
|
+ this.btnDisabled = false
|
|
|
+ this.btnTitle = '发送验证码'
|
|
|
+ clearInterval(timer)
|
|
|
+ }
|
|
|
+ }, 1000)
|
|
|
+ getMsgCode({ username: this.loginForm.username })
|
|
|
+ .then((result) => {
|
|
|
+ this.$message.success(result.result)
|
|
|
+ })
|
|
|
+ .catch((error) => {
|
|
|
+ console.log(error)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 修改密码弹窗
|
|
|
+ handleDialogBtnClick(type) {
|
|
|
+ if (type === 'cancel') {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ ;(this.$refs.changePwdForm as ElForm).resetFields()
|
|
|
+ })
|
|
|
+ this.passwordDialog = false
|
|
|
+ this.changePwd.pass = ''
|
|
|
+ this.changePwd.checkPass = ''
|
|
|
+ sessionStorage.clear()
|
|
|
+ this.loading = false
|
|
|
+ } else {
|
|
|
+ ;(this.$refs.changePwdForm as ElForm).validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ const data = {
|
|
|
+ originalPassword: sha1Hex(defaultPwd),
|
|
|
+ id: this.userId,
|
|
|
+ firstlog: 0,
|
|
|
+ password: sha1Hex(this.changePwd.checkPass)
|
|
|
+ }
|
|
|
+ changePassword(data).then((res) => {
|
|
|
+ if (res.code !== -1) {
|
|
|
+ this.$message({
|
|
|
+ message: '密码修改成功,请您重新登录!',
|
|
|
+ type: 'success'
|
|
|
+ })
|
|
|
+ this.passwordDialog = false
|
|
|
+ this.loading = false
|
|
|
+ this.changePwd.pass = ''
|
|
|
+ this.changePwd.checkPass = ''
|
|
|
+ this.loginForm.password = ''
|
|
|
+ sessionStorage.clear()
|
|
|
+ } else {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ ;(this.$refs.changePwdForm as ElForm).resetFields()
|
|
|
+ })
|
|
|
+ this.passwordDialog = false
|
|
|
+ this.loading = false
|
|
|
+ this.changePwd.pass = ''
|
|
|
+ this.changePwd.checkPass = ''
|
|
|
+ sessionStorage.clear()
|
|
|
+
|
|
|
+ this.$message({
|
|
|
+ message: res.message,
|
|
|
+ type: 'error'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else return false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
-}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-.login-container {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- background: url('./images/background.png') no-repeat fixed center/100%;
|
|
|
- background-size: cover;
|
|
|
- .company-name {
|
|
|
- position: absolute;
|
|
|
- font-size: 40px;
|
|
|
- color: white;
|
|
|
- font-weight: 500;
|
|
|
- letter-spacing: 4px;
|
|
|
+ .login-container {
|
|
|
width: 100%;
|
|
|
- text-align: center;
|
|
|
- top: calc((100% - 534px) / 2);
|
|
|
- -webkit-box-reflect: below 1px -webkit-gradient(linear, 0 0, 0 50%, from(transparent), color-stop(0.2, transparent), to(rgba(3, 3, 3, 0.1)));
|
|
|
- }
|
|
|
- img {
|
|
|
- user-select: none;
|
|
|
height: 100%;
|
|
|
- }
|
|
|
- .fill-container {
|
|
|
- position: relative;
|
|
|
- width: 926px;
|
|
|
- height: 434px;
|
|
|
- border-radius: 10px;
|
|
|
- background-color: rgb(228, 242, 255);
|
|
|
- left: calc((100% - 926px) / 2);
|
|
|
- top: calc((100% - 334px) / 2);
|
|
|
- .left {
|
|
|
- position: relative;
|
|
|
- float: left;
|
|
|
- width: 538px;
|
|
|
- overflow: hidden;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ background: url('./images/background.png') no-repeat fixed center/100%;
|
|
|
+ background-size: cover;
|
|
|
+ .company-name {
|
|
|
+ position: absolute;
|
|
|
+ font-size: 40px;
|
|
|
+ color: white;
|
|
|
+ font-weight: 500;
|
|
|
+ letter-spacing: 4px;
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ top: calc((100% - 534px) / 2);
|
|
|
+ -webkit-box-reflect: below 1px -webkit-gradient(linear, 0 0, 0 50%, from(transparent), color-stop(0.2, transparent), to(rgba(3, 3, 3, 0.1)));
|
|
|
}
|
|
|
- .right {
|
|
|
- width: 388px;
|
|
|
- width: 388px;
|
|
|
+ img {
|
|
|
+ user-select: none;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ .fill-container {
|
|
|
position: relative;
|
|
|
- float: left;
|
|
|
- .top {
|
|
|
- font-size: 25px;
|
|
|
- font-weight: 700;
|
|
|
- color: rgb(45, 116, 231);
|
|
|
- text-align: center;
|
|
|
- width: 100%;
|
|
|
- top: 50px;
|
|
|
+ width: 926px;
|
|
|
+ height: 434px;
|
|
|
+ border-radius: 10px;
|
|
|
+ background-color: rgb(228, 242, 255);
|
|
|
+ left: calc((100% - 926px) / 2);
|
|
|
+ top: calc((100% - 334px) / 2);
|
|
|
+ .left {
|
|
|
position: relative;
|
|
|
float: left;
|
|
|
- > span {
|
|
|
- line-height: 30px;
|
|
|
- &:nth-of-type(2) {
|
|
|
- margin-top: 16px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- /deep/ input.el-input__inner {
|
|
|
- padding-left: 40px !important;
|
|
|
+ width: 538px;
|
|
|
+ overflow: hidden;
|
|
|
}
|
|
|
- /deep/ i.el-input__icon.el-icon-user,
|
|
|
- /deep/ i.el-input__icon.el-icon-lock,
|
|
|
- /deep/ i.el-input__icon.el-icon-tickets {
|
|
|
- font-size: 20px;
|
|
|
- color: #2d74e7;
|
|
|
- top: -2.25px;
|
|
|
+ .right {
|
|
|
+ width: 388px;
|
|
|
+ width: 388px;
|
|
|
position: relative;
|
|
|
- }
|
|
|
- .middle {
|
|
|
- width: 320px;
|
|
|
- height: 106px;
|
|
|
- margin-bottom: 80px;
|
|
|
- > .form-input {
|
|
|
- height: 36px;
|
|
|
- line-height: 36px;
|
|
|
- /deep/ input {
|
|
|
- height: 36px;
|
|
|
- }
|
|
|
- &:nth-of-type(2) {
|
|
|
- margin-top: 15px;
|
|
|
+ float: left;
|
|
|
+ .top {
|
|
|
+ font-size: 25px;
|
|
|
+ font-weight: 700;
|
|
|
+ color: rgb(45, 116, 231);
|
|
|
+ text-align: center;
|
|
|
+ width: 100%;
|
|
|
+ top: 50px;
|
|
|
+ position: relative;
|
|
|
+ float: left;
|
|
|
+ > span {
|
|
|
+ line-height: 30px;
|
|
|
+ &:nth-of-type(2) {
|
|
|
+ margin-top: 16px;
|
|
|
+ }
|
|
|
}
|
|
|
- &:nth-of-type(3) {
|
|
|
- margin-top: 15px;
|
|
|
+ }
|
|
|
+ /deep/ input.el-input__inner {
|
|
|
+ padding-left: 40px !important;
|
|
|
+ }
|
|
|
+ /deep/ i.el-input__icon.el-icon-user,
|
|
|
+ /deep/ i.el-input__icon.el-icon-lock,
|
|
|
+ /deep/ i.el-input__icon.el-icon-tickets {
|
|
|
+ font-size: 20px;
|
|
|
+ color: #2d74e7;
|
|
|
+ top: -2.25px;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .middle {
|
|
|
+ width: 320px;
|
|
|
+ height: 106px;
|
|
|
+ margin-bottom: 80px;
|
|
|
+ > .form-input {
|
|
|
+ height: 36px;
|
|
|
+ line-height: 36px;
|
|
|
+ /deep/ input {
|
|
|
+ height: 36px;
|
|
|
+ }
|
|
|
+ &:nth-of-type(2) {
|
|
|
+ margin-top: 15px;
|
|
|
+ }
|
|
|
+ &:nth-of-type(3) {
|
|
|
+ margin-top: 15px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
- .login-btn {
|
|
|
- width: 320px;
|
|
|
- height: 44px;
|
|
|
- border-radius: 22px;
|
|
|
- position: relative;
|
|
|
- float: left;
|
|
|
- left: calc((100% - 320px) / 2);
|
|
|
- top: 120px;
|
|
|
- overflow: hidden;
|
|
|
- font-size: 16px;
|
|
|
- background: #2d74e7;
|
|
|
- transition: background 0.3s linear;
|
|
|
- color: #ffffff;
|
|
|
- &:hover {
|
|
|
- background: #2467d3;
|
|
|
+ .login-btn {
|
|
|
+ width: 320px;
|
|
|
+ height: 44px;
|
|
|
+ border-radius: 22px;
|
|
|
+ position: relative;
|
|
|
+ float: left;
|
|
|
+ left: calc((100% - 320px) / 2);
|
|
|
+ top: 120px;
|
|
|
+ overflow: hidden;
|
|
|
+ font-size: 16px;
|
|
|
+ background: #2d74e7;
|
|
|
+ transition: background 0.3s linear;
|
|
|
+ color: #ffffff;
|
|
|
+ &:hover {
|
|
|
+ background: #2467d3;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
</style>
|