timi/gao-customer-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix OrderFulfillmentList.vue style

Browse Source
This commit is contained in:
Timi
2026-09-05 23:36:53 +08:00
parent 813d511d30
commit 3698f7151f
4 changed files with 172 additions and 102 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/fulfillment/OrderFulfillmentCreate.vue
+9 -75
View File
@@ -1,7 +1,7 @@
<template>
<div v-can="permissionCodes.orderFulfillment.create" class="fulfillment-create">
<t-cell-group title="履约来源" theme="card">
<t-cell title="销售订单" :note="order?.orderNo || order?.id || '请选择直接产品订单'" arrow @click="openOrderPicker" />
<t-cell title="销售订单" :note="order?.orderNo || order?.id || '未找到来源订单'" />
<t-cell title="客户" :note="order?.customer?.name || order?.customerId || '未选择'" />
<t-cell title="来源类型" :note="isPackage ? '套餐权益' : '直接产品'" />
</t-cell-group>
@@ -51,7 +51,7 @@
</div>
</t-form-item>
</t-form>
<div v-else class="empty" v-text="order ? '该订单暂无可履约明细，请从客户套餐或订单详情进入' : '请先选择销售订单'" />
<div v-else class="empty" v-text="'暂无可履约明细，请返回订单详情或客户套餐详情检查'" />
<t-form class="form" label-align="left" label-width="6rem">
<t-form-item label="履约时间" content-align="right">
<t-button
@@ -80,23 +80,6 @@
<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>
<t-popup v-model="orderPickerVisible" placement="bottom" :style="{height: '75vh'}">
<div class="order-picker">
<div class="picker-title" v-text="'选择进行中的直接产品订单'" />
<t-cell-group v-if="orderOptions.length" theme="card">
<t-cell
v-for="item in orderOptions"
:key="item.id"
:title="item.orderNo || item.id"
:description="item.customer?.name || item.customerId || '未知客户'"
:note="formatPackageAmount(item.saleAmount)"
arrow
@click="selectOrder(item)"
/>
</t-cell-group>
<div v-else class="empty" v-text="orderLoading ? '正在加载订单' : '暂无可履约的直接产品订单'" />
</div>
</t-popup>
</div>
</template>
@@ -111,7 +94,7 @@ import type { OrderFulfillmentItemRequest } from "@/types/Fulfillment";
import type { SalesOrder, SalesOrderItem } from "@/types/SalesOrder";
import type { PhotoItem } from "@/types/Photo";
import type { Attachment } from "timi-web-api";
import { createPackageRequestNo, formatPackageAmount, getPackageQuantityText, normalizePackageQuantity } from "@/utils/package";
import { createPackageRequestNo, getPackageQuantityText, normalizePackageQuantity } from "@/utils/package";
import { getErrorMessage } from "@/utils/error";
import { Message } from "@/utils/message";
import { permissionCodes } from "@/utils/permission";
@@ -134,16 +117,17 @@ const requestNo = ref("");
const isSaving = ref(false);
const photoItems = ref<PhotoItem[]>([]);
const photoUrlList = computed(() => photoItems.value.map(item => item.url));
const orderPickerVisible = ref(false);
const orderLoading = ref(false);
const orderOptions = ref<SalesOrder[]>([]);
const isPackage = computed(() => !!customerPackage.value);
const sourceItems = computed<SourceItem[]>(() => customerPackage.value?.itemList || order.value?.itemList || []);
async function loadData(): Promise<void> {
const salesOrderId = String(route.query.salesOrderId || "");
const customerPackageId = String(route.query.customerPackageId || "");
if (!salesOrderId) return;
if (!salesOrderId) {
Message.warning("请从订单详情或客户套餐详情进入履约创建");
await router.replace("/management/order-fulfillments");
return;
}
try {
order.value = await SalesOrderAPI.detail(salesOrderId);
if (customerPackageId) customerPackage.value = await PackageAPI.customerPackageDetail(customerPackageId);
@@ -191,7 +175,7 @@ function buildAttachments(): Partial<Attachment>[] {
function validate(): boolean {
if (!order.value?.id) {
Message.warning("请先从订单详情进入履约创建");
Message.warning("请从订单详情或客户套餐详情进入履约创建");
return false;
}
if (!buildAttachments().length) {
@@ -240,46 +224,6 @@ async function save(): Promise<void> {
}
}
async function openOrderPicker(): Promise<void> {
if (order.value?.id) {
await router.push({
path: `/management/sales-orders/${order.value.id}`,
query: { transitionDepth: String(getCurrentRouteDepth() + 1) }
});
return;
}
orderPickerVisible.value = true;
if (orderOptions.value.length) return;
orderLoading.value = true;
try {
const result = await SalesOrderAPI.list({ index: 0, size: 100, orderType: "DIRECT_PRODUCT", status: "ACTIVE" });
orderOptions.value = result.list || [];
} catch (error) {
Message.error(getErrorMessage(error, "可履约订单加载失败"));
} finally {
orderLoading.value = false;
}
}
async function selectOrder(item: SalesOrder): Promise<void> {
if (!item.id) return;
order.value = item;
orderPickerVisible.value = false;
for (const key of Object.keys(quantityMap)) delete quantityMap[key];
await router.replace({ query: { salesOrderId: item.id } });
}
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(async () => {
navBarStore.setRightText("提交", "var(--td-brand-color)", save);
await loadData();
@@ -347,15 +291,5 @@ onUnmounted(() => navBarStore.clearRight());
text-align: center;
}
.order-picker {
height: 100%;
overflow: auto;
padding: 1rem 0;
}
.picker-title {
padding: 0 1rem 1rem;
font-weight: 700;
}
}
</style>