form.vue 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. <template>
  2. <view class="wrap">
  3. <uni-forms :modelValue="formData" :label-width="50" ref="form">
  4. <uni-forms-item label="标题" name="taskTitle" required>
  5. <uni-easyinput type="text" v-model="formData.taskTitle" placeholder="请输入标题" />
  6. </uni-forms-item>
  7. <uni-forms-item label="内容" name="taskContent" required>
  8. <uni-easyinput type="textarea" v-model="formData.taskContent" placeholder="请输入内容" />
  9. </uni-forms-item>
  10. </uni-forms>
  11. <button @click="submitForm" class="submit-bt">提交</button>
  12. </view>
  13. </template>
  14. <script>
  15. import {createMemory} from '@/api/user.js'
  16. export default {
  17. data() {
  18. return {
  19. rules: {
  20. taskTitle: {
  21. rules:[
  22. {
  23. required: true,
  24. errorMessage: '请填写标题',
  25. }
  26. ],
  27. label:'标题',
  28. validateTrigger:'submit'
  29. },
  30. taskContent: {
  31. rules:[
  32. {
  33. required: true,
  34. errorMessage: '请填写内容',
  35. }
  36. ],
  37. label:'内容',
  38. validateTrigger:'submit'
  39. }
  40. },
  41. formData:{
  42. taskTitle:"",
  43. taskContent:""
  44. }
  45. }
  46. },
  47. onReady() {
  48. this.$refs.form.setRules(this.rules)
  49. },
  50. methods: {
  51. submitForm(){
  52. let accountId=uni.getStorageSync('accountId')
  53. this.$refs.form.validate().then(res => {
  54. createMemory({
  55. ...res,
  56. accountId
  57. }).then((resq)=>{
  58. uni.showToast({
  59. title:"提交成功!",
  60. icon:"none"
  61. })
  62. setTimeout(()=>{
  63. uni.switchTab({
  64. url:'/pages/history/history'
  65. })
  66. },1000)
  67. })
  68. }).catch(err => {
  69. console.log('表单错误信息:', err);
  70. })
  71. }
  72. },
  73. onShareAppMessage() {
  74. return {
  75. title: '记忆',
  76. path: '/pages/index/index'
  77. }
  78. },
  79. onShareTimeline() {
  80. return {
  81. title: '记忆',
  82. path: '/pages/index/index'
  83. }
  84. }
  85. }
  86. </script>
  87. <style lang="scss" scoped>
  88. *{
  89. padding: 0;
  90. margin: 0;
  91. }
  92. .wrap{
  93. padding:20rpx;
  94. .submit-bt{
  95. width: 240rpx;
  96. height: 72rpx;
  97. line-height: 72rpx;
  98. text-align: center;
  99. background:#3D90F4;
  100. border-radius: 36rpx;
  101. font-size: 32rpx;
  102. font-family: PingFang SC;
  103. font-weight: 400;
  104. color: #FFFFFF;
  105. z-index: 999;
  106. float: right;
  107. }
  108. }
  109. </style>