index.vue 2.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. <template>
  2. <div class="page_feedBack">
  3. <div class="feedBackTitle">
  4. <i class="iconfont icon-zuojiantou jiantou"></i>
  5. <span class="titleName">意见反馈</span>
  6. </div>
  7. <div class="feedBackTip">反馈内容</div>
  8. <div class="feedBox">
  9. <van-field
  10. v-model="message"
  11. rows="10"
  12. autosize
  13. type="textarea"
  14. maxlength="200"
  15. placeholder="请输入反馈信息..."
  16. show-word-limit
  17. />
  18. <div class="uploaderBox">
  19. <van-uploader v-model="fileList" multiple />
  20. </div>
  21. </div>
  22. <div class="feedBackTip">
  23. 联系方式(手机号)<span style="color:#FF5400">*</span>
  24. </div>
  25. <div>
  26. <van-field v-model="tel" type="tel" placeholder="请输入联系方式" />
  27. </div>
  28. <div>
  29. <div class="submitBtn">提交反馈</div>
  30. <!-- <div class="submitBtnSuccess">提交反馈</div> -->
  31. </div>
  32. </div>
  33. </template>
  34. <script>
  35. export default {
  36. data() {
  37. return {
  38. message: "",
  39. fileList: [],
  40. tel: ""
  41. };
  42. }
  43. };
  44. </script>
  45. <style lang="scss" scoped>
  46. .page_feedBack {
  47. height: 100%;
  48. overflow: hidden;
  49. overflow-y: auto;
  50. .feedBackTitle {
  51. background: #fff;
  52. padding: 0 1.125rem;
  53. height: 3.125rem;
  54. display: flex;
  55. align-items: center;
  56. }
  57. .jiantou {
  58. font-size: 1.5rem;
  59. font-weight: 600;
  60. margin-right: 7rem;
  61. }
  62. .titleName {
  63. font-size: 1.125rem;
  64. font-weight: 600;
  65. }
  66. .aboutImg {
  67. padding: 0 0.75rem;
  68. height: 10.0625rem;
  69. margin: 1rem 0 0.3125rem;
  70. img {
  71. width: 100%;
  72. height: 100%;
  73. }
  74. }
  75. .feedBackTip {
  76. height: 2.375rem;
  77. line-height: 2.375rem;
  78. padding-left: 0.75rem;
  79. font-size: 0.75rem;
  80. color: #696969;
  81. background: #eeeeee;
  82. }
  83. .feedBox {
  84. height: 20.875rem;
  85. .uploaderBox {
  86. margin: 1.25rem 0 0 1rem;
  87. }
  88. }
  89. .submitBtn {
  90. width: 80%;
  91. height: 2.75rem;
  92. line-height: 2.75rem;
  93. text-align: center;
  94. background: #c5c5c5;
  95. color: #fff;
  96. margin: 6.25rem auto 0;
  97. border-radius: 1.875rem;
  98. }
  99. .submitBtnSuccess {
  100. width: 80%;
  101. height: 2.75rem;
  102. line-height: 2.75rem;
  103. text-align: center;
  104. background: #338afb;
  105. color: #fff;
  106. margin: 6.25rem auto 0;
  107. border-radius: 1.875rem;
  108. }
  109. }
  110. ::-webkit-scrollbar {
  111. width: 0;
  112. }
  113. </style>