List is empty.
);
9 | }
10 | return (
11 | List is empty.
);
9 | }
10 | return (
11 | (this.editorRoot = node)}
237 | >
238 |
239 |
(this.container = node)}
243 | />
244 | { split ? (
245 |
250 | ) : null}
251 |
252 | );
253 | }
254 | }
255 |
--------------------------------------------------------------------------------
/app/views/component/cloud/Drive.jsx:
--------------------------------------------------------------------------------
1 | import React, { Component, Fragment } from 'react';
2 | import PropTypes from 'prop-types';
3 | import { Breadcrumb, message, Icon, Modal } from 'antd';
4 | import autobind from 'autobind-decorator';
5 | import Notebooks from './Notebooks';
6 | import Notes from './Notes';
7 | import Loading from '../share/Loading';
8 | import {
9 | DRIVE_FETCHING_PROJECTS,
10 | DRIVE_FETCHING_NOTES,
11 | DRIVE_BACK_ROOT,
12 | DRIVE_DOWNLOAD_NOTE,
13 | DRIVE_DELETE_ITEM,
14 | } from '../../actions/drive';
15 | import { getTokens } from '../../utils/db/app';
16 |
17 | const confirm = Modal.confirm;
18 | const BreadcrumbItem = Breadcrumb.Item;
19 |
20 | export default class Drive extends Component {
21 | static displayName = 'CloudDrive';
22 | static propTypes = {
23 | dispatch: PropTypes.func.isRequired,
24 | match: PropTypes.any.isRequired,
25 | drive: PropTypes.shape({
26 | status: PropTypes.number.isRequired,
27 | projects: PropTypes.array.isRequired,
28 | notes: PropTypes.array.isRequired,
29 | currentProjectName: PropTypes.string.isRequired,
30 | }).isRequired,
31 | note: PropTypes.shape({
32 | projectUuid: PropTypes.string.isRequired,
33 | projectName: PropTypes.string.isRequired,
34 | fileUuid: PropTypes.string.isRequired,
35 | fileName: PropTypes.string.isRequired,
36 | }).isRequired,
37 | }
38 |
39 | constructor(props) {
40 | super(props);
41 | this.state = {
42 | show: false,
43 | hasAuth: false,
44 | driveName: '',
45 | loadingText: 'Loading',
46 | };
47 | }
48 |
49 | componentDidMount() {
50 | this.checkOAuth();
51 | }
52 |
53 | getValidNotes() {
54 | const { notes } = this.props.drive;
55 | return notes.filter(note => /.md$/ig.test(note.name));
56 | }
57 |
58 | setAutuStatus(flag) {
59 | this.setState({
60 | show: true,
61 | hasAuth: flag,
62 | });
63 | }
64 |
65 | setDriveName(name) {
66 | this.setState({
67 | driveName: name,
68 | });
69 | }
70 |
71 | checkOAuth() {
72 | let drive = this.props.match.params.drive;
73 | const { dispatch, drive: { currentProjectName } } = this.props;
74 | const oAuth = getTokens();
75 | let auth;
76 | if (drive === 'onedrive') {
77 | drive = 'onedriver';
78 | auth = oAuth.oneDriver;
79 | this.setDriveName('One Drive');
80 | } else {
81 | message.error('Not support this cloud drive');
82 | return false;
83 | }
84 | if (auth.token && auth.refreshToken) { // 已经授权
85 | this.setAutuStatus(true);
86 | this.setState({
87 | loadingText: 'Loading...',
88 | });
89 | if (currentProjectName) {
90 | this.props.dispatch({
91 | type: DRIVE_FETCHING_NOTES,
92 | folder: currentProjectName,
93 | driveName: drive,
94 | });
95 | } else {
96 | dispatch({
97 | type: DRIVE_FETCHING_PROJECTS,
98 | driveName: drive,
99 | });
100 | }
101 | } else {
102 | this.setAutuStatus(false); // 未授权
103 | }
104 | }
105 |
106 | @autobind
107 | handleRefresh() {
108 | this.checkOAuth();
109 | }
110 |
111 | @autobind
112 | chooseProject(folder) {
113 | this.setState({
114 | loadingText: 'Loading...',
115 | });
116 | let driveName = this.props.match.params.drive;
117 | if (driveName === 'onedrive') {
118 | driveName = 'onedriver';
119 | }
120 | this.props.dispatch({
121 | type: DRIVE_FETCHING_NOTES,
122 | folder,
123 | driveName,
124 | });
125 | }
126 |
127 | @autobind
128 | backRoot() {
129 | const { drive: { currentProjectName } } = this.props;
130 | if (currentProjectName) {
131 | this.props.dispatch({
132 | type: DRIVE_BACK_ROOT,
133 | });
134 | } else {
135 | this.handleRefresh();
136 | }
137 | }
138 |
139 | // 下载单个笔记
140 | @autobind
141 | downloadNote(name) {
142 | const { drive: { currentProjectName }, note } = this.props;
143 | this.setState({
144 | loadingText: 'Downloading...',
145 | });
146 | let driveName = this.props.match.params.drive;
147 | if (driveName === 'onedrive') {
148 | driveName = 'onedriver';
149 | }
150 | let needUpdateEditor = false;
151 | if (note.projectUuid !== '-1' && note.fileUuid !== '-1' && note.projectName === currentProjectName && `${note.fileName}.md` === name) {
152 | needUpdateEditor = true;
153 | }
154 | this.props.dispatch({
155 | type: DRIVE_DOWNLOAD_NOTE,
156 | folder: currentProjectName,
157 | name,
158 | driveName,
159 | needUpdateEditor,
160 | });
161 | }
162 |
163 | // 打开删除笔记提示框
164 | @autobind
165 | openDelete(e, type, name, id, parentReference) {
166 | e.stopPropagation();
167 | confirm({
168 | title: `Remove "${name.replace(/.md$/ig, '')}"?`,
169 | content: 'It can be reduced in the cloud drive.',
170 | onOk: () => {
171 | this.deleteItem(type, name, id, parentReference);
172 | },
173 | });
174 | }
175 |
176 | /**
177 | * @desc 删除单个Item
178 | * @param {String} type 'note' or 'project'
179 | */
180 | deleteItem(type, name, id, parentReference) {
181 | this.setState({
182 | loadingText: 'Deleting...',
183 | });
184 | let driveName = this.props.match.params.drive;
185 | if (driveName === 'onedrive') {
186 | driveName = 'onedriver';
187 | }
188 | let jsonItemId;
189 | if (type === 'note') {
190 | // 搜索匹配.json文件
191 | const { notes } = this.props.drive;
192 | const jsonName = `${name.replace(/.md$/ig, '')}.json`;
193 | const nl = notes.length;
194 | for (let i = 0; i < nl; i++) {
195 | if (notes[i].name === jsonName) {
196 | jsonItemId = notes[i].id;
197 | break;
198 | }
199 | }
200 | }
201 | this.props.dispatch({
202 | type: DRIVE_DELETE_ITEM,
203 | itemId: id,
204 | parentReference,
205 | driveName,
206 | jsonItemId,
207 | deleteType: type,
208 | });
209 | }
210 |
211 | renerList(status, driveName, currentProjectName, blur) {
212 | if (status === 2) {
213 | return (
214 |
215 |
216 |
217 | Fetch data failed.
218 |
219 |
220 | );
221 | }
222 | if (currentProjectName) {
223 | return this.renderNotes(status, driveName, currentProjectName, blur);
224 | }
225 | return this.renderProject(status, driveName, currentProjectName, blur);
226 | }
227 |
228 | /**
229 | * @param {Number} status 请求状态
230 | * @param {String} driveName 驱动名称
231 | * @param {String} currentProjectName
232 | * @param {String} blur
233 | */
234 | renderNotes(status, driveName, currentProjectName, blur) {
235 | const notes = this.getValidNotes();
236 | return (
237 |
238 |
243 |
244 | );
245 | }
246 |
247 | renderProject(status, driveName, currentProjectName, blur) {
248 | const { drive: { projects } } = this.props;
249 | return (
250 |
251 |
256 |
257 | );
258 | }
259 |
260 | renderBread(blur, driveName, currentProjectName) {
261 | return (
262 |
263 |
264 |
265 | {driveName}
266 |
270 | Yosoro
271 |
272 | {currentProjectName ? (
273 |
274 | {currentProjectName}
275 |
276 | ) : null}
277 |
278 |
279 |
280 |
281 |
282 |
283 | );
284 | }
285 |
286 | renderLoading(status) {
287 | const { loadingText } = this.state;
288 | if (status === 0) {
289 | return (
290 |
291 | );
292 | }
293 | return null;
294 | }
295 |
296 | render() {
297 | const { show, hasAuth, driveName } = this.state;
298 | if (!show) {
299 | return null;
300 | }
301 | if (!hasAuth) {
302 | return (
303 |
304 |
305 |
306 | Yosoro need to be authorized.
307 |
308 |
309 | );
310 | }
311 | const { drive: { status, currentProjectName } } = this.props;
312 | let blur = '';
313 | if (status === 0) {
314 | blur = 'blur';
315 | }
316 | return (
317 |
318 | {this.renderLoading(status)}
319 | {this.renderBread(blur, driveName, currentProjectName)}
320 | {this.renerList(status, driveName, currentProjectName, blur)}
321 |
322 | );
323 | }
324 | }
325 |
--------------------------------------------------------------------------------
11 | 
3 | 
7 | 
10 | 
11 | 
12 | 
15 |