feat: 添加新功能

src/components/ImportPicDataset/index.vue

@@ -20,56 +20,49 @@
           </slot>
           <template #tip>
             <slot name="tip">
-              <!-- <div class="el-upload__tip text-center">
-                <el-checkbox v-model="isCover">是否更新已存在的数据</el-checkbox>
-              </div> -->
-              <div class="el-upload__tip text-center">
-                请上传 .zip 标准格式文件，文件最大为 {{ parameter.fileSize }}M。
-                <!-- <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="downloadTemp">
-                  模板下载
-                </el-link> -->
-              </div>
+              <div class="el-upload__tip text-center">请上传 .zip 标准格式文件，文件最大为 {{ parameter.fileSize }}M。</div>
             </slot>
           </template>
         </el-upload>
       </el-form-item>
 
-      <el-form-item label="文件上传">
-        <el-upload
-          action="#"
-          class="upload"
-          :drag="true"
-          :limit="parameter.limit"
-          :multiple="parameter.multiple"
-          :show-file-list="true"
-          :http-request="uploadExcel"
-          :before-upload="beforeExcelUpload"
-          :on-exceed="handleExceed"
-          :accept="parameter.fileType!.join(',')"
-        >
-          <slot name="empty">
-            <el-icon class="el-icon--upload">
-              <upload-filled />
-            </el-icon>
-            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
-          </slot>
-          <template #tip>
-            <slot name="tip">
-              <!-- <div class="el-upload__tip text-center">
-                <el-checkbox v-model="isCover">是否更新已存在的数据</el-checkbox>
-              </div> -->
-              <div class="el-upload__tip text-center">
-                请上传 .xls , .xlsx 标准格式文件，文件最大为 {{ parameter.fileSize }}M。
-                <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="downloadTemp">
-                  模板下载
-                </el-link>
-              </div>
-            </slot>
-          </template>
-        </el-upload>
+      <!-- 新增的表单字段 -->
+      <el-form-item label="批次号" prop="batchNum">
+        <el-input v-model="formModel.batchNum" placeholder="请输入批次号" />
+      </el-form-item>
+
+      <el-form-item label="目标类型" prop="objectType">
+        <el-input v-model="formModel.objectType" placeholder="请输入目标类型" />
+      </el-form-item>
+
+      <el-form-item label="目标子类型" prop="objectSubtype">
+        <el-input v-model="formModel.objectSubtype" placeholder="请输入目标子类型" />
+      </el-form-item>
+
+      <el-form-item label="场景" prop="scene">
+        <el-input v-model="formModel.scene" placeholder="请输入场景" />
+      </el-form-item>
+
+      <el-form-item label="数据源" prop="dataSource">
+        <el-input v-model="formModel.dataSource" placeholder="请输入数据源" />
       </el-form-item>
+
+      <el-form-item label="采集地点" prop="gatherSpot">
+        <el-input v-model="formModel.gatherSpot" placeholder="请输入采集地点" />
+      </el-form-item>
+
+      <el-form-item label="采集时间" prop="gatherTime">
+        <el-date-picker v-model="formModel.gatherTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择采集时间" />
+      </el-form-item>
+
+      <el-form-item label="数据类型" prop="dataType">
+        <el-select v-model="formModel.dataType" placeholder="请选择数据类型">
+          <el-option v-for="item in dataTypes" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue" />
+        </el-select>
+      </el-form-item>
+
       <el-form-item label="是否已标注">
-        <el-radio-group v-model="labeled">
+        <el-radio-group v-model="formModel.labeled">
           <el-radio :label="true">是</el-radio>
           <el-radio :label="false">否</el-radio>
         </el-radio-group>
@@ -86,30 +79,40 @@
 
 <script setup lang="ts" name="ImportPicDataset">
 import { ref } from 'vue'
-import { useDownload } from '@/hooks/useDownload'
 import { ElNotification, UploadRequestOptions, UploadRawFile } from 'element-plus'
 
 export interface ParameterProps {
-  title: string // 标题
-  fileSize?: number // 上传文件的大小
-  limit?: number // 上传文件个数
-  top?: string // 离顶部距离
-  width?: number // 弹框宽度
-  multiple?: boolean // 是否支持多选文件
-  fileType?: File.ExcelMimeType[] // 上传文件的类型
-  ZipFileType?: File.ZipMimeType[] //上传zip文件的类型
-  tempApi?: (params: any) => Promise<any> // 下载模板的Api
-  importApi?: (params: any) => Promise<any> // 批量导入的Api
-  getTableList?: () => void // 获取表格数据的Api
+  title: string
+  fileSize?: number
+  limit?: number
+  top?: string
+  width?: number
+  multiple?: boolean
+  fileType?: File.ExcelMimeType[]
+  ZipFileType?: File.ZipMimeType[]
+  tempApi?: (params: any) => Promise<any>
+  importApi?: (params: any) => Promise<any>
+  getTableList?: () => void
 }
 
-// 是否覆盖数据
-// const isCover = ref(false)
-// dialog状态
-// 是否已标注
-const labeled = ref<boolean | null>(null)
+const formModel = ref({
+  batchNum: '',
+  name: '',
+  objectType: '',
+  objectSubtype: '',
+  scene: '',
+  dataSource: '',
+  gatherSpot: '',
+  gatherTime: '',
+  dataType: '',
+  labeled: false
+})
+const dataTypes = ref([
+  { dictValue: '1', dictLabel: '训练' },
+  { dictValue: '2', dictLabel: '测试' }
+  // 添加更多数据类型
+])
 const dialogVisible = ref(false)
-// 父组件传过来的参数
 const parameter = ref<ParameterProps>({
   title: '',
   limit: 1,
@@ -121,48 +124,48 @@ const parameter = ref<ParameterProps>({
   ZipFileType: ['application/zip', 'application/x-zip-compressed', 'application/x-rar-compressed']
 })
 
-// 接收父组件参数
 const acceptParams = (params: ParameterProps) => {
   parameter.value = { ...parameter.value, ...params }
   dialogVisible.value = true
+  formModel.value = {
+    batchNum: '',
+    name: '',
+    objectType: '',
+    objectSubtype: '',
+    scene: '',
+    dataSource: '',
+    gatherSpot: '',
+    gatherTime: '',
+    dataType: '',
+    labeled: false
+  }
 }
-
-// Excel 导入模板下载
-const downloadTemp = () => {
-  if (!parameter.value.tempApi) return
-  useDownload(parameter.value.tempApi, `${parameter.value.title}_template_${new Date().getTime()}`)
-}
-// const uploadRef = ref<UploadInstance>()
-
 const formData = new FormData()
 const handleSubmit = async () => {
   const zipFile = formData.get('file')
-  const excelFile = formData.get('excelFile')
   console.log(zipFile)
-  console.log(excelFile)
-  // 检查是否同时上传了压缩文件和 Excel 文件
-  if (!zipFile || !excelFile) {
+  if (!zipFile) {
     ElNotification({
       title: '温馨提示',
-      message: '请同时上传一个压缩文件和一个Excel文件！',
+      message: '请上传一个压缩文件！',
       type: 'warning'
     })
     return
   }
-
-  // 将是否已标注字段添加到 formData
-  formData.append('labeled', labeled.value?.toString() || 'false')
-
+  const formDataInfo = new FormData()
+  formDataInfo.append('file', zipFile)
+  for (const key in formModel.value) {
+    if (Object.prototype.hasOwnProperty.call(formModel.value, key)) {
+      formDataInfo.append(key, formModel.value[key])
+    }
+  }
   try {
-    // 同时上传了两个文件，可以进行提交处理
-    await parameter.value.importApi!(formData)
-
+    await parameter.value.importApi!(formDataInfo)
     ElNotification({
       title: '温馨提示',
       message: `文件上传成功`,
       type: 'success'
     })
-
     parameter.value.getTableList && parameter.value.getTableList()
     dialogVisible.value = false
   } catch (error) {
@@ -174,50 +177,12 @@ const handleSubmit = async () => {
   }
 }
 
-// 压缩文件上传
 const uploadZip = (param: UploadRequestOptions) => {
   formData.append('file', param.file)
-
-  // parameter.value.getTableList && parameter.value.getTableList()
-  // dialogVisible.value = false
-}
-
-// 文件上传
-const uploadExcel = (param: UploadRequestOptions) => {
-  formData.append('excelFile', param.file)
-
-  // parameter.value.getTableList && parameter.value.getTableList()
-  // dialogVisible.value = false
-}
-
-/**
- * @description 文件上传之前判断
- * @param file 上传的文件
- * */
-const beforeExcelUpload = (file: UploadRawFile) => {
-  const isExcel = parameter.value.fileType!.includes(file.type as File.ExcelMimeType)
-
-  const fileSize = file.size / 1024 / 1024 < parameter.value.fileSize!
-  if (!isExcel)
-    ElNotification({
-      title: '温馨提示',
-      message: '上传文件只能是 xls / xlsx 格式！',
-      type: 'warning'
-    })
-  if (!fileSize)
-    setTimeout(() => {
-      ElNotification({
-        title: '温馨提示',
-        message: `上传文件大小不能超过 ${parameter.value.fileSize}MB！`,
-        type: 'warning'
-      })
-    }, 0)
-  return isExcel && fileSize
 }
 
 const beforeZipUpload = (file: UploadRawFile) => {
   const isZip = parameter.value.ZipFileType!.includes(file.type as File.ZipMimeType)
-
   const fileSize = file.size / 1024 / 1024 < parameter.value.fileSize!
   if (!isZip)
     ElNotification({
@@ -236,7 +201,6 @@ const beforeZipUpload = (file: UploadRawFile) => {
   return isZip && fileSize
 }
 
-// 文件数超出提示
 const handleExceed = () => {
   ElNotification({
     title: '温馨提示',
@@ -245,28 +209,11 @@ const handleExceed = () => {
   })
 }
 
-// 上传错误提示
-// const excelUploadError = () => {
-//   ElNotification({
-//     title: '温馨提示',
-//     message: `批量添加${parameter.value.title}失败，请您重新上传！`,
-//     type: 'error'
-//   })
-// }
-
-// 上传成功提示
-// const excelUploadSuccess = () => {
-//   ElNotification({
-//     title: '温馨提示',
-//     message: `批量添加${parameter.value.title}成功！`,
-//     type: 'success'
-//   })
-// }
-
 defineExpose({
   acceptParams
 })
 </script>
+
 <style lang="scss" scoped>
 @import './index.scss';
 </style>

src/components/ProTable/interface/index.ts

@@ -1,7 +1,7 @@
 import { VNode, ComponentPublicInstance, Ref } from 'vue'
 import { BreakPoint, Responsive } from '@/components/Grid/interface'
 import { TableColumnCtx } from 'element-plus/es/components/table/src/table-column/defaults'
-import { ProTableProps } from '@/components/ProTable/index.vue'
+import ProTableProps from '@/components/ProTable/index.vue'
 import ProTable from '@/components/ProTable/index.vue'
 
 export interface EnumProps {

src/views/demo/data/index.vue

@@ -194,14 +194,6 @@ const columns = reactive<ColumnProps<any>[]>([
     },
     width: 120
   },
-  {
-    prop: 'formName',
-    label: '源文件名称',
-    search: {
-      el: 'input'
-    },
-    width: 120
-  },
   {
     prop: 'name',
     label: '名称',