AI销管
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

Verification.vue 8.1 KiB

пре 2 година
пре 2 година
пре 2 година
пре 2 година
пре 2 година
пре 2 година
пре 2 година
пре 2 година
пре 2 година
пре 2 година
пре 2 година
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409
  1. <template>
  2. <view>
  3. <view class="head">
  4. <image class="head-immg" src="https://autoiot.oss-cn-beijing.aliyuncs.com/static/login.png" mode=""></image>
  5. </view>
  6. <view class="input">
  7. <view class="">
  8. <view class="text-1">
  9. 您好,
  10. </view>
  11. <view class="text-2">
  12. 欢迎登录AI销管~
  13. </view>
  14. </view>
  15. <view class="cwjs-cells item-flex" style="margin-top: 80rpx;">
  16. <view class="cwjs-item center" style="margin-left:30rpx;">
  17. <input type="text" v-model="username" placeholder="请输入手机号码" maxlength="11"
  18. placeholder-style='color:#AAAAAA;' />
  19. </view>
  20. </view>
  21. <view class="cwjs-cells item-flex" style="margin-top: 13rpx;">
  22. <view class="cwjs-item center" style="margin-left:30rpx;display: flex;">
  23. <input type="text" v-model="msg" placeholder="请输入验证码" maxlength="4"
  24. placeholder-style='color:#AAAAAA;' />
  25. <view class="mamay">
  26. <view class="sada" v-if="sendAuthCode" style="font-size: 30rpx;" @click="getAuthCode">获取验证码
  27. </view>
  28. <text class="sada" v-if="!sendAuthCode">
  29. 重新发送({{ auth_time }})
  30. <!-- <text></text> -->
  31. </text>
  32. </view>
  33. </view>
  34. </view>
  35. <view class="textbox">
  36. <view class="textbox-1" @tap="bindVerification">密码登录</view>
  37. <view class="textbox-2"></view>
  38. <view class="textbox-11"></view>
  39. </view>
  40. <view class="button" @click="denglu"><text class="">登录</text></view>
  41. </view>
  42. </view>
  43. </template>
  44. <script>
  45. var util = require("../../utils/util.js");
  46. var config = require("../../config");
  47. var WXB_SESSION_LOGIN_DATA = 'weapp_session_login_data';
  48. var app = getApp();
  49. export default {
  50. data() {
  51. return {
  52. username: '',
  53. role: '',
  54. msg: '',
  55. sendAuthCode: true,
  56. auth_time: 0,
  57. };
  58. },
  59. onLoad: function(options) {
  60. this.role = options.role;
  61. },
  62. methods: {
  63. //账号密码登录
  64. bindVerification() {
  65. uni.navigateTo({
  66. url: '/pages/login/index',
  67. })
  68. },
  69. //登录
  70. denglu() {
  71. var that = this;
  72. if (this.msg == '') {
  73. uni.showToast({
  74. title: '验证码不能为空',
  75. icon: 'none'
  76. });
  77. return
  78. }
  79. if (this.msg.length == 4) {
  80. uni.request({
  81. url: config.service.plogin + '?mobile=SMS@' + this.username + '&code=' + this.msg +
  82. '&grant_type=mobile',
  83. method: "POST",
  84. header: {
  85. 'Authorization': 'Basic cGlnOnBpZw=='
  86. },
  87. data: {
  88. mobile: 'SMS@' + this.username,
  89. code: this.msg,
  90. grant_type: 'mobile'
  91. },
  92. success: (result) => {
  93. var data = result.data; //console.log("登录信息", data);
  94. if (data) {
  95. var res = data;
  96. if (res.code != 1) {
  97. var data = {
  98. 'token': res.access_token
  99. };
  100. uni.setStorageSync(WXB_SESSION_LOGIN_DATA, data); //写入缓存
  101. that.getMenu()
  102. that.getUser();
  103. util.showSuccess('登录成功');
  104. } else {
  105. util.showNone("账号名或密码错误,请重试");
  106. return false;
  107. }
  108. } else {
  109. util.showNone(data.msg);
  110. return false;
  111. }
  112. },
  113. })
  114. } else {
  115. uni.showToast({
  116. title: '验证码位数不正确',
  117. icon: 'none'
  118. });
  119. }
  120. },
  121. getUser(){
  122. util.getRequestPromise(config.service.getUser, {}, false, "GET").then(data => {
  123. if (data.user.total==0) {
  124. uni.showToast({
  125. title: '暂无绑定项目',
  126. duration: 2000,
  127. icon:"none"
  128. });
  129. return
  130. } else {
  131. let lopan = {
  132. id: data.houseList[0].id,
  133. name: data.houseList[0].propertyName
  134. }
  135. let users=data.user
  136. users.zkProperties=data.houseList
  137. uni.setStorageSync("fendianindex", 0); //写入缓存
  138. uni.setStorageSync("weapp_session_userInfo_data",users); //写入缓存
  139. uni.setStorageSync("buildingID", lopan); //项目id写入缓存
  140. uni.switchTab({
  141. url: '/pages/index/index'
  142. });
  143. }
  144. });
  145. },
  146. //获取权限
  147. getMenu(){
  148. uni.request({
  149. url: config.service.getMenu,
  150. method: "POST",
  151. header: {
  152. 'content-type': 'application/json',
  153. 'Authorization': 'Bearer '+uni.getStorageSync('weapp_session_login_data').token
  154. },
  155. success: (data) => {
  156. let rescor=data.data;
  157. if (rescor.code == 0) {
  158. uni.setStorageSync("weapp_session_Menu_data", rescor.data)
  159. }else{
  160. uni.showToast({
  161. title: rescor.msg,
  162. duration: 2000,
  163. icon:"none"
  164. });
  165. return
  166. }
  167. }
  168. })
  169. },
  170. //获取验证码
  171. getAuthCode() {
  172. if (this.phone == '') {
  173. uni.showToast({
  174. title: '手机号不能为空',
  175. icon: 'none'
  176. });
  177. return
  178. }
  179. uni.request({
  180. url: config.service.sendCode + "/" + this.username,
  181. method: "GET",
  182. header: {
  183. 'content-type': 'application/json',
  184. },
  185. success: (data) => {
  186. console.log(data)
  187. // 成功地响应会话信息
  188. if (data.data.code == 0) {
  189. util.showSuccess('发送成功');
  190. this.sendAuthCode = false;
  191. this.auth_time = 60;
  192. var auth_timetimer = setInterval(() => {
  193. this.auth_time--;
  194. if (this.auth_time <= 0) {
  195. this.sendAuthCode = true;
  196. clearInterval(auth_timetimer);
  197. }
  198. }, 1000);
  199. } else {
  200. util.showNone(data.data.message);
  201. return false;
  202. }
  203. },
  204. })
  205. },
  206. }
  207. };
  208. </script>
  209. <style lang="scss">
  210. .cwjs-logo {
  211. display: block;
  212. width: 219rpx;
  213. height: 158rpx;
  214. margin: 54rpx auto 66rpx;
  215. }
  216. .cwjs-tips {
  217. font-size: 24rpx;
  218. padding: 80rpx 0;
  219. color: #8a8a8a;
  220. }
  221. .cwjs-form {
  222. position: relative;
  223. margin: 0;
  224. background-color: #fff;
  225. border-radius: 10px;
  226. padding: 20rpx 40rpx 113rpx;
  227. }
  228. .cwjs-cells {
  229. width: 510rpx;
  230. display: flex;
  231. flex-direction: row;
  232. justify-content: space-between;
  233. align-items: center;
  234. margin: 0 auto;
  235. height: 88rpx;
  236. overflow: hidden;
  237. border: 1rpx solid #BFC7D3;
  238. position: relative;
  239. border-radius: 12rpx;
  240. }
  241. .center {
  242. flex: 1;
  243. }
  244. .cwjs-input {
  245. height: 48rpx;
  246. line-height: 48rpx;
  247. padding: 23rpx 23rpx 23rpx 78rpx;
  248. font-size: 28rpx;
  249. font-family: PingFangSC-Regular, PingFang SC;
  250. color: #000;
  251. }
  252. .images {
  253. display: block;
  254. width: 40rpx;
  255. height: 21rpx;
  256. margin-right: 30rpx;
  257. margin-top: 33.5rpx;
  258. }
  259. .mod-btn {
  260. position: absolute;
  261. bottom: -80rpx;
  262. left: 50%;
  263. margin-left: -80rpx;
  264. }
  265. .sada {
  266. font-size: 30rpx;
  267. color: #2B6EFF;
  268. width: 200rpx;
  269. display: flex;
  270. }
  271. /* 头部 */
  272. .head {
  273. width: 750rpx;
  274. height: 500rpx;
  275. position: relative;
  276. .head-immg {
  277. width: 750rpx;
  278. height: 778rpx;
  279. position: absolute;
  280. }
  281. }
  282. .logo {
  283. width: 248rpx;
  284. height: 248rpx;
  285. display: block;
  286. position: absolute;
  287. top: 134rpx;
  288. left: 240.5rpx;
  289. }
  290. /* 输入框 */
  291. .input {
  292. width: 630rpx;
  293. height: 824rpx;
  294. padding: 60rpx 60rpx 80rpx 60rpx;
  295. box-sizing: border-box;
  296. background: #FFFFFF;
  297. box-shadow: 0px 14px 20px -6px rgba(6, 16, 88, 0.1);
  298. border-radius: 20px;
  299. position: absolute;
  300. top: 107rpx;
  301. left: 60rpx;
  302. }
  303. .text-1 {
  304. font-size: 44rpx;
  305. line-height: 62rpx;
  306. }
  307. .text-2 {
  308. margin-top: 16rpx;
  309. font-size: 36rpx;
  310. line-height: 50rpx;
  311. }
  312. .logo_input {
  313. width: 34rpx;
  314. height: 38rpx;
  315. position: absolute;
  316. top: 25rpx;
  317. left: 30rpx;
  318. }
  319. /* 登录 */
  320. .button {
  321. width: 510rpx;
  322. height: 86rpx;
  323. background: #2671E2;
  324. box-shadow: 0px 2px 20px 0px rgba(38, 113, 226, 0.5);
  325. border-radius: 12rpx;
  326. text-align: center;
  327. line-height: 89rpx;
  328. color: #fff;
  329. margin: 0 auto;
  330. margin-top: 120rpx;
  331. font-size: 34rpx;
  332. }
  333. .footer {
  334. width: 100%;
  335. height: 157rpx;
  336. position: absolute;
  337. bottom: 0;
  338. left: 0;
  339. }
  340. .imagesBox {
  341. width: 80rpx;
  342. height: 88rpx;
  343. }
  344. .login {
  345. text-decoration: underline;
  346. text-align: center;
  347. margin-top: 40px;
  348. color: #88909E;
  349. font-size: 28rpx;
  350. }
  351. .textbox {
  352. width: 569rpx;
  353. display: flex;
  354. margin-top: 40rpx;
  355. }
  356. .textbox-1 {
  357. width: 30%;
  358. font-size: 30rpx;
  359. color: #999999;
  360. }
  361. .textbox-11 {
  362. width: 30%;
  363. text-align: right;
  364. font-size: 30rpx;
  365. color: #999999;
  366. }
  367. .textbox-2 {
  368. width: 30%;
  369. }
  370. </style>