import React from "react"; import $ from "jquery/src/ajax"; import "react-quill/dist/quill.bubble.css"; import moment from "moment"; import "../authentication/techDemand.less"; import { Form, Icon, Button, Input, Select, Table, message, DatePicker, Modal, Upload, Popconfirm, Cascader, InputNumber, Radio, TimePicker, Tabs, Tag, Row, Col, } from "antd"; import { areaSelect, getProvince } from "@/NewDicProvinceList"; //省市区 import { getGameState, splitUrl, getprovince, getStatuslist, getLvl, beforeUploadFile, getPicPath, } from "@/tools.js"; import Editors from "@/richTextEditors"; import SpinContainer from "../../SpinContainer"; //富文本编辑器 // 上传文件 const PicturesWall = React.createClass({ getInitialState() { return { previewVisible: false, previewImage: "", fileList: this.props.pictureUrl, }; }, getDefaultProps() { return { changeClick: this.modifyChange, }; }, 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; // console.log(nextProps.pictureUrl); }, render() { const { previewVisible, previewImage, fileList } = this.state; // 点击上传 const uploadButton = (
点击上传
); return ( //上传组件
{fileList && fileList.length >= 1 ? null : uploadButton} { this.setState({ previewVisible: false }); }} >
); }, }); //主体 const FirmList = Form.create()( React.createClass({ // 初始化数据 loadData(pageNo) { this.state.data = []; this.setState({ loading: true, page: pageNo, }); //发送请求 $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/news/listNews", data: { pageNo: pageNo || this.state.pagination.current || 1, pageSize: this.state.pagination.pageSize, title: this.state.titleSearch, type: this.state.typeSearch, }, success: function (data) { let theArr = []; if (!data.data || !data.data.list) { if (data.error && data.error.length) { message.warning(data.error[0].message); } } else { for (let i = 0; i < data.data.list.length; i++) { let thisdata = data.data.list[i]; theArr.push({ key: i + 1, id: thisdata.id, title: thisdata.title, publisher: thisdata.publisher, type: thisdata.type, pictureUrl: thisdata.pictureUrl, sort: thisdata.sort, releaseStatus: thisdata.releaseStatus, releaseTimeConvert: thisdata.releaseTimeConvert, status: thisdata.status, content: thisdata.content, }); } this.state.pagination.current = data.data.pageNo; this.state.pagination.total = data.data.totalCount; } this.setState({ dataSource: theArr, pagination: this.state.pagination, }); }.bind(this), }).always( function () { this.setState({ loading: false, }); }.bind(this) ); }, //声明状态 getInitialState() { return { pictureUrl: [], loading: false, flag: true, editorState: null, activeKey: "1", timesArr: [], ProvinceCity: [], ProvinceCityC: [], totalData: { mark: false, }, imgWidth: "width: 200px", logoUrl: [], pagination: { defaultCurrent: 1, defaultPageSize: 10, showQuickJumper: true, pageSize: 10, onChange: function (page) { this.loadData(page); this.setState({ selectedRowKeys: [], }); }.bind(this), showTotal: function (total) { return "共" + total + "条数据"; }, }, //数据类型 columns: [ { title: "序号", dataIndex: "key", key: "key", }, { title: "新闻分类", dataIndex: "type", key: "type", render: (text) => { if (text == 0) { return "官方公告"; } else if (text == 1) { return "政策解读"; } else if (text == 2) { return "高新技术企业"; } else if (text == 3) { return "军工三证"; } }, }, { title: "新闻标题", dataIndex: "title", key: "title", render: (text) => { return text.length >= 8 ? text.substring(0, 8) + "..." : text; }, }, { title: "排序", dataIndex: "sort", key: "sort", }, { title: "是否首页", dataIndex: "status", key: "status", render: (s) => { return s ? ( ) : ( ); }, }, { title: "新闻缩率图", dataIndex: "pictureUrl", key: "pictureUrl", render: (url) => { let path = getPicPath(globalConfig.avatarUploadHost, url); return (
); }, }, { title: "发布状态", dataIndex: "releaseStatus", key: "releaseStatus", render: (text) => { return text ? "是" : "否"; }, }, // { // title: "置顶", // dataIndex: "topNumber", // key: "topNumber", // render: text => { // return text ? "否" : "是"; // } // }, { title: "操作", dataIndex: "operate", key: "operate", render: (text, record, index) => { return (
this.confirm(record.id)} onCancel={this.cancel} okText="是" cancelText="否" >
); }, }, { title: "发布时间", dataIndex: "releaseTimeConvert", key: "releaseTimeConvert", }, ], //数据列表 dataSource: [], }; }, // 新增新闻按钮 add() { this.setState({ editvisible: true, flag: false, }); }, // 推荐置顶 toTop(record, num) { $.ajax({ method: "post", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/news/updateNews", data: { id: record.id, status: num, }, success: function (data) { let theArr = []; if (data.error && data.error.length) { message.warning(data.error[0].message); } else { this.loadData(); } }.bind(this), }).always( function () { this.setState({ loading: false, }); }.bind(this) ); }, //编辑按钮操作 tableRowClick(record) { this.setState({ flag: true, editvisible: true, }); this.edit(record); }, edit(record, index) { this.setState({ editvisible: true, loading: true, }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/news/selectNews", data: { id: record.id, }, success: function (data) { let theArr = []; if (data.error && data.error.length) { message.warning(data.error[0].message); } else { let thisdata = data.data; this.setState({ id: thisdata.id, title: thisdata.title, publisher: thisdata.publisher, type: thisdata.type, sort: thisdata.sort, keywords: thisdata.keywords, editorcontext: thisdata.content, releaseStatus: thisdata.releaseStatus, time: thisdata.releaseTimeConvert ? thisdata.releaseTimeConvert : thisdata.createTimeConvert, }); window.setTimeout(() => { this.setState({ pictureUrl: thisdata.pictureUrl ? splitUrl(thisdata.pictureUrl, ",", globalConfig.avatarUploadHost) : [], }) }, 100); } }.bind(this), }).always( function () { this.setState({ loading: false, }); }.bind(this) ); }, getOrgCodeUrl(e) { this.setState({ pictureUrl: e }); }, // 新增新闻 addNew(flag) { let theorgCodeUrl = []; 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); } }); theorgCodeUrl = picArr.join(","); } else { message.warn("请上传新闻大图") return } this.setState({ loading: true, }); if (this.state.flag) { $.ajax({ method: "post", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/news/updateNews", data: { id: this.state.id, title: this.state.title, publisher: this.state.publisher, type: this.state.type, pictureUrl: theorgCodeUrl, sort: this.state.sort, content: this.state.editorcontext, status: this.state.status, releaseTimes: this.state.time, releaseStatus: flag, keywords: this.state.keywords, }, success: function (data) { this.setState({ loading: false, }); let theArr = []; if (data.error && data.error.length) { message.warning(data.error[0].message); } else { this.loadData(); this.handleCancelEdit(); } }.bind(this), }).always( function () { this.setState({ loading: false, }); }.bind(this) ); } else { $.ajax({ method: "post", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/news/addNews", data: { title: this.state.title, publisher: this.state.publisher, type: this.state.type, pictureUrl: theorgCodeUrl, sort: this.state.sort, content: this.state.editorcontext, releaseStatus: flag, status: 0, releaseTimes: this.state.time, keywords: this.state.keywords, }, success: function (data) { this.setState({ loading: false, }); let theArr = []; if (data.error && data.error.length) { message.warning(data.error[0].message); } else { this.loadData(); this.handleCancelEdit(); } }.bind(this), }).always( function () { this.setState({ loading: false, }); }.bind(this) ); } }, //表单内容改变时候触发 change(key, e, f) { if (f === undefined) { this.state.totalData[key] = e; this.setState({ totalData: this.state.totalData, }); } else if (typeof f === "function") { this.state.totalData[key] = e; this.setState( { totalData: this.state.totalData, }, f ); } }, // 关闭模态框 handleCancelEdit() { this.setState({ editvisible: false, }); this.addReset(); }, //点击大图 maximg(url) { this.setState({ imgeditvisible: true, maximg: url, }); }, componentWillMount() { this.loadData(); }, //确认要删除吗 confirm(id) { $.ajax({ method: "post", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/news/deleteNews", data: { id, }, success: function (data) { let theArr = []; if (data.error && data.error.length) { message.warning(data.error[0].message); } else { this.loadData(); } }.bind(this), }).always( function () { this.setState({ loading: false, }); }.bind(this) ); }, imghandleCancel() { this.setState({ imgeditvisible: false, }); }, //取消删除 cancel() { console.log("我取消删除了"); }, async submitContent() { // 在编辑器获得焦点时按下ctrl+s会执行此方法 // 编辑器内容提交到服务端之前,可直接调用editorState.toHTML()来获取HTML格式的内容 const htmlContent = this.state.editorState.toHTML(); const result = await saveEditorContent(htmlContent); }, //新增框的清零 addReset() { this.setState({ pictureUrl: [], title: undefined, publisher: undefined, type: undefined, sort: undefined, editorcontext: "", time: undefined, keywords: "", }); }, //搜索部分的清零 reset() { this.state.titleSearch = undefined; this.state.typeSearch = undefined; this.loadData(1); }, render() { const FormItem = Form.Item; const rowSelection = { selectedRowKeys: this.state.selectedRowKeys, onChange: (selectedRowKeys, selectedRows) => { this.setState({ selectedRows: selectedRows.slice(-1), selectedRowKeys: selectedRowKeys.slice(-1), }); }, }; let data = this.state.totalData; const { TextArea } = Input; //文本域 const { TabPane } = Tabs; //标签页 const { MonthPicker, RangePicker, WeekPicker } = DatePicker; //日期输入框 const { editorState } = this.state; return (
新闻列表
{ this.setState({ titleSearch: e.target.value }); }} />
{/* 新闻表单 */}
{/* 模块框 */}
{ this.setState({ title: e.target.value, }); }} style={{ width: "240px" }} /> { this.setState({ publisher: e.target.value, }); }} style={{ width: "240px" }} /> { this.setState({ time: f }); // console.log(e, f); }} style={{ width: "240px" }} /> { this.setState({ sort: e.target.value, }); }} style={{ width: "240px" }} />