From 4bd0d67f878fe04801ffe4706bfdf520bcfbe555 Mon Sep 17 00:00:00 2001 From: caishi <1149225589@qq.com> Date: Sun, 7 Apr 2024 09:32:53 +0800 Subject: [PATCH] =?UTF-8?q?=E6=95=B0=E6=8D=AE=E9=9B=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/css/edu-purge.css | 5 +- src/forge/Dataset/Index.jsx | 107 +++++++++++--- src/forge/Dataset/component/new.jsx | 155 ++++++++++++++++++++ src/forge/Dataset/component/uploadModal.jsx | 111 ++++++++++++++ src/forge/Dataset/image/empty.png | Bin 0 -> 2027 bytes src/forge/Dataset/index.scss | 39 +++++ src/forge/Main/Detail.js | 14 +- src/forge/Main/img/dataset.jpg | Bin 0 -> 898 bytes src/forge/Main/sub/DetailBanner.jsx | 18 ++- src/forge/Settings/Setting.js | 3 +- src/forge/Settings/setting.scss | 7 + 11 files changed, 428 insertions(+), 31 deletions(-) create mode 100644 src/forge/Dataset/component/new.jsx create mode 100644 src/forge/Dataset/component/uploadModal.jsx create mode 100644 src/forge/Dataset/image/empty.png create mode 100644 src/forge/Main/img/dataset.jpg diff --git a/public/css/edu-purge.css b/public/css/edu-purge.css index 694a4b03..14ac4a7e 100644 --- a/public/css/edu-purge.css +++ b/public/css/edu-purge.css @@ -3373,8 +3373,8 @@ a.edu-greyline-btn:hover { .defalutSubmitbtn { display: block; - border: 1px solid #4CACFF; - background-color: #4CACFF; + border: 1px solid #466aff; + background-color: #466aff; color: #fff !important; width: 120px; text-align: center; @@ -3382,7 +3382,6 @@ a.edu-greyline-btn:hover { border-radius: 2px; width: 130px; height: 40px; - background: rgba(76, 172, 255, 1); border-radius: 4px; font-size: 16px; font-family: MicrosoftYaHei; diff --git a/src/forge/Dataset/Index.jsx b/src/forge/Dataset/Index.jsx index 0314ac16..779f1633 100644 --- a/src/forge/Dataset/Index.jsx +++ b/src/forge/Dataset/Index.jsx @@ -1,63 +1,130 @@ import React, { useState , useEffect } from 'react'; import { Button , Table } from 'antd'; +import { getImageUrl } from 'educoder'; +import NewModal from './component/new'; +import { Link } from 'react-router-dom'; import "./index.scss"; +import axios from 'axios'; -function Index(){ +function Index(props){ + const { project , match } =props; + const { owner ,projectsId } = match && match.params; const [ dataSource , setDataSource ] = useState([]); + const [ empty , setEmpty ] = useState(project && (!project.has_dataset)); + const [ total , setTotal ] = useState(0); + const [ page , setPage ] = useState(1); + const [ visible , setVisible ] = useState(false); + const [ detail , setDetail ] = useState({}); + const pageSize = 20; + useEffect(()=>{ + if(!empty){ + Init(); + } + },[empty,page]) + + function Init(){ + const url = `/v1/${owner}/${projectsId}/dataset`; + + axios.get(url,{ + params:{ + page,limit:pageSize + } + }).then((result) => { + if (result) { + setDetail(result.data); + setDataSource(result.data && result.data.attachments); + setTotal(result.data.attachment_total_count); + } + }).catch((error) => { }) + } const columns=[ { title:"文件名称", - dataIndex:"name", + dataIndex:"title", key:1, ellipsis:true, width:"25%" }, { title:"描述", - dataIndex:"desc", + dataIndex:"description", key:2, ellipsis:true, - width:"25%" + width:"30%" }, { title:"创建者", dataIndex:"creator", key:3, - width:"10%" + width:"10%", + render:(value,item)=>{ + return + } }, { title:"上传时间", - dataIndex:"uploadTime", + dataIndex:"created_on", key:4, + width:"15%" }, { title:"大小", - dataIndex:"size", + dataIndex:"filesize", key:5, - width:"10%" }, { title:"操作", - dataIndex:"operate", + dataIndex:"url", key:6, + width:"10%", + render:(value,item)=>{ + return 下载 + } }, ] + + // 添加成功 + function addFunc(){ + setEmpty(false); + setVisible(false); + detail && detail.id && Init(); + } return(
+ setVisible(false)} onOk={addFunc}/>
-
-

MNISTData_mindspore

-

MNISTData数据集是由10类28*28的灰度图片组成，训练数据集包含60000张图片，测试数据集包含10000张图片。

-
-
- - -
+ {empty ? + 数据集 + : + +
+

{detail.title}

+

{detail.description}

+
+
+ + 上传文件 +
+ + }
- + { + empty? +
+ + 暂无数据集 +

我们非常欢迎您创建并分享您的数据集，以便与其他用户共同促进开源社区的发展

+ +
+ : +
setPage(p)}} + /> + } ) } diff --git a/src/forge/Dataset/component/new.jsx b/src/forge/Dataset/component/new.jsx new file mode 100644 index 00000000..a12c6a74 --- /dev/null +++ b/src/forge/Dataset/component/new.jsx @@ -0,0 +1,155 @@ +import React, { useEffect, useState } from 'react'; +import { Modal ,Form ,Input , AutoComplete , Button , Select } from 'antd'; +import '../index.scss'; +import axios from 'axios'; + +const { TextArea } = Input; +const Option = Select.Option; + +function New(props){ + const { form , visible , onCancel , onOk , owner , repo , detail } = props; + const [ licenseId , setLicenseId ] =useState(undefined); + const [ licensesList , setLicensesList] =useState([]); + const [ filterLicensesList , setFilterLicensesList ] =useState([]); + + const { getFieldDecorator , setFieldsValue } = form; + + useEffect(()=>{ + if(detail && detail.id){ + setFieldsValue({...detail,license_id:detail.license_name}); + setLicenseId(detail.license_id); + } + },[detail]) + + useEffect(()=>{ + getLicenses(); + },[]) + + function getLicenses(){ + const url = `/licenses.json` + axios.get(url).then((result) => { + if (result) { + setLicensesList(result.data.licenses); + setFilterLicensesList(result.data.licenses); + } + }).catch((error) => { }) + } + + + function submit(){ + form.validateFields((err, values) => { + if(!err){ + const url = `/v1/${owner}/${repo}/dataset.json`; + if(detail && detail.id){ + axios.put(url,{ + ...values,license_id:licenseId + }).then((result) => { + if (result) { + onOk && onOk(); + } + }).catch((error) => { }) + }else{ + axios.post(url,{ + ...values,license_id:licenseId + }).then((result) => { + if (result) { + onOk && onOk(); + } + }).catch((error) => { }) + } + + } + }) + } + + function ChangePlatform(value){ + let _data = []; + if (licensesList.length>0) { + _data = licensesList.filter(item => item.name.toLowerCase().indexOf(value.toLowerCase()) > -1); + } + setFilterLicensesList(_data); + } + + function checkId(rule, value, callback, list, title){ + let filter = list.filter(item => item.name === value); + if(!value){ + callback(); + } + if (filter && filter.length > 0) { + callback(); + } else { + callback('请在下拉选项中选择正确的' + title + "!"); + } + callback(); + } + return( + +
+ + {getFieldDecorator('title', { + rules: [ + { + required:true, + message:"请输入数据集名称" + } + ], + })( + , + )} + + + {getFieldDecorator('license_id', { + rules: [{ + validator: (rule, value, callback) => checkId(rule, value, callback, licensesList, '开源许可证') + }], + })( + {e1.props && setLicenseId(e1.props.id)}} + > + { + filterLicensesList && filterLicensesList.map((item) => ( + + )) + } + + )} + + + {getFieldDecorator('description', { + rules: [ + { + required:true, + message:"请输入描述内容" + } + ]})( +