index.vue 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916
  1. <template>
  2. <div class="x-container">
  3. <!--登录窗口-->
  4. <template v-if="!loginIsSuccess">
  5. <div class="x-login-wrap">
  6. <div class="login-tab" v-show="loginWay != 2">
  7. <span @click="toggleTab(0)" v-bind:class="{'active': loginWay === 0 }">密码登录</span>
  8. <span @click="toggleTab(3)" v-bind:class="{'active': loginWay === 3 }">短信登录</span>
  9. <span @click="ShowWechatCoe(1)" v-bind:class="{'active': loginWay === 1 }" id="weChatBtn">微信登录</span>
  10. </div>
  11. <!--账号密码登录-->
  12. <div class="x-login" v-show="loginWay === 0">
  13. <div id="form-wrap" class="x-login-form">
  14. <el-form :model="login" :rules="rules2" ref="login" class="demo-ruleForm login-form">
  15. <div style="opacity: 0; height: 0; overflow: hidden">
  16. <input type="text" name="hideUserName" id="hideUserName">
  17. <input type="password" name="hidePassword" id="hidePassword">
  18. </div>
  19. <el-form-item prop="username">
  20. <el-input type="text" v-model="login.username" auto-complete="off" placeholder="手机号/邮箱"></el-input>
  21. <i class="fa fa-user"></i>
  22. </el-form-item>
  23. <el-form-item prop="password">
  24. <el-input type="password"
  25. v-model="login.password"
  26. placeholder="密码"
  27. auto-complete="off"
  28. @keyup.enter.native="isLogin(true)"></el-input>
  29. <i class="fa fa-lock"></i>
  30. </el-form-item>
  31. <el-form-item prop="captcha" class="captcha" v-show="showCheckCode">
  32. <el-input type="text"
  33. v-model="login.captcha"
  34. auto-complete="off"
  35. class="code-input"
  36. @keyup.enter.native="isLogin(true)"></el-input>
  37. <img id="captchaImage" class="code-img" src="/sso/login/checkCode"/>
  38. <a class="code-click" @click="getCode">看不清换一张</a>
  39. </el-form-item>
  40. <el-form-item>
  41. <a class="btn login"
  42. @click="isLogin(true)"
  43. :disabled="isLoginDisabled">登录</a>
  44. </el-form-item>
  45. <el-form-item class="text-position" v-if="loginStyle.needRememberPwd">
  46. <el-checkbox v-model="checked">30天免登录</el-checkbox>
  47. </el-form-item>
  48. </el-form>
  49. <div class="link-go">
  50. <a @click="changeManage" class="first">更换管理员</a>
  51. <span class="line"></span>
  52. <a class="forget" id='forget' @click="goForgetPassword">忘记密码?</a>
  53. <span class="line"></span>
  54. <a :href="`/register/enterpriseRegistration${this.queryLink ? '?' + this.queryLink : ''}`" class="second">免费注册</a>
  55. </div>
  56. </div>
  57. </div>
  58. <!--短信快捷登录-->
  59. <div class="x-login" v-show="loginWay === 3">
  60. <div id="form-wrap1" class="x-login-form">
  61. <el-form :model="fastLogin" :rules="rules3" ref="fastLogin" class="demo-ruleForm login-form loginForm">
  62. <el-form-item prop="mobile">
  63. <el-input type="text" v-model="fastLogin.mobile" auto-complete="off" placeholder="请输入手机号"></el-input>
  64. </el-form-item>
  65. <el-form-item prop="code" class="fastMsg">
  66. <el-input type="text" v-model="fastLogin.code"
  67. auto-complete="off" placeholder="验证码"></el-input>
  68. <el-button type="primary" class="fastCode"
  69. v-show="sendLoginCode"
  70. @click="getCheckCode">获取验证码</el-button>
  71. <el-button type="primary" v-show="!sendLoginCode" class="fastCode code-send">已发送({{login_time}}s)</el-button>
  72. </el-form-item>
  73. <el-form-item>
  74. <a class="btn login"
  75. @click="fastToLogin(true)">登录</a>
  76. </el-form-item>
  77. </el-form>
  78. <div class="link-go">
  79. <a @click="changeManage" class="first">更换管理员</a>
  80. <span class="line"></span>
  81. <a :href="`/register/enterpriseRegistration${this.queryLink ? '?' + this.queryLink : ''}`" class="second">免费注册</a>
  82. </div>
  83. </div>
  84. </div>
  85. <!--微信扫码登录-->
  86. <div class="x-login scan-login" v-show="loginWay === 1">
  87. <div class="x-login-form">
  88. <div class="scan-body">
  89. <div class="img">
  90. <div id="login_container"></div>
  91. </div>
  92. </div>
  93. <div class="link-go" style="padding: 0 18px 12px 0; margin-top: 0;">
  94. <a @click="changeManage" class="first">更换管理员</a>
  95. <span class="line"></span>
  96. <a :href="`/register/enterpriseRegistration${this.queryLink ? '?' + this.queryLink : ''}`" class="second">免费注册</a>
  97. </div>
  98. </div>
  99. </div>
  100. <!--绑定账号-->
  101. <div class="x-login bind-login" v-show="loginWay === 2">
  102. <div class="x-login-form">
  103. <div class="bind-header">
  104. <span>绑定已有账号</span>
  105. <span @click="loginWay = 0">返回</span>
  106. </div>
  107. <div class="bind-body">
  108. <div class="img"><img :src="wxImg" alt=""/><div>{{wxName}}</div></div>
  109. <div>
  110. <el-form :model="bindAccount" :rules="rules4" ref="bindAccount" class="demo-ruleForm login-form">
  111. <el-form-item prop="username" style="margin: 0 auto 10px !important;">
  112. <el-input type="text"
  113. v-model="bindAccount.username"
  114. auto-complete="off"
  115. placeholder="请输入用户名、手机号或邮箱"></el-input>
  116. </el-form-item>
  117. <el-form-item prop="password" style="margin: 0 auto 10px !important;">
  118. <el-input type="password"
  119. v-model="bindAccount.password"
  120. auto-complete="new-password"
  121. placeholder="密码"
  122. @keyup.enter.native="wxBind"></el-input>
  123. </el-form-item>
  124. <el-form-item style="margin: 0 auto!important;">
  125. <a class="btn login"
  126. @click="wxBind">确定绑定已有账号</a>
  127. </el-form-item>
  128. </el-form>
  129. </div>
  130. <div class="set">还没有优软账号,直接 <a :href="`/register/enterpriseRegistration${this.$store.state.option.fullPath}&tk=${wxToken}`">创建新账号</a></div>
  131. </div>
  132. </div>
  133. </div>
  134. </div>
  135. <!--选择企业弹框-->
  136. <div>
  137. <!--<el-dialog class="dialog"-->
  138. <!--:visible.sync="dialogVisible"-->
  139. <!--size="tiny">-->
  140. <!--<div class="x-floating x-list" v-show="dialogVisible">-->
  141. <!--<div class="x-list-header">您要登录的公司是:</div>-->
  142. <!--<div class="x-list-content">-->
  143. <!--<ul class="list-unstyled" >-->
  144. <!--<template v-for="space in this.enterprise">-->
  145. <!--<li v-text="space.name" @click="chooseOneEnterprise(false, space.id)">华商龙科技有限公司</li>-->
  146. <!--</template>-->
  147. <!--</ul>-->
  148. <!--</div>-->
  149. <!--</div>-->
  150. <!--</el-dialog>-->
  151. </div>
  152. </template>
  153. <template v-else>
  154. <div class="login-success">
  155. <i class="iconfont icon-zhifuchenggong"></i>
  156. <p>登录成功</p>
  157. </div>
  158. </template>
  159. <loading v-show="isShowLoading"/>
  160. </div>
  161. </template>
  162. <script>
  163. import Loading from '~components/common/loading/Loading.vue'
  164. var wxLogin = function () {}
  165. export default {
  166. layout: 'sass',
  167. components: {
  168. Loading
  169. },
  170. data () {
  171. // 用户名密码登录
  172. var validateUsername = (rule, value, callback) => {
  173. if (value === '') {
  174. this.checkUsername = false
  175. this.showCheckCode = false
  176. } else {
  177. if (this.login.username !== '') {
  178. // 获取密码输错次数
  179. this.$http.get(`/sso/login/getPwdErrorCount`, {params: {username: this.login.username}})
  180. .then(response => {
  181. if (response.data.success) {
  182. this.showCheckCode = false
  183. let getPasswordErrorCount = response.data.content || ''
  184. if (getPasswordErrorCount >= 5) {
  185. this.$message.error('密码错误次数已达上限,今日无法登录')
  186. this.isLoginDisabled = true
  187. this.showCheckCode = false
  188. } else if (getPasswordErrorCount < 3) {
  189. this.isLoginDisabled = false
  190. this.checkUsername = true
  191. this.showCheckCode = false
  192. } else if (getPasswordErrorCount >= 3 && getPasswordErrorCount < 5) {
  193. if (getPasswordErrorCount === 3) {
  194. this.$message.error('当前已输错密码3次,若达到5次今日将无法登录')
  195. }
  196. if (getPasswordErrorCount === 4) {
  197. this.$message.error('当前已输错密码4次,若达到5次今日将无法登录')
  198. }
  199. this.isLoginDisabled = false
  200. this.checkUsername = true
  201. this.showCheckCode = true
  202. } else {
  203. this.checkUsername = false
  204. this.showCheckCode = false
  205. }
  206. } else {
  207. return Promise.reject(response.data)
  208. }
  209. }).catch(err => {
  210. this.isShowLoading = false
  211. this.$message.error(err.errMsg)
  212. })
  213. }
  214. callback()
  215. }
  216. }
  217. var validatePassword = (rule, value, callback) => {
  218. if (value === '') {
  219. this.checkPassword = false
  220. } else {
  221. if (this.login.password !== '') {
  222. this.checkPassword = true
  223. }
  224. callback()
  225. }
  226. }
  227. // 短信便捷登录
  228. var validateMobile = (rule, value, callback) => {
  229. if (value === '') {
  230. this.checkMobile = false
  231. } else {
  232. if (this.fastLogin.mobile) {
  233. this.checkMobile = true
  234. }
  235. callback()
  236. }
  237. }
  238. var validateCode = (rule, value, callback) => {
  239. if (value === '') {
  240. this.checkCode = false
  241. } else {
  242. if (this.fastLogin.code !== '') {
  243. this.checkCode = true
  244. }
  245. callback()
  246. }
  247. }
  248. // 微信扫码登录
  249. var validateWeiUsername = (rule, value, callback) => {
  250. if (value === '') {
  251. this.checkWeiUsername = false
  252. } else {
  253. if (this.bindAccount.username !== '') {
  254. this.checkWeiUsername = true
  255. }
  256. callback()
  257. }
  258. }
  259. var validateWeiPassword = (rule, value, callback) => {
  260. if (value === '') {
  261. this.checkWeiPassword = false
  262. } else {
  263. if (this.bindAccount.password !== '') {
  264. this.checkWeiPassword = true
  265. }
  266. callback()
  267. }
  268. }
  269. return {
  270. login: {
  271. username: '',
  272. password: '',
  273. captcha: '',
  274. spaceUU: ''
  275. },
  276. fastLogin: {
  277. mobile: '',
  278. code: ''
  279. },
  280. bindAccount: {
  281. username: '',
  282. password: ''
  283. },
  284. loginIsSuccess: false,
  285. loginWay: 0,
  286. checked: true,
  287. isShowLoading: false,
  288. checkUsername: false,
  289. checkPassword: false,
  290. showCheckCode: false,
  291. isLoginDisabled: false,
  292. dialogVisible: false,
  293. queryLink: '',
  294. checkMobile: false,
  295. getCodeBtnIsDisabled: true,
  296. sendLoginCode: true,
  297. login_time: 0,
  298. token: '',
  299. checkCode: false,
  300. checkWeiUsername: false,
  301. checkWeiPassword: false,
  302. wxToken: '',
  303. wxImg: '',
  304. wxName: '',
  305. wxUrl: '',
  306. // 用户名密码登录
  307. rules2: {
  308. username: [
  309. {validator: validateUsername, trigger: 'blur'}
  310. ],
  311. password: [
  312. {validator: validatePassword, trigger: 'blur'}
  313. ]
  314. },
  315. // 短信快捷登录
  316. rules3: {
  317. mobile: [
  318. {validator: validateMobile, trigger: 'blur'}
  319. ],
  320. code: [
  321. {validator: validateCode, trigger: 'blur'}
  322. ]
  323. },
  324. // 微信扫码登录
  325. rules4: {
  326. username: [
  327. {validator: validateWeiUsername, trigger: 'blur'}
  328. ],
  329. password: [
  330. {validator: validateWeiPassword, trigger: 'blur'}
  331. ]
  332. }
  333. }
  334. },
  335. mounted () {
  336. this.$nextTick(() => {
  337. this.getUrl()
  338. this.validUserName()
  339. if (this.$route.query.code) {
  340. this.wxEnterprise()
  341. }
  342. })
  343. },
  344. computed: {
  345. enterprise () {
  346. let chooseEnterprise = this.$store.state.login.chooseRegisterEnterprise.choose.data
  347. return chooseEnterprise
  348. },
  349. loginStyle () {
  350. return this.$store.state.login.loginStyle.data.content ? this.$store.state.login.loginStyle.data.content : ''
  351. }
  352. },
  353. methods: {
  354. toggleTab (type) {
  355. this.loginWay = type
  356. this.login.username = ''
  357. this.login.password = ''
  358. this.fastLogin.mobile = ''
  359. this.fastLogin.code = ''
  360. },
  361. ShowWechatCoe () {
  362. wxLogin()
  363. this.loginWay = 1
  364. },
  365. // 获取用户错误次数
  366. validUserName () {
  367. if (this.login.username) {
  368. // 获取密码输错次数
  369. this.$http.get(`/sso/login/getPwdErrorCount`, {params: {username: this.login.username}})
  370. .then(response => {
  371. if (response.data.success) {
  372. let getPasswordErrorCount = response.data.content || ''
  373. if (getPasswordErrorCount >= 5) {
  374. this.$message.error('密码错误次数已达上限,今日无法登录')
  375. this.isLoginDisabled = true
  376. this.showCheckCode = false
  377. } else if (getPasswordErrorCount < 3) {
  378. this.isLoginDisabled = false
  379. this.checkUsername = true
  380. this.showCheckCode = false
  381. } else if (getPasswordErrorCount >= 3 && getPasswordErrorCount < 5) {
  382. if (getPasswordErrorCount === 3) {
  383. this.$message.error('当前已输错密码3次,若达到5次今日将无法登录')
  384. }
  385. if (getPasswordErrorCount === 4) {
  386. this.$message.error('当前已输错密码4次,若达到5次今日将无法登录')
  387. }
  388. this.isLoginDisabled = false
  389. this.checkUsername = true
  390. this.showCheckCode = true
  391. } else {
  392. this.checkUsername = false
  393. this.showCheckCode = false
  394. }
  395. } else {
  396. return Promise.reject(response.data)
  397. }
  398. }).catch(err => {
  399. this.$message.error(err.errMsg)
  400. })
  401. }
  402. },
  403. // 更换管理员
  404. changeManage () {
  405. window.location.href = `appeals/changeManagerAppeal${this.$store.state.option.fullPath}`
  406. },
  407. // 获取url参数
  408. getUrl () {
  409. let wUrl = ''
  410. if (this.$route.query) {
  411. for (var key in this.$route.query) {
  412. if (key !== 'code' && key !== 'state' && key !== 'type') {
  413. wUrl += `${key}=${encodeURIComponent(this.$route.query[key])}&`
  414. }
  415. }
  416. }
  417. if (this.$route.query) {
  418. this.wxUrl = `${window.location.origin}?${wUrl.substr(0, wUrl.length - 1)}`
  419. } else {
  420. this.wxUrl = `${window.location.origin}`
  421. }
  422. var url = window.location.search
  423. var request = {}
  424. if (url.indexOf('?' !== -1)) {
  425. var str = url.substr(1)
  426. var strs = str.split('&')
  427. this.queryLink = str
  428. for (var i = 0; i < strs.length; i++) {
  429. request[strs[i].split('=')[0]] = decodeURI(strs[i].split('=')[1])
  430. }
  431. }
  432. this.appId = request['appId'] || ''
  433. this.returnUrl = request['returnURL'] || ''
  434. this.baseUrl = request['baseUrl'] || ''
  435. },
  436. goForgetPassword () {
  437. let url = `/reset/forgetPasswordValidationAccount${this.queryLink ? '?' + this.queryLink : ''}`
  438. document.getElementById('forget').href = url
  439. },
  440. // 获取验证码
  441. getCode () {
  442. var imgSrc = document.getElementById('captchaImage')
  443. imgSrc.setAttribute('src', '/sso/login/checkCode?timestamp=' + (new Date()).valueOf())
  444. },
  445. // 登录
  446. isLogin (flag) {
  447. this.isShowLoading = true
  448. if (!this.login.username) {
  449. this.isShowLoading = false
  450. this.$message.error('请填写账号')
  451. } else if (!this.login.password) {
  452. this.isShowLoading = false
  453. this.$message.error('请填写密码')
  454. } else {
  455. let param = new FormData()
  456. param.append('username', this.login.username)
  457. param.append('password', this.login.password)
  458. param.append('captcha', this.login.captcha)
  459. param.append('spaceUU', '1')
  460. param.append('appId', this.appId ? this.appId : '')
  461. param.append('returnUrl', this.returnUrl ? this.returnUrl : '')
  462. param.append('baseUrl', this.baseUrl ? this.baseUrl : '')
  463. param.append('maxage', this.checked ? 2592000 : '')
  464. let config = {
  465. headers: {'Content-Type': 'multipart/form-data'}
  466. }
  467. this.$http.post('/sso/login', param, config)
  468. .then(response => {
  469. this.isShowLoading = false
  470. if (response.data.success) {
  471. if (response.data.content.spaces) {
  472. // 弹框让用户选择企业
  473. this.$store.commit('login/chooseRegisterEnterprise/GET_ENTERPRISE_SUCCESS', response.data.content.spaces)
  474. this.dialogVisible = flag
  475. } else if (response.data.content.loginUrls) {
  476. // 遍历登录url循环让各应用登录(需要跨域)
  477. let param = response.data.content.data
  478. let a = ''
  479. for (let n in param) {
  480. a += (n + '=' + encodeURIComponent(param[n]) + '&')
  481. }
  482. let params = a.substr(0, a.length - 1)
  483. this.isShowLoading = true
  484. if (response.data.content.currentUrl) {
  485. console.log(response.data.content.currentUrl)
  486. let baseContent = response.data.content.currentUrl
  487. console.log(baseContent)
  488. let flag = '?'
  489. if (baseContent.indexOf('?') !== -1) {
  490. flag = '&'
  491. }
  492. this.$jsonp(`${response.data.content.currentUrl}${flag}${params}`, {
  493. name: 'successCallback',
  494. timeout: 3000
  495. }, (err, data) => {
  496. if (err) {
  497. this.$message.error('登录超时,请重试')
  498. this.isShowLoading = false
  499. throw err
  500. } else {
  501. this.loginOther(response, params)
  502. }
  503. })
  504. } else {
  505. this.loginOther(response, params, 3000)
  506. }
  507. }
  508. } else {
  509. this.$message.error(response.data)
  510. var count = response.data.errorCount
  511. if (count < 3) {
  512. this.showCheckCode = false
  513. this.isLoginDisabled = false
  514. } else if (count >= 5) {
  515. this.$message.error('密码错误次数已达上限,今日无法登录')
  516. this.isLoginDisabled = true
  517. this.showCheckCode = false
  518. } else if (count >= 3 && count < 5) {
  519. this.getCode()
  520. if (count === 3) {
  521. this.$message.error('当前已输错密码3次,若达到5次今日将无法登录')
  522. }
  523. this.showCheckCode = true
  524. this.isLoginDisabled = false
  525. }
  526. return Promise.reject(response.data)
  527. }
  528. }).catch(err => {
  529. this.isShowLoading = false
  530. let _this = this
  531. setTimeout(function () {
  532. _this.getCode()
  533. }, 100)
  534. this.$message.error(err.errMsg)
  535. })
  536. }
  537. },
  538. // 选择账套
  539. // chooseOneEnterprise (flag, spaceUU) {
  540. // this.login.spaceUU = spaceUU
  541. // this.dialogVisible = false
  542. // if (this.$route.query.code) {
  543. // this.wxEnterprise(flag)
  544. // } else {
  545. // if (this.loginWay === 0) {
  546. // this.isLogin(flag)
  547. // }
  548. // if (this.loginWay === 3) {
  549. // this.fastToLogin(flag)
  550. // }
  551. // }
  552. // },
  553. // 短信快捷登录
  554. fastToLogin (flag) {
  555. this.isShowLoading = true
  556. if (!this.fastLogin.mobile) {
  557. this.isShowLoading = false
  558. this.$message.error('请填写手机号')
  559. } else {
  560. let param = new FormData()
  561. param.append('mobile', this.fastLogin.mobile)
  562. param.append('code', this.fastLogin.code)
  563. param.append('appId', this.appId)
  564. param.append('token', this.token)
  565. param.append('spaceUU', 1)
  566. param.append('returnUrl', this.returnUrl ? this.returnUrl : '')
  567. param.append('baseUrl', this.baseUrl ? this.baseUrl : '')
  568. let config = {
  569. headers: {'Content-Type': 'multipart/form-data'}
  570. }
  571. this.$http.post('/sso/login/sms', param, config)
  572. .then(response => {
  573. this.isShowLoading = false
  574. if (response.data.success) {
  575. if (response.data.content.spaces) {
  576. // 弹框让用户选择企业
  577. this.$store.commit('login/chooseRegisterEnterprise/GET_ENTERPRISE_SUCCESS', response.data.content.spaces)
  578. this.dialogVisible = flag
  579. } else if (response.data.content.loginUrls) {
  580. // 遍历登录url循环让各应用登录(需要跨域)
  581. let param = response.data.content.data
  582. let a = ''
  583. for (let n in param) {
  584. a += (n + '=' + encodeURIComponent(param[n]) + '&')
  585. }
  586. let params = a.substr(0, a.length - 1)
  587. this.isShowLoading = true
  588. if (response.data.content.currentUrl) {
  589. this.$jsonp(`${response.data.content.currentUrl}?${params}`, {
  590. name: 'successCallback',
  591. timeout: 3000
  592. }, (err, data) => {
  593. if (err) {
  594. this.$message.error('登录超时,请重试')
  595. this.isShowLoading = false
  596. throw err
  597. } else {
  598. this.loginOther(response, params)
  599. }
  600. })
  601. } else {
  602. this.loginOther(response, params, 3000)
  603. }
  604. }
  605. } else {
  606. this.$message.error(response.data)
  607. return Promise.reject(response.data)
  608. }
  609. }).catch(err => {
  610. this.isShowLoading = false
  611. let _this = this
  612. setTimeout(function () {
  613. _this.getCode()
  614. }, 100)
  615. this.$message.error(err.errMsg)
  616. })
  617. }
  618. },
  619. getJsonp: function (url, timeout = 500) {
  620. return new Promise((resolve, reject) => {
  621. this.$jsonp(url, {
  622. name: 'successCallback',
  623. timeout: timeout
  624. }, function (err, data) {
  625. if (err) {
  626. reject(err)
  627. throw err
  628. } else {
  629. resolve(data)
  630. }
  631. })
  632. })
  633. },
  634. // crossAfter (url) {
  635. // try {
  636. // window.location.href = url
  637. // } catch (err) {
  638. // console.log(err)
  639. // }
  640. // },
  641. loginOther (response, a, timeout) {
  642. // const crossAfter = this.crossAfter
  643. let promises = []
  644. for (let i in response.data.content.loginUrls) {
  645. if (response.data.content.currentUrl !== response.data.content.loginUrls[i]) {
  646. promises.push(this.getJsonp(`${response.data.content.loginUrls[i]}?${a}`))
  647. }
  648. }
  649. Promise.all(promises).then(() => {
  650. this.loginIsSuccess = true
  651. this.isShowLoading = false
  652. // crossAfter(response.data.content.returnUrl || 'http://www.ubtob.com', timeout)
  653. }).catch(() => {
  654. this.loginIsSuccess = true
  655. this.isShowLoading = false
  656. // crossAfter(response.data.content.returnUrl || 'http://www.ubtob.com', timeout)
  657. })
  658. },
  659. getCheckCode () {
  660. this.isShowLoading = true
  661. if (!this.fastLogin.mobile) {
  662. this.isShowLoading = false
  663. this.$message.error('请先填写手机号')
  664. } else {
  665. if (this.checkMobile) {
  666. this.$http.get(`/sso/login/sendSmsCode`, {params: {mobile: this.fastLogin.mobile}})
  667. .then(response => {
  668. this.isShowLoading = false
  669. if (response.data) {
  670. if (response.data.success) {
  671. this.token = response.data.content.token
  672. this.$message({
  673. message: '验证码已经发送到您的手机,请注意查收',
  674. type: 'success'
  675. })
  676. this.sendLoginCode = false
  677. this.login_time = 60
  678. var loginTime = setInterval(() => {
  679. this.login_time--
  680. if (this.login_time <= 0) {
  681. this.sendLoginCode = true
  682. clearInterval(loginTime)
  683. }
  684. }, 1000)
  685. } else {
  686. this.$message.error(response.data.errMsg)
  687. }
  688. } else {
  689. return Promise.reject(response.data)
  690. }
  691. }).catch(err => {
  692. this.isShowLoading = false
  693. this.$message.error(err.errMsg)
  694. })
  695. } else {
  696. this.isShowLoading = false
  697. }
  698. }
  699. },
  700. // 微信判断绑定和账套选择
  701. wxEnterprise () {
  702. this.isShowLoading = true
  703. if (this.$route.query.code) {
  704. let param = new FormData()
  705. param.append('code', this.$route.query.code ? this.$route.query.code : '')
  706. param.append('type', 'wx')
  707. param.append('state', this.$route.query.state ? this.$route.query.state : '')
  708. param.append('appId', this.$route.query.appId ? this.$route.query.appId : '')
  709. param.append('returnUrl', this.$route.query.returnURL ? this.$route.query.returnURL : '')
  710. param.append('baseUrl', this.$route.query.baseUrl ? this.$route.query.baseUrl : '')
  711. param.append('spaceUU', 1)
  712. let config = {
  713. headers: {'Content-Type': 'multipart/form-data'}
  714. }
  715. this.$http.post('/sso/login/foreignLogin', param, config)
  716. .then(response => {
  717. this.isShowLoading = false
  718. if (response.data.success) {
  719. if (!response.data.content.hasRegister && response.data.content.token) {
  720. this.loginWay = 2
  721. this.wxToken = response.data.content.token
  722. this.$http.get(`/foreign/userInfo/${this.wxToken}`, {params: {token: this.wxToken}})
  723. .then(response => {
  724. if (response.data.success) {
  725. this.wxImg = response.data.content.foreignUserImg
  726. this.wxName = response.data.content.foreignUserName
  727. } else {
  728. return Promise.reject(response.data)
  729. }
  730. }).catch(err => {
  731. this.$message.error(err.errMsg)
  732. })
  733. } else if (response.data.content.spaces) {
  734. // 弹框让用户选择企业
  735. this.$store.commit('login/chooseRegisterEnterprise/GET_ENTERPRISE_SUCCESS', response.data.content.spaces)
  736. this.dialogVisible = true
  737. } else if (response.data.content.loginUrls) {
  738. // 遍历登录url循环让各应用登录(需要跨域)
  739. let param = response.data.content.data
  740. let a = ''
  741. for (let n in param) {
  742. a += (n + '=' + encodeURIComponent(param[n]) + '&')
  743. }
  744. let params = a.substr(0, a.length - 1)
  745. this.isShowLoading = true
  746. if (response.data.content.currentUrl) {
  747. this.$jsonp(`${response.data.content.currentUrl}?${params}`, {
  748. name: 'successCallback',
  749. timeout: 3000
  750. }, (err, data) => {
  751. if (err) {
  752. this.$message.error('登录超时,请重试')
  753. this.isShowLoading = false
  754. throw err
  755. } else {
  756. this.loginOther(response, params)
  757. }
  758. })
  759. } else {
  760. this.loginOther(response, params, 3000)
  761. }
  762. }
  763. } else {
  764. this.$message.error(response.data)
  765. return Promise.reject(response.data)
  766. }
  767. }).catch(err => {
  768. this.isShowLoading = false
  769. let _this = this
  770. setTimeout(function () {
  771. _this.getCode()
  772. }, 100)
  773. this.$message.error(err.errMsg)
  774. })
  775. }
  776. },
  777. // 微信扫码登录
  778. getScan () {
  779. // this.loginWay = 1
  780. this.isShowLoading = true
  781. this.$http.get('/weChat/getQrUrl', {params: {appId: this.$route.query.appId, url: this.wxUrl}})
  782. .then(response => {
  783. this.isShowLoading = false
  784. if (response.data.success) {
  785. window.location.href = response.data.content
  786. } else {
  787. return Promise.reject(response.data)
  788. }
  789. }).catch(err => {
  790. this.isShowLoading = false
  791. this.$message.error(err.errMsg)
  792. })
  793. },
  794. // 绑定企业
  795. wxBind () {
  796. this.isShowLoading = true
  797. if (!this.bindAccount.username) {
  798. this.isShowLoading = false
  799. this.$message.error('请填写账号')
  800. } else if (!this.bindAccount.password) {
  801. this.isShowLoading = false
  802. this.$message.error('请填写密码')
  803. } else {
  804. let param = new FormData()
  805. param.append('_operate', 'account')
  806. param.append('t', this.wxToken)
  807. param.append('username', this.bindAccount.username)
  808. param.append('password', this.bindAccount.password)
  809. let config = {
  810. headers: {'Content-Type': 'multipart/form-data'}
  811. }
  812. this.$http.post('/foreign/addAccount', param, config)
  813. .then(response => {
  814. this.isShowLoading = false
  815. if (response.data.success) {
  816. this.wxEnterprise()
  817. } else {
  818. return Promise.reject(response.data)
  819. }
  820. }).catch(err => {
  821. this.isShowLoading = false
  822. this.$message.error(err.errMsg)
  823. })
  824. }
  825. }
  826. }
  827. }
  828. </script>
  829. <style lang="scss" type="text/scss">
  830. .x-container {
  831. width: 346px;
  832. margin: 0 auto;
  833. text-align: center;
  834. background: #FFFFFF;
  835. box-shadow: 0 22px 24px 0 rgba(0,0,0,0.08);
  836. border-radius: 3px;
  837. .login-tab {
  838. margin-bottom: 30px;
  839. width: 100%;
  840. height: 50px;
  841. line-height: 50px;
  842. border-bottom: 1px solid #dcdcdc;
  843. span{
  844. display: inline-block;
  845. width: 30%;
  846. font-size: 16px;
  847. color: #999;
  848. cursor: pointer;
  849. &.active{
  850. color: #333;
  851. border-bottom: 2px solid #282828;
  852. }
  853. }
  854. }
  855. .x-login {
  856. width: 100%;
  857. .x-login-form {
  858. .btn.login{
  859. width: 306px;
  860. height: 34px;
  861. background: #5078cb;
  862. color: #fff;
  863. font-weight: 700;
  864. letter-spacing: 4px;
  865. border-radius: 0;
  866. }
  867. .text-position{
  868. .el-form-item__content .el-checkbox{
  869. margin-left: 0!important;
  870. }
  871. }
  872. }
  873. .link-go {
  874. position: relative;
  875. text-align: right;
  876. margin-top: 35px;
  877. padding: 0 21px 20px 0;
  878. a{
  879. margin-left: 20px;
  880. font-size: 14px;
  881. color: #999;
  882. background: 0 0;
  883. text-decoration: none;
  884. outline: 0;
  885. cursor: pointer;
  886. }
  887. span{
  888. position: absolute;
  889. top: 1px;
  890. display: inline-block;
  891. margin: 0 10px;
  892. width: 2px;
  893. height: 15px;
  894. background-color: #ddd;
  895. }
  896. }
  897. }
  898. .login-success {
  899. padding-top: 95px;
  900. width: 100%;
  901. height: 400px;
  902. margin: 0 auto;
  903. text-align: center;
  904. i{
  905. font-size: 125px;
  906. color: #22ac38;
  907. }
  908. p{
  909. margin-top: 20px;
  910. font-size: 28px;
  911. color: #333;
  912. }
  913. }
  914. }
  915. </style>