tousujianyi.wxml 3.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <view class="container4">
  2. <!-- 返回按钮 -->
  3. <view class="custom-nav">
  4. <view class="fixed-back" bindtap="goBack">←</view>
  5. <view class="nav-title">投诉建议</view>
  6. </view>
  7. <!-- 第一个卡片:分类、联系人、联系电话 -->
  8. <view class="bill-card first-card">
  9. <view class="bill-row">
  10. <text>分类</text>
  11. <view class="radio-group" wx:if="{{!isPreviewMode}}">
  12. <radio-group bindchange="radioChange">
  13. <label class="radio">
  14. <radio value="投诉" checked="{{category === '投诉'}}" />投诉
  15. </label>
  16. <label class="radio">
  17. <radio value="建议" checked="{{category === '建议'}}" />建议
  18. </label>
  19. </radio-group>
  20. </view>
  21. <view wx:else class="preview-text">{{category || '投诉'}}</view>
  22. </view>
  23. <view class="divider"></view>
  24. <view class="bill-row">
  25. <text>联系人<text class="required" wx:if="{{!isPreviewMode}}">*</text></text>
  26. <input class="input-right input-text" placeholder="请输入" placeholder-class="placeholder-style" bindinput="inputContact" value="{{contact}}" data-field="contact" disabled="{{isPreviewMode}}" />
  27. </view>
  28. <view class="divider"></view>
  29. <view class="bill-row">
  30. <text>联系电话<text class="required" wx:if="{{!isPreviewMode}}">*</text></text>
  31. <input class="input-right input-text" placeholder="请输入" placeholder-class="placeholder-style" bindinput="inputPhone" value="{{phone}}" type="number" maxlength="11" data-field="phone" disabled="{{isPreviewMode}}" />
  32. </view>
  33. </view>
  34. <!-- 第三个卡片:内容说明 -->
  35. <view class="bill-card">
  36. <view class="card-title">内容说明<text class="required" wx:if="{{!isPreviewMode}}">*</text></view>
  37. <view class="solid-divider"></view>
  38. <view class="fault-description">
  39. <textarea class="input-text" placeholder="请输入描述说明..." placeholder-class="placeholder-style" bindinput="inputDescription" value="{{description || content}}" data-field="description" disabled="{{isPreviewMode}}"></textarea>
  40. </view>
  41. <view class="upload-section">
  42. <view class="upload-btn-container solid-border" wx:if="{{!isPreviewMode && imageList.length < 10}}">
  43. <view class="upload-btn" bindtap="chooseImage">
  44. <view class="plus-icon">+</view>
  45. </view>
  46. </view>
  47. <view class="image-preview" wx:if="{{imageList.length > 0}}">
  48. <block wx:for="{{imageList}}" wx:key="index">
  49. <view class="image-item">
  50. <image src="{{item.tempFilePath}}" mode="aspectFill" bindtap="previewImage" data-index="{{index}}"></image>
  51. <view class="delete-icon" catchtap="deleteImage" data-index="{{index}}" wx:if="{{!isPreviewMode}}">×</view>
  52. </view>
  53. </block>
  54. </view>
  55. </view>
  56. <view class="upload-tip" wx:if="{{imageList.length < 10 && !isPreviewMode}}">
  57. 最多可上传10张图片,单张不超过10M
  58. </view>
  59. </view>
  60. <!-- 回复信息卡片,仅在预览模式下显示 -->
  61. <view class="bill-card" wx:if="{{isPreviewMode && replyContent}}">
  62. <view class="bill-rownew">
  63. <text>回复时间</text>
  64. <view class="reply-timenew">{{replyTime}}</view>
  65. </view>
  66. <view class="solid-divider"></view>
  67. <view class="card-title">回复说明</view>
  68. <view class="solid-divider"></view>
  69. <view class="reply-content">{{replyContent}}</view>
  70. </view>
  71. <!-- 回复信息区域,根据showReplyInfo控制显示 -->
  72. <view class="reply-section" wx:if="{{showReplyInfo}}">
  73. <view class="reply-title">回复信息</view>
  74. <view class="reply-time">回复时间:{{replyTime}}</view>
  75. <view class="reply-content">{{replyContent}}</view>
  76. </view>
  77. <!-- 提交按钮,仅在非预览模式下显示 -->
  78. <button class="submit-btn" bindtap="submitForm" wx:if="{{!isPreviewMode}}">提交</button>
  79. </view>