login.vue 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. <template>
  2. <view class="page">
  3. <uni-nav-bar :fixed="true" background-color="#FFE05C" :border="false" :statusBar="true" title="登录" />
  4. <view class="logTitle">
  5. <view class="welcome">
  6. <text>HI,您好!</text>
  7. </view>
  8. <view class="welcome">
  9. <text>欢迎登录技师端</text>
  10. </view>
  11. <view class="flex-row justify-center">
  12. <image src="../../static/logo.png" class="log"></image>
  13. </view>
  14. </view>
  15. <view class="form">
  16. <u--form labelPosition="left" :model="form" :rules="rules" ref="uForm">
  17. <view class="formItem">
  18. <u-form-item label="账号" prop="username" borderBottom ref="item1">
  19. <u--input v-model="form.username" placeholder="请输入账号" border="none"></u--input>
  20. </u-form-item>
  21. </view>
  22. <view class="formItem">
  23. <u-form-item label="密码" prop="password" borderBottom ref="item1">
  24. <u--input v-model="form.password" placeholder="请输入密码" border="none" type="password"></u--input>
  25. </u-form-item>
  26. </view>
  27. <view class="forgetPassword flex-row justify-between ">
  28. <view>
  29. <checkbox-group @change="checkboxChange">
  30. <checkbox :checked="savePassword" color="#FFCC33" :style="{'transform':'scale(0.8)'}"/>
  31. <text>记住账号密码</text>
  32. </checkbox-group>
  33. </view>
  34. <!-- <view class="">-->
  35. <!-- <text>忘记密码?</text>-->
  36. <!-- </view>-->
  37. </view>
  38. <view class="loginButton" @click="login">
  39. <text>登录</text>
  40. </view>
  41. </u--form>
  42. </view>
  43. </view>
  44. </template>
  45. <script>
  46. export default {
  47. data() {
  48. return {
  49. savePassword:false,
  50. form: {
  51. username: '',
  52. password: ''
  53. },
  54. rules: {
  55. 'username': {
  56. type: 'string',
  57. required: true,
  58. min: 11,
  59. max: 11,
  60. message: '请输入11位手机号',
  61. trigger: ['blur', 'change']
  62. },
  63. 'password': {
  64. type: 'string',
  65. required: true,
  66. min: 6,
  67. max: 18,
  68. message: '请输入6-18位密码',
  69. trigger: ['blur', 'change']
  70. }
  71. }
  72. }
  73. },
  74. onShow(){
  75. this.form.username = uni.getStorageSync('username')
  76. this.form.password = uni.getStorageSync('password')
  77. this.savePassword = uni.getStorageSync('savePassword')
  78. },
  79. methods: {
  80. checkboxChange(e){
  81. this.savePassword = !this.savePassword
  82. console.log(this.savePassword)
  83. },
  84. login() {
  85. this.$refs.uForm.validate().then(res => {
  86. if (this.savePassword){
  87. uni.setStorageSync('savePassword', this.savePassword)
  88. uni.setStorageSync('username', this.form.username)
  89. uni.setStorageSync('password', this.form.password)
  90. }else {
  91. uni.setStorageSync('savePassword', this.savePassword)
  92. uni.removeStorageSync('username');
  93. uni.removeStorageSync('password');
  94. }
  95. this.$api.login.techLogin(this.form).then(res => {
  96. uni.setStorageSync('accessToken', res.data.data.access_token)
  97. uni.removeStorageSync('storeId');
  98. uni.removeStorageSync('storeName');
  99. uni.switchTab({
  100. url: "/pages/index/index"
  101. })
  102. })
  103. })
  104. }
  105. }
  106. }
  107. </script>
  108. <style lang="scss" scoped>
  109. @import './index.rpx.css';
  110. </style>