login.vue 30 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092
  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. })
  172. var clientid = uni.getStorage("clientId")
  173. console.log("clientid",clientid)
  174. this.$api.request('user', 'login',{
  175. password:that.password,
  176. phone:that.phone,
  177. cid: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. })
  503. that.logining = true
  504. let loginType = 1
  505. let userInfo = e.detail.userInfo
  506. uni.login({
  507. provider: 'weixin',
  508. success: (wxres => {
  509. that.logining = false
  510. that.$api.request('user', 'thirdPartLogin', {
  511. loginType: loginType,
  512. raw: JSON.stringify(wxres)
  513. }, failres => {
  514. that.$api.msg(failres.errmsg)
  515. uni.hideLoading()
  516. }).then(res => {
  517. that.accessToken = res.data.accessToken
  518. that.$api.setUserInfo(res.data)
  519. that.userInfo = res.data
  520. uni.getUserInfo({
  521. lang: 'zh_CN',
  522. provider: 'weixin',
  523. withCredentials:true,
  524. success: (e) => {
  525. that.params.iv = e.iv
  526. that.params.encryptedData = e.encryptedData
  527. that.params.session_key = that.accessToken
  528. console.log(this.params)
  529. that.getTokenAsync(this.params)
  530. uni.setStorageSync('userInfo', res.data)
  531. that.$store.commit('login', res.data)
  532. e.userInfo.nickname = e.userInfo.nickName
  533. if(e.userInfo.phone == undefined){
  534. e.userInfo.phone = ''
  535. }
  536. e.userInfo.cid = uni.getStorageSync("clientId")
  537. console.log(e.userInfo)
  538. that.$api.request('user', 'syncUserInfo', e.userInfo).then(syncRes => {
  539. //同步过后
  540. res.data.nickname = userInfo.nickName
  541. res.data.avatarUrl = userInfo.avatarUrl
  542. res.data.gender = userInfo.gender
  543. if(userInfo.phone){
  544. res.data.phone = userInfo.phone
  545. that.liangxinLogin()
  546. }
  547. uni.setStorageSync('userInfo', res.data)
  548. that.$store.commit('login', res.data)
  549. that.$api.setUserInfo(res.data)
  550. uni.hideLoading()
  551. // uni.navigateBack()
  552. })
  553. },
  554. complete: (e) => {
  555. uni.hideLoading()
  556. if(!res.data.phone||res.data.phone==""||res.data.phone ==undefined){
  557. that.isPhone = true//显示自定义的获取手机权限提示框
  558. that.inputStatus = 'inline'
  559. that.inputContent = ''
  560. }
  561. else{
  562. uni.setStorageSync('PageCur', "sale");
  563. // uni.switchTab({
  564. // url: '/pages/sale/sale'
  565. // });
  566. uni.switchTab({
  567. url: '/pages/sale/information'
  568. });
  569. console.log("complete")
  570. }
  571. }
  572. })
  573. })
  574. }),
  575. })
  576. }
  577. //新版本方式
  578. }else{
  579. console.log("新版本方式")
  580. uni.showLoading({
  581. title: '加载中'
  582. })
  583. that.logining = true
  584. let loginType = 1
  585. wx.getUserProfile({
  586. desc : '用于完善用户资料',
  587. lang : 'zh_CN',
  588. success : function( proRes ){
  589. console.log('proRes.userInfo',proRes.userInfo)
  590. uni.login({
  591. provider: 'weixin',
  592. success: (wxres => {
  593. that.logining = false
  594. that.$api.request('user', 'thirdPartLogin', {
  595. loginType: loginType,
  596. raw: JSON.stringify(wxres)
  597. }, failres => {
  598. that.$api.msg(failres.errmsg)
  599. uni.hideLoading()
  600. }).then(res => {
  601. console.log('res+++++',res)
  602. that.accessToken = res.data.accessToken
  603. that.$api.setUserInfo(res.data)
  604. that.userInfo = res.data
  605. // that.params.iv = proRes.iv
  606. // that.params.encryptedData = proRes.encryptedData
  607. // that.params.session_key = that.accessToken
  608. // console.log(that.params)
  609. // that.getTokenAsync(that.params)
  610. uni.setStorageSync('userInfo', res.data)
  611. that.$store.commit('login', res.data)
  612. if(proRes.userInfo.phone == undefined){
  613. proRes.userInfo.phone = ''
  614. }
  615. res.data.cid = uni.getStorageSync("clientId")
  616. that.$api.request('user', 'syncUserInfo', res.data).then(syncRes => {
  617. //同步过后
  618. res.data.nickname = proRes.userInfo.nickName
  619. res.data.avatarUrl = proRes.userInfo.avatarUrl
  620. res.data.gender = proRes.userInfo.gender
  621. if(proRes.userInfo.phone){
  622. res.data.phone = proRes.userInfo.phone
  623. }
  624. uni.setStorageSync('userInfo', res.data)
  625. that.$store.commit('login', res.data)
  626. that.$api.setUserInfo(res.data)
  627. uni.hideLoading()
  628. if(!that.userInfo.phone||that.userInfo.phone==""||that.userInfo.phone ==undefined){
  629. that.isPhone = true//显示自定义的获取手机权限提示框
  630. that.inputStatus = 'inline'
  631. that.inputContent = ''
  632. }
  633. else{
  634. uni.setStorageSync('PageCur', "sale");
  635. // uni.switchTab({
  636. // url: '/pages/sale/sale'
  637. // });
  638. uni.reLaunch({
  639. url: '/pages/sale/information'
  640. });
  641. console.log("complete")
  642. that.liangxinLogin()
  643. }
  644. })
  645. console.log( 'wx.getUserProfile=>用户允许了授权' );
  646. })
  647. })
  648. })
  649. },
  650. fail : function( res ){
  651. console.log('wx.getUserProfile=>用户拒绝了授权');
  652. console.log( res );
  653. }
  654. });
  655. }
  656. // 获取用户的当前设置,判断是否点击了“总是保持以上,不在询问”
  657. // wx.getSetting({
  658. // withSubscriptions: true,//是否获取用户订阅消息的订阅状态,默认false不返回
  659. // success(res){
  660. // debugger
  661. // if(res.subscriptionsSetting.mainSwitch){
  662. // }else{
  663. // }
  664. // }
  665. // })
  666. // uni.showModal({
  667. // title: '温馨提示',
  668. // content: '为更好的与您沟通,小程序需要向您发送通知消息',
  669. // confirmText:"同意",
  670. // cancelText:"拒绝",
  671. // showCancel: false,
  672. // success: function (res) {
  673. // if (res.confirm) {
  674. // //调用订阅消息
  675. // that.requestSubscribe();
  676. // } else if (res.cancel) {
  677. // ///显示第二个弹说明一下
  678. // wx.showModal({
  679. // title: '温馨提示',
  680. // content: '拒绝后您将无法获取实时的交易、物流消息',
  681. // confirmText:"知道了",
  682. // showCancel:false,
  683. // success: function (res) {
  684. // uni.openSetting({ // 打开设置页
  685. // success(res) {
  686. // console.log(res.authSetting)
  687. // }
  688. // });
  689. // }
  690. // });
  691. // }
  692. // }
  693. // });
  694. },
  695. wechatLogin() {
  696. const that = this
  697. that.logining = true
  698. let loginType = 2
  699. uni.showLoading({
  700. title: '正在同步消息'
  701. })
  702. uni.login({
  703. provider: 'weixin',
  704. success: (wxres => {
  705. that.$api.request('user', 'thirdPartLogin', {
  706. loginType: loginType,
  707. raw: JSON.stringify(wxres)
  708. }, failres => {
  709. that.$api.msg(failres.errmsg)
  710. uni.hideLoading()
  711. }).then(res => {
  712. console.log("thirdPartLogin:"+res.data.phone)
  713. that.accessToken = res.data.accessToken
  714. that.logining = false
  715. uni.getUserInfo({
  716. lang: 'zh_CN',
  717. success: (e) => {
  718. uni.setStorageSync('userInfo', res.data)
  719. that.$store.commit('login', res.data)
  720. e.userInfo.nickname = e.userInfo.nickName
  721. e.userInfo.cid = uni.getStorageSync("clientId")
  722. console.log(e.userInfo)
  723. that.$api.request('user', 'syncUserInfo', e.userInfo).then(syncRes => {
  724. //同步过后
  725. res.data.nickname = e.userInfo.nickName
  726. res.data.avatarUrl = e.userInfo.avatarUrl
  727. res.data.gender = e.userInfo.gender
  728. if(res.data.phone){
  729. res.data.phone = e.userInfo.phone
  730. that.liangxinLogin()
  731. }
  732. uni.setStorageSync('userInfo', res.data)
  733. that.$store.commit('login', res.data)
  734. })
  735. },
  736. complete: (e) => {
  737. uni.hideLoading()
  738. if(!res.data.phone||res.data.phone==""||res.data.phone ==undefined){
  739. that.isPhone = true//显示自定义的获取手机权限提示框
  740. that.inputStatus = 'inline'
  741. that.inputContent = ''
  742. }
  743. else{
  744. // uni.switchTab({
  745. // url: '/pages/sale/sale'
  746. // });
  747. uni.switchTab({
  748. url: '/pages/sale/information'
  749. });
  750. console.log("complete")
  751. }
  752. }
  753. })
  754. })
  755. })
  756. })
  757. },
  758. wechatH5Login() {
  759. const that = this
  760. let href = window.location.origin
  761. let page = that.$api.prePage()
  762. let prePath = '/pages/index/index'
  763. if (page) {
  764. prePath = page.__page__.path
  765. }
  766. window.location = 'https://open.weixin.qq.com/connect/oauth2/authorize?'
  767. + 'appid=' + that.$api.defConfig().h5Appid + '&redirect_uri=' + escape(href) + '&response_type=code&scope=snsapi_userinfo&state=' + escape(prePath) + '#wechat_redirect'
  768. },
  769. liangxinLogin(){
  770. const that = this
  771. var userInfoTmp = uni.getStorageSync("userInfo")
  772. console.log('userInfoTmp',userInfoTmp)
  773. that.$socket.login(userInfoTmp.phone, "123456", null, res=>{
  774. console.log('粮信登录',res)
  775. if (res.success) {
  776. that.$socket.showLoginDialog = false
  777. // 缓存用户
  778. that.userData = res.response.data
  779. console.log('userData',that.userData)
  780. that.$u.vuex("userData", that.userData);
  781. // 缓存通讯录
  782. that.$socket.listGuests(that.userData.user.operId, res => {
  783. // #ifdef APP-PLUS
  784. createFSQL(that.userData.user.operId).then();
  785. let contact = res.response.data;
  786. contact.forEach(c=>{
  787. c.members.forEach(m=>{
  788. m.name = c.name;
  789. addFSQL(m, that.userData.user.operId).then();
  790. })
  791. })
  792. // #endif
  793. that.$u.vuex('firendItem', res.response.data)
  794. });
  795. // 缓存消息列表
  796. that.$socket.queryOnlineMessage(that.userData.user.operId,q =>{
  797. let data = q.response.data;
  798. for(var i in data){
  799. initData(data[i].groupMsg.list, data[i].groupInfo.chatId);
  800. }
  801. })
  802. // 缓存链接
  803. that.$socket.getLinks(that.userData.user.operId, res=>{
  804. that.$u.vuex('linkItem',res.response.data)
  805. });
  806. // // 跳转到消息列表
  807. // that.$u.route({
  808. // url: 'pages/home/home',
  809. // type: 'switchTab'
  810. // });
  811. } else {
  812. uni.showModal({
  813. title:res.reason + ",请稍后再试",
  814. showCancel:false
  815. })
  816. }
  817. });
  818. }
  819. },
  820. }
  821. </script>
  822. <style lang='scss' scoped>
  823. .apple{
  824. background: #000;
  825. width: 35px;
  826. height: 35px;
  827. padding: 8px;
  828. border-radius: 50%;
  829. vertical-align: middle;
  830. }
  831. page {
  832. background: #fff;
  833. }
  834. .cuIcon-weixin{
  835. background: #39b54a;
  836. color: #fff;
  837. font-size: 18px;
  838. padding: 9px;
  839. border-radius: 50%;
  840. vertical-align: middle;
  841. margin-right:5px;
  842. }
  843. .alert{
  844. position: fixed;
  845. top: 0;
  846. right: 0;
  847. bottom: 0;
  848. left: 0;
  849. overflow: hidden;
  850. outline: 0;
  851. -webkit-overflow-scrolling: touch;
  852. background-color: rgb(0, 0, 0);
  853. filter: alpha(opacity=60);
  854. background-color: rgba(0, 0, 0, 0.6);
  855. z-index: 9999;
  856. .auth{
  857. position: absolute;
  858. top: 50%;
  859. left: 50%;
  860. width: 80%;
  861. height: 340rpx;
  862. border-radius: 20rpx;
  863. transform:translate(-50%,-50%);
  864. background: #fff;
  865. display: flex;
  866. flex-direction: column;
  867. .apply{
  868. margin: 0rpx auto;
  869. padding: 60rpx 40rpx;
  870. flex:1;
  871. display: flex;
  872. flex-direction: column;
  873. align-items: center;
  874. justify-content: space-between;
  875. font-size: 34rpx;
  876. color:rgb(34,34,34);
  877. p{
  878. font-size:30rpx
  879. }
  880. }
  881. .confirm{
  882. border-top: 1rpx solid rgb(221,221,221);
  883. text-align: center;
  884. height: 100rpx;
  885. width: 100%;
  886. line-height: 100rpx;
  887. font-size: 34rpx;
  888. color:rgb(255,145,37);
  889. }
  890. }
  891. }
  892. .container {
  893. padding-top: 115px;
  894. position: relative;
  895. width: 100vw;
  896. height: 100vh;
  897. overflow: hidden;
  898. background: #fff;
  899. }
  900. .wrapper {
  901. position: relative;
  902. z-index: 90;
  903. background: #fff;
  904. padding-bottom: 40upx;
  905. height:100%;
  906. }
  907. .back-btn {
  908. position: absolute;
  909. left: 40upx;
  910. z-index: 9999;
  911. padding-top: var(--status-bar-height);
  912. top: 40upx;
  913. font-size: 40upx;
  914. color: $font-color-dark;
  915. }
  916. .left-top-sign {
  917. font-size: 120upx;
  918. color: $page-color-base;
  919. position: relative;
  920. left: -16upx;
  921. }
  922. .right-top-sign {
  923. position: absolute;
  924. top: 80upx;
  925. right: -30upx;
  926. z-index: 95;
  927. &:before,
  928. &:after {
  929. display: block;
  930. content: "";
  931. width: 400upx;
  932. height: 80upx;
  933. background: #b4f3e2;
  934. }
  935. &:before {
  936. transform: rotate(50deg);
  937. border-radius: 0 50px 0 0;
  938. }
  939. &:after {
  940. position: absolute;
  941. right: -198upx;
  942. top: 0;
  943. transform: rotate(-50deg);
  944. border-radius: 50px 0 0 0;
  945. /* background: pink; */
  946. }
  947. }
  948. .left-bottom-sign {
  949. position: absolute;
  950. left: -270upx;
  951. bottom: -320upx;
  952. border: 100upx solid #d0d1fd;
  953. border-radius: 50%;
  954. padding: 180upx;
  955. }
  956. .welcome {
  957. position: relative;
  958. left: 50upx;
  959. top: -90upx;
  960. font-size: 46upx;
  961. color: #555;
  962. text-shadow: 1px 0px 1px rgba(0, 0, 0, .3);
  963. }
  964. .input-content {
  965. padding: 0 60upx;
  966. }
  967. .input-item {
  968. display: flex;
  969. flex-direction: column;
  970. align-items: flex-start;
  971. justify-content: center;
  972. padding: 0 30upx;
  973. background: $page-color-light;
  974. height: 120upx;
  975. border-radius: 4px;
  976. margin-bottom: 50upx;
  977. &:last-child {
  978. margin-bottom: 0;
  979. }
  980. .tit {
  981. height: 50upx;
  982. line-height: 56upx;
  983. font-size: $font-sm+2upx;
  984. color: $font-color-base;
  985. }
  986. input {
  987. height: 60upx;
  988. font-size: $font-base + 2upx;
  989. color: $font-color-dark;
  990. width: 100%;
  991. }
  992. }
  993. .confirm-btn {
  994. width: 630upx;
  995. height: 76upx;
  996. line-height: 76upx;
  997. border-radius: 50px;
  998. margin-top: 70upx;
  999. background: $uni-color-primary;
  1000. color: #fff;
  1001. font-size: $font-lg;
  1002. &:after {
  1003. border-radius: 100px;
  1004. }
  1005. }
  1006. .forget-section {
  1007. font-size: $font-sm+2upx;
  1008. color: $font-color-spec;
  1009. text-align: center;
  1010. margin-top: 40upx;
  1011. }
  1012. .register-section {
  1013. position: absolute;
  1014. left: 0;
  1015. bottom: 50upx;
  1016. width: 100%;
  1017. font-size: $font-sm+2upx;
  1018. color: $font-color-base;
  1019. text-align: center;
  1020. text {
  1021. color: $font-color-spec;
  1022. margin-left: 10upx;
  1023. }
  1024. }
  1025. </style>