123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566 |
- import React from 'react';
- import { Icon, Modal, message, Spin, Input, Select, DatePicker, Button, Table, Form, Upload } from 'antd';
- import './contract.less';
- import ajax from 'jquery/src/ajax/xhr.js';
- import $ from 'jquery/src/ajax';
- import moment from 'moment';
- import { copyrightStateList } from '../../../dataDic.js';
- import { companySearch, getCopyrightState, getPatentType, getPatentState, gethighTechState, getTechnologyState } from '../../../tools.js';
- const ContractDetailForm = Form.create()(React.createClass({
- getInitialState() {
- return {
- visible: false,
- loading: false,
- stateOption: [],
- stateTable: [],
- contactsOption: [],
- stateColumns: [
- {
- title: '申请状态',
- dataIndex: 'status',
- key: 'status',
- render: (text) => { return getCopyrightState(text) }
- }, {
- title: '处理时间',
- dataIndex: 'recordTimeFormattedDate',
- key: 'recordTimeFormattedDate',
- }, {
- title: '负责人',
- dataIndex: 'principal',
- key: 'principal',
- }, {
- title: '操作人',
- dataIndex: 'operator',
- key: 'operator',
- }, {
- title: '备注',
- dataIndex: 'comment',
- key: 'comment',
- }
- ],
- patentColumns: [
- {
- title: '专利名称',
- dataIndex: 'patentName',
- key: 'patentName'
- }, {
- title: '专利编号',
- dataIndex: 'patentNumber',
- key: 'patentNumber'
- }, {
- title: '专利状态',
- dataIndex: 'patentState',
- key: 'patentName',
- render: text => { return getPatentState(text) },
- }, {
- title: '专利类型',
- dataIndex: 'patentType',
- key: 'patentType',
- render: text => { return getPatentType(text) },
- }, {
- title: '当前操作人',
- dataIndex: 'techPrincipal',
- key: 'techPrincipal'
- }
- ],
- copyrightColumns: [
- {
- title: '软著名称',
- dataIndex: 'copyrightName',
- key: 'copyrightName'
- }, {
- title: '软著编号',
- dataIndex: 'copyrightNumber',
- key: 'copyrightNumber'
- }, {
- title: '软著状态',
- dataIndex: 'copyrightState',
- key: 'copyrightName',
- render: (text) => { return getCopyrightState(text) }
- }, {
- title: '加急天数',
- dataIndex: 'copyrightType',
- key: 'copyrightType',
- render: (text) => {
- switch (text) {
- case 0:
- return '不加急(45个工作日)';
- case 3:
- return '3个工作日';
- case 5:
- return '5个工作日';
- case 10:
- return '6-10个工作日';
- case 15:
- return '11-15个工作日';
- case 20:
- return '16-20个工作日';
- case 25:
- return '21-25个工作日';
- case 30:
- return '26-30个工作日';
- case 35:
- return '31-35个工作日';
- }
- }
- }, {
- title: '当前操作人',
- dataIndex: 'techPrincipal',
- key: 'techPrincipal'
- }
- ],
- highTechColumns: [
- {
- title: '申请年份',
- dataIndex: 'highTechYear',
- key: 'highTechYear'
- }, {
- title: '申请状态',
- dataIndex: 'highTechState',
- key: 'highTechName',
- render: (text) => { return gethighTechState(text) }
- }, {
- title: '证书编号',
- dataIndex: 'highTechType',
- key: 'highTechType',
- }, {
- title: '当前操作人',
- dataIndex: 'techPrincipal',
- key: 'techPrincipal'
- }
- ],
- techProjectColumns: [
- {
- title: '项目名称',
- dataIndex: 'techProjectName',
- key: 'techProjectName'
- }, {
- title: '项目类型',
- dataIndex: 'techProjectCatagory',
- key: 'techProjectCatagory'
- }, {
- title: '项目状态',
- dataIndex: 'techProjectState',
- key: 'techProjectState',
- render: text => { return getTechnologyState(text) }
- }, {
- title: '技术领域',
- dataIndex: 'techProjectField',
- key: 'techProjectField'
- }, {
- title: '当前操作人',
- dataIndex: 'techPrincipal',
- key: 'techPrincipal'
- }
- ]
- };
- },
- componentWillMount() {
- this.loadData();
- this.getContactsList();
- },
- getContactsList(uid) {
- $.ajax({
- method: "get",
- dataType: "json",
- crossDomain: false,
- url: globalConfig.context + "/api/admin/getContacts",
- data: {
- uid: uid || this.props.data.uid
- },
- success: function (data) {
- if (!data.data) {
- if (data.error && data.error.length) {
- message.warning(data.error[0].message);
- return;
- };
- };
- this.setState({
- contactsList: data.data
- });
- }.bind(this),
- });
- },
- loadData(id) {
- this.setState({
- loading: true
- });
- $.when($.ajax({
- method: "get",
- dataType: "json",
- crossDomain: false,
- cache: false,
- url: globalConfig.context + "/api/admin/contract/logs",
- data: {
- id: id || this.props.data.id
- }
- }), $.ajax({
- method: "get",
- dataType: "json",
- crossDomain: false,
- cache: false,
- url: globalConfig.context + "/api/admin/contract/detail",
- data: {
- id: id || this.props.data.id
- }
- })).done((data1, data2) => {
- let _me = this;
- //状态流转table
- this.state.stateTable = [];
- if (data1[0].error && data1[0].error.length) {
- message.warning(data1[0].error[0].message);
- } else {
- data1[0].data.map(function (item, i) {
- _me.state.stateTable.push({
- key: i,
- recordTimeFormattedDate: item.recordTimeFormattedDate,
- status: item.status,
- principal: item.principal,
- operator: item.operator,
- comment: item.comment
- });
- });
- };
- //获取详细数据
- if (!data2[0].data) {
- if (data2[0].error && data2[0].error.length) {
- message.warning(data2[0].error[0].message);
- };
- } else {
- let detailData = data2[0].data;
- this.setState({
- data: detailData
- });
- };
- }).always(function () {
- this.setState({
- loading: false
- });
- }.bind(this));
- },
- loadColumnsData() {
- this.setState({
- loading: true
- });
- $.when($.ajax({
- method: "get",
- dataType: "json",
- crossDomain: false,
- cache: false,
- url: globalConfig.context + "/api/admin/contract/logs",
- data: {
- id: id || this.props.data.id
- }
- }), $.ajax({
- method: "get",
- dataType: "json",
- crossDomain: false,
- cache: false,
- url: globalConfig.context + "/api/admin/getContacts",
- data: {
- uid: uid || this.props.data.uid
- }
- }), $.ajax({
- method: "get",
- dataType: "json",
- crossDomain: false,
- cache: false,
- url: globalConfig.context + "/api/admin/contract/detail",
- data: {
- id: id || this.props.data.id
- }
- })).done(() => {
- }).always(function () {
- this.setState({
- loading: false
- });
- }.bind(this));
- },
- foundHighTech() {
- },
- foundPatent() {
- },
- foundCopyright() {
- },
- foundTechProject() {
- },
- componentWillReceiveProps(nextProps) {
- if (!this.props.visible && nextProps.visible) {
- this.loadData(nextProps.data.id);
- this.getContactsList(nextProps.data.uid);
- };
- },
- handleSubmit(e) {
- e.preventDefault();
- this.props.form.validateFields((err, values) => {
- if (values.status || values.principal || values.recordTime || values.comment) {
- if (!values.status || !values.principal || !values.recordTime) {
- message.warning("请填写完整的状态流转信息!");
- return;
- };
- };
- if (!err) {
- this.props.spinState(true);
- $.ajax({
- method: "POST",
- dataType: "json",
- crossDomain: false,
- url: globalConfig.context + "/api/admin/copyright/modify",
- data: {
- "id": this.props.data.id,
- "contact": values.contact, // 联系人, 1,2,3
- //"copyrightInfo": values.copyrightInfo, // 软著简介,size 0-255
- "copyrightName": values.copyrightName, // 软著名称, size 0-60
- "copyrightNumber": values.copyrightNumber,
- "outsource": values.outsource, // 外包公司, size 0-60
- //"workIssue": values.workIssue, // 派单信息, size 0-128
- "inUrgent": values.inUrgent, // 加急天数,
- "status": values.status, // 状态
- "comment": values.comment, // 备注 size 0-128
- "recordTime": values.recordTime ? values.recordTime.format("YYYY-MM-DD HH:mm:ss") : undefined, // 状态修改时间 yyyy-MM-dd HH:mm:ss
- "principal": values.principal // 负责人id
- }
- }).done(function (data) {
- if (!data.error.length) {
- message.success('保存成功!');
- this.props.clickOk();
- this.props.form.resetFields();
- this.props.spinState(false);
- } else {
- message.warning(data.error[0].message);
- this.props.spinState(false);
- }
- }.bind(this));
- }
- });
- },
- render() {
- const FormItem = Form.Item;
- const { getFieldDecorator } = this.props.form;
- const theData = this.state.data || {};
- const formItemLayout = {
- labelCol: { span: 6 },
- wrapperCol: { span: 18 },
- };
- const _me = this;
- return (
- <Form onSubmit={this.handleSubmit} id="CopyrightDesc-form">
- <div className="clearfix">
- <FormItem className="half-item"
- {...formItemLayout}
- label="公司名称" >
- {getFieldDecorator('unitName')(
- <span>{theData.unitName}</span>
- )}
- </FormItem>
- <FormItem className="half-item"
- {...formItemLayout}
- label="组织机构代码" >
- {getFieldDecorator('orgCode')(
- <span>{theData.orgCode}</span>
- )}
- </FormItem>
- <FormItem className="half-item"
- {...formItemLayout}
- label="公司地址" >
- {getFieldDecorator('address')(
- <span>{theData.address}</span>
- )}
- </FormItem>
- <FormItem className="half-item"
- {...formItemLayout}
- label="联系人" >
- {(() => {
- if (this.state.contactsList && theData.contacts) {
- debugger
- }
- })()}
- </FormItem>
- </div>
- <p style={{ fontSize: '14px', color: '#333' }}>状态流转记录: </p>
- <Table style={{ margin: '10px 0', background: "#eee" }}
- pagination={false}
- dataSource={this.state.stateTable}
- columns={this.state.stateColumns} />
- <div className="clearfix" style={{ padding: '0 4px', paddingTop: '20px', marginBottom: '10px', background: '#eee' }}>
- <FormItem className="half-item"
- {...formItemLayout}
- label="状态流转"
- >
- {getFieldDecorator('status')(
- <Select
- style={{ width: 200 }}
- placeholder="选择一个状态">
- {this.props.statusOption}
- </Select>
- )}
- </FormItem>
- <FormItem className="half-item"
- {...formItemLayout}
- label="处理时间"
- >
- {getFieldDecorator('recordTime')(
- <DatePicker />
- )}
- </FormItem>
- <FormItem className="half-item"
- {...formItemLayout}
- label="负责人"
- >
- {getFieldDecorator('principal')(
- <Select
- showSearch
- style={{ width: 200 }}
- filterOption={companySearch}
- placeholder="选择负责人">
- {this.props.authorOption}
- </Select>
- )}
- </FormItem>
- <FormItem className="half-item"
- {...formItemLayout}
- label="备注">
- {getFieldDecorator('comment')(
- <Input />
- )}
- </FormItem>
- </div>
- <div className="clearfix">
- <FormItem className="half-item"
- {...formItemLayout}
- label="高企申请">
- {getFieldDecorator('cognizanceYear', {
- initialValue: theData.cognizanceYear
- })(
- <span>{theData.cognizanceYear} 年</span>
- )}
- {theData.cognizanceStatus == 1 ? <Button onClick={this.foundHighTech}>创建申请</Button> : <span></span>}
- </FormItem>
- </div>
- <Table size="small" scroll={{ y: 500 }}
- columns={this.state.highTechColumns}
- dataSource={this.state.highTechTableData}
- pagination={false}
- onRowClick={this.tableRowClick} />
- <div className="clearfix">
- <FormItem className="half-item"
- {...formItemLayout}
- label="专利申请">
- {getFieldDecorator('patentNum', {
- initialValue: theData.patentNum
- })(
- <span>{theData.patentNum} 条</span>
- )}
- {theData.patentStatus == 1 ? <Button onClick={this.foundPatent}>创建申请</Button> : <span></span>}
- </FormItem>
- </div>
- <Table size="small" scroll={{ y: 500 }}
- columns={this.state.patentColumns}
- dataSource={this.state.patentTableData}
- pagination={false}
- onRowClick={this.tableRowClick} />
- <div className="clearfix">
- <FormItem className="half-item"
- {...formItemLayout}
- label="软著申请">
- {getFieldDecorator('copyrightNum', {
- initialValue: theData.copyrightNum
- })(
- <span>{theData.copyrightNum} 条</span>
- )}
- {theData.copyrightStatus == 1 ? <Button onClick={this.foundCopyright}>创建申请</Button> : <span></span>}
- </FormItem>
- </div>
- <Table size="small" scroll={{ y: 500 }}
- columns={this.state.copyrightColumns}
- dataSource={this.state.copyrightTableData}
- pagination={false}
- onRowClick={this.tableRowClick} />
- <div className="clearfix">
- <FormItem className="half-item"
- {...formItemLayout}
- label=" 科技项目申请">
- {getFieldDecorator('techProjectNum', {
- initialValue: theData.techProjectNum
- })(
- <span>{theData.techProjectNum} 条</span>
- )}
- {theData.techProjectStatus == 1 ? <Button onClick={this.foundTechProject}>创建申请</Button> : <span></span>}
- </FormItem>
- </div>
- <Table size="small" scroll={{ y: 500 }}
- columns={this.state.techProjectColumns}
- dataSource={this.state.techProjectTableData}
- pagination={false}
- onRowClick={this.tableRowClick} />
- <FormItem style={{ marginTop: '20px' }}>
- <Button className="set-submit" type="primary" htmlType="submit">保存</Button>
- <Button type="ghost" style={{ marginLeft: '20px' }} onClick={this.props.closeModal}>取消</Button>
- </FormItem>
- </Form>
- );
- }
- }));
- const ContractDetail = React.createClass({
- getInitialState() {
- return {
- visible: false,
- loading: false
- };
- },
- componentWillReceiveProps(nextProps) {
- this.state.visible = nextProps.showDesc
- },
- showModal() {
- this.setState({
- visible: true,
- });
- },
- handleOk() {
- this.setState({
- visible: false,
- });
- this.props.closeDesc(false, true);
- },
- handleCancel(e) {
- this.setState({
- visible: false,
- });
- this.props.closeDesc(false);
- },
- spinChange(e) {
- this.setState({
- loading: e
- });
- },
- render() {
- return (
- <div className="patent-addNew">
- <Spin spinning={this.state.loading} className='spin-box'>
- <Modal title="软著详情" visible={this.state.visible}
- onOk={this.handleOk} onCancel={this.handleCancel}
- width='800px'
- footer=''
- >
- <ContractDetailForm
- visible={this.state.visible}
- authorOption={this.props.authorOption}
- statusOption={this.props.statusOption}
- data={this.props.data}
- spinState={this.spinChange}
- closeModal={this.handleCancel}
- clickOk={this.handleOk} />
- </Modal>
- </Spin>
- </div>
- );
- }
- });
- export default ContractDetail;
|