fix SalesOrderPayment.vue style

src/pages/salesOrder/SalesOrderRefund.vue

@@ -10,7 +10,16 @@
 			<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" /></t-form-item>
 		</t-form>
-		<package-photo-field v-if="order" v-model="photoItems" required title="退款凭证照片" />
+		<photo-scroller
+			v-if="order"
+			:model-value="photoUrlList"
+			v-model:photo-items="photoItems"
+			class="photo-field"
+			:upload="uploadPhotoList"
+			:edit-mode="true"
+			required
+			title="退款凭证照片"
+		/>
 		<t-empty v-if="!order" :description="loading ? '正在加载订单' : '订单不存在'" />
 		<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" />
@@ -20,7 +29,7 @@
 
 <script setup lang="ts">
 import { useUserStore, type Attachment } from "timi-web-api";
-import PackagePhotoField from "@/components/PackagePhotoField.vue";
+import PhotoScroller from "@/components/PhotoScroller.vue";
 import SalesOrderAPI from "@/api/SalesOrderAPI";
 import { useNavBarStore } from "@/store/navBarStore";
 import type { SalesOrder } from "@/types/SalesOrder";
@@ -29,6 +38,7 @@ import { createPackageRequestNo, formatPackageAmount, parsePackageAmount } from
 import { getErrorMessage } from "@/utils/error";
 import { Message } from "@/utils/message";
 import { permissionCodes } from "@/utils/permission";
+import { uploadPhotoList } from "@/utils/photo";
 
 defineOptions({ name: "SalesOrderRefund" });
 const route = useRoute();
@@ -45,6 +55,7 @@ const draftTime = ref("");
 const pickerVisible = ref(false);
 const remark = ref("");
 const photoItems = ref<PhotoItem[]>([]);
+const photoUrlList = computed(() => photoItems.value.map(item => item.url));
 const requestNo = ref("");
 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; }
@@ -86,6 +97,6 @@ onUnmounted(() => navBarStore.clearRight());
 .sales-order-operation { gap: 1rem; padding: calc(var(--app-nav-height) + 1rem) 0 2rem; display: flex; flex-direction: column;
 	.form { 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 { width: 100%; text-align: right; }
-	.package-photo-field { padding: 0 1rem; }
+	.photo-field { padding: 0 1rem; }
 }
 </style>