upPassword.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. <template>
  2. <mobile-frame :frameStyle="frameStyle" @toPath="toPath">
  3. <view class="main">
  4. <view class="one">
  5. <uni-forms ref="form" :modelValue="form" :rules="rules" label-width="auto">
  6. <uni-forms-item label="用户账号" name="name">
  7. <uni-easyinput type="text" v-model="form.name" placeholder="请输入用户账号" disabled />
  8. </uni-forms-item>
  9. <uni-forms-item label="新密码" name="password">
  10. <uni-easyinput type="password" v-model="form.password" placeholder="请输入新密码" />
  11. </uni-forms-item>
  12. <uni-forms-item label="确认密码" name="password">
  13. <uni-easyinput type="password" v-model="form.password" placeholder="请输入确认密码" />
  14. </uni-forms-item>
  15. </uni-forms>
  16. <view class="btn">
  17. <button type="primary" @click="onSubmit('form')" size="small">提交</button>
  18. <view class="name">提示:为了您的账户安全,建议定期修改密码</view>
  19. </view>
  20. </view>
  21. </view>
  22. </mobile-frame>
  23. </template>
  24. <script>
  25. export default {
  26. data() {
  27. return {
  28. frameStyle: {
  29. useBar: false
  30. },
  31. form: {},
  32. rules: {
  33. password: {
  34. rules: [{
  35. required: true,
  36. errorMessage: '请输入密码',
  37. }]
  38. },
  39. },
  40. };
  41. },
  42. onLoad: function(e) {
  43. console.log(e);
  44. },
  45. onShow: function() {},
  46. methods: {
  47. toPath(e) {
  48. if (e && e.route) uni.redirectTo({
  49. url: `/${e.route}`
  50. })
  51. },
  52. // 提交保存
  53. onSubmit() {
  54. const that = this;
  55. let data = that.form;
  56. data = {
  57. ...data,
  58. }
  59. console.log(data);
  60. // this.$refs.form.validate().then(async (res) => {
  61. // let arr;
  62. // if (data._id) {
  63. // arr = await that.$api(``, 'POST', data)
  64. // } else {
  65. // arr = await that.$api(``, 'POST', data)
  66. // }
  67. // if (arr.errcode == '0') {
  68. // uni.showToast({
  69. // title: `维护信息成功`,
  70. // icon: 'success',
  71. // duration: 2000
  72. // });
  73. // that.back()
  74. // } else {
  75. // uni.showToast({
  76. // title: arr.errmsg,
  77. // icon: 'error',
  78. // duration: 2000
  79. // })
  80. // }
  81. // })
  82. },
  83. }
  84. }
  85. </script>
  86. <style lang="scss">
  87. .main {
  88. display: flex;
  89. flex-direction: column;
  90. width: 100vw;
  91. height: 100vh;
  92. .one {
  93. padding: 2vw;
  94. .uni-input {
  95. border: #f1f1ff 1px solid;
  96. padding: 2vw 2vw;
  97. border-radius: 1vw;
  98. }
  99. .btn {
  100. text-align: center;
  101. button {
  102. margin: 0 2vw 2vw 2vw;
  103. background-color: var(--ff0Color);
  104. color: var(--fffColor);
  105. }
  106. .name {
  107. color: var(--f85Color);
  108. font-size: var(--font14Size);
  109. }
  110. }
  111. }
  112. }
  113. .uni-forms-item {
  114. margin-bottom: 6vw !important;
  115. display: flex;
  116. flex-direction: row;
  117. }
  118. </style>