reg.vue 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. <template>
  2. <view class="content">
  3. <view class="input-group">
  4. <view class="input-row border">
  5. <text class="title">账号:</text>
  6. <m-input type="text" focus clearable v-model="username" placeholder="请输入账号"></m-input>
  7. </view>
  8. <view class="input-row border">
  9. <text class="title">密码:</text>
  10. <m-input type="password" displayable v-model="password" placeholder="请输入密码"></m-input>
  11. </view>
  12. <view class="input-row">
  13. <text class="title">确认密码:</text>
  14. <m-input type="password" displayable v-model="confirmPassword" placeholder="请确认密码"></m-input>
  15. </view>
  16. </view>
  17. <view class="btn-row">
  18. <tui-button type="primary" class="primary" @tap="register">注册</tui-button>
  19. </view>
  20. </view>
  21. </template>
  22. <script>
  23. import service from '../../service.js';
  24. import mInput from '../../components/m-input.vue';
  25. import tuiButton from "@/components/thorui/tui-button/tui-button"
  26. export default {
  27. components: {
  28. mInput,
  29. tuiButton
  30. },
  31. data() {
  32. return {
  33. username: '',
  34. password: '',
  35. confirmPassword: ''
  36. }
  37. },
  38. methods: {
  39. register() {
  40. /**
  41. * 客户端对账号信息进行一些必要的校验。
  42. * 实际开发中,根据业务需要进行处理,这里仅做示例。
  43. */
  44. if (this.username.length < 3) {
  45. uni.showToast({
  46. icon: 'none',
  47. title: '账号最短为 3 个字符'
  48. });
  49. return;
  50. }
  51. if (this.password.length < 6) {
  52. uni.showToast({
  53. icon: 'none',
  54. title: '密码最短为 6 个字符'
  55. });
  56. return;
  57. }
  58. if (this.password !== this.confirmPassword) {
  59. uni.showToast({
  60. icon: 'none',
  61. title: '两次密码输入不一致'
  62. });
  63. return;
  64. }
  65. const data = {
  66. username: this.username,
  67. password: this.password
  68. }
  69. uniCloud.callFunction({
  70. name: 'user-center',
  71. data: {
  72. action: 'register',
  73. params: data
  74. },
  75. success(e) {
  76. console.log("注册成功", e);
  77. if (e.result.code === 0) {
  78. uni.showToast({
  79. title: '注册成功'
  80. });
  81. uni.setStorageSync('uniIdToken', e.result.token)
  82. uni.setStorageSync('username', e.result.username)
  83. uni.reLaunch({
  84. url: '../main/main',
  85. });
  86. } else {
  87. uni.showModal({
  88. content: JSON.stringify(e.result),
  89. showCancel: false
  90. })
  91. }
  92. },
  93. fail(e) {
  94. uni.showModal({
  95. content: JSON.stringify(e),
  96. showCancel: false
  97. })
  98. }
  99. })
  100. }
  101. }
  102. }
  103. </script>
  104. <style>
  105. </style>