打印医生签名自动获取

src/components/PreviewBody/index.jsx

@@ -2,75 +2,22 @@ import React, { Component } from "react";
 import style from "./index.less";
 import $ from "jquery";
 import {filterDataArr} from '@utils/tools'
-(function ($) {
-    var opt;
-
-    $.fn.jqprint = function (options) {
-        opt = $.extend({}, $.fn.jqprint.defaults, options);
-
-        var $element = (this instanceof $) ? this : $(this);
-
-        if (opt.operaSupport && $.browser.opera) {
-            var tab = window.open("", "jqPrint-preview");
-            tab.document.open();
-
-            var doc = tab.document;
-        }
-        else {
-            var $iframe = $("<iframe  />");
-
-            if (!opt.debug) { $iframe.css({ position: "absolute", width: "200px", height: "0px", left: "-300px", top: "-300px" }); }
-
-            $iframe.appendTo("body");
-            var doc = $iframe[0].contentWindow.document;
-        }
-
-        if (opt.importCSS) {
-            if ($("link[media=print]").length > 0) {
-                $("link[media=print]").each(function () {
-                    doc.write("<link type='text/css' rel='stylesheet' href='" + $(this).attr("href") + "' media='print' />");
-                });
-            }
-            else {
-                $("link").each(function () {
-                    doc.write("<link type='text/css' rel='stylesheet' href='" + $(this).attr("href") + "' />");
-                });
-            }
-        }
-
-        if (opt.printContainer) { doc.write($element.outer()); }
-        else { $element.each(function () { doc.write($(this).html()); }); }
-
-        doc.close();
-
-        (opt.operaSupport && $.browser.opera ? tab : $iframe[0].contentWindow).focus();
-        setTimeout(function () { (opt.operaSupport && $.browser.opera ? tab : $iframe[0].contentWindow).print(); if (tab) { tab.close(); } }, 1000);
-    }
-
-    $.fn.jqprint.defaults = {
-        debug: false,
-        importCSS: true,
-        printContainer: true,
-        operaSupport: true
-    };
-
-    $.fn.outer = function () {
-        return $($('<div></div>').html(this.clone())).html();
-    }
-})($);
 class PreviewBody extends Component {
     constructor(props) {
         super(props)
         this.state={
             dateTime:"",
         }
-        this.onPrint = this.onPrint.bind(this);
+        this.$content = React.createRef();
         this.normalVal = this.normalVal.bind(this);
         this.getCurrentDate = this.getCurrentDate.bind(this);
     }
     componentDidMount(){
         this.getCurrentDate();
     }
+    componentWillReceiveProps(){
+        this.$content.current.scrollTo(0,0)
+    }
     getCurrentDate(){
         let myDate = new Date();
         let year = myDate.getFullYear();       //获取完整的年份(4位,1970-????)
@@ -79,15 +26,6 @@ class PreviewBody extends Component {
         let date = year+'-'+(mon<10?'0'+mon:mon)+'-'+(day<10?'0'+day:day);
         this.setState({dateTime:date})
     }
-    onPrint() {
-        $("#content").jqprint({
-            debug: false,
-            importCSS: true,
-            printContainer: true,
-            operaSupport: false
-        });
-        this.props.onClose()
-    }
     normalVal(min,max){
         if((min-0) && (max-0)){
             return `正常值: (${min}~${max})`
@@ -116,7 +54,8 @@ class PreviewBody extends Component {
     }
     render() {
         const { show, preInfo, dataJson, dataStr,baseObj } = this.props;
-        return <div className={style['content']}>
+
+        return <div className={style['content']} ref={this.$content}>
             <div style={{ clear: 'both', fontSize: '24px', margin: '0px 0px 30px 0px',textAlign:'center' }}>{preInfo.hospitalName}</div>
             <table className={style['patInfo']} style={{ margin: '0px 15px 30px 0px', borderCollapse: 'collapse', width: "100%",fontSize:'12px' }}>
                 <tr>
@@ -177,12 +116,12 @@ class PreviewBody extends Component {
                                             {
                                                 item.lisExcelItem && item.lisExcelItem.map((value)=>{
                                                     return <tr style={{lineHeight:'1.5',width:'650px'}}>
-                                                        <td style={{width:'23%',fontSize:'12px'}}>{value.itemName}</td>
+                                                        <td style={{width:'25%',fontSize:'12px'}}>{value.itemName}</td>
                                                         <td style={{width:'23%',fontSize:'12px'}}><span className={value.type == 1?'red':null} style={{fontSize:'12px'}}>{value.value}</span> {value.unit}</td>
                                                         <td style={{width:'24%',fontSize:'12px'}}>
                                                             {this.normalVal(value.min,value.max)}
                                                         </td>
-                                                        <td style={{width:'30%',fontSize:'12px'}}>{value.time == ''?('导入时间: '+this.state.dateTime):'化验时间: '+value.time}</td>
+                                                        <td style={{width:'28%',fontSize:'12px'}}>{value.time == ''?('导入时间: '+this.state.dateTime):'化验时间: '+value.time}</td>
                                                     </tr>
                                                 })
                                             }
@@ -199,14 +138,14 @@ class PreviewBody extends Component {
                                                 item.details.map((val)=>{
                                                     if(val.value && val.value != ''){
                                                         return <tr style={{lineHeight:'1.5',width:'100%',fontSize:'12px'}}>
-                                                            <td style={{width:'23%'}}>{val.name}</td>
+                                                            <td style={{width:'25%'}}>{val.name}</td>
                                                             {/* <td style={{width:'23%'}} className={item.abnormal != '0' ?"red":'' }>{val.value} { val.labelSuffix}</td> */}
                                                             {this.showDetails(val)}
                                                             
                                                             <td style={{width:'24%'}}>
                                                                 {this.normalVal(val.minValue,val.maxValue)}
                                                             </td>
-                                                            <td style={{width:'30%'}}>{'化验时间:'+item.time}</td>
+                                                            <td style={{width:'28%'}}>{'化验时间:'+item.time}</td>
                                                         </tr>
                                                     }
                                                 })
@@ -262,10 +201,11 @@ class PreviewBody extends Component {
                     </td>
                 </tr>
             </table>
-            <table className={style.partTtable} style={{ marginTop: '10px',display: show ? 'block' : 'none' }}>
-                <tr className={style.verticalT}>
-                    <td style={{ width: 70, textAlign: 'right',verticalAlign:'top', padding: '0px 5px 16px 0px', fontSize: '14px' }}>签名：</td>
-                    <td style={{ width: '220px',
+            <table className={style.partTtable} style={{ marginTop: '10px',marginBottom:'30px',display: show ? 'block' : 'none' }}>
+                <tr className={`${style.verticalT} ${style.siginNature}`}>
+                    <td style={{ width: 80, textAlign: 'right',verticalAlign:'top', padding: '0px 5px 0 0px', fontSize: '14px' }}>医生签名：</td>
+                    {/* <td style={{ 
+                        width: '220px',
                         height: '60px',
                         textAlign: 'center',
                         lineHeight: '60px',
@@ -273,7 +213,13 @@ class PreviewBody extends Component {
                         color: '#cbc7c7',
                         border: '1px solid #cbc7c7',
                         paddingBottom: '0'
-                    }}>此处签名</td>
+                    }}>此处签名</td> */}
+                    <td style={{
+                      minWidth:'50px',
+                      padding:'0 5px 2px 5px',
+                      borderBottom:'1px solid #333',
+                    }}
+                    >{baseObj?baseObj.doctorName:(JSON.stringify(preInfo) == '{}'?'':preInfo.doctorName)}</td>
                 </tr>
             </table>
         </div>

src/components/PreviewBody/index.less

@@ -4,7 +4,7 @@
       overflow: auto;
       top:120px;
       width: 820px;
-      padding: 0 40px 20px 40px;
+      padding: 0 40px 60px 40px;
     }
 
     .foot{
@@ -78,6 +78,10 @@
       .verticalT {
           vertical-align: top;
       }
+      .siginNature {
+        vertical-align: bottom;
+        float: right;
+      }
       .partTtableList {
           width: 70px;
           text-align: right;