温馨提示：请上传只有{{ prop == '3D真人肖像' ? '1' : '1-3' }}人的照片
温馨提示：请上传只有1-3只宠物的照片
@@ -256,6 +262,7 @@ import { useRouter } from 'vue-router'
import H5Cropper from 'vue-cropper-h5'
import "vue-cropper-h5/dist/style.css"
import { showLoadingToast, showToast, closeToast, showFailToast, showSuccessToast } from 'vant';
+import type { UploaderFileListItem } from 'vant'
import * as badgeApi from '@/api/badge'
import { localStorage } from '@/utils/local-storage'
@@ -263,6 +270,9 @@ import CryptoJS from 'crypto-js'
const show = ref(false)
const imgShow = ref(false)
+
+const referPicture = ref
([])
+
const router = useRouter()
const option = ref({
canScale: true,
@@ -339,7 +349,7 @@ const getOrderStat = () => {
badgeApi.getOrderStat({}).then((res: any) => {
orderStat.value = res
if (res.type_id == 4) {
- prodId.value = res.prod_id == 1 ? 1 : 2
+ prodId.value = res.prod_id == 1 ? 1 : 19
getKindList()
} else {
prodId.value = res.type_id == 3 ? 8 : res.prod_id
@@ -353,11 +363,11 @@ const getOrderStat = () => {
const kindList = ref([])
const getKindList = () => {
badgeApi.getKindList({
- support_subject: 1,
+ support_subject: prodId.value == 19 ? 2 : 1,
type_id: 4
}).then((res: any) => {
kindList.value = res.list
- kindId.value = res.list && res.list[0].id
+ kindId.value = res.list && res.list[0]?.id
console.log('kindList', kindList.value)
})
}
@@ -368,11 +378,17 @@ const prodChange = (id: number) => {
showToast('人物3D冰箱贴暂未开放')
return
}
- if (typeId.value == 4 && id == 8) {
- showToast('宠物卡通手办暂未开放')
- return
+ if (typeId.value == 4) {
+ if(prodId.value == 19) {
+ showToast('该订单属于宠物卡通手办')
+ return
+ }
+ if(prodId.value == 1) {
+ showToast('该订单属于人物卡通手办')
+ return
+ }
}
- prodId.value = typeId.value == 4 ? id == 8 ? 2 : 1 : id == 7 ? 7 : 8
+ prodId.value = typeId.value == 4 ? id == 8 ? 19 : 1 : id == 7 ? 7 : 8
picture.value = null
kindId.value = 0
}
@@ -566,6 +582,75 @@ const sendFaceToOss = async (src: string, url: string, path: string) => {
}
}
+const onOversize = (file: any) => {
+ if (file.size > 10 * 1024 * 1024) {
+ showToast('照片大小不能超过10M')
+ return false
+ }
+ return true
+}
+
+const beforeRead = (file: any) => {
+ const MIN_WIDTH = 300
+ const MIN_HEIGHT = 300
+ const MAX_SIZE = 10 * 1024 * 1024
+
+ const toPreviewAndCheck = (input: any): Promise => {
+ return new Promise((resolve, reject) => {
+ const raw: File = input.file || input
+ if (raw.size > MAX_SIZE) {
+ showToast('照片大小不能超过10M')
+ reject(false)
+ return
+ }
+ const objectUrl = URL.createObjectURL(raw)
+ const img = new Image()
+ img.src = objectUrl
+ img.onload = () => {
+ const width = img.naturalWidth
+ const height = img.naturalHeight
+ imageWidth.value = width
+ imageHeight.value = height
+ URL.revokeObjectURL(objectUrl)
+ if (width < MIN_WIDTH || height < MIN_HEIGHT) {
+ showToast(`请上传尺寸大于${MIN_WIDTH}×${MIN_HEIGHT}像素的照片`)
+ reject(false)
+ return
+ }
+ const reader = new FileReader()
+ reader.onload = (e) => {
+ const url = e.target?.result as string
+ // 设置回显，不手动 push，交由 v-model 维护
+ const out: any = input
+ out.url = url
+ resolve(out)
+ }
+ reader.onerror = () => {
+ showToast('图片读取失败')
+ reject(false)
+ }
+ reader.readAsDataURL(raw)
+ }
+ img.onerror = () => {
+ showToast('图片加载失败')
+ URL.revokeObjectURL(objectUrl)
+ reject(false)
+ }
+ })
+ }
+
+ if (Array.isArray(file)) {
+ return Promise.allSettled(file.map(toPreviewAndCheck)).then((results) => {
+ const passed = results
+ .filter(r => r.status === 'fulfilled')
+ .map((r: any) => r.value)
+ if (passed.length === 0) return Promise.reject(false)
+ return passed
+ })
+ }
+ return toPreviewAndCheck(file)
+}
+
// 获取Pid
@@ -593,6 +678,17 @@ const getPid = async () => {
sendToOss(imgurl.value, res.oss_url)
]
await Promise.all(uploadTasks)
+ if (typeId.value == 4 && prodId.value == 19 && referPicture.value.length > 0) {
+ const multiUrlTasks = referPicture.value.map((item) => {
+ return badgeApi.getMultiUrl({
+ pid: pid.value,
+ }).then((res: any) => {
+ console.log('multiUrl', res)
+ return sendToOss(item.file, res.multi_url)
+ })
+ })
+ await Promise.all(multiUrlTasks)
+ }
} catch (err) {
closeToast()
console.error('上传失败:', err)
@@ -618,7 +714,7 @@ const getPid = async () => {
// 上传到OSS
const pendingUploads = ref(0)
const isAnotherAPICalled = ref(false)
-const sendToOss = async (src: string, url: string) => {
+const sendToOss = async (src: string | Blob | File, url: string) => {
try {
pendingUploads.value++
const response = await fetch(url, {
@@ -1335,4 +1431,7 @@ onMounted(() => {
background: #50CF54;
color: #fff;
}
+.photo-upload-box-refer {
+ margin: 16px 36px;
+}