register.vue 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. <template>
  2. <view>
  3. <uv-toast ref="toast"></uv-toast>
  4. <view class="page">
  5. <uv-row justify="space-between" customStyle="margin-top: 35%" class="form">
  6. <uv-col span="10" offset="1">
  7. <uv-form labelPosition="left" :model="logininfo" :rules="rules" ref="form" >
  8. <uv-col span="10" offset="1">{{$t('telno')}}</uv-col>
  9. <uv-col span="10" offset="1">
  10. <uv-form-item prop="telno" borderBottom>
  11. <uv-input v-model.trim="logininfo.telno" border="none">
  12. </uv-input>
  13. </uv-form-item>
  14. </uv-col>
  15. <uv-col span="10" offset="1" customStyle="margin-top: 20px">{{$t('password')}}</uv-col>
  16. <uv-col span="10" offset="1">
  17. <uv-form-item prop="pw1" borderBottom>
  18. <uv-input v-model.trim="logininfo.pw1" :type="passwordtype1" border="none">
  19. </uv-input>
  20. <template v-slot:right>
  21. <uv-icon name="eye-off-outline" color="#2979ff" size="18" v-show="!showpasswod1" @click="setshowpasswod1"></uv-icon>
  22. <uv-icon name="eye" color="#2979ff" size="18" v-show="showpasswod1" @click="setshowpasswod1"></uv-icon>
  23. </template>
  24. </uv-form-item>
  25. </uv-col>
  26. <uv-col span="10" offset="1" customStyle="margin-top: 20px">{{$t('password_repeat')}}</uv-col>
  27. <uv-col span="10" offset="1">
  28. <uv-form-item prop="pw2" borderBottom>
  29. <uv-input v-model.trim="logininfo.pw2" :type="passwordtype2" border="none">
  30. </uv-input>
  31. <template v-slot:right>
  32. <uv-icon name="eye-off-outline" color="#2979ff" size="18" v-show="!showpasswod2" @click="setshowpasswod2"></uv-icon>
  33. <uv-icon name="eye" color="#2979ff" size="18" v-show="showpasswod2" @click="setshowpasswod2"></uv-icon>
  34. </template>
  35. </uv-form-item>
  36. </uv-col>
  37. <uv-col span="10" offset="1">
  38. <uv-button type="primary" :text="$t('register')" customStyle="margin-top: 20px" @click="submit"></uv-button>
  39. </uv-col>
  40. </uv-form>
  41. <uv-col span="10" offset="1">
  42. <uv-button type="primary" :plain="true" :throttleTime="throttleTime" :text="$t('login')" customStyle="margin-top: 2rem" @click="toregister"></uv-button>
  43. </uv-col>
  44. </uv-col>
  45. </uv-row>
  46. </view>
  47. </view>
  48. </template>
  49. <script>
  50. import {register,login} from "@/common/api/user.js"
  51. export default {
  52. data() {
  53. return {
  54. throttleTime:1,
  55. logininfo:{
  56. telno:'',
  57. pw1:'',
  58. pw2:'',
  59. },
  60. rules:{
  61. 'telno':[{
  62. type: 'string',
  63. required: true,
  64. message: this.$t('telno_null'),
  65. trigger: ['blur'],
  66. },{
  67. pattern: /\d{5,}/,
  68. message: this.$t('telno_error'),
  69. trigger: ['blur'],
  70. }
  71. ],
  72. 'pw1': {
  73. type: 'string',
  74. required: true,
  75. message: this.$t('password_null'),
  76. trigger: ['blur']
  77. },
  78. 'pw2':[{
  79. type: 'string',
  80. required: true,
  81. message: this.$t('password_null'),
  82. trigger: ['blur']
  83. },{
  84. validator: (rule, value, callback) => {
  85. if(value!=this.logininfo.pw1){
  86. return false
  87. }
  88. return true
  89. },
  90. message: this.$t("password_repeat_error"),
  91. trigger: ['blur']
  92. }] ,
  93. },
  94. showpasswod1:false,
  95. passwordtype1:"password",
  96. showpasswod2:false,
  97. passwordtype2:"password"
  98. }
  99. },
  100. methods: {
  101. submit(){
  102. var that = this
  103. this.$refs.form.validate().then(res => {
  104. let data ={telno:that.logininfo.telno,userpw:that.logininfo.pw1}
  105. register(data).then(res=>{
  106. res=res.data
  107. if(0==res.code){
  108. that.$refs.toast.show({
  109. type: 'error',
  110. message: that.$t("register_error")
  111. })
  112. }
  113. if(200==res.code){
  114. let data={telno:that.logininfo.telno,pw:that.logininfo.pw1}
  115. login(data,that)
  116. }
  117. })
  118. }).catch(errors => {
  119. console.log(errors)
  120. })
  121. },
  122. setshowpasswod1(){
  123. this.showpasswod1 = !this.showpasswod1
  124. if(this.showpasswod1){
  125. this.passwordtype1="text"
  126. }else{
  127. this.passwordtype1="password"
  128. }
  129. },
  130. setshowpasswod2(){
  131. this.showpasswod2 = !this.showpasswod2
  132. if(this.showpasswod2){
  133. this.passwordtype2="text"
  134. }else{
  135. this.passwordtype2="password"
  136. }
  137. },
  138. tolgoin(){
  139. uni.navigateTo({
  140. url: '/pages/login/login'
  141. });
  142. }
  143. },
  144. mounted(){
  145. uni.setNavigationBarTitle({
  146. title: this.$t('register')
  147. });
  148. this.throttleTime = getApp().globalData.throttleTime;
  149. }
  150. }
  151. </script>
  152. <style>
  153. </style>