|
|
@@ -1,409 +0,0 @@
|
|
|
-<!--
|
|
|
- 商城顾客售后申请详情 / 审核页
|
|
|
- 用途:mallRefundList 进入;样式对齐 ghs pagesOrder/refundDetail;待审核时可驳回或通过。
|
|
|
--->
|
|
|
-<template>
|
|
|
- <view class="refund-page">
|
|
|
- <view class="refund-card" v-if="info.id">
|
|
|
- <view class="refund-row">
|
|
|
- <view class="refund-label">退款状态</view>
|
|
|
- <view class="refund-value">
|
|
|
- <text :class="statusClass">{{ info.statusText || statusText }}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="refund-row">
|
|
|
- <view class="refund-label">订单信息</view>
|
|
|
- <view class="refund-value">
|
|
|
- <text class="refund-link refund-link--bold" @click="goOrder">{{ info.orderSn || '查看订单' }}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="refund-row">
|
|
|
- <view class="refund-label">退款方式</view>
|
|
|
- <view class="refund-value">{{ Number(info.refundType) === 1 ? '退货并退款' : '仅退款' }}</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="refund-section" v-if="!$util.isEmpty(productList)">
|
|
|
- <view class="refund-label refund-section__title">退货商品</view>
|
|
|
- <view class="refund-product-list">
|
|
|
- <view class="refund-product-item" v-for="(p, idx) in productList" :key="idx">
|
|
|
- <view class="refund-product-item__name">
|
|
|
- {{ p.name || ('商品' + p.productId) }}
|
|
|
- ¥{{ parseFloat(p.unitPrice) || 0 }}×{{ p.num }}{{ p.unitName || (p.property == 0 ? '份' : '') }}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="refund-row">
|
|
|
- <view class="refund-label">退款金额</view>
|
|
|
- <view class="refund-value">
|
|
|
- <text class="refund-amount">¥{{ parseFloat(info.refundPrice) || 0 }}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="refund-row">
|
|
|
- <view class="refund-label">申请时间</view>
|
|
|
- <view class="refund-value">{{ info.addTime ? String(info.addTime).substr(5, 11) : (info.addTime || '') }}</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="refund-row" v-if="info.auditAdminName">
|
|
|
- <view class="refund-label">审核人</view>
|
|
|
- <view class="refund-value">{{ info.auditAdminName }}</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="refund-row" v-if="info.auditTime">
|
|
|
- <view class="refund-label">审核时间</view>
|
|
|
- <view class="refund-value">{{ info.auditTime }}</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="refund-row refund-row--top" v-if="info.status == 2 && !$util.isEmpty(info.rejectReason)">
|
|
|
- <view class="refund-label">驳回原因</view>
|
|
|
- <view class="refund-value refund-value--multiline">{{ info.rejectReason }}</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="refund-row refund-row--top" v-if="!$util.isEmpty(info.remark)">
|
|
|
- <view class="refund-label">顾客备注</view>
|
|
|
- <view class="refund-value refund-value--multiline">{{ info.remark }}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="refund-actions">
|
|
|
- <button
|
|
|
- v-if="info.status == 0"
|
|
|
- class="admin-button-com big refund-actions__btn refund-actions__btn--pass"
|
|
|
- @click="askPass"
|
|
|
- >通过</button>
|
|
|
- <button
|
|
|
- v-if="info.status == 0"
|
|
|
- class="admin-button-com big refund-actions__btn refund-actions__btn--reject"
|
|
|
- @click="openReject"
|
|
|
- >驳回</button>
|
|
|
- <button class="admin-button-com big default refund-actions__btn" @click="goBack">返回</button>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 驳回原因弹层:样式对齐 ghs refund-popup -->
|
|
|
- <view class="reject-mask" v-if="showReject" @click="showReject = false">
|
|
|
- <view class="refund-popup" @click.stop="">
|
|
|
- <textarea
|
|
|
- v-model="rejectReason"
|
|
|
- class="refund-popup__textarea"
|
|
|
- placeholder="驳回原因..."
|
|
|
- placeholder-class="tui-placeholder"
|
|
|
- />
|
|
|
- <view class="refund-popup__btns">
|
|
|
- <button class="admin-button-com big default refund-popup__btn" @click="showReject = false">取消</button>
|
|
|
- <button class="admin-button-com big blue refund-popup__btn refund-popup__btn--confirm" @click="confirmReject">确认</button>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import { mallApplyDetail, mallApplyPass, mallApplyReject } from '@/api/refund'
|
|
|
-
|
|
|
-export default {
|
|
|
- name: 'mallRefundDetail',
|
|
|
- data() {
|
|
|
- return {
|
|
|
- info: {},
|
|
|
- productList: [],
|
|
|
- busy: false,
|
|
|
- showReject: false,
|
|
|
- rejectReason: ''
|
|
|
- }
|
|
|
- },
|
|
|
- computed: {
|
|
|
- /** 退款状态文案 */
|
|
|
- statusText() {
|
|
|
- const map = { 0: '待审核', 1: '已通过', 2: '已驳回', 3: '已取消' }
|
|
|
- return map[this.info.status] || ''
|
|
|
- },
|
|
|
- /** 退款状态样式,对齐 ghs */
|
|
|
- statusClass() {
|
|
|
- const classMap = {
|
|
|
- 0: 'refund-status refund-status--pending',
|
|
|
- 1: 'refund-status refund-status--pass',
|
|
|
- 2: 'refund-status refund-status--reject',
|
|
|
- 3: 'refund-status refund-status--cancel'
|
|
|
- }
|
|
|
- return classMap[this.info.status] || 'refund-status'
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- /** 拉取商城售后申请详情 */
|
|
|
- init() {
|
|
|
- const id = this.option.id
|
|
|
- if (!id) {
|
|
|
- return
|
|
|
- }
|
|
|
- uni.showLoading({ mask: true })
|
|
|
- mallApplyDetail({ id }).then(res => {
|
|
|
- uni.hideLoading()
|
|
|
- if (res.code != 1) {
|
|
|
- return
|
|
|
- }
|
|
|
- this.info = res.data || {}
|
|
|
- this.productList = this.info.productList || []
|
|
|
- }).catch(() => {
|
|
|
- uni.hideLoading()
|
|
|
- })
|
|
|
- },
|
|
|
- goOrder() {
|
|
|
- if (!this.info.orderId) {
|
|
|
- this.$msg('没有关联订单')
|
|
|
- return
|
|
|
- }
|
|
|
- this.$util.pageTo({ url: '/admin/order/detail?id=' + this.info.orderId })
|
|
|
- },
|
|
|
- goBack() {
|
|
|
- uni.navigateBack()
|
|
|
- },
|
|
|
- openReject() {
|
|
|
- this.showReject = true
|
|
|
- },
|
|
|
- askPass() {
|
|
|
- if (this.busy) {
|
|
|
- return
|
|
|
- }
|
|
|
- this.$util.confirmModal(
|
|
|
- { content: '确认通过并退款 ¥' + (parseFloat(this.info.refundPrice) || 0) + '?' },
|
|
|
- () => {
|
|
|
- this.doPass()
|
|
|
- }
|
|
|
- )
|
|
|
- },
|
|
|
- doPass() {
|
|
|
- this.busy = true
|
|
|
- uni.showLoading({ mask: true, title: '处理中' })
|
|
|
- mallApplyPass({ id: this.info.id }).then(res => {
|
|
|
- uni.hideLoading()
|
|
|
- this.busy = false
|
|
|
- if (res.code == 1) {
|
|
|
- this.$msg(res.msg || '已通过')
|
|
|
- this.init()
|
|
|
- }
|
|
|
- }).catch(() => {
|
|
|
- uni.hideLoading()
|
|
|
- this.busy = false
|
|
|
- })
|
|
|
- },
|
|
|
- confirmReject() {
|
|
|
- const reason = (this.rejectReason || '').trim()
|
|
|
- if (!reason) {
|
|
|
- this.$msg('请填写驳回原因')
|
|
|
- return
|
|
|
- }
|
|
|
- this.showReject = false
|
|
|
- this.doReject(reason)
|
|
|
- },
|
|
|
- doReject(reason) {
|
|
|
- this.busy = true
|
|
|
- uni.showLoading({ mask: true })
|
|
|
- mallApplyReject({ id: this.info.id, rejectReason: reason }).then(res => {
|
|
|
- uni.hideLoading()
|
|
|
- this.busy = false
|
|
|
- if (res.code == 1) {
|
|
|
- this.$msg(res.msg || '已驳回')
|
|
|
- this.rejectReason = ''
|
|
|
- this.init()
|
|
|
- }
|
|
|
- }).catch(() => {
|
|
|
- uni.hideLoading()
|
|
|
- this.busy = false
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
-/* 布局/色板对齐 ghsApp pagesOrder/refundDetail.vue */
|
|
|
-.refund-page {
|
|
|
- min-height: 100vh;
|
|
|
- padding: 24upx 24upx 40upx;
|
|
|
- background: #f5f7fa;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-
|
|
|
-.refund-card {
|
|
|
- background: #ffffff;
|
|
|
- border-radius: 16upx;
|
|
|
- padding: 8upx 24upx 24upx;
|
|
|
- box-shadow: 0 2upx 12upx rgba(0, 0, 0, 0.04);
|
|
|
-}
|
|
|
-
|
|
|
-.refund-row {
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- align-items: center;
|
|
|
- padding: 22upx 0;
|
|
|
- border-bottom: 1upx solid #f0f2f5;
|
|
|
-
|
|
|
- &:last-child {
|
|
|
- border-bottom: none;
|
|
|
- }
|
|
|
-
|
|
|
- &--top {
|
|
|
- align-items: flex-start;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.refund-label {
|
|
|
- width: 168upx;
|
|
|
- flex-shrink: 0;
|
|
|
- font-size: 28upx;
|
|
|
- color: #909399;
|
|
|
- line-height: 42upx;
|
|
|
-}
|
|
|
-
|
|
|
-.refund-value {
|
|
|
- flex: 1;
|
|
|
- min-width: 0;
|
|
|
- font-size: 28upx;
|
|
|
- color: #303133;
|
|
|
- line-height: 42upx;
|
|
|
-
|
|
|
- &--multiline {
|
|
|
- word-break: break-all;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.refund-amount {
|
|
|
- font-weight: 700;
|
|
|
- color: #fa3534;
|
|
|
-}
|
|
|
-
|
|
|
-.refund-link {
|
|
|
- font-size: 28upx;
|
|
|
- color: #3385ff;
|
|
|
- &--bold {
|
|
|
- font-weight: 700;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.refund-status {
|
|
|
- font-weight: 700;
|
|
|
-
|
|
|
- &--pending {
|
|
|
- color: #ff9900;
|
|
|
- }
|
|
|
-
|
|
|
- &--pass {
|
|
|
- color: #19be6b;
|
|
|
- }
|
|
|
-
|
|
|
- &--reject {
|
|
|
- color: #fa3534;
|
|
|
- }
|
|
|
-
|
|
|
- &--cancel {
|
|
|
- color: #909399;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.refund-section {
|
|
|
- padding: 22upx 0;
|
|
|
- border-bottom: 1upx solid #f0f2f5;
|
|
|
-
|
|
|
- &__title {
|
|
|
- margin-bottom: 16upx;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.refund-product-list {
|
|
|
- padding-left: 0;
|
|
|
-}
|
|
|
-
|
|
|
-.refund-product-item {
|
|
|
- padding: 12upx 16upx;
|
|
|
- margin-top: 12upx;
|
|
|
- background: #f7f9fc;
|
|
|
- border-radius: 12upx;
|
|
|
-
|
|
|
- &:first-child {
|
|
|
- margin-top: 0;
|
|
|
- }
|
|
|
-
|
|
|
- &__name {
|
|
|
- font-size: 32upx;
|
|
|
- color: #303133;
|
|
|
- line-height: 40upx;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.refund-actions {
|
|
|
- margin-top: 32upx;
|
|
|
- padding-bottom: 40upx;
|
|
|
-
|
|
|
- &__btn {
|
|
|
- width: 100%;
|
|
|
- margin: 0;
|
|
|
-
|
|
|
- & + & {
|
|
|
- margin-top: 20upx;
|
|
|
- }
|
|
|
-
|
|
|
- &--pass {
|
|
|
- background-color: #19be6b;
|
|
|
- border: 1upx solid #19be6b;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
-
|
|
|
- &--reject {
|
|
|
- background-color: #fa3534;
|
|
|
- border: 1upx solid #fa3534;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.reject-mask {
|
|
|
- position: fixed;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- top: 0;
|
|
|
- bottom: 0;
|
|
|
- background: rgba(0, 0, 0, 0.45);
|
|
|
- z-index: 99;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
-}
|
|
|
-
|
|
|
-.refund-popup {
|
|
|
- width: 86%;
|
|
|
- background: #fff;
|
|
|
- border-radius: 16upx;
|
|
|
- padding: 30upx;
|
|
|
- box-sizing: border-box;
|
|
|
-
|
|
|
- &__textarea {
|
|
|
- width: 100%;
|
|
|
- box-sizing: border-box;
|
|
|
- border: 1upx solid #dcdfe6;
|
|
|
- border-radius: 12upx;
|
|
|
- height: 160upx;
|
|
|
- padding: 16upx;
|
|
|
- font-size: 28upx;
|
|
|
- }
|
|
|
-
|
|
|
- &__btns {
|
|
|
- display: flex;
|
|
|
- flex-direction: row;
|
|
|
- justify-content: center;
|
|
|
- margin-top: 30upx;
|
|
|
- }
|
|
|
-
|
|
|
- &__btn {
|
|
|
- width: 45%;
|
|
|
- margin: 0;
|
|
|
-
|
|
|
- &--confirm {
|
|
|
- margin-left: 24upx;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|