yee пре 7 година
родитељ
комит
f668b204d4
2 измењених фајлова са 116 додато и 109 уклоњено
  1. 15 8
      js/component/manageCenter/idea/content.less
  2. 101 101
      js/component/manageCenter/idea/news/news.jsx

+ 15 - 8
js/component/manageCenter/idea/content.less

@@ -60,15 +60,22 @@
 }
 
 .news-modal {
-    .ant-modal-header {
-        display: none
-    }
-    .ant-modal-close {
-        top: 10px;
-    }
     .quill {
-        margin-bottom: 20px;
-        min-height: 400px;
+        margin-top: 40px;
+        margin-bottom: 40px;
+    }
+    .ant-modal-body {
+        padding-bottom: 50px;
+        .modal-box {
+            float: left;
+        }
+        .news-box {
+            float: left;
+            width: 280px;
+            .modal-box-detail {
+                width: 160px;
+            }
+        }
     }
 }
 

+ 101 - 101
js/component/manageCenter/idea/news/news.jsx

@@ -7,9 +7,8 @@ import moment from 'moment';
 import ajax from 'jquery/src/ajax/xhr.js';
 import $ from 'jquery/src/ajax';
 
-var theThis = null;
 function uploadImg(s) {
-    let myform = new FormData(), _me = s;
+    let myform = new FormData();
     myform.append('file', document.getElementById("fileToUpload").files[0]);
     myform.append('sign', 'news_content_picture');
     $.ajax({
@@ -24,16 +23,19 @@ function uploadImg(s) {
                 message.warning(data.error[0].message);
             } else {
                 let theUrl = data.data;
-                const cursorPosition = theThis.quill.getSelection().index
-                theThis.quill.insertText(cursorPosition, '<img src="' + globalConfig.avatarHost + '/upload' + theUrl + '" />')
-                theThis.quill.setSelection(cursorPosition + 1)
+                const cursorPosition = s.quill.getSelection().index
+                s.quill.insertEmbed(cursorPosition, 'image', globalConfig.avatarHost + '/upload' + theUrl)
+                s.quill.setSelection(cursorPosition + 1)
             };
         }
     })
 }
 function fileSelect() {
-    document.getElementById("fileToUpload").click();
-    theThis = this;
+    let uploader = document.getElementById("fileToUpload"), _me = this;
+    uploader.onchange = () => {
+        uploadImg(_me);
+    };
+    uploader.click();
 }
 const Avatar = React.createClass({
     getInitialState() {
@@ -417,114 +419,112 @@ const News = React.createClass({
                             onRowClick={this.tableRowClick} />
                     </Spin>
                 </div>
-                <Modal title="新闻详情" width={600} className="news-modal"
+                <Modal title="新闻详情" width={1000} className="news-modal"
                     visible={this.state.visible}
                     maskClosable={false}
                     footer={null}
-                    afterClose={() => { this.state.RowData = {}; this.state.activeKey = '1'; }}
+                    afterClose={() => { this.state.RowData = {}; }}
                     onCancel={() => { this.setState({ visible: false }) }} >
                     <Spin spinning={this.state.loading}>
-                        <Tabs defaultActiveKey="1"
-                            activeKey={this.state.activeKey || '1'}
-                            onChange={(e) => { this.setState({ activeKey: e }) }}>
-                            <Tabs.TabPane tab="基本内容" key="1">
-                                <div className="modal-box">
-                                    <span className="modal-box-title">新闻标题</span>
-                                    <div className="modal-box-detail">
-                                        <Input value={this.state.RowData.title}
-                                            onChange={(e) => {
-                                                this.state.RowData.title = e.target.value;
-                                                this.setState({ RowData: this.state.RowData });
-                                            }} />
-                                    </div>
+                        <div className="clearfix">
+                            <div className="modal-box">
+                                <span className="modal-box-title">新闻标题</span>
+                                <div className="modal-box-detail">
+                                    <Input value={this.state.RowData.title}
+                                        onChange={(e) => {
+                                            this.state.RowData.title = e.target.value;
+                                            this.setState({ RowData: this.state.RowData });
+                                        }} />
                                 </div>
-                                <div className="modal-box">
-                                    <span className="modal-box-title">标题图片</span>
-                                    <div className="modal-box-detail clearfix">
-                                        <Avatar sign={'news'} visible={this.state.visible}
-                                            imageUrl={this.state.RowData.titleImg ? (globalConfig.avatarHost + "/upload" + this.state.RowData.imgurl) : null}
-                                            urlData={(url) => { this.state.RowData.titleImg = url }} />
-                                    </div>
+                            </div>
+                            <div className="modal-box">
+                                <span className="modal-box-title">简介</span>
+                                <div className="modal-box-detail">
+                                    <Input value={this.state.RowData.summary}
+                                        onChange={(e) => {
+                                            this.state.RowData.summary = e.target.value;
+                                            this.setState({ RowData: this.state.RowData });
+                                        }} />
                                 </div>
-                                <div className="modal-box">
-                                    <span className="modal-box-title">作者</span>
-                                    <div className="modal-box-detail">
-                                        <Input value={this.state.RowData.author}
-                                            onChange={(e) => {
-                                                this.state.RowData.author = e.target.value;
-                                                this.setState({ RowData: this.state.RowData });
-                                            }} />
-                                    </div>
+                            </div>
+                            <div className="modal-box">
+                                <span className="modal-box-title">来源</span>
+                                <div className="modal-box-detail">
+                                    <Input value={this.state.RowData.source}
+                                        onChange={(e) => {
+                                            this.state.RowData.source = e.target.value;
+                                            this.setState({ RowData: this.state.RowData });
+                                        }} />
                                 </div>
-                                <div className="modal-box">
-                                    <span className="modal-box-title">来源</span>
-                                    <div className="modal-box-detail">
-                                        <Input value={this.state.RowData.source}
-                                            onChange={(e) => {
-                                                this.state.RowData.source = e.target.value;
-                                                this.setState({ RowData: this.state.RowData });
-                                            }} />
-                                    </div>
+                            </div>
+                            <div className="modal-box">
+                                <span className="modal-box-title">来源链接</span>
+                                <div className="modal-box-detail">
+                                    <Input value={this.state.RowData.sourceUrl}
+                                        onChange={(e) => {
+                                            this.state.RowData.sourceUrl = e.target.value;
+                                            this.setState({ RowData: this.state.RowData });
+                                        }} />
                                 </div>
-                                <div className="modal-box">
-                                    <span className="modal-box-title">来源链接</span>
-                                    <div className="modal-box-detail">
-                                        <Input value={this.state.RowData.sourceUrl}
-                                            onChange={(e) => {
-                                                this.state.RowData.sourceUrl = e.target.value;
-                                                this.setState({ RowData: this.state.RowData });
-                                            }} />
-                                    </div>
+                            </div>
+                            <div className="modal-box" style={{ position: 'absolute', right: '0', width: '480px' }}>
+                                <span className="modal-box-title">标题图片</span>
+                                <div className="modal-box-detail clearfix" style={{ width: '360px' }}>
+                                    <Avatar sign={'news'} visible={this.state.visible}
+                                        imageUrl={this.state.RowData.titleImg ? (globalConfig.avatarHost + "/upload" + this.state.RowData.imgurl) : null}
+                                        urlData={(url) => { this.state.RowData.titleImg = url }} />
                                 </div>
-                                <div className="modal-box">
-                                    <span className="modal-box-title">发布时间</span>
-                                    <div className="modal-box-detail">
-                                        <DatePicker style={{ width: '120px' }}
-                                            format="YYYY-MM-DD"
-                                            placeholder="选择发布时间"
-                                            value={this.state.RowData.createTimeFormattedDate ? moment(this.state.RowData.createTimeFormattedDate, "YYYY-MM-DD") : undefined}
-                                            onChange={(t, str) => {
-                                                this.state.RowData.createTimeFormattedDate = str;
-                                                this.setState({ RowData: this.state.RowData });
-                                            }} />
-                                    </div>
+                            </div>
+                        </div>
+                        <div className="clearfix">
+                            <div className="modal-box news-box">
+                                <span className="modal-box-title">作者</span>
+                                <div className="modal-box-detail">
+                                    <Input value={this.state.RowData.author}
+                                        onChange={(e) => {
+                                            this.state.RowData.author = e.target.value;
+                                            this.setState({ RowData: this.state.RowData });
+                                        }} />
                                 </div>
-                                <div className="modal-box">
-                                    <span className="modal-box-title">发布在首页</span>
-                                    <div className="modal-box-detail">
-                                        <Radio.Group value={this.state.RowData.hot} onChange={(e) => {
-                                            this.state.RowData.hot = e.target.value;
+                            </div>
+                            <div className="modal-box news-box">
+                                <span className="modal-box-title">发布时间</span>
+                                <div className="modal-box-detail">
+                                    <DatePicker style={{ width: '120px' }}
+                                        format="YYYY-MM-DD"
+                                        placeholder="选择发布时间"
+                                        value={this.state.RowData.createTimeFormattedDate ? moment(this.state.RowData.createTimeFormattedDate, "YYYY-MM-DD") : undefined}
+                                        onChange={(t, str) => {
+                                            this.state.RowData.createTimeFormattedDate = str;
                                             this.setState({ RowData: this.state.RowData });
-                                        }} >
-                                            <Radio value={0}>否</Radio>
-                                            <Radio value={1}>是</Radio>
-                                        </Radio.Group>
-                                    </div>
+                                        }} />
                                 </div>
-                                <div className="modal-box">
-                                    <span className="modal-box-title">简介</span>
-                                    <div className="modal-box-detail">
-                                        <Input value={this.state.RowData.summary}
-                                            onChange={(e) => {
-                                                this.state.RowData.summary = e.target.value;
-                                                this.setState({ RowData: this.state.RowData });
-                                            }} />
-                                    </div>
+                            </div>
+                            <div className="modal-box news-box">
+                                <span className="modal-box-title">发布在首页</span>
+                                <div className="modal-box-detail">
+                                    <Radio.Group value={this.state.RowData.hot} onChange={(e) => {
+                                        this.state.RowData.hot = e.target.value;
+                                        this.setState({ RowData: this.state.RowData });
+                                    }} >
+                                        <Radio value={0}>否</Radio>
+                                        <Radio value={1}>是</Radio>
+                                    </Radio.Group>
                                 </div>
-                            </Tabs.TabPane>
-                            <Tabs.TabPane tab="详情" key="2">
-                                <ReactQuill theme="snow"
-                                    value={this.state.RowData.content}
-                                    modules={modules}
-                                    formats={formats}
-                                    onChange={this.handleRichText} />
-                                <input type="file"
-                                    name="fileToUpload"
-                                    id="fileToUpload"
-                                    style={{ "display": "none" }}
-                                    onChange={() => { uploadImg(modules.toolbar) }} />
-                            </Tabs.TabPane>
-                        </Tabs>
+                            </div>
+                        </div>
+                        <div className="modal-box">
+                            <span className="modal-box-title">新闻内容</span>
+                        </div>
+                        <ReactQuill theme="snow"
+                            value={this.state.RowData.content}
+                            modules={modules}
+                            formats={formats}
+                            onChange={this.handleRichText} />
+                        <input type="file"
+                            name="fileToUpload"
+                            id="fileToUpload"
+                            style={{ "display": "none" }} />
                         <div className="modal-box">
                             <Button type="primary" onClick={this.submit}>提交</Button>
                             <Button type="ghost" onClick={() => { this.setState({ visible: false }) }}>取消</Button>