add product
This commit is contained in:
Timi
@@ -1,242 +0,0 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.packageDelivery.create" class="package-operation-edit">
|
||||
<t-cell-group v-if="customerPackage" title="发放前状态（以提交时后端校验为准）" theme="card" v-entrance-transition>
|
||||
<t-cell title="客户套餐" :note="customerPackage.packageNameSnapshot || '未命名套餐'" />
|
||||
<t-cell title="收款状态" :note="getPaymentStatusText(customerPackage.paymentStatus)" />
|
||||
</t-cell-group>
|
||||
<section v-if="customerPackage" class="items" v-entrance-transition="70">
|
||||
<div class="section-title"><strong>本次发放权益</strong><span>只能提交不超过可发数量的产品</span></div>
|
||||
<div v-for="item in customerPackage.itemList || []" :key="item.id" class="item">
|
||||
<div class="item-title"><strong v-text="`${item.productNameSnapshot}（${item.unitSnapshot}）`" /><span v-text="`可发 ${getPackageQuantityText(item.availableQuantity)}`" /></div>
|
||||
<t-input v-model.trim="quantityMap[item.id || '']" type="number" borderless placeholder="本次发放数量，不填表示不发放" />
|
||||
</div>
|
||||
</section>
|
||||
<t-form v-if="customerPackage" class="form" label-align="left" label-width="6rem" v-entrance-transition="140">
|
||||
<t-form-item label="发放时间" arrow @click="deliveredPickerVisible = true">
|
||||
<span class="picker-text" v-text="deliveredAtText || '使用当前时间'" />
|
||||
</t-form-item>
|
||||
<t-form-item label="备注">
|
||||
<t-textarea v-model.trim="remark" borderless autosize maxlength="500" placeholder="发放备注" />
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
<package-photo-field v-if="customerPackage" v-model="photoItems" required title="发放照片" />
|
||||
<t-empty v-if="!customerPackage" :description="isLoading ? '正在加载套餐' : '套餐不存在'" />
|
||||
<t-popup v-model="deliveredPickerVisible" placement="bottom">
|
||||
<t-date-time-picker v-model="deliveredDraft" format="YYYY-MM-DD HH:mm" :mode="['date', 'minute']" title="发放时间" @cancel="deliveredPickerVisible = false" @confirm="confirmDeliveredAt" />
|
||||
</t-popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useUserStore } from "timi-web-api";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import PackagePhotoField from "@/components/PackagePhotoField.vue";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { GaoCustomerPackage, PackageAttachment } from "@/types/Package";
|
||||
import type { PhotoItem } from "@/types/Photo";
|
||||
import {
|
||||
canCreatePackageDelivery,
|
||||
comparePackageQuantity,
|
||||
createPackageRequestNo,
|
||||
getPackageQuantityText,
|
||||
getPaymentStatusText,
|
||||
isStoreManagerRequiredForPackageDelivery,
|
||||
normalizePackageQuantity
|
||||
} from "@/utils/package";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { Message } from "@/utils/message";
|
||||
import { gaoRoleCodes, permissionCodes } from "@/utils/permission";
|
||||
|
||||
defineOptions({ name: "CustomerPackageDelivery" });
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const userStore = useUserStore();
|
||||
const navBarStore = useNavBarStore();
|
||||
const customerPackage = ref<GaoCustomerPackage>();
|
||||
const quantityMap = reactive<Record<string, string>>({});
|
||||
const photoItems = ref<PhotoItem[]>([]);
|
||||
const remark = ref("");
|
||||
const deliveredAtText = ref("");
|
||||
const deliveredDraft = ref("");
|
||||
const deliveredPickerVisible = ref(false);
|
||||
const isLoading = ref(false);
|
||||
const isSaving = ref(false);
|
||||
const isStoreManager = computed(() => userStore.hasRoles(gaoRoleCodes.storeManager) && !userStore.hasRoles(gaoRoleCodes.globalManager));
|
||||
const canCreateDelivery = computed(() => canCreatePackageDelivery(customerPackage.value)
|
||||
&& (!isStoreManagerRequiredForPackageDelivery(customerPackage.value) || isStoreManager.value)
|
||||
&& userStore.hasPermissions(permissionCodes.packageDelivery.create));
|
||||
|
||||
function confirmDeliveredAt(value: string | number): void {
|
||||
deliveredAtText.value = String(value);
|
||||
deliveredPickerVisible.value = false;
|
||||
}
|
||||
|
||||
function resolveTimestamp(value: string): number | undefined {
|
||||
if (!value) {
|
||||
return undefined;
|
||||
}
|
||||
const timestamp = new Date(value.replace(" ", "T")).getTime();
|
||||
return Number.isFinite(timestamp) ? timestamp : undefined;
|
||||
}
|
||||
|
||||
function buildAttachments(): PackageAttachment[] {
|
||||
return photoItems.value.flatMap(item => item.tempFileId ? [{ tempFileId: item.tempFileId, attachType: "PHOTO", name: item.attachment?.name }] : []);
|
||||
}
|
||||
|
||||
async function loadData(): Promise<void> {
|
||||
const id = String(route.params.id || "");
|
||||
if (!id) {
|
||||
return;
|
||||
}
|
||||
isLoading.value = true;
|
||||
try {
|
||||
customerPackage.value = await PackageAPI.customerPackageDetail(id);
|
||||
for (const item of customerPackage.value.itemList || []) {
|
||||
if (item.id) {
|
||||
quantityMap[item.id] = "";
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "套餐加载失败"));
|
||||
} finally {
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
function validateItems(): Array<{ customerPackageItemId: string; quantity: string }> | undefined {
|
||||
const result: Array<{ customerPackageItemId: string; quantity: string }> = [];
|
||||
for (const item of customerPackage.value?.itemList || []) {
|
||||
if (!item.id) {
|
||||
continue;
|
||||
}
|
||||
const text = quantityMap[item.id] || "";
|
||||
if (!text.trim()) {
|
||||
continue;
|
||||
}
|
||||
const quantity = normalizePackageQuantity(text);
|
||||
if (!quantity || quantity === "0") {
|
||||
Message.warning(`${item.productNameSnapshot} 的数量必须是正数，最多三位小数`);
|
||||
return undefined;
|
||||
}
|
||||
if (comparePackageQuantity(quantity, item.availableQuantity) > 0) {
|
||||
Message.warning(`${item.productNameSnapshot} 的发放数量超过当前可发数量，请刷新后重新确认`);
|
||||
return undefined;
|
||||
}
|
||||
result.push({ customerPackageItemId: item.id, quantity });
|
||||
}
|
||||
if (!result.length) {
|
||||
Message.warning("请至少填写一项本次发放数量");
|
||||
return undefined;
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
async function save(): Promise<void> {
|
||||
if (isSaving.value) {
|
||||
return;
|
||||
}
|
||||
const customerPackageId = customerPackage.value?.id;
|
||||
const itemList = validateItems();
|
||||
if (!customerPackageId || !itemList) {
|
||||
return;
|
||||
}
|
||||
if (!canCreatePackageDelivery(customerPackage.value)) {
|
||||
Message.warning("套餐未有已核销收款，不能提交发放");
|
||||
return;
|
||||
}
|
||||
if (isStoreManagerRequiredForPackageDelivery(customerPackage.value) && !isStoreManager.value) {
|
||||
Message.warning("部分收款套餐仅店长可发放");
|
||||
return;
|
||||
}
|
||||
if (!photoItems.value.some(item => item.tempFileId)) {
|
||||
Message.warning("发放必须上传至少一张照片");
|
||||
return;
|
||||
}
|
||||
isSaving.value = true;
|
||||
try {
|
||||
const result = await PackageAPI.createDelivery({
|
||||
requestNo: createPackageRequestNo(),
|
||||
customerPackageId,
|
||||
deliveredAt: resolveTimestamp(deliveredAtText.value),
|
||||
itemList,
|
||||
attachmentList: buildAttachments(),
|
||||
remark: remark.value.trim() || null
|
||||
});
|
||||
Message.success("发放单已提交，等待核销");
|
||||
await PackageAPI.customerPackageDetail(customerPackageId);
|
||||
if (result.id) {
|
||||
await router.replace(`/management/package-deliveries/${result.id}`);
|
||||
return;
|
||||
}
|
||||
await router.replace(`/management/customer-packages/${customerPackageId}`);
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "发放单提交失败，请刷新后确认状态"));
|
||||
} finally {
|
||||
isSaving.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await loadData();
|
||||
if (canCreateDelivery.value) {
|
||||
navBarStore.setRightText("提交发放", "var(--td-brand-color)", save);
|
||||
}
|
||||
});
|
||||
|
||||
onUnmounted(() => navBarStore.clearRight());
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.package-operation-edit {
|
||||
gap: 1rem;
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 2rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.form {
|
||||
border-radius: .75rem;
|
||||
}
|
||||
|
||||
.picker-text {
|
||||
width: 100%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.items,
|
||||
.package-photo-field {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
color: var(--td-text-color-secondary);
|
||||
margin-bottom: .5rem;
|
||||
font-size: .8125rem;
|
||||
}
|
||||
|
||||
.section-title span {
|
||||
margin-left: .5rem;
|
||||
}
|
||||
|
||||
.item {
|
||||
gap: .5rem;
|
||||
padding: .75rem;
|
||||
margin-bottom: .75rem;
|
||||
display: grid;
|
||||
background: var(--td-bg-color-container);
|
||||
box-shadow: var(--td-shadow-1);
|
||||
border-radius: .75rem;
|
||||
}
|
||||
|
||||
.item-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.item-title span {
|
||||
color: var(--td-brand-color);
|
||||
font-size: .75rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,238 +1,112 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.customerPackage.read" class="customer-package-detail">
|
||||
<template v-if="customerPackage">
|
||||
<customer-profile-card
|
||||
class="customer"
|
||||
:customer="customerPackage.customer"
|
||||
v-entrance-transition
|
||||
/>
|
||||
<t-cell-group
|
||||
class="package"
|
||||
theme="card"
|
||||
v-entrance-transition="70"
|
||||
>
|
||||
<customer-profile-card class="customer" :customer="customerPackage.customer" v-entrance-transition />
|
||||
<t-cell-group class="summary" theme="card" v-entrance-transition="70">
|
||||
<t-cell>
|
||||
<template #title>
|
||||
<div class="title">
|
||||
<h3 class="value" v-text="customerPackage.packageNameSnapshot || '未命名套餐'" />
|
||||
<strong v-text="customerPackage.packageNameSnapshot || '未命名套餐'" />
|
||||
<t-tag :content="getCustomerPackageStatusText(customerPackage.status)" variant="light-outline" :theme="getStatusTheme(customerPackage.status)" />
|
||||
</div>
|
||||
</template>
|
||||
<template #description>
|
||||
<span>购买于</span>
|
||||
<pass-time-label class="word-space" :timestamp="customerPackage.purchasedAt" underline />
|
||||
</template>
|
||||
<template #description><span>购买于 </span><pass-time-label :timestamp="order?.purchasedAt" underline /></template>
|
||||
</t-cell>
|
||||
<t-cell
|
||||
v-if="canReadPackageConfig && customerPackage.packageConfigId"
|
||||
title="套餐方案详情"
|
||||
arrow
|
||||
hover
|
||||
@click="toPackageConfigDetail"
|
||||
/>
|
||||
<t-cell
|
||||
v-if="canReadEventRecord && customerPackage.purchaseEventRecord?.id"
|
||||
title="购买登记记录"
|
||||
note="查看关联的事件登记记录"
|
||||
arrow
|
||||
@click="toPurchaseEventRecord"
|
||||
/>
|
||||
<t-cell v-if="customerPackage.salesOrderId && canReadOrder" title="销售订单" :note="order?.orderNo || customerPackage.salesOrderId" arrow @click="toOrder" />
|
||||
<t-cell v-if="canReadPackageConfig && customerPackage.packageConfigId" title="套餐方案详情" arrow @click="toPackageConfig" />
|
||||
<t-cell v-if="canReadEventRecord && customerPackage.purchaseEventRecord?.id" title="购买登记记录" arrow @click="toEventRecord" />
|
||||
</t-cell-group>
|
||||
<t-cell-group title="金额" theme="card" v-entrance-transition="140">
|
||||
<t-cell class="amount standard" title="标准价快照" :note="formatPackageAmount(customerPackage.standardAmountSnapshot)" />
|
||||
<t-cell class="amount sale" title="成交价" :note="formatPackageAmount(customerPackage.saleAmount)" />
|
||||
<t-cell class="amount paid" title="已核销收款" :note="formatPackageAmount(customerPackage.paidAmount)" />
|
||||
<t-cell class="amount pending" title="待核销收款" :note="formatPackageAmount(customerPackage.pendingPaidAmount)" />
|
||||
<t-cell class="amount remaining" title="剩余待收款" :note="formatPackageAmount(getRemainingReceivableAmount(customerPackage))" />
|
||||
<t-cell class="amount refunded" title="有效退款" :note="formatPackageAmount(customerPackage.refundedAmount)" />
|
||||
<t-cell
|
||||
v-if="canReadFund && 0 < (customerPackage.pendingPaidAmount || 0)"
|
||||
title="去核销收款"
|
||||
note="查看待核销的登记收款"
|
||||
arrow
|
||||
hover
|
||||
@click="toPendingFundList"
|
||||
/>
|
||||
<t-cell v-if="canReadFund" title="资金历史" arrow @click="toFundList" />
|
||||
<t-cell-group v-if="order" title="订单资金" theme="card" v-entrance-transition="140">
|
||||
<t-cell title="成交金额" :note="formatPackageAmount(order.saleAmount)" />
|
||||
<t-cell title="已生效收款" :note="formatPackageAmount(order.paidAmount)" />
|
||||
<t-cell title="待核销收款" :note="formatPackageAmount(order.pendingPaidAmount)" />
|
||||
<t-cell title="剩余待收款" :note="formatPackageAmount(order.unpaidAmount)" />
|
||||
<t-cell title="有效退款" :note="formatPackageAmount(order.refundedAmount)" />
|
||||
<t-cell title="收款状态" :note="getSalesPaymentStatusText(order.paymentStatus)" />
|
||||
<t-cell title="退款状态" :note="getSalesRefundStatusText(order.refundStatus)" />
|
||||
<t-cell v-if="canReadFund" title="资金流水" arrow @click="toFundRecords" />
|
||||
</t-cell-group>
|
||||
<t-button
|
||||
v-if="canReceivePayment"
|
||||
class="cell-button"
|
||||
theme="primary"
|
||||
@click="toPayment"
|
||||
v-entrance-transition="210"
|
||||
>登记收款</t-button>
|
||||
<t-cell-group title="状态" theme="card" v-entrance-transition="280">
|
||||
<t-cell title="收款状态" :note="getPaymentStatusText(customerPackage.paymentStatus)" />
|
||||
<t-cell title="退款状态" :note="getRefundStatusText(customerPackage.refundStatus)" />
|
||||
</t-cell-group>
|
||||
<card-container description="产品权益" v-entrance-transition="350">
|
||||
<card-container title="套餐权益" description="权益数量来自客户套餐快照，履约状态来自统一履约单" v-entrance-transition="210">
|
||||
<t-cell-group>
|
||||
<t-cell
|
||||
v-for="item in customerPackage.itemList || []"
|
||||
:key="item.id"
|
||||
class="benefit"
|
||||
>
|
||||
<template #title>
|
||||
<div class="title">
|
||||
<strong v-text="item.productNameSnapshot || '未命名产品'" />
|
||||
<t-tag theme="primary" variant="light" :content="item.unitSnapshot || '未设置单位'" />
|
||||
</div>
|
||||
</template>
|
||||
<t-cell v-for="item in customerPackage.itemList || []" :key="item.id" class="benefit">
|
||||
<template #title><div class="title"><strong v-text="item.productNameSnapshot || '未命名产品'" /><t-tag theme="primary" variant="light" :content="item.unitSnapshot || '未设置单位'" /></div></template>
|
||||
<template #description>
|
||||
<div class="stats">
|
||||
<div class="stat">
|
||||
<span>总数</span>
|
||||
<strong v-text="getPackageQuantityText(item.totalQuantity)" />
|
||||
</div>
|
||||
<div class="stat available">
|
||||
<span>可发</span>
|
||||
<strong v-text="getPackageQuantityText(item.availableQuantity)" />
|
||||
</div>
|
||||
<div class="stat pending">
|
||||
<span>待核销</span>
|
||||
<strong v-text="getPackageQuantityText(item.pendingQuantity)" />
|
||||
</div>
|
||||
<div class="stat delivered">
|
||||
<span>已核销</span>
|
||||
<strong v-text="getPackageQuantityText(item.deliveredQuantity)" />
|
||||
</div>
|
||||
<span>总数 <strong v-text="getPackageQuantityText(item.totalQuantity)" /></span>
|
||||
<span>可履约 <strong v-text="getPackageQuantityText(item.availableQuantity)" /></span>
|
||||
<span>待核销 <strong v-text="getPackageQuantityText(item.pendingQuantity)" /></span>
|
||||
<span>已履约 <strong v-text="getPackageQuantityText(item.fulfilledQuantity)" /></span>
|
||||
</div>
|
||||
</template>
|
||||
</t-cell>
|
||||
<t-cell
|
||||
v-if="canReadDelivery && hasPendingDelivery"
|
||||
title="去核销发放"
|
||||
note="查看待核销的发放记录"
|
||||
arrow
|
||||
@click="toPendingDeliveryList"
|
||||
/>
|
||||
<t-cell v-if="canReadDelivery" title="发放历史" arrow @click="toDeliveryList" />
|
||||
<div v-if="!customerPackage.itemList?.length" class="empty" v-text="'暂无产品权益'" />
|
||||
</t-cell-group>
|
||||
</card-container>
|
||||
<t-button
|
||||
v-if="canCreateDelivery"
|
||||
class="cell-button"
|
||||
theme="primary"
|
||||
@click="toDelivery"
|
||||
v-entrance-transition="420"
|
||||
>创建发放单</t-button>
|
||||
<t-button
|
||||
v-if="canCancelPackage"
|
||||
class="cell-button"
|
||||
theme="danger"
|
||||
@click="toCancel"
|
||||
>取消套餐</t-button>
|
||||
<t-button
|
||||
v-if="canRefund"
|
||||
class="cell-button bg-orange white"
|
||||
variant="text"
|
||||
@click="toRefund"
|
||||
>处理退款</t-button>
|
||||
<t-cell-group title="统一履约" theme="card" v-entrance-transition="280">
|
||||
<t-cell
|
||||
v-for="item in customerPackage.fulfillmentList || []"
|
||||
:key="item.id"
|
||||
:title="`${getFulfillmentTypeText(item.fulfillmentType)} · ${getFulfillmentStatusText(item.status)}`"
|
||||
:note="getFulfillmentSummary(item)"
|
||||
arrow
|
||||
@click="toFulfillment(item.id)"
|
||||
/>
|
||||
<t-cell v-if="!customerPackage.fulfillmentList?.length" title="暂无履约记录" />
|
||||
<t-cell v-if="canCreateFulfillment && hasAvailableItem" title="创建统一履约单" note="选择本次履约的权益数量" arrow @click="toCreateFulfillment" />
|
||||
</t-cell-group>
|
||||
<t-button v-if="canCancel" class="cell-button" theme="danger" @click="openCancel">取消客户套餐</t-button>
|
||||
</template>
|
||||
<t-empty v-else :description="isLoading ? '正在加载客户套餐' : '客户套餐不存在'" />
|
||||
<bottom-popup
|
||||
v-model="cancelPopupVisible"
|
||||
title="取消客户套餐"
|
||||
height="min(35vh, 20rem)"
|
||||
left-button-text="取消"
|
||||
right-button-text="确认取消"
|
||||
@left-button-click="closeCancelPopup"
|
||||
@right-button-click="confirmCancel"
|
||||
>
|
||||
<template #rightButton="{ onClick }">
|
||||
<t-button
|
||||
variant="text"
|
||||
size="small"
|
||||
theme="danger"
|
||||
:loading="isCancelling"
|
||||
:disabled="!canConfirmCancel || isCancelling"
|
||||
@click="onClick"
|
||||
>确认取消</t-button>
|
||||
</template>
|
||||
<t-form class="cancel-form" label-align="top">
|
||||
<t-form-item label="取消原因" required-mark>
|
||||
<t-textarea v-model.trim="cancelReason" borderless autosize maxlength="500" placeholder="请输入取消原因" />
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
<bottom-popup v-model="cancelVisible" title="取消客户套餐" height="min(35vh, 20rem)" left-button-text="取消" right-button-text="确认取消" @left-button-click="cancelVisible = false" @right-button-click="confirmCancel">
|
||||
<t-form label-align="top"><t-form-item label="取消原因" required-mark><t-textarea v-model.trim="cancelReason" borderless autosize maxlength="500" placeholder="请输入取消原因" /></t-form-item></t-form>
|
||||
</bottom-popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { BottomPopup } from "timi-tdesign-mobile";
|
||||
import { PassTimeLabel } from "timi-web";
|
||||
import { PassTimeLabel, Time } from "timi-web";
|
||||
import { useUserStore } from "timi-web-api";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import SalesOrderAPI from "@/api/SalesOrderAPI";
|
||||
import CustomerProfileCard from "@/components/CustomerProfileCard.vue";
|
||||
import { useCurrentStoreStore } from "@/store/currentStoreStore";
|
||||
import type { CustomerPackageStatus, GaoCustomerPackage } from "@/types/Package";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { GaoCustomerPackage } from "@/types/Package";
|
||||
import type { OrderFulfillment } from "@/types/Fulfillment";
|
||||
import type { SalesOrder } from "@/types/SalesOrder";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import {
|
||||
canCreatePackageDelivery,
|
||||
formatPackageAmount,
|
||||
getCustomerPackageStatusText,
|
||||
getPackageQuantityText,
|
||||
getPaymentStatusText,
|
||||
getRefundStatusText,
|
||||
isStoreManagerRequiredForPackageDelivery
|
||||
} from "@/utils/package";
|
||||
import { formatPackageAmount, getCustomerPackageStatusText, getPackageQuantityText } from "@/utils/package";
|
||||
import { getFulfillmentStatusText, getFulfillmentTypeText, getSalesPaymentStatusText, getSalesRefundStatusText } from "@/utils/salesOrder";
|
||||
import { Message } from "@/utils/message";
|
||||
import { gaoRoleCodes, permissionCodes } from "@/utils/permission";
|
||||
import { permissionCodes } from "@/utils/permission";
|
||||
|
||||
defineOptions({ name: "CustomerPackageDetail" });
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const navBarStore = useNavBarStore();
|
||||
const userStore = useUserStore();
|
||||
const currentStoreStore = useCurrentStoreStore();
|
||||
const customerPackage = ref<GaoCustomerPackage>();
|
||||
const order = ref<SalesOrder>();
|
||||
const isLoading = ref(false);
|
||||
const canReceivePayment = computed(() => customerPackage.value?.status === "ACTIVE" && customerPackage.value.paymentStatus !== "PAID" && userStore.hasPermissions(permissionCodes.fundReceive.create));
|
||||
const isStoreManager = computed(() => userStore.hasRoles(gaoRoleCodes.storeManager) && !userStore.hasRoles(gaoRoleCodes.globalManager));
|
||||
const canCreateDelivery = computed(() => customerPackage.value?.status === "ACTIVE"
|
||||
&& canCreatePackageDelivery(customerPackage.value)
|
||||
&& (!isStoreManagerRequiredForPackageDelivery(customerPackage.value) || isStoreManager.value)
|
||||
&& userStore.hasPermissions(permissionCodes.packageDelivery.create));
|
||||
const canCancelPackage = computed(() => customerPackage.value?.status === "ACTIVE" && userStore.hasPermissions(permissionCodes.customerPackage.cancel));
|
||||
const canRefund = computed(() => customerPackage.value?.status === "CANCELLED" && customerPackage.value.refundStatus === "PENDING" && userStore.hasPermissions(permissionCodes.fund.refund));
|
||||
const canReadEventRecord = computed(() => userStore.hasPermissions(permissionCodes.eventRecord.read));
|
||||
const canReadPackageConfig = computed(() => userStore.hasPermissions(permissionCodes.packageConfig.read));
|
||||
const canReadDelivery = computed(() => userStore.hasPermissions(permissionCodes.packageDelivery.read));
|
||||
const hasPendingDelivery = computed(() => customerPackage.value?.itemList?.some(item => 0 < Number(item.pendingQuantity)) ?? false);
|
||||
const canReadFund = computed(() => userStore.hasPermissions(permissionCodes.fundRecord.read));
|
||||
const cancelPopupVisible = ref(false);
|
||||
const cancelVisible = ref(false);
|
||||
const cancelReason = ref("");
|
||||
const isCancelling = ref(false);
|
||||
const canConfirmCancel = computed(() => !!cancelReason.value.trim());
|
||||
|
||||
/** 计算扣除已核销和待核销收款后的剩余待收款金额。 */
|
||||
function getRemainingReceivableAmount(packageEntity: GaoCustomerPackage): number | undefined {
|
||||
if (packageEntity.saleAmount === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
const remainingAmount = packageEntity.saleAmount - (packageEntity.paidAmount || 0) - (packageEntity.pendingPaidAmount || 0);
|
||||
return 0 < remainingAmount ? remainingAmount : 0;
|
||||
}
|
||||
|
||||
function getStatusTheme(status?: CustomerPackageStatus): "success" | "default" {
|
||||
return status === "ACTIVE" ? "success" : "default";
|
||||
}
|
||||
const canCancel = computed(() => customerPackage.value?.status === "ACTIVE" && userStore.hasPermissions(permissionCodes.customerPackage.cancel));
|
||||
const canCreateFulfillment = computed(() => userStore.hasPermissions(permissionCodes.orderFulfillment.create));
|
||||
const canReadOrder = computed(() => userStore.hasPermissions(permissionCodes.salesOrder.read));
|
||||
const canReadFund = computed(() => userStore.hasPermissions(permissionCodes.fundRecord.read));
|
||||
const canReadPackageConfig = computed(() => userStore.hasPermissions(permissionCodes.packageConfig.read));
|
||||
const canReadEventRecord = computed(() => userStore.hasPermissions(permissionCodes.eventRecord.read));
|
||||
const hasAvailableItem = computed(() => customerPackage.value?.itemList?.some(item => 0 < Number(item.availableQuantity)) ?? false);
|
||||
|
||||
async function loadData(): Promise<void> {
|
||||
const id = String(route.params.id || "");
|
||||
if (!id) {
|
||||
return;
|
||||
}
|
||||
if (!id) return;
|
||||
isLoading.value = true;
|
||||
try {
|
||||
if (userStore.hasRoles(gaoRoleCodes.globalManager)) {
|
||||
await currentStoreStore.loadStoreList();
|
||||
} else {
|
||||
await currentStoreStore.loadLoginStore();
|
||||
}
|
||||
customerPackage.value = await PackageAPI.customerPackageDetail(id);
|
||||
order.value = customerPackage.value.salesOrderId && canReadOrder.value
|
||||
? await SalesOrderAPI.detail(customerPackage.value.salesOrderId)
|
||||
: undefined;
|
||||
} catch (error) {
|
||||
customerPackage.value = undefined;
|
||||
Message.error(getErrorMessage(error, "客户套餐加载失败"));
|
||||
@@ -240,266 +114,39 @@ async function loadData(): Promise<void> {
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function toPayment(): Promise<void> {
|
||||
if (customerPackage.value?.id) {
|
||||
await router.push(`/management/customer-packages/${customerPackage.value.id}/payment`);
|
||||
}
|
||||
}
|
||||
|
||||
async function toPackageConfigDetail(): Promise<void> {
|
||||
const id = customerPackage.value?.packageConfigId;
|
||||
if (id && canReadPackageConfig.value) {
|
||||
function getStatusTheme(status?: string): "success" | "warning" | "danger" | "default" { return status === "ACTIVE" ? "success" : status === "CANCELLED" ? "danger" : "default"; }
|
||||
function getFulfillmentSummary(item: OrderFulfillment): string { return `${item.deliveredAt ? Time.toDateTime(item.deliveredAt) : "时间未知"} · ${(item.itemList || []).length} 项`; }
|
||||
async function toOrder(): Promise<void> { if (order.value?.id) await router.push(`/management/sales-orders/${order.value.id}`); }
|
||||
async function toPackageConfig(): Promise<void> { if (customerPackage.value?.packageConfigId) await router.push(`/management/package-configs/${customerPackage.value.packageConfigId}`); }
|
||||
async function toEventRecord(): Promise<void> { if (customerPackage.value?.purchaseEventRecord?.id) await router.push(`/management/registration-event-records/${customerPackage.value.purchaseEventRecord.id}`); }
|
||||
async function toFundRecords(): Promise<void> { if (order.value?.id) await router.push({ path: "/management/fund-records", query: { salesOrderId: order.value.id } }); }
|
||||
async function toFulfillment(id?: string): Promise<void> { if (id) await router.push(`/management/order-fulfillments/${id}`); }
|
||||
async function toCreateFulfillment(): Promise<void> {
|
||||
if (order.value?.id && customerPackage.value?.id) {
|
||||
await router.push({
|
||||
name: "PackageConfigDetail",
|
||||
params: { id },
|
||||
query: { transitionDepth: String(getCurrentRouteDepth() + 1) }
|
||||
path: "/management/order-fulfillments/create",
|
||||
query: { salesOrderId: order.value.id, customerPackageId: customerPackage.value.id }
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
async function toPurchaseEventRecord(): Promise<void> {
|
||||
const id = customerPackage.value?.purchaseEventRecord?.id;
|
||||
if (id && canReadEventRecord.value) {
|
||||
await router.push({
|
||||
name: "EventRecordDetail",
|
||||
params: { id },
|
||||
query: { transitionDepth: String(getCurrentRouteDepth() + 1) }
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
async function toDelivery(): Promise<void> {
|
||||
if (customerPackage.value?.id) {
|
||||
await router.push(`/management/customer-packages/${customerPackage.value.id}/delivery/create`);
|
||||
}
|
||||
}
|
||||
|
||||
async function toCancel(): Promise<void> {
|
||||
if (!customerPackage.value?.id || !canCancelPackage.value) {
|
||||
return;
|
||||
}
|
||||
cancelReason.value = "";
|
||||
cancelPopupVisible.value = true;
|
||||
}
|
||||
|
||||
function closeCancelPopup(): void {
|
||||
if (isCancelling.value) {
|
||||
return;
|
||||
}
|
||||
cancelPopupVisible.value = false;
|
||||
}
|
||||
|
||||
function openCancel(): void { cancelReason.value = ""; cancelVisible.value = true; }
|
||||
async function confirmCancel(): Promise<void> {
|
||||
const id = customerPackage.value?.id;
|
||||
const reason = cancelReason.value.trim();
|
||||
if (!id || !canCancelPackage.value || !reason || isCancelling.value) {
|
||||
return;
|
||||
}
|
||||
if (!customerPackage.value?.id || !cancelReason.value || isCancelling.value) return;
|
||||
isCancelling.value = true;
|
||||
try {
|
||||
await PackageAPI.cancel(id, reason);
|
||||
cancelPopupVisible.value = false;
|
||||
Message.success("客户套餐已取消");
|
||||
await loadData();
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "套餐取消失败，请刷新后确认状态"));
|
||||
} finally {
|
||||
isCancelling.value = false;
|
||||
}
|
||||
try { await PackageAPI.cancel(customerPackage.value.id, cancelReason.value); cancelVisible.value = false; Message.success("客户套餐已取消"); await loadData(); }
|
||||
catch (error) { Message.error(getErrorMessage(error, "套餐取消失败")); }
|
||||
finally { isCancelling.value = false; }
|
||||
}
|
||||
|
||||
async function toRefund(): Promise<void> {
|
||||
if (customerPackage.value?.id) {
|
||||
await router.push(`/management/customer-packages/${customerPackage.value.id}/refund`);
|
||||
}
|
||||
}
|
||||
|
||||
async function toDeliveryList(): Promise<void> {
|
||||
await navigateToDeliveryList();
|
||||
}
|
||||
|
||||
async function toPendingDeliveryList(): Promise<void> {
|
||||
await navigateToDeliveryList(true);
|
||||
}
|
||||
|
||||
async function navigateToDeliveryList(showPending = false): Promise<void> {
|
||||
if (customerPackage.value?.id) {
|
||||
const query = {
|
||||
customerPackageId: customerPackage.value.id,
|
||||
transitionDepth: String(getCurrentRouteDepth() + 1),
|
||||
...(showPending ? { status: "PENDING" } : {})
|
||||
};
|
||||
await router.push({
|
||||
path: "/management/package-deliveries",
|
||||
query
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
async function toFundList(): Promise<void> {
|
||||
await navigateToFundList();
|
||||
}
|
||||
|
||||
async function toPendingFundList(): Promise<void> {
|
||||
await navigateToFundList(true);
|
||||
}
|
||||
|
||||
async function navigateToFundList(showPendingReceive = false): Promise<void> {
|
||||
if (customerPackage.value?.id) {
|
||||
const query = {
|
||||
customerPackageId: customerPackage.value.id,
|
||||
transitionDepth: String(getCurrentRouteDepth() + 1),
|
||||
...(showPendingReceive ? { operationType: "RECEIVE", status: "PENDING" } : {})
|
||||
};
|
||||
await router.push({ path: "/management/fund-records", query });
|
||||
}
|
||||
}
|
||||
|
||||
function getCurrentRouteDepth(): number {
|
||||
const transitionDepth = Array.isArray(route.query.transitionDepth)
|
||||
? route.query.transitionDepth[0]
|
||||
: route.query.transitionDepth;
|
||||
const depth = Number(transitionDepth);
|
||||
if (transitionDepth && Number.isInteger(depth) && 0 <= depth && depth <= 20) {
|
||||
return depth;
|
||||
}
|
||||
return Number(route.meta.depth ?? 0);
|
||||
}
|
||||
|
||||
onMounted(loadData);
|
||||
watch(() => route.params.id, loadData);
|
||||
onUnmounted(() => navBarStore.clearRight());
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.customer-package-detail {
|
||||
gap: 1rem;
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 2rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.customer {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.package {
|
||||
|
||||
:deep(.t-cell__title) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.title {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.value {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.amount {
|
||||
|
||||
:deep(.t-cell__note) {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
:deep(.t-cell__title-text),
|
||||
:deep(.t-cell__note) {
|
||||
color: var(--td-text-color-secondary);
|
||||
}
|
||||
|
||||
&.sale :deep(.t-cell__title-text),
|
||||
&.sale :deep(.t-cell__note) {
|
||||
color: var(--td-brand-color);
|
||||
}
|
||||
|
||||
&.paid :deep(.t-cell__title-text),
|
||||
&.paid :deep(.t-cell__note) {
|
||||
color: var(--td-success-color);
|
||||
}
|
||||
|
||||
&.pending :deep(.t-cell__title-text),
|
||||
&.pending :deep(.t-cell__note),
|
||||
&.remaining :deep(.t-cell__title-text),
|
||||
&.remaining :deep(.t-cell__note) {
|
||||
color: var(--td-warning-color);
|
||||
}
|
||||
|
||||
&.refunded :deep(.t-cell__title-text),
|
||||
&.refunded :deep(.t-cell__note) {
|
||||
color: var(--td-error-color);
|
||||
}
|
||||
}
|
||||
|
||||
.benefit {
|
||||
padding: .875rem 1rem;
|
||||
|
||||
:deep(.t-cell__title) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.title {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
strong {
|
||||
font-size: .9375rem;
|
||||
}
|
||||
}
|
||||
|
||||
.stats {
|
||||
gap: .5rem;
|
||||
margin-top: .75rem;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
|
||||
.stat {
|
||||
gap: .25rem;
|
||||
min-width: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
|
||||
span {
|
||||
color: var(--td-text-color-secondary);
|
||||
font-size: .6875rem;
|
||||
}
|
||||
|
||||
strong {
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
font-size: 1.5rem;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.available strong {
|
||||
color: var(--td-brand-color);
|
||||
}
|
||||
|
||||
.pending strong {
|
||||
color: var(--td-warning-color);
|
||||
}
|
||||
|
||||
.delivered strong {
|
||||
color: var(--td-success-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.photo-scroller) {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.empty {
|
||||
color: var(--td-text-color-secondary);
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
.customer-package-detail { gap: 1rem; padding: calc(var(--app-nav-height) + 1rem) 0 2rem; display: flex; flex-direction: column;
|
||||
.customer { margin: 0 1rem; }
|
||||
.summary .title, .benefit .title { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
|
||||
.stats { gap: .75rem; display: flex; flex-wrap: wrap; color: var(--td-text-color-secondary); }
|
||||
.stats strong { color: var(--td-text-color-primary); }
|
||||
.empty { color: var(--td-text-color-secondary); padding: 1rem; text-align: center; }
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -17,12 +17,6 @@
|
||||
:options="statusOptions"
|
||||
@change="selectStatus"
|
||||
/>
|
||||
<t-dropdown-item
|
||||
v-model="paymentStatus"
|
||||
label="收款状态"
|
||||
:options="paymentOptions"
|
||||
@change="selectPaymentStatus"
|
||||
/>
|
||||
</t-dropdown-menu>
|
||||
</div>
|
||||
</div>
|
||||
@@ -67,13 +61,7 @@
|
||||
</template>
|
||||
<template #description>
|
||||
<div class="description">
|
||||
<t-tag
|
||||
class="line"
|
||||
theme="primary"
|
||||
variant="outline"
|
||||
:content="getPaymentStatusText(item.paymentStatus)"
|
||||
/>
|
||||
<div class="line" v-text="`成交价：${formatPackageAmount(item.saleAmount)}`" />
|
||||
<div class="line" v-text="`订单：${item.salesOrderId || '未关联'}`" />
|
||||
</div>
|
||||
</template>
|
||||
</t-cell>
|
||||
@@ -89,10 +77,10 @@ import { type DropdownValue } from "tdesign-mobile-vue";
|
||||
import { Text, Toolkit } from "timi-web";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { CustomerPackageStatus, GaoCustomerPackage, PaymentStatus } from "@/types/Package";
|
||||
import type { CustomerPackageStatus, GaoCustomerPackage } from "@/types/Package";
|
||||
import { getCustomerPhotoURL } from "@/utils/customer";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { formatPackageAmount, getCustomerPackageStatusText, getPaymentStatusText } from "@/utils/package";
|
||||
import { getCustomerPackageStatusText } from "@/utils/package";
|
||||
import { Message } from "@/utils/message";
|
||||
import { permissionCodes } from "@/utils/permission";
|
||||
|
||||
@@ -102,7 +90,6 @@ const router = useRouter();
|
||||
const navBarStore = useNavBarStore();
|
||||
const keyword = ref("");
|
||||
const status = ref("ALL");
|
||||
const paymentStatus = ref("ALL");
|
||||
const packageList = ref<GaoCustomerPackage[]>([]);
|
||||
const pageIndex = ref(0);
|
||||
const total = ref(0);
|
||||
@@ -115,12 +102,6 @@ const statusOptions = [
|
||||
{ label: "已履约", value: "FULFILLED" },
|
||||
{ label: "已取消", value: "CANCELLED" }
|
||||
];
|
||||
const paymentOptions = [
|
||||
{ label: "全部收款", value: "ALL" },
|
||||
{ label: "未收款", value: "UNPAID" },
|
||||
{ label: "部分收款", value: "PARTIALLY_PAID" },
|
||||
{ label: "已收款", value: "PAID" }
|
||||
];
|
||||
const loadStateText = computed(() => loading.value ? "正在加载" : noMore.value ? "已经到底了" : "上拉加载更多");
|
||||
|
||||
async function loadMore(): Promise<void> {
|
||||
@@ -133,8 +114,7 @@ async function loadMore(): Promise<void> {
|
||||
index: pageIndex.value,
|
||||
size: 15,
|
||||
keyword: keyword.value || undefined,
|
||||
status: status.value === "ALL" ? undefined : status.value as CustomerPackageStatus,
|
||||
paymentStatus: paymentStatus.value === "ALL" ? undefined : paymentStatus.value as PaymentStatus
|
||||
status: status.value === "ALL" ? undefined : status.value as CustomerPackageStatus
|
||||
});
|
||||
const list = result.list || [];
|
||||
packageList.value = packageList.value.concat(list);
|
||||
@@ -165,13 +145,6 @@ async function selectStatus(value: DropdownValue): Promise<void> {
|
||||
await reload();
|
||||
}
|
||||
|
||||
async function selectPaymentStatus(value: DropdownValue): Promise<void> {
|
||||
if (Array.isArray(value)) {
|
||||
return;
|
||||
}
|
||||
paymentStatus.value = String(value);
|
||||
await reload();
|
||||
}
|
||||
|
||||
const reloadByKeyword = Toolkit.debounce(async () => {
|
||||
try {
|
||||
@@ -223,16 +196,16 @@ onUnmounted(() => {
|
||||
display: flex;
|
||||
padding: .75rem 1rem;
|
||||
position: sticky;
|
||||
background: #F5F5F8;
|
||||
background: var(--td-bg-color-page);
|
||||
box-shadow: var(--td-shadow-1);
|
||||
flex-direction: column;
|
||||
|
||||
.search-input {
|
||||
--td-input-vertical-padding: 8px;
|
||||
--td-input-vertical-padding: 8px 14px;
|
||||
|
||||
border: 1px solid rgba(148, 163, 184, .28);
|
||||
z-index: 1;
|
||||
background: #f8fbff;
|
||||
background: var(--td-bg-color-container);
|
||||
border-radius: 1rem;
|
||||
}
|
||||
|
||||
@@ -243,7 +216,7 @@ onUnmounted(() => {
|
||||
overflow: hidden;
|
||||
margin-top: -1.5rem;
|
||||
padding-top: .8rem;
|
||||
background: #fff;
|
||||
background: var(--td-bg-color-container);
|
||||
border: 1px solid rgba(148, 163, 184, .18);
|
||||
border-radius: 0 0 1rem 1rem;
|
||||
|
||||
@@ -264,7 +237,7 @@ onUnmounted(() => {
|
||||
}
|
||||
|
||||
.list {
|
||||
margin-top: 1rem;
|
||||
margin-top: .75rem;
|
||||
|
||||
.item {
|
||||
padding: 10px;
|
||||
|
||||
@@ -1,237 +0,0 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.fundReceive.create" class="package-operation-edit">
|
||||
<customer-profile-card
|
||||
v-if="customerPackage"
|
||||
class="customer"
|
||||
:customer="customerPackage.customer"
|
||||
v-entrance-transition
|
||||
/>
|
||||
<t-cell-group v-if="customerPackage" title="收款信息" theme="card" v-entrance-transition>
|
||||
<t-cell title="客户套餐" :note="customerPackage.packageNameSnapshot || '未命名套餐'" />
|
||||
<t-cell class="amount sale" title="成交价" :note="formatPackageAmount(customerPackage.saleAmount)" />
|
||||
<t-cell class="amount paid" title="已核销收款" :note="formatPackageAmount(customerPackage.paidAmount)" />
|
||||
<t-cell class="amount pending" title="待核销收款" :note="formatPackageAmount(customerPackage.pendingPaidAmount)" />
|
||||
<t-cell class="amount remaining" title="剩余待收款" :note="formatPackageAmount(getRemainingReceivableAmount(customerPackage))" />
|
||||
</t-cell-group>
|
||||
<t-form v-if="customerPackage" class="form" label-align="left" label-width="7rem" v-entrance-transition="70">
|
||||
<t-form-item label="本次收款（元）" required-mark>
|
||||
<t-input v-model.trim="amountText" type="number" align="right" borderless placeholder="本次实际收款金额" />
|
||||
</t-form-item>
|
||||
<t-form-item label="发生时间" content-align="right">
|
||||
<div class="time-actions">
|
||||
<t-button
|
||||
theme="primary"
|
||||
variant="outline"
|
||||
size="extra-small"
|
||||
:content="occurredAtText || '此刻'"
|
||||
@click="openOccurredAtPicker"
|
||||
/>
|
||||
<t-button
|
||||
v-if="occurredAtText"
|
||||
theme="primary"
|
||||
variant="text"
|
||||
size="extra-small"
|
||||
content="此刻"
|
||||
@click="resetOccurredAt"
|
||||
/>
|
||||
</div>
|
||||
</t-form-item>
|
||||
<t-form-item label="备注">
|
||||
<t-textarea v-model.trim="remark" borderless autosize maxlength="500" placeholder="收款备注" />
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
<package-photo-field v-if="customerPackage" v-model="photoItems" required title="收款凭证照片" />
|
||||
<t-empty v-if="!customerPackage" :description="isLoading ? '正在加载套餐' : '套餐不存在'" />
|
||||
<t-popup v-model="occurredPickerVisible" placement="bottom">
|
||||
<t-date-time-picker
|
||||
v-model="occurredDraft"
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
:mode="['date', 'minute']"
|
||||
title="发生时间"
|
||||
@cancel="occurredPickerVisible = false"
|
||||
@confirm="confirmOccurredAt"
|
||||
/>
|
||||
</t-popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Time } from "timi-web";
|
||||
import { useUserStore } from "timi-web-api";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import CustomerProfileCard from "@/components/CustomerProfileCard.vue";
|
||||
import PackagePhotoField from "@/components/PackagePhotoField.vue";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { GaoCustomerPackage, PackageAttachment } from "@/types/Package";
|
||||
import type { PhotoItem } from "@/types/Photo";
|
||||
import { createPackageRequestNo, formatPackageAmount, parsePackageAmount } from "@/utils/package";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { Message } from "@/utils/message";
|
||||
import { permissionCodes } from "@/utils/permission";
|
||||
|
||||
defineOptions({ name: "CustomerPackagePayment" });
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const userStore = useUserStore();
|
||||
const navBarStore = useNavBarStore();
|
||||
const customerPackage = ref<GaoCustomerPackage>();
|
||||
const isLoading = ref(false);
|
||||
const isSaving = ref(false);
|
||||
const amountText = ref("");
|
||||
const occurredAtText = ref("");
|
||||
const occurredDraft = ref("");
|
||||
const occurredPickerVisible = ref(false);
|
||||
const remark = ref("");
|
||||
const photoItems = ref<PhotoItem[]>([]);
|
||||
|
||||
/** 计算扣除已核销和待核销收款后的剩余待收款金额。 */
|
||||
function getRemainingReceivableAmount(packageEntity: GaoCustomerPackage): number | undefined {
|
||||
if (packageEntity.saleAmount === undefined) {
|
||||
return undefined;
|
||||
}
|
||||
const remainingAmount = packageEntity.saleAmount - (packageEntity.paidAmount || 0) - (packageEntity.pendingPaidAmount || 0);
|
||||
return 0 < remainingAmount ? remainingAmount : 0;
|
||||
}
|
||||
|
||||
function resolveTimestamp(value: string): number | undefined {
|
||||
if (!value) {
|
||||
return undefined;
|
||||
}
|
||||
const timestamp = new Date(value.replace(" ", "T")).getTime();
|
||||
return Number.isFinite(timestamp) ? timestamp : undefined;
|
||||
}
|
||||
|
||||
function openOccurredAtPicker(): void {
|
||||
occurredDraft.value = occurredAtText.value || Time.formatDateTime(new Date());
|
||||
occurredPickerVisible.value = true;
|
||||
}
|
||||
|
||||
function confirmOccurredAt(value?: string | number): void {
|
||||
occurredAtText.value = String(value || occurredDraft.value);
|
||||
occurredPickerVisible.value = false;
|
||||
}
|
||||
|
||||
function resetOccurredAt(): void {
|
||||
occurredAtText.value = "";
|
||||
occurredDraft.value = "";
|
||||
}
|
||||
|
||||
function buildAttachments(): PackageAttachment[] {
|
||||
return photoItems.value.flatMap(item => item.tempFileId ? [{ tempFileId: item.tempFileId, attachType: "PHOTO", name: item.attachment?.name }] : []);
|
||||
}
|
||||
|
||||
async function loadData(): Promise<void> {
|
||||
const id = String(route.params.id || "");
|
||||
if (!id) {
|
||||
return;
|
||||
}
|
||||
isLoading.value = true;
|
||||
try {
|
||||
customerPackage.value = await PackageAPI.customerPackageDetail(id);
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "套餐加载失败"));
|
||||
} finally {
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function save(): Promise<void> {
|
||||
if (isSaving.value) {
|
||||
return;
|
||||
}
|
||||
const customerPackageId = customerPackage.value?.id;
|
||||
const amount = parsePackageAmount(amountText.value);
|
||||
if (!customerPackageId || amount === undefined || 0 >= amount) {
|
||||
Message.warning("请输入大于 0 的合法收款金额");
|
||||
return;
|
||||
}
|
||||
if (!photoItems.value.some(item => item.tempFileId)) {
|
||||
Message.warning("收款必须上传至少一张凭证照片");
|
||||
return;
|
||||
}
|
||||
isSaving.value = true;
|
||||
try {
|
||||
await PackageAPI.receivePayment({
|
||||
requestNo: createPackageRequestNo(),
|
||||
customerPackageId,
|
||||
amount,
|
||||
occurredAt: resolveTimestamp(occurredAtText.value),
|
||||
attachmentList: buildAttachments(),
|
||||
remark: remark.value.trim() || null
|
||||
});
|
||||
Message.success("收款已提交，等待核销");
|
||||
await router.replace(`/management/customer-packages/${customerPackageId}`);
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "收款提交失败，请刷新后确认状态"));
|
||||
} finally {
|
||||
isSaving.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
if (userStore.hasPermissions(permissionCodes.fundReceive.create)) {
|
||||
navBarStore.setRightText("提交", "var(--td-brand-color)", save);
|
||||
}
|
||||
await loadData();
|
||||
});
|
||||
|
||||
onUnmounted(() => navBarStore.clearRight());
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.package-operation-edit {
|
||||
gap: 1rem;
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 2rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.customer {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.amount {
|
||||
|
||||
:deep(.t-cell__note) {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
:deep(.t-cell__title-text),
|
||||
:deep(.t-cell__note) {
|
||||
color: var(--td-text-color-secondary);
|
||||
}
|
||||
|
||||
&.sale :deep(.t-cell__title-text),
|
||||
&.sale :deep(.t-cell__note) {
|
||||
color: var(--td-brand-color);
|
||||
}
|
||||
|
||||
&.paid :deep(.t-cell__title-text),
|
||||
&.paid :deep(.t-cell__note) {
|
||||
color: var(--td-success-color);
|
||||
}
|
||||
|
||||
&.pending :deep(.t-cell__title-text),
|
||||
&.pending :deep(.t-cell__note),
|
||||
&.remaining :deep(.t-cell__title-text),
|
||||
&.remaining :deep(.t-cell__note) {
|
||||
color: var(--td-warning-color);
|
||||
}
|
||||
}
|
||||
|
||||
.form {
|
||||
border-radius: .75rem;
|
||||
}
|
||||
|
||||
.time-actions {
|
||||
gap: .5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.package-photo-field {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,173 +0,0 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.fund.refund" class="package-operation-edit">
|
||||
<t-cell-group v-if="customerPackage" title="退款信息" theme="card" v-entrance-transition>
|
||||
<t-cell title="客户套餐" :note="customerPackage.packageNameSnapshot || '未命名套餐'" />
|
||||
<t-cell title="已核销收款" :note="formatPackageAmount(customerPackage.paidAmount)" />
|
||||
<t-cell title="当前退款状态" :note="getRefundStatusText(customerPackage.refundStatus)" />
|
||||
</t-cell-group>
|
||||
<t-form v-if="customerPackage" class="form" label-align="left" label-width="6rem" v-entrance-transition="70">
|
||||
<t-form-item label="确认无需退款" content-align="right">
|
||||
<t-switch v-model="confirmNone" />
|
||||
</t-form-item>
|
||||
<t-form-item v-if="!confirmNone" label="退款金额（元）" required-mark>
|
||||
<t-input v-model.trim="amountText" type="number" align="right" borderless placeholder="请输入实际退款金额，不自动填充" />
|
||||
</t-form-item>
|
||||
<t-form-item label="退款原因" required-mark>
|
||||
<t-textarea v-model.trim="reason" borderless autosize maxlength="500" placeholder="请输入原因" />
|
||||
</t-form-item>
|
||||
<t-form-item label="发生时间" arrow @click="occurredPickerVisible = true">
|
||||
<span class="picker-text" v-text="occurredAtText || '使用当前时间'" />
|
||||
</t-form-item>
|
||||
<t-form-item label="备注">
|
||||
<t-textarea v-model.trim="remark" borderless autosize maxlength="500" placeholder="备注（可选）" />
|
||||
</t-form-item>
|
||||
</t-form>
|
||||
<package-photo-field v-if="customerPackage && !confirmNone" v-model="photoItems" required title="退款凭证照片" />
|
||||
<t-empty v-if="!customerPackage" :description="isLoading ? '正在加载套餐' : '套餐不存在'" />
|
||||
<t-popup v-model="occurredPickerVisible" placement="bottom">
|
||||
<t-date-time-picker v-model="occurredDraft" format="YYYY-MM-DD HH:mm" :mode="['date', 'minute']" title="发生时间" @cancel="occurredPickerVisible = false" @confirm="confirmOccurredAt" />
|
||||
</t-popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useUserStore } from "timi-web-api";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import PackagePhotoField from "@/components/PackagePhotoField.vue";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { GaoCustomerPackage, PackageAttachment } from "@/types/Package";
|
||||
import type { PhotoItem } from "@/types/Photo";
|
||||
import { createPackageRequestNo, formatPackageAmount, parsePackageAmount, getRefundStatusText } from "@/utils/package";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { Message } from "@/utils/message";
|
||||
import { permissionCodes } from "@/utils/permission";
|
||||
|
||||
defineOptions({ name: "CustomerPackageRefund" });
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const userStore = useUserStore();
|
||||
const navBarStore = useNavBarStore();
|
||||
const customerPackage = ref<GaoCustomerPackage>();
|
||||
const confirmNone = ref(false);
|
||||
const amountText = ref("");
|
||||
const reason = ref("");
|
||||
const remark = ref("");
|
||||
const occurredAtText = ref("");
|
||||
const occurredDraft = ref("");
|
||||
const occurredPickerVisible = ref(false);
|
||||
const photoItems = ref<PhotoItem[]>([]);
|
||||
const isLoading = ref(false);
|
||||
const isSaving = ref(false);
|
||||
|
||||
function confirmOccurredAt(value: string | number): void {
|
||||
occurredAtText.value = String(value);
|
||||
occurredPickerVisible.value = false;
|
||||
}
|
||||
|
||||
function resolveTimestamp(value: string): number | undefined {
|
||||
if (!value) {
|
||||
return undefined;
|
||||
}
|
||||
const timestamp = new Date(value.replace(" ", "T")).getTime();
|
||||
return Number.isFinite(timestamp) ? timestamp : undefined;
|
||||
}
|
||||
|
||||
function buildAttachments(): PackageAttachment[] {
|
||||
return photoItems.value.flatMap(item => item.tempFileId ? [{ tempFileId: item.tempFileId, attachType: "PHOTO", name: item.attachment?.name }] : []);
|
||||
}
|
||||
|
||||
async function loadData(): Promise<void> {
|
||||
const id = String(route.params.id || "");
|
||||
if (!id) {
|
||||
return;
|
||||
}
|
||||
isLoading.value = true;
|
||||
try {
|
||||
customerPackage.value = await PackageAPI.customerPackageDetail(id);
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "套餐加载失败"));
|
||||
} finally {
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function save(): Promise<void> {
|
||||
if (isSaving.value) {
|
||||
return;
|
||||
}
|
||||
const customerPackageId = customerPackage.value?.id;
|
||||
if (!customerPackageId || !reason.value.trim()) {
|
||||
Message.warning("请输入退款原因");
|
||||
return;
|
||||
}
|
||||
const amount = confirmNone.value ? undefined : parsePackageAmount(amountText.value);
|
||||
if (!confirmNone.value && (amount === undefined || 0 >= amount)) {
|
||||
Message.warning("请输入大于 0 的合法退款金额");
|
||||
return;
|
||||
}
|
||||
if (!confirmNone.value && !photoItems.value.some(item => item.tempFileId)) {
|
||||
Message.warning("退款必须上传至少一张凭证照片");
|
||||
return;
|
||||
}
|
||||
isSaving.value = true;
|
||||
try {
|
||||
if (confirmNone.value) {
|
||||
await PackageAPI.confirmNoRefund({
|
||||
requestNo: createPackageRequestNo(),
|
||||
customerPackageId,
|
||||
occurredAt: resolveTimestamp(occurredAtText.value),
|
||||
reason: reason.value.trim(),
|
||||
remark: remark.value.trim() || null
|
||||
});
|
||||
} else {
|
||||
await PackageAPI.refund({
|
||||
requestNo: createPackageRequestNo(),
|
||||
customerPackageId,
|
||||
amount: amount!,
|
||||
occurredAt: resolveTimestamp(occurredAtText.value),
|
||||
reason: reason.value.trim(),
|
||||
attachmentList: buildAttachments(),
|
||||
remark: remark.value.trim() || null
|
||||
});
|
||||
}
|
||||
Message.success(confirmNone.value ? "已确认无需退款" : "退款已登记");
|
||||
await router.replace(`/management/customer-packages/${customerPackageId}`);
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "退款操作失败，请刷新后确认状态"));
|
||||
} finally {
|
||||
isSaving.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
if (userStore.hasPermissions(permissionCodes.fund.refund)) {
|
||||
navBarStore.setRightText("提交处理", "var(--td-brand-color)", save);
|
||||
}
|
||||
await loadData();
|
||||
});
|
||||
|
||||
onUnmounted(() => navBarStore.clearRight());
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.package-operation-edit {
|
||||
gap: 1rem;
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 2rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.form {
|
||||
border-radius: .75rem;
|
||||
}
|
||||
|
||||
.picker-text {
|
||||
width: 100%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.package-photo-field {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,11 +1,19 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.fundRecord.read" class="package-record-detail">
|
||||
<template v-if="record">
|
||||
<section class="hero" v-entrance-transition>
|
||||
<span class="eyebrow" v-text="'资金流水'" />
|
||||
<div class="hero-title">
|
||||
<h1 v-text="getFundOperationText(record.operationType)" />
|
||||
<t-tag :content="getFundStatusText(record.status)" :theme="getStatusTheme(record.status)" variant="light-outline" />
|
||||
</div>
|
||||
<strong class="amount" v-text="formatPackageAmount(record.amount)" />
|
||||
</section>
|
||||
<t-cell-group title="资金记录" theme="card" v-entrance-transition>
|
||||
<t-cell title="操作类型" :note="getFundOperationText(record.operationType)" />
|
||||
<t-cell title="状态"><template #note><t-tag :content="getFundStatusText(record.status)" :theme="getStatusTheme(record.status)" variant="light-outline" /></template></t-cell>
|
||||
<t-cell title="金额" :note="formatPackageAmount(record.amount)" />
|
||||
<t-cell title="客户套餐" :note="record.customerPackageId || record.bizId || '未知'" />
|
||||
<t-cell title="销售订单" :note="record.bizId || '未知'" />
|
||||
<t-cell title="发生时间" :note="record.occurredAt ? Time.toDateTime(record.occurredAt) : '未知'" />
|
||||
<t-cell title="提交人" :note="record.operator?.name || record.operator?.nick || record.operatorUserId || '未知'" />
|
||||
<t-cell title="处理人" :note="record.verifier?.name || record.verifier?.nick || record.verifierUserId || '未处理'" />
|
||||
@@ -32,14 +40,15 @@
|
||||
import { DialogPlugin } from "tdesign-mobile-vue";
|
||||
import { Time } from "timi-web";
|
||||
import { useUserStore } from "timi-web-api";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import SalesOrderAPI from "@/api/SalesOrderAPI";
|
||||
import PhotoScroller from "@/components/PhotoScroller.vue";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { FundRecordStatus, GaoFundRecord } from "@/types/Package";
|
||||
import type { FundRecord, FundRecordStatus } from "@/types/SalesOrder";
|
||||
import type { PhotoItem } from "@/types/Photo";
|
||||
import { getAttachmentReadURL } from "@/utils/attachment";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { formatPackageAmount, getFundOperationText, getFundStatusText } from "@/utils/package";
|
||||
import { formatPackageAmount } from "@/utils/package";
|
||||
import { getFundOperationText, getFundStatusText } from "@/utils/salesOrder";
|
||||
import { Message } from "@/utils/message";
|
||||
import { permissionCodes } from "@/utils/permission";
|
||||
|
||||
@@ -51,7 +60,7 @@ const route = useRoute();
|
||||
const router = useRouter();
|
||||
const userStore = useUserStore();
|
||||
const navBarStore = useNavBarStore();
|
||||
const record = ref<GaoFundRecord>();
|
||||
const record = ref<FundRecord>();
|
||||
const isLoading = ref(false);
|
||||
const isOperating = ref(false);
|
||||
const reasonDialogVisible = ref(false);
|
||||
@@ -72,8 +81,8 @@ const photoItems = computed<PhotoItem[]>(() => (record.value?.attachmentList ||
|
||||
})));
|
||||
const photoURLList = computed(() => photoItems.value.map(item => item.url));
|
||||
|
||||
function getStatusTheme(status?: FundRecordStatus): "success" | "danger" | "default" {
|
||||
return status === "VERIFIED" ? "success" : status === "REJECTED" ? "danger" : "default";
|
||||
function getStatusTheme(status?: FundRecordStatus): "success" | "warning" | "danger" | "default" {
|
||||
return status === "VERIFIED" ? "success" : status === "PENDING" ? "warning" : status === "REJECTED" ? "danger" : "default";
|
||||
}
|
||||
|
||||
async function loadData(): Promise<void> {
|
||||
@@ -83,7 +92,7 @@ async function loadData(): Promise<void> {
|
||||
}
|
||||
isLoading.value = true;
|
||||
try {
|
||||
record.value = await PackageAPI.fundRecordDetail(id);
|
||||
record.value = await SalesOrderAPI.fundRecordDetail(id);
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "资金记录加载失败"));
|
||||
} finally {
|
||||
@@ -92,9 +101,8 @@ async function loadData(): Promise<void> {
|
||||
}
|
||||
|
||||
async function refreshRelatedPackage(): Promise<void> {
|
||||
const customerPackageId = record.value?.customerPackageId || record.value?.bizId;
|
||||
if (customerPackageId) {
|
||||
await PackageAPI.customerPackageDetail(customerPackageId);
|
||||
if (record.value?.bizId) {
|
||||
await SalesOrderAPI.detail(record.value.bizId);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -109,7 +117,7 @@ async function verifyReceive(): Promise<void> {
|
||||
onConfirm: async () => {
|
||||
isOperating.value = true;
|
||||
try {
|
||||
await PackageAPI.verifyPayment(record.value!.id!);
|
||||
await SalesOrderAPI.verifyPayment(record.value!.id!);
|
||||
await refreshRelatedPackage();
|
||||
Message.success("收款已核销");
|
||||
await loadData();
|
||||
@@ -140,9 +148,9 @@ async function submitReason(): Promise<void> {
|
||||
isOperating.value = true;
|
||||
try {
|
||||
if (reasonAction.value === "reject") {
|
||||
await PackageAPI.rejectPayment(record.value.id, reasonText.value.trim());
|
||||
await SalesOrderAPI.rejectPayment({ fundRecordId: record.value.id, reason: reasonText.value.trim() });
|
||||
} else {
|
||||
await PackageAPI.cancelPayment(record.value.id, reasonText.value.trim());
|
||||
await SalesOrderAPI.cancelPayment({ fundRecordId: record.value.id, reason: reasonText.value.trim() });
|
||||
}
|
||||
reasonDialogVisible.value = false;
|
||||
await refreshRelatedPackage();
|
||||
@@ -172,6 +180,44 @@ onUnmounted(() => navBarStore.clearRight());
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.hero {
|
||||
margin: 0 1rem;
|
||||
padding: 1rem;
|
||||
background: linear-gradient(135deg, #eff6ff, #f0fdf4);
|
||||
box-shadow: var(--td-shadow-1);
|
||||
border-radius: 1.25rem;
|
||||
|
||||
.eyebrow {
|
||||
color: #2563eb;
|
||||
display: block;
|
||||
font-size: .6875rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: .08em;
|
||||
}
|
||||
|
||||
.hero-title {
|
||||
gap: .5rem;
|
||||
display: flex;
|
||||
margin-top: .35rem;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
font-size: 1.2rem;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
.amount {
|
||||
color: #0f766e;
|
||||
display: block;
|
||||
margin-top: .75rem;
|
||||
font-size: 1.5rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.photo-scroller) {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
@@ -187,4 +233,16 @@ onUnmounted(() => navBarStore.clearRight());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:global(html.theme-dark) .package-record-detail .hero {
|
||||
background: linear-gradient(135deg, rgba(37, 99, 235, .2), rgba(15, 118, 110, .18));
|
||||
|
||||
.eyebrow {
|
||||
color: #93c5fd;
|
||||
}
|
||||
|
||||
.amount {
|
||||
color: #99f6e4;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,9 +1,11 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.fundRecord.read" class="package-record-list">
|
||||
<t-dropdown-menu>
|
||||
<t-dropdown-item v-model="operationType" label="操作类型" :options="operationOptions" @change="selectOperation" />
|
||||
<t-dropdown-item v-model="status" label="状态" :options="statusOptions" @change="selectStatus" />
|
||||
</t-dropdown-menu>
|
||||
<div class="filters">
|
||||
<t-dropdown-menu>
|
||||
<t-dropdown-item v-model="operationType" label="操作类型" :options="operationOptions" @change="selectOperation" />
|
||||
<t-dropdown-item v-model="status" label="状态" :options="statusOptions" @change="selectStatus" />
|
||||
</t-dropdown-menu>
|
||||
</div>
|
||||
<t-pull-down-refresh v-model="isRefreshing" :refresh-timeout="30000" @refresh="reload" @scrolltolower="loadMore">
|
||||
<t-cell-group v-if="recordList.length" theme="card">
|
||||
<t-cell
|
||||
@@ -34,11 +36,12 @@
|
||||
<script setup lang="ts">
|
||||
import { type DropdownValue } from "tdesign-mobile-vue";
|
||||
import { Time } from "timi-web";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import SalesOrderAPI from "@/api/SalesOrderAPI";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { FundOperationType, FundRecordStatus, GaoFundRecord } from "@/types/Package";
|
||||
import type { FundOperationType, FundRecord, FundRecordStatus } from "@/types/SalesOrder";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { formatPackageAmount, getFundOperationText, getFundStatusText } from "@/utils/package";
|
||||
import { formatPackageAmount } from "@/utils/package";
|
||||
import { getFundOperationText, getFundStatusText } from "@/utils/salesOrder";
|
||||
import { Message } from "@/utils/message";
|
||||
import { permissionCodes } from "@/utils/permission";
|
||||
|
||||
@@ -47,7 +50,7 @@ defineOptions({ name: "FundRecordList" });
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const navBarStore = useNavBarStore();
|
||||
const recordList = ref<GaoFundRecord[]>([]);
|
||||
const recordList = ref<FundRecord[]>([]);
|
||||
const operationType = ref(route.query.operationType === "RECEIVE" ? "RECEIVE" : "ALL");
|
||||
const status = ref(route.query.status === "PENDING" ? "PENDING" : "ALL");
|
||||
const pageIndex = ref(0);
|
||||
@@ -77,10 +80,10 @@ async function loadMore(): Promise<void> {
|
||||
}
|
||||
loading.value = true;
|
||||
try {
|
||||
const result = await PackageAPI.fundRecordList({
|
||||
const result = await SalesOrderAPI.fundRecordList({
|
||||
index: pageIndex.value,
|
||||
size: 15,
|
||||
customerPackageId: String(route.query.customerPackageId || "") || undefined,
|
||||
salesOrderId: String(route.query.salesOrderId || "") || undefined,
|
||||
operationType: operationType.value === "ALL" ? undefined : operationType.value as FundOperationType,
|
||||
status: status.value === "ALL" ? undefined : status.value as FundRecordStatus
|
||||
});
|
||||
@@ -119,15 +122,15 @@ async function selectStatus(value: DropdownValue): Promise<void> {
|
||||
}
|
||||
}
|
||||
|
||||
function getDescription(item: GaoFundRecord): string {
|
||||
return `${item.customer?.name || item.customerId || "未知客户"}｜${item.occurredAt ? Time.toDateTime(item.occurredAt) : "时间未知"}`;
|
||||
function getDescription(item: FundRecord): string {
|
||||
return `${item.customer?.name || item.customerId || "未知客户"}｜订单 ${item.bizId || "未知"}｜${item.occurredAt ? Time.toDateTime(item.occurredAt) : "时间未知"}`;
|
||||
}
|
||||
|
||||
function getStatusTheme(statusValue?: FundRecordStatus): "success" | "warning" | "danger" | "default" {
|
||||
return statusValue === "VERIFIED" ? "success" : statusValue === "PENDING" ? "warning" : statusValue === "REJECTED" ? "danger" : "default";
|
||||
}
|
||||
|
||||
async function toDetail(item: GaoFundRecord): Promise<void> {
|
||||
async function toDetail(item: FundRecord): Promise<void> {
|
||||
if (item.id) {
|
||||
await router.push(`/management/fund-records/${item.id}`);
|
||||
}
|
||||
@@ -147,7 +150,24 @@ onUnmounted(() => navBarStore.clearRight());
|
||||
|
||||
<style scoped lang="less">
|
||||
.package-record-list {
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 1rem;
|
||||
padding: var(--app-nav-height) 0 1rem;
|
||||
|
||||
.filters {
|
||||
top: var(--app-nav-height);
|
||||
z-index: 10;
|
||||
padding: .75rem 1rem .5rem;
|
||||
position: sticky;
|
||||
background: var(--td-bg-color-page);
|
||||
box-shadow: var(--td-shadow-1);
|
||||
|
||||
:deep(.t-dropdown-menu) {
|
||||
border-radius: .875rem;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.t-pull-down-refresh) {
|
||||
padding-top: .75rem;
|
||||
}
|
||||
|
||||
.title-row {
|
||||
gap: .5rem;
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<t-cell title="操作类型" :note="getFundOperationText(record.operationType)" />
|
||||
<t-cell title="金额" :note="formatPackageAmount(record.amount)" />
|
||||
<t-cell title="原状态" :note="getFundStatusText(record.status)" />
|
||||
<t-cell title="客户套餐" :note="record.customerPackageId || record.bizId || '未知'" />
|
||||
<t-cell title="销售订单" :note="record.bizId || '未知'" />
|
||||
</t-cell-group>
|
||||
<t-form v-if="record" class="form" label-align="left" label-width="6rem" v-entrance-transition="70">
|
||||
<t-form-item label="冲正原因" required-mark><t-textarea v-model.trim="reason" borderless autosize maxlength="500" placeholder="请输入冲正原因" /></t-form-item>
|
||||
@@ -20,13 +20,14 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useUserStore } from "timi-web-api";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import { useUserStore, type Attachment } from "timi-web-api";
|
||||
import SalesOrderAPI from "@/api/SalesOrderAPI";
|
||||
import PackagePhotoField from "@/components/PackagePhotoField.vue";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { GaoFundRecord, PackageAttachment } from "@/types/Package";
|
||||
import type { FundRecord } from "@/types/SalesOrder";
|
||||
import type { PhotoItem } from "@/types/Photo";
|
||||
import { createPackageRequestNo, formatPackageAmount, getFundOperationText, getFundStatusText } from "@/utils/package";
|
||||
import { createPackageRequestNo, formatPackageAmount } from "@/utils/package";
|
||||
import { getFundOperationText, getFundStatusText } from "@/utils/salesOrder";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { Message } from "@/utils/message";
|
||||
import { permissionCodes } from "@/utils/permission";
|
||||
@@ -37,7 +38,7 @@ const route = useRoute();
|
||||
const router = useRouter();
|
||||
const userStore = useUserStore();
|
||||
const navBarStore = useNavBarStore();
|
||||
const record = ref<GaoFundRecord>();
|
||||
const record = ref<FundRecord>();
|
||||
const reason = ref("");
|
||||
const remark = ref("");
|
||||
const occurredAtText = ref("");
|
||||
@@ -46,6 +47,7 @@ const pickerVisible = ref(false);
|
||||
const photoItems = ref<PhotoItem[]>([]);
|
||||
const isLoading = ref(false);
|
||||
const isSaving = ref(false);
|
||||
const requestNo = ref("");
|
||||
|
||||
function confirmTime(value: string | number): void {
|
||||
occurredAtText.value = String(value);
|
||||
@@ -60,7 +62,7 @@ function resolveTimestamp(value: string): number | undefined {
|
||||
return Number.isFinite(timestamp) ? timestamp : undefined;
|
||||
}
|
||||
|
||||
function buildAttachments(): PackageAttachment[] {
|
||||
function buildAttachments(): Partial<Attachment>[] {
|
||||
return photoItems.value.flatMap(item => item.tempFileId ? [{ tempFileId: item.tempFileId, attachType: "PHOTO" }] : []);
|
||||
}
|
||||
|
||||
@@ -71,7 +73,7 @@ async function loadData(): Promise<void> {
|
||||
}
|
||||
isLoading.value = true;
|
||||
try {
|
||||
record.value = await PackageAPI.fundRecordDetail(id);
|
||||
record.value = await SalesOrderAPI.fundRecordDetail(id);
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "资金记录加载失败"));
|
||||
} finally {
|
||||
@@ -97,8 +99,11 @@ async function save(): Promise<void> {
|
||||
}
|
||||
isSaving.value = true;
|
||||
try {
|
||||
const result = await PackageAPI.revokeFundRecord({
|
||||
requestNo: createPackageRequestNo(),
|
||||
if (!requestNo.value) {
|
||||
requestNo.value = createPackageRequestNo();
|
||||
}
|
||||
const result = await SalesOrderAPI.fundRecordRevoke({
|
||||
requestNo: requestNo.value,
|
||||
fundRecordId: record.value.id,
|
||||
occurredAt: resolveTimestamp(occurredAtText.value),
|
||||
reason: reason.value.trim(),
|
||||
@@ -106,9 +111,8 @@ async function save(): Promise<void> {
|
||||
remark: remark.value.trim() || null
|
||||
});
|
||||
Message.success("资金记录已冲正");
|
||||
const customerPackageId = record.value.customerPackageId || record.value.bizId;
|
||||
if (customerPackageId) {
|
||||
await router.replace(`/management/customer-packages/${customerPackageId}`);
|
||||
if (record.value.bizId) {
|
||||
await router.replace(`/management/sales-orders/${record.value.bizId}`);
|
||||
return;
|
||||
}
|
||||
await router.replace(`/management/fund-records/${result.id || record.value.id}`);
|
||||
@@ -137,7 +141,12 @@ onUnmounted(() => navBarStore.clearRight());
|
||||
flex-direction: column;
|
||||
|
||||
.form {
|
||||
border-radius: .75rem;
|
||||
margin: 0 1rem;
|
||||
padding: 0 .5rem;
|
||||
background: var(--td-bg-color-container);
|
||||
box-shadow: var(--td-shadow-1);
|
||||
border-radius: 1rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.picker-text {
|
||||
|
||||
@@ -2,8 +2,10 @@
|
||||
<div v-can="permissionCodes.packageConfig.read" class="package-config-detail">
|
||||
<template v-if="config">
|
||||
<section class="hero" v-entrance-transition>
|
||||
<div class="title"><h2 v-text="config.name || '未命名套餐'" /><t-tag :content="getPackageConfigStatusText(config.status)" variant="light-outline" :theme="getStatusTheme(config.status)" /></div>
|
||||
<span class="eyebrow" v-text="'套餐管理'" />
|
||||
<div class="title"><h1 v-text="config.name || '未命名套餐'" /><t-tag :content="getPackageConfigStatusText(config.status)" variant="light-outline" :theme="getStatusTheme(config.status)" /></div>
|
||||
<p v-text="config.description || '暂无套餐说明'" />
|
||||
<div class="hero-meta"><span v-text="`${config.itemList?.length || 0} 项产品权益`" /><strong v-text="formatPackageAmount(config.standardAmount)" /></div>
|
||||
</section>
|
||||
<t-cell-group title="基本信息" theme="card" v-entrance-transition="70">
|
||||
<t-cell title="标准价" :note="formatPackageAmount(config.standardAmount)" />
|
||||
@@ -14,9 +16,9 @@
|
||||
<t-cell-group title="产品权益" theme="card" v-entrance-transition="140">
|
||||
<t-cell
|
||||
v-for="item in config.itemList || []"
|
||||
:key="item.id || `${item.productName}-${item.unit}`"
|
||||
:title="item.productName"
|
||||
:note="`${item.defaultQuantity} ${item.unit}${item.remark ? `｜${item.remark}` : ''}`"
|
||||
:key="item.id || `${item.productId}-${item.productUnitId}`"
|
||||
:title="item.productNameSnapshot || '未命名产品'"
|
||||
:note="`${item.defaultQuantity} ${item.unitSnapshot || ''}${item.remark ? `｜${item.remark}` : ''}`"
|
||||
/>
|
||||
<div v-if="!config.itemList?.length" class="empty" v-text="'暂无产品权益'" />
|
||||
</t-cell-group>
|
||||
@@ -148,9 +150,18 @@ onUnmounted(() => navBarStore.clearRight());
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
h2 {
|
||||
.eyebrow {
|
||||
color: var(--td-brand-color);
|
||||
display: block;
|
||||
font-size: .6875rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: .08em;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
font-size: 1.125rem;
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
p {
|
||||
@@ -158,6 +169,31 @@ onUnmounted(() => navBarStore.clearRight());
|
||||
margin: .5rem 0 0;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.hero-meta {
|
||||
gap: .75rem;
|
||||
display: flex;
|
||||
margin-top: .75rem;
|
||||
color: var(--td-text-color-secondary);
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
strong {
|
||||
color: #c2410c;
|
||||
font-size: 1.2rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:global(html.theme-dark) .package-config-detail .hero {
|
||||
.eyebrow {
|
||||
color: #99f6e4;
|
||||
}
|
||||
|
||||
strong {
|
||||
color: #fdba74;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -36,12 +36,15 @@
|
||||
label-width="6rem"
|
||||
>
|
||||
<div class="header">
|
||||
<t-input v-model="item.productName" borderless placeholder="产品名称" />
|
||||
<strong v-text="item.productNameSnapshot || '未选择产品'" />
|
||||
<t-button theme="danger" variant="text" size="small" @click="removeItem(index)">删除</t-button>
|
||||
</div>
|
||||
<t-form-item label="单位" required-mark>
|
||||
<t-input v-model.trim="item.unit" borderless placeholder="例如 盒、次" />
|
||||
</t-form-item>
|
||||
<product-selector
|
||||
:model-value="item.productId && item.productUnitId ? {productId: item.productId, productUnitId: item.productUnitId} : undefined"
|
||||
label="产品单位"
|
||||
required-mark
|
||||
@update:model-value="applyProduct(index, $event)"
|
||||
/>
|
||||
<t-form-item label="默认配额" required-mark>
|
||||
<t-input v-model.trim="item.defaultQuantity" type="number" borderless />
|
||||
</t-form-item>
|
||||
@@ -79,13 +82,15 @@ import PackageAPI from "@/api/PackageAPI";
|
||||
import { useCurrentStoreStore } from "@/store/currentStoreStore";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { GaoPackageConfig, PackageConfigItem, PackageConfigStatus } from "@/types/Package";
|
||||
import ProductAPI from "@/api/ProductAPI";
|
||||
import type { Product } from "@/types/Product";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { formatPackageAmountInput, getPackageConfigStatusText, normalizePackageQuantity, parsePackageAmount } from "@/utils/package";
|
||||
import { Message } from "@/utils/message";
|
||||
import { gaoRoleCodes, permissionCodes } from "@/utils/permission";
|
||||
|
||||
type PickerValue = string | number;
|
||||
type PackageConfigFormItem = PackageConfigItem & { clientKey: string };
|
||||
type PackageConfigFormItem = Partial<PackageConfigItem> & { clientKey: string };
|
||||
|
||||
defineOptions({ name: "PackageConfigEdit" });
|
||||
|
||||
@@ -132,13 +137,29 @@ function createItem(item?: Partial<PackageConfigItem>): PackageConfigFormItem {
|
||||
return {
|
||||
...item,
|
||||
clientKey: window.crypto.randomUUID(),
|
||||
productName: item?.productName || "",
|
||||
unit: item?.unit || "",
|
||||
defaultQuantity: item?.defaultQuantity ?? "",
|
||||
remark: item?.remark || ""
|
||||
};
|
||||
}
|
||||
|
||||
const productCache = new Map<string, Product>();
|
||||
|
||||
async function applyProduct(index: number, value?: { productId: string; productUnitId: string }): Promise<void> {
|
||||
if (!value) {
|
||||
return;
|
||||
}
|
||||
const product = productCache.get(value.productId) || await ProductAPI.detail(value.productId);
|
||||
productCache.set(value.productId, product);
|
||||
const unit = product.unitList?.find(item => item.id === value.productUnitId);
|
||||
Object.assign(form.itemList[index], {
|
||||
productId: value.productId,
|
||||
productUnitId: value.productUnitId,
|
||||
productNameSnapshot: product.name,
|
||||
unitSnapshot: unit?.name || "",
|
||||
baseQuantityPerUnitSnapshot: unit?.baseQuantityPerUnit
|
||||
});
|
||||
}
|
||||
|
||||
function addItem(): void {
|
||||
form.itemList.push(createItem());
|
||||
}
|
||||
@@ -224,10 +245,10 @@ function validateForm(): boolean {
|
||||
}
|
||||
const keySet = new Set<string>();
|
||||
for (const item of form.itemList) {
|
||||
const quantity = normalizePackageQuantity(item.defaultQuantity);
|
||||
const key = `${item.productName.trim()}\u0000${item.unit.trim()}`;
|
||||
if (!item.productName.trim() || !item.unit.trim() || !quantity || quantity === "0") {
|
||||
Message.warning("产品名称、单位和正数量不能为空");
|
||||
const quantity = normalizePackageQuantity(item.defaultQuantity ?? "");
|
||||
const key = `${item.productId}\u0000${item.productUnitId}`;
|
||||
if (!item.productId || !item.productUnitId || !quantity || quantity === "0") {
|
||||
Message.warning("产品单位和正数量不能为空");
|
||||
return false;
|
||||
}
|
||||
if (keySet.has(key)) {
|
||||
@@ -261,9 +282,9 @@ async function save(): Promise<void> {
|
||||
beginAt: form.beginAt ?? null,
|
||||
endAt: form.endAt ?? null,
|
||||
itemList: form.itemList.map((item, index) => ({
|
||||
productName: item.productName.trim(),
|
||||
unit: item.unit.trim(),
|
||||
defaultQuantity: normalizePackageQuantity(item.defaultQuantity)!,
|
||||
productId: item.productId!,
|
||||
productUnitId: item.productUnitId!,
|
||||
defaultQuantity: normalizePackageQuantity(item.defaultQuantity ?? "")!,
|
||||
sort: index,
|
||||
remark: item.remark?.trim() || null
|
||||
}))
|
||||
@@ -337,6 +358,14 @@ onUnmounted(() => navBarStore.clearRight());
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 calc(1rem + env(safe-area-inset-bottom, 0));
|
||||
flex-direction: column;
|
||||
|
||||
.form {
|
||||
margin: 0 1rem;
|
||||
background: var(--td-bg-color-container);
|
||||
box-shadow: var(--td-shadow-1);
|
||||
border-radius: 1rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.items {
|
||||
padding: 1rem 0;
|
||||
|
||||
|
||||
@@ -224,7 +224,7 @@ onUnmounted(() => {
|
||||
display: flex;
|
||||
padding: .75rem 1rem;
|
||||
position: sticky;
|
||||
background: #F5F5F8;
|
||||
background: var(--td-bg-color-page);
|
||||
box-shadow: var(--td-shadow-1);
|
||||
|
||||
.keyword {
|
||||
@@ -232,7 +232,7 @@ onUnmounted(() => {
|
||||
border: 1px solid var(--td-component-border);
|
||||
z-index: 1;
|
||||
padding: .5rem 1rem;
|
||||
background: #f8fbff;
|
||||
background: var(--td-bg-color-container);
|
||||
border-radius: 1rem;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,208 +0,0 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.packageDelivery.read" class="package-record-detail">
|
||||
<template v-if="delivery">
|
||||
<t-cell-group title="发放单信息" theme="card" v-entrance-transition>
|
||||
<t-cell title="操作类型" :note="getDeliveryOperationText(delivery.operationType)" />
|
||||
<t-cell title="状态"><template #note><t-tag :content="getDeliveryStatusText(delivery.status)" :theme="getStatusTheme(delivery.status)" variant="light-outline" /></template></t-cell>
|
||||
<t-cell title="客户套餐" :note="delivery.customerPackageId || '未知'" />
|
||||
<t-cell title="发放时间" :note="delivery.deliveredAt ? Time.toDateTime(delivery.deliveredAt) : '未知'" />
|
||||
<t-cell title="提交人" :note="delivery.operator?.name || delivery.operator?.nick || delivery.operatorUserId || '未知'" />
|
||||
<t-cell title="处理人" :note="delivery.verifier?.name || delivery.verifier?.nick || delivery.verifierUserId || '未处理'" />
|
||||
<t-cell v-if="delivery.sourceDeliveryId" title="原发放单" :note="delivery.sourceDeliveryId" />
|
||||
<t-cell v-if="delivery.reason" title="原因" :note="delivery.reason" />
|
||||
</t-cell-group>
|
||||
<t-cell-group title="本单明细" theme="card" v-entrance-transition="70">
|
||||
<t-cell
|
||||
v-for="item in delivery.itemList || []"
|
||||
:key="item.customerPackageItemId || item.productNameSnapshot"
|
||||
:title="item.productNameSnapshot || '产品'"
|
||||
:note="`${getPackageQuantityText(item.quantity)} ${item.unitSnapshot || ''}`"
|
||||
/>
|
||||
<div v-if="!delivery.itemList?.length" class="empty" v-text="'暂无明细'" />
|
||||
</t-cell-group>
|
||||
<photo-scroller :model-value="photoURLList" :photo-items="photoItems" title="业务照片" :show-add="false" :show-remove="false" :show-viewer-actions="false" />
|
||||
<section class="actions" v-if="canVerify || canCancel || canRevoke" v-entrance-transition="140">
|
||||
<t-button v-if="canVerify && isPending" theme="primary" @click="verify">核销发放</t-button>
|
||||
<t-button v-if="canVerify && isPending" theme="default" variant="outline" @click="openReasonDialog('reject')">拒绝发放</t-button>
|
||||
<t-button v-if="canCancel && isPending" theme="default" variant="outline" @click="openReasonDialog('cancel')">撤销发放</t-button>
|
||||
<t-button v-if="canRevoke && isVerifiedDelivery" theme="danger" variant="outline" @click="toRevoke">整单冲正</t-button>
|
||||
</section>
|
||||
</template>
|
||||
<t-empty v-else :description="isLoading ? '正在加载发放单' : '发放单不存在'" />
|
||||
<t-dialog v-model:visible="reasonDialogVisible" :title="reasonTitle" :confirm-btn="reasonActionText" @confirm="submitReason">
|
||||
<t-textarea v-model.trim="reasonText" borderless autosize placeholder="请输入原因" />
|
||||
</t-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { DialogPlugin } from "tdesign-mobile-vue";
|
||||
import { Time } from "timi-web";
|
||||
import { useUserStore } from "timi-web-api";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import PhotoScroller from "@/components/PhotoScroller.vue";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { DeliveryStatus, GaoCustomerPackage, GaoPackageDelivery } from "@/types/Package";
|
||||
import type { PhotoItem } from "@/types/Photo";
|
||||
import { getAttachmentReadURL } from "@/utils/attachment";
|
||||
import { getDeliveryOperationText, getDeliveryStatusText, getPackageQuantityText, isStoreManagerRequiredForPackageDelivery } from "@/utils/package";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { Message } from "@/utils/message";
|
||||
import { gaoRoleCodes, permissionCodes } from "@/utils/permission";
|
||||
|
||||
type ReasonAction = "reject" | "cancel";
|
||||
|
||||
defineOptions({ name: "PackageDeliveryDetail" });
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const userStore = useUserStore();
|
||||
const navBarStore = useNavBarStore();
|
||||
const delivery = ref<GaoPackageDelivery>();
|
||||
const customerPackage = ref<GaoCustomerPackage>();
|
||||
const isLoading = ref(false);
|
||||
const isOperating = ref(false);
|
||||
const reasonDialogVisible = ref(false);
|
||||
const reasonText = ref("");
|
||||
const reasonAction = ref<ReasonAction>("reject");
|
||||
const isPending = computed(() => delivery.value?.operationType === "DELIVER" && delivery.value.status === "PENDING");
|
||||
const isVerifiedDelivery = computed(() => delivery.value?.operationType === "DELIVER" && delivery.value.status === "VERIFIED");
|
||||
const isStoreManager = computed(() => userStore.hasRoles(gaoRoleCodes.storeManager) && !userStore.hasRoles(gaoRoleCodes.globalManager));
|
||||
const canVerify = computed(() => userStore.hasPermissions(permissionCodes.packageDelivery.verify)
|
||||
&& (!isStoreManagerRequiredForPackageDelivery(customerPackage.value) || isStoreManager.value));
|
||||
const canCancel = computed(() => userStore.hasPermissions(permissionCodes.packageDelivery.create));
|
||||
const canRevoke = computed(() => userStore.hasPermissions(permissionCodes.packageDelivery.revoke));
|
||||
const reasonTitle = computed(() => reasonAction.value === "reject" ? "拒绝发放" : "撤销发放");
|
||||
const reasonActionText = computed(() => reasonAction.value === "reject" ? "拒绝" : "撤销");
|
||||
const photoItems = computed<PhotoItem[]>(() => (delivery.value?.attachmentList || [])
|
||||
.filter(item => !!item.id)
|
||||
.map(item => ({
|
||||
attachment: item,
|
||||
attachType: item.attachType || "PHOTO",
|
||||
url: getAttachmentReadURL(item.id || "")
|
||||
})));
|
||||
const photoURLList = computed(() => photoItems.value.map(item => item.url));
|
||||
|
||||
function getStatusTheme(status?: DeliveryStatus): "success" | "danger" | "default" {
|
||||
return status === "VERIFIED" ? "success" : status === "REJECTED" ? "danger" : "default";
|
||||
}
|
||||
|
||||
async function loadData(): Promise<void> {
|
||||
const id = String(route.params.id || "");
|
||||
if (!id) {
|
||||
return;
|
||||
}
|
||||
isLoading.value = true;
|
||||
try {
|
||||
delivery.value = await PackageAPI.deliveryDetail(id);
|
||||
customerPackage.value = delivery.value.customerPackageId ? await PackageAPI.customerPackageDetail(delivery.value.customerPackageId) : undefined;
|
||||
} catch (error) {
|
||||
customerPackage.value = undefined;
|
||||
Message.error(getErrorMessage(error, "发放单加载失败"));
|
||||
} finally {
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function refreshRelatedPackage(): Promise<void> {
|
||||
if (delivery.value?.customerPackageId) {
|
||||
await PackageAPI.customerPackageDetail(delivery.value.customerPackageId);
|
||||
}
|
||||
}
|
||||
|
||||
async function verify(): Promise<void> {
|
||||
if (!delivery.value?.id || !isPending.value || !canVerify.value || isOperating.value) {
|
||||
return;
|
||||
}
|
||||
const dialog = DialogPlugin.confirm({
|
||||
title: "核销发放",
|
||||
content: "核销后会增加已发数量，所有权益完成核销后套餐可能变为已履约。确定继续？",
|
||||
confirmBtn: "核销",
|
||||
onConfirm: async () => {
|
||||
isOperating.value = true;
|
||||
try {
|
||||
await PackageAPI.verifyDelivery(delivery.value!.id!);
|
||||
await refreshRelatedPackage();
|
||||
Message.success("发放单已核销");
|
||||
await loadData();
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "发放核销失败，请刷新后确认状态"));
|
||||
} finally {
|
||||
isOperating.value = false;
|
||||
dialog.destroy();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function openReasonDialog(action: ReasonAction): void {
|
||||
if (isOperating.value || !isPending.value) {
|
||||
return;
|
||||
}
|
||||
reasonAction.value = action;
|
||||
reasonText.value = "";
|
||||
reasonDialogVisible.value = true;
|
||||
}
|
||||
|
||||
async function submitReason(): Promise<void> {
|
||||
if (!delivery.value?.id || !reasonText.value.trim() || isOperating.value) {
|
||||
Message.warning("请输入原因");
|
||||
return;
|
||||
}
|
||||
isOperating.value = true;
|
||||
try {
|
||||
if (reasonAction.value === "reject") {
|
||||
await PackageAPI.rejectDelivery(delivery.value.id, reasonText.value.trim());
|
||||
} else {
|
||||
await PackageAPI.cancelDelivery(delivery.value.id, reasonText.value.trim());
|
||||
}
|
||||
await refreshRelatedPackage();
|
||||
reasonDialogVisible.value = false;
|
||||
Message.success(reasonAction.value === "reject" ? "发放单已拒绝" : "发放单已撤销");
|
||||
await loadData();
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "发放状态操作失败，请刷新后确认状态"));
|
||||
} finally {
|
||||
isOperating.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function toRevoke(): Promise<void> {
|
||||
if (delivery.value?.id && isVerifiedDelivery.value && canRevoke.value) {
|
||||
await router.push(`/management/package-deliveries/${delivery.value.id}/revoke`);
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(loadData);
|
||||
onUnmounted(() => navBarStore.clearRight());
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.package-record-detail {
|
||||
gap: 1rem;
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 2rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
:deep(.photo-scroller) {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
.actions {
|
||||
gap: .5rem;
|
||||
padding: 0 1rem;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.t-button {
|
||||
flex: 1 1 8rem;
|
||||
}
|
||||
}
|
||||
|
||||
.empty {
|
||||
color: var(--td-text-color-secondary);
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,157 +0,0 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.packageDelivery.read" class="package-record-list">
|
||||
<div class="filters">
|
||||
<t-dropdown-menu>
|
||||
<t-dropdown-item v-model="status" label="状态" :options="statusOptions" @change="selectStatus" />
|
||||
<t-dropdown-item v-model="operationType" label="操作类型" :options="operationOptions" @change="selectOperation" />
|
||||
</t-dropdown-menu>
|
||||
</div>
|
||||
<t-pull-down-refresh v-model="isRefreshing" :refresh-timeout="30000" @refresh="reload" @scrolltolower="loadMore">
|
||||
<t-cell-group v-if="deliveryList.length" theme="card">
|
||||
<t-cell
|
||||
v-for="(item, index) in deliveryList"
|
||||
:key="item.id"
|
||||
:title="`${getDeliveryOperationText(item.operationType)} · ${getDeliveryStatusText(item.status)}`"
|
||||
:description="getDescription(item)"
|
||||
arrow
|
||||
hover
|
||||
v-entrance-transition="index * 30"
|
||||
@click="toDetail(item)"
|
||||
>
|
||||
<template #note><span v-text="getItemSummary(item)" /></template>
|
||||
</t-cell>
|
||||
</t-cell-group>
|
||||
<div v-else class="empty" v-text="loading ? '正在加载发放记录' : '暂无发放记录'" />
|
||||
<div class="center-tips" v-text="loadStateText" />
|
||||
</t-pull-down-refresh>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { type DropdownValue } from "tdesign-mobile-vue";
|
||||
import { Time } from "timi-web";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { DeliveryOperationType, DeliveryStatus, GaoPackageDelivery } from "@/types/Package";
|
||||
import { getDeliveryOperationText, getDeliveryStatusText, getPackageQuantityText } from "@/utils/package";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { Message } from "@/utils/message";
|
||||
import { permissionCodes } from "@/utils/permission";
|
||||
|
||||
defineOptions({ name: "PackageDeliveryList" });
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const navBarStore = useNavBarStore();
|
||||
const deliveryList = ref<GaoPackageDelivery[]>([]);
|
||||
const pageIndex = ref(0);
|
||||
const total = ref(0);
|
||||
const loading = ref(false);
|
||||
const isRefreshing = ref(false);
|
||||
const noMore = ref(false);
|
||||
const status = ref("ALL");
|
||||
const operationType = ref("ALL");
|
||||
const statusOptions = [
|
||||
{ label: "全部状态", value: "ALL" },
|
||||
{ label: "待核销", value: "PENDING" },
|
||||
{ label: "已核销", value: "VERIFIED" },
|
||||
{ label: "已拒绝", value: "REJECTED" },
|
||||
{ label: "已撤销", value: "CANCELLED" },
|
||||
{ label: "已冲正", value: "REVOKED" }
|
||||
];
|
||||
const operationOptions = [
|
||||
{ label: "全部类型", value: "ALL" },
|
||||
{ label: "正常发放", value: "DELIVER" },
|
||||
{ label: "发放冲正", value: "REVOKE" }
|
||||
];
|
||||
const loadStateText = computed(() => loading.value ? "正在加载" : noMore.value ? "已经到底了" : "上拉加载更多");
|
||||
|
||||
async function loadMore(): Promise<void> {
|
||||
if (loading.value || noMore.value) {
|
||||
return;
|
||||
}
|
||||
loading.value = true;
|
||||
try {
|
||||
const result = await PackageAPI.deliveryList({
|
||||
index: pageIndex.value,
|
||||
size: 15,
|
||||
customerPackageId: String(route.query.customerPackageId || "") || undefined,
|
||||
status: status.value === "ALL" ? undefined : status.value as DeliveryStatus,
|
||||
operationType: operationType.value === "ALL" ? undefined : operationType.value as DeliveryOperationType
|
||||
});
|
||||
const list = result.list || [];
|
||||
deliveryList.value = deliveryList.value.concat(list);
|
||||
total.value = result.total || 0;
|
||||
pageIndex.value += 1;
|
||||
noMore.value = list.length < 15 || total.value <= deliveryList.value.length;
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function reload(): Promise<void> {
|
||||
if (loading.value) {
|
||||
return;
|
||||
}
|
||||
pageIndex.value = 0;
|
||||
deliveryList.value = [];
|
||||
total.value = 0;
|
||||
noMore.value = false;
|
||||
await loadMore();
|
||||
}
|
||||
|
||||
async function selectStatus(value: DropdownValue): Promise<void> {
|
||||
if (!Array.isArray(value)) {
|
||||
status.value = String(value);
|
||||
await reload();
|
||||
}
|
||||
}
|
||||
|
||||
async function selectOperation(value: DropdownValue): Promise<void> {
|
||||
if (!Array.isArray(value)) {
|
||||
operationType.value = String(value);
|
||||
await reload();
|
||||
}
|
||||
}
|
||||
|
||||
function getDescription(item: GaoPackageDelivery): string {
|
||||
return `${item.customerPackageId || "未知客户套餐"}｜${item.deliveredAt ? Time.toDateTime(item.deliveredAt) : "时间未知"}`;
|
||||
}
|
||||
|
||||
function getItemSummary(item: GaoPackageDelivery): string {
|
||||
return (item.itemList || []).map(detail => `${detail.productNameSnapshot || "产品"} ${getPackageQuantityText(detail.quantity)} ${detail.unitSnapshot || ""}`).join("、") || "无明细";
|
||||
}
|
||||
|
||||
async function toDetail(item: GaoPackageDelivery): Promise<void> {
|
||||
if (item.id) {
|
||||
await router.push(`/management/package-deliveries/${item.id}`);
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
navBarStore.clearRight();
|
||||
try {
|
||||
await reload();
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "发放记录加载失败"));
|
||||
}
|
||||
});
|
||||
|
||||
onUnmounted(() => navBarStore.clearRight());
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.package-record-list {
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 1rem;
|
||||
|
||||
.filters {
|
||||
margin-bottom: .75rem;
|
||||
}
|
||||
|
||||
.empty {
|
||||
color: var(--td-text-color-secondary);
|
||||
padding: 2rem 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,152 +0,0 @@
|
||||
<template>
|
||||
<div v-can="permissionCodes.packageDelivery.revoke" class="package-operation-edit">
|
||||
<t-cell-group v-if="delivery" title="原发放单" theme="card" v-entrance-transition>
|
||||
<t-cell title="发放单号" :note="delivery.id" />
|
||||
<t-cell title="客户套餐" :note="delivery.customerPackageId || '未知'" />
|
||||
<t-cell title="原状态" :note="getDeliveryStatusText(delivery.status)" />
|
||||
<t-cell title="原明细" :note="getItemSummary" />
|
||||
</t-cell-group>
|
||||
<t-form v-if="delivery" class="form" label-align="left" label-width="6rem" v-entrance-transition="70">
|
||||
<t-form-item label="冲正原因" required-mark><t-textarea v-model.trim="reason" borderless autosize maxlength="500" placeholder="请输入冲正原因" /></t-form-item>
|
||||
<t-form-item label="冲正时间" arrow @click="pickerVisible = true"><span class="picker-text" v-text="occurredAtText || '使用当前时间'" /></t-form-item>
|
||||
<t-form-item label="备注"><t-textarea v-model.trim="remark" borderless autosize maxlength="500" placeholder="备注（可选）" /></t-form-item>
|
||||
</t-form>
|
||||
<package-photo-field v-if="delivery" v-model="photoItems" required title="冲正凭证照片" />
|
||||
<t-empty v-if="!delivery" :description="isLoading ? '正在加载发放单' : '发放单不存在'" />
|
||||
<t-popup v-model="pickerVisible" placement="bottom">
|
||||
<t-date-time-picker v-model="draftTime" format="YYYY-MM-DD HH:mm" :mode="['date', 'minute']" title="冲正时间" @cancel="pickerVisible = false" @confirm="confirmTime" />
|
||||
</t-popup>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useUserStore } from "timi-web-api";
|
||||
import PackageAPI from "@/api/PackageAPI";
|
||||
import PackagePhotoField from "@/components/PackagePhotoField.vue";
|
||||
import { useNavBarStore } from "@/store/navBarStore";
|
||||
import type { GaoPackageDelivery, PackageAttachment } from "@/types/Package";
|
||||
import type { PhotoItem } from "@/types/Photo";
|
||||
import { createPackageRequestNo, getDeliveryStatusText, getPackageQuantityText } from "@/utils/package";
|
||||
import { getErrorMessage } from "@/utils/error";
|
||||
import { Message } from "@/utils/message";
|
||||
import { permissionCodes } from "@/utils/permission";
|
||||
|
||||
defineOptions({ name: "PackageDeliveryRevoke" });
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const userStore = useUserStore();
|
||||
const navBarStore = useNavBarStore();
|
||||
const delivery = ref<GaoPackageDelivery>();
|
||||
const reason = ref("");
|
||||
const remark = ref("");
|
||||
const occurredAtText = ref("");
|
||||
const draftTime = ref("");
|
||||
const pickerVisible = ref(false);
|
||||
const photoItems = ref<PhotoItem[]>([]);
|
||||
const isLoading = ref(false);
|
||||
const isSaving = ref(false);
|
||||
const getItemSummary = computed(() => (delivery.value?.itemList || []).map(item => `${item.productNameSnapshot || "产品"} ${getPackageQuantityText(item.quantity)} ${item.unitSnapshot || ""}`).join("、") || "无明细");
|
||||
|
||||
function confirmTime(value: string | number): void {
|
||||
occurredAtText.value = String(value);
|
||||
pickerVisible.value = false;
|
||||
}
|
||||
|
||||
function resolveTimestamp(value: string): number | undefined {
|
||||
if (!value) {
|
||||
return undefined;
|
||||
}
|
||||
const timestamp = new Date(value.replace(" ", "T")).getTime();
|
||||
return Number.isFinite(timestamp) ? timestamp : undefined;
|
||||
}
|
||||
|
||||
function buildAttachments(): PackageAttachment[] {
|
||||
return photoItems.value.flatMap(item => item.tempFileId ? [{ tempFileId: item.tempFileId, attachType: "PHOTO" }] : []);
|
||||
}
|
||||
|
||||
async function loadData(): Promise<void> {
|
||||
const id = String(route.params.id || "");
|
||||
if (!id) {
|
||||
return;
|
||||
}
|
||||
isLoading.value = true;
|
||||
try {
|
||||
delivery.value = await PackageAPI.deliveryDetail(id);
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "发放单加载失败"));
|
||||
} finally {
|
||||
isLoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
async function save(): Promise<void> {
|
||||
if (isSaving.value) {
|
||||
return;
|
||||
}
|
||||
if (!delivery.value?.id || delivery.value.status !== "VERIFIED" || delivery.value.operationType !== "DELIVER") {
|
||||
Message.warning("只有已核销的正常发放单可以冲正");
|
||||
return;
|
||||
}
|
||||
if (!reason.value.trim()) {
|
||||
Message.warning("请输入冲正原因");
|
||||
return;
|
||||
}
|
||||
if (!photoItems.value.some(item => item.tempFileId)) {
|
||||
Message.warning("冲正必须上传至少一张照片");
|
||||
return;
|
||||
}
|
||||
isSaving.value = true;
|
||||
try {
|
||||
const result = await PackageAPI.revokeDelivery({
|
||||
requestNo: createPackageRequestNo(),
|
||||
deliveryId: delivery.value.id,
|
||||
deliveredAt: resolveTimestamp(occurredAtText.value),
|
||||
reason: reason.value.trim(),
|
||||
attachmentList: buildAttachments(),
|
||||
remark: remark.value.trim() || null
|
||||
});
|
||||
Message.success("发放单已冲正");
|
||||
if (result.customerPackageId) {
|
||||
await router.replace(`/management/customer-packages/${result.customerPackageId}`);
|
||||
return;
|
||||
}
|
||||
await router.replace(`/management/package-deliveries/${delivery.value.id}`);
|
||||
} catch (error) {
|
||||
Message.error(getErrorMessage(error, "发放冲正失败，请刷新后确认状态"));
|
||||
} finally {
|
||||
isSaving.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
if (userStore.hasPermissions(permissionCodes.packageDelivery.revoke)) {
|
||||
navBarStore.setRightText("提交冲正", "var(--td-danger-color)", save);
|
||||
}
|
||||
await loadData();
|
||||
});
|
||||
|
||||
onUnmounted(() => navBarStore.clearRight());
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.package-operation-edit {
|
||||
gap: 1rem;
|
||||
padding: calc(var(--app-nav-height) + 1rem) 0 2rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.form {
|
||||
border-radius: .75rem;
|
||||
}
|
||||
|
||||
.picker-text {
|
||||
width: 100%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.package-photo-field {
|
||||
padding: 0 1rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user