129 lines
4.2 KiB
Plaintext
129 lines
4.2 KiB
Plaintext
<!--pages/refund/refund-apply/index.wxml-->
|
||
<view class="refund-apply-page">
|
||
<!-- 页面标题 -->
|
||
<view class="page-header">
|
||
<text class="page-title">{{isReapply ? '重新申请退款' : '申请退款'}}</text>
|
||
</view>
|
||
|
||
<!-- 订单信息 -->
|
||
<view class="order-section" wx:if="{{orderDetail}}">
|
||
<view class="section-title">订单信息</view>
|
||
<view class="order-card" bindtap="onOrderTap">
|
||
<view class="order-header">
|
||
<text class="order-no">订单号：{{orderDetail.orderNo}}</text>
|
||
<text class="order-status">{{orderDetail.statusText}}</text>
|
||
</view>
|
||
<view class="order-amount">
|
||
<text class="amount-label">订单金额：</text>
|
||
<text class="amount-value">¥{{orderDetail.totalAmount}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 退款金额 -->
|
||
<view class="amount-section">
|
||
<view class="section-title">退款金额</view>
|
||
<view class="amount-input-wrapper">
|
||
<text class="currency-symbol">¥</text>
|
||
<input
|
||
class="amount-input"
|
||
type="digit"
|
||
placeholder="请输入退款金额"
|
||
value="{{refundAmount}}"
|
||
bindinput="onAmountInput"
|
||
maxlength="10"
|
||
/>
|
||
</view>
|
||
<view class="amount-tips">
|
||
<text class="tips-text">最多可退款：¥{{maxRefundAmount}}</text>
|
||
<text class="quick-fill" bindtap="onQuickFillAmount">全额退款</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 退款原因 -->
|
||
<view class="reason-section">
|
||
<view class="section-title">退款原因</view>
|
||
<view class="reason-options">
|
||
<view
|
||
class="reason-option {{selectedReason === item.value ? 'selected' : ''}}"
|
||
wx:for="{{reasonOptions}}"
|
||
wx:key="value"
|
||
bindtap="onReasonSelect"
|
||
data-value="{{item.value}}"
|
||
>
|
||
<text class="reason-text">{{item.label}}</text>
|
||
<view class="reason-check {{selectedReason === item.value ? 'checked' : ''}}">
|
||
<text class="check-icon" wx:if="{{selectedReason === item.value}}">✓</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 自定义原因输入 -->
|
||
<view class="custom-reason" wx:if="{{selectedReason === 'other'}}">
|
||
<textarea
|
||
class="reason-textarea"
|
||
placeholder="请详细说明退款原因"
|
||
value="{{customReason}}"
|
||
bindinput="onCustomReasonInput"
|
||
maxlength="200"
|
||
show-confirm-bar="{{false}}"
|
||
/>
|
||
<view class="char-count">{{customReason.length}}/200</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 退款说明 -->
|
||
<view class="description-section">
|
||
<view class="section-title">退款说明（选填）</view>
|
||
<textarea
|
||
class="description-textarea"
|
||
placeholder="请详细描述退款原因，有助于快速处理"
|
||
value="{{description}}"
|
||
bindinput="onDescriptionInput"
|
||
maxlength="500"
|
||
show-confirm-bar="{{false}}"
|
||
/>
|
||
<view class="char-count">{{description.length}}/500</view>
|
||
</view>
|
||
|
||
<!-- 提交按钮 -->
|
||
<view class="submit-section">
|
||
<button
|
||
class="submit-btn {{canSubmit ? 'enabled' : 'disabled'}}"
|
||
bindtap="onSubmit"
|
||
disabled="{{!canSubmit || submitting}}"
|
||
>
|
||
{{submitting ? '提交中...' : (isReapply ? '重新提交' : '提交申请')}}
|
||
</button>
|
||
</view>
|
||
|
||
<!-- 温馨提示 -->
|
||
<view class="tips-section">
|
||
<view class="tips-title">温馨提示</view>
|
||
<view class="tips-content">
|
||
<text class="tip-item">• 退款申请提交后，我们将在1-3个工作日内处理</text>
|
||
<text class="tip-item">• 退款金额将原路返回到您的支付账户</text>
|
||
<text class="tip-item">• 如有疑问，请联系客服：400-123-4567</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 加载状态 -->
|
||
<view class="loading-wrapper" wx:if="{{loading}}">
|
||
<view class="loading-content">
|
||
<view class="loading-spinner"></view>
|
||
<text class="loading-text">加载中...</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 错误状态 -->
|
||
<view class="error-wrapper" wx:if="{{error}}">
|
||
<view class="error-content">
|
||
<text class="error-icon">⚠️</text>
|
||
<text class="error-text">{{error}}</text>
|
||
<button class="retry-btn" bindtap="onRetry">重试</button>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- Toast组件 -->
|
||
<t-toast id="t-toast" />
|
||
</view> |