门诊日志+就诊历程结合

src/pages/nurse/Patient/PatientCourse.jsx

@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import { $http } from '../../../containers/config/https';
-import { Table, Steps, Card } from 'antd';
+import { Table, Steps, Card, Spin } from 'antd';
 import PatientInfo from './PatientDetail.jsx';
 import asyncComponent from '../../../routers/AsyncComponent.js';
 import ColumnAuthoritysModel from '../../columnAuthority/ColumnAuthoritysModel';
@@ -30,6 +30,13 @@ class PatientCourse extends Component {
             patID: '',
             current: 0,
             colunmsCode: '',
+            // 图文咨询/线上问诊相关
+            consultationInfo: {},       // 04020007+03100070 返回的预约信息
+            chatMessages: [],           // 02090005 返回的聊天记录
+            chatLoading: false,         // 聊天记录加载状态
+            isVideoConsult: false,      // 是否是视频问诊（预留录频）
+            isConsultStep: false,       // 当前是否是互联网就诊
+            showChat: false,            // 是否显示聊天记录
         }
     }
 
@@ -40,11 +47,29 @@ class PatientCourse extends Component {
         this.loadPatienCourse()
     }
 
+    componentDidUpdate(prevProps) {
+        if (prevProps.admID !== this.props.admID && this.props.admID) {
+            this.loadPatienCourse()
+        }
+    }
+
     loadPatienCourse = () => {
-        //04040015{
+        // 清空旧数据
+        this.setState({
+            patient: [],
+            data: [],
+            columns: [],
+            component: '',
+            current: 0,
+            colunmsCode: '',
+            isConsultStep: false,
+        });
+        const admID = this.props.admID ? this.props.admID : (patientData.admID ? patientData.admID : this.state.admID);
+
+        // 调用 04040015 获取患者历程步骤
         let data = {
             params: [{
-                admID: this.props.admID ? this.props.admID : (patientData.admID ? patientData.admID : this.state.admID),
+                admID: admID,
                 cbEventID: '',
                 course: "course",
             }]
@@ -64,6 +89,34 @@ class PatientCourse extends Component {
                 }
             }
         })
+
+        // 调用 04020007 获取 admTypeDesc，判断是否是互联网就诊
+        let userData = JSON.parse(sessionStorage.userData || '{}');
+        let infoData = {
+            params: [{
+                admID: admID,
+                hospID: userData.hospID || '',
+            }]
+        }
+        $http.post('urlDeault', this, {
+            code: "04020007",
+            data: infoData,
+            success: (res) => {
+                if (res.errorCode == '0' && res.result) {
+                    const admTypeDesc = res.result.admInfo?.admTypeDesc || '';
+                    const isInternet = admTypeDesc === '互联网';
+                    this.setState({
+                        consultationInfo: res.result.admInfo || {},
+                        isConsultStep: isInternet,
+                    }, () => {
+                        if (isInternet) {
+                            this.loadConsultationInfo();
+                            this.loadChatMessages();
+                        }
+                    });
+                }
+            }
+        });
     }
 
     loadCheckInfo = () => {
@@ -88,16 +141,84 @@ class PatientCourse extends Component {
         })
     }
 
+    // 加载图文咨询/线上问诊预约信息 (03100070) - 只获取 symptom
+    loadConsultationInfo = () => {
+        let admID = this.props.admID ? this.props.admID : patientData.admID;
+        let data = {
+            params: [{
+                admID: admID,
+            }]
+        }
+        $http.post('urlDeault', this, {
+            code: "03100070",
+            data: data,
+            success: (res) => {
+                if (res.errorCode == '0') {
+                    this.setState({
+                        // 只更新 symptom，其他字段（admDate, admTime, admTypeDesc）来自 04020007
+                        consultationInfo: {
+                            ...this.state.consultationInfo,
+                            symptom: res.result?.symptom || '',
+                        },
+                        isVideoConsult: res.result?.admType === '线上问诊',
+                    });
+                }
+            }
+        });
+    }
+
+    // 加载聊天记录 (02090005)
+    loadChatMessages = () => {
+        let userData = JSON.parse(sessionStorage.userData || '{}');
+        let admID = this.props.admID ? this.props.admID : patientData.admID;
+        let data = {
+            params: [{
+                admID: admID,
+                frUser: 'user' + (userData.userID || ''),
+                toUser: 'patient' + (this.props.patID || patientData.patID || ''),
+                lastMsgID: ''
+            }]
+        }
+        this.setState({ chatLoading: true, chatMessages: [] });
+        $http.post("urlS", this, {
+            code: "02090005",
+            data: data,
+            namespace: "HIS",
+            success: (res) => {
+                if (+res.errorCode === 0) {
+                    // 只取 msgType 为 "1" 的消息，避免重复
+                    const msgData = res.result?.msgData?.filter(item => item.msgType === '1') || [];
+                    this.setState({
+                        chatMessages: msgData,
+                        chatLoading: false,
+                    });
+                } else {
+                    this.setState({ chatMessages: [], chatLoading: false });
+                }
+            },
+            error: () => {
+                this.setState({ chatMessages: [], chatLoading: false });
+            }
+        });
+    }
+
+    // 点击聊天记录入口
+    showChatRecord = () => {
+        // 如果还没有加载聊天记录，先加载
+        if (this.state.chatMessages.length === 0 && !this.state.chatLoading) {
+            this.loadChatMessages();
+        }
+        this.setState({ showChat: true });
+    }
+
     selectCourseDetail(item) {
         let { code, date, nextPrograme, colunmsCode, component } = item;
-        var flag = true
-        if (code == this.state.stateCode) {
-            flag = false
-        }
+
         if (component != '') {
             this.setState({
                 component: component,
                 stateCode: code,
+                showChat: false,  // 点击步骤时隐藏聊天记录
             })
         } else {
             this.setState({
@@ -105,6 +226,7 @@ class PatientCourse extends Component {
                 startDate: date,
                 component: component,
                 nextPrograme: nextPrograme,
+                showChat: false,  // 点击步骤时隐藏聊天记录
             }, () => {
                 if (colunmsCode != '') this.getDetailTableColumns(colunmsCode)
             })
@@ -186,6 +308,7 @@ class PatientCourse extends Component {
     }
 
     render() {
+        const { consultationInfo, isConsultStep } = this.state;
         let patientCourse = []
         this.state.patient && this.state.patient.map((item, index) => {
             patientCourse.push(
@@ -217,39 +340,135 @@ class PatientCourse extends Component {
                 <PatientInfo admID={(this.props.admID) && (!Util.isEmpty(this.props.admID)) ? this.props.admID : this.state.admID} />
                 <div style={{ width: '100%', height: 'calc(100% - 45px)' }}>
                     <Card className="course" >
-                        <div style={{ width: '100%', height: '100%' }}>
+                        <div style={{ width: '100%', height: '100%', overflow: 'auto' }}>
+                            {/* 聊天记录入口 - 放在 Steps 上方 */}
+                            <div
+                                onClick={() => this.showChatRecord()}
+                                style={{
+                                    padding: '10px 12px',
+                                    cursor: 'pointer',
+                                    background: this.state.showChat ? '#e6f7ff' : '#fafafa',
+                                    border: this.state.showChat ? '1px solid #1890ff' : '1px solid #d9d9d9',
+                                    borderRadius: 4,
+                                    marginBottom: 8,
+                                    fontSize: 13,
+                                    display: 'flex',
+                                    alignItems: 'center',
+                                    justifyContent: 'space-between'
+                                }}
+                            >
+                                <span style={{ color: this.state.showChat ? '#1890ff' : '#333', fontWeight: this.state.showChat ? 500 : 400 }}>
+                                    聊天记录
+                                </span>
+                                <span style={{ color: '#999', fontSize: 12 }}>
+                                    {this.state.chatMessages.length > 0 ? `${this.state.chatMessages.length} 条` : ''}
+                                </span>
+                            </div>
+                            {/* 步骤列表 */}
                             <Steps direction="vertical" size="small" onChange={this.ChangeCurrent} current={this.state.current}>
                                 {patientCourse}
                             </Steps>
                         </div>
                     </Card>
                     <div className="courseInfo">
-                        {this.state.component != '' ? <Component admID={this.props.admID} patID={this.props.patID} /> : (
-                            <div style={{ width: '100%', height: '100%', overflow: 'hidden' }}>
-                                <div style={{ width: '100%', height: 'calc(100% - 45px)', overflow: 'hidden' }} className="coursetable">
-                                    <Table
-                                        style={{ width: '100%', "padding": "5px" }}
-                                        dataSource={this.state.data}
-                                        columns={this.state.columns}
-                                        rowClassName="editable-row"
-                                        bordered
-                                        pagination={false}
-                                        onHeaderRow={column => {
-                                            return {
-                                                onDoubleClick: () => {
-                                                    this.columnRef.onOpenModel();
-                                                }
-                                            };
-                                        }
-                                        }
-                                        scroll={{ y: 'calc(100% - 45px)', x: this.state.tableWidth }}
-                                    />
+                        {/* showChat 为 true：显示聊天记录 */}
+                        {this.state.showChat ? (
+                            <div style={{ width: '100%', height: '100%', overflow: 'hidden', display: 'flex', flexDirection: 'column', padding: '0 8px 8px 0' }}>
+                                {/* 顶部预约信息（互联网患者显示） */}
+                                {this.state.isConsultStep && (
+                                    <div style={{ padding: '8px 12px', background: '#fafafa', border: '1px solid #e8e8e8', borderRadius: 4, marginBottom: 8, flexShrink: 0 }}>
+                                        <div style={{ display: 'flex', gap: 24, fontSize: 13, flexWrap: 'wrap' }}>
+                                            <div>
+                                                <span style={{ color: '#999' }}>预约时间：</span>
+                                                <span>{consultationInfo?.admDate || '--'} {consultationInfo?.admTime || ''}</span>
+                                            </div>
+                                            <div>
+                                                <span style={{ color: '#999' }}>就诊类型：</span>
+                                                <span>{consultationInfo?.admTypeDesc || '--'}</span>
+                                            </div>
+                                            <div>
+                                                <span style={{ color: '#999' }}>病情描述：</span>
+                                                <span>{consultationInfo?.symptom || '--'}</span>
+                                            </div>
+                                        </div>
+                                    </div>
+                                )}
+
+                                {/* 线上问诊预留录频播放区域 */}
+                                {this.state.isVideoConsult && (
+                                    <div style={{ height: 60, background: '#f5f5f5', borderRadius: 4, display: 'flex', alignItems: 'center', justifyContent: 'center', color: '#999', marginBottom: 8, flexShrink: 0 }}>
+                                        录频文件播放区域（待后台接口提供）
+                                    </div>
+                                )}
+
+                                {/* 聊天记录区域 - 气泡样式 */}
+                                <div style={{ flex: 1, overflow: 'auto', background: '#fff', border: '1px solid #e8e8e8', borderRadius: 4, padding: 12 }}>
+                                    <div style={{ marginBottom: 8, color: '#333', fontWeight: 500 }}>聊天记录</div>
+                                    <Spin spinning={this.state.chatLoading}>
+                                        {this.state.chatMessages.length > 0 ? (
+                                            <div style={{ display: 'flex', flexDirection: 'column', gap: 12 }}>
+                                                {this.state.chatMessages.map((msg, index) => {
+                                                    // direction: right=医生发送(蓝色), left=患者发送(灰色)
+                                                    const isSent = msg.direction === 'right';
+                                                    return (
+                                                        <div key={index} style={{
+                                                            display: 'flex',
+                                                            flexDirection: 'column',
+                                                            alignItems: isSent ? 'flex-end' : 'flex-start'
+                                                        }}>
+                                                            <div style={{
+                                                                padding: '10px 14px',
+                                                                background: isSent ? '#1890ff' : '#f5f5f5',
+                                                                color: isSent ? '#fff' : '#333',
+                                                                borderRadius: isSent ? '16px 16px 4px 16px' : '16px 16px 16px 4px',
+                                                                maxWidth: '70%',
+                                                                wordBreak: 'break-all',
+                                                            }}>
+                                                                {msg.consultText || '(图片/语音消息)'}
+                                                            </div>
+                                                            <span style={{ fontSize: 11, color: '#999', marginTop: 4 }}>
+                                                                {isSent ? '我' : '患者'} {msg.sendTime || ''}
+                                                            </span>
+                                                        </div>
+                                                    );
+                                                })}
+                                            </div>
+                                        ) : (
+                                            <div style={{ padding: 40, textAlign: 'center', color: '#999' }}>
+                                                {this.state.chatLoading ? '加载中...' : '暂无聊天记录'}
+                                            </div>
+                                        )}
+                                    </Spin>
                                 </div>
                             </div>
+                        ) : this.state.component != '' ? (
+                            /* 外部组件（诊断、医嘱等） */
+                            <Component admID={this.props.admID} patID={this.props.patID} />
+                        ) : (
+                            /* 原有表格展示 */
+                            <div style={{ width: '100%', height: '100%', overflow: 'hidden' }} className="coursetable">
+                                <Table
+                                    style={{ width: '100%', "padding": "5px" }}
+                                    dataSource={this.state.data}
+                                    columns={this.state.columns}
+                                    rowClassName="editable-row"
+                                    bordered
+                                    pagination={false}
+                                    onHeaderRow={column => {
+                                        return {
+                                            onDoubleClick: () => {
+                                                this.columnRef.onOpenModel();
+                                            }
+                                        };
+                                    }
+                                    }
+                                    scroll={{ y: 'calc(100% - 45px)', x: this.state.tableWidth }}
+                                />
+                            </div>
                         )}
                     </div>
                 </div>
-            </ div>
+            </div>
         )
     }
 };

src/pages/outdoctor/OutPaitentLog.jsx

@@ -16,6 +16,7 @@ import CommonPagination from 'components/pagination/index';
 import CardTypeRead from 'components/cardType/index';
 import RecordCompoent from '../nurse/MedicalRecord/RecordCompoent';
 import ShowMedicalRecordModal from 'pages/workstation/component/ShowMedicalRecordModal';
+import PatientCourseInfo from 'pages/nurse/Patient/PatientCourseInfo.jsx';
 
 const FormItem = Form.Item;
 const Option = Select.Option;
@@ -188,6 +189,10 @@ const OutPaitentLog = Form.create()(
       this.childConsumeSome = ref
     }
 
+    onPatientCourseRef = (ref) => {
+      this.childPatientCourse = ref
+    }
+
     //查看病历
     handleMedicalRecord = (e, row) => {
       this.childConsumeSome.showModal(row)
@@ -862,19 +867,25 @@ const OutPaitentLog = Form.create()(
       this.setState({ visibleCard: true })
     }
 
-    // 查看病历
-    modifyEMRModal = (visible, record, e) => {
+    // 查看历程
+    showCourseModal = (record, e) => {
       React.$stopPropagation(e);
-      if (visible && !(record && record.admID)) {
+      if (!record || !record.admID) {
         message.error('就诊ID不存在，请稍后重试！');
         return;
       }
-      this.setState({ emrVisible: visible, emrAdmID: record?.admID || '', rowData: record });
+      window.sessionStorage.setItem("patientData", JSON.stringify({
+        admID: record.admID,
+        patID: record.patID,
+      }));
+      if (this.childPatientCourse) {
+        this.childPatientCourse.showModal(record.admID, record.patID);
+      }
     }
 
     render() {
       const { getFieldDecorator } = this.props.form;
-      const { searchLoading, localArr, statusAll, doctorArr, exportLoading, widthTotal, columns, dateFrom, dateTo, regTitle, visibleCard, emrVisible, emrAdmID } = this.state;
+      const { searchLoading, localArr, statusAll, doctorArr, exportLoading, widthTotal, columns, dateFrom, dateTo, regTitle, visibleCard, courseVisible } = this.state;
       const mesIcon = <Icon type="exclamation-circle" />
       // let dateFrom = moment().format('YYYY-MM-DD')
       // let dateTo = moment().format('YYYY-MM-DD')
@@ -908,7 +919,7 @@ const OutPaitentLog = Form.create()(
         key: 'operation',
         render: (text, record) => (
           <div>
-            <span className="span" onClick={(e) => this.modifyEMRModal(true, record, e)}>查看病历</span>
+            <span className="span" onClick={(e) => this.showCourseModal(record, e)}>查看历程</span>
           </div>
         ),
       };
@@ -1266,19 +1277,10 @@ const OutPaitentLog = Form.create()(
             ></RecordCompoent>
           </Card>
 
-          {/* 查看病历 */}
-          {emrVisible ? <ShowMedicalRecordModal
-            admTypeCode="O"
-            prCont="N"
-            initTemplate="N"
-            modalTitle="查看病历"
-            isOperable={false}
-            isBasicOperation="hidden"
-            isShow={emrVisible}
-            historyAdmID={emrAdmID}
-            rowData={this.state.rowData}
-            onHide={() => this.modifyEMRModal(false, {}, {})}
-          /> : ''}
+          {/* 查看历程 */}
+          <PatientCourseInfo
+            onRef={this.onPatientCourseRef}
+          />
         </div>
       )
     }