init

miniprogram/pages/refund/refund-detail/index.wxss

@@ -0,0 +1,299 @@
+/* pages/refund/refund-detail/index.wxss */
+.refund-detail {
+  background-color: #f5f5f5;
+  min-height: 100vh;
+  padding-bottom: 120rpx;
+}
+
+/* 状态部分 */
+.status-section {
+  background-color: #fff;
+  padding: 48rpx 32rpx;
+  display: flex;
+  align-items: center;
+  margin-bottom: 24rpx;
+}
+
+.status-icon {
+  width: 80rpx;
+  height: 80rpx;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 32rpx;
+}
+
+.status-icon.pending {
+  background-color: #fff3cd;
+}
+
+.status-icon.approved {
+  background-color: #d1ecf1;
+}
+
+.status-icon.rejected {
+  background-color: #f8d7da;
+}
+
+.status-icon.completed {
+  background-color: #d4edda;
+}
+
+.icon-text {
+  font-size: 32rpx;
+  font-weight: 600;
+}
+
+.status-icon.pending .icon-text {
+  color: #856404;
+}
+
+.status-icon.approved .icon-text {
+  color: #0c5460;
+}
+
+.status-icon.rejected .icon-text {
+  color: #721c24;
+}
+
+.status-icon.completed .icon-text {
+  color: #155724;
+}
+
+.status-info {
+  flex: 1;
+}
+
+.status-text {
+  display: block;
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #333;
+  margin-bottom: 8rpx;
+}
+
+.status-desc {
+  font-size: 26rpx;
+  color: #666;
+}
+
+/* 信息部分 */
+.info-section {
+  background-color: #fff;
+  margin-bottom: 24rpx;
+  padding: 32rpx;
+}
+
+.section-title {
+  font-size: 30rpx;
+  font-weight: 600;
+  color: #333;
+  margin-bottom: 24rpx;
+  padding-bottom: 16rpx;
+  border-bottom: 1rpx solid #eee;
+}
+
+.info-item {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16rpx 0;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.info-item:last-child {
+  border-bottom: none;
+}
+
+.info-label {
+  font-size: 28rpx;
+  color: #666;
+}
+
+.info-value {
+  font-size: 28rpx;
+  color: #333;
+}
+
+.info-value.amount {
+  color: #ff6b35;
+  font-weight: 600;
+  font-size: 32rpx;
+}
+
+/* 订单卡片 */
+.order-card {
+  border: 1rpx solid #eee;
+  border-radius: 12rpx;
+  padding: 24rpx;
+  background-color: #fafafa;
+}
+
+.order-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 16rpx;
+}
+
+.order-no {
+  font-size: 28rpx;
+  color: #333;
+  font-weight: 500;
+}
+
+.order-status {
+  font-size: 24rpx;
+  color: #666;
+  padding: 4rpx 12rpx;
+  background-color: #e9ecef;
+  border-radius: 6rpx;
+}
+
+.order-amount {
+  display: flex;
+  align-items: center;
+}
+
+.amount-label {
+  font-size: 26rpx;
+  color: #666;
+  margin-right: 16rpx;
+}
+
+.amount-value {
+  font-size: 28rpx;
+  color: #ff6b35;
+  font-weight: 600;
+}
+
+/* 原因和备注内容 */
+.reason-content,
+.remark-content {
+  padding: 24rpx;
+  background-color: #f8f9fa;
+  border-radius: 12rpx;
+  font-size: 28rpx;
+  color: #333;
+  line-height: 1.6;
+}
+
+/* 进度列表 */
+.progress-list {
+  position: relative;
+}
+
+.progress-item {
+  display: flex;
+  padding: 24rpx 0;
+  position: relative;
+}
+
+.progress-item:not(:last-child)::after {
+  content: '';
+  position: absolute;
+  left: 15rpx;
+  top: 60rpx;
+  bottom: -24rpx;
+  width: 2rpx;
+  background-color: #dee2e6;
+}
+
+.progress-item.current .progress-dot {
+  background-color: #ff6b35;
+  border-color: #ff6b35;
+}
+
+.progress-item.current::after {
+  background-color: #ff6b35;
+}
+
+.progress-dot {
+  width: 32rpx;
+  height: 32rpx;
+  border-radius: 50%;
+  background-color: #dee2e6;
+  border: 4rpx solid #dee2e6;
+  margin-right: 24rpx;
+  flex-shrink: 0;
+  margin-top: 8rpx;
+}
+
+.progress-content {
+  flex: 1;
+}
+
+.progress-title {
+  font-size: 28rpx;
+  color: #333;
+  font-weight: 500;
+  margin-bottom: 8rpx;
+}
+
+.progress-time {
+  font-size: 24rpx;
+  color: #999;
+  margin-bottom: 8rpx;
+}
+
+.progress-remark {
+  font-size: 26rpx;
+  color: #666;
+  line-height: 1.5;
+}
+
+/* 操作按钮 */
+.action-section {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: #fff;
+  padding: 24rpx 32rpx;
+  border-top: 1rpx solid #eee;
+  display: flex;
+  gap: 24rpx;
+}
+
+.action-btn {
+  flex: 1;
+  padding: 24rpx 0;
+  text-align: center;
+  border-radius: 12rpx;
+  font-size: 28rpx;
+  font-weight: 500;
+}
+
+.action-btn.primary {
+  background-color: #ff6b35;
+  color: #fff;
+}
+
+.action-btn.secondary {
+  background-color: #f8f9fa;
+  color: #666;
+  border: 1rpx solid #dee2e6;
+}
+
+/* 加载和错误状态 */
+.loading-state,
+.error-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 120rpx 32rpx;
+  font-size: 28rpx;
+  color: #999;
+}
+
+.retry-btn {
+  margin-top: 32rpx;
+  padding: 16rpx 32rpx;
+  background-color: #ff6b35;
+  color: #fff;
+  border: none;
+  border-radius: 8rpx;
+  font-size: 26rpx;
+}