-
{
- menuName.map((item,key)=>{
+ Array.isArray(menuName)&& menuName.map((item,key)=>{
return(
-
- @@ -65,6 +65,15 @@ function DetailBanner({ history,list , owner , projectsId , isManager , url , pa :"" } + { + item.menu_name === "wiki" && +
- + + + Wiki + + + } { item.menu_name === "devops" && platform ?
-
diff --git a/src/forge/Settings/Setting.js b/src/forge/Settings/Setting.js
index 5b4f07c29..5cd1bbc45 100644
--- a/src/forge/Settings/Setting.js
+++ b/src/forge/Settings/Setting.js
@@ -12,6 +12,7 @@ const menu = [
{name:"代码库",index:"code"},
{name:"易修 (Issue)",index:"issues"},
{name:"合并请求",index:"pulls"},
+ {name:"Wiki",index:"wiki"},
{name:"工作流(beta版)",index:"devops"},
// {name:"资源库",index:"resources"},
{name:"里程碑",index:"versions"},
diff --git a/src/forge/Wiki/EditWiki.jsx b/src/forge/Wiki/EditWiki.jsx
new file mode 100644
index 000000000..633bf02f8
--- /dev/null
+++ b/src/forge/Wiki/EditWiki.jsx
@@ -0,0 +1,223 @@
+import React, { useEffect, useCallback, useState } from 'react';
+import { Button, Checkbox, Form, Icon, Radio, Input, message } from 'antd';
+import MDEditor from "../../modules/tpm/challengesnew/tpm-md-editor";
+import DelModal from './components/ModalFun';
+import { weekModal, monthModal } from './components/config';
+import { getWiki, wikiPages, addWiki, updateWiki } from './api';
+import './Index.scss';
+
+
+export default Form.create()(({ form, history, showNotification, projectDetail, match, project }) => {
+ // const permission = projectDetail && projectDetail.permission !== "Reporter";
+ const permission = projectDetail && projectDetail.permission && projectDetail.permission !== "Reporter";
+
+ const { getFieldDecorator, validateFields, setFieldsValue } = form;
+ const [fileArrInit, setFileArrInit] = useState(null);
+ let projectsId = match.params.projectsId;
+ let owner = match.params.owner;
+
+ let wikiName = history.location.pathname.split('/').pop();
+ if (wikiName === 'add') {
+ wikiName = '';
+ }
+
+ const [content, setContent] = useState(undefined);
+ const [modal, setModal] = useState(false);
+ const [modalType, setModalType] = useState();
+
+
+ useEffect(() => {
+ wikiName && getWiki({
+ owner,
+ repo: projectsId,
+ pagename: wikiName,
+ projectId: project.id
+ }).then(res => {
+ if (res && res.data) {
+ setContent(res.data.md_content);
+ setFieldsValue({
+ name: res.data.name,
+ content: res.data.md_content,
+ });
+ }
+ });
+ }, [owner, wikiName]);
+
+ // 加载wiki列表
+ useEffect(() => {
+ project && wikiPages({
+ owner: owner,
+ repo: projectsId,
+ projectId: project.id
+ }).then(res => {
+ if (res && res.message === "200" && Array.isArray(res.data)) {
+ setFileArrInit(res.data);
+ } else {
+ setFileArrInit([]);
+ }
+ });
+ }, [project]);
+
+ const helper = useCallback(
+ (label, name, rules, widget, initialValue, rightComponent) => (
+
+ {getFieldDecorator(name, { rules, initialValue, validateFirst: true, })(widget)} + {rightComponent} + + ), []); + + + function onContentChange(value) { + setContent(value); + setFieldsValue({ + content: value + }); + }; + + // 保存wiki文件，包括新增和修改 + function saveFile() { + validateFields((err, values) => { + if (!err) { + let regEn = /[\[\]`\/:*?''<>|%-+_]/g; + if (regEn.test(values.name)) { + message.error('文件名不能有特殊字符'); + return; + } + if (wikiName) { + updateWiki({ + owner, + repo: projectsId, + projectId: project.id, + pagename: wikiName, + ...values, + commit_message: '', + }).then(res => dealRes(res)); + } else { + if (Array.isArray(fileArrInit)) { + for (const item of fileArrInit) { + if (item.name === values.name) { + message.error('不能与已有文件标题相同'); + return false; + } + } + } + addWiki({ + owner, + repo: projectsId, + projectId: project.id, + pagename: values.name, + ...values, + commit_message: '', + }).then(res => dealRes(res)); + } + } + }) + } + + function dealRes(res) { + if (res && res.message === "200") { + showNotification("操作成功"); + goBack(); + } else if (res && res.message === "500") { + message.error('请检查格式是否正确或文件名是否重复'); + } else { + showNotification(res.message || "操作失败"); + } + } + + function goBack() { + history.push(`/projects/${owner}/${projectsId}/wiki`); + } + + function changeModal(e) { + setModal(e.target.checked); + if (!e.target.checked) { + setModalType(); + } + } + + function changeModalType(e) { + let value = e.target.value; + if (!content) { + setModalContent(value); + return; + } + DelModal({ + title: '添加模版', + contentTitle: `您确定要添加“${value}”模板吗`, + content: `此操作会将“${value}”模板替换编辑栏内所有内容，请确认以防文件的丢失`, + okText: '确认添加', + onOk: () => { + setModalType(value); + setModal(true); + setModalContent(value); + } + }); + } + + function setModalContent(value) { + if (value === '周报') { + setContent(weekModal); + setFieldsValue({ + content: weekModal + }); + } else if (value === '月报') { + setContent(monthModal); + setFieldsValue({ + content: monthModal + }); + } + } + + + return ( +++ + ) +}) \ No newline at end of file diff --git a/src/forge/Wiki/Index.jsx b/src/forge/Wiki/Index.jsx new file mode 100644 index 000000000..ed5c48996 --- /dev/null +++ b/src/forge/Wiki/Index.jsx @@ -0,0 +1,298 @@ +import React, { useEffect, useCallback, useState } from 'react'; +import { Button, Dropdown, Icon, Input, Menu, Tooltip, Select, Upload, message, Spin } from 'antd'; +import { getImageUrl, timeAgo } from 'educoder'; +import cookie from 'react-cookies'; +// import Loading from "../../Loading"; +import DelModal from './components/ModalFun'; +import Welcome from './Welcome'; +import { wikiPages, getWiki, deleteWiki } from './api'; +import { httpUrl, TokenKey } from './fetch'; +import './Index.scss'; +import { isArray } from 'lodash'; +const Search = Input.Search; +const InputGroup = Input.Group; +const { Option } = Select; + +export default (props) => { + const { match, current_user, history, showNotification, project, projectDetail } = props; + // const permission = projectDetail && projectDetail.permission !== "Reporter"; + const permission = projectDetail && projectDetail.permission && projectDetail.permission !== "Reporter"; + + let projectsId = match.params.projectsId; + let owner = match.params.owner; + + console.log(project); + + const [fileArrInit, setFileArrInit] = useState(null); + const [checkItem, setCheckItem] = useState({}); + const [itemDetail, setItemDetail] = useState({}); + + const [fileArr, setFileArr] = useState([]); + const [reload, setReload] = useState(); + + const [urlType, setUrlType] = useState('HTTPS'); + + // 加载wiki列表 + useEffect(() => { + project && wikiPages({ + owner: owner, + repo: projectsId, + projectId: project.id + }).then(res => { + if (res && res.message === "200" && isArray(res.data)) { + setFileArr(res.data); + setFileArrInit(res.data); + if (res.data.length) { + setCheckItem(res.data[0]); + }; + } else { + setFileArr([]); + setFileArrInit([]); + } + }); + }, [project, reload]) + + // 加载单个wiki详情，参数尽量用驼峰，此处由于后端太麻烦所以不标准 + useEffect(() => { + project && checkItem.name && getWiki({ + owner: owner, + repo: projectsId, + pagename: checkItem.name, + projectId: project.id + }).then(res => { + if (res && res.message === "200") { + setItemDetail(res.data); + } else { + showNotification("加载失败") + } + }); + }, [project, checkItem]); + + function changeSearchValue(e) { + let value = e.target.value; + let newFileArr = []; + for (const item of fileArrInit) { + if (item.name.indexOf(value) > -1) { + newFileArr.push(item); + } + } + setFileArr(newFileArr); + } + + // 删除wiki模态框 + function deleteFileModal(e, item) { + e.stopPropagation(); + DelModal({ + title: '删除页面', + contentTitle: `您确定要删除“${item.name}”此页面吗？`, + content: '此操作将删除该页面，请进行确认以防文件的丢失。', + onOk: () => { + deleteWiki({ + owner: owner, + repo: projectsId, + pagename: item.name, + projectId: project.id + }).then(res => { + if (res && res.message === "200") { + message.success('删除成功'); + setReload(Math.random()); + } else { + message.error('删除失败'); + } + }); + } + }); + } + + + function goUser(login) { + window.location.href = `/users/${login}`; + } + + // 复制链接 + const copyUrl = useCallback(() => { + let wikiUrl = document.getElementById("wikiUrl"); + wikiUrl.select(); + if (document.execCommand('copy')) { + document.execCommand('copy'); + } + message.success('复制成功'); + wikiUrl.blur(); + }, []) + + function addFile() { + history.push(`/projects/${owner}/${projectsId}/wiki/add`); + } + + function goEdit() { + history.push(`/projects/${owner}/${projectsId}/wiki/edit/${encodeURI(checkItem.name)}`); + } + + function preview() { + window.open(`/projects/${owner}/${projectsId}/wiki/preview/${encodeURI(project.name)}/${project.id}`); + } + + // 支持 Markdown，Html，Pdf格式文件 + const menu = ( + + ); + + function downloadWiki(type) { + window.open(`${httpUrl}/api/wikiExport/wikiExport-wrapper?repoName=${projectsId}&owner=${owner}&type=${type}&projectName=${project.name}&projectId=${project.id}`); + } + + function beforeUpload(file) { + if (!['md', 'txt'].includes(file.name.split('.').pop())) { + message.error('只能上传md、txt文件'); + return false; + } + + let regEn = /[\[\]`\/:*?''<>|%-+_]/g; + if (regEn.test(file.name)) { + message.error('文件名不能有特殊字符'); + return; + } + + for (const item of fileArrInit) { + if (item.name === file.name) { + message.error('不能上传与已有文件相同文件名的文件'); + return false; + } + } + const isLt100M = file.size / 1024 / 1024 < 100; + if (!isLt100M) { + showNotification(`文件大小必须小于${100}MB!`); + } + return isLt100M; + } + + const uploadProps = { + name: 'multipartFile', + withCredentials: true, + action: `${httpUrl}/api/wikiExport/uploadWiki/${owner}/${projectsId}/${project && project.id}`, //?token=${sessionStorage.taskToken} + showUploadList: false, + headers: { + Authorization: cookie.load(TokenKey) || sessionStorage.taskToken, + }, + beforeUpload: beforeUpload, + onChange(info) { + if (info.file.status === 'uploading') { + console.log(info.file, info.fileList); + } + if (info.file.status === 'done') { + if (info.file.response.message === '200') { + message.success(`${info.file.name} 上传成功`); + setReload(Math.random()); + } else if (info.file.response.message === '500') { + let data = JSON.parse(info.file.response.data); + message.error(data && data.message ? data.message : '文件上传失败'); + } else { + message.error('文件上传失败'); + } + } else if (info.file.status === 'error') { + message.error(`${info.file.name} 上传失败`); + } + }, + }; + + return ( + < Spin spinning={!fileArrInit} className="opacitySpin"> + {fileArrInit && fileArrInit.length ? ++ Wiki+ +编辑页面 + ++ + {permission && } +标题
+ {helper( + "", + "name", + [ + { required: true, message: "请输入标题" }, + // { pattern: /[^`\[\]\/:*?''<>|%-+_]/g, message: '不允许部分特殊字符' } + ], + + )} + ++ + ++ {getFieldDecorator('content', { + rules: [{ required: true, message: "请输入wiki内容" }], + validateFirst: true + })()} + 添加模版 + ++ + +周报 +月报 +++ : ++ + + { + permission ? + + : "Wiki文档" + } + ++ ++ { + permission && +++ + } ++ + ++ + + +++++ +++ + + {checkItem.wiki_clone_link &&+ + { + fileArr.map(item => { + return ++ }) + } +{ setCheckItem(item) }}> +++ + {item.name} ++ {permission && { deleteFileModal(e, item) }}>} ++ + + } + ++ + +++++ + +++ {permission && } +{checkItem.name}
+ { goUser(current_user.login) }}> + {itemDetail.image_url &&} + {checkItem.commit ? checkItem.commit.author.name : ''} + + 上次修改于{checkItem.commit && timeAgo(checkItem.commit.author.when)} +
+ } + + ) +} diff --git a/src/forge/Wiki/Index.scss b/src/forge/Wiki/Index.scss new file mode 100644 index 000000000..c571da25f --- /dev/null +++ b/src/forge/Wiki/Index.scss @@ -0,0 +1,381 @@ +$wikiColor: #466aff; +$primaryBtnHover: #6482ff; +body { + width: 100% !important; +} +.ant-spin-nested-loading > div > .ant-spin.opacitySpin{ + max-height: 100vh; + background: rgba(255,255,255,1); +} +.wiki-main { + width: 1200px; + min-height: 400px; + margin: 20px auto; + + .ant-btn-primary { + background-color: $wikiColor; + border-color: $wikiColor; + &:hover, + &:focus, + &:active { + background-color: $primaryBtnHover; + } + } + + .ant-btn-default:hover, + .ant-btn-default:active, + .ant-btn-default:focus { + background: #f3f4f6; + color: #333; + border-color: #d0d0d0; + } + + .wiki-head { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 20px; + height: 64px; + background: #fafcff; + box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.13); + border-radius: 4px; + border-bottom-left-radius: 0; + .ant-btn .anticon { + margin: 0 -3px 0 0; + } + } + + .head-title { + font-size: 20px; + color: #05101a; + line-height: 30px; + font-weight: 500; + + .anticon-right { + color: #666; + font-size: 0.9rem; + } + } + + .back-wiki { + color: $wikiColor; + cursor: pointer; + &:hover { + color: $primaryBtnHover; + } + } + + .head-log-middle { + width: 3rem; + height: 3rem; + margin-right: 0.35rem; + border-radius: 50%; + } + + .head-log-small { + width: 1.25rem; + height: 1.25rem; + margin-right: 0.35rem; + border-radius: 50%; + } + + .user-box { + font-size: 12px; + font-family: "PingFangSC-Medium"; + color: $wikiColor; + cursor: pointer; + &:hover { + color: $primaryBtnHover; + } + .head-log-small { + position: relative; + top: -2px; + } + } + + .time-ago { + font-size: 12px; + color: #333; + letter-spacing: 0; + line-height: 17px; + font-weight: 400; + font-family: "PingFangSC-Regular"; + } + + .has-error .ant-form-explain, + .has-error .ant-form-split { + position: absolute; + } + .wiki-nav { + max-height: 60vh; + .wiki-search { + padding: 0 14px; + .ant-input { + padding-left: 30px; + } + .ant-input-suffix { + left: 26px; + right: auto; + } + &:hover .ant-input, + &:focus .ant-input { + border-color: $wikiColor !important; + } + } + } + + .wiki-nav-parent { + width: 260px; + flex: none; + } + + .ant-form-item-children .ant-input:hover { + border-color: $wikiColor !important; + } + + .ant-checkbox-checked .ant-checkbox-inner { + background-color: $wikiColor; + border-color: $wikiColor; + } + .ant-radio-checked .ant-radio-inner, + .ant-radio-checked::after { + border-color: $wikiColor; + } + + .ant-radio-inner::after { + background-color: $wikiColor; + } + + .ant-radio-group { + display: block; + margin: 10px 0 0 30px; + } + + .ant-radio-wrapper:hover .ant-radio, + .ant-radio:hover .ant-radio-inner, + .ant-radio-input:focus + .ant-radio-inner { + border-color: $wikiColor; + } +} + +#wikiUrl:focus { + border-right: 1px solid #d9d9d9 !important; +} + +.wiki-body { + display: flex; +} + +.wiki-content { + flex: auto; + width: 75%; +} + +.wiki-content-detail { + padding: 0 20px; + word-break: break-all; +} + +.ant-input-group.ant-input-group-compact.copy-url { + display: flex; + margin-top: 20px; + .ant-select-selection__rendered { + margin: 0 14px 0 5px; + width: 3rem; + font-size: 12px; + } + .ant-select-arrow { + right: 4px; + } + .ant-input { + font-size: 12px; + font-family: "PingFangSC-Regular"; + color: #666; + letter-spacing: 0; + font-weight: 400; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + word-break: break-all; + } + + .copy-svg { + display: inline-flex; + align-items: center; + justify-content: center; + padding: 0 5px; + background: #fff; + font-size: 1rem !important; + border: 1px solid #d9d9d9; + border-left: 0; + color: $wikiColor; + cursor: pointer; + } +} + +.wiki-url-type { + .ant-select-dropdown-menu-item { + font-size: 12px; + } +} + +.wiki-nav { + min-height: 300px; + padding: 20px 0; + background: #ffffff; + border: 1px solid rgba(153, 153, 153, 0.22); + overflow-y: scroll; + flex: none; + color: #333; +} + +.wiki-nav-title { + display: flex; + justify-content: space-between; + align-items: center; + height: 50px; + padding: 0 10px 0 10px; + font-size: 14px; + letter-spacing: 0; + font-weight: 400; + font-family: "PingFangSC-Regular"; + border-bottom: 1px solid #eee; + line-height: 16px; + cursor: pointer; + + .delete-title-icon { + display: none; + } + + &:hover { + background-color: #fbfbfb; + .delete-title-icon { + display: inline-block; + } + } +} + +.wiki-nav-title-parent { + padding: 0 14px; + &:hover { + background: #fbfbfb; + } +} + +.wiki-nav-title.active { + color: $wikiColor; +} + +.wiki-content-head { + margin: 20px 0 20px 20px; + padding: 0 20px 20px 0; + display: flex; + justify-content: space-between; + align-items: center; + border-bottom: 1px solid #eee; +} + +.wiki-content-head-left { + width: 90%; +} + +.nav-title-left { + display: inline-flex; + max-width: 90%; + svg { + margin-right: 0.5rem; + flex: none; + } + .nav-title-left-text { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } +} + +.wiki-detail-title { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} +// 预览页面样式文件 +.wiki-preview { + overflow-y: scroll; + height: 100%; + .wiki-body { + width: 90%; + } + .ant-btn-primary { + background-color: $wikiColor; + border-color: $wikiColor; + &:hover, + &:focus, + &:active { + background-color: $primaryBtnHover; + } + } + .preview-head { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0 12rem 0 2rem; + width: 100%; + height: 80px; + background: rgb(39, 47, 76); + color: #fff; + } + + .preview-head-left { + display: inline-flex; + align-items: center; + font-size: 24px; + cursor: pointer; + + .icon-wendangyulan_icon { + font-size: 24px !important; + font-weight: 700; + } + } + + .preview-head-right { + display: flex; + + .copy-url { + margin-top: 0; + } + .copy-desc { + width: 6rem; + padding-top: 1px; + } + } + + .wiki-nav-title { + padding: 0 10px 0 40px; + } + .wiki-nav-title.active { + background-color: #f3f4f6; + } + + .wiki-content-head { + padding: 10px 20px 10px 20px; + } + + .wiki-nav { + padding: 20px 0; + width: 20vw; + border-bottom: 0; + height: 80vh; + } + .wiki-content-detail { + padding: 0 40px; + img { + max-width: 100%; + } + } + + .ant-btn:hover { + background: #f3f4f6; + color: #333; + border-color: #d0d0d0; + } +} diff --git a/src/forge/Wiki/Preview.jsx b/src/forge/Wiki/Preview.jsx new file mode 100644 index 000000000..20645246a --- /dev/null +++ b/src/forge/Wiki/Preview.jsx @@ -0,0 +1,157 @@ +import React, { useEffect, useCallback, useState } from 'react'; +import { Input, Button, Tooltip, Select, Dropdown, Icon, Menu, message } from 'antd'; +import { wikiPages, getWiki, } from './api'; +import { httpUrl } from './fetch'; +import './Index.scss'; +const InputGroup = Input.Group; +const { Option } = Select; + +export default (props) => { + + const { match, history, showNotification, project, projectDetail } = props; + const permission = projectDetail && projectDetail.permission && projectDetail.permission !== "Reporter"; + + let projectsId = match.params.projectsId; + let owner = match.params.owner; + + let projectName = match.params.projectName; + let projectId = match.params.projectId; + + console.log('projectName:'); + console.log(projectName); + + const [checkItem, setCheckItem] = useState({}); + const [itemDetail, setItemDetail] = useState({}); + + const [fileArr, setFileArr] = useState([]); + const [urlType, setUrlType] = useState('HTTPS'); + + useEffect(() => { + projectsId && wikiPages({ + owner: owner, + repo: projectsId, + projectId: projectId, + }).then(res => { + if (res && res.message === "200") { + setFileArr(res.data); + if (res.data.length) { + setCheckItem(res.data[0]); + }; + } else { + showNotification("加载失败") + } + }); + }, [project]) + + + useEffect(() => { + projectsId && checkItem.name && getWiki({ + owner: owner, + repo: projectsId, + pagename: checkItem.name, + projectId: projectId, + }).then(res => { + if (res && res.message === "200") { + setItemDetail(res.data); + } else { + showNotification("加载失败") + } + }); + }, [project, checkItem]); + + const copyUrl = useCallback(() => { + let wikiUrl = document.getElementById("wikiUrl"); + wikiUrl.select(); + if (document.execCommand('copy')) { + document.execCommand('copy'); + } + message.success('复制成功'); + wikiUrl.blur(); + }, []); + + function goEdit() { + history.push(`/projects/${owner}/${projectsId}/wiki/edit/${checkItem.name}`); + } + + function goBack() { + history.push(`/projects/${owner}/${projectsId}/wiki`); + } + + // 支持 Markdown，Html，Pdf格式文件 + const menu = ( + + ); + + function downloadWiki(type) { + window.open(`${httpUrl}/api/wikiExport/wikiExport-wrapper?repoName=${projectsId}&owner=${owner}&type=${type}&projectName=${projectName}&projectId=${projectId}`); + } + + + return ( + ++ ) +} \ No newline at end of file diff --git a/src/forge/Wiki/Welcome/index.jsx b/src/forge/Wiki/Welcome/index.jsx new file mode 100644 index 000000000..78cd34e45 --- /dev/null +++ b/src/forge/Wiki/Welcome/index.jsx @@ -0,0 +1,50 @@ +import React from 'react'; +import { Button } from 'antd'; +// import { addWiki } from '../api'; +import './index.scss'; + +export default ({ project, isManager, history, showNotification, match, reloadList }) => { + + let projectsId = match.params.projectsId; + let owner = match.params.owner; + + // function addFile() { + // addWiki({ + // owner, + // repo: projectsId, + // pagename: 'Home', + // name: 'Home', + // content: 'Welcome to the wiki!', + // commit_message: '', + // }).then(res => { + // if (res.message === "200") { + // reloadList(Math.random()); + // showNotification("创建成功"); + // } else { + // showNotification("创建失败"); + // } + // }); + // } + + function addFile() { + history.push(`/projects/${owner}/${projectsId}/wiki/add`); + } + + return ( +++ + ++ + {projectName} +++ 克隆地址 + { + checkItem.wiki_clone_link &&++ + + + } + ++ + ++ + +++ + ++ { + fileArr.map(item => { + return+ +{ setCheckItem(item) }}> + + + {item.name} + ++ }) + } + +++++ + +{checkItem.name}
+ {permission && } ++ ++ ) +} \ No newline at end of file diff --git a/src/forge/Wiki/Welcome/index.scss b/src/forge/Wiki/Welcome/index.scss new file mode 100644 index 000000000..b931fa622 --- /dev/null +++ b/src/forge/Wiki/Welcome/index.scss @@ -0,0 +1,55 @@ +.welcome-main { + display: flex; + flex-flow: column nowrap; + justify-content: center; + align-items: center; + width: 1200px; + min-height: 400px; + padding: 20px; + margin: 20px auto; + background: rgba(250, 252, 255, 1); + font-family: "PingFangSC-Medium"; + border-radius: 4px; + border: 1px solid rgba(42, 97, 255, 0.23); + + .icon-huanying_icon { + font-size: 48px !important; + font-weight: 700; + } + + .welcome-title { + display: inline-flex; + align-items: center; + margin: 10px 0; + font-size: 26px; + color: #333333; + font-weight: 500; + } + + .wiki-title { + display: inline-block; + max-width: 20em; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + + .welcome-content { + font-size: 14px; + color: #333333; + font-weight: 400; + } + + .wiki-line { + margin: 50px 0 40px; + width: 400px; + height: 1px; + background: #eeeeee; + } + + .welcome-des { + font-size: 16px; + color: #333333; + font-weight: 500; + } +} diff --git a/src/forge/Wiki/api.js b/src/forge/Wiki/api.js new file mode 100644 index 000000000..353383221 --- /dev/null +++ b/src/forge/Wiki/api.js @@ -0,0 +1,48 @@ +import fetch from './fetch'; +// import { notification } from 'antd'; + +// 获取wiki列表 +export function wikiPages(params) { + return fetch({ + url: '/api/wiki/wikiPages', + method: 'get', + params + }); +} + +// 获取单个wiki +export function getWiki(params) { + return fetch({ + url: '/api/wiki/getWiki', + method: 'get', + params + }); +} + +//新增wiki +export function addWiki(data) { + return fetch({ + url: '/api/wiki/createWiki', + method: 'post', + data: data + }); +} + +//更新wiki +export function updateWiki(data) { + return fetch({ + url: '/api/wiki/updateWiki', + method: 'PUT', + data: data + }); +} + +//删除wiki +export function deleteWiki(data) { + return fetch({ + url: '/api/wiki/deleteWiki', + method: 'DELETE', + data, + }); +} + diff --git a/src/forge/Wiki/components/FolderTree/index.js b/src/forge/Wiki/components/FolderTree/index.js new file mode 100644 index 000000000..bbcdb3906 --- /dev/null +++ b/src/forge/Wiki/components/FolderTree/index.js @@ -0,0 +1,244 @@ +import * as React from 'react'; +import classNames from 'classnames'; +import { Icon, Tree } from 'antd'; +import omit from 'omit.js'; +import debounce from 'lodash/debounce'; +import { conductExpandParent, convertTreeToEntities } from 'rc-tree/lib/util'; +import { polyfill } from 'react-lifecycles-compat'; +import { ConfigConsumer } from '../../../../../node_modules/antd/lib/config-provider'; +import { + calcRangeKeys, + getFullKeyList, + convertDirectoryKeysToNodes, + getFullKeyListByTreeData, +} from '../../../../../node_modules/antd/lib/tree/util'; + +import { FolderSvg, FolderExpandSvg, FileSvg } from '../../Svg'; +import './index.scss'; + + +function getIcon(props) { + // console.log(props); + // console.log(props.expanded); + const { isLeaf, expanded ,selected} = props; + if (isLeaf) { + return欢迎使用 + + {project && project.name} + + Wiki
+Wiki主要是您项目的产品设计、文档描述、注释等等
+ + + { + isManager ? + :该项目暂时没有创建Wiki
+ } +; + } + return expanded ? : + // return +} + +class DirectoryTree extends React.Component { + static defaultProps = { + showIcon: true, + expandAction: 'click', + }; + + static getDerivedStateFromProps(nextProps) { + const newState = {}; + if ('expandedKeys' in nextProps) { + newState.expandedKeys = nextProps.expandedKeys; + } + if ('selectedKeys' in nextProps) { + newState.selectedKeys = nextProps.selectedKeys; + } + return newState; + } + + // state: DirectoryTreeState; + + // tree: Tree; + + // onDebounceExpand: (event: React.MouseEvent , node: AntTreeNode) => void; + + // Shift click usage + // lastSelectedKey?: string; + + // cachedSelectedKeys?: string[]; + + constructor(props) { + super(props); + + const { + defaultExpandAll, + defaultExpandParent, + expandedKeys, + defaultExpandedKeys, + children, + } = props; + const { keyEntities } = convertTreeToEntities(children); + + // Selected keys + this.state = { + selectedKeys: props.selectedKeys || props.defaultSelectedKeys || [], + }; + + // Expanded keys + if (defaultExpandAll) { + if (props.treeData) { + this.state.expandedKeys = getFullKeyListByTreeData(props.treeData); + } else { + this.state.expandedKeys = getFullKeyList(props.children); + } + } else if (defaultExpandParent) { + this.state.expandedKeys = conductExpandParent( + expandedKeys || defaultExpandedKeys, + keyEntities, + ); + } else { + this.state.expandedKeys = expandedKeys || defaultExpandedKeys; + } + + this.onDebounceExpand = debounce(this.expandFolderNode, 200, { + leading: true, + }); + } + + onExpand = (expandedKeys, info) => { + const { onExpand } = this.props; + + this.setUncontrolledState({ expandedKeys }); + + // Call origin function + if (onExpand) { + return onExpand(expandedKeys, info); + } + + return undefined; + }; + + onClick = (event, node) => { + const { onClick, expandAction } = this.props; + + // Expand the tree + if (expandAction === 'click') { + this.onDebounceExpand(event, node); + } + + if (onClick) { + onClick(event, node); + } + }; + + onDoubleClick = (event, node) => { + const { onDoubleClick, expandAction } = this.props; + + // Expand the tree + if (expandAction === 'doubleClick') { + this.onDebounceExpand(event, node); + } + + if (onDoubleClick) { + onDoubleClick(event, node); + } + }; + + onSelect = (keys, event) => { + const { onSelect, multiple, children } = this.props; + const { expandedKeys = [] } = this.state; + const { node, nativeEvent } = event; + const { eventKey = '' } = node.props; + + const newState = {}; + + // We need wrap this event since some value is not same + const newEvent = { + ...event, + selected: true, // Directory selected always true + }; + + // Windows / Mac single pick + const ctrlPick = nativeEvent.ctrlKey || nativeEvent.metaKey; + const shiftPick = nativeEvent.shiftKey; + + // Generate new selected keys + let newSelectedKeys; + if (multiple && ctrlPick) { + // Control click + newSelectedKeys = keys; + this.lastSelectedKey = eventKey; + this.cachedSelectedKeys = newSelectedKeys; + newEvent.selectedNodes = convertDirectoryKeysToNodes(children, newSelectedKeys); + } else if (multiple && shiftPick) { + // Shift click + newSelectedKeys = Array.from( + new Set([ + ...(this.cachedSelectedKeys || []), + ...calcRangeKeys(children, expandedKeys, eventKey, this.lastSelectedKey), + ]), + ); + newEvent.selectedNodes = convertDirectoryKeysToNodes(children, newSelectedKeys); + } else { + // Single click + newSelectedKeys = [eventKey]; + this.lastSelectedKey = eventKey; + this.cachedSelectedKeys = newSelectedKeys; + newEvent.selectedNodes = [event.node]; + } + newState.selectedKeys = newSelectedKeys; + + if (onSelect) { + onSelect(newSelectedKeys, newEvent); + } + + this.setUncontrolledState(newState); + }; + + setTreeRef = (node) => { + this.tree = node; + }; + + expandFolderNode = (event, node) => { + const { isLeaf } = node.props; + + if (isLeaf || event.shiftKey || event.metaKey || event.ctrlKey) { + return; + } + + // Get internal rc-tree + const internalTree = this.tree.tree; + + // Call internal rc-tree expand function + // https://github.com/ant-design/ant-design/issues/12567 + internalTree.onNodeExpand(event, node); + }; + + setUncontrolledState = (state) => { + const newState = omit(state, Object.keys(this.props)); + if (Object.keys(newState).length) { + this.setState(newState); + } + }; + + renderDirectoryTree = ({ getPrefixCls }) => { + const { prefixCls: customizePrefixCls, className, ...props } = this.props; + const { expandedKeys, selectedKeys } = this.state; + + const prefixCls = getPrefixCls('tree', customizePrefixCls); + const connectClassName = classNames(`${prefixCls}-directory`, className); + + return ( + + ); + }; + + render() { + return {this.renderDirectoryTree} ; + } +} + +polyfill(DirectoryTree); + +export default DirectoryTree; diff --git a/src/forge/Wiki/components/FolderTree/index.scss b/src/forge/Wiki/components/FolderTree/index.scss new file mode 100644 index 000000000..f74cfaf93 --- /dev/null +++ b/src/forge/Wiki/components/FolderTree/index.scss @@ -0,0 +1,61 @@ +.hide-file-icon.ant-tree.ant-tree-directory { + li span.ant-tree-switcher { + display: none !important; + } + + // li[role="treeitem"]:hover > span.ant-tree-switcher, + // li.ant-tree-treenode-selected > span.ant-tree-switcher { + // z-index: 1000; + // display: inline-block !important; + // } + + .ant-tree-node-content-wrapper{ + display: inline-flex; + width: 100%; + } + + .tree-title-icon{ + display: none; + } + + .ant-tree-node-content-wrapper:hover .tree-title-icon{ + transition: all 0.3s; + display: inline-block; + } + + &.ant-tree.ant-tree-directory + > li.ant-tree-treenode-selected + > span.ant-tree-node-content-wrapper::before, + &.ant-tree.ant-tree-directory + .ant-tree-child-tree + > li.ant-tree-treenode-selected + > span.ant-tree-node-content-wrapper::before { + background: #fff; + margin-top: -3px; + } + + &.ant-tree.ant-tree-directory > li span.ant-tree-node-content-wrapper::before, + &.ant-tree.ant-tree-directory + .ant-tree-child-tree + > li + span.ant-tree-node-content-wrapper::before { + margin-top: -3px; + } + + > li span.ant-tree-node-content-wrapper.ant-tree-node-selected, + .ant-tree-child-tree + > li + span.ant-tree-node-content-wrapper.ant-tree-node-selected { + color: #2a61ff; + } + + + + .ant-tree-title{ + display: inline-flex; + justify-content:space-between; + flex: auto; + } +} + + diff --git a/src/forge/Wiki/components/Login/index.jsx b/src/forge/Wiki/components/Login/index.jsx new file mode 100644 index 000000000..9574a9a51 --- /dev/null +++ b/src/forge/Wiki/components/Login/index.jsx @@ -0,0 +1,44 @@ +import React, { useState } from 'react'; +import * as ReactDOM from 'react-dom'; +import LoginDialog from '../../../../modules/login/LoginDialog'; +import './index.scss'; + +// 使用函数调用删除组件 +export default function DelModal(props) { + const div = document.createElement('div'); + document.body.appendChild(div); + + function destroy() { + const unmountResult = ReactDOM.unmountComponentAtNode(div); + if (unmountResult && div.parentNode) { + div.parentNode.removeChild(div); + } + } + + function render() { + /** + * Sync render blocks React event. Let's make this async. + */ + setTimeout(() => { + ReactDOM.render( ++ , + div, + ); + }); + } + + render(); +} + +function MyLoginDialog({afterClose}) { + const [isRender, setIsRender] = useState(true); + return ( + {setIsRender(false);afterClose()}} + /> + ) +} + + diff --git a/src/forge/Wiki/components/Login/index.scss b/src/forge/Wiki/components/Login/index.scss new file mode 100644 index 000000000..13d160665 --- /dev/null +++ b/src/forge/Wiki/components/Login/index.scss @@ -0,0 +1,56 @@ +.delete-modal { + .ant-modal-header { + padding: 9px 24px; + background: #f8f8f8; + border-bottom: 1px solid #eee; + } + .ant-modal-title { + text-align: left; + } + .ant-modal-close { + top: 0px !important; + } + .ant-modal-close-x { + font-size: 24px; + } + .ant-modal-body { + text-align: center; + } + .delete-title { + display: flex; + justify-content: center; + align-items: center; + margin: 2rem 0 1rem !important; + font-size: 16px; + color: #333; + letter-spacing: 0; + line-height: 29px; + font-weight: 400; + } + .red-circle { + align-self: flex-start; + color: #ca0002; + font-size: 1.5rem !important; + } + .delete-descibe { + font-size: 14px; + color: #666; + line-height: 33px; + font-weight: 400; + } + .ant-modal-footer { + padding: 2rem 0; + text-align: center; + border: 0; + .ant-btn { + width: 6rem; + } + } + .foot-submit { + margin-left: 3rem; + color: #df0002; + &:hover { + border-color: #df0002; + } + } +} \ No newline at end of file diff --git a/src/forge/Wiki/components/ModalFun/index.jsx b/src/forge/Wiki/components/ModalFun/index.jsx new file mode 100644 index 000000000..661eca31b --- /dev/null +++ b/src/forge/Wiki/components/ModalFun/index.jsx @@ -0,0 +1,149 @@ +import React, { useState } from 'react'; +import * as ReactDOM from 'react-dom'; +import { Modal, Button } from 'antd'; +import './index.scss'; + +// 使用函数调用删除组件 +export default function DelModal(props) { + renderModal({ ...props, type: 'delete' }) +} + +export function confirmModal(props) { + renderModal({ ...props, type: 'confirm' }) +} + +function renderModal(props) { + const type = props.type; + const div = document.createElement('div'); + document.body.appendChild(div); + + function destroy() { + const unmountResult = ReactDOM.unmountComponentAtNode(div); + if (unmountResult && div.parentNode) { + div.parentNode.removeChild(div); + } + } + + function modalType(type) { + if (type === 'delete') { + return + } else if (type === 'confirm') { + return + } else { + return + } + } + + function render() { + /** + * Sync render blocks React event. Let's make this async. + */ + setTimeout(() => { + ReactDOM.render( + modalType(type), + div, + ); + }); + } + render(); +} + +// 真正的删除组件 +function DeleteModal({ + onCancel, + onOk, + title, + contentTitle, + content, + afterClose, + okText, + cancelText, +}) { + + const [visible, setVisible] = useState(true); + + function onCancelModal() { + setVisible(false); + onCancel && onCancel() + } + + function onSuccess() { + setVisible(false); + onOk && onOk(); + } + + return ( + + {cancelText||'取消'} + , + , + ]} + > + + ) +} + +// 选择组件 +function ConfirmModal({ + onCancel, + onOk, + title, + contentTitle, + content, + okText, + cancelText, + afterClose, +}) { + + const [visible, setVisible] = useState(true); + + function onCancelModal() { + setVisible(false); + onCancel && onCancel() + } + + function onSuccess() { + setVisible(false); + onOk && onOk(); + } + + return ( ++++ + {contentTitle}
+{content}
++ {cancelText||'取消'} + , + , + ]} + > + + ) +} diff --git a/src/forge/Wiki/components/ModalFun/index.scss b/src/forge/Wiki/components/ModalFun/index.scss new file mode 100644 index 000000000..a598d2bf0 --- /dev/null +++ b/src/forge/Wiki/components/ModalFun/index.scss @@ -0,0 +1,56 @@ +.myself-modal { + .ant-modal-header { + padding: 9px 24px; + background: #f8f8f8; + border-bottom: 1px solid #eee; + } + .ant-modal-title { + text-align: left; + } + .ant-modal-close { + top: 0px !important; + } + .ant-modal-close-x { + font-size: 24px; + } + .ant-modal-body { + text-align: center; + } + .delete-title { + display: flex; + justify-content: center; + align-items: center; + margin: 2rem 0 1rem !important; + font-size: 16px; + color: #333; + letter-spacing: 0; + line-height: 29px; + font-weight: 400; + } + .red-circle { + align-self: flex-start; + color: #ca0002; + font-size: 1.5rem !important; + } + .delete-descibe { + font-size: 14px; + color: #666; + line-height: 33px; + font-weight: 400; + } + .ant-modal-footer { + padding: 2rem 0; + text-align: center; + border: 0; + .ant-btn { + width: 6rem; + } + } + .foot-submit { + margin-left: 3rem; + color: #df0002; + &:hover { + border-color: #df0002; + } + } +} \ No newline at end of file diff --git a/src/forge/Wiki/components/config.js b/src/forge/Wiki/components/config.js new file mode 100644 index 000000000..bda413390 --- /dev/null +++ b/src/forge/Wiki/components/config.js @@ -0,0 +1,29 @@ +import { httpUrl } from '../fetch'; + +export const editorConfig = { + placeholder: '请输入', + uploadImgServer: httpUrl + '/busiAttachments/upload', + uploadFileName: 'file', + uploadImgHeaders: { + 'X-Requested-With': 'XMLHttpRequest' + }, + excludeMenus: [ + 'list', + 'todo', + 'emoticon', + 'video' + ], + uploadImgHooks: { + // 图片上传并返回了结果，想要自己把图片插入到编辑器中 + customInsert: function (insertImgFn, result) { + // insertImgFn 可把图片插入到编辑器，传入图片 src ，执行函数即可 + if (result && result.data && result.data.id) { + insertImgFn(`${httpUrl}/busiAttachments/view/${result.data.id}`); + } + } + }, +} + + +export const weekModal="| 工作项目 | 本周工作计划 | 本周完成情况 |下周计划 | 待协同事项 |\n| ------------ | ------------ | ------------ | ------------ | ------------ |\n| | | | | |\n| | | | | |\n| | | | | |\n| | | | | |\n\n 备注:"; +export const monthModal="|工作项目 | 工作内容 | 项目进度情况 | 问题列表及解决方案| 下月工作计划 | 遗留未解决的问题 |\n| ------------ | ------------ | ------------ | ------------ | ------------ | ------------ |\n| | | | | | |\n| | | | | | |\n| | | | | | |\n| | | | | | |\n\n 月度总结："; diff --git a/src/forge/Wiki/fetch.js b/src/forge/Wiki/fetch.js new file mode 100644 index 000000000..ccb9676a2 --- /dev/null +++ b/src/forge/Wiki/fetch.js @@ -0,0 +1,106 @@ +import { notification ,message} from 'antd'; +import axios from 'axios'; +import cookie from 'react-cookies'; +import Login from './components/Login'; + +let actionUrl = ''; +if (window.location.href.indexOf('localhost') > -1) { + // actionUrl = 'http://117.50.100.12:8008'; + // actionUrl = 'http://192.168.31.74:8081'; + actionUrl = "https://test-search.trustie.net"; +} else if(window.location.href.indexOf('testforgeplus')>-1){ + actionUrl = "https://test-search.trustie.net"; + // actionUrl = 'https://testforgeplus.trustie.net'; + axios.defaults.withCredentials = true; +}else if (window.location.href.indexOf('wiki-api') > -1) { + actionUrl = "https://wiki-api.trustie.net"; + axios.defaults.withCredentials = true; +} + +export const httpUrl = actionUrl; +export const TokenKey = 'autologin_trustie'; + +// 创建axios实例 +const service = axios.create({ + baseURL: httpUrl, + timeout: 10000, // 请求超时时间 +}); + +// request拦截器 +service.interceptors.request.use(config => { + if (cookie.load(TokenKey)) { + console.log(cookie.load(TokenKey)); + config.headers['Authorization'] = cookie.load(TokenKey); // 让每个请求携带自定义token 请根据实际情况自行修改 + } + if (window.location.port === "3007") { + // 模拟token为登录用户 + const taskToken = sessionStorage.taskToken; + if (config.url.indexOf('?') === -1) { + config.url = `${config.url}?token=${taskToken}`; + } else { + config.url = `${config.url}&token=${taskToken}`; + } + } + return config; +}, error => { + // Do something with request error + console.log(error); // for debug + // Promise.reject(error); +}); +// respone拦截器 +service.interceptors.response.use( + response => { + const res = response||{}; + if (res.status === 400) { + message.error(res.data.message || '操作失败'); + return Promise.reject('error'); + } + if (res.status === 401) { + message.error(res.data.message || '登录信息已过期'); + return Promise.reject('error'); + } + if (res.status === 403) { + message.error(res.data.message || '无权限！'); + return Promise.reject('error'); + } + if (res.status === 40001) { + notification.open({ + message: "提示", + description: '账户或密码错误！', + }); + return Promise.reject('error'); + } + if (response.status !== 200 && res.status !== 200) { + notification.open({ + message: "提示", + description: res.message, + }); + } else { + return response.data; + } + }, + error => { + console.log(error); + let res = error.response||{}; + if (res.status === 400) { + message.error(res.data.message || '操作失败'); + return Promise.reject('error'); + } + if (res.status === 401) { + message.error(res.data.message || '登录信息已过期'); + Login(); + return Promise.reject('error'); + } + if (res.status === 403) { + message.error(res.data.message || '无权限！'); + return Promise.reject('error'); + } + notification.open({ + message: "提示", + description: error.message, + }); + return Promise.reject(error); + } +); + +export default service;+ {contentTitle &&+{contentTitle}
} +{content}
+