优化提现订单跳转与按钮样式

This commit is contained in:
yml2213
2026-08-16 20:08:19 +08:00
parent 58f11b2043
commit f48da14ed2
5 changed files with 84 additions and 15 deletions
@@ -14,6 +14,7 @@ const router = useRouter()
const props = defineProps<{ const props = defineProps<{
modelValue: boolean modelValue: boolean
withdrawal: WithdrawalDetail | null withdrawal: WithdrawalDetail | null
returnQuery?: Record<string, string>
}>() }>()
const emit = defineEmits<{ const emit = defineEmits<{
@@ -29,7 +30,10 @@ function goToOwnerOrders() {
const keyword = props.withdrawal.user_phone?.trim() || String(props.withdrawal.user_id || '') const keyword = props.withdrawal.user_phone?.trim() || String(props.withdrawal.user_id || '')
void router.push({ void router.push({
path: adminPath('orders'), path: adminPath('orders'),
query: keyword ? { keyword } : {}, query: {
...props.returnQuery,
...(keyword ? { keyword } : {}),
},
}) })
} }
@@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { Refresh, Search } from '@element-plus/icons-vue' import { ArrowLeft, Refresh, Search } from '@element-plus/icons-vue'
import { onMounted, reactive, ref } from 'vue' import { computed, onMounted, reactive, ref } from 'vue'
import { useRoute } from 'vue-router' import { useRoute, useRouter } from 'vue-router'
import { fetchAdminOrders, type AdminOrderQuery, type Order } from '@/features/orders' import { fetchAdminOrders, type AdminOrderQuery, type Order } from '@/features/orders'
import { import {
@@ -29,6 +29,8 @@ const total = ref(0)
const currentPage = ref(1) const currentPage = ref(1)
const currentPageSize = ref(20) const currentPageSize = ref(20)
const route = useRoute() const route = useRoute()
const router = useRouter()
const canReturnToWithdrawals = computed(() => route.query.from === 'withdrawals')
const orderStatusOptions = [ const orderStatusOptions = [
{ label: '待支付', value: 'pending_payment' }, { label: '待支付', value: 'pending_payment' },
@@ -121,6 +123,23 @@ function resetFilters() {
void queryOrders() void queryOrders()
} }
function returnToWithdrawals() {
const query: Record<string, string> = {}
const returnQueryKeys = [
'withdrawal_status',
'withdrawal_user_id',
'withdrawal_page',
'withdrawal_page_size',
] as const
for (const key of returnQueryKeys) {
const value = route.query[key]
if (typeof value === 'string' && value) query[key] = value
}
void router.push({ path: adminPath('withdrawals'), query })
}
function amountYuan(cent: unknown) { function amountYuan(cent: unknown) {
if (cent !== undefined && cent !== null) return centToYuan(Number(cent || 0)) if (cent !== undefined && cent !== null) return centToYuan(Number(cent || 0))
return 0 return 0
@@ -148,6 +167,9 @@ function isPlatformManaged(row: Order) {
<p>查看全量订单交接状态金额和结算状态</p> <p>查看全量订单交接状态金额和结算状态</p>
</div> </div>
<div class="toolbar-actions"> <div class="toolbar-actions">
<el-button v-if="canReturnToWithdrawals" :icon="ArrowLeft" @click="returnToWithdrawals">
返回提现审核
</el-button>
<el-button :icon="Refresh" @click="loadOrders">刷新</el-button> <el-button :icon="Refresh" @click="loadOrders">刷新</el-button>
</div> </div>
</div> </div>
@@ -1037,12 +1037,12 @@ function formatConfigValue(row: SystemConfig) {
overflow-wrap: anywhere; overflow-wrap: anywhere;
} }
/* 按钮文字清晰度优化 */ /* 仅实体主按钮提升文字清晰度,其他按钮保持组件默认配色。 */
:deep(.el-button--primary) { :deep(.el-button--primary:not(.is-plain):not(.is-dashed):not(.is-text):not(.is-link)) {
font-weight: 700; font-weight: 700;
} }
:deep(.el-button--primary span) { :deep(.el-button--primary:not(.is-plain):not(.is-dashed):not(.is-text):not(.is-link) span) {
color: #ffffff !important; color: #ffffff !important;
text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
font-weight: 700; font-weight: 700;
@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref } from 'vue' import { computed, onMounted, ref } from 'vue'
import { useRouter } from 'vue-router' import { useRoute, useRouter } from 'vue-router'
import { ElMessage, ElMessageBox } from 'element-plus' import { ElMessage, ElMessageBox } from 'element-plus'
import { import {
@@ -14,6 +14,7 @@ import { adminPath } from '@/shared/utils/adminPath'
import WithdrawalDetailDialog from '../components/WithdrawalDetailDialog.vue' import WithdrawalDetailDialog from '../components/WithdrawalDetailDialog.vue'
const route = useRoute()
const router = useRouter() const router = useRouter()
const loading = ref(false) const loading = ref(false)
@@ -39,10 +40,48 @@ const statusOptions = [
{ label: '已取消', value: 'cancelled' }, { label: '已取消', value: 'cancelled' },
] ]
onMounted(() => { const withdrawalReturnQuery = computed<Record<string, string>>(() => {
loadWithdrawals() const query: Record<string, string> = {
from: 'withdrawals',
withdrawal_page: String(currentPage.value),
withdrawal_page_size: String(pageSize.value),
}
if (filters.value.status) query.withdrawal_status = filters.value.status
if (filters.value.user_id) query.withdrawal_user_id = String(filters.value.user_id)
return query
}) })
onMounted(() => {
restoreListState()
void loadWithdrawals()
})
function routeQueryString(value: unknown) {
return typeof value === 'string' ? value : ''
}
function restoreListState() {
const status = routeQueryString(route.query.withdrawal_status)
if (statusOptions.some(item => item.value === status)) {
filters.value.status = status
}
const userID = Number(routeQueryString(route.query.withdrawal_user_id))
if (Number.isSafeInteger(userID) && userID > 0) {
filters.value.user_id = userID
}
const restoredPage = Number(routeQueryString(route.query.withdrawal_page))
if (Number.isSafeInteger(restoredPage) && restoredPage > 0) {
currentPage.value = restoredPage
}
const restoredPageSize = Number(routeQueryString(route.query.withdrawal_page_size))
if ([10, 20, 50, 100].includes(restoredPageSize)) {
pageSize.value = restoredPageSize
}
}
async function loadWithdrawals() { async function loadWithdrawals() {
loading.value = true loading.value = true
try { try {
@@ -76,7 +115,10 @@ function goToOwnerOrders(withdrawal: WithdrawalDetail) {
const keyword = withdrawal.user_phone?.trim() || String(withdrawal.user_id || '') const keyword = withdrawal.user_phone?.trim() || String(withdrawal.user_id || '')
void router.push({ void router.push({
path: adminPath('orders'), path: adminPath('orders'),
query: keyword ? { keyword } : {}, query: {
...withdrawalReturnQuery.value,
...(keyword ? { keyword } : {}),
},
}) })
} }
@@ -311,6 +353,7 @@ function onDetailDialogSaved() {
<WithdrawalDetailDialog <WithdrawalDetailDialog
v-model="showDetailDialog" v-model="showDetailDialog"
:withdrawal="selectedWithdrawal" :withdrawal="selectedWithdrawal"
:return-query="withdrawalReturnQuery"
@saved="onDetailDialogSaved" @saved="onDetailDialogSaved"
/> />
</section> </section>
+3 -3
View File
@@ -348,15 +348,15 @@
} }
/* ========== Button Enhancements ========== */ /* ========== Button Enhancements ========== */
/* 仅实体主按钮强制白字;link/text 需保留主题色,否则表格「编辑」等会白字看不见 */ /* 仅实体主按钮强制白字;浅色、虚线和文字按钮沿用 Element Plus 的主题色。 */
.el-button--primary:not(.is-text):not(.is-link) { .el-button--primary:not(.is-plain):not(.is-dashed):not(.is-text):not(.is-link) {
font-weight: 700 !important; font-weight: 700 !important;
--el-button-text-color: #ffffff; --el-button-text-color: #ffffff;
--el-button-hover-text-color: #ffffff; --el-button-hover-text-color: #ffffff;
--el-button-active-text-color: #ffffff; --el-button-active-text-color: #ffffff;
} }
.el-button--primary:not(.is-text):not(.is-link) span { .el-button--primary:not(.is-plain):not(.is-dashed):not(.is-text):not(.is-link) span {
color: #ffffff !important; color: #ffffff !important;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); text-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
font-weight: 700; font-weight: 700;