feat: 组装wiki插件

client/containers/Project/Interface/InterfaceList/InterfaceContent.js

@@ -110,7 +110,7 @@ class Content extends Component {
       document.getElementsByTagName('title')[0].innerText = this.props.curdata.title + '-' + this.title;
     }
     
-    let InterfaceTabs = {
+    let InterfaceTabs = { 
       view: {
         component: View,
         name: '预览'

client/containers/Project/Project.js

@@ -1,24 +1,24 @@
-import React, { PureComponent as Component } from 'react'
+import React, { PureComponent as Component } from 'react';
 import { connect } from 'react-redux';
-import PropTypes from 'prop-types'
+import PropTypes from 'prop-types';
 import { Route, Switch, Redirect, matchPath } from 'react-router-dom';
 import { Subnav } from '../../components/index';
 import { fetchGroupMsg } from '../../reducer/modules/group';
 import { setBreadcrumb } from '../../reducer/modules/user';
 import { getProject } from '../../reducer/modules/project';
-import Interface from './Interface/Interface.js'
-import Activity from './Activity/Activity.js'
-import Setting from './Setting/Setting.js'
+import Interface from './Interface/Interface.js';
+import Activity from './Activity/Activity.js';
+import Setting from './Setting/Setting.js';
 import Loading from '../../components/Loading/Loading';
 import ProjectMember from './Setting/ProjectMember/ProjectMember.js';
 import ProjectData from './Setting/ProjectData/ProjectData.js';
-
+const plugin = require('client/plugin.js');
 @connect(
   state => {
     return {
       curProject: state.project.currProject,
       currGroup: state.group.currGroup
-    }
+    };
   },
   {
     getProject,
@@ -26,9 +26,7 @@ import ProjectData from './Setting/ProjectData/ProjectData.js';
     setBreadcrumb
   }
 )
-
 export default class Project extends Component {
-
   static propTypes = {
     match: PropTypes.object,
     curProject: PropTypes.object,
@@ -37,80 +35,108 @@ export default class Project extends Component {
     fetchGroupMsg: PropTypes.func,
     setBreadcrumb: PropTypes.func,
     currGroup: PropTypes.object
-  }
+  };
 
   constructor(props) {
-    super(props)
+    super(props);
   }
 
   async componentWillMount() {
     await this.props.getProject(this.props.match.params.id);
     await this.props.fetchGroupMsg(this.props.curProject.group_id);
 
-    this.props.setBreadcrumb([{
-      name: this.props.currGroup.group_name,
-      href: '/group/' + this.props.currGroup._id
-    }, {
-      name: this.props.curProject.name
-    }]);
+    this.props.setBreadcrumb([
+      {
+        name: this.props.currGroup.group_name,
+        href: '/group/' + this.props.currGroup._id
+      },
+      {
+        name: this.props.curProject.name
+      }
+    ]);
   }
 
   async componentWillReceiveProps(nextProps) {
     const currProjectId = this.props.match.params.id;
     const nextProjectId = nextProps.match.params.id;
-    if(currProjectId !== nextProjectId) {
+    if (currProjectId !== nextProjectId) {
       await this.props.getProject(nextProjectId);
       await this.props.fetchGroupMsg(this.props.curProject.group_id);
-      this.props.setBreadcrumb([{
-        name: this.props.currGroup.group_name,
-        href: '/group/' + this.props.currGroup._id
-      }, {
-        name: this.props.curProject.name
-      }]);
+      this.props.setBreadcrumb([
+        {
+          name: this.props.currGroup.group_name,
+          href: '/group/' + this.props.currGroup._id
+        },
+        {
+          name: this.props.curProject.name
+        }
+      ]);
     }
-    
   }
 
   render() {
     const { match, location } = this.props;
     let routers = {
-      activity: { name: '动态', path: "/project/:id/activity" },
-      interface: { name: '接口', path: "/project/:id/interface/:action" },
-      setting: { name: '设置', path: "/project/:id/setting" },
-      members: { name: '成员管理', path: "/project/:id/members" },
-      data: { name: '数据管理', path: "/project/:id/data" }
-    }
+      interface: { name: '接口', path: '/project/:id/interface/:action', component: Interface },
+      activity: { name: '动态', path: '/project/:id/activity', component: Activity },
+      data: { name: '数据管理', path: '/project/:id/data', component: ProjectData },
+      members: { name: '成员管理', path: '/project/:id/members', component: ProjectMember },
+      setting: { name: '设置', path: '/project/:id/setting', component: Setting }
+    };
+
+    plugin.emitHook('sub_nav', routers);
 
     let key, defaultName;
     for (key in routers) {
-      if (matchPath(location.pathname, {
-        path: routers[key].path
-      }) !== null) {
+      if (
+        matchPath(location.pathname, {
+          path: routers[key].path
+        }) !== null
+      ) {
         defaultName = routers[key].name;
         break;
       }
     }
-    
-    let subnavData = [{
-      name: routers.interface.name,
-      path: `/project/${match.params.id}/interface/api`
-    }, {
-      name: routers.activity.name,
-      path: `/project/${match.params.id}/activity`
-    }, {
-      name: routers.data.name,
-      path: `/project/${match.params.id}/data`
-    }, {
-      name: routers.members.name,
-      path: `/project/${match.params.id}/members`
-    }, {
-      name: routers.setting.name,
-      path: `/project/${match.params.id}/setting`
-    }];
+
+    // let subnavData = [{
+    //   name: routers.interface.name,
+    //   path: `/project/${match.params.id}/interface/api`
+    // }, {
+    //   name: routers.activity.name,
+    //   path: `/project/${match.params.id}/activity`
+    // }, {
+    //   name: routers.data.name,
+    //   path: `/project/${match.params.id}/data`
+    // }, {
+    //   name: routers.members.name,
+    //   path: `/project/${match.params.id}/members`
+    // }, {
+    //   name: routers.setting.name,
+    //   path: `/project/${match.params.id}/setting`
+    // }];
+
+    let subnavData = [];
+    Object.keys(routers).forEach(key => {
+      let item = routers[key];
+      let value = {};
+      if (key === 'interface') {
+        value = {
+          name: item.name,
+          path: `/project/${match.params.id}/interface/api`
+        };
+      } else {
+        value = {
+          name: item.name,
+          path: item.path.replace(/\:id/gi, match.params.id)
+        };
+      }
+      subnavData.push(value);
+    });
+
     if (this.props.currGroup.type === 'private') {
       subnavData = subnavData.filter(item => {
-        return item.name != '成员管理'
-      })
+        return item.name != '成员管理';
+      });
     }
 
     if (Object.keys(this.props.curProject).length === 0) {
@@ -119,22 +145,31 @@ export default class Project extends Component {
 
     return (
       <div>
-        <Subnav
-          default={defaultName}
-          data={subnavData} />
+        <Subnav default={defaultName} data={subnavData} />
         <Switch>
           <Redirect exact from="/project/:id" to={`/project/${match.params.id}/interface/api`} />
-          <Route path={routers.activity.path} component={Activity} />
-          <Route path={routers.interface.path} component={Interface} />
+          {/* <Route path={routers.activity.path} component={Activity} />
+          
           <Route path={routers.setting.path} component={Setting} />
           {this.props.currGroup.type !== 'private' ?
-            <Route path={routers.members.path} component={ProjectMember} />
+            <Route path={routers.members.path} component={routers.members.component}/>
             : null
           }
 
-          <Route path={routers.data.path} component={ProjectData} />
+          <Route path={routers.data.path} component={ProjectData} /> */}
+          {Object.keys(routers).map(key => {
+            let item = routers[key];
+
+            return key === 'members' ? (
+              this.props.currGroup.type !== 'private' ? (
+                <Route path={item.path} component={item.component} key={key}/>
+              ) : null
+            ) : (
+              <Route path={item.path} component={item.component} key={key}/>
+            );
+          })}
         </Switch>
       </div>
-    )
+    );
   }
 }

client/plugin.js

@@ -170,7 +170,27 @@ hooks = {
     type: 'listener',
     mulit: true,
     listener: []
+  },
+
+  /*
+   * 添加 subnav 钩子
+   * @param Object reducerModules
+   * 
+   *  let routers = {
+      interface: { name: '接口', path: "/project/:id/interface/:action", component:Interface },
+      activity: { name: '动态', path: "/project/:id/activity", component:  Activity},
+      data: { name: '数据管理', path: "/project/:id/data",  component: ProjectData},
+      members: { name: '成员管理', path: "/project/:id/members" , component: ProjectMember},
+      setting: { name: '设置', path: "/project/:id/setting" , component: Setting}
+    }
+   * 
+   */
+  sub_nav: {
+    type: 'listener',
+    mulit: true,
+    listener: []
   }
+
 };
 
 function bindHook(name, listener) {

common/config.js

@@ -13,5 +13,7 @@ module.exports = {
     name: 'export-data'
   },{
     name: 'import-yapi-json'
+  },{
+    name: 'wiki'
   }]
 }

exts/yapi-plugin-wiki/WikiPage/index.js

@@ -0,0 +1,13 @@
+import React, { Component } from 'react';
+// import { connect } from 'react-redux'
+// import axios from 'axios'
+// import PropTypes from 'prop-types'
+// import './index.scss'
+
+class WikiPage extends Component {
+  render() {
+    return <div className="g-row">wiki</div>;
+  }
+}
+
+export default WikiPage;

exts/yapi-plugin-wiki/client.js

@@ -0,0 +1,11 @@
+import WikiPage from './WikiPage/index'
+
+module.exports = function(){
+  this.bindHook('sub_nav', function(app){
+    app.wiki = {
+      name: 'wiki',
+      path: '/project/:id/wiki',
+      component: WikiPage
+    }
+  })
+}

exts/yapi-plugin-wiki/index.js

@@ -0,0 +1,7 @@
+module.exports = {
+  server: false,
+  client: true,
+  httpCodes: [
+      100,101,102,200,201,202,203,204,205,206,207,208,226,300,301,302,303,304,305,307,308,400,401,402,403,404,405,406,407,408,409,410,411,412,413,414,415,416,417,418,422,423,424,426,428,429,431,500,501,502,503,504,505,506,507,508,510,511
+  ]
+}