login.vue 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095
  1. <template>
  2. <view class="container">
  3. <view class="left-bottom-sign"></view>
  4. <view class="back-btn yticon icon-zuojiantou-up" @click="navBack"></view>
  5. <view class="right-top-sign"></view>
  6. <!-- 设置白色背景防止软键盘把下部绝对定位元素顶上来盖住输入框等 -->
  7. <view class="wrapper">
  8. <view class="left-top-sign">LOGIN</view>
  9. <view class="welcome">
  10. 欢迎回来!
  11. </view>
  12. <!-- <button v-if="!loginType" class="confirm-btn" @click="chooseLoginType('wechat')" :disabled="logining">微信快速登录(推荐)</button>
  13. <button v-if="!loginType" class="confirm-btn" @click="chooseLoginType('phone')" :disabled="logining">手机注册登录</button> -->
  14. <!-- #ifdef MP-WEIXIN -->
  15. <!-- 旧版本方式 -->
  16. <block v-if="canIUseProfile==false" >
  17. <button v-if="loginType === 'wechat'" class="confirm-btn" open-type="getUserInfo" @getuserinfo="miniWechatLogin"
  18. :disabled="logining">微信授权登录</button>
  19. </block>
  20. <!-- 新版本方式 -->
  21. <block v-else>
  22. <button v-if="loginType === 'wechat'" class="confirm-btn" @tap="miniWechatLogin"
  23. :disabled="logining" >微信授权登录</button>
  24. </block>
  25. <!-- #endif -->
  26. <!-- #ifdef APP-PLUS -->
  27. <block v-if="isApple">
  28. <button v-if="loginType === 'wechat'" class="confirm-btn" @click="wechatLogin" :disabled="logining">微信授权登录</button>
  29. <button v-if="loginType === 'wechat' && isApple && platform == 'ios' && system >= '13'" class="confirm-btn" @click="appleLogin" :disabled="logining">通过Apple登录</button>
  30. </block>
  31. <block v-else>
  32. <view class="input-content">
  33. <view class="cu-form-group">
  34. <view class="title"><text class="cuIcon-my"></text></view>
  35. <input placeholder="请输入用户名" v-model="phone" name="input" ></input>
  36. </view>
  37. <view class="cu-form-group">
  38. <view class="title"><text class="cuIcon-lock"></text></view>
  39. <input placeholder="请输入登录密码" password v-model="password" name="input" ></input>
  40. </view>
  41. <view style='padding:0;' class="cu-form-group">
  42. <view></view>
  43. <view @click='forgetpass'>忘记登录密码?</view>
  44. </view>
  45. <button style='width:100%;' @click='phonelogin' class="cu-btn bg-gradual-green">登录</button>
  46. </view>
  47. <!-- <view style=' position: fixed;bottom: 9px;width: 100%;text-align-last: center;'>
  48. <text @click="wechatLogin" class="cuIcon-weixin"></text>
  49. <image class='apple' src="https://taohaoliang.oss-cn-beijing.aliyuncs.com/tmp/apple.png" @click="appleLogin" alt=""></image>
  50. </view> -->
  51. </block>
  52. <!-- #endif -->
  53. <!-- #ifdef H5 -->
  54. <button v-if="loginType === 'wechat'" class="confirm-btn" @click="wechatH5Login" :disabled="logining">微信授权登录</button>
  55. <button v-if="loginType === 'wechat' && isApple && platform == 'ios' && system >= '13'" class="confirm-btn" @click="appleLogin" :disabled="logining">通过Apple登录</button>
  56. <!-- #endif -->
  57. <button v-if="loginType === 'phone'" class="confirm-btn" @click="toLogin" :disabled="logining">登录</button>
  58. <view v-if="loginType === 'phone'" class="forget-section">
  59. 忘记密码?
  60. </view>
  61. <!-- #ifdef MP-WEIXIN -->
  62. <div v-if="isPhone" class="alert" >
  63. <div class="auth">
  64. <div class="apply">
  65. <span class="">需要获取您的手机权限</span>
  66. <p>(请开启手机权限)</p>
  67. </div>
  68. <button class="confirm" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">确认</button>
  69. </div>
  70. </div>
  71. <!-- #endif -->
  72. <!-- #ifdef APP-PLUS -->
  73. <neil-modal
  74. :show="isPhone"
  75. @close="cancel"
  76. :style="{display:inputStatus}"
  77. title="绑定手机号"
  78. showConfirm="true"
  79. showCancel="true"
  80. @confirm="confirm"
  81. >
  82. <view class="cu-form-group">
  83. <input v-model="inputContent" style="margin:20upx;" type="mobile" placeholder="请输入手机号" />
  84. </view>
  85. <view class="cu-form-group">
  86. <view class="title">验证码</view>
  87. <input type="mobile" value="" placeholder="6位验证码" maxlength="6"
  88. data-key="verifyCode" @input="verifyCodeInput" style="width: 60%;"></input>
  89. <button class='cu-btn bg-green shadow':disabled="sendDisabled" @click="doGetVerify">{{sendText}}</button>
  90. </view>
  91. </neil-modal>
  92. <!-- #endif -->
  93. </view>
  94. <view v-if="loginType === 'phone'" class="register-section">
  95. 还没有账号?
  96. <text @click="toRegist">马上注册</text>
  97. </view>
  98. </view>
  99. </template>
  100. <script>
  101. import {
  102. mapMutations
  103. } from 'vuex';
  104. import { openFSqlite, createFSQL, selectFSQL, addFSQL } from '../../util/f.js'
  105. import { queryData, upData, initData } from '../../util/dbUtil.js'
  106. export default {
  107. data() {
  108. return {
  109. inputContent: null,
  110. loginType: "wechat",
  111. phone: '',
  112. password: '',
  113. logining: false,
  114. isPhone: false,
  115. isApple: true,
  116. accessToken:'',
  117. params:{
  118. encryptedData:'',
  119. session_key:'',
  120. iv:'',
  121. },
  122. userInfo:{
  123. nickName:'',
  124. avatarUrl:'',
  125. gender:'',
  126. phone:''
  127. },
  128. inputStatus:'none',
  129. verifyCode:null,
  130. sendText:'获取验证码',
  131. sendDisabled: false,
  132. system:'',
  133. platform:'',
  134. userData:undefined,
  135. canIUseProfile:false
  136. }
  137. },
  138. onShow() {
  139. // this.loginType = "wechat"
  140. this.$api.logout()
  141. },
  142. onLoad(options) {
  143. if( wx.getUserProfile ){
  144. console.log('--check getUserProfile--OK');
  145. this.canIUseProfile = true;
  146. }
  147. console.log("login on load")
  148. var that = this
  149. that.$api.request('user', 'sendIsApple', {
  150. }).then(res => {
  151. that.isApple = res.data
  152. })
  153. uni.getSystemInfo({
  154. success:(res) => {
  155. // console.log(res)
  156. this.system = res.system // ios
  157. this.platform = res.platform // 14.3
  158. }
  159. })
  160. },
  161. methods: {
  162. forgetpass(){
  163. uni.navigateTo({
  164. url:'/pages/public/reset'
  165. })
  166. },
  167. phonelogin(){
  168. var that=this
  169. uni.showLoading({
  170. title: '登录中',
  171. mask:true
  172. })
  173. console.log("clientid",that.clientId)
  174. this.$api.request('user', 'login',{
  175. password:that.password,
  176. phone:that.phone,
  177. cid:that.clientId
  178. }, failres => {
  179. that.$api.msg(failres.errmsg)
  180. uni.hideLoading()
  181. }).then(res => {
  182. console.log(res)
  183. uni.setStorageSync('userInfo', res.data)
  184. that.$store.commit('login', res.data)
  185. that.liangxinLogin()
  186. uni.switchTab({
  187. url: '/pages/sale/information'
  188. });
  189. uni.hideLoading()
  190. })
  191. },
  192. appleLogin(){
  193. var that=this
  194. uni.getProvider({
  195. service: 'oauth',
  196. success: function (res) {
  197. // console.log(res.provider)
  198. if(~res.provider.indexOf('apple')) {
  199. uni.login({
  200. provider: 'apple',
  201. success: loginRes => {
  202. uni.getUserInfo({
  203. provider: 'apple',
  204. success: userInfoRes => {
  205. that.$api.request('user', 'thirdPartLogin', {
  206. loginType: 4/* */,
  207. raw: JSON.stringify(userInfoRes.userInfo)
  208. }, failres => {
  209. that.$api.msg(failres.errmsg)
  210. uni.hideLoading()
  211. }).then(res => {
  212. console.log("thirdPartLogin:"+res.data.phone)
  213. that.accessToken = res.data.accessToken
  214. that.logining = false
  215. uni.getUserInfo({
  216. lang: 'zh_CN',
  217. success: (e) => {
  218. uni.setStorageSync('userInfo', res.data)
  219. that.$store.commit('login', res.data)
  220. e.userInfo.nickname = e.userInfo.nickName
  221. e.userInfo.cid = uni.getStorageSync("clientId")
  222. that.$api.request('user', 'syncUserInfo', e.userInfo).then(syncRes => {
  223. //同步过后
  224. res.data.nickname = e.userInfo.nickName
  225. res.data.avatarUrl = e.userInfo.avatarUrl
  226. res.data.gender = e.userInfo.gender
  227. if(!res.data.phone){
  228. res.data.phone = e.userInfo.phone
  229. }
  230. uni.setStorageSync('userInfo', res.data)
  231. that.$store.commit('login', res.data)
  232. })
  233. },
  234. complete: (e) => {
  235. uni.hideLoading()
  236. if(!res.data.phone||res.data.phone==""||res.data.phone ==undefined){
  237. that.isPhone = true//显示自定义的获取手机权限提示框
  238. that.inputStatus = 'inline'
  239. that.inputContent = ''
  240. }
  241. else{
  242. uni.switchTab({
  243. url: '/pages/sale/sale'
  244. });
  245. console.log("complete")
  246. }
  247. }
  248. })
  249. })
  250. console.log('获取用户信息成功'+JSON.stringify(userInfoRes))
  251. }
  252. })
  253. },
  254. fail: err => {
  255. console.log('apple登录失败' + JSON.stringify(err))
  256. uni.showToast({
  257. title:'登录失败',
  258. icon:'none'
  259. })
  260. }
  261. })
  262. }
  263. },
  264. fail: err => {
  265. uni.showToast({
  266. title:'登录失败',
  267. icon:'none'
  268. })
  269. }
  270. })
  271. },
  272. doGetVerify() {
  273. const that = this
  274. var phone = this.inputContent;
  275. if (!phone || phone.length != 11) {
  276. uni.showToast({
  277. title:'请输入正确手机号!',
  278. icon:'none'
  279. })
  280. return
  281. }
  282. that.$api.request('user', 'sendVerifyCode', {
  283. phone: phone,
  284. }).then(res => {
  285. that.sendDisabled = true
  286. let sec = 60
  287. let interval = setInterval(() => {
  288. sec--;
  289. that.sendText = sec + 's后重发'
  290. if (sec <= 0) {
  291. that.sendDisabled = false
  292. that.sendText = "获取验证码"
  293. clearInterval(interval)
  294. }
  295. }, 1000)
  296. })
  297. },
  298. verifyCodeInput(e){
  299. this.verifyCode = e.detail.value
  300. },
  301. cancel() {
  302. this.inputShow = false
  303. this.inputStatus = 'none'
  304. this.isPhone = false
  305. },
  306. confirm() {
  307. var that = this
  308. if (!this.inputContent || this.inputContent.length != 11) {
  309. uni.showToast({
  310. title:'请输入正确手机号!',
  311. icon:'none'
  312. })
  313. return
  314. }
  315. if (!this.verifyCode) {
  316. uni.showToast({
  317. title:'请输入验证码!',
  318. icon:'none'
  319. })
  320. return
  321. }
  322. this.$api.request('user', 'mergeUser', {
  323. phone: that.inputContent,
  324. verifyCode:that.verifyCode
  325. },failres => {
  326. that.$api.msg(failres.errmsg)
  327. uni.hideLoading()
  328. }).then(res => {
  329. that.accessToken = res.data.accessToken
  330. that.$api.setUserInfo(res.data)
  331. that.logining = false
  332. uni.getUserInfo({
  333. lang: 'zh_CN',
  334. success: (e) => {
  335. uni.setStorageSync('userInfo', res.data)
  336. that.$store.commit('login', res.data)
  337. e.userInfo.nickname = e.userInfo.nickName
  338. e.userInfo.cid = uni.getStorageSync("clientId")
  339. console.log(e.userInfo)
  340. that.$api.request('user', 'syncUserInfo', e.userInfo).then(syncRes => {
  341. //同步过后
  342. res.data.nickname = e.userInfo.nickName
  343. res.data.avatarUrl = e.userInfo.avatarUrl
  344. res.data.gender = e.userInfo.gender
  345. res.data.phone = e.userInfo.phone
  346. uni.setStorageSync('userInfo', res.data)
  347. that.$store.commit('login', res.data)
  348. that.liangxinLogin()
  349. })
  350. },
  351. complete: (e) => {
  352. uni.switchTab({
  353. url: '/pages/sale/information'
  354. });
  355. uni.hideLoading()
  356. that.isPhone=false
  357. uni.navigateBack()
  358. }
  359. })
  360. })
  361. },
  362. ...mapMutations(['login']),
  363. inputChange(e) {
  364. const key = e.currentTarget.dataset.key;
  365. this[key] = e.detail.value;
  366. },
  367. chooseLoginType(type) {
  368. this.loginType = type
  369. },
  370. navBack() {
  371. uni.navigateBack();
  372. },
  373. toRegist() {
  374. uni.redirectTo({
  375. url: '/pages/public/register'
  376. })
  377. },
  378. ///发起消息订阅
  379. requestSubscribe(){
  380. const that = this
  381. wx.requestSubscribeMessage({
  382. tmplIds: ['xL_uZEqJz4QP1FbnlzQWAiO2zVBn3Qeu8JwLVOU3hU0','8cVkckXi_8zfHeScXRHhjN6cgZFYYCWIMPDTiPWagXY','IE7WxBsv-fDvPWSrng-97lGWtvZf9rHuECBlhRLlWxI'],//
  383. success :(res)=>{
  384. console.log("订阅消息 成功 "+res);
  385. },
  386. fail :(errMsg) =>{
  387. console.log("订阅消息 失败 "+errMsg.errMsg);
  388. },
  389. complete:(errMsg)=>{
  390. console.log("订阅消息 完成 "+errMsg);
  391. }
  392. });
  393. },
  394. getPhoneNumber(e) {
  395. console.log(e)
  396. if (e.mp.detail.errMsg==="getPhoneNumber:ok") {
  397. this.isPhone = false
  398. this.params.iv = e.mp.detail.iv
  399. this.params.encryptedData = e.mp.detail.encryptedData
  400. this.params.session_key = this.accessToken
  401. console.log(this.params)
  402. this.getTokenAsync(this.params)
  403. }
  404. },
  405. // 请求后获取token
  406. async getTokenAsync(params) {
  407. let that = this
  408. this.$api.request('user', 'getPhoneNumber', params).then(res => {
  409. if(res.data.phoneNumber){
  410. that.userInfo.phone = res.data.phoneNumber
  411. }
  412. if(res.data.unionId){
  413. that.userInfo.unionId = res.data.unionId
  414. }
  415. that.userInfo.cid = uni.getStorageSync("clientId")
  416. console.log(that.userInfo)
  417. that.$api.request('user', 'syncUserInfo', that.userInfo).then(syncRes => {
  418. uni.setStorageSync('userInfo', that.userInfo)
  419. that.$store.commit('login', that.userInfo)
  420. that.$api.setUserInfo(that.userInfo)
  421. uni.hideLoading()
  422. that.liangxinLogin()
  423. })
  424. if(res.data.phoneNumber){
  425. uni.switchTab({
  426. url: '/pages/sale/information'
  427. });
  428. }
  429. })
  430. },
  431. async toLogin() {
  432. this.verifyCode = ''
  433. const that = this
  434. if (that.phone.length !== 11) {
  435. that.$api.msg('请输入11位中国手机号')
  436. } else if (that.password.length < 8) {
  437. that.$api.msg('密码至少8位')
  438. } else {
  439. that.logining = true;
  440. //#ifdef MP-WEIXIN
  441. //若是小程序平台,则获取到openId。整个过程是静默完成的
  442. uni.login({
  443. provider: 'weixin',
  444. success: (wxres => {
  445. that.$api.request('user', 'login', {
  446. phone: that.phone,
  447. password: that.password,
  448. loginType: 1,
  449. raw: JSON.stringify(wxres)
  450. }, failres => {
  451. that.logining = false
  452. uni.showToast({
  453. title: failres.errmsg,
  454. icon: "none"
  455. });
  456. }).then(res => {
  457. that.logining = false
  458. that.$store.commit('login', res.data)
  459. uni.setStorageSync('userInfo', res.data)
  460. if (that.$api.prePage().lodaData) {
  461. that.$api.prePage().loadData()
  462. }
  463. uni.navigateBack()
  464. })
  465. })
  466. })
  467. //#endif
  468. //#ifdef APP-PLUS || H5
  469. //若是App登录,则不需要保存OpenId。可直接登录
  470. that.$api.request('user', 'login', {
  471. phone: that.phone,
  472. password: that.password,
  473. }, failres => {
  474. that.logining = false
  475. uni.showToast({
  476. title: failres.errmsg,
  477. icon: "none"
  478. });
  479. }).then(res => {
  480. that.logining = false
  481. that.$store.commit('login', res.data)
  482. uni.setStorageSync('userInfo', res.data)
  483. if (that.$api.prePage().lodaData) {
  484. that.$api.prePage().loadData()
  485. }
  486. uni.navigateBack()
  487. })
  488. //#endif
  489. }
  490. },
  491. miniWechatLogin(e) {
  492. const that = this
  493. //旧版本方式
  494. if( this.canIUseProfile == false ){
  495. console.log("旧版本方式")
  496. //获取授权信息
  497. if(e.detail.userInfo){
  498. console.log('用户允许了授权')
  499. console.log( e.detail.userInfo ); //1.拿到基本的微信信息!!
  500. uni.showLoading({
  501. title: '加载中',
  502. mask:true
  503. })
  504. that.logining = true
  505. let loginType = 1
  506. let userInfo = e.detail.userInfo
  507. uni.login({
  508. provider: 'weixin',
  509. success: (wxres => {
  510. that.logining = false
  511. that.$api.request('user', 'thirdPartLogin', {
  512. loginType: loginType,
  513. raw: JSON.stringify(wxres)
  514. }, failres => {
  515. that.$api.msg(failres.errmsg)
  516. uni.hideLoading()
  517. }).then(res => {
  518. that.accessToken = res.data.accessToken
  519. that.$api.setUserInfo(res.data)
  520. that.userInfo = res.data
  521. uni.getUserInfo({
  522. lang: 'zh_CN',
  523. provider: 'weixin',
  524. withCredentials:true,
  525. success: (e) => {
  526. that.params.iv = e.iv
  527. that.params.encryptedData = e.encryptedData
  528. that.params.session_key = that.accessToken
  529. console.log(this.params)
  530. that.getTokenAsync(this.params)
  531. uni.setStorageSync('userInfo', res.data)
  532. that.$store.commit('login', res.data)
  533. e.userInfo.nickname = e.userInfo.nickName
  534. if(e.userInfo.phone == undefined){
  535. e.userInfo.phone = ''
  536. }
  537. e.userInfo.cid = uni.getStorageSync("clientId")
  538. console.log(e.userInfo)
  539. that.$api.request('user', 'syncUserInfo', e.userInfo).then(syncRes => {
  540. //同步过后
  541. res.data.nickname = userInfo.nickName
  542. res.data.avatarUrl = userInfo.avatarUrl
  543. res.data.gender = userInfo.gender
  544. if(userInfo.phone){
  545. res.data.phone = userInfo.phone
  546. that.liangxinLogin()
  547. }
  548. uni.setStorageSync('userInfo', res.data)
  549. that.$store.commit('login', res.data)
  550. that.$api.setUserInfo(res.data)
  551. uni.hideLoading()
  552. // uni.navigateBack()
  553. })
  554. },
  555. complete: (e) => {
  556. uni.hideLoading()
  557. if(!res.data.phone||res.data.phone==""||res.data.phone ==undefined){
  558. that.isPhone = true//显示自定义的获取手机权限提示框
  559. that.inputStatus = 'inline'
  560. that.inputContent = ''
  561. }
  562. else{
  563. uni.setStorageSync('PageCur', "sale");
  564. // uni.switchTab({
  565. // url: '/pages/sale/sale'
  566. // });
  567. uni.switchTab({
  568. url: '/pages/sale/information'
  569. });
  570. console.log("complete")
  571. }
  572. }
  573. })
  574. })
  575. }),
  576. })
  577. }
  578. //新版本方式
  579. }else{
  580. console.log("新版本方式")
  581. uni.showLoading({
  582. title: '加载中',
  583. mask:true
  584. })
  585. that.logining = true
  586. let loginType = 1
  587. wx.getUserProfile({
  588. desc : '用于完善用户资料',
  589. lang : 'zh_CN',
  590. success : function( proRes ){
  591. console.log('proRes.userInfo',proRes.userInfo)
  592. uni.login({
  593. provider: 'weixin',
  594. success: (wxres => {
  595. that.logining = false
  596. that.$api.request('user', 'thirdPartLogin', {
  597. loginType: loginType,
  598. raw: JSON.stringify(wxres)
  599. }, failres => {
  600. that.$api.msg(failres.errmsg)
  601. uni.hideLoading()
  602. }).then(res => {
  603. console.log('res+++++',res)
  604. that.accessToken = res.data.accessToken
  605. that.$api.setUserInfo(res.data)
  606. that.userInfo = res.data
  607. // that.params.iv = proRes.iv
  608. // that.params.encryptedData = proRes.encryptedData
  609. // that.params.session_key = that.accessToken
  610. // console.log(that.params)
  611. // that.getTokenAsync(that.params)
  612. uni.setStorageSync('userInfo', res.data)
  613. that.$store.commit('login', res.data)
  614. if(proRes.userInfo.phone == undefined){
  615. proRes.userInfo.phone = ''
  616. }
  617. res.data.cid = uni.getStorageSync("clientId")
  618. that.$api.request('user', 'syncUserInfo', res.data).then(syncRes => {
  619. //同步过后
  620. res.data.nickname = proRes.userInfo.nickName
  621. res.data.avatarUrl = proRes.userInfo.avatarUrl
  622. res.data.gender = proRes.userInfo.gender
  623. if(proRes.userInfo.phone){
  624. res.data.phone = proRes.userInfo.phone
  625. }
  626. uni.setStorageSync('userInfo', res.data)
  627. that.$store.commit('login', res.data)
  628. that.$api.setUserInfo(res.data)
  629. uni.hideLoading()
  630. if(!that.userInfo.phone||that.userInfo.phone==""||that.userInfo.phone ==undefined){
  631. that.isPhone = true//显示自定义的获取手机权限提示框
  632. that.inputStatus = 'inline'
  633. that.inputContent = ''
  634. }
  635. else{
  636. uni.setStorageSync('PageCur', "sale");
  637. // uni.switchTab({
  638. // url: '/pages/sale/sale'
  639. // });
  640. uni.reLaunch({
  641. url: '/pages/sale/information'
  642. });
  643. console.log("complete")
  644. that.liangxinLogin()
  645. }
  646. })
  647. console.log( 'wx.getUserProfile=>用户允许了授权' );
  648. })
  649. })
  650. })
  651. },
  652. fail : function( res ){
  653. console.log('wx.getUserProfile=>用户拒绝了授权');
  654. console.log( res );
  655. }
  656. });
  657. }
  658. // 获取用户的当前设置,判断是否点击了“总是保持以上,不在询问”
  659. // wx.getSetting({
  660. // withSubscriptions: true,//是否获取用户订阅消息的订阅状态,默认false不返回
  661. // success(res){
  662. // debugger
  663. // if(res.subscriptionsSetting.mainSwitch){
  664. // }else{
  665. // }
  666. // }
  667. // })
  668. // uni.showModal({
  669. // title: '温馨提示',
  670. // content: '为更好的与您沟通,小程序需要向您发送通知消息',
  671. // confirmText:"同意",
  672. // cancelText:"拒绝",
  673. // showCancel: false,
  674. // success: function (res) {
  675. // if (res.confirm) {
  676. // //调用订阅消息
  677. // that.requestSubscribe();
  678. // } else if (res.cancel) {
  679. // ///显示第二个弹说明一下
  680. // wx.showModal({
  681. // title: '温馨提示',
  682. // content: '拒绝后您将无法获取实时的交易、物流消息',
  683. // confirmText:"知道了",
  684. // showCancel:false,
  685. // success: function (res) {
  686. // uni.openSetting({ // 打开设置页
  687. // success(res) {
  688. // console.log(res.authSetting)
  689. // }
  690. // });
  691. // }
  692. // });
  693. // }
  694. // }
  695. // });
  696. },
  697. wechatLogin() {
  698. const that = this
  699. that.logining = true
  700. let loginType = 2
  701. uni.showLoading({
  702. title: '正在同步消息',
  703. mask:true
  704. })
  705. uni.login({
  706. provider: 'weixin',
  707. success: (wxres => {
  708. that.$api.request('user', 'thirdPartLogin', {
  709. loginType: loginType,
  710. raw: JSON.stringify(wxres)
  711. }, failres => {
  712. that.$api.msg(failres.errmsg)
  713. uni.hideLoading()
  714. }).then(res => {
  715. console.log("thirdPartLogin:"+res.data.phone)
  716. that.accessToken = res.data.accessToken
  717. that.logining = false
  718. uni.getUserInfo({
  719. lang: 'zh_CN',
  720. success: (e) => {
  721. uni.setStorageSync('userInfo', res.data)
  722. that.$store.commit('login', res.data)
  723. e.userInfo.nickname = e.userInfo.nickName
  724. e.userInfo.cid = uni.getStorageSync("clientId")
  725. console.log(e.userInfo)
  726. that.$api.request('user', 'syncUserInfo', e.userInfo).then(syncRes => {
  727. //同步过后
  728. res.data.nickname = e.userInfo.nickName
  729. res.data.avatarUrl = e.userInfo.avatarUrl
  730. res.data.gender = e.userInfo.gender
  731. if(res.data.phone){
  732. res.data.phone = e.userInfo.phone
  733. that.liangxinLogin()
  734. }
  735. uni.setStorageSync('userInfo', res.data)
  736. that.$store.commit('login', res.data)
  737. })
  738. },
  739. complete: (e) => {
  740. uni.hideLoading()
  741. if(!res.data.phone||res.data.phone==""||res.data.phone ==undefined){
  742. that.isPhone = true//显示自定义的获取手机权限提示框
  743. that.inputStatus = 'inline'
  744. that.inputContent = ''
  745. }
  746. else{
  747. // uni.switchTab({
  748. // url: '/pages/sale/sale'
  749. // });
  750. uni.switchTab({
  751. url: '/pages/sale/information'
  752. });
  753. console.log("complete")
  754. }
  755. }
  756. })
  757. })
  758. })
  759. })
  760. },
  761. wechatH5Login() {
  762. const that = this
  763. let href = window.location.origin
  764. let page = that.$api.prePage()
  765. let prePath = '/pages/index/index'
  766. if (page) {
  767. prePath = page.__page__.path
  768. }
  769. window.location = 'https://open.weixin.qq.com/connect/oauth2/authorize?'
  770. + 'appid=' + that.$api.defConfig().h5Appid + '&redirect_uri=' + escape(href) + '&response_type=code&scope=snsapi_userinfo&state=' + escape(prePath) + '#wechat_redirect'
  771. },
  772. liangxinLogin(){
  773. const that = this
  774. var userInfoTmp = uni.getStorageSync("userInfo")
  775. console.log('userInfoTmp',userInfoTmp)
  776. that.$socket.login(userInfoTmp.phone, "123456", null, res=>{
  777. console.log('粮信登录',res)
  778. if (res.success) {
  779. that.$socket.showLoginDialog = false
  780. // 缓存用户
  781. that.userData = res.response.data
  782. console.log('userData',that.userData)
  783. that.$u.vuex("userData", that.userData);
  784. // 缓存通讯录
  785. that.$socket.listGuests(that.userData.user.operId, res => {
  786. // #ifdef APP-PLUS
  787. createFSQL(that.userData.user.operId).then();
  788. let contact = res.response.data;
  789. contact.forEach(c=>{
  790. c.members.forEach(m=>{
  791. m.name = c.name;
  792. addFSQL(m, that.userData.user.operId).then();
  793. })
  794. })
  795. // #endif
  796. that.$u.vuex('firendItem', res.response.data)
  797. });
  798. // 缓存消息列表
  799. that.$socket.queryOnlineMessage(that.userData.user.operId,q =>{
  800. let data = q.response.data;
  801. for(var i in data){
  802. initData(data[i].groupMsg.list, data[i].groupInfo.chatId);
  803. }
  804. })
  805. // 缓存链接
  806. that.$socket.getLinks(that.userData.user.operId, res=>{
  807. that.$u.vuex('linkItem',res.response.data)
  808. });
  809. // // 跳转到消息列表
  810. // that.$u.route({
  811. // url: 'pages/home/home',
  812. // type: 'switchTab'
  813. // });
  814. } else {
  815. uni.showModal({
  816. title:res.reason + ",请稍后再试",
  817. showCancel:false
  818. })
  819. }
  820. });
  821. }
  822. },
  823. }
  824. </script>
  825. <style lang='scss' scoped>
  826. .apple{
  827. background: #000;
  828. width: 35px;
  829. height: 35px;
  830. padding: 8px;
  831. border-radius: 50%;
  832. vertical-align: middle;
  833. }
  834. page {
  835. background: #fff;
  836. }
  837. .cuIcon-weixin{
  838. background: #39b54a;
  839. color: #fff;
  840. font-size: 18px;
  841. padding: 9px;
  842. border-radius: 50%;
  843. vertical-align: middle;
  844. margin-right:5px;
  845. }
  846. .alert{
  847. position: fixed;
  848. top: 0;
  849. right: 0;
  850. bottom: 0;
  851. left: 0;
  852. overflow: hidden;
  853. outline: 0;
  854. -webkit-overflow-scrolling: touch;
  855. background-color: rgb(0, 0, 0);
  856. filter: alpha(opacity=60);
  857. background-color: rgba(0, 0, 0, 0.6);
  858. z-index: 9999;
  859. .auth{
  860. position: absolute;
  861. top: 50%;
  862. left: 50%;
  863. width: 80%;
  864. height: 340rpx;
  865. border-radius: 20rpx;
  866. transform:translate(-50%,-50%);
  867. background: #fff;
  868. display: flex;
  869. flex-direction: column;
  870. .apply{
  871. margin: 0rpx auto;
  872. padding: 60rpx 40rpx;
  873. flex:1;
  874. display: flex;
  875. flex-direction: column;
  876. align-items: center;
  877. justify-content: space-between;
  878. font-size: 34rpx;
  879. color:rgb(34,34,34);
  880. p{
  881. font-size:30rpx
  882. }
  883. }
  884. .confirm{
  885. border-top: 1rpx solid rgb(221,221,221);
  886. text-align: center;
  887. height: 100rpx;
  888. width: 100%;
  889. line-height: 100rpx;
  890. font-size: 34rpx;
  891. color:rgb(255,145,37);
  892. }
  893. }
  894. }
  895. .container {
  896. padding-top: 115px;
  897. position: relative;
  898. width: 100vw;
  899. height: 100vh;
  900. overflow: hidden;
  901. background: #fff;
  902. }
  903. .wrapper {
  904. position: relative;
  905. z-index: 90;
  906. background: #fff;
  907. padding-bottom: 40upx;
  908. height:100%;
  909. }
  910. .back-btn {
  911. position: absolute;
  912. left: 40upx;
  913. z-index: 9999;
  914. padding-top: var(--status-bar-height);
  915. top: 40upx;
  916. font-size: 40upx;
  917. color: $font-color-dark;
  918. }
  919. .left-top-sign {
  920. font-size: 120upx;
  921. color: $page-color-base;
  922. position: relative;
  923. left: -16upx;
  924. }
  925. .right-top-sign {
  926. position: absolute;
  927. top: 80upx;
  928. right: -30upx;
  929. z-index: 95;
  930. &:before,
  931. &:after {
  932. display: block;
  933. content: "";
  934. width: 400upx;
  935. height: 80upx;
  936. background: #b4f3e2;
  937. }
  938. &:before {
  939. transform: rotate(50deg);
  940. border-radius: 0 50px 0 0;
  941. }
  942. &:after {
  943. position: absolute;
  944. right: -198upx;
  945. top: 0;
  946. transform: rotate(-50deg);
  947. border-radius: 50px 0 0 0;
  948. /* background: pink; */
  949. }
  950. }
  951. .left-bottom-sign {
  952. position: absolute;
  953. left: -270upx;
  954. bottom: -320upx;
  955. border: 100upx solid #d0d1fd;
  956. border-radius: 50%;
  957. padding: 180upx;
  958. }
  959. .welcome {
  960. position: relative;
  961. left: 50upx;
  962. top: -90upx;
  963. font-size: 46upx;
  964. color: #555;
  965. text-shadow: 1px 0px 1px rgba(0, 0, 0, .3);
  966. }
  967. .input-content {
  968. padding: 0 60upx;
  969. }
  970. .input-item {
  971. display: flex;
  972. flex-direction: column;
  973. align-items: flex-start;
  974. justify-content: center;
  975. padding: 0 30upx;
  976. background: $page-color-light;
  977. height: 120upx;
  978. border-radius: 4px;
  979. margin-bottom: 50upx;
  980. &:last-child {
  981. margin-bottom: 0;
  982. }
  983. .tit {
  984. height: 50upx;
  985. line-height: 56upx;
  986. font-size: $font-sm+2upx;
  987. color: $font-color-base;
  988. }
  989. input {
  990. height: 60upx;
  991. font-size: $font-base + 2upx;
  992. color: $font-color-dark;
  993. width: 100%;
  994. }
  995. }
  996. .confirm-btn {
  997. width: 630upx;
  998. height: 76upx;
  999. line-height: 76upx;
  1000. border-radius: 50px;
  1001. margin-top: 70upx;
  1002. background: $uni-color-primary;
  1003. color: #fff;
  1004. font-size: $font-lg;
  1005. &:after {
  1006. border-radius: 100px;
  1007. }
  1008. }
  1009. .forget-section {
  1010. font-size: $font-sm+2upx;
  1011. color: $font-color-spec;
  1012. text-align: center;
  1013. margin-top: 40upx;
  1014. }
  1015. .register-section {
  1016. position: absolute;
  1017. left: 0;
  1018. bottom: 50upx;
  1019. width: 100%;
  1020. font-size: $font-sm+2upx;
  1021. color: $font-color-base;
  1022. text-align: center;
  1023. text {
  1024. color: $font-color-spec;
  1025. margin-left: 10upx;
  1026. }
  1027. }
  1028. </style>