html

public/react/src/context/EvaluateSuccessEffectDisplay.js

@@ -17,7 +17,16 @@ class EvaluateSuccessEffectDisplay extends Component {
     }
 
     componentDidMount() {
-
+        if (this.props.type == 'html') {
+            const iframe = document.getElementById('_displayIframe')
+            if (iframe && iframe.contentWindow) {
+                iframe.contentWindow.open()
+                iframe.contentWindow.document.write(this.props.iframe_src);
+                iframe.contentWindow.document.close();
+            } else {
+                console.error('not mounted')
+            }
+        }
     }
     hidepicture = () => {
         window.$('#picture_display').hide();
@@ -26,7 +35,7 @@ class EvaluateSuccessEffectDisplay extends Component {
 // qrcode
         // const type = 'image' // 'qrcode'
         const { type, qrcode_str,
-            answer_picture, orignal_picture, user_picture } = this.props;
+            answer_picture, orignal_picture, user_picture, contents } = this.props;
         if (type == 'qrcode') {
             // 单张图片，比如安卓评测完显示qrcode 
             return (
@@ -71,10 +80,14 @@ class EvaluateSuccessEffectDisplay extends Component {
                 <div className="task-popup-content clearfix">
                     <div className="with49" style={{margin: '0 auto'}}>
                         <p className="color-blue font-18 mb20 edu-txt-center">实际输出</p>
-                        <textarea className="output-txt" readonly="" defaultValue={content}></textarea>
+                        <textarea className="output-txt" readonly="" defaultValue={contents}></textarea>
                     </div>
                 </div> 
             )
+        } else if (type == "html") {
+            return (
+                <iframe id="_displayIframe"></iframe>
+            )
         }
 
         /* <div className="with49 fr">
@@ -95,12 +108,17 @@ class EvaluateSuccessEffectDisplay extends Component {
                         height: 100%;
                         box-sizing: border-box;
                     }
+
+                    iframe#_displayIframe {
+                        width: 100%;
+                        height: 100%;
+                    }
                 `}
                 </style>
                 <div className="photo_display">
                     <div className="task-popup">
                         <div className="task-popup-title clearfix">
-                            <h3 className="fl color-grey3">查看效果</h3>
+                            <h3 className="fl color-grey3 mt4">查看效果</h3>
                             <a href="javascript:void(0);" onClick={this.hidepicture} 
                                     data-tip-left="关闭查看效果" className="pop_close fr">
                                 <i className="fa fa-times-circle font-18 link-color-grey mt5"></i>