|
|
@@ -25,17 +25,9 @@
|
|
|
<el-button type="primary" link icon="View"> 终止 </el-button>
|
|
|
</template>
|
|
|
</el-popconfirm>
|
|
|
- <el-button type="primary" link icon="View" @click="openResultDialog(scope.row.id)" v-if="scope.row.status == '2'"> 预览 </el-button>
|
|
|
+ <el-button type="primary" link icon="View" @click="compareDataAugmentation(scope.row)" v-if="scope.row.status == '2'"> 预览 </el-button>
|
|
|
<el-button type="primary" link icon="View" @click="downloadFile(scope.row)" v-if="scope.row.status == '2'"> 导出 </el-button>
|
|
|
- <el-button
|
|
|
- type="primary"
|
|
|
- link
|
|
|
- icon="View"
|
|
|
- @click="openMetricDialog(scope.row.id)"
|
|
|
- v-if="(scope.row.taskType == '图像增强' || scope.row.taskType == '图像逆光') && scope.row.status == '2'"
|
|
|
- >
|
|
|
- 指标
|
|
|
- </el-button>
|
|
|
+ <el-button type="primary" link icon="View" @click="openMetricDialog(scope.row.id)" v-if="scope.row.status == '2'"> 指标 </el-button>
|
|
|
<el-button type="primary" link icon="View" v-auth="['demo:DataAugmentation:query']" @click="openDialog(3, '任务查看', scope.row)">
|
|
|
查看
|
|
|
</el-button>
|
|
|
@@ -56,16 +48,13 @@
|
|
|
</ProTable>
|
|
|
<DataAugmentationFormDialog ref="formDialogRef" />
|
|
|
<ImportExcel ref="dialogRef" />
|
|
|
- <el-dialog v-model="dialogVisible" title="结果预览" width="80%">
|
|
|
+ <!-- <el-dialog v-model="dialogVisible" title="结果预览" width="80%">
|
|
|
<div style="display: flex; text-align: center">
|
|
|
<div style="width: 50%" v-if="inputVideoUrl">
|
|
|
<video controls width="90%">
|
|
|
<source :src="inputVideoUrl" />
|
|
|
Your browser does not support the video tag.
|
|
|
</video>
|
|
|
- <!-- <video-player ref="videoPlayer" :options="playerOptions" @play="onPlay" @pause="onPause" />
|
|
|
- <button @click="playVideo">开始播放</button>
|
|
|
- <button @click="pauseVideo">暂停播放</button> -->
|
|
|
</div>
|
|
|
<div style="width: 50%" v-if="outputVideoUrl">
|
|
|
<video controls width="90%">
|
|
|
@@ -74,12 +63,28 @@
|
|
|
</video>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </el-dialog>
|
|
|
-
|
|
|
- <!-- <VideoWindow ref="videoWindowRef" :video-url="url"></VideoWindow> -->
|
|
|
- <!-- <el-dialog v-model="logDialogVisible" title="日志" width="80%">
|
|
|
- <el-text class="mx-1">{{ logDialog }}</el-text>
|
|
|
</el-dialog> -->
|
|
|
+
|
|
|
+ <el-dialog v-model="dialogVisible" :title="dialogTitle" width="80%" @close="handleClose">
|
|
|
+ <el-select v-model="imageFps" placeholder="选择帧率" style="width: 200px" @change="changeFps">
|
|
|
+ <el-option label="0" value="0"></el-option>
|
|
|
+ <el-option label="5" value="5"></el-option>
|
|
|
+ <el-option label="15" value="15"></el-option>
|
|
|
+ <el-option label="30" value="30"></el-option>
|
|
|
+ </el-select>
|
|
|
+ <div class="image-dialog" v-if="imageIdx >= 0 && cacheImages[imageIdx]">
|
|
|
+ <div style="width: 50%">
|
|
|
+ <el-image :src="cacheImages[imageIdx].origin[0]"></el-image>
|
|
|
+ </div>
|
|
|
+ <div style="width: 50%">
|
|
|
+ <el-image :src="cacheImages[imageIdx].stable[0]"></el-image>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="image-dialog-btn" v-if="imageFps == 0">
|
|
|
+ <el-button type="primary" @click="pre_picture" :disabled="imageIdx <= 0">上一个</el-button>
|
|
|
+ <el-button type="primary" @click="next_picture" :disabled="imageIdx >= fileCount - 1">下一个</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
<ViewLog ref="viewLogRef" :get-log-api="getDialogApi" />
|
|
|
<el-dialog v-model="metricDialogVisible" title="算法结果指标" width="500px" style="text-align: center">
|
|
|
<el-table :data="metricList" style="width: 100%; margin-left: 10%; text-align: left">
|
|
|
@@ -91,7 +96,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="tsx" name="DataAugmentation">
|
|
|
-import { ref, reactive, onMounted, computed, onUnmounted, onBeforeMount } from 'vue'
|
|
|
+import { ref, reactive, onMounted, computed, onUnmounted, onBeforeMount, watch, nextTick } from 'vue'
|
|
|
import { useHandleData } from '@/hooks/useHandleData'
|
|
|
import { useDownload } from '@/hooks/useDownload'
|
|
|
import { ElMessageBox, ElMessage } from 'element-plus'
|
|
|
@@ -158,6 +163,111 @@ import {
|
|
|
// }
|
|
|
// }
|
|
|
|
|
|
+const handleClose = () => {
|
|
|
+ if (intervalChangeFps.value) {
|
|
|
+ clearInterval(intervalChangeFps.value)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const changeFps = () => {
|
|
|
+ console.log('changeFps')
|
|
|
+ if (intervalChangeFps.value) {
|
|
|
+ clearInterval(intervalChangeFps.value)
|
|
|
+ }
|
|
|
+
|
|
|
+ if (imageFps.value == 0) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ imageIdx.value = 1
|
|
|
+ intervalChangeFps.value = setInterval(() => {
|
|
|
+ next_picture()
|
|
|
+ }, 1000 / imageFps.value)
|
|
|
+}
|
|
|
+const dialogVisible = ref(false)
|
|
|
+const taskId = ref('')
|
|
|
+const imageIdx = ref(0)
|
|
|
+const imageBase64List = ref({
|
|
|
+ origin: '',
|
|
|
+ stable: ''
|
|
|
+})
|
|
|
+const inFileCount = ref(0)
|
|
|
+const outFileCount = ref(0)
|
|
|
+const cacheImages = ref({})
|
|
|
+const dialogTitle = ref('')
|
|
|
+const fileCount = ref(0)
|
|
|
+const imageFps = ref(0)
|
|
|
+const intervalChangeFps: any = ref()
|
|
|
+const loadImageData = async (taskId: string, imageIdx: number) => {
|
|
|
+ const res: any = await getCompareImageApi(taskId, imageIdx)
|
|
|
+ // imageBase64List.value.origin = res.origin
|
|
|
+ // imageBase64List.value.stable = res.stable
|
|
|
+ cacheImages.value[imageIdx].origin = res.origin
|
|
|
+ cacheImages.value[imageIdx].stable = res.stable
|
|
|
+}
|
|
|
+const task_type_view = ref('')
|
|
|
+const compareDataAugmentation = async (params: any) => {
|
|
|
+ if (taskId.value !== '' && taskId.value !== null && taskId.value !== undefined && taskId.value == params.id) {
|
|
|
+ dialogVisible.value = true
|
|
|
+ return
|
|
|
+ }
|
|
|
+ task_type_view.value = params.taskType
|
|
|
+ taskId.value = params.id
|
|
|
+ imageIdx.value = 0
|
|
|
+ cacheImages.value = {}
|
|
|
+ const resCount: any = await getCompareImageCountApi(params.id)
|
|
|
+ if (resCount.code === 200) {
|
|
|
+ inFileCount.value = resCount.data.inFileCount
|
|
|
+ outFileCount.value = resCount.data.outFileCount
|
|
|
+ } else {
|
|
|
+ ElMessage.error('获取图片对比数量失败')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ dialogVisible.value = true
|
|
|
+
|
|
|
+ dialogTitle.value = '缓存图片中'
|
|
|
+ fileCount.value = Math.min(inFileCount.value, outFileCount.value)
|
|
|
+ const res: any = await getCompareImageApi(taskId.value)
|
|
|
+ for (let idx = 1; idx <= fileCount.value; idx++) {
|
|
|
+ dialogTitle.value = '缓存图片中： 第' + idx + '个样本 共' + fileCount.value + '个样本'
|
|
|
+ if (cacheImages.value[idx - 1]) {
|
|
|
+ continue
|
|
|
+ }
|
|
|
+ //const res: any = await getCompareImageApi(taskId.value, idx - 1)
|
|
|
+ // console.log(res)
|
|
|
+
|
|
|
+ cacheImages.value[idx - 1] = {
|
|
|
+ origin: res.origin[idx - 1],
|
|
|
+ stable: res.stable[idx - 1]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // console.log(cacheImages.value[0])
|
|
|
+ if (fileCount.value > 0) {
|
|
|
+ dialogTitle.value = '预览: 第1个样本 共' + fileCount.value + '个样本'
|
|
|
+ } else {
|
|
|
+ dialogTitle.value = '无结果预览'
|
|
|
+ }
|
|
|
+
|
|
|
+ // next_picture()
|
|
|
+}
|
|
|
+const next_picture = async () => {
|
|
|
+ if (imageIdx.value < fileCount.value - 1) {
|
|
|
+ if (!cacheImages.value[imageIdx.value + 1]) {
|
|
|
+ await loadImageData(taskId.value, imageIdx.value + 1)
|
|
|
+ }
|
|
|
+ imageIdx.value = imageIdx.value + 1
|
|
|
+ }
|
|
|
+ dialogTitle.value = '预览: 第' + (imageIdx.value + 1) + '个样本 共' + fileCount.value + '个样本'
|
|
|
+}
|
|
|
+const pre_picture = async () => {
|
|
|
+ if (imageIdx.value > 0) {
|
|
|
+ if (!cacheImages.value[imageIdx.value - 1]) {
|
|
|
+ await loadImageData(taskId.value, imageIdx.value - 1)
|
|
|
+ }
|
|
|
+ imageIdx.value = imageIdx.value - 1
|
|
|
+ }
|
|
|
+ dialogTitle.value = '预览: 第' + (imageIdx.value + 1) + '个样本 共' + fileCount.value + '个样本'
|
|
|
+}
|
|
|
+
|
|
|
//打开指标窗口查看算法指标信息
|
|
|
const metricDialogVisible = ref(false)
|
|
|
const metricList = reactive([])
|
|
|
@@ -168,20 +278,19 @@ const openMetricDialog = async (id: string | number) => {
|
|
|
metricDialogVisible.value = true
|
|
|
}
|
|
|
|
|
|
-const dialogVisible = ref(false)
|
|
|
+// const dialogVisible = ref(false)
|
|
|
const inputVideoUrl = ref()
|
|
|
const outputVideoUrl = ref()
|
|
|
-const openResultDialog = async (id: string | number) => {
|
|
|
- const res: any = await getVideoUrl(id)
|
|
|
- inputVideoUrl.value = res.data.input
|
|
|
- outputVideoUrl.value = res.data.output
|
|
|
- //setPlayerOptions(inputVideoUrl.value)
|
|
|
- // inputVideoUrl.value = '/api/public/video/input/' + id
|
|
|
- // outputVideoUrl.value = '/api/public/video/output/' + id
|
|
|
- console.log(inputVideoUrl)
|
|
|
- dialogVisible.value = true
|
|
|
-}
|
|
|
-const imageIdx = ref(0)
|
|
|
+// const openResultDialog = async (id: string | number) => {
|
|
|
+// const res: any = await getVideoUrl(id)
|
|
|
+// inputVideoUrl.value = res.data.input
|
|
|
+// outputVideoUrl.value = res.data.output
|
|
|
+// //setPlayerOptions(inputVideoUrl.value)
|
|
|
+// // inputVideoUrl.value = '/api/public/video/input/' + id
|
|
|
+// // outputVideoUrl.value = '/api/public/video/output/' + id
|
|
|
+// console.log(inputVideoUrl)
|
|
|
+// dialogVisible.value = true
|
|
|
+// }
|
|
|
|
|
|
const taskType = ref([])
|
|
|
const modelType = ref([
|
