合并资源库

2021-04-02 17:31:15 +08:00 · 2021-04-02 17:31:15 +08:00 · b9a8becec3
parent 2fcd2fd066
commit b9a8becec3
3 changed files with 201 additions and 76 deletions
--- a/src/forge/Source/Index.jsx
+++ b/src/forge/Source/Index.jsx
@ -4,6 +4,7 @@ import { Blueback , FlexAJ } from '../Component/layout';
 import { Dropdown, Input , Menu , Pagination } from 'antd';
 import { Link } from 'react-router-dom';
 import UploadSource from './UploadSource';
+import { getImageUrl } from 'educoder';
 import axios from 'axios';

 const { Search } = Input;
@ -19,6 +20,7 @@ function Index(props){
  const [ page , setPage ] = useState(1);
  const [ total , setTotal ] = useState(0);
  const [ search , setSearch ] = useState(undefined);
+  const [ data , setData ] = useState(undefined);

  const [ visible , setVisible ] = useState(false);
  const repo_id = props.projectDetail && props.projectDetail.repo_id;
@ -42,7 +44,8 @@ function Index(props){
      }
    }).then(result=>{
      if(result && result.data){
-
+        setData(result.data.data.rows);
+        setTotal(result.data.data.total);
      }
    }).catch(error=>{})
  }
@ -54,7 +57,6 @@ function Index(props){

  // 切换排序方式
  function changeSort(e,index){
-    console.log(index);
    setSortValue(index);
  }

@ -79,9 +81,9 @@ function Index(props){
    </Menu>
  )

-  // 上传资源确定
+  // 上传资源成功
  function onOk(){
-
+    getData();
  }

  // 删除标签
@ -91,7 +93,14 @@ function Index(props){

  return(
    <div className="sourcePanel">
-      <UploadSource visible={visible} onCancel={()=>setVisible(false)} onOk={onOk} showNotification={props.showNotification}/>
+      <UploadSource 
+        visible={visible} 
+        onCancel={()=>setVisible(false)} 
+        onOk={onOk} 
+        showNotification={props.showNotification}
+        owner={owner}
+        projectsId={repo_id}
+      />
      <div className="headtitle">
        <FlexAJ>
          <span className="font-18">资源库(18)</span>
@ -112,27 +121,40 @@ function Index(props){
      </FlexAJ>
      <div className="bodycontent">
        <ul className="bodycontentul">
-          <li>
-            <Link to= {`/users/`} className="infoImg"><img src={`https://testforgeplus.trustie.net/images/avatars/User/b`} alt="" /></Link>
-            <div style={{flex:'1',width:"0"}}>
-              <FlexAJ>
-                <a href={``} className="infoname">DaVinci.fdb</a>
-                <Dropdown overlay={listmenu} placement={'bottomRight'}>
-                  <i className="iconfont icon-gengduo1 color-grey-6"></i>
-                </Dropdown>
-              </FlexAJ>
-              <p className="infos">
-                <span>上传时间：<span>2021-03-30</span></span>
-                <span>上传类型：<span>软件版本</span></span>
-                <span>文件大小：<span>10KB</span></span>
-                <span>下载：<span>111</span></span>
-              </p>
-              <p className="infodesc task-hide-2">资源描述资源描述资源描述资源描述资源描述资源描述资源描述</p>
-              <div className="infotag">
-                <span>软件版本<i className="iconfont icon-guanbi font-12 ml2" onClick={removeTagFunc}></i></span>
-              </div>
-            </div>
-          </li>
+          {
+            data && data.length> 0 && data.map((item,key)=>{
+              return(
+                <li>
+                  <Link to= {`/users/${item.login}`} className="infoImg"><img src={getImageUrl(`${item.imageUrl}`)} alt="" /></Link>
+                  <div style={{flex:'1',width:"0"}}>
+                    <FlexAJ>
+                      <a href={``} className="infoname">{item.fileName}</a>
+                      <Dropdown overlay={listmenu} placement={'bottomRight'}>
+                        <i className="iconfont icon-gengduo1 color-grey-6"></i>
+                      </Dropdown>
+                    </FlexAJ>
+                    <p className="infos">
+                      <span>上传时间：<span>{item.uploadTime}</span></span>
+                      <span>文件大小：<span>{item.fileSize}</span></span>
+                      <span>下载：<span>{item.download}</span></span>
+                    </p>
+                    <p className="infodesc task-hide-2">{item.remark}</p>
+                    { item.tags && item.tags.length>0 && 
+                      <div className="infotag">
+                        {
+                          item.tags.map((i,k)=>{
+                            return(
+                              <span>{i}<i className="iconfont icon-guanbi font-12 ml2" onClick={removeTagFunc}></i></span>
+                            )
+                          })
+                        }
+                      </div>
+                    }
+                  </div>
+                </li>
+              )
+            })
+          }
        </ul>
        {
          total > limit && 
--- a/src/forge/Source/Upload.jsx
+++ b/src/forge/Source/Upload.jsx
@ -1,14 +1,15 @@
 import React, { useEffect, useState } from "react";
-import { Upload, Icon , Button } from 'antd';
+import { Upload, Button } from 'antd';
 import { appendFileSizeToUploadFileAll } from 'educoder';

 import axios from 'axios';
-const { Dragger } = Upload;
-function Upload({isComplete, icon , btn , className , size , actionUrl,fileList}) {
+function Uploads({ className , size , actionUrl,fileList,showNotification , load}) {
  const [ files , setFiles ] = useState(undefined);

  useEffect(()=>{
-    init();
+    if(fileList){
+      init();
+    }
  },[fileList]);

  function init(){
@ -22,14 +23,12 @@ function Upload({isComplete, icon , btn , className , size , actionUrl,fileList}
    }
  }
  function deleteAttachment(file){
-    const url = `/attachments/${file.response ? file.response.id : file.uid}.json`
-    axios.delete(url, {
-    }).then((response) => {
+    let id = file.response && file.response.data && file.response.data.id;
+    const url = actionUrl + `/busiAttachments/${id}`;
+    axios.delete(url).then((response) => {
      if (response.data) {
-        if (response.data.status === 0) {
-          let index = files.indexOf(file);
-          let newFileList = files.slice();
-          let nf = newFileList.splice(index, 1);
+        if (response.data.code === "1") {
+          let nf = files.filter(item=>item.response.data.id !== id);
          setFiles(nf);
          fileIdList(nf);
        } else {
@ -45,18 +44,15 @@ function Upload({isComplete, icon , btn , className , size , actionUrl,fileList}
  function handleChange (info) {
    if (info.file.status === 'uploading' || info.file.status === 'done' || info.file.status === 'removed') {
      let fileList = info.fileList;
-
-      setFiles(appendFileSizeToUploadFileAll(fileList));
-      fileIdList(fileList);
+      let len = info.fileList && info.fileList.length;
+      setFiles(appendFileSizeToUploadFileAll([fileList[len-1]]));
+      fileIdList(fileList[len-1]);
    }
  }

  function fileIdList (fileList) {
-    let array = [];
-    fileList && fileList.length > 0 && fileList.map((item) => {
-      return array.push(item.response && (item.response.id || (item.response.data && item.response.data.id)));
-    })
-    array && load && load(array);
+    let data = fileList.response && fileList.response.data;
+    fileList && load && load(data && data.id,data && data.fileName);
  }

  function beforeUpload(file){
@ -67,29 +63,20 @@ function Upload({isComplete, icon , btn , className , size , actionUrl,fileList}
    return isLt100M;
  }

-    //判断是否已经提交，如已提交评论则上一条评论数据清除
-
-    const upload = {
-      name: 'file',
-      fileList: files,
-      action: actionUrl,
-      onChange:handleChange,
-      onRemove:onAttachmentRemove,
-      beforeUpload:beforeUpload
-    };
-
-    return (
-      btn ? 
-      <Upload {...upload} className={className}>
-        <Button type={"default"}>上传文件</Button>
-        <span className="ml10 color-grey-9">(你可以上传小于<span className="color-red">{size}MB</span>的文件)</span>
-      </Upload>
-      :
-      <Dragger {...upload} className={className}>
-        {icon || <Icon type="inbox" />}
-        <p className="ant-upload-text font-14">拖动文件或<span className="color-blue">点击此处上传</span></p>
-      </Dragger>
-    )
-  }
+  const upload = {
+    name: 'file',
+    fileList: files,
+    action: actionUrl+`/busiAttachments/upload`,
+    onChange:handleChange,
+    onRemove:onAttachmentRemove,
+    beforeUpload:beforeUpload,
+    maxCount:1
+  };
+  return (
+    <Upload {...upload} className={className}>
+      <Button type={"default"}>上传文件</Button>
+      <span className="ml10 color-grey-9">(你可以上传小于<span className="color-red">{size}MB</span>的文件)</span>
+    </Upload>
+  )
 }
-export default Upload;
+export default Uploads;
--- a/src/forge/Source/UploadSource.jsx
+++ b/src/forge/Source/UploadSource.jsx
@ -1,22 +1,138 @@
-import React from 'react';
-import { Modal } from 'antd';
+import React , { forwardRef, useEffect, useState } from 'react';
+import { Modal , Form , Checkbox , Input , Table } from 'antd';
+import Upload from './Upload';
+import { AlignCenter } from '../Component/layout';
+import axios from 'axios';
+const { TextArea } = Input;

+const data = [
+  {name:"sdfkjsfj.pdf",loadNum:"10",citeNum:"15",time:"2021-04-01 10:45"},
+  {name:"sdfkjsfj.pdf",loadNum:"10",citeNum:"15",time:"2021-04-01 10:45"},
+  {name:"sdfkjsfj.pdf",loadNum:"10",citeNum:"15",time:"2021-04-01 10:45"}
+]
+const https = 'https://testfiles.trustie.net';
+function UploadSource({ form , visible , onCancel , onOk , showNotification ,owner,projectsId}){
+  const [ tableData , setTableData ] = useState(data);
+  const [ fileId , setFilesId ] = useState(undefined);
+  const [ fileName , setFileName ] = useState(undefined);
+  const { getFieldDecorator, validateFields , setFieldsValue } = form;

-function UploadSource({ visible , onCancel , onOk }){
+  // 上传附件后得到的文件id数组
+  function UploadFunc(id,name){
+    setFilesId(id);
+    setFileName(name);
+  }
+
+  const columns = [
+    {
+      dataIndex:"name",
+      key:"name",
+      title:"资源名称",
+      width:"45%",
+      ellipsis:true,
+      render:(value,item,key)=>{
+        return <AlignCenter>
+          <div className="task-hide" style={{maxWidth:key===0 ? "250px":"100%"}}>{value}</div>
+          { key === 0 && <span className="currentTip">当前版本</span> }
+        </AlignCenter>
+      }
+    },
+    {
+      dataIndex:"loadNum",
+      key:"loadNum",
+      title:"下载数",
+      width:"15%",
+      className:"edu-txt-center"
+    },
+    {
+      dataIndex:"citeNum",
+      key:"citeNum",
+      title:"引用数",
+      width:"15%",
+      className:"edu-txt-center"
+    },
+    {
+      dataIndex:"time",
+      key:"time",
+      title:"上传时间",
+      width:"25%"
+    }
+  ]
+
+  // 确定
+  function submit(){
+    if(fileId){
+      validateFields((error,values)=>{
+        if(!error){
+          postInfo(values);
+        }
+      })
+    }else{
+      showNotification("请先上传文件！");
+    }
+  }
+
+  function postInfo(values){
+    const url = https+`/api/project/achievement/`;
+    
+    axios.post(url,{
+      fileId:`${fileId}`,
+      fileName,
+      login:owner,
+      projectId:projectsId,
+      ...values
+    }).then(result=>{
+      if(result && result.data){
+        onOk();
+      }
+    }).catch(error=>{})
+  }
  return(
    <Modal 
      title={"上传资源"}
      closable={false}
      visible={visible}
      onCancel={onCancel}
-      onOk={onOk}
+      onOk={submit}
      cancelText="取消"
      okText="确定"
      width="600px"
      centered
    >
-      <div></div>
+      <div>
+        <Form>
+          <Table className="versionTable" columns={columns} dataSource={tableData} pagination={false} size={"small"}/>
+          <Form.Item>
+            {getFieldDecorator("tagNames",{
+              rules:[]
+            })(
+              <Checkbox.Group>
+                <Checkbox value="软件版本">软件版本</Checkbox>
+                <Checkbox value="文档">文档</Checkbox>
+                <Checkbox value="代码">代码</Checkbox>
+                <Checkbox value="媒体">媒体</Checkbox>
+                <Checkbox value="论文">论文</Checkbox>
+                <Checkbox value="其它">其它</Checkbox>
+              </Checkbox.Group>
+            )}
+          </Form.Item>
+          <Upload 
+            className="commentStyle"
+            load={UploadFunc}
+            size={100}
+            showNotification={showNotification}
+            actionUrl= {https}
+          />
+          <Form.Item className="mt20">
+            {getFieldDecorator("remark",{
+              rules:[]
+            })(
+              <TextArea rows={4} placeholder="请输入资源描述" />
+            )}
+          </Form.Item>
+        </Form>
+      </div>
    </Modal>
  )
 }
-export default UploadSource;
+export default Form.create()(forwardRef(UploadSource));;