index.vue 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. <template>
  2. <view class="content">
  3. <view class="row row-bottom">
  4. <view class="left">字段1</view>
  5. <input v-model='param.filed1' class="right-bottom"
  6. placeholder="请输入字段1"></input>
  7. </view>
  8. <view class="row row-bottom">
  9. <view class="left">字段2</view>
  10. <input v-model='param.filed2' class="right-bottom"
  11. placeholder="请输入字段2"></input>
  12. </view>
  13. <view class="bottom-btn">
  14. <button type="primary" class="submit" hover-class="none" @click="submit()">提交</button>
  15. </view>
  16. </view>
  17. </template>
  18. <script>
  19. export default {
  20. data() {
  21. return {
  22. title: 'Hello',
  23. param:{
  24. filed1:'',
  25. filed2:'',
  26. }
  27. }
  28. },
  29. onLoad() {
  30. },
  31. methods: {
  32. submit(){
  33. uni.request({
  34. url: 'http://localhost:8888/v1/testTable',
  35. method: 'POST',
  36. data:this.param,
  37. success: (res) => {
  38. console.log(res)
  39. }
  40. })
  41. }
  42. }
  43. }
  44. </script>
  45. <style scoped lang="scss">
  46. .content,
  47. .content1,
  48. .content2 {
  49. border-radius: 20rpx;
  50. background: white;
  51. padding: 20rpx;
  52. .title {
  53. font-size: 28rpx;
  54. font-weight: 600;
  55. color: #333333;
  56. }
  57. .row {
  58. display: flex;
  59. justify-content: space-between;
  60. border-bottom: 1px solid #EEEEEE;
  61. padding: 21rpx 0;
  62. .right,
  63. input {
  64. font-size: 28rpx;
  65. color: #333333;
  66. }
  67. }
  68. .row-bottom {
  69. // border: 0;
  70. .right-bottom {
  71. width: 280rpx;
  72. text-align: right;
  73. }
  74. }
  75. }
  76. .right-bottom {
  77. width: 280rpx;
  78. text-align: right;
  79. }
  80. .logo {
  81. height: 200rpx;
  82. width: 200rpx;
  83. margin-top: 200rpx;
  84. margin-left: auto;
  85. margin-right: auto;
  86. margin-bottom: 50rpx;
  87. }
  88. .text-area {
  89. display: flex;
  90. justify-content: center;
  91. }
  92. .title {
  93. font-size: 36rpx;
  94. color: #8f8f94;
  95. }
  96. .bottom-btn {
  97. padding: 30rpx;
  98. background: #FFFFFF;
  99. width: 92%;
  100. position: fixed;
  101. bottom: 0rpx;
  102. display: flex;
  103. z-index: 9999;
  104. }
  105. </style>