|
@@ -23,7 +23,9 @@
|
|
|
<p class="info-line">
|
|
<p class="info-line">
|
|
|
工作台:<span class="info-value">{{ workbench.workStation }}</span>
|
|
工作台:<span class="info-value">{{ workbench.workStation }}</span>
|
|
|
</p>
|
|
</p>
|
|
|
- <p class="info-line hint-text">支持png/jpeg/jpg/webp/heic/heif(heic/heif自动转webp)</p>
|
|
|
|
|
|
|
+ <p class="info-line hint-text">
|
|
|
|
|
+ 支持png/jpeg/jpg/webp/heic/heif(heic/heif自动转webp)
|
|
|
|
|
+ </p>
|
|
|
<van-button
|
|
<van-button
|
|
|
size="mini"
|
|
size="mini"
|
|
|
type="primary"
|
|
type="primary"
|
|
@@ -125,16 +127,31 @@
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="button-group">
|
|
<div class="button-group">
|
|
|
- <van-button class="action-btn" type="warning" plain @click="previewAll">预览全部</van-button>
|
|
|
|
|
- <van-button class="action-btn action-btn--danger" type="danger" plain @click="onReset">重置图片</van-button>
|
|
|
|
|
|
|
+ <van-button
|
|
|
|
|
+ class="action-btn"
|
|
|
|
|
+ type="warning"
|
|
|
|
|
+ plain
|
|
|
|
|
+ @click="previewAll"
|
|
|
|
|
+ >预览全部</van-button
|
|
|
|
|
+ >
|
|
|
|
|
+ <van-button
|
|
|
|
|
+ class="action-btn action-btn--danger"
|
|
|
|
|
+ type="danger"
|
|
|
|
|
+ plain
|
|
|
|
|
+ @click="onReset"
|
|
|
|
|
+ >重置图片</van-button
|
|
|
|
|
+ >
|
|
|
<van-button
|
|
<van-button
|
|
|
class="action-btn"
|
|
class="action-btn"
|
|
|
type="primary"
|
|
type="primary"
|
|
|
plain
|
|
plain
|
|
|
@click="retryAllFailedImages"
|
|
@click="retryAllFailedImages"
|
|
|
:disabled="!hasFailedImages()"
|
|
:disabled="!hasFailedImages()"
|
|
|
- >重传失败图片</van-button>
|
|
|
|
|
- <van-button class="action-btn" type="primary" @click="onSubmit">提交</van-button>
|
|
|
|
|
|
|
+ >重传失败图片
|
|
|
|
|
+ </van-button>
|
|
|
|
|
+ <van-button class="action-btn" type="primary" @click="onSubmit"
|
|
|
|
|
+ >提交</van-button
|
|
|
|
|
+ >
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
@@ -153,9 +170,7 @@
|
|
|
type="primary"
|
|
type="primary"
|
|
|
size="small"
|
|
size="small"
|
|
|
@click="onEditImage(previewCurrentIndex)"
|
|
@click="onEditImage(previewCurrentIndex)"
|
|
|
- :disabled="
|
|
|
|
|
- !canEditImage(getPreviewImage(previewCurrentIndex))
|
|
|
|
|
- "
|
|
|
|
|
|
|
+ :disabled="!canEditImage(getPreviewImage(previewCurrentIndex))"
|
|
|
>
|
|
>
|
|
|
编辑
|
|
编辑
|
|
|
</van-button>
|
|
</van-button>
|
|
@@ -168,6 +183,7 @@
|
|
|
|
|
|
|
|
<script setup lang="ts">
|
|
<script setup lang="ts">
|
|
|
import { ref, onMounted } from 'vue'
|
|
import { ref, onMounted } from 'vue'
|
|
|
|
|
+
|
|
|
// Type declarations for image upload handling
|
|
// Type declarations for image upload handling
|
|
|
enum UPLOAD_STATUS {
|
|
enum UPLOAD_STATUS {
|
|
|
PENDING = 'pending',
|
|
PENDING = 'pending',
|
|
@@ -196,6 +212,7 @@ interface Workbench {
|
|
|
interface EditImageExposed {
|
|
interface EditImageExposed {
|
|
|
editImage: (image: UploadImage, type: 'outer' | 'inner') => void
|
|
editImage: (image: UploadImage, type: 'outer' | 'inner') => void
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
import {
|
|
import {
|
|
|
showFailToast,
|
|
showFailToast,
|
|
|
showNotify,
|
|
showNotify,
|
|
@@ -248,8 +265,6 @@ const handlePreviewChange = (index: number): void => {
|
|
|
previewCurrentIndex.value = index
|
|
previewCurrentIndex.value = index
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
function getWorkbench(): void {
|
|
function getWorkbench(): void {
|
|
|
returnedWorkbench()
|
|
returnedWorkbench()
|
|
|
.then((res) => {
|
|
.then((res) => {
|
|
@@ -262,7 +277,9 @@ function getWorkbench(): void {
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-const beforeReadImage = async (file: File | File[]): Promise<File[] | false> => {
|
|
|
|
|
|
|
+const beforeReadImage = async (
|
|
|
|
|
+ file: File | File[],
|
|
|
|
|
+): Promise<File[] | false> => {
|
|
|
const files = Array.isArray(file) ? file : [file]
|
|
const files = Array.isArray(file) ? file : [file]
|
|
|
const normalizedFiles: File[] = []
|
|
const normalizedFiles: File[] = []
|
|
|
|
|
|
|
@@ -315,6 +332,7 @@ function toUploadImage(item: any): UploadImage {
|
|
|
|
|
|
|
|
// 监听 van-uploader 绑定的数组,自动将新加入的原始文件项转换为 UploadImage
|
|
// 监听 van-uploader 绑定的数组,自动将新加入的原始文件项转换为 UploadImage
|
|
|
import { watch } from 'vue'
|
|
import { watch } from 'vue'
|
|
|
|
|
+
|
|
|
watch(
|
|
watch(
|
|
|
outerImages,
|
|
outerImages,
|
|
|
(newVal, oldVal) => {
|
|
(newVal, oldVal) => {
|
|
@@ -387,7 +405,7 @@ const uploadCategoryWithStatus = async (
|
|
|
results.push({ success: true, item })
|
|
results.push({ success: true, item })
|
|
|
continue
|
|
continue
|
|
|
}
|
|
}
|
|
|
- console.log(item,categoryName)
|
|
|
|
|
|
|
+ console.log(item, categoryName)
|
|
|
const success = await uploadSingleImage(item, categoryName)
|
|
const success = await uploadSingleImage(item, categoryName)
|
|
|
results.push({ success, item })
|
|
results.push({ success, item })
|
|
|
}
|
|
}
|
|
@@ -738,6 +756,8 @@ function getFileNameByMime(fileName: string, dataUrl: string): string {
|
|
|
}
|
|
}
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
<style scoped lang="sass">
|
|
<style scoped lang="sass">
|
|
|
.van-nav-bar
|
|
.van-nav-bar
|
|
|
.left-btn
|
|
.left-btn
|
|
@@ -877,3 +897,4 @@ function getFileNameByMime(fileName: string, dataUrl: string): string {
|
|
|
.upload-status.pending
|
|
.upload-status.pending
|
|
|
background-color: #969799
|
|
background-color: #969799
|
|
|
</style>
|
|
</style>
|
|
|
|
|
+
|