| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395 | import React from 'react';import $ from 'jquery/src/ajax';import {	Icon,	Modal,	message,	Spin,	Upload,	Input,	Button,	Radio,	Form,	Checkbox,	Cascader,	Row,	Select,    Col} from 'antd';import {  splitUrl} from '@/tools.js';import {provinceSelect } 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 >= 2 ? 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:[],			edit:{},			edits:{}        };    },    loadData(id) {        this.setState({            loading: true        });        $.ajax({            method: "get",            dataType: "json",            crossDomain: false,            url: globalConfig.context +  '/api/admin/news/detail' ,            data: {                id: id            },            success: function (data) {                let thisData = data.data,provice=[];                if (!thisData) {                    if (data.error && data.error.length) {                        message.warning(data.error[0].message);                    };                    thisData = {};				};				let publishPagesArr = [];                let pageList =  thisData.newsPublishs                pageList.map(item=>{					publishPagesArr.push(item.publishPage)				});				let pageK = publishPagesArr.length?publishPagesArr:['web_index','app_policy_index']				provice.push(thisData.provinceId);                this.setState({					id:thisData.id,					data: thisData,					Province:provice,					publishPages:pageK,					auditStatus:thisData.auditStatus,					edit:thisData.content,                    pictureUrl: thisData.titleImg ? splitUrl(thisData.titleImg, ',', globalConfig.avatarHost + '/upload') : []                });            }.bind(this),        }).always(function () {            this.setState({                loading: false            });        }.bind(this));    },    getPictureUrl(e) {        this.setState({ pictureUrl: e });    },    handleSubmit(e,index) {		e.preventDefault();        this.props.form.validateFields((err, values) => {			if((this.state.edit)==undefined||!this.state.edit||(this.state.edit)=='<p><br></p>'){				message.warning('请填写政策正文');				return false;			}            //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) {				// let publishPages =(values.publishPages).join(',')                this.setState({                    loading: true                });                $.ajax({                    method: "post",					dataType: "json",					async:true,                    url: this.props.data.id ? globalConfig.context + '/api/admin/news/updateNews' : globalConfig.context + '/api/admin/news/apply',                    data: {						id: this.props.data.id,						type:values.type,						title: values.title,                        author: values.author,                        titleImg: thePictureUrl.length?thePictureUrl:'',						content:this.state.edit,						hot:values.hot,						source:values.source,						sourceUrl:values.sourceUrl,						keyword:values.keyword,						auditStatus:index,                        summary: values.summary,						provinceId: (values.ProvinceCity)[0],						// publishPages: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));            }        });	},	cancelFun(){		this.props.closeDesc();	},    componentWillMount() {        if (this.props.data.id) {            this.loadData(this.props.data.id);        } else {			this.state.visible=true;			this.state.data = {};			this.state.edit='<p><br></p>';			this.state.pictureUrl = [];			this.state.Province=undefined;			this.setState({				publishPages:['web_index','app_policy_index']			})        };    },    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.visible=true;				this.state.data = {};				this.state.Province=undefined;				this.state.edit='<p><br></p>';				this.state.pictureUrl = [];				this.state.theData={};				this.setState({					publishPages:['web_index','app_policy_index']				})            };			this.props.form.resetFields();        };    },    render() {        const theData = this.state.data || {};        const { getFieldDecorator } = this.props.form;        const FormItem = Form.Item        const formItemLayout = {            labelCol: { span: 6 },            wrapperCol: { span: 12 },		};		const formItemLayouts = {            labelCol: { span: 3 },            wrapperCol: { span: 18 },		};        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('title', {								rules: [ { required: true, message: '此项为必填项!' } ],								initialValue: theData.title							})(<Input placeholder="请输入您的新闻标题" />)}						</FormItem>						<FormItem className="half-item" {...formItemLayout} label="新闻类型">							{getFieldDecorator('type', {								rules: [ { required: true, message: '此项为必填项!' } ],								initialValue: theData.type!=undefined?String(theData.type):theData.type							})(								<Select placeholder="新闻类型">									<Select.Option value="0" >普通新闻</Select.Option>									<Select.Option value="98" >知产百科</Select.Option>									<Select.Option value="99" >技淘观点</Select.Option>                    			</Select>							)}						</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('source', {								rules: [ { required: true, message: '此项为必填项!' } ],								initialValue: theData.source							})(<Input placeholder="请输入新闻来源" />)}						</FormItem>						<FormItem className="half-item" {...formItemLayout} label="来源链接">							{getFieldDecorator('sourceUrl', {								initialValue: theData.sourceUrl							})(<Input placeholder="请输入新闻来源链接" />)}						</FormItem>						<FormItem className="half-item" 							{...formItemLayout}							label="省-市-区"							> 							{getFieldDecorator('ProvinceCity', {								rules: [ { required: true, message: '此项为必填项!' } ],								initialValue: this.state.Province							})(							 <Cascader options={provinceSelect()}   placeholder="选择城市" />							 )}						</FormItem>					</div>					<div className="clearfix">						<FormItem  {...formItemLayouts} label="关键字">							{getFieldDecorator('keyword', {								initialValue: theData.keyword							})(<Input 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('summary', {								rules: [ { required: true, message: '此项为必填项!' } ],								initialValue: theData.summary							})(<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}								uploadUrl={'/api/user/demand/uploadPicture'}								uploadSign={'demand_picture'}								handleRichText={(value) => { this.state.edit = value;  }}								visible={this.state.visible} />						</FormItem>					</div>					<div className="clearfix">						<FormItem labelCol={{ span: 3 }} wrapperCol={{ span: 18 }} label="是否发布">							<span>{theData.releaseStatus?'已发布':'未发布'}</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" disabled>网站新闻首页</Checkbox></Col>										<Col span={6}><Checkbox value="web_tech_service_index">网站申请首页</Checkbox></Col>										<Col span={6}><Checkbox value="app_policy_index" disabled>app新闻首页</Checkbox></Col>										<Col span={6}><Checkbox value="app_tech_service_index">APP科技服务首页</Checkbox></Col>									</Row>								</Checkbox.Group>							)}						</FormItem>					</div> */}					<div className="clearfix">						<FormItem wrapperCol={{ span: 12, offset: 3 }}>						    <Button className="set-submit" type="primary" htmlType="submit">								保存草稿							</Button>							<Button								className="set-submit"								type="ghost"								onClick={(e) => {										this.handleSubmit(e,2)								}}							>								发布新闻							</Button>							<Button className="set-submit" type="ghost" onClick={this.cancelFun}>								取消							</Button>						</FormItem>					</div>				</Spin>			</Form>    		</div>        )    }}));export default NewDetailForm;
 |