|
@@ -1,216 +1,165 @@
|
|
|
import React, { PureComponent } from 'react';
|
|
|
import { connect } from 'react-redux';
|
|
|
// import { BrowserRouter, Route,Link } from 'react-router-dom';
|
|
|
-
|
|
|
import { actionCreators } from './store';
|
|
|
-import { message,Tag,Spin } from 'antd';
|
|
|
+import { message, Tag, Spin, Table } from 'antd';
|
|
|
+import Lockbinding from '../../common/lockBinding';
|
|
|
|
|
|
const error = (msg) => {
|
|
|
message.error(msg);
|
|
|
};
|
|
|
|
|
|
class lockDetailPopups extends PureComponent {
|
|
|
-
|
|
|
getTag(productList) {
|
|
|
- if(typeof productList==='undefined'){
|
|
|
+ if (typeof productList === 'undefined') {
|
|
|
return null
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
return (
|
|
|
<>
|
|
|
- {
|
|
|
- productList.map((item,index) => {
|
|
|
- return <Tag color="#886ab5" key={index}>{item}</Tag>
|
|
|
- })
|
|
|
- }
|
|
|
+ {
|
|
|
+ productList.map((item, index) => {
|
|
|
+ return <Tag color="#886ab5" key={index}>{item}</Tag>
|
|
|
+ })
|
|
|
+ }
|
|
|
</>
|
|
|
);
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
|
|
|
render() {
|
|
|
- const {locksotreDetail,loading} = this.props;
|
|
|
+ const { locksotreDetail, loading, columns, data, pagination } = this.props;
|
|
|
let lockDetail2 = locksotreDetail.toJS();
|
|
|
// console.log(lockDetail2)
|
|
|
return (
|
|
|
+
|
|
|
<div className="modal fade" id="lockDetail" role="dialog" aria-hidden="true" data-backdrop="static">
|
|
|
- <div className="modal-dialog modal-xl">
|
|
|
- <div className="modal-content">
|
|
|
- <div className="dialog-sheet">
|
|
|
- <button type="button" className="close" data-dismiss="modal" aria-label="Close">
|
|
|
- <span aria-hidden="true"><i className="fal fa-times"></i></span>
|
|
|
- </button>
|
|
|
- <Spin size="large" spinning={loading} >
|
|
|
- <div className="sheet-box row m-0">
|
|
|
- <div className="sheet-left-panel">
|
|
|
- <div className="sheet-panel-header d-flex justify-content-between mx-4">
|
|
|
- <div>
|
|
|
- <a href="#" data-toggle="tooltip" data-placement="top" title="" data-original-title="上一条记录" className="mr-2 disabled"><i className="far fa-chevron-up"></i></a>
|
|
|
- <a href="#" data-toggle="tooltip" data-placement="top" title="" data-original-title="下一条记录" className="mr-2"><i className="far fa-chevron-down"></i></a>
|
|
|
- <a href="#" data-toggle="tooltip" data-placement="top" title="" data-original-title="新页面打开"><i className="fal fa-external-link"></i></a>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div className="sheet-panel-content">
|
|
|
- <div className="sheet-panel-form slimScroll1 mx-4">
|
|
|
- <div className="form-header mt-3">
|
|
|
- <div className="d-flex justify-content-between"><span className="text-muted">软件锁</span><span className="text-muted">出库于 {lockDetail2.make_day}</span></div>
|
|
|
- <legend>{lockDetail2.key_num}</legend>
|
|
|
- </div>
|
|
|
- <div className="cldform clearfix">
|
|
|
- <div className="cldform-line"></div>
|
|
|
- <div className="cldform-item">
|
|
|
- <div className="cldform-label">锁号</div>
|
|
|
- <div className="cldform-control">
|
|
|
- <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span>{lockDetail2.key_num}</span></div>
|
|
|
+ <div className="modal-dialog modal-xl">
|
|
|
+ <div className="modal-content">
|
|
|
+ <div className="dialog-sheet">
|
|
|
+ <button type="button" className="close" data-dismiss="modal" aria-label="Close">
|
|
|
+ <span aria-hidden="true"><i className="fal fa-times"></i></span>
|
|
|
+ </button>
|
|
|
+ <Spin size="large" spinning={loading} >
|
|
|
+ <div className="sheet-box row m-0">
|
|
|
+ <div className="sheet-left-panel">
|
|
|
+ <div className="sheet-panel-header d-flex justify-content-between mx-4">
|
|
|
+ <div>
|
|
|
+ <a href="#" data-toggle="tooltip" data-placement="top" title="" data-original-title="上一条记录" className="mr-2 disabled"><i className="far fa-chevron-up"></i></a>
|
|
|
+ <a href="#" data-toggle="tooltip" data-placement="top" title="" data-original-title="下一条记录" className="mr-2"><i className="far fa-chevron-down"></i></a>
|
|
|
+ <a href="#" data-toggle="tooltip" data-placement="top" title="" data-original-title="新页面打开"><i className="fal fa-external-link"></i></a>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div className="cldform-line"></div>
|
|
|
- <div className="cldform-item">
|
|
|
- <div className="cldform-label">产品</div>
|
|
|
- <div className="cldform-control">
|
|
|
- {/* <Tag color="#886ab5">{lockDetail2.productList}</Tag> */}
|
|
|
- <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank">{this.getTag(lockDetail2.productList)}</div>
|
|
|
+ <div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div className="cldform-line"></div>
|
|
|
- <div className="cldform-item">
|
|
|
- <div className="cldform-label">期限</div>
|
|
|
- <div className="cldform-control">
|
|
|
- <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span>{lockDetail2.alloted_time}</span></div>
|
|
|
+ <div className="sheet-panel-content">
|
|
|
+ <div className="sheet-panel-form slimScroll1 mx-4">
|
|
|
+ <div className="form-header mt-3">
|
|
|
+ <div className="d-flex justify-content-between"><span className="text-muted">软件锁</span><span className="text-muted">出库于 {lockDetail2.make_day}</span></div>
|
|
|
+ <legend>{lockDetail2.key_num}</legend>
|
|
|
+ </div>
|
|
|
+ <div className="cldform clearfix">
|
|
|
+ <div className="cldform-line"></div>
|
|
|
+ <div className="cldform-item">
|
|
|
+ <div className="cldform-label">锁号</div>
|
|
|
+ <div className="cldform-control">
|
|
|
+ <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span>{lockDetail2.key_num}</span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className="cldform-line"></div>
|
|
|
+ <div className="cldform-item">
|
|
|
+ <div className="cldform-label">产品</div>
|
|
|
+ <div className="cldform-control">
|
|
|
+ {/* <Tag color="#886ab5">{lockDetail2.productList}</Tag> */}
|
|
|
+ <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank">{this.getTag(lockDetail2.productList)}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className="cldform-line"></div>
|
|
|
+ <div className="cldform-item">
|
|
|
+ <div className="cldform-label">期限</div>
|
|
|
+ <div className="cldform-control">
|
|
|
+ <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span>{lockDetail2.alloted_time}</span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className="cldform-line"></div>
|
|
|
+ <div className="cldform-item">
|
|
|
+ <div className="cldform-label">使用状态</div>
|
|
|
+ <div className="cldform-control">
|
|
|
+ <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span>{lockDetail2.statusT}</span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className="cldform-line"></div>
|
|
|
+ <div className="cldform-item">
|
|
|
+ <div className="cldform-label">负责人</div>
|
|
|
+ <div className="cldform-control">
|
|
|
+ <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span><a href="#">@{lockDetail2.responsible}</a></span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className="cldform-line"></div>
|
|
|
+ <div className="cldform-item">
|
|
|
+ <div className="cldform-label">联系人</div>
|
|
|
+ <div className="cldform-control">
|
|
|
+ <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span><a href="#">{lockDetail2.client}</a></span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className="cldform-line"></div>
|
|
|
+ <div className="cldform-item">
|
|
|
+ <div className="cldform-label">公司</div>
|
|
|
+ <div className="cldform-control">
|
|
|
+ <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span><a href="#">珠海纵横创新软件有限公司</a></span></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div className="cldform-line"></div>
|
|
|
- <div className="cldform-item">
|
|
|
- <div className="cldform-label">使用状态</div>
|
|
|
- <div className="cldform-control">
|
|
|
- <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span>{lockDetail2.statusT}</span></div>
|
|
|
+ </div>
|
|
|
+ <div className="sheet-right-panel col p-0">
|
|
|
+ <div className="sheet-panel-tabs mx-4 mt-4">
|
|
|
+ <ul className="nav nav-tabs sheet-nav-tabs" role="tablist">
|
|
|
+ <li className="nav-item"><a className="nav-link active" data-toggle="tab" href="#tab-lserver" role="tab" aria-selected="false">记录内容</a></li>
|
|
|
+ </ul>
|
|
|
+ <div className="tab-content">
|
|
|
+ <div className="tab-pane fade sheet-panel-righttop show active" id="tab-lserver" role="tabpanel" aria-labelledby="tab-server">
|
|
|
+ <div className="slimScrol3">
|
|
|
+ <Table
|
|
|
+ columns={columns.toJS()}
|
|
|
+ dataSource={data.toJS()}
|
|
|
+ pagination={pagination}
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div className="cldform-line"></div>
|
|
|
- <div className="cldform-item">
|
|
|
- <div className="cldform-label">负责人</div>
|
|
|
- <div className="cldform-control">
|
|
|
- <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span><a href="#">@{lockDetail2.responsible}</a></span></div>
|
|
|
+ <div className="sheet-btns mt-3">
|
|
|
+ <a href="#lock-binding" className="btn btn-xs btn-outline-primary" data-toggle="modal" data-target="#lock-binding">借出/销售/赠送</a>
|
|
|
+ <a href="#lokc-update" className="btn btn-xs btn-outline-primary" data-toggle="modal" data-target="#lokc-update">升级</a>
|
|
|
+ <a href="#lokc-replace" className="btn btn-xs btn-outline-primary" data-toggle="modal" data-target="#lokc-replace">更换</a>
|
|
|
+ <a href="#add-retrieve" className="btn btn-xs btn-outline-primary" data-toggle="modal" data-target="#add-retrieve">收回</a>
|
|
|
+ <a href="#add-remark" className="btn btn-xs btn-outline-primary" data-toggle="modal" data-target="#add-remark">备注</a>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div className="cldform-line"></div>
|
|
|
- <div className="cldform-item">
|
|
|
- <div className="cldform-label">联系人</div>
|
|
|
- <div className="cldform-control">
|
|
|
- <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span><a href="#">{lockDetail2.client}</a></span></div>
|
|
|
+ <div className="sheet-panel-record">
|
|
|
+ <ul className="nav nav-tabs nav-tabs-clean sheet-nav-tabs" role="tablist">
|
|
|
+ <li className="nav-item ml-4"><a className="nav-link text-center active" data-toggle="tab" href="#tab-log" role="tab" aria-selected="true">日志</a></li>
|
|
|
+ </ul>
|
|
|
+ <div className="tab-content p-3">
|
|
|
+ <div className="tab-pane fade active show sheet-panel-log" id="tab-log" role="tabpanel" aria-labelledby="tab-log">
|
|
|
+ <div className="slimScrol4">
|
|
|
+ <p><a href="#">@陈特</a> 移除联系人 张三<br /><span className="text-muted">5月5日 14:55</span></p>
|
|
|
+ <p><a href="#">@陈特</a> 绑定联系人 张三<br /><span className="text-muted">5月5日 14:55</span></p>
|
|
|
+ <p><a href="#">@陈特</a> 接收<br /><span className="text-muted">5月5日 14:55</span></p>
|
|
|
+ <p>系统 生成<br /><span className="text-muted">5月5日 14:55</span></p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div className="cldform-line"></div>
|
|
|
- <div className="cldform-item">
|
|
|
- <div className="cldform-label">公司</div>
|
|
|
- <div className="cldform-control">
|
|
|
- <div className="cldform-contarl-box cldform-contarl-textareabox cldform-contarl-blank"><span><a href="#">珠海纵横创新软件有限公司</a></span></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div className="sheet-right-panel col p-0">
|
|
|
- <div className="sheet-panel-tabs mx-4 mt-4">
|
|
|
- <ul className="nav nav-tabs sheet-nav-tabs" role="tablist">
|
|
|
- <li className="nav-item"><a className="nav-link active" data-toggle="tab" href="#tab-lserver" role="tab" aria-selected="false">记录内容</a></li>
|
|
|
- </ul>
|
|
|
- <div className="tab-content">
|
|
|
- <div className="tab-pane fade sheet-panel-righttop show active" id="tab-lserver" role="tabpanel" aria-labelledby="tab-server">
|
|
|
- <div className="slimScrol3">
|
|
|
- {/* <table className="table">
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th className="border-0"></th>
|
|
|
- <th className="border-0">类型/时间</th>
|
|
|
- <th className="border-0">服务内容</th>
|
|
|
- </tr>
|
|
|
- </thead>
|
|
|
- <tr>
|
|
|
- <td width="20">1</td>
|
|
|
- <td width="150">销售 <a href="#">张三</a>
|
|
|
- <br/><span className="text-muted"><a href="#">@陈特</a> 5月5日 14:55</span></td>
|
|
|
- <td><span className="badge badge-primary mr-1">固化清单全功能</span><span className="badge badge-primary mr-1">全国专业</span><span className="badge badge-primary">全国专业(新定额)</span></td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td width="20">2</td>
|
|
|
- <td width="140">借出 <a href="#">张三</a>
|
|
|
- <br/><span className="text-muted"><a href="#">@陈特</a> 5月5日 14:55</span></td>
|
|
|
- <td><span className="badge badge-primary mr-1">固化清单全功能</span><span className="badge badge-primary mr-1">全国专业</span><span className="badge badge-primary">全国专业(新定额)</span></td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td width="20">3</td>
|
|
|
- <td width="140">赠送 <a href="#">张三</a>
|
|
|
- <br/><span className="text-muted"><a href="#">@陈特</a> 5月5日 14:55</span></td>
|
|
|
- <td><span className="badge badge-primary mr-1">固化清单全功能</span><span className="badge badge-primary mr-1">全国专业</span><span className="badge badge-primary">全国专业(新定额)</span></td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td width="20">4</td>
|
|
|
- <td width="140">升级 <a href="#">张三</a>
|
|
|
- <br/><span className="text-muted">系统 5月5日 14:55</span></td>
|
|
|
- <td><span className="badge badge-primary mr-1">固化清单全功能</span><span className="badge badge-primary mr-1">全国专业</span><span className="badge badge-primary">全国专业(新定额)</span></td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td width="20">5</td>
|
|
|
- <td width="140">延期 <a href="#">张三</a>
|
|
|
- <br/><span className="text-muted">系统 5月5日 14:55</span></td>
|
|
|
- <td>由2018-09-10延期至2019-09-10</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td width="20">6</td>
|
|
|
- <td width="140">收回 <a href="#">张三</a>
|
|
|
- <br/><span className="text-muted"><a href="#">@陈特</a> 5月5日 14:55</span></td>
|
|
|
- <td></td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td width="20">7</td>
|
|
|
- <td width="140">更换 <a href="#">张三</a>
|
|
|
- <br/><span className="text-muted"><a href="#">@陈特</a> 5月5日 14:55</span></td>
|
|
|
- <td><a href="#">ZH-03905</a></td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td width="20">8</td>
|
|
|
- <td width="140">备注 <a href="#">张三</a>
|
|
|
- <br/><span className="text-muted"><a href="#">@陈特</a> 5月5日 14:55</span></td>
|
|
|
- <td>备注内容</td>
|
|
|
- </tr>
|
|
|
- </table> */}
|
|
|
- </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div className="sheet-btns mt-3">
|
|
|
- <a href="#lock-binding" className="btn btn-xs btn-outline-primary" data-toggle="modal" data-target="#lock-binding">借出/销售/赠送</a>
|
|
|
- <a href="#lokc-update" className="btn btn-xs btn-outline-primary" data-toggle="modal" data-target="#lokc-update">升级</a>
|
|
|
- <a href="#lokc-replace" className="btn btn-xs btn-outline-primary" data-toggle="modal" data-target="#lokc-replace">更换</a>
|
|
|
- <a href="#add-retrieve" className="btn btn-xs btn-outline-primary" data-toggle="modal" data-target="#add-retrieve">收回</a>
|
|
|
- <a href="#add-remark" className="btn btn-xs btn-outline-primary" data-toggle="modal" data-target="#add-remark">备注</a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div className="sheet-panel-record">
|
|
|
- <ul className="nav nav-tabs nav-tabs-clean sheet-nav-tabs" role="tablist">
|
|
|
- <li className="nav-item ml-4"><a className="nav-link text-center active" data-toggle="tab" href="#tab-log" role="tab" aria-selected="true">日志</a></li>
|
|
|
- </ul>
|
|
|
- <div className="tab-content p-3">
|
|
|
- <div className="tab-pane fade active show sheet-panel-log" id="tab-log" role="tabpanel" aria-labelledby="tab-log">
|
|
|
- <div className="slimScrol4">
|
|
|
- <p><a href="#">@陈特</a> 移除联系人 张三<br/><span className="text-muted">5月5日 14:55</span></p>
|
|
|
- <p><a href="#">@陈特</a> 绑定联系人 张三<br/><span className="text-muted">5月5日 14:55</span></p>
|
|
|
- <p><a href="#">@陈特</a> 接收<br/><span className="text-muted">5月5日 14:55</span></p>
|
|
|
- <p>系统 生成<br/><span className="text-muted">5月5日 14:55</span></p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ </Spin>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </Spin>
|
|
|
</div>
|
|
|
+ <Lockbinding />
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+
|
|
|
);
|
|
|
}
|
|
|
|
|
@@ -228,6 +177,9 @@ const mapStateToProps = (state) => {
|
|
|
return {
|
|
|
locksotreDetail: state.getIn(['popupstock', 'locksotreDetail']),
|
|
|
loading: state.getIn(['popupstock', 'loading']),
|
|
|
+ columns: state.getIn(['popupstock', 'columns']),
|
|
|
+ data: state.getIn(['popupstock', 'data']),
|
|
|
+ pagination: state.getIn(['popupstock', 'pagination']),
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -236,7 +188,8 @@ const mapDispathToProps = (dispatch) => {
|
|
|
handlelockDetailPopups(key) {
|
|
|
// console.log('dndn');
|
|
|
dispatch(actionCreators.changeLoading());
|
|
|
- dispatch(actionCreators.getlocksotreDetail(key,error));
|
|
|
+ dispatch(actionCreators.getlocksotreDetail(key, error));
|
|
|
+ dispatch(actionCreators.getLockService(error));
|
|
|
},
|
|
|
}
|
|
|
}
|