修改分时段bug

UI/src/pages/sellmanage/msgComponent.js

@@ -53,7 +53,7 @@ class MsgComponent extends React.Component {
             imgSelect: "",
             mediaId: "",
             mouseOver: false,
-            chooseKey:"",
+            chooseKey: "",
             mediaIdText: mediaIdText,
             mediaIdNews: mediaIdNews,
             mediaIdMini: mediaIdMini,
@@ -76,16 +76,17 @@ class MsgComponent extends React.Component {
             isShowLink: false,
             linkText: '',
             linkUrl: '',
-            msgId:'',
-            mediaId:"",
-            thumbMediaId:"",
-            selectKeysProps:"",
-            imgInitialization:false,
-            _ID:""
+            msgId: '',
+            mediaId: "",
+            thumbMediaId: "",
+            selectKeysProps: "",
+            imgInitialization: false,
+            _ID: "",
+            anyKes: false
         };
     }
 
-    
+
     // 图片上传完成
     onFileChange(file) {
         //延时，避免后台图片未处理完成，就请求后台
@@ -119,7 +120,7 @@ class MsgComponent extends React.Component {
             });
         }, 1500);
     }
-    
+
     //上传图片之前验证大小
     beforeUpload = (file) => {
         console.log(file.size);
@@ -132,7 +133,7 @@ class MsgComponent extends React.Component {
     };
     //点击 上传图片/重新上传
     upload1 = () => {
-        
+
         // if (this.state.chooseKey == 'text') {
         //     this.setState({
         //         imageVisiable: true,
@@ -216,7 +217,7 @@ class MsgComponent extends React.Component {
         this.setState({
             mediaId: item.mediaId,
             selectIndex: i,
-            imgSelect:item.localUrl,
+            imgSelect: item.localUrl,
             // imgSelect: item.localUrl == null ? 'http://img01.store.sogou.com/net/a/04/link?appid=100520029&url=' + item.materialUrl : item.localUrl
         });
     };
@@ -343,82 +344,88 @@ class MsgComponent extends React.Component {
     };
     componentDidMount() {
         let self = this;
-        self.setState({ chooseKey:self.props.chooseKey, _ID:self.props.mediaId }, () => { self.loadImgs()});
+        self.setState({ chooseKey: self.props.chooseKey, _ID: self.props.mediaId }, () => { self.loadImgs() });
         //隐藏表情弹框
         document.addEventListener('click', () => {
             self.setState({
                 isShowFace: false,
             })
         });
-
-       
     }
-    
-  //生命周期
-  componentWillReceiveProps(nextProps) {
-      console.log(nextProps);
-    if(!nextProps.type){
-        this.setState({ chooseKey:nextProps.chooseKey , _ID : nextProps.mediaId ? nextProps.mediaId : null})
-    }
-    if(nextProps.mediaId){
-        this.loadImgs();
-    } else {
-        this.setState({ 
-            imgUrlText:"",
-            imgUrlNews:"",
-            imgUrlMini:"",
-         })
+    componentWillReceiveProps(nextProps) {
+        //   console.log(nextProps);
+        if (!nextProps.type && nextProps.mediaId && nextProps.chooseKey == nextProps.cutextKey) {
+            this.setState({ anyKes:nextProps.cutextKey,chooseKey: nextProps.chooseKey, _ID:nextProps.mediaId ? nextProps.mediaId : null }, () => { this.loadImgs()})
+        } else {
+            this.setState({
+                imgUrlText:"",
+                imgUrlNews:"",
+                imgUrlMini:"",
+            })
+        }
+        // if (nextProps.mediaId && nextProps.mediaId != null && nextProps.chooseKey == nextProps.cutextKey) {
+        //     // this.loadImgs();
+        // } else {
+        //     // console.log("cuo wu");
+        //     // this.setState({
+        //     //     imgUrlText:"",
+        //     //     imgUrlNews:"",
+        //     //     imgUrlMini:"",
+        //     // })
+        // }
+
+        // let self = this;
+        // if (!util.object.equal(nextProps.msgId, this.state.msgId)) {
+        //     self.setState({ msgId: nextProps.msgId }, () => { self.loadImgs()});
+        // }
+
     }
-       
-    // let self = this;
-    // if (!util.object.equal(nextProps.msgId, this.state.msgId)) {
-    //     self.setState({ msgId: nextProps.msgId }, () => { self.loadImgs()});
-    // }
-
-  }
-  onFinish = e => {
-    e.preventDefault();
-    this.props.form.validateFieldsAndScroll((errors, values) => {
-        console.log('Success:', errors,values);
-      if (errors) {
-        return
-      }
-    //   this.props.bottomFriom(values);
-    })
-    
-  };
-  loadImgs(){
-    let self = this;
-    // let mediaId = '';
-    // if (self.state.chooseKey == 'text') {
-    //     mediaId = self.state.mediaId;
-    // } else if (self.state.chooseKey == 'news') {
-    //     mediaId = self.state.mediaId;
-    // } else if (self.state.chooseKey == 'miniprogrampage') {
-    //     mediaId = self.state.thumbMediaId;
-    // }
-    let mediaId = ''
-    mediaId = self.state._ID
-    if (mediaId && mediaId != '') {
-        //设置图片显示
-        if (mediaId != '') {
-            request({
-                url: WXMpAPI + "/wx/material/" + self.props.wxAppIdValue + "/getItemByMaterialId?materialId=" + mediaId,
-                method: "post",
-            }).then(function (res) {
-                if (res.success == 1) {
-                    if (self.state.chooseKey == 'text') {
-                         self.setState({ imgUrlText:res.result.localUrl })
-                    } else if (self.state.chooseKey == 'news') {
-                        self.setState({ imgUrlNews: res.result.localUrl }) //imgUrlNews = res.result.localUrl;
-                    } else if (self.state.chooseKey == 'miniprogrampage') { 
-                        self.setState({ imgUrlMini: res.result.localUrl }) //imgUrlMini = res.result.localUrl;
+    onFinish = e => {
+        e.preventDefault();
+        this.props.form.validateFieldsAndScroll((errors, values) => {
+            console.log('Success:', errors, values);
+            if (errors) {
+                return
+            }
+            //   this.props.bottomFriom(values);
+        })
+
+    };
+    loadImgs() {
+        let self = this;
+        // let mediaId = '';
+        // if (self.state.chooseKey == 'text') {
+        //     mediaId = self.state.mediaId;
+        // } else if (self.state.chooseKey == 'news') {
+        //     mediaId = self.state.mediaId;
+        // } else if (self.state.chooseKey == 'miniprogrampage') {
+        //     mediaId = self.state.thumbMediaId;
+        // }
+        let mediaId = ''
+        mediaId = self.state._ID
+        if (mediaId && mediaId != '') {
+            //设置图片显示
+            if (mediaId != '') {
+                request({
+                    url: WXMpAPI + "/wx/material/" + self.props.wxAppIdValue + "/getItemByMaterialId?materialId=" + mediaId,
+                    method: "post",
+                }).then(function (res) {
+                    if (res.success == 1) {
+                        if (self.state.chooseKey == 'text') {
+                            console.log("我是text")
+                            self.setState({ imgUrlText: res.result.localUrl })
+                        } else if (self.state.chooseKey == 'news') {
+                            console.log("我是news")
+                            self.setState({ imgUrlNews: res.result.localUrl }) //imgUrlNews = res.result.localUrl;
+                        } else if (self.state.chooseKey == 'miniprogrampage') {
+                            console.log("我是miniprogrampage")
+                            self.setState({ imgUrlMini: res.result.localUrl }) //imgUrlMini = res.result.localUrl;
+                        }
                     }
-                } 
-            });
-        };
+                });
+            };
+        }
     }
-  }
 
     //添加粉丝昵称
     addfansName = () => {
@@ -428,7 +435,7 @@ class MsgComponent extends React.Component {
         }
     }
     addfansNameToTitle = () => {
-        let title = this.props.form.getFieldValue('title') ? this.props.form.getFieldValue('title') :"";
+        let title = this.props.form.getFieldValue('title') ? this.props.form.getFieldValue('title') : "";
         this.props.form.setFieldsValue({ title: title + '|$fansName$|' });
     }
     //点击 -添加表情
@@ -511,11 +518,32 @@ class MsgComponent extends React.Component {
     }
     //tabs切换事件
     tabChange = (key) => {
-
+    //  if (key != this.state.anyKes) {
+    //     //  console
+    //     if(this.state.anyKes == "text" ){
+    //         this.setState({ 
+    //             imgUrlNews:"",
+    //             imgUrlMini:""
+    //         })
+    //     }
+    //     if(this.state.anyKes == "news" ){
+    //         this.setState({ 
+    //             imgUrlText:"",
+    //             imgUrlMini:""
+    //         })
+    //     }
+    //     if(this.state.anyKes == "miniprogrampage" ){
+    //         this.setState({ 
+    //             imgUrlText:"",
+    //             imgUrlNews:""
+    //         })
+    //     }
+    //  }
+      
     }
     render() {
         let self = this;
-        
+
 
         let SsoToken = util.auth.getToken();
 
@@ -583,40 +611,41 @@ class MsgComponent extends React.Component {
          * end
          */
         let imgUrlText = self.state.imgUrlText;
-        if (imgUrlText) { 
+        if (imgUrlText) {
             let imgSeperator = "?";
-            if(imgUrlText.indexOf("?") !== -1 ) imgSeperator = "&";
-            if(imgUrlText.indexOf("&") !== -1 ) imgSeperator = "&";
+            if (imgUrlText.indexOf("?") !== -1) imgSeperator = "&";
+            if (imgUrlText.indexOf("&") !== -1) imgSeperator = "&";
 
-            imgUrlText = imgUrlText + imgSeperator + 'Sso-Token=' + SsoToken ;
+            imgUrlText = imgUrlText + imgSeperator + 'Sso-Token=' + SsoToken;
         }
 
         let imgUrlNews = self.state.imgUrlNews;
-        if (imgUrlNews) { 
+        if (imgUrlNews) {
             let imgSeperator = "?";
-            if(imgUrlNews.indexOf("?") !== -1 ) imgSeperator = "&";
-            if(imgUrlNews.indexOf("&") !== -1 ) imgSeperator = "&";
+            if (imgUrlNews.indexOf("?") !== -1) imgSeperator = "&";
+            if (imgUrlNews.indexOf("&") !== -1) imgSeperator = "&";
 
-            imgUrlNews = imgUrlNews + imgSeperator + 'Sso-Token=' + SsoToken ;
+            imgUrlNews = imgUrlNews + imgSeperator + 'Sso-Token=' + SsoToken;
         }
 
         let imgUrlMini = self.state.imgUrlMini;
-        if (imgUrlMini) { 
+        if (imgUrlMini) {
             let imgSeperator = "?";
-            if(imgUrlMini.indexOf("?") !== -1 ) imgSeperator = "&";
-            if(imgUrlMini.indexOf("&") !== -1 ) imgSeperator = "&";
-            imgUrlMini = imgUrlMini.indexOf('Sso-Token') > -1 ? imgUrlMini: imgUrlMini + imgSeperator + 'Sso-Token=' + SsoToken ;
+            if (imgUrlMini.indexOf("?") !== -1) imgSeperator = "&";
+            if (imgUrlMini.indexOf("&") !== -1) imgSeperator = "&";
+            imgUrlMini = imgUrlMini.indexOf('Sso-Token') > -1 ? imgUrlMini : imgUrlMini + imgSeperator + 'Sso-Token=' + SsoToken;
         }
-        
+
 
         return (
             <div>
-                 {/* <h1>{ self.state.chooseKey }</h1> */}
-                <Tabs activeKey={self.state.chooseKey ? self.state.chooseKey: "text"}
+                {/* <h1>{ self.state.chooseKey }</h1> */}
+
+                <Tabs activeKey={self.state.chooseKey ? self.state.chooseKey : "text"}
                     onChange={key => {
                         self.props.chooseKeyChange(key);
                         this.setState({
-                            chooseKey: key
+                            chooseKey: key,
                         });
                     }}
                     onTabClick={key => this.tabChange(key)}
@@ -670,10 +699,10 @@ class MsgComponent extends React.Component {
                                             <span onClick={this.deleteImg1} style={{ marginLeft: "25px" }}>删除</span>
                                         </div>
                                     </div>
-                                    <div onClick={self.upload1.bind(self)} style={{ display: (this.state.imgUrlText == '') ? "block" : "none",textAlign:"center" , width: "150px", height: "150px", border: "1px solid #D7D7D7", marginLeft: "7px", cursor: "pointer" }}>
+                                    <div onClick={self.upload1.bind(self)} style={{ display: (this.state.imgUrlText == '') ? "block" : "none", textAlign: "center", width: "150px", height: "150px", border: "1px solid #D7D7D7", marginLeft: "7px", cursor: "pointer" }}>
                                         {/* <p style={{ fontSize: "100px"}}>+</p> */}
-                                        <Icon type="plus"  style={{ fontSize: '50px' }}></Icon>
-                                        <p style={{ textAlign: "center", color: "#D7D7D7",  lineHeight: "20px" }}>
+                                        <Icon type="plus" style={{ fontSize: '50px' }}></Icon>
+                                        <p style={{ textAlign: "center", color: "#D7D7D7", lineHeight: "20px" }}>
                                             <div>不添加则不显示</div>
                                             <div>大小限制</div>
                                             <div>300k以下</div>
@@ -685,7 +714,7 @@ class MsgComponent extends React.Component {
                         </Form>
                     </TabPane>
                     <TabPane tab="发送图文" key="news" forceRender={true}>
-                        <Form  {...formItemLayout} layout="horizontal" onFinish= { self.onFinish }>
+                        <Form  {...formItemLayout} layout="horizontal" onFinish={self.onFinish}>
                             <Form.Item label="标题">
                                 {self.props.form.getFieldDecorator('title', { rules: [{ required: true, message: '标题不能为空' }] })
                                     (<Input />)}
@@ -713,10 +742,10 @@ class MsgComponent extends React.Component {
                                             <span onClick={this.deleteImg1} style={{ marginLeft: "25px" }}>删除</span>
                                         </div>
                                     </div>
-                                    <div onClick={this.upload1} style={{ display: (this.state.imgUrlNews == '') ? "block" : "none",textAlign:"center" , width: "150px", height: "150px", border: "1px solid #D7D7D7", marginLeft: "7px", cursor: "pointer" }}>
+                                    <div onClick={this.upload1} style={{ display: (this.state.imgUrlNews == '') ? "block" : "none", textAlign: "center", width: "150px", height: "150px", border: "1px solid #D7D7D7", marginLeft: "7px", cursor: "pointer" }}>
                                         {/* <p style={{ fontSize: "100px"}}>+</p> */}
-                                        <Icon type="plus"  style={{ fontSize: '50px' }}></Icon>
-                                        <p style={{ textAlign: "center", color: "#D7D7D7",lineHeight: "20px" }}>
+                                        <Icon type="plus" style={{ fontSize: '50px' }}></Icon>
+                                        <p style={{ textAlign: "center", color: "#D7D7D7", lineHeight: "20px" }}>
                                             <div>不添加则不显示</div>
                                             <div>大小限制</div>
                                             <div>300k以下</div>
@@ -734,7 +763,7 @@ class MsgComponent extends React.Component {
                     </TabPane>
 
                     <TabPane tab="小程序" key="miniprogrampage" forceRender={true}>
-                        <Form  {...formItemLayout}  layout="horizontal">
+                        <Form  {...formItemLayout} layout="horizontal">
                             <Form.Item label="标题">
                                 {self.props.form.getFieldDecorator('miniAppTitle', { rules: [{ required: true, message: '小程序标题不能为空' }] })
                                     (<Input />)}
@@ -759,9 +788,9 @@ class MsgComponent extends React.Component {
                                             <span onClick={this.deleteImg1} style={{ marginLeft: "25px" }}>删除</span>
                                         </div>
                                     </div>
-                                    <div onClick={this.upload1} style={{ display: (this.state.imgUrlMini == '') ? "block" : "none",textAlign:"center" ,width: "150px", height: "150px", border: "1px solid #D7D7D7", marginLeft: "7px", cursor: "pointer" }}>
-                                        {/* <p style={{ fontSize: "100px"}}>+</p> */} 
-                                        <Icon type="plus"  style={{ fontSize: '50px' }}></Icon>
+                                    <div onClick={this.upload1} style={{ display: (this.state.imgUrlMini == '') ? "block" : "none", textAlign: "center", width: "150px", height: "150px", border: "1px solid #D7D7D7", marginLeft: "7px", cursor: "pointer" }}>
+                                        {/* <p style={{ fontSize: "100px"}}>+</p> */}
+                                        <Icon type="plus" style={{ fontSize: '50px' }}></Icon>
                                         <p style={{ textAlign: "center", color: "#D7D7D7", lineHeight: "20px" }}>
                                             <div>不添加则不显示</div>
                                             <div>大小限制</div>
@@ -819,13 +848,13 @@ class MsgComponent extends React.Component {
                         </div>
                         <div key="" style={{ width: "1050px", display: "flex", flexWrap: "wrap", margin: "0 auto" }}>
                             {data.map((item, i) => {
-                                
-                                if (item.localUrl) { 
+
+                                if (item.localUrl) {
                                     let imgSeperator = "?";
-                                    if(item.localUrl.indexOf("?") !== -1 ) imgSeperator = "&";
-                                    if(item.localUrl.indexOf("&") !== -1 ) imgSeperator = "&";
+                                    if (item.localUrl.indexOf("?") !== -1) imgSeperator = "&";
+                                    if (item.localUrl.indexOf("&") !== -1) imgSeperator = "&";
 
-                                    item.localUrl = item.localUrl + imgSeperator + 'Sso-Token=' + SsoToken ;
+                                    item.localUrl = item.localUrl + imgSeperator + 'Sso-Token=' + SsoToken;
                                 }
                                 if (item.localUrl == null || item.localUrl.trim == '' || item.localUrl.startsWith('http://mm')) {
                                     item.localUrl = 'http://img01.store.sogou.com/net/a/04/link?appid=100520029&url=' + item.materialUrl

UI/src/pages/sellmanage/pushMessage/index.js

@@ -582,14 +582,12 @@ class PushMessage extends React.Component {
               keys ? chooseKey = keys.message && keys.message.msgType : chooseKey = "text"
               let item = self.props.pushMessage.selectKesData.items[self.state.currentState]
               item ? cutextKey = item.message && item.message.msgType : cutextKey = "text"
-              // console.log(keys);
-              // console.log(item);
-              console.log(chooseKey,'-----------');
 
               message1 = self.props.pushMessage.initData.items[self.state.currentState].message;
               message1.content = self.props.pushMessage.initData.items[self.state.currentState].message.content ? 
               self.props.pushMessage.initData.items[self.state.currentState].message.content : this.state.contentValueItem
             }
+            // console.log(message1,'-----message1--()--message1------');
 
             return (
               <div className={styles.connect} style={{ display: (key === self.state.currentState) ? "block" : "none" }}>

UI/src/pages/sellmanage/templateMessage/index.js

@@ -41,6 +41,8 @@ class TemplateMessage extends React.Component {
       PickerTime: "", 
       selectFansKey: false,
       selectTemplate:"",
+      messagePreviewTitle:"",
+      messagePreview:[],
       inputValueList: [
       ]
     }
@@ -196,7 +198,7 @@ class TemplateMessage extends React.Component {
 
     let strJson = {};
     for (let i = 0; i < itemDate.contentValueList.length; i++) {
-      strJson[itemDate.contentValueList[i].lable] = {"prefix": itemDate.contentValueList[i].value, "color": itemDate.contentValueList[i].color, "value": itemDate.contentValueList[i].value };
+      strJson[itemDate.contentValueList[i].lable] = {"prefix": itemDate.contentValueList[i].prefix, "color": itemDate.contentValueList[i].color, "value": itemDate.contentValueList[i].value };
     }
 
     data.appId = this.props.wxAppIdValue;
@@ -375,7 +377,8 @@ class TemplateMessage extends React.Component {
     var URL = self.props.TemplateMessage.Information && self.props.TemplateMessage.Information.result && self.props.TemplateMessage.Information.result.url
     var pagePath = self.props.TemplateMessage.Information && self.props.TemplateMessage.Information.result && self.props.TemplateMessage.Information.result.pagePath
     var miniProgramAppId = self.props.TemplateMessage.Information && self.props.TemplateMessage.Information.result && self.props.TemplateMessage.Information.result.miniProgramAppId
-    var ItemFromMation = self.props.TemplateMessage.Information && self.props.TemplateMessage.Information.result && self.props.TemplateMessage.Information.result.contentValueList
+    var ItemFromMation = self.props.TemplateMessage.Information && self.props.TemplateMessage.Information.result 
+    // console.log(ItemFromMation);
     const formItemLayout = {
       labelCol: {
         xs: { span: 24 },
@@ -485,11 +488,15 @@ class TemplateMessage extends React.Component {
               name: '预览', onClick: function (data) {
                 const item = JSON.parse(data.contentValue);
                 const previewContentValueList = Object.keys(item).map(k=>{
-                  return { lable:k , value:item[k].value }
+                  return { lable:item[k].prefix , value:item[k].value }
                 });
-                console.log(previewContentValueList);
+                // preview
+                console.log(data);
+
                 self.setState({
                   preview: true,
+                  messagePreviewTitle:data.title,
+                  messagePreview:previewContentValueList,
                   previewDate: data
                 })
               }
@@ -551,6 +558,18 @@ class TemplateMessage extends React.Component {
         >
           {/* <p style={{ whiteSpace: "pre-wrap" }}>{this.state.previewDate.example}</p> */}
         {/* <p>{this.state.previewDate.contentValue}</p> */}
+
+        <div className={styles.onlinePreview}> 
+                    <h2>消息预览</h2>
+                    <div>{this.state.messagePreviewTitle}</div>
+                    <div className={styles.fieldList}>
+                    {
+                      this.state.messagePreview.map((item, key) => {
+                        return  <div style={{display:"flex"}}><div className={styles.fieldTitle} style={{minWidth:"100px"}}>{item.lable}</div><div className={styles.fieldItem}>{item.value}</div></div>
+                      })
+                    }
+                    </div>
+              </div>
         </Modal>
         <Modal
           title="扫码粉丝标签"
@@ -654,17 +673,17 @@ class TemplateMessage extends React.Component {
 
               <div className={styles.templateMessageRight}>
 
-              {/* <div className={styles.onlinePreview} style={{ display: ("default" === self.state.size) ? "block" : "none"}}> 
+              <div className={styles.onlinePreview} style={{ display: ("default" === self.state.size) ? "block" : "none"}}> 
                     <h2>消息预览</h2>
-                    <div>{self.state.selectTemplate ? self.state.selectTemplate :"审核结果通知"}</div>
+                    <div>{ ItemFromMation && ItemFromMation.title}</div>
                     <div className={styles.fieldList}>
                     {
-                      ItemFromMation && ItemFromMation.map((item, key) => {
-                        return  <div className={styles.list}><div className={styles.fieldTitle}>{item.prefix}:</div><div className={styles.fieldItem}>{item.value}</div></div>
+                      ItemFromMation && ItemFromMation.contentValueList.map((item, key) => {
+                        return  <div className={styles.list}><div className={styles.fieldTitle} style={{minWidth:"120px"}}>{item.prefix}:</div><div className={styles.fieldItem}>{item.value}</div></div>
                       })
                     }
                     </div>
-              </div> */}
+              </div>
 
                <div className="formContent">
                <Form style={{ display: ("default" === self.state.size) ? "block" : "none"}}>