login.vue 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. <template>
  2. <view class="page">
  3. <view class="logTitle">
  4. <view class="welcome">
  5. <text>HI,您好!</text>
  6. </view>
  7. <view class="welcome">
  8. <text>欢迎登录技师端</text>
  9. </view>
  10. <view class="flex-row justify-center">
  11. <image src="../../static/logo.png" class="log"></image>
  12. </view>
  13. </view>
  14. <view class="form">
  15. <u--form labelPosition="left" :model="form" :rules="rules" ref="uForm">
  16. <view class="formItem">
  17. <u-form-item label="账号" prop="username" borderBottom ref="item1">
  18. <u--input v-model="form.username" border="none"></u--input>
  19. </u-form-item>
  20. </view>
  21. <view class="formItem">
  22. <u-form-item label="密码" prop="password" borderBottom ref="item1">
  23. <u--input v-model="form.password" border="none" type="password"></u--input>
  24. </u-form-item>
  25. </view>
  26. <view class="forgetPassword"><text>忘记密码?</text></view>
  27. <view class="loginButton" @click="login">
  28. <text>登录</text>
  29. </view>
  30. </u--form>
  31. </view>
  32. </view>
  33. </template>
  34. <script>
  35. export default {
  36. data() {
  37. return {
  38. form: {
  39. username: '',
  40. password: ''
  41. },
  42. rules: {
  43. 'username': {
  44. type: 'string',
  45. required: true,
  46. min: 11,
  47. max: 11,
  48. message: '请输入11位手机号',
  49. trigger: ['blur', 'change']
  50. },
  51. 'password': {
  52. type: 'string',
  53. required: true,
  54. min: 6,
  55. max: 18,
  56. message: '请输入6-18位密码',
  57. trigger: ['blur', 'change']
  58. }
  59. }
  60. }
  61. },
  62. methods: {
  63. login() {
  64. this.$refs.uForm.validate().then(res => {
  65. this.$api.login.techLogin(this.form).then(res => {
  66. uni.setStorageSync('accessToken', res.data.data.access_token)
  67. uni.switchTab({
  68. url: "/pages/index/index"
  69. })
  70. })
  71. })
  72. }
  73. }
  74. }
  75. </script>
  76. <style lang="scss" scoped>
  77. @import './index.rpx.css';
  78. </style>