thumb attach image

src/components/CustomerList.vue

@@ -22,7 +22,7 @@
 						<span v-if="selectable" class="check" :class="{selected: isSelected(item)}">
 							<t-icon v-if="isSelected(item)" name="check" />
 						</span>
-						<t-image v-if="getCustomerPhotoURL(item)" :src="getCustomerPhotoURL(item)" :alt="item.name" fit="cover" class="avatar" />
+						<t-image v-if="getCustomerPhotoURL(item, 64)" :src="getCustomerPhotoURL(item, 64)" :alt="item.name" fit="cover" class="avatar" />
 						<div v-else class="avatar fallback" v-text="(item.name || item.code || '客').slice(0, 1)" />
 					</div>
 				</template>

src/pages/customer/CustomerList.vue

@@ -48,9 +48,9 @@
 				>
 					<template #left-icon>
 						<t-image
-							v-if="getCustomerPhotoURL(item)"
+							v-if="getCustomerPhotoURL(item, 64)"
 							class="avatar"
-							:src="getCustomerPhotoURL(item)"
+							:src="getCustomerPhotoURL(item, 64)"
 							:alt="item.name"
 							fit="cover"
 						/>

src/utils/customer.ts

@@ -1,20 +1,29 @@
 import { AttachmentAPI } from "timi-web";
 import type { BodyAreaValue, Customer } from "@/types/Customer";
 
-export function getCustomerPhotoURL(customer?: Customer): string {
-	return getCustomerAttachmentURL(customer, "PHOTO");
+export function getCustomerPhotoURL(customer?: Customer, thumbnailSize?: number): string {
+	return getCustomerAttachmentURL(customer, "PHOTO", thumbnailSize);
 }
 
-export function getCustomerPointCardURL(customer?: Customer): string {
-	return getCustomerAttachmentURL(customer, "POINT_CARD");
+export function getCustomerPointCardURL(customer?: Customer, thumbnailSize?: number): string {
+	return getCustomerAttachmentURL(customer, "POINT_CARD", thumbnailSize);
 }
 
-function getCustomerAttachmentURL(customer: Customer | undefined, attachType: string): string {
+function getCustomerAttachmentURL(customer: Customer | undefined, attachType: string, thumbnailSize?: number): string {
 	const attachment = customer?.attachmentList?.find(item => item.attachType === attachType);
 	if (!attachment?.id) {
 		return "";
 	}
-	return AttachmentAPI.getReadURL(attachment.id);
+	const url = AttachmentAPI.getReadURL(attachment.id);
+	if (thumbnailSize === undefined) {
+		return url;
+	}
+
+	const params = new URLSearchParams({
+		thumbWidth: String(thumbnailSize),
+		thumbHeight: String(thumbnailSize)
+	});
+	return `${url}?${params.toString()}`;
 }
 
 export function normalizeBodyAreaValue(value: unknown): BodyAreaValue {