index.vue 34 KB

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