opinion1.vue 2.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <template style=" background-color: #FFFFFF">
  2. <view style="height: 100%;width: 100%;background-color: #FFFFFF">
  3. <view style="width: 100vw;height: 100vh;">
  4. <view style="height: 20rpx;w^idth: 100%;background-color: #F6F6F6;"></view>
  5. <!-- 标题 -->
  6. <view class="title">请描述您遇到的问题</view>
  7. <!-- 问题列表 -->
  8. <view class="textArea">
  9. <view class="body">
  10. <textarea placeholder="请描述您遇到的问题" maxlength="200" @input="input" style="font-size: 28rpx;color: #666666;height: 250rpx;width: 100%;" />
  11. <view style="height: 68rpx;width: 100%;color:#999999;padding: 20rpx 30rpx;font-size: 28rpx;text-align: right;">
  12. {{problem_lenght}}/200
  13. </view>
  14. </view>
  15. </view>
  16. <view style="width: 100%;padding:40rpx 30rpx 0 30rpx;font-size: 26rpx;color: #999999;">请详细描述您的问题或建议,我们将及时跟你并解决。</view>
  17. <view class="footer">
  18. <view style="width: 100%;text-align: center;padding-bottom: 35rpx;">
  19. <text style="color: #999999;font-size: 24rpx;">如有疑问,请联系客服\n08:30-22:00</text>
  20. </view>
  21. <view class="cu-bar bg-white tabbar border shop" style="width: 100%;">
  22. <view class="submit" @click="next" style="background-color: #0B73B9; color: #FFFFFF; font-size: 32rpx;" >提交反馈</view>
  23. </view>
  24. </view>
  25. </view>
  26. </view>
  27. </template>
  28. <script>
  29. export default {
  30. data() {
  31. return {
  32. problem:'',
  33. problem_lenght:'0'
  34. }
  35. },
  36. methods:{
  37. //输入问题
  38. input(e){
  39. this.problem = e.detail.value
  40. this.problem_lenght = this.problem.length
  41. console.log(this.problem);
  42. console.log(this.problem_lenght);
  43. },
  44. next(e){
  45. // uni.navigateTo({
  46. // url:'/pages/common_tools/help_feedback/opinion1'
  47. // })
  48. }
  49. }
  50. }
  51. </script>
  52. <style lang="scss">
  53. .title {
  54. background-color: #FFFFFF;
  55. height: auto;
  56. display: flex;
  57. align-items: center;
  58. padding: 30rpx 30rpx;
  59. font-size: 30rpx;
  60. font-weight: bold;
  61. }
  62. .textArea {
  63. height: auto;
  64. width: 100%;
  65. padding: 0 30rpx;
  66. background-color: #FFFFFF;
  67. .body {
  68. width: 100%;
  69. height: auto;
  70. padding: 35rpx 20rpx;
  71. word-break: break-all;
  72. word-wrap: break-word;
  73. background: #F6F6F6;
  74. border-radius: 10rpx;
  75. }
  76. }
  77. .footer {
  78. width: 100%;
  79. height: auto;
  80. display: block;
  81. position: fixed;
  82. bottom: 0;
  83. }
  84. </style>