Merge branch 'dev' of gitlab.corp.qunar.com:mfe/yapi into dev

client/components/Header/Header.js

@@ -9,7 +9,7 @@ import { changeMenuItem } from '../../reducer/modules/menu'
 import { withRouter } from 'react-router';
 import Srch from './Search/Search'
 const { Header } = Layout;
-import { logoSVG } from '../../common.js';
+import { logoSVG, betaSVG } from '../../common.js';
 
 const MenuUser = (props) => (
   <Menu className="user-menu" >
@@ -167,7 +167,7 @@ export default class HeaderCom extends Component {
         <div className="content g-row">
           <div className="logo">
             <Link to="/group" onClick={this.relieveLink} className="href">
-              <span className="img">{logoSVG('32px')}</span><span className="logo-name">YAPI<span className="ui-badge"></span></span>
+              <span className="img">{logoSVG('32px')}</span><span className="logo-name">YAPI<span className="ui-badge">{betaSVG}</span></span>
             </Link>
           </div>
           <div className="user-toolbar">

client/components/Header/Header.scss

@@ -32,12 +32,13 @@
     }
     .ui-badge {
       position: absolute;
-      right: -20px;
-      top: 10px;
+      right: -18px;
+      top: 6px;
       width: 30px;
       height: 21px;
-      background-size: 240px 21px;
-      background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IuWbvuWxgl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDgwMCA3MCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgODAwIDcwOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHN0eWxlIHR5cGU9InRleHQvY3NzIj4uc3Qwe2ZpbGw6I0Y4NTg2MDt9LnN0MXtmaWxsOiNGRkZGRkY7fS5zdDJ7Zm9udC1mYW1pbHk6J0ZaTFRaSEstLUdCSzEtMCc7fS5zdDN7Zm9udC1zaXplOjI0cHg7fTwvc3R5bGU+PGcgaWQ9IuWbvuWxgl8xXzFfIj48ZyBpZD0i5Zu+5bGCXzIiPjxnPjxyZWN0IHg9IjkiIHk9IjQiIGNsYXNzPSJzdDAiIHdpZHRoPSI4MyIgaGVpZ2h0PSI0NCIvPjwvZz48Zz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTkyLDQ4YzAsMC01NSw1LjktNjUuNCw1LjlTMTA5LDQ4LDEwOSw0OFY0YzAsMCw5LjQsOC4yLDE5LjgsOC4yUzE5Miw0LDE5Miw0VjQ4eiIvPjwvZz48Zz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNMjkyLDQ4YzAsMC0zMS4xLDUuOS00MS41LDUuOVMyMDksNDgsMjA5LDQ4VjRjMCwwLDMxLjEsOS4zLDQxLjUsOS4zUzI5Miw0LDI5Miw0VjQ4eiIvPjwvZz48Zz48cGF0aCBjbGFzcz0ic3QwIiBkPSJNMzkyLDQ4YzAsMC0yLjgsNC40LTEzLjIsNC40UzMwOSw0OCwzMDksNDhWNGMwLDAsNTcuNiw2LjcsNjgsNi43UzM5Miw0LDM5Miw0VjQ4eiIvPjwvZz48Zz48cG9seWdvbiBjbGFzcz0ic3QwIiBwb2ludHM9IjQ5Miw1Mi40IDQwOSw0OCA0MDksNCA0OTIsMTEuMSAiLz48L2c+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTTU5Miw1Mi40YzAsMC01MC45LTMtNjItNS40Yy0xMC4xLTIuMi0yMSwxLTIxLDFWNGMwLDAsNi44LTIsMTcsMGMxMSwyLjIsNjYsMTAsNjYsMTBWNTIuNHoiLz48L2c+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTTY4OSw0OGMwLDAtMjIuOSwyLjQtMzQsMGMtMTAuMS0yLjItNDYsMC00NiwwVjRjMCwwLDMxLjgtMiw0MiwwYzExLDIuMiw0MS43LDEwLjQsNDEuNywxMC40TDY4OSw0OHoiLz48L2c+PGc+PHBhdGggY2xhc3M9InN0MCIgZD0iTTc5Miw0OWMwLDAtOS45LDEuNC0yMS0xYy0xMC4xLTIuMi02MiwwLTYyLDBWNGMwLDAsNDcuOC0zLDU4LTFjMTEsMi4yLDI1LDkuOSwyNSw5LjlWNDl6Ii8+PC9nPjwvZz48L2c+PGcgaWQ9IuWbvuWxgl8yXzFfIj48dGV4dCB0cmFuc2Zvcm09Im1hdHJpeCgxIDAgMCAxIDEzLjk4NDQgMzUpIiBjbGFzcz0ic3QxIHN0MiBzdDMiPkFscGhhPC90ZXh0Pjx0ZXh0IHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgMTEzLjk4NDQgMzUpIiBjbGFzcz0ic3QxIHN0MiBzdDMiPkFscGhhPC90ZXh0Pjx0ZXh0IHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgMjEzLjk4NDQgMzUpIiBjbGFzcz0ic3QxIHN0MiBzdDMiPkFscGhhPC90ZXh0Pjx0ZXh0IHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgMzEzLjk4NDQgMzUpIiBjbGFzcz0ic3QxIHN0MiBzdDMiPkFscGhhPC90ZXh0Pjx0ZXh0IHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgNDEzLjk4NDQgMzUpIiBjbGFzcz0ic3QxIHN0MiBzdDMiPkFscGhhPC90ZXh0Pjx0ZXh0IHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgNTEzLjk4NDQgMzUpIiBjbGFzcz0ic3QxIHN0MiBzdDMiPkFscGhhPC90ZXh0Pjx0ZXh0IHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgNjEzLjk4NDQgMzUpIiBjbGFzcz0ic3QxIHN0MiBzdDMiPkFscGhhPC90ZXh0Pjx0ZXh0IHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgNzEzLjk4NDQgMzUpIiBjbGFzcz0ic3QxIHN0MiBzdDMiPkFscGhhPC90ZXh0PjwvZz48L3N2Zz4=);
+      background-size: 236px 21px;
+      background-repeat: no-repeat;
+      background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjM2IiBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMjM2IDE2IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjx0aXRsZT5hPC90aXRsZT48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxnIGZpbGwtcnVsZT0ibm9uemVybyIgZmlsbD0iI0Y4NTg2MCI+PHBhdGggZD0iTTAgLjYxM2gyNS40NFYxNC4xSDB6TTU1LjQ0IDE0LjFzLTE2Ljg1OCAxLjgwOC0yMC4wNDUgMS44MDhDMzIuMjA3IDE1LjkwOCAzMCAxNC4xIDMwIDE0LjFWLjYxM3MyLjg4IDIuNTEzIDYuMDcgMi41MTNjMy4xODcgMCAxOS4zNy0yLjUxMyAxOS4zNy0yLjUxM1YxNC4xek04NS40NCAxNC4xcy05LjUzMiAxLjgwOC0xMi43MiAxLjgwOEM2OS41MzMgMTUuOTA4IDYwIDE0LjEgNjAgMTQuMVYuNjEzczkuNTMzIDIuODUgMTIuNzIgMi44NWMzLjE4OCAwIDEyLjcyLTIuODUgMTIuNzItMi44NVYxNC4xek0xMTUuNDQgMTQuMXMtLjg1OCAxLjM0OC00LjA0NSAxLjM0OEMxMDguMjA3IDE1LjQ0OCA5MCAxNC4xIDkwIDE0LjFWLjYxM3MxNy42NTUgMi4wNTQgMjAuODQzIDIuMDU0YzMuMTg4IDAgNC41OTgtMi4wNTQgNC41OTgtMi4wNTRWMTQuMXpNMTQ1LjQ0IDE1LjQ0OEwxMjAgMTQuMVYuNjEzbDI1LjQ0IDIuMTc2TTE3NS40NCAxNS40NDhzLTE1LjYtLjkyLTE5LjAwMy0xLjY1NUMxNTMuMzQgMTMuMTIgMTUwIDE0LjEgMTUwIDE0LjFWLjYxM3MyLjA4NC0uNjEzIDUuMjEgMGMzLjM3Mi42NzQgMjAuMjMgMy4wNjUgMjAuMjMgMy4wNjV2MTEuNzd6TTIwNC41MiAxNC4xcy03LjAxOC43MzUtMTAuNDIgMGMtMy4wOTYtLjY3NS0xNC4xIDAtMTQuMSAwVi42MTNzOS43NDctLjYxMyAxMi44NzQgMGMzLjM3LjY3NCAxMi43OCAzLjE4OCAxMi43OCAzLjE4OGwtMS4xMzMgMTAuM3pNMjM1LjQ0IDE0LjQwNnMtMy4wMzQuNDMtNi40MzYtLjMwNmMtMy4wOTYtLjY3NS0xOS4wMDQgMC0xOS4wMDQgMFYuNjEzczE0LjY1LS45MiAxNy43NzgtLjMwNmMzLjM3LjY3NCA3LjY2MyAzLjAzNCA3LjY2MyAzLjAzNHYxMS4wNjZ6Ii8+PC9nPjxnIGZvbnQtc2l6ZT0iMTAiIGZvbnQtZmFtaWx5PSJIZWx2ZXRpY2EiIGZpbGw9IiNGRkYiPjx0ZXh0IHRyYW5zZm9ybT0idHJhbnNsYXRlKDIgMSkiPjx0c3BhbiB4PSIwIiB5PSIxMCI+QmV0YTwvdHNwYW4+PC90ZXh0Pjx0ZXh0IHRyYW5zZm9ybT0idHJhbnNsYXRlKDIgMSkiPjx0c3BhbiB4PSIzMCIgeT0iMTAiPkJldGE8L3RzcGFuPjwvdGV4dD48dGV4dCB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyIDEpIj48dHNwYW4geD0iNjAiIHk9IjEwIj5CZXRhPC90c3Bhbj48L3RleHQ+PHRleHQgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMiAxKSI+PHRzcGFuIHg9IjkwIiB5PSIxMCI+QmV0YTwvdHNwYW4+PC90ZXh0Pjx0ZXh0IHRyYW5zZm9ybT0idHJhbnNsYXRlKDIgMSkiPjx0c3BhbiB4PSIxMjAiIHk9IjEwIj5CZXRhPC90c3Bhbj48L3RleHQ+PHRleHQgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMiAxKSI+PHRzcGFuIHg9IjE1MCIgeT0iMTAiPkJldGE8L3RzcGFuPjwvdGV4dD48dGV4dCB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyIDEpIj48dHNwYW4geD0iMTgwIiB5PSIxMCI+QmV0YTwvdHNwYW4+PC90ZXh0Pjx0ZXh0IHRyYW5zZm9ybT0idHJhbnNsYXRlKDIgMSkiPjx0c3BhbiB4PSIyMTAiIHk9IjEwIj5CZXRhPC90c3Bhbj48L3RleHQ+PC9nPjwvZz48L3N2Zz4=);
       animation: flag .8s steps(8) infinite;
     }
     @keyframes flag {

client/components/ProjectCard/ProjectCard.js

@@ -67,9 +67,10 @@ class ProjectCard extends Component {
 
   render() {
     const { projectData, inFollowPage } = this.props;
+    console.log(projectData);
     return (
       <div className="card-container">
-        <Card bordered={false} className="m-card" onClick={() => this.props.history.push('/project/' + projectData._id)}>
+        <Card bordered={false} className="m-card" onClick={() => this.props.history.push('/project/' + (projectData.projectid || projectData._id))}>
           <Icon type={projectData.icon || 'star-o'} className="ui-logo" style={{ backgroundColor: constants.PROJECT_COLOR[projectData.color] || constants.PROJECT_COLOR.blue }} />
           <h4 className="ui-title">{projectData.name || projectData.projectname}</h4>
         </Card>

client/containers/Follows/Follows.js

@@ -33,7 +33,6 @@ class Follows extends Component {
   }
 
   receiveRes = () => {
-    console.log('receive res!');
     this.props.getFollowList(this.props.uid).then((res) => {
       console.log(res);
       if (res.payload.data.errcode === 0) {

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

@@ -388,7 +388,7 @@ class InterfaceEditForm extends Component {
             <span>
               接口路径&nbsp;
               <Tooltip title="接口路径，支持动态路由,例如:'/api/user/:id'">
-                <Icon type="question" style={{ width: "10px" }} />
+                <Icon type="question-circle-o" style={{ width: "10px" }} />
               </Tooltip>
 
             </span>

client/containers/Project/Setting/ProjectMember/ProjectMember.js

@@ -218,8 +218,7 @@ class ProjectMember extends Component {
           {this.state.groupMemberList.length ? this.state.groupMemberList.map((item, index) => {
             return (<div key={index} className="card-item">
               <img src={location.protocol + '//' + location.host + '/api/user/avatar?uid=' + item.uid} className="item-img" />
-              <p className="item-name">{item.username}</p>
-              {item.uid === this.props.uid ? <Badge count={'我'} style={{ backgroundColor: '#689bd0', marginLeft: '8px', borderRadius: '4px' }} /> : null}
+              <p className="item-name">{item.username}{item.uid === this.props.uid ? <Badge count={'我'} style={{ backgroundColor: '#689bd0', fontSize: '12px', marginLeft: '8px', borderRadius: '4px' }} /> : null}</p>
               {item.role === 'owner' ? <p className="item-role">组长</p> : null}
               {item.role === 'dev' ? <p className="item-role">开发者</p> : null}
             </div>);

index.html

@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title></title>
+    <style media="screen">
+    .test {
+        width: 400px;
+        position: relative;
+        min-height: 240px;
+        background-color: #2395f1;
+        overflow: hidden;
+    }
+    .test:before, .test:after {
+        content: "";
+        position: absolute;
+        left: 50%;
+        min-width: 800px;
+        min-height: 800px;
+        background-color: #fff;
+        animation-name: rotate;
+        animation-iteration-count: infinite;
+        animation-timing-function: linear;
+    }
+    .test:before {
+        bottom: 180px;
+        border-radius: 45%;
+        animation-duration: 10s;
+    }
+    .test:after {
+        top: 180px;
+        opacity: .5;
+        border-radius: 47%;
+        animation-duration: 10s;
+    }
+
+    @keyframes rotate {
+        0% {
+        transform: translate(-50%, 0) rotateZ(0deg);
+        }
+        50% {
+        transform: translate(-50%, -2%) rotateZ(180deg);
+        }
+        100% {
+        transform: translate(-50%, 0%) rotateZ(360deg);
+        }
+    }
+    </style>
+  </head>
+  <body>
+    <div class="test">
+
+    </div>
+  </body>
+</html>