商品配置
This commit is contained in:
zhx
parent
cd9cbea7d6
commit
5befd6297b
@ -1,11 +1,6 @@
|
||||
<script lang="ts" setup>
|
||||
import { computed, reactive, ref, watch } from 'vue';
|
||||
|
||||
import {
|
||||
addOrUpdatePayCommodity,
|
||||
listCountrytSupportAmountChannels,
|
||||
} from '#/api/legacy/pay';
|
||||
|
||||
import {
|
||||
Collapse,
|
||||
CollapsePanel,
|
||||
@ -13,11 +8,16 @@ import {
|
||||
FormItem,
|
||||
Image,
|
||||
Input,
|
||||
message,
|
||||
Modal,
|
||||
Select,
|
||||
message,
|
||||
} from 'antdv-next';
|
||||
|
||||
import {
|
||||
addOrUpdatePayCommodity,
|
||||
listCountrytSupportAmountChannels,
|
||||
} from '#/api/legacy/pay';
|
||||
|
||||
import { WEB_PRODUCT_TYPE_OPTIONS } from '../pay-shared';
|
||||
|
||||
const props = withDefaults(
|
||||
@ -60,6 +60,7 @@ const form = reactive<Record<string, any>>({
|
||||
content: '',
|
||||
id: '',
|
||||
payCountryId: '',
|
||||
payCountryIds: [],
|
||||
regionId: '',
|
||||
shelf: true,
|
||||
type: 'GOLD',
|
||||
@ -68,7 +69,27 @@ const form = reactive<Record<string, any>>({
|
||||
const isUpdate = computed(() => Boolean(form.id));
|
||||
const modalTitle = computed(() => (isUpdate.value ? '修改商品' : '创建商品'));
|
||||
const selectedApp = computed(() => props.row?.selectApp || {});
|
||||
const selectedCountry = computed(() => props.row?.country || {});
|
||||
const supportCountries = computed(() => props.row?.supportCountries || []);
|
||||
const countryOptions = computed(() =>
|
||||
supportCountries.value.map((item: Record<string, any>) => ({
|
||||
label:
|
||||
item.country?.aliasName ||
|
||||
item.country?.enName ||
|
||||
item.country?.countryName ||
|
||||
'-',
|
||||
value: item.id,
|
||||
})),
|
||||
);
|
||||
const selectedCountry = computed(() => {
|
||||
const currentPayCountryId = form.payCountryId || form.payCountryIds?.[0];
|
||||
const current = supportCountries.value.find(
|
||||
(item: Record<string, any>) => String(item.id) === String(currentPayCountryId),
|
||||
);
|
||||
if (!current) {
|
||||
return props.row?.country || {};
|
||||
}
|
||||
return toCountryMeta(current);
|
||||
});
|
||||
const regionName = computed(() => props.row?.regionName || '');
|
||||
|
||||
watch(
|
||||
@ -84,6 +105,14 @@ watch(
|
||||
form.content = row.content ?? '';
|
||||
form.id = row.id ?? '';
|
||||
form.payCountryId = row.payCountryId ?? '';
|
||||
form.payCountryIds = Array.isArray(row.payCountryIds)
|
||||
? [...row.payCountryIds]
|
||||
: (row.payCountryId
|
||||
? [row.payCountryId]
|
||||
: []);
|
||||
if (props.mode === 'country' && !form.payCountryId && form.payCountryIds.length > 0) {
|
||||
form.payCountryId = form.payCountryIds[0];
|
||||
}
|
||||
form.regionId = row.regionId ?? '';
|
||||
form.shelf = row.shelf ?? true;
|
||||
form.type = row.type ?? 'GOLD';
|
||||
@ -92,12 +121,26 @@ watch(
|
||||
{ immediate: true },
|
||||
);
|
||||
|
||||
function toCountryMeta(country: Record<string, any>) {
|
||||
return {
|
||||
countryName:
|
||||
country.country?.aliasName ||
|
||||
country.country?.enName ||
|
||||
country.country?.countryName ||
|
||||
'-',
|
||||
currency: country.currency || '',
|
||||
exchangeRate: country.usdExchangeRate || '',
|
||||
icon: country.country?.nationalFlag || '',
|
||||
};
|
||||
}
|
||||
|
||||
function isPositiveNumberPointTwo(value: string) {
|
||||
return /^\d+(\.\d{1,2})?$/.test(value);
|
||||
}
|
||||
|
||||
async function loadSupportAmountChannels() {
|
||||
if (props.mode !== 'country' || !form.payCountryId || !isPositiveNumberPointTwo(String(form.amountUsd || ''))) {
|
||||
const currentPayCountryId = form.payCountryId || form.payCountryIds?.[0];
|
||||
if (props.mode !== 'country' || !currentPayCountryId || !isPositiveNumberPointTwo(String(form.amountUsd || ''))) {
|
||||
supportAmounts.value = [];
|
||||
computedAmount.value = '';
|
||||
amountUsdText.value = '';
|
||||
@ -105,8 +148,9 @@ async function loadSupportAmountChannels() {
|
||||
}
|
||||
associateLoading.value = true;
|
||||
try {
|
||||
// 新增允许多国家，渠道限额预览只展示首个国家；保存时后端会按每个国家拆分商品记录.
|
||||
const result = await listCountrytSupportAmountChannels(
|
||||
form.payCountryId,
|
||||
currentPayCountryId,
|
||||
form.amountUsd,
|
||||
);
|
||||
supportAmounts.value = result?.channels || [];
|
||||
@ -124,11 +168,20 @@ function handleAmountChange() {
|
||||
void loadSupportAmountChannels();
|
||||
}
|
||||
|
||||
function handleCountryIdsChange(value: Array<number | string>) {
|
||||
form.payCountryId = value?.[0] || '';
|
||||
void loadSupportAmountChannels();
|
||||
}
|
||||
|
||||
function validateForm() {
|
||||
if (props.mode === 'country' && !form.payCountryId) {
|
||||
if (props.mode === 'country' && isUpdate.value && !form.payCountryId) {
|
||||
message.warning('缺少支付国家');
|
||||
return false;
|
||||
}
|
||||
if (props.mode === 'country' && !isUpdate.value && form.payCountryIds.length === 0) {
|
||||
message.warning('请选择售卖国家');
|
||||
return false;
|
||||
}
|
||||
if (props.mode === 'region' && !form.regionId) {
|
||||
message.warning('缺少区域');
|
||||
return false;
|
||||
@ -162,13 +215,16 @@ async function handleSubmit() {
|
||||
}
|
||||
loading.value = true;
|
||||
try {
|
||||
const createCountryIds =
|
||||
props.mode === 'country' && !isUpdate.value ? form.payCountryIds : undefined;
|
||||
await addOrUpdatePayCommodity({
|
||||
amountUsd: form.amountUsd,
|
||||
applicationId: form.applicationId,
|
||||
awardContent: form.awardContent,
|
||||
content: form.content,
|
||||
id: form.id,
|
||||
payCountryId: form.payCountryId,
|
||||
payCountryId: form.payCountryId || form.payCountryIds?.[0],
|
||||
payCountryIds: createCountryIds,
|
||||
regionId: form.regionId,
|
||||
shelf: form.shelf,
|
||||
type: form.type,
|
||||
@ -199,7 +255,16 @@ async function handleSubmit() {
|
||||
|
||||
<Form layout="vertical">
|
||||
<FormItem v-if="mode === 'country'" label="售卖国家">
|
||||
<div class="inline-meta">
|
||||
<Select
|
||||
v-if="!isUpdate"
|
||||
v-model:value="form.payCountryIds"
|
||||
mode="multiple"
|
||||
:options="countryOptions"
|
||||
option-label-prop="label"
|
||||
placeholder="请选择售卖国家"
|
||||
@change="handleCountryIdsChange"
|
||||
/>
|
||||
<div v-else class="inline-meta">
|
||||
<Image
|
||||
v-if="selectedCountry.icon"
|
||||
:preview="false"
|
||||
@ -252,7 +317,7 @@ async function handleSubmit() {
|
||||
<div v-else-if="supportAmounts.length === 0" class="support-empty">
|
||||
暂无可展示渠道
|
||||
</div>
|
||||
<Collapse v-else v-model:activeKey="activeKeys">
|
||||
<Collapse v-else v-model:active-key="activeKeys">
|
||||
<CollapsePanel
|
||||
v-for="item in supportAmounts"
|
||||
:key="String(item.channel?.channelCode || '')"
|
||||
|
||||
@ -1,14 +1,6 @@
|
||||
<script lang="ts" setup>
|
||||
import { computed, reactive, ref, watch } from 'vue';
|
||||
|
||||
import { regionConfigTable } from '#/api/legacy/system';
|
||||
import {
|
||||
listPayOpenCountry,
|
||||
pagePayCommodity,
|
||||
switchShelfCommodity,
|
||||
} from '#/api/legacy/pay';
|
||||
import { formatDate } from '#/views/system/shared';
|
||||
|
||||
import {
|
||||
Button,
|
||||
Card,
|
||||
@ -19,8 +11,15 @@ import {
|
||||
Table,
|
||||
} from 'antdv-next';
|
||||
|
||||
import { WEB_PRODUCT_TYPE_OPTIONS } from '../pay-shared';
|
||||
import {
|
||||
listPayOpenCountry,
|
||||
pagePayCommodity,
|
||||
switchShelfCommodity,
|
||||
} from '#/api/legacy/pay';
|
||||
import { regionConfigTable } from '#/api/legacy/system';
|
||||
import { formatDate } from '#/views/system/shared';
|
||||
|
||||
import { WEB_PRODUCT_TYPE_OPTIONS } from '../pay-shared';
|
||||
import PayCommodityEditModal from './pay-commodity-edit-modal.vue';
|
||||
|
||||
const props = withDefaults(
|
||||
@ -185,7 +184,7 @@ function handlePageChange(page: number, pageSize: number) {
|
||||
void loadData();
|
||||
}
|
||||
|
||||
function handleApplicationChange(value: string | number) {
|
||||
function handleApplicationChange(value: number | string) {
|
||||
selectedApp.value =
|
||||
props.appInfo?.appList?.find((item: Record<string, any>) => item.id === value) ||
|
||||
{};
|
||||
@ -193,7 +192,7 @@ function handleApplicationChange(value: string | number) {
|
||||
void loadSupportData().then(() => loadData(true));
|
||||
}
|
||||
|
||||
function handleDimensionChange(value: string | number) {
|
||||
function handleDimensionChange(value: number | string) {
|
||||
selectedDimension.value =
|
||||
supportList.value.find((item) => item.id === value) || {};
|
||||
if (props.mode === 'country') {
|
||||
@ -218,10 +217,12 @@ function openCreate() {
|
||||
amountUsd: '',
|
||||
applicationId: query.applicationId,
|
||||
payCountryId: query.payCountryId,
|
||||
payCountryIds: props.mode === 'country' ? [query.payCountryId].filter(Boolean) : [],
|
||||
regionId: query.regionId,
|
||||
regionName: selectedDimension.value.regionName || '',
|
||||
selectApp: selectedApp.value,
|
||||
shelf: true,
|
||||
supportCountries: props.mode === 'country' ? supportList.value : [],
|
||||
type: query.type,
|
||||
...(props.mode === 'country'
|
||||
? {
|
||||
@ -243,8 +244,11 @@ function openCreate() {
|
||||
function openEdit(record: Record<string, any>) {
|
||||
activeRow.value = {
|
||||
...record,
|
||||
payCountryIds:
|
||||
props.mode === 'country' ? [record.payCountryId || query.payCountryId].filter(Boolean) : [],
|
||||
regionName: record.regionName || selectedDimension.value.regionName || '',
|
||||
selectApp: selectedApp.value,
|
||||
supportCountries: props.mode === 'country' ? supportList.value : [],
|
||||
...(props.mode === 'country'
|
||||
? {
|
||||
country: {
|
||||
@ -266,20 +270,23 @@ function openEdit(record: Record<string, any>) {
|
||||
<template>
|
||||
<Card :title="title">
|
||||
<div class="toolbar">
|
||||
<Select option-label-prop="label"
|
||||
<Select
|
||||
option-label-prop="label"
|
||||
v-model:value="query.type"
|
||||
:options="productTypeOptions"
|
||||
style="width: 180px"
|
||||
@change="handleSearch"
|
||||
/>
|
||||
<Select option-label-prop="label"
|
||||
<Select
|
||||
option-label-prop="label"
|
||||
v-model:value="query.applicationId"
|
||||
:options="applicationOptions"
|
||||
placeholder="应用"
|
||||
style="width: 200px"
|
||||
@change="handleApplicationChange"
|
||||
/>
|
||||
<Select option-label-prop="label"
|
||||
<Select
|
||||
option-label-prop="label"
|
||||
v-model:value="selectedDimensionId"
|
||||
:loading="supportLoading"
|
||||
:options="supportOptions"
|
||||
@ -287,7 +294,8 @@ function openEdit(record: Record<string, any>) {
|
||||
style="width: 200px"
|
||||
@change="handleDimensionChange"
|
||||
/>
|
||||
<Select option-label-prop="label"
|
||||
<Select
|
||||
option-label-prop="label"
|
||||
v-model:value="query.shelf"
|
||||
:options="shelfOptions"
|
||||
style="width: 140px"
|
||||
@ -341,7 +349,7 @@ function openEdit(record: Record<string, any>) {
|
||||
:total="total"
|
||||
show-size-changer
|
||||
@change="handlePageChange"
|
||||
@showSizeChange="handlePageChange"
|
||||
@show-size-change="handlePageChange"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user