feat: 增加多个训练算法模块功能、更改展示数据

src/assets/mock/tableData.json

@@ -1,91 +1,180 @@
 {
   "tableData": [
     {
-      "name": "混淆矩阵",
-      "algo1": "confusion_matrix.png",
-      "algo2": "confusion_matrix.png",
-      "algo3": "confusion_matrix.png",
-      "algo4": "confusion_matrix.png"
+      "name": "F1曲线",
+      "rtdetr": "rtdetr/train/F1_curve.png",
+      "yolov5": "yolov5/train/F1_curve.png",
+      "yolov8": "yolov8/train/F1_curve.png"
     },
     {
-      "name": "F1曲线",
-      "algo1": "F1_curve.png",
-      "algo2": "F1_curve.png",
-      "algo3": "F1_curve.png",
-      "algo4": "F1_curve.png"
+      "name": "PR曲线(准确率、召回率)",
+      "rtdetr": "rtdetr/train/PR_curve.png",
+      "yolov5": "yolov5/train/PR_curve.png",
+      "yolov8": "yolov8/train/PR_curve.png"
     },
     {
       "name": "P曲线(准确率)",
-      "algo1": "P_curve.png",
-      "algo2": "P_curve.png",
-      "algo3": "P_curve.png",
-      "algo4": "P_curve.png"
+      "rtdetr": "rtdetr/train/P_curve.png",
+      "yolov5": "yolov5/train/P_curve.png",
+      "yolov8": "yolov8/train/P_curve.png"
     },
     {
       "name": "R曲线(召回率)",
-      "algo1": "R_curve.png",
-      "algo2": "R_curve.png",
-      "algo3": "R_curve.png",
-      "algo4": "R_curve.png"
+      "rtdetr": "rtdetr/train/R_curve.png",
+      "yolov5": "yolov5/train/R_curve.png",
+      "yolov8": "yolov8/train/R_curve.png"
     },
     {
       "name": "训练结果曲线",
-      "algo1": "results.png",
-      "algo2": "results.png",
-      "algo3": "results.png",
-      "algo4": "results.png"
+      "rtdetr": "rtdetr/train/results.png",
+      "yolov5": "yolov5/train/results.png",
+      "yolov8": "yolov8/train/results.png"
     }
   ],
   "inferTableData": [
     {
-      "yuan": "input.jpg",
-      "algo1": "results0.jpg",
-      "algo2": "results0.jpg",
-      "algo3": "results0.jpg",
-      "algo4": "results0.jpg"
+      "yuan": "originalImage/0000001_02999_d_0000005.jpg",
+      "rtdetr": "rtdetr/0000001_02999_d_0000005.jpg",
+      "yolov5": "yolov5/0000001_02999_d_0000005.jpg",
+      "yolov8": "yolov8/0000001_02999_d_0000005.jpg"
+    },
+    {
+      "yuan": "originalImage/0000001_03499_d_0000006.jpg",
+      "rtdetr": "rtdetr/0000001_03499_d_0000006.jpg",
+      "yolov5": "yolov5/0000001_03499_d_0000006.jpg",
+      "yolov8": "yolov8/0000001_03499_d_0000006.jpg"
+    },
+    {
+      "yuan": "originalImage/0000001_03999_d_0000007.jpg",
+      "rtdetr": "rtdetr/0000001_03999_d_0000007.jpg",
+      "yolov5": "yolov5/0000001_03999_d_0000007.jpg",
+      "yolov8": "yolov8/0000001_03999_d_0000007.jpg"
     },
     {
-      "yuan": "input.jpg",
-      "algo1": "results0.jpg",
-      "algo2": "results0.jpg",
-      "algo3": "results0.jpg",
-      "algo4": "results0.jpg"
+      "yuan": "originalImage/0000001_04527_d_0000008.jpg",
+      "rtdetr": "rtdetr/0000001_04527_d_0000008.jpg",
+      "yolov5": "yolov5/0000001_04527_d_0000008.jpg",
+      "yolov8": "yolov8/0000001_04527_d_0000008.jpg"
+    },
+    {
+      "yuan": "originalImage/0000001_05249_d_0000009.jpg",
+      "rtdetr": "rtdetr/0000001_05249_d_0000009.jpg",
+      "yolov5": "yolov5/0000001_05249_d_0000009.jpg",
+      "yolov8": "yolov8/0000001_05249_d_0000009.jpg"
+    },
+    {
+      "yuan": "originalImage/0000001_05499_d_0000010.jpg",
+      "rtdetr": "rtdetr/0000001_05499_d_0000010.jpg",
+      "yolov5": "yolov5/0000001_05499_d_0000010.jpg",
+      "yolov8": "yolov8/0000001_05499_d_0000010.jpg"
+    },
+    {
+      "yuan": "originalImage/0000001_05999_d_0000011.jpg",
+      "rtdetr": "rtdetr/0000001_05999_d_0000011.jpg",
+      "yolov5": "yolov5/0000001_05999_d_0000011.jpg",
+      "yolov8": "yolov8/0000001_05999_d_0000011.jpg"
+    },
+    {
+      "yuan": "originalImage/0000001_07999_d_0000012.jpg",
+      "rtdetr": "rtdetr/0000001_07999_d_0000012.jpg",
+      "yolov5": "yolov5/0000001_07999_d_0000012.jpg",
+      "yolov8": "yolov8/0000001_07999_d_0000012.jpg"
+    },
+    {
+      "yuan": "originalImage/0000001_08414_d_0000013.jpg",
+      "rtdetr": "rtdetr/0000001_08414_d_0000013.jpg",
+      "yolov5": "yolov5/0000001_08414_d_0000013.jpg",
+      "yolov8": "yolov8/0000001_08414_d_0000013.jpg"
+    },
+    {
+      "yuan": "originalImage/0000021_00000_d_0000001.jpg",
+      "rtdetr": "rtdetr/0000021_00000_d_0000001.jpg",
+      "yolov5": "yolov5/0000021_00000_d_0000001.jpg",
+      "yolov8": "yolov8/0000021_00000_d_0000001.jpg"
     }
   ],
   "transferImgList1": [
     {
-      "label": "input.jpg",
+      "label": "originalImage/0000001_02999_d_0000005.jpg",
       "key": "111"
     },
     {
-      "label": "results0.jpg",
+      "label": "originalImage/0000001_03499_d_0000006.jpg",
       "key": "112"
     },
     {
-      "label": "F1_curve.png",
+      "label": "originalImage/0000001_03999_d_0000007.jpg",
       "key": "113"
     },
     {
-      "label": "R_curve.png",
+      "label": "originalImage/0000001_04527_d_0000008.jpg",
       "key": "114"
+    },
+    {
+      "label": "originalImage/0000001_05249_d_0000009.jpg",
+      "key": "115"
+    },
+    {
+      "label": "originalImage/0000001_05499_d_0000010.jpg",
+      "key": "116"
+    },
+    {
+      "label": "originalImage/0000001_05999_d_0000011.jpg",
+      "key": "117"
+    },
+    {
+      "label": "originalImage/0000001_07999_d_0000012.jpg",
+      "key": "118"
+    },
+    {
+      "label": "originalImage/0000001_08414_d_0000013.jpg",
+      "key": "119"
+    },
+    {
+      "label": "originalImage/0000021_00000_d_0000001.jpg",
+      "key": "120"
     }
   ],
   "transferImgList2": [
     {
-      "label": "input.jpg",
+      "label": "originalImage/0000001_02999_d_0000005.jpg",
       "key": "111"
     },
     {
-      "label": "input.jpg",
+      "label": "originalImage/0000001_03499_d_0000006.jpg",
       "key": "112"
     },
     {
-      "label": "input.jpg",
+      "label": "originalImage/0000001_03999_d_0000007.jpg",
       "key": "113"
     },
     {
-      "label": "R_curve.png",
+      "label": "originalImage/0000001_04527_d_0000008.jpg",
       "key": "114"
+    },
+    {
+      "label": "originalImage/0000001_05249_d_0000009.jpg",
+      "key": "115"
+    },
+    {
+      "label": "originalImage/0000001_05499_d_0000010.jpg",
+      "key": "116"
+    },
+    {
+      "label": "originalImage/0000001_05999_d_0000011.jpg",
+      "key": "117"
+    },
+    {
+      "label": "originalImage/0000001_07999_d_0000012.jpg",
+      "key": "118"
+    },
+    {
+      "label": "originalImage/0000001_08414_d_0000013.jpg",
+      "key": "119"
+    },
+    {
+      "label": "originalImage/0000021_00000_d_0000001.jpg",
+      "key": "120"
     }
   ]
 }

src/assets/taaisImg/rtdetr/train/results.csv

@@ -0,0 +1,2 @@
+                  epoch,        train/giou_loss,         train/cls_loss,          train/l1_loss,   metrics/precision(B),      metrics/recall(B),       metrics/mAP50(B),    metrics/mAP50-95(B),          val/giou_loss,           val/cls_loss,            val/l1_loss,                 lr/pg0,                 lr/pg1,                 lr/pg2
+                      0,                 1.4521,                0.64555,                 0.4206,                0.43623,                0.26451,                0.24582,                0.14283,                0.83954,                0.55597,                0.10328,             0.00023785,             0.00023785,             0.00023785

src/assets/taaisImg/yolov5/train/results.csv

@@ -0,0 +1,2 @@
+                  epoch,         train/box_loss,         train/cls_loss,         train/dfl_loss,   metrics/precision(B),      metrics/recall(B),       metrics/mAP50(B),    metrics/mAP50-95(B),           val/box_loss,           val/cls_loss,           val/dfl_loss,                 lr/pg0,                 lr/pg1,                 lr/pg2
+                      0,                 1.8928,                 2.2926,                 1.0549,                 0.2974,                0.16136,                0.12747,                0.06827,                 1.7099,                 1.5417,                0.99354,             0.00023785,             0.00023785,             0.00023785

src/assets/taaisImg/yolov8/train/results.csv

@@ -0,0 +1,2 @@
+                  epoch,         train/box_loss,         train/cls_loss,         train/dfl_loss,   metrics/precision(B),      metrics/recall(B),       metrics/mAP50(B),    metrics/mAP50-95(B),           val/box_loss,           val/cls_loss,           val/dfl_loss,                 lr/pg0,                 lr/pg1,                 lr/pg2
+                      0,                 2.3622,                 2.1907,                 2.1491,                0.30392,                0.25798,                0.22157,                0.12002,                 1.7207,                 1.3963,                 1.4123,             0.00023785,             0.00023785,             0.00023785

src/typings/ProForm.d.ts

@@ -117,5 +117,6 @@ declare namespace ProForm {
     controlsPosition?: 'left' | 'right' // 可选
     defaultExpandAll?: boolean
     showCheckbox?: boolean
+    onChange?: (val: string) => void
   }
 }

src/views/taais/homePage/createTask.vue

@@ -1,41 +1,45 @@
 <template>
-  <div class="bigBox">
-    <dv-border-box1 ref="borderRef" style="width: 1000px; height: 600px; margin: 0 auto">
+  <div class="createTask-bigBox">
+    <dv-border-box1 ref="borderRef" style="width: 1000px; height: 650px; margin: 0 auto">
       <div class="createTask-container">
         <h3 class="title">{{ title }}</h3>
         <h4 class="title2" v-if="pageIndex === 4">训练算法</h4>
-        <ProForm :items-options="items" :form-options="_options" :model="model" class="proform">
-          <template #transfer1="{ formModel }">
-            <el-transfer filterable v-model="formModel.transfer1" :data="transferImg1">
-              <template #default="{ option }">
-                <el-image
-                  style="width: 50px; height: 50px"
-                  :preview-src-list="[getImageUrl(option.label)]"
-                  :src="getImageUrl(option.label)"
-                ></el-image>
-              </template>
-            </el-transfer>
-          </template>
-          <template #transfer2="{ formModel }">
-            <el-transfer filterable v-model="formModel.transfer2" :data="transferImg2">
-              <template #default="{ option }">
-                <el-image
-                  style="width: 50px; height: 50px"
-                  :preview-src-list="[getImageUrl(option.label)]"
-                  :src="getImageUrl(option.label)"
-                ></el-image>
-              </template>
-            </el-transfer>
-          </template>
-          <template #username1="{ formModel }">
-            <el-input v-model="formModel.username1" />
-          </template>
-        </ProForm>
-        <el-button class="btn back" v-if="pageIndex === 1" @click="onReturn()"> 返回 </el-button>
-        <el-button class="btn back" v-else @click="onBack()"> 上一步 </el-button>
-        <el-button class="btn" style="margin-left: -15px" v-if="pageIndex === 4" @click="onAdd()"> 增加 </el-button>
-        <el-button class="btn next" type="success" @click="onNext()"> {{ nextBtnText }} </el-button>
+        <div v-for="(item, index) in formItems" :key="index">
+          <ProForm :items-options="item.items" :form-options="_options" :model="item.model" class="proform">
+            <template #transfer1="{ formModel }">
+              <el-transfer filterable v-model="formModel.transfer1" :data="transferImg1">
+                <template #default="{ option }">
+                  <el-image
+                    style="width: 50px; height: 50px"
+                    :preview-src-list="[getImageUrl(option.label)]"
+                    :src="getImageUrl(option.label)"
+                  ></el-image>
+                </template>
+              </el-transfer>
+            </template>
+            <template #transfer2="{ formModel }">
+              <el-transfer filterable v-model="formModel.transfer2" :data="transferImg2">
+                <template #default="{ option }">
+                  <el-image
+                    style="width: 50px; height: 50px"
+                    :preview-src-list="[getImageUrl(option.label)]"
+                    :src="getImageUrl(option.label)"
+                  ></el-image>
+                </template>
+              </el-transfer>
+            </template>
+            <template #username1="{ formModel }">
+              <el-input v-model="formModel.username1" />
+            </template>
+          </ProForm>
+        </div>
       </div>
+      <el-button class="btn back" v-if="pageIndex === 1" @click="onReturn()"> 返回 </el-button>
+      <el-button class="btn back" v-else @click="onBack()"> 上一步 </el-button>
+      <el-button class="btn add" style="margin-left: -15px" v-if="pageIndex === 4 || pageIndex === 7" @click="onAdd()">
+        增加
+      </el-button>
+      <el-button class="btn next" type="success" @click="onNext()"> {{ nextBtnText }} </el-button>
     </dv-border-box1>
   </div>
 </template>
@@ -44,68 +48,41 @@ import { ref, ComputedRef, computed, watch } from 'vue'
 import ProForm from '@/components/ProForm/index.vue'
 import { useRouter } from 'vue-router'
 import { getTransferImgList1, getTransferImgList2 } from '@/api/modules/taais/task'
-let model = {
-  parameter1: 'yolov8n.pt',
-  parameter2: 'yolov8n.yaml',
-  parameter3: '100',
-  parameter4: 'true',
-  parame1: '0.25',
-  parame2: '0.7',
-  parame3: '300',
-  parame4: 'false'
-}
+let model = ref({
+  enhanceModel: '',
+  pretreatmentModel: ''
+})
 const router = useRouter()
 let pageIndex = ref<number>(1)
 let title = ref('目标精准捕获任务选择')
 let nextBtnText = ref('下一步')
 const transferImg1 = getTransferImgList1()
 const transferImg2 = getTransferImgList2()
-
-watch(
-  () => pageIndex.value,
-  value => {
-    switch (value) {
-      case 1:
-        title.value = '任务创建：目标精准捕获任务选择'
-        nextBtnText.value = '下一步'
-        break
-      case 2:
-        title.value = '任务创建：训练数据选择'
-        break
-      case 3:
-        title.value = '任务创建：训练数据预处理'
-        break
-      case 4:
-        title.value = '任务创建：训练参数设置'
-        break
-      case 5:
-        title.value = '任务创建：推理数据选择'
-        break
-      case 6:
-        title.value = '任务创建：推理数据预处理'
-        nextBtnText.value = '下一步'
-        break
-      case 7:
-        title.value = '任务创建：推理参数设置'
-        nextBtnText.value = '提交'
-        break
-      default:
-        break
-    }
-  },
-  { immediate: true }
-)
 const enumData = [
   {
-    label: '选项1',
+    label: 'rtdetr',
     value: '1'
   },
   {
-    label: '选项2',
+    label: 'yolov5',
     value: '2'
   },
   {
-    label: '选项3',
+    label: 'yolov8',
+    value: '3'
+  }
+]
+const enumDataModel = [
+  {
+    label: 'rtdetrModel',
+    value: '1'
+  },
+  {
+    label: 'yolov5Model',
+    value: '2'
+  },
+  {
+    label: 'yolov8Model',
     value: '3'
   }
 ]
@@ -158,6 +135,7 @@ const _options: ComputedRef<ProForm.FormOptions> = computed(() => {
   }
   return Object.assign(form)
 })
+
 let items: ProForm.ItemsOptions[] = [
   {
     formItemOptions: {
@@ -177,7 +155,7 @@ let items: ProForm.ItemsOptions[] = [
   {
     formItemOptions: {
       label: '任务选择',
-      prop: 'tree',
+      prop: 'treeName',
       show: () => {
         return pageIndex.value === 1 ? true : false
       }
@@ -207,7 +185,7 @@ let items: ProForm.ItemsOptions[] = [
   {
     formItemOptions: {
       label: '增强算法',
-      prop: 'select',
+      prop: 'enhanceAlgo',
       span: 14,
       show: () => {
         return pageIndex.value === 3 ? true : false
@@ -215,13 +193,16 @@ let items: ProForm.ItemsOptions[] = [
     },
     compOptions: {
       elTagName: 'select',
-      enum: enumData
+      enum: enumData,
+      onChange: val => {
+        model.value.enhanceModel = val
+      }
     }
   },
   {
     formItemOptions: {
       label: '增强模型',
-      prop: 'select',
+      prop: 'enhanceModel',
       span: 14,
       show: () => {
         return pageIndex.value === 3 ? true : false
@@ -229,13 +210,13 @@ let items: ProForm.ItemsOptions[] = [
     },
     compOptions: {
       elTagName: 'select',
-      enum: enumData
+      enum: enumDataModel
     }
   },
   {
     formItemOptions: {
       label: '参数1',
-      prop: 'parameter',
+      prop: 'threeParameter1',
       span: 14,
       show: () => {
         return pageIndex.value === 3 ? true : false
@@ -244,13 +225,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数1'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '参数2',
-      prop: 'parameter',
+      prop: 'threeParameter2',
       span: 14,
       show: () => {
         return pageIndex.value === 3 ? true : false
@@ -259,13 +240,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数2'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '参数3',
-      prop: 'parameter',
+      prop: 'threeParameter3',
       span: 14,
       show: () => {
         return pageIndex.value === 3 ? true : false
@@ -274,13 +255,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数3'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '参数4',
-      prop: 'parameter',
+      prop: 'threeParameter4',
       span: 14,
       show: () => {
         return pageIndex.value === 3 ? true : false
@@ -289,13 +270,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数4'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '训练算法',
-      prop: 'select',
+      prop: 'trainAlgo',
       span: 14,
       show: () => {
         return pageIndex.value === 4 ? true : false
@@ -309,7 +290,7 @@ let items: ProForm.ItemsOptions[] = [
   {
     formItemOptions: {
       label: '预训练模型权重文件路径',
-      prop: 'parameter1',
+      prop: 'fourParameter1',
       labelWidth: 180,
       span: 14,
       show: () => {
@@ -319,13 +300,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数1'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '模型结构配置文件路径',
-      prop: 'parameter2',
+      prop: 'fourParameter2',
       labelWidth: 180,
       span: 14,
       show: () => {
@@ -335,13 +316,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数2'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '训练轮数',
-      prop: 'parameter3',
+      prop: 'fourParameter3',
       labelWidth: 180,
       span: 14,
       show: () => {
@@ -351,13 +332,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数3'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '余弦学习率调度器',
-      prop: 'parameter4',
+      prop: 'fourParameter4',
       labelWidth: 180,
       span: 14,
       show: () => {
@@ -367,7 +348,7 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数4'
+      placeholder: '请输入...'
     }
   },
   {
@@ -386,7 +367,7 @@ let items: ProForm.ItemsOptions[] = [
   {
     formItemOptions: {
       label: '预处理算法',
-      prop: 'select',
+      prop: 'pretreatmentAlgo',
       span: 14,
       show: () => {
         return pageIndex.value === 6 ? true : false
@@ -394,13 +375,16 @@ let items: ProForm.ItemsOptions[] = [
     },
     compOptions: {
       elTagName: 'select',
-      enum: enumData
+      enum: enumData,
+      onChange: val => {
+        model.value.pretreatmentModel = val
+      }
     }
   },
   {
     formItemOptions: {
       label: '预处理模型',
-      prop: 'select',
+      prop: 'pretreatmentModel',
       span: 14,
       show: () => {
         return pageIndex.value === 6 ? true : false
@@ -408,13 +392,13 @@ let items: ProForm.ItemsOptions[] = [
     },
     compOptions: {
       elTagName: 'select',
-      enum: enumData
+      enum: enumDataModel
     }
   },
   {
     formItemOptions: {
       label: '参数1',
-      prop: 'taskName',
+      prop: 'sixParameter1',
       span: 12,
       show: () => {
         return pageIndex.value === 6 ? true : false
@@ -423,13 +407,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数1'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '参数2',
-      prop: 'taskName',
+      prop: 'sixParameter2',
       span: 12,
       show: () => {
         return pageIndex.value === 6 ? true : false
@@ -438,13 +422,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数2'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '参数3',
-      prop: 'taskName',
+      prop: 'sixParameter3',
       span: 12,
       show: () => {
         return pageIndex.value === 6 ? true : false
@@ -453,13 +437,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数3'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '参数4',
-      prop: 'taskName',
+      prop: 'sixParameter4',
       span: 12,
       show: () => {
         return pageIndex.value === 6 ? true : false
@@ -468,27 +452,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数4'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '推理算法',
-      prop: 'select',
-      span: 14,
-      show: () => {
-        return pageIndex.value === 7 ? true : false
-      }
-    },
-    compOptions: {
-      elTagName: 'select',
-      enum: enumData
-    }
-  },
-  {
-    formItemOptions: {
-      label: '推理模型',
-      prop: 'select',
+      prop: 'inferAlgo',
       span: 14,
       show: () => {
         return pageIndex.value === 7 ? true : false
@@ -502,7 +472,7 @@ let items: ProForm.ItemsOptions[] = [
   {
     formItemOptions: {
       label: '目标置信度阈值',
-      prop: 'parame1',
+      prop: 'sevenParameter1',
       labelWidth: 180,
       span: 14,
       show: () => {
@@ -512,13 +482,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数1'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '非极大值抑制的IoU阈值',
-      prop: 'parame2',
+      prop: 'sevenParameter2',
       labelWidth: 180,
       span: 14,
       show: () => {
@@ -528,13 +498,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数2'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '测试图片最大检测器数',
-      prop: 'parame3',
+      prop: 'sevenParameter3',
       labelWidth: 180,
       span: 14,
       show: () => {
@@ -544,13 +514,13 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数3'
+      placeholder: '请输入...'
     }
   },
   {
     formItemOptions: {
       label: '使用半精度推理(FP16)',
-      prop: 'parame4',
+      prop: 'sevenParameter4',
       labelWidth: 180,
       span: 14,
       show: () => {
@@ -560,13 +530,38 @@ let items: ProForm.ItemsOptions[] = [
     compOptions: {
       elTagName: 'input',
       clearable: true,
-      placeholder: '请输入参数4'
+      placeholder: '请输入...'
     }
   }
 ]
+let formItemsTemp4 = ref([
+  {
+    items,
+    model: model.value
+  }
+])
+let formItemsTemp7 = ref([
+  {
+    items,
+    model: model.value
+  }
+])
+let formItems = ref([
+  {
+    items,
+    model: model.value
+  }
+])
 // 增加训练算法
 const onAdd = () => {
-  console.log('增加')
+  const data = {
+    enhanceModel: '',
+    pretreatmentModel: ''
+  }
+  formItems.value.push({
+    items,
+    model: data
+  })
 }
 const getImageUrl = name => {
   return new URL(`../../../assets/taaisImg/${name}`, import.meta.url).href
@@ -587,6 +582,53 @@ const onBack = () => {
   if (pageIndex.value === 1) return
   pageIndex.value--
 }
+watch(
+  () => pageIndex.value,
+  (value, oldValue) => {
+    if (oldValue === 4) formItemsTemp4.value = formItems.value
+    if (oldValue === 7) formItemsTemp7.value = formItems.value
+    if (value === 4) formItems.value = formItemsTemp4.value
+    if (value === 7) formItems.value = formItemsTemp7.value
+    else {
+      formItems.value = [
+        {
+          items,
+          model: model.value
+        }
+      ]
+    }
+    0
+
+    switch (value) {
+      case 1:
+        title.value = '任务创建：目标精准捕获任务选择'
+        nextBtnText.value = '下一步'
+        break
+      case 2:
+        title.value = '任务创建：训练数据选择'
+        break
+      case 3:
+        title.value = '任务创建：训练数据预处理'
+        break
+      case 4:
+        title.value = '任务创建：训练参数设置'
+        break
+      case 5:
+        title.value = '任务创建：推理数据选择'
+        break
+      case 6:
+        title.value = '任务创建：推理数据预处理'
+        nextBtnText.value = '下一步'
+        break
+      case 7:
+        title.value = '任务创建：推理参数设置'
+        nextBtnText.value = '提交'
+        break
+      default:
+        break
+    }
+  }
+)
 </script>
 <style scoped lang="scss">
 @import './index.scss';

src/views/taais/homePage/index.scss

@@ -30,7 +30,8 @@
 
   // --el-table-expanded-cell-bg-color: transparent;
 }
-.bigBox {
+.bigBox,
+.createTask-bigBox {
   width: 100%;
   height: 100%;
   overflow: hidden;
@@ -38,17 +39,7 @@
   background-repeat: no-repeat;
   background-size: 100% 100%;
 }
-%box-basic {
-  width: 70%;
-  height: 700px;
-  padding: 20px;
-  margin: 0 auto;
-}
-.createTask-container {
-  @extend %box-basic;
-
-  position: relative;
-  margin-top: 100px;
+.createTask-bigBox {
   :deep(.el-transfer-panel__item) {
     height: 60px;
   }
@@ -60,15 +51,34 @@
   }
   .btn {
     position: absolute;
-    bottom: 200px;
+    bottom: 20px;
   }
   .back {
-    left: 200px;
+    left: 100px;
   }
   .next {
-    right: 200px;
+    right: 100px;
+  }
+  .add {
+    left: 450px;
   }
 }
+%box-basic {
+  width: 70%;
+  height: 700px;
+  padding: 20px;
+  margin: 0 auto;
+}
+.createTask-container {
+  position: relative;
+  width: 70%;
+  height: 520px;
+  padding: 20px;
+  margin: 0 auto;
+  margin-top: 100px;
+  overflow: hidden;
+  overflow-y: scroll;
+}
 .logPage-container {
   @extend %box-basic;
 

src/views/taais/homePage/inferResult.vue

@@ -23,35 +23,27 @@
                 :z-index="9999"
               />
             </template>
-            <template #algo1="scope">
+            <template #rtdetr="scope">
               <el-image
                 style="width: 100px; height: 100px"
-                :preview-src-list="[getImageUrl(scope.row.algo1)]"
-                :src="getImageUrl(scope.row.algo1)"
+                :preview-src-list="[getImageUrl(scope.row.rtdetr)]"
+                :src="getImageUrl(scope.row.rtdetr)"
                 :z-index="9999"
               />
             </template>
-            <template #algo2="scope">
+            <template #yolov5="scope">
               <el-image
                 style="width: 100px; height: 100px"
-                :preview-src-list="[getImageUrl(scope.row.algo2)]"
-                :src="getImageUrl(scope.row.algo2)"
+                :preview-src-list="[getImageUrl(scope.row.yolov5)]"
+                :src="getImageUrl(scope.row.yolov5)"
                 :z-index="9999"
               />
             </template>
-            <template #algo3="scope">
+            <template #yolov8="scope">
               <el-image
                 style="width: 100px; height: 100px"
-                :preview-src-list="[getImageUrl(scope.row.algo3)]"
-                :src="getImageUrl(scope.row.algo3)"
-                :z-index="9999"
-              />
-            </template>
-            <template #algo4="scope">
-              <el-image
-                style="width: 100px; height: 100px"
-                :preview-src-list="[getImageUrl(scope.row.algo4)]"
-                :src="getImageUrl(scope.row.algo4)"
+                :preview-src-list="[getImageUrl(scope.row.yolov8)]"
+                :src="getImageUrl(scope.row.yolov8)"
                 :z-index="9999"
               />
             </template>
@@ -94,10 +86,9 @@ const getTreeFilter = async () => {
 // 表格配置项
 const columns = reactive<ColumnProps<any>[]>([
   { prop: 'yuan', label: '原图' },
-  { prop: 'algo1', label: '算法1推理' },
-  { prop: 'algo2', label: '算法2推理' },
-  { prop: 'algo3', label: '算法3推理' },
-  { prop: 'algo4', label: '算法4推理' }
+  { prop: 'rtdetr', label: 'rtdetr推理' },
+  { prop: 'yolov5', label: 'yolov5推理' },
+  { prop: 'yolov8', label: 'yolov8推理' }
 ])
 const goHome = () => {
   router.push(`/index`)

src/views/taais/homePage/trainResult.vue

@@ -15,35 +15,27 @@
             :init-param="initParam"
             :search-col="{ xs: 1, sm: 1, md: 2, lg: 3, xl: 3 }"
           >
-            <template #algo1="scope">
+            <template #rtdetr="scope">
               <el-image
                 style="width: 100px; height: 100px"
-                :preview-src-list="[getImageUrl(scope.row.algo1)]"
-                :src="getImageUrl(scope.row.algo1)"
+                :preview-src-list="[getImageUrl(scope.row.rtdetr)]"
+                :src="getImageUrl(scope.row.rtdetr)"
                 :z-index="9999"
               />
             </template>
-            <template #algo2="scope">
+            <template #yolov5="scope">
               <el-image
                 style="width: 100px; height: 100px"
-                :preview-src-list="[getImageUrl(scope.row.algo2)]"
-                :src="getImageUrl(scope.row.algo2)"
+                :preview-src-list="[getImageUrl(scope.row.yolov5)]"
+                :src="getImageUrl(scope.row.yolov5)"
                 :z-index="9999"
               />
             </template>
-            <template #algo3="scope">
+            <template #yolov8="scope">
               <el-image
                 style="width: 100px; height: 100px"
-                :preview-src-list="[getImageUrl(scope.row.algo3)]"
-                :src="getImageUrl(scope.row.algo3)"
-                :z-index="9999"
-              />
-            </template>
-            <template #algo4="scope">
-              <el-image
-                style="width: 100px; height: 100px"
-                :preview-src-list="[getImageUrl(scope.row.algo4)]"
-                :src="getImageUrl(scope.row.algo4)"
+                :preview-src-list="[getImageUrl(scope.row.yolov8)]"
+                :src="getImageUrl(scope.row.yolov8)"
                 :z-index="9999"
               />
             </template>
@@ -67,7 +59,6 @@ const router = useRouter()
 onMounted(() => {
   getTreeFilter()
 })
-console.log(tableData)
 const getImageUrl = name => {
   return new URL(`../../../assets/taaisImg/${name}`, import.meta.url).href
 }
@@ -87,10 +78,9 @@ const getTreeFilter = async () => {
 // 表格配置项
 const columns = reactive<ColumnProps<any>[]>([
   { prop: 'name', label: '名称' },
-  { prop: 'algo1', label: '算法1' },
-  { prop: 'algo2', label: '算法2' },
-  { prop: 'algo3', label: '算法3' },
-  { prop: 'algo4', label: '算法4' }
+  { prop: 'rtdetr', label: 'rtdetr' },
+  { prop: 'yolov5', label: 'yolov5' },
+  { prop: 'yolov8', label: 'yolov8' }
 ])
 const goLog = () => {
   router.push(`/logPage/0`)