新增邀请
This commit is contained in:
hy001
parent
4b24e94041
commit
1e2aead70f
27
apps/src/api/legacy/resident-activity.ts
Normal file
27
apps/src/api/legacy/resident-activity.ts
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
import type { LegacyPageResult } from '#/api/legacy/system';
|
||||||
|
|
||||||
|
import { requestClient } from '#/api/request';
|
||||||
|
|
||||||
|
export async function getResidentInviteConfig(sysOrigin: string) {
|
||||||
|
return requestClient.get<Record<string, any>>('/resident-activity/invite/config', {
|
||||||
|
params: { sysOrigin },
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function saveResidentInviteConfig(data: Record<string, any>) {
|
||||||
|
return requestClient.post('/resident-activity/invite/config/save', data);
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function pageResidentInviteInviter(params: Record<string, any>) {
|
||||||
|
return requestClient.get<LegacyPageResult<Record<string, any>>>(
|
||||||
|
'/resident-activity/invite/inviter/page',
|
||||||
|
{ params },
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function pageResidentInviteInvitee(params: Record<string, any>) {
|
||||||
|
return requestClient.get<LegacyPageResult<Record<string, any>>>(
|
||||||
|
'/resident-activity/invite/invitee/page',
|
||||||
|
{ params },
|
||||||
|
);
|
||||||
|
}
|
||||||
30
apps/src/router/routes/modules/resident-activity.ts
Normal file
30
apps/src/router/routes/modules/resident-activity.ts
Normal file
@ -0,0 +1,30 @@
|
|||||||
|
import type { RouteRecordRaw } from 'vue-router';
|
||||||
|
|
||||||
|
const routes: RouteRecordRaw[] = [
|
||||||
|
{
|
||||||
|
meta: {
|
||||||
|
icon: 'lucide:party-popper',
|
||||||
|
order: 51,
|
||||||
|
title: '常驻活动',
|
||||||
|
},
|
||||||
|
name: 'ResidentActivityManager',
|
||||||
|
path: '/resident-activity/manager',
|
||||||
|
redirect: '/resident-activity/manager/invite/config',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: 'ResidentInviteConfig',
|
||||||
|
path: 'invite/config',
|
||||||
|
component: () => import('#/views/resident-activity/invite-config.vue'),
|
||||||
|
meta: { title: '邀请活动配置' },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'ResidentInviteList',
|
||||||
|
path: 'invite/list',
|
||||||
|
component: () => import('#/views/resident-activity/invite-list.vue'),
|
||||||
|
meta: { title: '邀请活动列表' },
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default routes;
|
||||||
@ -0,0 +1,146 @@
|
|||||||
|
<script lang="ts" setup>
|
||||||
|
import { reactive, ref, watch } from 'vue';
|
||||||
|
|
||||||
|
import { pageResidentInviteInvitee } from '#/api/legacy/resident-activity';
|
||||||
|
import UserProfileLink from '#/views/operate/components/user-profile-link.vue';
|
||||||
|
import { formatDate } from '#/views/system/shared';
|
||||||
|
|
||||||
|
import {
|
||||||
|
Drawer,
|
||||||
|
Pagination,
|
||||||
|
Table,
|
||||||
|
Tag,
|
||||||
|
} from 'antdv-next';
|
||||||
|
|
||||||
|
const props = defineProps<{
|
||||||
|
inviterUserId?: number | string | null;
|
||||||
|
monthKey?: string;
|
||||||
|
open: boolean;
|
||||||
|
sysOrigin?: string;
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
close: [];
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const loading = ref(false);
|
||||||
|
const total = ref(0);
|
||||||
|
const list = ref<Array<Record<string, any>>>([]);
|
||||||
|
|
||||||
|
const query = reactive<Record<string, any>>({
|
||||||
|
cursor: 1,
|
||||||
|
inviterUserId: '',
|
||||||
|
limit: 10,
|
||||||
|
monthKey: '',
|
||||||
|
sysOrigin: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
const columns = [
|
||||||
|
{ dataIndex: 'inviteeProfile', key: 'inviteeProfile', title: '被邀请人', width: 280 },
|
||||||
|
{ dataIndex: 'bindTime', key: 'bindTime', title: '绑定时间', width: 180 },
|
||||||
|
{ dataIndex: 'rechargeCoins', key: 'rechargeCoins', title: '累计充值金币', width: 160 },
|
||||||
|
{ dataIndex: 'validUser', key: 'validUser', title: '有效用户', width: 120 },
|
||||||
|
{ dataIndex: 'validTime', key: 'validTime', title: '达成时间', width: 180 },
|
||||||
|
{ dataIndex: 'rewardedRuleIds', key: 'rewardedRuleIds', title: '触发档位', width: 220 },
|
||||||
|
];
|
||||||
|
|
||||||
|
async function loadData(reset = false) {
|
||||||
|
if (!props.open || !query.sysOrigin || !query.inviterUserId) {
|
||||||
|
list.value = [];
|
||||||
|
total.value = 0;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (reset) {
|
||||||
|
query.cursor = 1;
|
||||||
|
}
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
const result = await pageResidentInviteInvitee({ ...query });
|
||||||
|
list.value = result.records || [];
|
||||||
|
total.value = result.total || 0;
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handlePageChange(page: number, pageSize: number) {
|
||||||
|
query.cursor = page;
|
||||||
|
query.limit = pageSize;
|
||||||
|
void loadData();
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => [props.open, props.sysOrigin, props.inviterUserId, props.monthKey],
|
||||||
|
() => {
|
||||||
|
query.sysOrigin = String(props.sysOrigin || '');
|
||||||
|
query.inviterUserId = String(props.inviterUserId || '');
|
||||||
|
query.monthKey = String(props.monthKey || '');
|
||||||
|
void loadData(true);
|
||||||
|
},
|
||||||
|
{ immediate: true },
|
||||||
|
);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Drawer
|
||||||
|
:open="open"
|
||||||
|
title="邀请明细"
|
||||||
|
width="980"
|
||||||
|
@close="emit('close')"
|
||||||
|
>
|
||||||
|
<Table
|
||||||
|
:columns="columns"
|
||||||
|
:data-source="list"
|
||||||
|
:loading="loading"
|
||||||
|
:pagination="false"
|
||||||
|
row-key="relationId"
|
||||||
|
:scroll="{ x: 1100 }"
|
||||||
|
>
|
||||||
|
<template #bodyCell="{ column, record }">
|
||||||
|
<template v-if="column.key === 'inviteeProfile'">
|
||||||
|
<UserProfileLink
|
||||||
|
:profile="{
|
||||||
|
account: record.inviteeAccount,
|
||||||
|
id: record.inviteeUserId,
|
||||||
|
userAvatar: record.inviteeAvatar,
|
||||||
|
userNickname: record.inviteeNickname,
|
||||||
|
}"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template v-else-if="column.key === 'bindTime'">
|
||||||
|
{{ formatDate(record.bindTime) }}
|
||||||
|
</template>
|
||||||
|
<template v-else-if="column.key === 'validUser'">
|
||||||
|
<Tag :color="record.validUser ? 'success' : 'default'">
|
||||||
|
{{ record.validUser ? '是' : '否' }}
|
||||||
|
</Tag>
|
||||||
|
</template>
|
||||||
|
<template v-else-if="column.key === 'validTime'">
|
||||||
|
{{ record.validTime ? formatDate(record.validTime) : '-' }}
|
||||||
|
</template>
|
||||||
|
<template v-else-if="column.key === 'rewardedRuleIds'">
|
||||||
|
{{ record.rewardedRuleIds || '-' }}
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</Table>
|
||||||
|
|
||||||
|
<div v-if="total > 0" class="pager">
|
||||||
|
<Pagination
|
||||||
|
:current="query.cursor"
|
||||||
|
:page-size="query.limit"
|
||||||
|
:total="total"
|
||||||
|
show-size-changer
|
||||||
|
@change="handlePageChange"
|
||||||
|
@showSizeChange="handlePageChange"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</Drawer>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.pager {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
margin-top: 16px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
483
apps/src/views/resident-activity/invite-config.vue
Normal file
483
apps/src/views/resident-activity/invite-config.vue
Normal file
@ -0,0 +1,483 @@
|
|||||||
|
<script lang="ts" setup>
|
||||||
|
import { computed, reactive, ref, watch } from 'vue';
|
||||||
|
|
||||||
|
import { Page } from '@vben/common-ui';
|
||||||
|
import { useAccessStore } from '@vben/stores';
|
||||||
|
|
||||||
|
import {
|
||||||
|
getResidentInviteConfig,
|
||||||
|
saveResidentInviteConfig,
|
||||||
|
} from '#/api/legacy/resident-activity';
|
||||||
|
import ActivityResourceGroupSelectDrawer from '#/views/props/components/activity-resource-group-select-drawer.vue';
|
||||||
|
import { getAllowedSysOrigins } from '#/views/system/shared';
|
||||||
|
|
||||||
|
import {
|
||||||
|
Button,
|
||||||
|
Card,
|
||||||
|
Input,
|
||||||
|
InputNumber,
|
||||||
|
Modal,
|
||||||
|
Space,
|
||||||
|
Spin,
|
||||||
|
Switch,
|
||||||
|
Tag,
|
||||||
|
message,
|
||||||
|
} from 'antdv-next';
|
||||||
|
|
||||||
|
defineOptions({ name: 'ResidentInviteConfigPage' });
|
||||||
|
|
||||||
|
function createReward() {
|
||||||
|
return {
|
||||||
|
goldAmount: 0,
|
||||||
|
rewardGroupId: null,
|
||||||
|
rewardGroupName: '',
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function createRule(threshold = 1) {
|
||||||
|
return {
|
||||||
|
enabled: true,
|
||||||
|
goldAmount: 0,
|
||||||
|
rewardGroupId: null,
|
||||||
|
rewardGroupName: '',
|
||||||
|
threshold,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
const accessStore = useAccessStore();
|
||||||
|
const sysOriginOptions = computed(() => {
|
||||||
|
const options = getAllowedSysOrigins(accessStore.accessCodes || []);
|
||||||
|
return options.length > 0 ? options : getAllowedSysOrigins([]);
|
||||||
|
});
|
||||||
|
|
||||||
|
const loading = ref(false);
|
||||||
|
const saving = ref(false);
|
||||||
|
const groupPickerOpen = ref(false);
|
||||||
|
|
||||||
|
const pickerTarget = reactive({
|
||||||
|
listKey: '',
|
||||||
|
rowIndex: -1,
|
||||||
|
});
|
||||||
|
|
||||||
|
const form = reactive<Record<string, any>>({
|
||||||
|
antiCheat: {
|
||||||
|
sameDeviceOnce: true,
|
||||||
|
sameIpOnce: true,
|
||||||
|
},
|
||||||
|
downloadUrl: '',
|
||||||
|
enabled: false,
|
||||||
|
inviteeBindReward: createReward(),
|
||||||
|
inviteeRechargeRules: [],
|
||||||
|
inviterBindReward: createReward(),
|
||||||
|
inviterTotalRechargeRules: [],
|
||||||
|
inviterValidCountRules: [],
|
||||||
|
serviceContact: '',
|
||||||
|
shareDesc: '',
|
||||||
|
shareTitle: '',
|
||||||
|
sysOrigin: '',
|
||||||
|
timezone: 'Asia/Riyadh',
|
||||||
|
});
|
||||||
|
|
||||||
|
function normalizeReward(value: Record<string, any> | null | undefined) {
|
||||||
|
return {
|
||||||
|
goldAmount: Number(value?.goldAmount || 0),
|
||||||
|
rewardGroupId: value?.rewardGroupId ?? null,
|
||||||
|
rewardGroupName: value?.rewardGroupName || '',
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeRuleList(list: Array<Record<string, any>> | null | undefined) {
|
||||||
|
return (list || []).map((item) => ({
|
||||||
|
enabled: item?.enabled !== false,
|
||||||
|
goldAmount: Number(item?.goldAmount || 0),
|
||||||
|
rewardGroupId: item?.rewardGroupId ?? null,
|
||||||
|
rewardGroupName: item?.rewardGroupName || '',
|
||||||
|
threshold: Number(item?.threshold || 0),
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeConfig(result: Record<string, any> | null | undefined) {
|
||||||
|
const value = result ?? {};
|
||||||
|
form.sysOrigin = String(value.sysOrigin || form.sysOrigin || sysOriginOptions.value[0]?.value || '');
|
||||||
|
form.enabled = Boolean(value.enabled);
|
||||||
|
form.downloadUrl = String(value.downloadUrl || '');
|
||||||
|
form.shareTitle = String(value.shareTitle || '');
|
||||||
|
form.shareDesc = String(value.shareDesc || '');
|
||||||
|
form.serviceContact = String(value.serviceContact || '');
|
||||||
|
form.timezone = String(value.timezone || 'Asia/Riyadh');
|
||||||
|
form.antiCheat.sameIpOnce = value?.antiCheat?.sameIpOnce !== false;
|
||||||
|
form.antiCheat.sameDeviceOnce = value?.antiCheat?.sameDeviceOnce !== false;
|
||||||
|
form.inviterBindReward = normalizeReward(value.inviterBindReward);
|
||||||
|
form.inviteeBindReward = normalizeReward(value.inviteeBindReward);
|
||||||
|
form.inviteeRechargeRules = normalizeRuleList(value.inviteeRechargeRules);
|
||||||
|
form.inviterValidCountRules = normalizeRuleList(value.inviterValidCountRules);
|
||||||
|
form.inviterTotalRechargeRules = normalizeRuleList(value.inviterTotalRechargeRules);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function loadData() {
|
||||||
|
if (!form.sysOrigin) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
const result = await getResidentInviteConfig(form.sysOrigin);
|
||||||
|
normalizeConfig(result);
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(
|
||||||
|
sysOriginOptions,
|
||||||
|
(options) => {
|
||||||
|
if (!form.sysOrigin) {
|
||||||
|
form.sysOrigin = String(options[0]?.value || '');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ immediate: true },
|
||||||
|
);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => form.sysOrigin,
|
||||||
|
(value) => {
|
||||||
|
if (value) {
|
||||||
|
void loadData();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ immediate: true },
|
||||||
|
);
|
||||||
|
|
||||||
|
function addRule(listKey: string) {
|
||||||
|
const list = form[listKey] as Array<Record<string, any>>;
|
||||||
|
const nextThreshold = list.length > 0 ? Number(list[list.length - 1]?.threshold || 0) + 1 : 1;
|
||||||
|
list.push(createRule(nextThreshold));
|
||||||
|
}
|
||||||
|
|
||||||
|
function normalizeRowIndex(index: number | string) {
|
||||||
|
return typeof index === 'number' ? index : Number(index || 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
function removeRule(listKey: string, index: number | string) {
|
||||||
|
(form[listKey] as Array<Record<string, any>>).splice(normalizeRowIndex(index), 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
function openRewardPicker(listKey: string, rowIndex: number | string = -1) {
|
||||||
|
pickerTarget.listKey = listKey;
|
||||||
|
pickerTarget.rowIndex = normalizeRowIndex(rowIndex);
|
||||||
|
groupPickerOpen.value = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function clearRewardGroup(listKey: string, rowIndex: number | string = -1) {
|
||||||
|
const normalizedRowIndex = normalizeRowIndex(rowIndex);
|
||||||
|
const target = normalizedRowIndex >= 0
|
||||||
|
? (form[listKey] as Array<Record<string, any>>)[normalizedRowIndex]
|
||||||
|
: form[listKey];
|
||||||
|
target.rewardGroupId = null;
|
||||||
|
target.rewardGroupName = '';
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleRewardGroupSelect(row: Record<string, any>) {
|
||||||
|
const target = pickerTarget.rowIndex >= 0
|
||||||
|
? (form[pickerTarget.listKey] as Array<Record<string, any>>)[pickerTarget.rowIndex]
|
||||||
|
: form[pickerTarget.listKey];
|
||||||
|
target.rewardGroupId = row.id;
|
||||||
|
target.rewardGroupName = row.name;
|
||||||
|
groupPickerOpen.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function submitForm() {
|
||||||
|
saving.value = true;
|
||||||
|
try {
|
||||||
|
await saveResidentInviteConfig({
|
||||||
|
antiCheat: { ...form.antiCheat },
|
||||||
|
downloadUrl: String(form.downloadUrl || '').trim(),
|
||||||
|
enabled: Boolean(form.enabled),
|
||||||
|
inviteeBindReward: { ...form.inviteeBindReward },
|
||||||
|
inviteeRechargeRules: (form.inviteeRechargeRules || []).map((item: Record<string, any>) => ({
|
||||||
|
enabled: Boolean(item.enabled),
|
||||||
|
goldAmount: Number(item.goldAmount || 0),
|
||||||
|
rewardGroupId: item.rewardGroupId ?? null,
|
||||||
|
threshold: Number(item.threshold || 0),
|
||||||
|
})),
|
||||||
|
inviterBindReward: { ...form.inviterBindReward },
|
||||||
|
inviterTotalRechargeRules: (form.inviterTotalRechargeRules || []).map((item: Record<string, any>) => ({
|
||||||
|
enabled: Boolean(item.enabled),
|
||||||
|
goldAmount: Number(item.goldAmount || 0),
|
||||||
|
rewardGroupId: item.rewardGroupId ?? null,
|
||||||
|
threshold: Number(item.threshold || 0),
|
||||||
|
})),
|
||||||
|
inviterValidCountRules: (form.inviterValidCountRules || []).map((item: Record<string, any>) => ({
|
||||||
|
enabled: Boolean(item.enabled),
|
||||||
|
goldAmount: Number(item.goldAmount || 0),
|
||||||
|
rewardGroupId: item.rewardGroupId ?? null,
|
||||||
|
threshold: Number(item.threshold || 0),
|
||||||
|
})),
|
||||||
|
serviceContact: String(form.serviceContact || '').trim(),
|
||||||
|
shareDesc: String(form.shareDesc || '').trim(),
|
||||||
|
shareTitle: String(form.shareTitle || '').trim(),
|
||||||
|
sysOrigin: form.sysOrigin,
|
||||||
|
timezone: String(form.timezone || '').trim(),
|
||||||
|
});
|
||||||
|
message.success('保存成功');
|
||||||
|
await loadData();
|
||||||
|
} finally {
|
||||||
|
saving.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSubmit() {
|
||||||
|
Modal.confirm({
|
||||||
|
async onOk() {
|
||||||
|
await submitForm();
|
||||||
|
},
|
||||||
|
title: '确认覆盖当前系统的整套邀请活动配置？',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const rewardSections = [
|
||||||
|
{ key: 'inviteeRechargeRules', title: '被邀请人充值达标奖励', thresholdLabel: '充值金币阈值' },
|
||||||
|
{ key: 'inviterValidCountRules', title: '邀请有效人数任务', thresholdLabel: '邀请人数阈值' },
|
||||||
|
{ key: 'inviterTotalRechargeRules', title: '邀请名下累计充值任务', thresholdLabel: '累计充值金币阈值' },
|
||||||
|
];
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Page title="邀请活动配置">
|
||||||
|
<Card>
|
||||||
|
<Space class="toolbar" wrap>
|
||||||
|
<div class="toolbar-item">
|
||||||
|
<div class="toolbar-label">系统</div>
|
||||||
|
<SysOriginSelect
|
||||||
|
v-model:value="form.sysOrigin"
|
||||||
|
style="width: 160px"
|
||||||
|
:options="sysOriginOptions"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<Button :loading="saving" type="primary" @click="handleSubmit">
|
||||||
|
保存配置
|
||||||
|
</Button>
|
||||||
|
</Space>
|
||||||
|
|
||||||
|
<Spin :spinning="loading">
|
||||||
|
<div class="section-list">
|
||||||
|
<Card size="small" title="基础设置">
|
||||||
|
<div class="grid">
|
||||||
|
<div class="field">
|
||||||
|
<div class="label">活动开关</div>
|
||||||
|
<Switch v-model:checked="form.enabled" />
|
||||||
|
</div>
|
||||||
|
<div class="field">
|
||||||
|
<div class="label">时区</div>
|
||||||
|
<Input v-model:value="form.timezone" />
|
||||||
|
</div>
|
||||||
|
<div class="field field-span-2">
|
||||||
|
<div class="label">下载地址</div>
|
||||||
|
<Input v-model:value="form.downloadUrl" />
|
||||||
|
</div>
|
||||||
|
<div class="field field-span-2">
|
||||||
|
<div class="label">分享标题</div>
|
||||||
|
<Input v-model:value="form.shareTitle" />
|
||||||
|
</div>
|
||||||
|
<div class="field field-span-2">
|
||||||
|
<div class="label">分享描述</div>
|
||||||
|
<Input v-model:value="form.shareDesc" />
|
||||||
|
</div>
|
||||||
|
<div class="field field-span-2">
|
||||||
|
<div class="label">客服联系方式</div>
|
||||||
|
<Input v-model:value="form.serviceContact" />
|
||||||
|
</div>
|
||||||
|
<div class="field">
|
||||||
|
<div class="label">同 IP 只计一次</div>
|
||||||
|
<Switch v-model:checked="form.antiCheat.sameIpOnce" />
|
||||||
|
</div>
|
||||||
|
<div class="field">
|
||||||
|
<div class="label">同设备只计一次</div>
|
||||||
|
<Switch v-model:checked="form.antiCheat.sameDeviceOnce" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
<Card size="small" title="邀请方首邀奖励">
|
||||||
|
<div class="reward-row">
|
||||||
|
<div class="field">
|
||||||
|
<div class="label">金币</div>
|
||||||
|
<InputNumber v-model:value="form.inviterBindReward.goldAmount" :min="0" style="width: 180px" />
|
||||||
|
</div>
|
||||||
|
<div class="field field-grow">
|
||||||
|
<div class="label">奖励组</div>
|
||||||
|
<div class="reward-group-box">
|
||||||
|
<Tag v-if="form.inviterBindReward.rewardGroupName" color="blue">
|
||||||
|
{{ form.inviterBindReward.rewardGroupName }}
|
||||||
|
</Tag>
|
||||||
|
<span v-else class="placeholder">未选择奖励组</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Button @click="openRewardPicker('inviterBindReward')">选择奖励组</Button>
|
||||||
|
<Button @click="clearRewardGroup('inviterBindReward')">清空</Button>
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
<Card size="small" title="被邀请方注册礼包">
|
||||||
|
<div class="reward-row">
|
||||||
|
<div class="field">
|
||||||
|
<div class="label">金币</div>
|
||||||
|
<InputNumber v-model:value="form.inviteeBindReward.goldAmount" :min="0" style="width: 180px" />
|
||||||
|
</div>
|
||||||
|
<div class="field field-grow">
|
||||||
|
<div class="label">奖励组</div>
|
||||||
|
<div class="reward-group-box">
|
||||||
|
<Tag v-if="form.inviteeBindReward.rewardGroupName" color="blue">
|
||||||
|
{{ form.inviteeBindReward.rewardGroupName }}
|
||||||
|
</Tag>
|
||||||
|
<span v-else class="placeholder">未选择奖励组</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Button @click="openRewardPicker('inviteeBindReward')">选择奖励组</Button>
|
||||||
|
<Button @click="clearRewardGroup('inviteeBindReward')">清空</Button>
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
<Card
|
||||||
|
v-for="section in rewardSections"
|
||||||
|
:key="section.key"
|
||||||
|
size="small"
|
||||||
|
:title="section.title"
|
||||||
|
>
|
||||||
|
<div class="section-head">
|
||||||
|
<div class="section-tip">
|
||||||
|
阶梯可配置为金币、奖励组或两者同时发放。
|
||||||
|
</div>
|
||||||
|
<Button type="dashed" @click="addRule(section.key)">新增阶梯</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="(form[section.key] || []).length === 0" class="empty-box">
|
||||||
|
暂无配置
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in form[section.key]"
|
||||||
|
:key="`${section.key}-${index}`"
|
||||||
|
class="rule-item"
|
||||||
|
>
|
||||||
|
<div class="field">
|
||||||
|
<div class="label">{{ section.thresholdLabel }}</div>
|
||||||
|
<InputNumber v-model:value="item.threshold" :min="1" style="width: 180px" />
|
||||||
|
</div>
|
||||||
|
<div class="field">
|
||||||
|
<div class="label">金币</div>
|
||||||
|
<InputNumber v-model:value="item.goldAmount" :min="0" style="width: 180px" />
|
||||||
|
</div>
|
||||||
|
<div class="field field-grow">
|
||||||
|
<div class="label">奖励组</div>
|
||||||
|
<div class="reward-group-box">
|
||||||
|
<Tag v-if="item.rewardGroupName" color="blue">
|
||||||
|
{{ item.rewardGroupName }}
|
||||||
|
</Tag>
|
||||||
|
<span v-else class="placeholder">未选择奖励组</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="field switch-field">
|
||||||
|
<div class="label">启用</div>
|
||||||
|
<Switch v-model:checked="item.enabled" />
|
||||||
|
</div>
|
||||||
|
<Button @click="openRewardPicker(section.key, index)">选择奖励组</Button>
|
||||||
|
<Button @click="clearRewardGroup(section.key, index)">清空</Button>
|
||||||
|
<Button danger @click="removeRule(section.key, index)">删除</Button>
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
</Spin>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
<ActivityResourceGroupSelectDrawer
|
||||||
|
:open="groupPickerOpen"
|
||||||
|
:sys-origin="form.sysOrigin"
|
||||||
|
@close="groupPickerOpen = false"
|
||||||
|
@select="handleRewardGroupSelect"
|
||||||
|
/>
|
||||||
|
</Page>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.toolbar {
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-label,
|
||||||
|
.label {
|
||||||
|
color: #475569;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-list {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
|
gap: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.field {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.field-span-2 {
|
||||||
|
grid-column: span 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.reward-row,
|
||||||
|
.rule-item {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 12px;
|
||||||
|
align-items: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.field-grow {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 240px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch-field {
|
||||||
|
min-width: 88px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.reward-group-box {
|
||||||
|
min-height: 32px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.placeholder {
|
||||||
|
color: #94a3b8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-head {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.empty-box {
|
||||||
|
color: #94a3b8;
|
||||||
|
padding: 12px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-tip {
|
||||||
|
color: #64748b;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
220
apps/src/views/resident-activity/invite-list.vue
Normal file
220
apps/src/views/resident-activity/invite-list.vue
Normal file
@ -0,0 +1,220 @@
|
|||||||
|
<script lang="ts" setup>
|
||||||
|
import { computed, reactive, ref, watch } from 'vue';
|
||||||
|
|
||||||
|
import { Page } from '@vben/common-ui';
|
||||||
|
import { useAccessStore } from '@vben/stores';
|
||||||
|
|
||||||
|
import { pageResidentInviteInviter } from '#/api/legacy/resident-activity';
|
||||||
|
import AccountInput from '#/components/account-input.vue';
|
||||||
|
import InviteInviteeDetailDrawer from '#/views/resident-activity/components/invite-invitee-detail-drawer.vue';
|
||||||
|
import UserProfileLink from '#/views/operate/components/user-profile-link.vue';
|
||||||
|
import { formatDate, getAllowedSysOrigins } from '#/views/system/shared';
|
||||||
|
|
||||||
|
import {
|
||||||
|
Button,
|
||||||
|
Card,
|
||||||
|
DatePicker,
|
||||||
|
Pagination,
|
||||||
|
Space,
|
||||||
|
Table,
|
||||||
|
} from 'antdv-next';
|
||||||
|
|
||||||
|
defineOptions({ name: 'ResidentInviteListPage' });
|
||||||
|
|
||||||
|
const accessStore = useAccessStore();
|
||||||
|
const sysOriginOptions = computed(() => {
|
||||||
|
const options = getAllowedSysOrigins(accessStore.accessCodes || []);
|
||||||
|
return options.length > 0 ? options : getAllowedSysOrigins([]);
|
||||||
|
});
|
||||||
|
|
||||||
|
const loading = ref(false);
|
||||||
|
const total = ref(0);
|
||||||
|
const list = ref<Array<Record<string, any>>>([]);
|
||||||
|
const rangeDate = ref<any>(null);
|
||||||
|
const detailOpen = ref(false);
|
||||||
|
const activeInviter = ref<Record<string, any> | null>(null);
|
||||||
|
|
||||||
|
const query = reactive<Record<string, any>>({
|
||||||
|
cursor: 1,
|
||||||
|
endTime: '',
|
||||||
|
inviteeUserId: '',
|
||||||
|
inviterUserId: '',
|
||||||
|
limit: 20,
|
||||||
|
monthKey: '',
|
||||||
|
startTime: '',
|
||||||
|
sysOrigin: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
const columns = [
|
||||||
|
{ dataIndex: 'inviterProfile', key: 'inviterProfile', title: '邀请人', width: 280 },
|
||||||
|
{ dataIndex: 'inviteCode', key: 'inviteCode', title: '邀请码', width: 160 },
|
||||||
|
{ dataIndex: 'totalInviteCount', key: 'totalInviteCount', title: '累计邀请人数', width: 140 },
|
||||||
|
{ dataIndex: 'monthlyValidUserCount', key: 'monthlyValidUserCount', title: '月有效用户数', width: 140 },
|
||||||
|
{ dataIndex: 'totalInviteeRechargeCoins', key: 'totalInviteeRechargeCoins', title: '邀请名下总充值', width: 180 },
|
||||||
|
{ dataIndex: 'rewardGoldTotal', key: 'rewardGoldTotal', title: '已获奖励金币', width: 160 },
|
||||||
|
{ dataIndex: 'latestInviteTime', key: 'latestInviteTime', title: '最近邀请时间', width: 180 },
|
||||||
|
{ dataIndex: 'actions', key: 'actions', title: '操作', width: 100 },
|
||||||
|
];
|
||||||
|
|
||||||
|
watch(rangeDate, (value) => {
|
||||||
|
query.startTime = value?.[0]?.valueOf() || '';
|
||||||
|
query.endTime = value?.[1]?.valueOf() || '';
|
||||||
|
});
|
||||||
|
|
||||||
|
watch(
|
||||||
|
sysOriginOptions,
|
||||||
|
(options) => {
|
||||||
|
if (!query.sysOrigin) {
|
||||||
|
query.sysOrigin = String(options[0]?.value || '');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ immediate: true },
|
||||||
|
);
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => query.sysOrigin,
|
||||||
|
(value) => {
|
||||||
|
if (value) {
|
||||||
|
void loadData(true);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{ immediate: true },
|
||||||
|
);
|
||||||
|
|
||||||
|
async function loadData(reset = false) {
|
||||||
|
if (!query.sysOrigin) {
|
||||||
|
list.value = [];
|
||||||
|
total.value = 0;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (reset) {
|
||||||
|
query.cursor = 1;
|
||||||
|
}
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
const result = await pageResidentInviteInviter({ ...query });
|
||||||
|
list.value = result.records || [];
|
||||||
|
total.value = result.total || 0;
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSearch() {
|
||||||
|
void loadData(true);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handlePageChange(page: number, pageSize: number) {
|
||||||
|
query.cursor = page;
|
||||||
|
query.limit = pageSize;
|
||||||
|
void loadData();
|
||||||
|
}
|
||||||
|
|
||||||
|
function openDetail(record: Record<string, any>) {
|
||||||
|
activeInviter.value = record;
|
||||||
|
detailOpen.value = true;
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<Page title="邀请活动列表">
|
||||||
|
<Card>
|
||||||
|
<div class="toolbar">
|
||||||
|
<Space wrap>
|
||||||
|
<SysOriginSelect
|
||||||
|
v-model:value="query.sysOrigin"
|
||||||
|
style="width: 140px"
|
||||||
|
:options="sysOriginOptions"
|
||||||
|
/>
|
||||||
|
<AccountInput
|
||||||
|
v-model:value="query.inviterUserId"
|
||||||
|
:sys-origin="query.sysOrigin"
|
||||||
|
placeholder="邀请人"
|
||||||
|
style="width: 240px"
|
||||||
|
/>
|
||||||
|
<AccountInput
|
||||||
|
v-model:value="query.inviteeUserId"
|
||||||
|
:sys-origin="query.sysOrigin"
|
||||||
|
placeholder="被邀请人"
|
||||||
|
style="width: 240px"
|
||||||
|
/>
|
||||||
|
<DatePicker
|
||||||
|
v-model:value="query.monthKey"
|
||||||
|
picker="month"
|
||||||
|
placeholder="月份"
|
||||||
|
style="width: 140px"
|
||||||
|
value-format="YYYYMM"
|
||||||
|
/>
|
||||||
|
<DatePicker.RangePicker
|
||||||
|
v-model:value="rangeDate"
|
||||||
|
show-time
|
||||||
|
/>
|
||||||
|
<Button :loading="loading" type="primary" @click="handleSearch">
|
||||||
|
搜索
|
||||||
|
</Button>
|
||||||
|
</Space>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Table
|
||||||
|
:columns="columns"
|
||||||
|
:data-source="list"
|
||||||
|
:loading="loading"
|
||||||
|
:pagination="false"
|
||||||
|
row-key="inviterUserId"
|
||||||
|
:scroll="{ x: 1380 }"
|
||||||
|
>
|
||||||
|
<template #bodyCell="{ column, record }">
|
||||||
|
<template v-if="column.key === 'inviterProfile'">
|
||||||
|
<UserProfileLink
|
||||||
|
:profile="{
|
||||||
|
account: record.inviterAccount,
|
||||||
|
id: record.inviterUserId,
|
||||||
|
userAvatar: record.inviterAvatar,
|
||||||
|
userNickname: record.inviterNickname,
|
||||||
|
}"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template v-else-if="column.key === 'latestInviteTime'">
|
||||||
|
{{ record.latestInviteTime ? formatDate(record.latestInviteTime) : '-' }}
|
||||||
|
</template>
|
||||||
|
<template v-else-if="column.key === 'actions'">
|
||||||
|
<Button size="small" type="link" @click="openDetail(record)">
|
||||||
|
查看明细
|
||||||
|
</Button>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</Table>
|
||||||
|
|
||||||
|
<div v-if="total > 0" class="pager">
|
||||||
|
<Pagination
|
||||||
|
:current="query.cursor"
|
||||||
|
:page-size="query.limit"
|
||||||
|
:total="total"
|
||||||
|
show-size-changer
|
||||||
|
@change="handlePageChange"
|
||||||
|
@showSizeChange="handlePageChange"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
<InviteInviteeDetailDrawer
|
||||||
|
:open="detailOpen"
|
||||||
|
:inviter-user-id="activeInviter?.inviterUserId"
|
||||||
|
:month-key="query.monthKey"
|
||||||
|
:sys-origin="query.sysOrigin"
|
||||||
|
@close="detailOpen = false"
|
||||||
|
/>
|
||||||
|
</Page>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.toolbar {
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pager {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
margin-top: 16px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
x
Reference in New Issue
Block a user