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

client/components/ErrMsg/ErrMsg.js

@@ -46,6 +46,12 @@ class ErrMsg extends Component {
           title = '你还没有关注项目呢';
           desc = <span>先去 <a onClick={() => this.props.history.push('/group')}>“项目广场”</a> 逛逛吧, 那里可以添加关注。</span>;
           break;
+        case 'noMemberInProject':
+          title = '该项目还没有成员呢';
+          break;
+        case 'noMemberInGroup':
+          title = '该分组还没有成员呢';
+          break;
         case 'noProject':
           title = '该分组还没有项目呢';
           desc = <span>请点击右上角 “<Icon type="plus-circle" />” 按钮新建项目</span>;

client/components/ErrMsg/ErrMsg.scss

@@ -3,6 +3,7 @@
   font-size: .14rem;
   line-height: 2;
   margin-bottom: .24rem;
+  color: rgba(13, 27, 62, 0.43);
   .icon {
     font-size: .6rem;
     margin-bottom: .08rem;

client/components/ProjectCard/ProjectCard.scss

@@ -45,7 +45,7 @@
   .ant-card-body {
     background-color: $color-bg-gray;
     border-radius: 4px;
-    padding-top: .9rem;
+    padding-top: .24rem + .16rem + 1rem;
     box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
   }
   .ui-logo {
@@ -55,8 +55,8 @@
     position: absolute;
     left: 50%;
     top: 0;
-    transform: translate(-50%, -20%);
-    font-size: .4rem;
+    transform: translate(-50%, .24rem);
+    font-size: .5rem;
     color: #fff;
     background-color: #2395f1;
     line-height: 1rem;
@@ -64,7 +64,6 @@
   }
   .ui-title {
     font-size: .19rem;
-    margin-bottom: .08rem;
     font-weight: normal;
     overflow: hidden;
     text-overflow:ellipsis;
@@ -82,18 +81,45 @@
 
 }
 
-.card-panel-s {
+// .card-panel-s {
+//   .m-card {
+//     .ant-card-body {
+//       padding-top: .6rem;
+//     }
+//     .ui-logo {
+//       width: .6rem;
+//       height: .6rem;
+//       line-height: .6rem;
+//       transform: translate(-50%, -20%);
+//       font-size: .24rem;
+//       background-color: #2395f1;
+//     }
+//   }
+// }
+@media (max-width: 768px) {
   .m-card {
     .ant-card-body {
-      padding-top: .6rem;
+      padding-top: .24rem + .16rem + .6rem;
     }
     .ui-logo {
       width: .6rem;
       height: .6rem;
       line-height: .6rem;
-      transform: translate(-50%, -20%);
-      font-size: .24rem;
-      background-color: #2395f1;
+      font-size: .3rem;
+    }
+  }
+}
+
+@media (min-width: 768px) and (max-width: 992px) {
+  .m-card {
+    .ant-card-body {
+      padding-top: .24rem + .16rem + .8rem;
+    }
+    .ui-logo {
+      width: .8rem;
+      height: .8rem;
+      line-height: .8rem;
+      font-size: .4rem;
     }
   }
 }

client/constants/variable.js

@@ -25,9 +25,9 @@ export default {
   },
   PROJECT_COLOR: {
     blue: '#2395f1',
-    green: '#57cf27',
-    yellow: '#fac200',
-    red: '#ff561b',
+    green: '#00a854',
+    yellow: '#ffbf00',
+    red: '#f56a00',
     pink: '#f5317f',
     cyan: '#00a2ae',
     gray: '#bfbfbf',

client/containers/Group/MemberList/MemberList.js

@@ -5,6 +5,7 @@ import { Table, Select, Button, Modal, Row, Col, message, Popconfirm } from 'ant
 import './MemberList.scss';
 import { autobind } from 'core-decorators';
 import { fetchGroupMemberList, fetchGroupMsg, addMember, delMember, changeMemberRole } from '../../../reducer/modules/group.js'
+import ErrMsg from '../../../components/ErrMsg/ErrMsg.js';
 import UsernameAutoComplete from '../../../components/UsernameAutoComplete/UsernameAutoComplete.js';
 const Option = Select.Option;
 
@@ -230,7 +231,7 @@ class MemberList extends Component {
             </Col>
           </Row>
         </Modal>
-        <Table columns={columns} dataSource={this.state.userInfo} pagination={false} />
+        <Table columns={columns} dataSource={this.state.userInfo} pagination={false} locale={{emptyText: <ErrMsg type="noMemberInGroup"/>}} />
       </div>
     );
   }

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

@@ -3,6 +3,7 @@ import { Table, Card, Badge, Select, Button, Modal, Row, Col, message, Popconfir
 import PropTypes from 'prop-types';
 import { autobind } from 'core-decorators';
 import { connect } from 'react-redux';
+import ErrMsg from '../../../../components/ErrMsg/ErrMsg.js';
 import { fetchGroupMemberList } from '../../../../reducer/modules/group.js';
 import { getProjectMsg, getProjectMemberList, addMember, delMember, changeMemberRole } from '../../../../reducer/modules/project.js';
 import UsernameAutoComplete from '../../../../components/UsernameAutoComplete/UsernameAutoComplete.js';
@@ -214,9 +215,9 @@ class ProjectMember extends Component {
             </Col>
           </Row>
         </Modal>
-        <Table columns={columns} dataSource={this.state.projectMemberList} pagination={false} />
+        <Table columns={columns} dataSource={this.state.projectMemberList} pagination={false} locale={{emptyText: <ErrMsg type="noMemberInProject"/>}} />
         <Card title={this.state.groupName + ' 分组成员 ' + '(' + this.state.groupMemberList.length + ') 人'} noHovering className="setting-group">
-          {this.state.groupMemberList.map((item, index) => {
+          {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>
@@ -224,7 +225,7 @@ class ProjectMember extends Component {
               {item.role === 'owner' ? <p className="item-role">组长</p> : null}
               {item.role === 'dev' ? <p className="item-role">开发者</p> : null}
             </div>);
-          })}
+          }): <ErrMsg type="noMemberInGroup"/>}
         </Card>
       </div>
     )

client/containers/Project/Setting/ProjectMessage/ProjectMessage.js

@@ -93,6 +93,7 @@ class ProjectMessage extends Component {
         updateProject(assignValue).then((res) => {
           if (res.payload.data.errcode == 0) {
             message.success('修改成功! ');
+            // this.props.history.push('/group');
           } else {
             message.error(res.payload.data.errmsg);
           }
@@ -260,13 +261,14 @@ class ProjectMessage extends Component {
                 rules: [{
                   required: false,
                   whitespace: true,
-                  message: "请输入环境域名",
                   validator(rule, value, callback) {
                     if (value) {
                       if (value.length === 0) {
                         callback('请输入环境域名');
                       } else if (!/\S/.test(value)) {
                         callback('请输入环境域名');
+                      } else if (!/^([a-zA-Z0-9]([a-zA-Z0-9\-]{0,61}[a-zA-Z0-9])?\.)+[a-zA-Z]{2,6}$/.test(value)) {
+                        callback('域名格式错误');
                       } else {
                         return callback();
                       }
@@ -395,11 +397,13 @@ class ProjectMessage extends Component {
             {envSettingItems}
           </FormItem>
 
-          <FormItem {...formItemLayout}>
-            <Button type="dashed" onClick={this.add} style={{ width: '60%' }}>
-              <Icon type="plus" /> 添加环境配置
-            </Button>
-          </FormItem>
+          <Row>
+            <Col sm={{ offset: 6 }} lg={{ offset: 3 }}>
+              <Button type="dashed" onClick={this.add} style={{ width: '60%' }}>
+                <Icon type="plus" /> 添加环境配置
+              </Button>
+            </Col>
+          </Row>
 
           <FormItem
             {...formItemLayout}

client/containers/Project/Setting/Setting.scss

@@ -88,6 +88,25 @@
     background-color: #2395f1;
     line-height: 1rem;
     box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
+    position: relative;
+    &:after {
+      opacity: 0;
+      content: '点击修改';
+      display: block;
+      transition: all .4s;
+      position: absolute;
+      left: 0;
+      top: 0;
+      border-radius: 50%;
+      font-size: .14rem;
+      color: #fff;
+      width: 100%;
+      height: 100%;
+      background-color: rgba(0,0,0, .25);
+    }
+    &:hover:after {
+      opacity: 1;
+    }
   }
 }
 
@@ -116,4 +135,18 @@
     background-color: #2395f1;
     border-radius: 4px;
   }
+  .color {
+    // .ant-radio-button-wrapper {
+    //   &:first-child {
+    //     border: none;
+    //   }
+    // }
+    .ant-radio-button-wrapper-checked {
+      border-radius: 0;
+      &:hover {
+        border: none;
+        box-shadow: none;
+      }
+    }
+  }
 }