支持礼物权重单独编辑

This commit is contained in:
zhx 2026-05-19 20:23:23 +08:00
parent 3a96357b2a
commit 8d0836e7e8
2 changed files with 117 additions and 1 deletions

View File

@ -33,6 +33,10 @@ export async function updateGift(data: Record<string, any>) {
return requestClient.put('/sys/gift/config', data);
}
export async function updateGiftSort(data: Record<string, any>) {
return requestClient.put('/sys/gift/config/sort', data);
}
export async function addGift(data: Record<string, any>) {
return requestClient.post('/sys/gift/config', data);
}

View File

@ -1,5 +1,5 @@
<script lang="ts" setup>
import { computed, reactive, ref, watch } from 'vue';
import { computed, nextTick, reactive, ref, watch } from 'vue';
import { Page } from '@vben/common-ui';
import { useAccessStore } from '@vben/stores';
@ -29,6 +29,7 @@ import {
listGiftBySysOrigin,
pushPairCpGiveGiftId,
switchDelStatus,
updateGiftSort,
} from '#/api/legacy/gift';
import { getAccessImgUrl } from '#/api/legacy/oss';
import {
@ -71,6 +72,10 @@ const settingList = ref<Array<Record<string, any>>>([]);
const settingTotal = ref(0);
const regions = ref<Array<Record<string, any>>>([]);
const settingRangeDate = ref<[string, string] | null>(null);
const editingGiftSortId = ref('');
const editingGiftSortValue = ref('');
const savingGiftSortId = ref('');
const giftSortInputRefs = new Map<string, any>();
const settingQuery = reactive({
cursor: 1,
del: false as boolean | undefined,
@ -256,6 +261,74 @@ async function handleSwitch(record: Record<string, any>) {
await loadSetting(false);
}
function setGiftSortInputRef(id: number | string, element: any) {
const key = String(id || '');
if (!key) {
return;
}
if (element) {
giftSortInputRefs.set(key, element);
} else {
giftSortInputRefs.delete(key);
}
}
function focusGiftSortInput(id: number | string) {
void nextTick(() => {
const element = giftSortInputRefs.get(String(id || ''));
if (typeof element?.focus === 'function') {
element.focus();
return;
}
element?.$el?.querySelector?.('input')?.focus?.();
});
}
function startGiftSortEdit(record: Record<string, any>) {
const id = String(record.id || '');
if (!id || savingGiftSortId.value === id) {
return;
}
editingGiftSortId.value = id;
editingGiftSortValue.value = String(record.sort ?? '');
focusGiftSortInput(id);
}
function cancelGiftSortEdit() {
editingGiftSortId.value = '';
editingGiftSortValue.value = '';
}
async function saveGiftSort(record: Record<string, any>) {
const id = String(record.id || '');
if (!id || editingGiftSortId.value !== id || savingGiftSortId.value === id) {
return;
}
const nextSort = Number(editingGiftSortValue.value);
if (!Number.isInteger(nextSort)) {
message.warning('权重必须是整数');
focusGiftSortInput(id);
return;
}
const oldSort = Number(record.sort ?? 0);
if (nextSort === oldSort) {
cancelGiftSortEdit();
return;
}
savingGiftSortId.value = id;
try {
await updateGiftSort({
id: record.id,
sort: nextSort,
});
record.sort = nextSort;
message.success('权重已保存');
cancelGiftSortEdit();
} finally {
savingGiftSortId.value = '';
}
}
function stringifyCellValue(value: any) {
if (value === undefined || value === null || value === '') {
return '-';
@ -487,6 +560,26 @@ async function handleCpSave() {
<template v-else-if="column.key === 'userBaseInfo'">
{{ record.userBaseInfo?.actualAccount || record.userBaseInfo?.id || '-' }}
</template>
<template v-else-if="column.key === 'sort'">
<Input
v-if="editingGiftSortId === String(record.id || '')"
:ref="(element: any) => setGiftSortInputRef(record.id, element)"
v-model:value="editingGiftSortValue"
class="gift-sort-input"
size="small"
@blur="saveGiftSort(record)"
@keyup.enter="saveGiftSort(record)"
@keyup.esc="cancelGiftSortEdit"
/>
<button
v-else
class="gift-sort-value"
type="button"
@click="startGiftSortEdit(record)"
>
{{ stringifyCellValue(record.sort) }}
</button>
</template>
<template v-else-if="column.key === 'actions'">
<Button size="small" type="link" @click="openGiftEdit(record)">
编辑
@ -685,6 +778,25 @@ async function handleCpSave() {
width: 52px;
}
.gift-sort-input {
max-width: 72px;
}
.gift-sort-value {
min-width: 48px;
padding: 2px 6px;
color: inherit;
text-align: left;
cursor: text;
background: transparent;
border: 0;
border-radius: 4px;
}
.gift-sort-value:hover {
background: #f1f5f9;
}
.week-star-gifts {
display: flex;
gap: 12px;