feat: 接口页面修改状态布局

client/containers/Project/Interface/InterfaceList/Edit.scss

@@ -51,6 +51,10 @@
     margin-right: 7px;
     padding: 0 5px;
   }
+  .ant-select-selection {
+    background-color: transparent;
+    border: none;
+  }
 }
 
 .toolTip .ant-tooltip-inner{

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

@@ -3,13 +3,14 @@ import { connect } from 'react-redux';
 import PropTypes from 'prop-types'
 import axios from 'axios'
 import {
-  Table, Button, Modal, message, Tooltip
+  Table, Button, Modal, message, Tooltip, Select
 } from 'antd';
 import AddInterfaceForm from './AddInterfaceForm';
 import { fetchInterfaceList} from '../../../../reducer/modules/interface.js';
 import { Link } from 'react-router-dom';
 import variable from '../../../../constants/variable';
 import './Edit.scss';
+const Option = Select.Option;
 
 @connect(
   state => {
@@ -99,6 +100,16 @@ class InterfaceList extends Component {
     })
   }
 
+  changeInterfaceStatus = (e) => {
+    console.log(e);
+    // this.props.changeMemberRole({ id, member_uid, role }).then((res) => {
+    //   if (!res.payload.data.errcode) {
+    //     message.success(res.payload.data.errmsg);
+    //     this.reFetchList(); // 添加成功后重新获取分组成员列表
+    //   }
+    // });
+  }
+
   render() {
     let { sortedInfo } = this.state;
     sortedInfo = sortedInfo || {};
@@ -138,11 +149,11 @@ class InterfaceList extends Component {
       key: 'status',
       width: 14,
       render: (item) => {
-        return <div>{item === 'done' ?
-          <span className="tag-status done">已完成</span>
-          :
-          <span className="tag-status undone">未完成</span>
-        }</div>
+        console.log(item);
+        return <Select value={item} className="select" onChange={this.changeInterfaceStatus}>
+          <Option value={'done'}><span className="tag-status done">已完成</span></Option>
+          <Option value={'undone'}><span className="tag-status undone">未完成</span></Option>
+        </Select>
       },
       filters: [{
         text: '已完成',
@@ -169,7 +180,7 @@ class InterfaceList extends Component {
       <div style={{ padding: '24px' }}>
         <h2 className="interface-title" style={{ display: 'inline-block', margin: 0}}>{intername?intername:'全部接口'}</h2>
         <Button style={{float: 'right'}} type="primary" onClick={() => this.setState({ visible: true })}>添加接口</Button>
-        <Table className="table-interfacelist" pagination={false} columns={columns} onChange={this.handleChange} dataSource={data} />
+        <Table className="table-interfacelist"  pagination={false} columns={columns} onChange={this.handleChange} dataSource={data} />
         <Modal
           title="添加接口"
           visible={this.state.visible}

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

@@ -314,7 +314,7 @@ class View extends Component {
           <Col span={18} className="colValue href"><span onClick={() => window.open(location.protocol + '//' + location.hostname + (location.port !== "" ? ":" + location.port : "") + `/mock/${this.props.currProject._id}${this.props.currProject.basepath}${this.props.curData.path}`, '_blank')}>{location.protocol + '//' + location.hostname + (location.port !== "" ? ":" + location.port : "") + `/mock/${this.props.currProject._id}${this.props.currProject.basepath}${this.props.curData.path}`}</span></Col>
         </Row>
         {this.props.curData.desc?
-          <Row className="row">
+          <Row className="row remark">
             <Col span={4} className="colKey">接口备注：</Col>
             <Col span={18} className="colValue" dangerouslySetInnerHTML={{__html: this.props.curData.desc}}></Col>
           </Row>:""}

client/containers/Project/Interface/interface.scss

@@ -173,7 +173,6 @@
     margin-bottom: .16rem;
   }
   .panel-sub {
-    background: rgba(236, 238, 241, 0.67);
     padding: .16rem;
   }
   .ant-radio-button-wrapper-checked {
@@ -190,15 +189,17 @@
   .remark-editor {
     background-color: #fff;
   }
-  table {
-    border-collapse: collapse;
+  .remark {
+    table {
+      border-collapse: collapse;
+    }
+    th {
+      text-align: left;
+    }
+    th, td {
+      border: 1px solid #e9e9e9;
+      padding: 8px;
+    }
+    tr:nth-child(odd){background: rgba(236, 238, 241, 0.67);}
   }
-  th {
-    text-align: left;
-  }
-  th, td {
-    border: 1px solid #e9e9e9;
-    padding: 8px;
-  }
-  tr:nth-child(odd){background: rgba(236, 238, 241, 0.67);}
 }