loginphone.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411
  1. <template>
  2. <view class="container">
  3. <view class="wrapper">
  4. <view style="padding-left:60upx;" class="margin-tb-lg">
  5. <view style="color:#333333;font-size:42upx;">商户登录体验更多功能</view>
  6. <view style="color:#999999" class="text-sm margin-top-xs">未入驻过的请先申请入驻账号</view>
  7. </view>
  8. <view class="input-content">
  9. <view class="cu-form-group margin-top" style="border-bottom: 1px solid #E6E6E6;">
  10. <!-- <view class="title text-black">账号</view> -->
  11. <input type="text" :value="phone" placeholder="请输入账号" maxlength="11" data-key="phone"
  12. @input="inputChange" />
  13. </view>
  14. <view class="cu-form-group margin-top" style="border-bottom: 1px solid #E6E6E6;">
  15. <!-- <view class="title text-black">密码</view> -->
  16. <input type="password" placeholder="请输入密码" maxlength="20" :value="password" data-key="password"
  17. @input="inputChange" @confirm="toLogin" />
  18. <!-- <text class="send-msg" @click="forget">忘记密码</text> -->
  19. </view>
  20. <view class="cu-form-group flex justify-between align-center margin-top"
  21. style="border-bottom: 1px solid #E6E6E6;">
  22. <view>
  23. <!-- <view class="title text-black">验证码</view> -->
  24. <input type="text" placeholder="请输入图片验证码" maxlength="20" :value="captcha" data-key="captcha"
  25. @input="inputChange" @confirm="toLogin" />
  26. </view>
  27. <view>
  28. <image @click="getCaptcha" :src="captchaPath" style="width:160upx;height:64upx;"></image>
  29. </view>
  30. </view>
  31. </view>
  32. <button class="confirm-btn" @click="toLogin">立即登录</button>
  33. <view class="flex">
  34. <view class="ruzhu" @click="bindchat()">联系客服</view>
  35. <!-- <view class="ruzhu" @click="xiupwd()">修改密码</view> -->
  36. <view class="ruzhu" @click="show = true" v-if="XCXIsSelect != '否'">商家入驻</view>
  37. </view>
  38. <!-- <view class="ruzhu" @click="bindRuzhu()">商家入驻</view> -->
  39. <!-- <view class="ruzhu" @click="show = true">商家入驻</view> -->
  40. </view>
  41. <!---->
  42. <!-- 入驻弹框 -->
  43. <u-popup v-model="show" mode="center" border-radius="14" width="500rpx" height="350rpx" closeable="true">
  44. <view class="padding text-center">
  45. <view class="padding-top margin-top-sm text-lg" @click="bindRuzhu()">商家申请入驻</view>
  46. <view class="padding-top text-lg" @click="bindRuzhus()">商家信息修改</view>
  47. <view class="text-sm text-gray margin-top-xs">申请入驻后修改入驻信息</view>
  48. </view>
  49. </u-popup>
  50. </view>
  51. </template>
  52. <script>
  53. import configurl from '../../common/config.js'
  54. export default {
  55. data() {
  56. return {
  57. openId:'',
  58. weixinPhone: true,
  59. phone: '',
  60. password: '',
  61. banners: [],
  62. invitation: '',
  63. loginName: '',
  64. sending: false,
  65. sendTime: '获取验证码',
  66. count: 60,
  67. captcha: '',
  68. captchaPath: '',
  69. uuid: '',
  70. show: false,
  71. open: true,
  72. XCXIsSelect: '是',
  73. }
  74. },
  75. onLoad() {
  76. this.getCaptcha()
  77. this.XCXIsSelect = this.$queue.getData("XCXIsSelect");
  78. },
  79. methods: {
  80. //登录
  81. login() {
  82. let that = this;
  83. // 1.wx获取登录用户code
  84. uni.login({
  85. provider: 'weixin',
  86. success: function(loginRes) {
  87. console.log(loginRes, '************')
  88. let data = {
  89. code: loginRes.code,
  90. }
  91. that.$Request.get('/app/Login/wxShopLogin', data).then(res => {
  92. if (res.code == 0) {
  93. uni.hideLoading()
  94. that.openId = res.data.open_id;
  95. that.xcxtoLogin();
  96. // uni.setStorageSync('openId', res.data.open_id)
  97. // uni.setStorageSync('unionId', res.data.unionId)
  98. } else {
  99. uni.showToast({
  100. icon: 'none',
  101. title: res.msg,
  102. duration: 2000
  103. });
  104. console.log(res, '失败')
  105. }
  106. })
  107. }
  108. });
  109. },
  110. //修改密码
  111. xiupwd() {
  112. uni.navigateTo({
  113. url: '/pages/my/pwd'
  114. })
  115. },
  116. // 商家入驻引导弹框
  117. bindshangjia() {
  118. uni.showModal({
  119. title: '提示',
  120. content: '请前往同城外卖用户端【我的-商家入驻】进行入驻,再返回商家登录',
  121. success: function(res) {
  122. if (res.confirm) {
  123. console.log('用户点击确定');
  124. // #ifdef MP-WEIXIN
  125. wx.navigateToMiniProgram({
  126. appId: 'wxd6a3bf45c999d9cd',
  127. path: '/pages/index/index',
  128. envVersion: 'release', // 打开正式版
  129. success(res) {
  130. // 打开成功
  131. },
  132. fail: function(err) {
  133. console.log(err);
  134. }
  135. })
  136. // #endif
  137. } else if (res.cancel) {
  138. console.log('用户点击取消');
  139. }
  140. }
  141. });
  142. },
  143. //联系客服
  144. bindchat() {
  145. uni.navigateTo({
  146. url: '/my/other/customer'
  147. })
  148. },
  149. //申请商户入驻
  150. bindRuzhu() {
  151. this.show = false;
  152. uni.navigateTo({
  153. url: '/my/publish/index'
  154. })
  155. },
  156. bindRuzhus() {
  157. this.show = false;
  158. uni.navigateTo({
  159. url: '/pages/my/phoneSettled'
  160. })
  161. },
  162. // 获取验证码
  163. getCaptcha() {
  164. this.uuid = this.$queue.getUUID()
  165. // this.captchaPath = this.$http.adornUrl(`/captcha.jpg?uuid=${this.uuid}`)
  166. // this.captchaPath = this.$Request.getA('/captcha.jpg?uuid='+this.uuid).then(res => {
  167. // });
  168. console.log(this.uuid)
  169. uni.downloadFile({
  170. // url: 'https://diancanshop.xianmxkj.com/sqx_fast/captcha.jpg?uuid=' + this.uuid,
  171. // url: 'https://mxys.chuanghai-tech.com/sqx_fast/captcha.jpg?uuid=' + this.uuid,
  172. url: configurl.APIHOSTsss + '/sqx_fast/captcha.jpg?uuid=' + this.uuid,
  173. success: (res) => {
  174. // uni.showToast({
  175. // title:configurl.APIHOSTsss + '/captcha.jpg?uuid=' + this.uuid,
  176. // icon:'success'
  177. // })
  178. console.log(res)
  179. this.captchaPath = res.tempFilePath
  180. }
  181. })
  182. },
  183. forget() {
  184. uni.navigateTo({
  185. url: '/pages/my/forgetPwd'
  186. });
  187. },
  188. register() {
  189. uni.navigateTo({
  190. url: '/pages/public/register'
  191. });
  192. },
  193. inputChange(e) {
  194. const key = e.currentTarget.dataset.key;
  195. this[key] = e.detail.value;
  196. },
  197. navBack() {
  198. uni.navigateBack();
  199. },
  200. xcxtoLogin() {
  201. let that = this
  202. that.$queue.loginClear();
  203. let openid = that.$queue.getData("openid");
  204. const {
  205. phone,
  206. password,
  207. captcha
  208. } = that;
  209. if (!phone) {
  210. that.$queue.showToast("请输入门店管理员账号");
  211. } else if (!password) {
  212. that.$queue.showToast("请输入门店管理员密码");
  213. } else if (!captcha) {
  214. that.$queue.showToast("请输入图片验证码");
  215. } else {
  216. that.$queue.showLoading("正在登录中...");
  217. that.$Request.postJsonA("/sys/login", {
  218. password: password,
  219. username: phone,
  220. captcha: captcha,
  221. uuid: that.uuid,
  222. openId: that.openId
  223. }).then(res => {
  224. if (res.code == 0) {
  225. that.$queue.setData("shopToken", res.token);
  226. uni.hideLoading()
  227. setTimeout(function() {
  228. that.getUserInfo()
  229. }, 10)
  230. } else {
  231. that.getCaptcha()
  232. uni.hideLoading();
  233. that.$queue.showToast(res.msg);
  234. }
  235. });
  236. }
  237. },
  238. toLogin() {
  239. let that = this
  240. that.$queue.loginClear();
  241. let openid = that.$queue.getData("openid");
  242. const {
  243. phone,
  244. password,
  245. captcha
  246. } = that;
  247. if (!phone) {
  248. that.$queue.showToast("请输入门店管理员账号");
  249. } else if (!password) {
  250. that.$queue.showToast("请输入门店管理员密码");
  251. } else if (!captcha) {
  252. that.$queue.showToast("请输入图片验证码");
  253. } else {
  254. // #ifdef MP-WEIXIN
  255. that.login();
  256. // #endif
  257. // #ifndef MP-WEIXIN
  258. that.$queue.showLoading("正在登录中...");
  259. that.$Request.postJsonA("/sys/login", {
  260. password: password,
  261. username: phone,
  262. captcha: captcha,
  263. uuid: that.uuid,
  264. }).then(res => {
  265. if (res.code == 0) {
  266. that.$queue.setData("shopToken", res.token);
  267. uni.hideLoading()
  268. setTimeout(function() {
  269. that.getUserInfo()
  270. }, 10)
  271. } else {
  272. that.getCaptcha()
  273. uni.hideLoading();
  274. that.$queue.showToast(res.msg);
  275. }
  276. });
  277. // #endif
  278. }
  279. },
  280. getUserInfo() {
  281. this.$Request.getA("/sys/user/info").then(res => {
  282. if (res.code == 0) {
  283. this.$queue.setData("userId", res.user.userId);
  284. this.$queue.setData("shopId", res.user.shopList[0].shopId);
  285. this.$queue.setData("mobile", res.user.mobile);
  286. if (res.user.userEntity && res.user.userEntity.openId) {
  287. this.$queue.setData("openId", res.user.userEntity.openId);
  288. }
  289. // #ifdef APP-PLUS
  290. if (uni.getSystemInfoSync().platform == 'android') {
  291. let clientid = plus.push.getClientInfo().clientid;
  292. let userId = this.$queue.getData('userId');
  293. if (userId) {
  294. this.$Request.postT('/user/updateShopClientId?clientId=' + clientid).then(
  295. red => {});
  296. }
  297. }
  298. //#endif
  299. // uni.navigateBack()
  300. // this.$queue.setData("avatar", res.user.avatar);
  301. // this.$queue.setData("invitationCode", res.user.invitationCode);
  302. this.$queue.setData("open", this.open);
  303. uni.switchTab({
  304. url: '/pages/my/index'
  305. })
  306. }
  307. });
  308. },
  309. // getIsVip() {
  310. // this.$Request.get("/app/UserVip/isUserVip").then(res => {
  311. // if (res.code == 0) {
  312. // // this.isVip = res.data
  313. // console.log(res.data)
  314. // this.$queue.setData("isVip", res.data);
  315. // }
  316. // });
  317. // }
  318. },
  319. }
  320. </script>
  321. <style lang='scss'>
  322. page {
  323. height: 100%;
  324. background: #FFFFFF !important;
  325. }
  326. .send-msg {
  327. border-radius: 30px;
  328. /* color: black; */
  329. background: white;
  330. height: 30px;
  331. font-size: 14px;
  332. line-height: 30px;
  333. }
  334. .container {
  335. top: 0;
  336. padding-top: 32upx;
  337. position: relative;
  338. width: 100%;
  339. height: 100%;
  340. overflow: hidden;
  341. /* background: #1E1F31 !important; */
  342. }
  343. .wrapper {
  344. position: relative;
  345. z-index: 90;
  346. /* background: #1E1F31; */
  347. padding-bottom: 32upx;
  348. }
  349. .input-content {
  350. /* margin-top: 300upx; */
  351. /* padding-top: 300upx; */
  352. padding: 40upx 60upx;
  353. }
  354. .confirm-btn {
  355. width: 600upx;
  356. line-height: 88upx;
  357. height: 88upx;
  358. border-radius: 10upx;
  359. margin-top: 32upx;
  360. background: #FCD202;
  361. /* color: #fff; */
  362. font-size: 32upx;
  363. &:after {
  364. border-radius: 10px;
  365. }
  366. }
  367. .ruzhu {
  368. width: 100%;
  369. text-align: center;
  370. color: #999999;
  371. margin-top: 20upx;
  372. }
  373. .padding-top {
  374. margin: 32upx 0;
  375. background: #FCD202;
  376. height: 72rpx;
  377. /* line-height: 80rpx; */
  378. padding: 13rpx 0;
  379. font-size: 34rpx;
  380. }
  381. .margin-top-sm {
  382. margin-top: 50rpx;
  383. }
  384. </style>