refund-confirm-popup.wxml 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. <t-popup
  2. placement="bottom"
  3. visible="{{visible}}"
  4. show-overlay="{{true}}"
  5. close-on-overlay-click="{{true}}"
  6. bind:visible-change="onPopupVisibleChange"
  7. >
  8. <view class="refund-confirm-popup">
  9. <view class="refund-confirm-popup__header">
  10. <view class="title">确认退款信息</view>
  11. <text class="refund-confirm-popup__close" catchtap="onClose">×</text>
  12. <view class="refund-confirm-popup__header-spacer" />
  13. </view>
  14. <view class="refund-confirm-popup__content">
  15. <view class="goods-card">
  16. <image class="goods-card__icon" src="{{goodsImage}}" mode="aspectFill" wx:if="{{goodsImage}}" />
  17. <view class="goods-card__icon" wx:else />
  18. <view class="goods-card__main">
  19. <view class="goods-card__name">{{goodsName}}</view>
  20. <view class="goods-card__meta">{{goodsMeta1}}</view>
  21. </view>
  22. <view class="goods-card__right">
  23. <view class="goods-card__price">¥{{goodsPrice || '0.00'}}</view>
  24. <view class="goods-card__count">{{goodsMeta2}}</view>
  25. </view>
  26. </view>
  27. <view class="form-row" wx:if="{{showReceiptStatus}}">
  28. <text class="label">商品状态</text>
  29. <view class="value select" bindtap="onOpenStatusPicker">
  30. {{statusLabel}}
  31. <t-icon name="chevron-right" class="arrow-icon" size="30rpx" color="#b0b0b0" />
  32. </view>
  33. </view>
  34. <view class="form-row" catchtap="onEditReason">
  35. <text class="label">退款原因</text>
  36. <view class="value link">
  37. {{refundReason || '请选择'}}
  38. <t-icon name="chevron-right" class="arrow-icon" size="30rpx" color="#b0b0b0" />
  39. </view>
  40. </view>
  41. <view class="divider"></view>
  42. <view class="form-row" catchtap="onEditAmount">
  43. <text class="label amount-title">退款金额</text>
  44. <view class="value link">
  45. <t-icon name="edit" class="edit-icon" size="28rpx" color="#b0b0b0" />
  46. 修改
  47. </view>
  48. </view>
  49. <view class="form-row">
  50. <text class="label">退回微信</text>
  51. <view class="value amount">¥{{refundAmount}}</view>
  52. </view>
  53. <view class="form-row" catchtap="onEditProof">
  54. <text class="label">上传描述和凭证<text style="color:red">*</text></text>
  55. <view class="value link red">
  56. {{proofImages.length ? '已上传' + proofImages.length + '张' : '上传有助处理退款'}}
  57. <t-icon name="chevron-right" class="arrow-icon" size="30rpx" color="#b0b0b0" />
  58. </view>
  59. </view>
  60. </view>
  61. <view class="refund-confirm-popup__footer">
  62. <view class="refund-amount-line"><text>退回微信¥</text><text class="wechat-price">{{refundAmount}}</text></view>
  63. <view class="submit-btn" bindtap="onSubmit">提交申请</view>
  64. </view>
  65. </view>
  66. </t-popup>
  67. <t-picker
  68. visible="{{statusPickerVisible}}"
  69. value="{{statusPickerValue}}"
  70. title=""
  71. use-popup="{{true}}"
  72. header="{{true}}"
  73. cancel-btn="取消"
  74. confirm-btn="确定"
  75. bind:change="onStatusPickerChange"
  76. bind:close="onStatusPickerClose"
  77. z-index="12000"
  78. style="--td-picker-z-index: 12000; --td-popup-z-index: 12000;"
  79. >
  80. <t-picker-item options="{{statusPickerOptions}}" />
  81. </t-picker>
  82. <t-popup
  83. placement="center"
  84. visible="{{amountEditorVisible}}"
  85. show-overlay="{{true}}"
  86. close-on-overlay-click="{{true}}"
  87. bind:visible-change="onAmountPopupVisibleChange"
  88. z-index="12000"
  89. style="--td-popup-z-index: 12000;"
  90. >
  91. <view class="amount-popup">
  92. <view class="amount-popup__header">
  93. <view class="title">请输入退款总金额</view>
  94. </view>
  95. <view class="amount-popup__body">
  96. <view class="hint">最高可退¥{{maxAmount}}元</view>
  97. <input class="amount-input" type="digit" value="{{amountInput}}" bindinput="onAmountInput" />
  98. <view class="actions">
  99. <view class="action-item">
  100. <t-button class="action-btn" block size="medium" variant="outline" theme="primary" catchtap="onAmountClose">取消</t-button>
  101. </view>
  102. <view class="action-item">
  103. <t-button class="action-btn confirm-btn" block size="medium" theme="primary" catchtap="onAmountConfirm">确定</t-button>
  104. </view>
  105. </view>
  106. </view>
  107. </view>
  108. </t-popup>