123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385 |
- import React from 'react';
- import $ from 'jquery/src/ajax';
- import {
- Icon,
- Modal,
- message,
- Spin,
- Upload,
- Input,
- Button,
- Radio,
- Form,
- Checkbox,
- Cascader,
- Row,
- Col
- } from 'antd';
- import { splitUrl} from '@/tools.js';
- import {areaSelect } from '@/NewDicProvinceList';
- import Editors from '@/richTextEditors';
- const PicturesWall = React.createClass({
- getInitialState() {
- return {
- previewVisible: false,
- previewImage: '',
- fileList: [],
- tags: []
- };
- },
- handleCancel() {
- this.setState({ previewVisible: false });
- },
- handlePreview(file) {
- this.setState({
- previewImage: file.url || file.thumbUrl,
- previewVisible: true
- });
- },
- handleChange(info) {
- let fileList = info.fileList;
- this.setState({ fileList });
- this.props.fileList(fileList);
- },
- componentWillReceiveProps(nextProps) {
- this.state.fileList = nextProps.pictureUrl;
- },
- render() {
- const { previewVisible, previewImage, fileList } = this.state;
- const uploadButton = (
- <div>
- <Icon type="plus" />
- <div className="ant-upload-text">点击上传</div>
- </div>
- );
- return (
- <div className="clearfix">
- <Upload
- action={globalConfig.context + '/api/user/demand/uploadPicture'}
- data={{ sign: 'demand_picture'}}
- listType="picture-card"
- fileList={fileList}
- onPreview={this.handlePreview}
- onChange={this.handleChange}
- >
- {fileList.length >= 3 ? null : uploadButton}
- </Upload>
- <Modal maskClosable={false} visible={previewVisible} footer={null} onCancel={this.handleCancel}>
- <img alt="example" style={{ width: '100%' }} src={previewImage} />
- </Modal>
- </div>
- );
- }
- });
-
- const NewDetailForm = Form.create()(React.createClass({
- getInitialState() {
- return {
- visible: false,
- loading: false,
- auditStatus: 0,
- textFileList: [],
- videoFileList: [],
- pictureUrl: [],
- tags:[]
- };
- },
- loadData(id) {
- this.setState({
- loading: true
- });
- $.ajax({
- method: "get",
- dataType: "json",
- crossDomain: false,
- url: globalConfig.context + '/api/user/achievement/achievementDetail' ,
- data: {
- id: id
- },
- success: function (data) {
- let thisData = data.data;
- if (!thisData) {
- if (data.error && data.error.length) {
- message.warning(data.error[0].message);
- };
- thisData = {};
- };
- this.setState({
- id:thisData.id,
- data: thisData,
- publishPages:thisData.publishPages.length?thisData.publishPages:['app_achievement_list','web_achievement_list'],
- auditStatus:thisData.auditStatus,
- pictureUrl: thisData.technicalPictureUrl ? splitUrl(thisData.technicalPictureUrl, ',', globalConfig.avatarHost + '/upload') : []
- });
- }.bind(this),
- }).always(function () {
- this.setState({
- loading: false
- });
- }.bind(this));
- },
- getPictureUrl(e) {
- this.setState({ pictureUrl: e });
- },
- handleSubmit(e,index) {
- e.preventDefault();
- console.log(this.state.edit)
- this.props.form.validateFields((err, values) => {
- //url转化
- let thePictureUrl = [];
- if (this.state.pictureUrl.length) {
- let picArr = [];
- this.state.pictureUrl.map(function (item) {
- if ( item.response && item.response.data && item.response.data.length ){
- picArr.push(item.response.data);
- }
- });
- thePictureUrl = picArr.join(",");
- };
- if (!err) {
- this.setState({
- loading: true
- });
- $.ajax({
- method: "post",
- dataType: "json",
- async:true,
- url: this.props.data.id ? globalConfig.context + '/api/user/achievement/update' : globalConfig.context + '/api/user/achievement/apply',
- data: {
- id: this.props.data.id,
- name: values.name,
- fieldA: values.industryCategory ? values.industryCategory[0] : undefined,
- fieldB: values.industryCategory ? values.industryCategory[1] : undefined,
- dataCategory: values.dataCategory,
- category: values.category,
- technicalPictureUrl: thePictureUrl,
- introduction:values.introduction,
- maturity:values.maturity,
- innovation:values.innovation,
- transferMode:values.transferMode,
- auditStatus:index,
- patentCase: values.patentCase,
- teamDes: values.teamDes,
- parameter: values.parameter,
- boutique: values.boutique,
- isHot:values.isHot,
- publishPages:values.publishPages,
- }
- }).done(function (data) {
- this.setState({
- loading: false
- });
- if (!data.error.length) {
- message.success('操作成功!');
- this.setState({
- visible: false
- });
- this.props.handOk();
- } else {
- message.warning(data.error[0].message);
- }
- }.bind(this));
- }
- });
- },
- submission(e,index){
- this.handleSubmit(e,index);
- $.ajax({
- method: "POST",
- dataType: "json",
- crossDomain: false,
- async:true,
- url: globalConfig.context + "/api/user/achievement/commit",
- data: {
- id: this.state.id,
- }
- }).done(function (data) {
- if (!data.error.length) {
- this.setState({
- loading: false,
- });
- } else {
- message.warning(data.error[0].message);
- };
- }.bind(this));
- },
- cancelFun(){
- this.props.closeDesc();
- },
- componentWillMount() {
- if (this.props.data.id) {
- this.loadData(this.props.data.id);
- } else {
- this.state.data = {};
- this.state.tags = [];
- this.setState({
- publishPages:['app_achievement_list','web_achievement_list']
- })
- };
- },
- componentWillReceiveProps(nextProps) {
- if (!this.props.visible && nextProps.visible) {
- this.state.textFileList = [];
- this.state.videoFileList = [];
- if (nextProps.data.id) {
- this.loadData(nextProps.data.id);
- } else {
- this.state.data = {};
- this.state.pictureUrl = [];
- this.state.theData={};
- this.setState({
- publishPages:['app_achievement_list','web_achievement_list']
- })
- };
- this.props.form.resetFields();
- };
- },
- render() {
- const theData = this.state.data || {};
- const { getFieldDecorator,getFieldsValue } = this.props.form;
- const FormItem = Form.Item
- const formItemLayout = {
- labelCol: { span: 6 },
- wrapperCol: { span: 12 },
- };
- this.state.edit ={};
- return (
- <div className='login'>
- <Form layout="horizontal" onSubmit={(e)=>{this.handleSubmit(e,0)}} id="demand-form">
- <Spin spinning={this.state.loading}>
- <div className="clearfix">
- <FormItem className="half-item" {...formItemLayout} label="标题">
- {getFieldDecorator('name', {
- rules: [ { required: true, message: '此项为必填项!' } ],
- initialValue: theData.name
- })(<Input placeholder="请输入您的新闻标题" />)}
- </FormItem>
- </div>
- <div className="clearfix">
- <FormItem className="half-item" {...formItemLayout} label="热门">
- {getFieldDecorator('hot', {
- rules: [ { required: true, message: '此项为必填项!' } ],
- initialValue: theData.hot
- })(
- <Radio.Group>
- <Radio value={0}>否</Radio>
- <Radio value={1}>是</Radio>
- </Radio.Group>
- )}
- </FormItem>
- <FormItem className="half-item" {...formItemLayout} label="新闻来源">
- {getFieldDecorator('name', {
- rules: [ { required: true, message: '此项为必填项!' } ],
- initialValue: theData.name
- })(<Input placeholder="请输入新闻来源" />)}
- </FormItem>
- <FormItem className="half-item" {...formItemLayout} label="来源链接">
- {getFieldDecorator('url', {
- initialValue: theData.url
- })(<Input placeholder="请输入新闻来源链接" />)}
- </FormItem>
- <FormItem className="half-item"
- {...formItemLayout}
- label="省-市-区"
- >
- {getFieldDecorator('ProvinceCity', {
- rules: [ { required: true, message: '此项为必填项!' } ],
- initialValue: theData.ProvinceCity
- })(
- <Cascader options={areaSelect()} placeholder="选择城市" />
- )}
- </FormItem>
- </div>
- <div className="clearfix">
- <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 18 }} label="新闻图片">
- <PicturesWall
- fileList={this.getPictureUrl}
- pictureUrl={this.state.pictureUrl}
- visible={this.props.visible}
- />
- </FormItem>
- </div>
- <div className="clearfix">
- <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 18 }} label="新闻简介">
- {getFieldDecorator('introduction', {
- rules: [ { required: true, message: '此项为必填项!' } ],
- initialValue: theData.introduction
- })(<Input type="textarea" rows={4} placeholder="输入新闻简介" />)}
- </FormItem>
- </div>
- <div className="clearfix">
- <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 18 }} label={<span><i style={{color:"red",fontSize:14}}> * </i>新闻正文</span>}>
- <Editors textContent={this.state.edit.content}
- uploadUrl={'/api/admin/news/upload'}
- uploadSign={'news_content_picture'}
- handleRichText={(value) => { this.state.edit.content = value; }}
- visible={this.state.visible} />
- </FormItem>
- </div>
-
- {theData.auditInfo&&<div className="clearfix">
- <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 18 }} label="审核信息">
- <span>{theData.auditInfo}</span>
- </FormItem>
- </div>}
- {theData.createTime&&<div className="clearfix">
- <FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 18 }} label="发布时间">
- <span>{theData.createTime}</span>
- </FormItem>
- </div>}
- <div className="clearfix">
- <FormItem className="full-item"
- labelCol={{ span: 3 }}
- wrapperCol={{ span: 18 }} label="发布位置">
- {getFieldDecorator('publishPages', {
- rules: [ { required: false } ],
- initialValue: this.state.publishPages
- })(
- <Checkbox.Group>
- <Row>
- <Col span={6}><Checkbox value="web_index">网站新闻首页</Checkbox></Col>
- <Col span={6}><Checkbox value="web_achievement_main">网站科技服务主页</Checkbox></Col>
- <Col span={6}><Checkbox value="web_achievement_list" disabled>app政策主页</Checkbox></Col>
- <Col span={6}><Checkbox value="app_index">APP科技服务首页</Checkbox></Col>
- </Row>
- </Checkbox.Group>
- )}
- </FormItem>
- </div>
- <div className="clearfix">
- <FormItem wrapperCol={{ span: 12, offset: 3 }}>
- {this.props.data&&!this.props.data.id&&<Button className="set-submit" type="primary" htmlType="submit">
- 保存草稿
- </Button>}
- <Button
- className="set-submit"
- type="ghost"
- onClick={(e) => {
- if(this.props.data.id){
- this.submission(e,1)
- }else{
- this.handleSubmit(e,1)
- }
- }}
- >
- 发布新闻
- </Button>
- <Button className="set-submit" type="ghost" onClick={this.cancelFun}>
- 取消
- </Button>
- </FormItem>
- </div>
- </Spin>
- </Form>
- </div>
- )
- }
- }));
- export default NewDetailForm;
|