change type in PhotoScroller

This commit is contained in:
Timi
2026-08-24 17:53:21 +08:00
parent 9b843fc921
commit f42e865430
9 changed files with 316 additions and 35 deletions
+44 -1
View File
@@ -33,8 +33,10 @@
<photo-scroller
:model-value="photoList"
:photo-items="photoItemList"
:show-viewer-actions="canUpdateCustomer"
:show-add="false"
:show-remove="false"
:submit="submitPhotoItems"
title="照片列表"
/>
</template>
@@ -152,7 +154,7 @@
<script setup lang="ts">
import { Message } from "@/utils/message";
import { PassTimeLabel, Text, useUserStore } from "timi-web";
import { PassTimeLabel, Text, useUserStore, type Attachment } from "timi-web";
import CustomerAPI from "@/api/CustomerAPI";
import PointAPI from "@/api/PointAPI";
import TagAPI from "@/api/TagAPI";
@@ -164,6 +166,7 @@ import CustomerTagCard from "@/pages/customer/component/CustomerTagCard.vue";
import { useNavBarStore } from "@/store/navBarStore";
import type { BodyAreaValue, Customer } from "@/types/Customer";
import type { PointAccount } from "@/types/Point";
import type { PhotoItem } from "@/types/Photo";
import type { Tag } from "@/types/Tag";
import { bodyAreaLabelMap } from "@/utils/bodyArea";
import { getAttachmentReadURL } from "@/utils/attachment";
@@ -189,6 +192,7 @@ const canReadStat = computed(() => userStore.hasPermissions(permissionCodes.stat
const canReadPointAccount = computed(() => userStore.hasPermissions(permissionCodes.point.accountRead));
const canReadTag = computed(() => userStore.hasPermissions(corePermissionCodes.tag.read));
const canApplyTag = computed(() => userStore.hasPermissions(corePermissionCodes.tag.apply));
const canUpdateCustomer = computed(() => userStore.hasPermissions(permissionCodes.customer.update));
const removeCustomerName = computed(() => removeTarget.value?.name || "");
const canConfirmRemove = computed(() => !!removeCustomerName.value && removeConfirmName.value === removeCustomerName.value);
@@ -204,11 +208,50 @@ const inviteeCountText = computed(() => `${customer.value?.invitedCount ?? 0}
const photoItemList = computed(() => (customer.value?.attachmentList || [])
.filter(item => !!item.id)
.map(item => ({
attachment: item,
attachType: item.attachType || "PHOTO",
previewUrl: getAttachmentReadURL(item.id || ""),
url: getAttachmentReadURL(item.id || "", 90)
})));
const photoList = computed(() => photoItemList.value.map(item => item.url));
async function submitPhotoItems(photoItems: PhotoItem[]): Promise<void> {
const currentCustomer = customer.value;
if (!currentCustomer?.id || !currentCustomer.name) {
throw new Error("客户资料不完整");
}
const attachmentList = buildPhotoAttachmentList(photoItems);
const payload: Customer = {
...currentCustomer,
attachmentList
};
delete payload.tagApply;
delete payload.introducerCustomer;
await CustomerAPI.update(payload);
customer.value = {
...currentCustomer,
attachmentList
};
}
function buildPhotoAttachmentList(photoItems: PhotoItem[]): Attachment[] {
return photoItems.flatMap(item => {
if (item.attachment) {
return [{
...item.attachment,
attachType: item.attachType || item.attachment.attachType || "PHOTO"
}];
}
if (item.tempFileId) {
return [{
attachType: item.attachType || "PHOTO",
tempFileId: item.tempFileId
}];
}
return [];
});
}
const selectedAreas = computed<BodyAreaValue>({
get() {
return normalizeBodyAreaValue(customer.value?.conditioningPart);
+6 -2
View File
@@ -53,7 +53,8 @@
<div class="photo">
<photo-scroller
v-model="photoList"
:photo-items="photoItemList"
v-model:photo-items="photoItemList"
:edit-mode="true"
:add-actions="photoAddActions"
:loading="isPhotoUploading"
@add-photo="openPhotoPicker('PHOTO')"
@@ -581,7 +582,10 @@ onUnmounted(() => {
function buildAttachmentList(): Attachment[] {
return photoItemList.value.flatMap(item => {
if (item.attachment) {
return [item.attachment];
return [{
...item.attachment,
attachType: item.attachType || item.attachment.attachType || "PHOTO"
}];
}
if (item.tempFileId) {
return [{
+1 -1
View File
@@ -238,7 +238,7 @@ async function printQrCode(): Promise<void> {
.qr-page {
gap: 1rem;
min-height: 100vh;
padding: calc(var(--app-nav-height) + 1rem) 0 6rem 0;
padding: calc(var(--app-nav-height) + 1rem) 0 2rem 0;
display: flex;
flex-direction: column;
+49 -7
View File
@@ -23,8 +23,10 @@
class="photo-panel"
:model-value="recordPhotoList"
:photo-items="recordPhotoItemList"
:show-viewer-actions="canUpdateRecord"
:show-add="false"
:show-remove="false"
:submit="submitPhotoItems"
title="登记照片"
/>
<t-empty v-else :description="isLoading ? '正在加载登记事件记录' : '登记事件记录不存在'" />
@@ -32,13 +34,14 @@
</template>
<script setup lang="ts">
import { Text, Time, useUserStore } from "timi-web";
import { Text, Time, useUserStore, type Attachment } from "timi-web";
import EventRecordAPI from "@/api/EventRecordAPI";
import CustomerProfileCard from "@/components/CustomerProfileCard.vue";
import PhotoScroller from "@/components/PhotoScroller.vue";
import { useNavBarStore } from "@/store/navBarStore";
import type { EventRecord } from "@/types/EventRecord";
import { getEventRecordPhotoURL } from "@/utils/eventRecord";
import type { PhotoItem } from "@/types/Photo";
import { getAttachmentReadURL } from "@/utils/attachment";
import { formatEventNumberValue } from "@/utils/eventValue";
import { permissionCodes } from "@/utils/permission";
@@ -57,13 +60,52 @@ const record = ref<EventRecord>();
const isLoading = ref(false);
const canUpdateRecord = computed(() => userStore.hasPermissions(permissionCodes.eventRecord.update));
const recordPhotoItemList = computed(() => {
const url = getEventRecordPhotoURL(record.value);
const thumbnailURL = getEventRecordPhotoURL(record.value, 64);
return thumbnailURL ? [{ url: thumbnailURL, previewUrl: url }] : [];
});
const recordPhotoItemList = computed(() => (record.value?.attachmentList || [])
.filter(item => !!item.id)
.map(item => ({
attachment: item,
attachType: item.attachType || "PHOTO",
previewUrl: getAttachmentReadURL(item.id || ""),
url: getAttachmentReadURL(item.id || "", 64)
})));
const recordPhotoList = computed(() => recordPhotoItemList.value.map(item => item.url));
async function submitPhotoItems(photoItems: PhotoItem[]): Promise<void> {
const currentRecord = record.value;
if (!currentRecord?.id) {
throw new Error("登记记录不存在");
}
const attachmentList = buildPhotoAttachmentList(photoItems);
await EventRecordAPI.update({
id: currentRecord.id,
remark: currentRecord.remark || "",
attachmentList
});
record.value = {
...currentRecord,
attachmentList
};
}
function buildPhotoAttachmentList(photoItems: PhotoItem[]): Attachment[] {
return photoItems.flatMap(item => {
if (item.attachment) {
return [{
...item.attachment,
attachType: item.attachType || item.attachment.attachType || "PHOTO"
}];
}
if (item.tempFileId) {
return [{
attachType: item.attachType || "PHOTO",
tempFileId: item.tempFileId
}];
}
return [];
});
}
function getNumberValueText(value: EventRecord): string {
return formatEventNumberValue(value.event, value.numberValue);
}
+8 -3
View File
@@ -115,7 +115,8 @@
<div class="photo-part">
<photo-scroller
v-model="photoList"
:photo-items="photoItemList"
v-model:photo-items="photoItemList"
:edit-mode="true"
:loading="isPhotoUploading"
@add="capturePhoto"
/>
@@ -225,6 +226,7 @@ const navBarStore = useNavBarStore();
type EditablePhoto = {
attachment?: Partial<Attachment>;
attachType?: string;
previewUrl?: string;
tempFileId?: string;
url: string;
@@ -694,12 +696,15 @@ function buildTempFileIdList(): string[] {
function buildPhotoAttachmentList(): Array<Partial<Attachment>> {
return photoItemList.value.map((item) => {
if (item.attachment) {
return item.attachment;
return {
...item.attachment,
attachType: item.attachType || item.attachment.attachType || "PHOTO"
};
}
return {
tempFileId: item.tempFileId,
attachType: "PHOTO"
attachType: item.attachType || "PHOTO"
};
});
}
+10 -3
View File
@@ -53,7 +53,8 @@
<photo-scroller
title="客户照片列表"
v-model="customerPhotoList"
:photo-items="customerPhotoItemList"
v-model:photo-items="customerPhotoItemList"
:edit-mode="true"
:add-actions="customerPhotoAddActions"
:loading="customerPhotoUploading"
@add-photo="openCustomerPhotoPicker('PHOTO')"
@@ -109,6 +110,8 @@
<photo-scroller
title="登记事件照片"
v-model="recordPhotoList"
v-model:photo-items="recordPhotoItemList"
:edit-mode="true"
:loading="recordPhotoUploading"
@add="openRecordPhotoPicker"
/>
@@ -254,6 +257,7 @@ let latestDecodedText = "";
const inputCode = computed(() => currentCode.value || scanCode.value || "");
type QuickPhoto = {
attachType?: string;
tempFileId: string;
url: string;
};
@@ -671,7 +675,7 @@ async function saveRecord(): Promise<void> {
if (Toolkit.isNotEmpty(customer.eventRecordList)) {
customer.eventRecordList![0].attachmentList = recordPhotoItemList.value.map(item => ({
tempFileId: item.tempFileId,
attachType: "PHOTO"
attachType: item.attachType || "PHOTO"
}));
}
await EventRecordAPI.createWithCustomer(customer);
@@ -712,7 +716,10 @@ function resetFormAfterSubmit(): void {
function buildCustomerAttachmentList(): Attachment[] {
return customerPhotoItemList.value.flatMap(item => {
if (item.attachment) {
return [item.attachment];
return [{
...item.attachment,
attachType: item.attachType || item.attachment.attachType || "PHOTO"
}];
}
if (item.tempFileId) {
return [{