添加更新时间展示，排查假死问题用

src/api/index.js

@@ -36,7 +36,7 @@ export const fetchPost = function (code, params, showError = false) {
         'Content-Type': 'application/json',
         // 241 Basic X3N5c3RlbTppcmlz== 
         // 1.6 Basic cHJoaXA6cHJoaXBAMjAyMA==
-        'Authorization': isDev ? 'Basic X3N5c3RlbTppcmlz==' : 'Basic cHJoaXA6cHJoaXBAMjAyMA==', 
+        'Authorization': isDev ? 'Basic X3N5c3RlbTppcmlz==' : 'Basic cHJoaXA6cHJoaXBAMjAyMA==',
         'Access-Control-Allow-Origin': '*',// httpConfig.reqIP
       },
       body: JSON.stringify({
@@ -56,7 +56,7 @@ export const fetchPost = function (code, params, showError = false) {
       }
     }).then((data) => {
       if (data.errorCode != 0) {
-        showError &&  Toast.show({
+        showError && Toast.show({
           icon: 'fail',
           duration: 3000,
           content: data.errorMessage || data.errorCode || '请求出错',
@@ -71,7 +71,7 @@ export const fetchPost = function (code, params, showError = false) {
     });
   });
 };
-//scoket创建
+// scoket创建
 export const initSocket = (obj, getMessage) => {
   if (window.socket) {
     return;
@@ -89,6 +89,7 @@ export const initSocket = (obj, getMessage) => {
   // window.socket = new WebSocket('http://m00.puruiit.cn:10015/socket.io/?type=C&deviceID=8e5604af-99db-47a5-b5e9-465040486690&EIO=4&transport=websocket');
   window.socket.on('connect_timeout', function () {
     console.log('connect_timeout');
+    window.socket.close();
     window.socket = null;
     initSocket(obj, getMessage);
     Toast.show({
@@ -103,6 +104,9 @@ export const initSocket = (obj, getMessage) => {
       duration: 10000,
       content: 'scoket连接出错了' + e,
     });
+    window.socket.close();
+    window.socket = null;
+    initSocket(obj, getMessage);
   });
   //服务器响应消息
   window.socket.on('callNumber', (data) => {
@@ -110,7 +114,7 @@ export const initSocket = (obj, getMessage) => {
     //   duration: 20000,
     //   content: data1.path+data1.voiceFileName,
     // });
-     getMessage && getMessage(data);
+    getMessage && getMessage(data);
   });
   window.socket.on('connect', function () {
     console.log('scoket连接成功');

src/pages/doctorScreen/Index.jsx

@@ -19,20 +19,31 @@ class DoctorScreen extends React.Component {
       reWaitPat: [],
     };
   }
+  static getDerivedStateFromProps(nextProps, prevState) {
+    if (nextProps && 'patList' in nextProps && JSON.stringify(nextProps.patList) !== JSON.stringify(prevState.patList)) {
+      return {
+        patList: JSON.parse(JSON.stringify(nextProps?.patList || [])), // 防止重复渲染
+        callPat: nextProps?.callPat || [],
+        waitPat: initArray(nextProps?.waitPat || [], 7),
+        reWaitPat: initArray(nextProps?.reWaitPat || [], 8),
+      };
+    }
+    return null;
+  }
   componentDidMount() {
-    //this.getQrcSrc('https://www.kimi.com/');
+    // this.getQrcSrc('https://www.kimi.com/');
   }
   componentDidUpdate(prev) {
     if (prev?.userData?.userQrCode != this.props.userData?.userQrCode) {
       this.getQrcSrc(this.props.userData?.userQrCode);
     }
-    if (prev.patList != this.props.patList) {
-      this.setState({
-        callPat: this.props.callPat,
-        waitPat: initArray(this.props.waitPat, 7),
-        reWaitPat: initArray(this.props.reWaitPat, 8),
-      });
-    }
+    // if (prev.patList != this.props.patList) {
+    //   this.setState({
+    //     callPat: this.props.callPat,
+    //     waitPat: initArray(this.props.waitPat, 7),
+    //     reWaitPat: initArray(this.props.reWaitPat, 8),
+    //   });
+    // }
   }
   // 链接转二维码链接
   getQrcSrc = (src) => {
@@ -61,7 +72,7 @@ class DoctorScreen extends React.Component {
             <br /> Opening
           </span>
         </div>
-        <Grid  columns={3} gap={8} className='mt'>
+        <Grid columns={3} gap={8} className='mt'>
           <Grid.Item span={1}>
             <div className='section'>
               <div className='chinese-name big'>{userData.roomDesc || '诊区'}</div>
@@ -75,7 +86,7 @@ class DoctorScreen extends React.Component {
         </Grid>
         <div className='section mt'>
           <Grid columns={23} gap={8}>
-            <Grid.Item span={4} style={{textAlign: 'center'}}>
+            <Grid.Item span={4} style={{ textAlign: 'center' }}>
               <img
                 src={userData.userImage || userImage}
                 className='user-header'
@@ -89,17 +100,17 @@ class DoctorScreen extends React.Component {
             </Grid.Item>
             <Grid.Item span={11}>
               <div className='section section-inner'>
-                <div className='chinese-name'>{userData.userTitleDesc  || '职称'}</div>
+                <div className='chinese-name'>{userData.userTitleDesc || '职称'}</div>
               </div>
             </Grid.Item>
           </Grid>
         </div>
         <div className='section mt'>
-          <Grid  columns={4} gap={16}>
+          <Grid columns={4} gap={16}>
             <Grid.Item span={3}>
               <div className='doctor-profile'>
                 <ScrollTop text={userData.userIntroduce}>
-                  {userData.userIntroduce  || '医生简介：暂无'}
+                  {userData.userIntroduce || '医生简介：暂无'}
                 </ScrollTop>
               </div>
             </Grid.Item>
@@ -115,18 +126,18 @@ class DoctorScreen extends React.Component {
           </Grid>
         </div>
         <div style={{ flex: 1, overflow: 'hidden' }} className='mt'>
-          <div style={{display: 'flex', height: '100%'}}>
-            <div style={{flex: '7', height: '100%', marginRight: '0.8rem'}}>
+          <div style={{ display: 'flex', height: '100%' }}>
+            <div style={{ flex: '7', height: '100%', marginRight: '0.8rem' }}>
               <div className='table section scroll-wrap'>
-                <Grid  columns={1} gap={8}>
+                <Grid columns={1} gap={8}>
                   <Grid.Item span={1}>
                     <div className='table-header'>候诊</div>
                   </Grid.Item>
                 </Grid>
                 {this.state.callPat?.map((item, index) => {
-                  return (<Grid  columns={14} gap={8} key={index} className='mt'>
+                  return (<Grid columns={14} gap={8} key={index} className='mt'>
                     <Grid.Item span={10}>
-                      <div className='table-content'>{ item.patCallNo } {item.patName || '***'}</div>
+                      <div className='table-content'>{item.patCallNo} {item.patName || '***'}</div>
                     </Grid.Item>
                     <Grid.Item span={4}>
                       <div className={'table-content red'}>就诊</div>
@@ -139,23 +150,23 @@ class DoctorScreen extends React.Component {
                     direction='vertical'
                     autoplayInterval={8000}
                     loop={true}
-                    style={{height: '100%'}}
+                    style={{ height: '100%' }}
                     total={this.state.waitPat.length}
                     indicator={false}
                     defaultIndex={1}
                   >
                     {this.state.waitPat.map((patlist, index) => {
-                      return <Swiper.Item key={index} style={{ height: '100%', background: '#fff'}}>
+                      return <Swiper.Item key={index} style={{ height: '100%', background: '#fff' }}>
                         {patlist?.map((item, index) => {
-                          return (<Grid  columns={14} gap={8} key={index} className='mt'>
+                          return (<Grid columns={14} gap={8} key={index} className='mt'>
                             <Grid.Item span={10}>
-                              <div className='table-content'>{item.patCallType} { item.patCallNo } {item.patName || '***'} </div>
+                              <div className='table-content'>{item.patCallType} {item.patCallNo} {item.patName || '***'} </div>
                             </Grid.Item>
                             <Grid.Item span={4}>
                               <div className={
-                                 item.patCallStatusDesc == '待诊'
-                                 ? 'table-content green'
-                                 : item.patCallStatusDesc == '未签'
+                                item.patCallStatusDesc == '待诊'
+                                  ? 'table-content green'
+                                  : item.patCallStatusDesc == '未签'
                                     ? 'table-content yellow'
                                     : 'table-content'
                               }>
@@ -170,41 +181,41 @@ class DoctorScreen extends React.Component {
                 </div>
               </div>
             </div>
-            <div style={{flex: '3', height: '100%'}}>
-            <div className='table section scroll-wrap'>
-              <Grid columns={1} gap={8}>
-                <Grid.Item span={1}>
-                  <div className='table-header'>看报告</div>
-                </Grid.Item>
-              </Grid>
+            <div style={{ flex: '3', height: '100%' }}>
+              <div className='table section scroll-wrap'>
+                <Grid columns={1} gap={8}>
+                  <Grid.Item span={1}>
+                    <div className='table-header'>看报告</div>
+                  </Grid.Item>
+                </Grid>
                 <div className="scroll-content">
-                <Swiper
+                  <Swiper
                     autoplay={true}
                     autoplayInterval={8000}
                     loop={true}
                     direction='vertical'
-                    style={{height: '100%'}}
+                    style={{ height: '100%' }}
                     total={this.state.reWaitPat.length}
                     indicator={false}
                     defaultIndex={1}
                   >
                     {this.state.reWaitPat.map((patlist, index) => {
-                      return <Swiper.Item key={index} style={{ height: '100%',background: '#fff' }}>
-                         {patlist.map((item, index) => {
+                      return <Swiper.Item key={index} style={{ height: '100%', background: '#fff' }}>
+                        {patlist.map((item, index) => {
                           return (<Grid columns={1} gap={8} key={index} className='mt'>
                             <Grid.Item span={1}>
                               <div className='table-content'> {item.patCallNo}{item.patName || '***'}</div>
                             </Grid.Item>
                           </Grid>);
-                          })}
+                        })}
                       </Swiper.Item>;
                     })}
                   </Swiper>
-                <div>
-                 
+                  <div>
+
+                  </div>
                 </div>
               </div>
-              </div>
             </div>
           </div>
         </div>

src/pages/home/Index.jsx

@@ -264,6 +264,7 @@ class Home extends React.Component {
       ],
       roomObjtmp: {},
       patListArea: [],
+      updateTime: '',
     };
   }
   componentDidMount() {
@@ -313,7 +314,7 @@ class Home extends React.Component {
         }, () => {
           this.soundPaly();
         });
-      }else {
+      } else {
         Toast.show({
           duration: 10000,
           content: '播放失败',
@@ -397,11 +398,11 @@ class Home extends React.Component {
     });
   };
   hideLogin = () => {
-     this.setState({
+    this.setState({
       visibleLogin: false,
     });
   };
-  loginInit = async() => {
+  loginInit = async () => {
     let cache = localStorage.getItem('ZZJ-base');
     if (cache) {
       cache = JSON.parse(cache);
@@ -429,14 +430,15 @@ class Home extends React.Component {
         });
         this.setState({
           userData: {
-             ...data?.userData,
-            areaDesc: data.locDesc, // 大屏诊区
-            roomDesc: data.roomDesc, // 诊室
+            ...data?.userData,
+            areaDesc: data?.locDesc || '', // 大屏诊区
+            roomDesc: data?.roomDesc || '', // 诊室
           },
           patList,
-          callPat: data.callMsg.callPat,
-          waitPat: data.callMsg.waitPat,
-          reWaitPat: data.callMsg.reWaitPat,
+          callPat: data?.callMsg?.callPat || [],
+          waitPat: data?.callMsg?.waitPat || [],
+          reWaitPat: data?.callMsg?.reWaitPat || [],
+          updateTime: data?.callMsg?.updateTime || '',
           roomObj: data,
           delayPat: data.delayPat,
           roomObjtmp: roomObjtmp,
@@ -498,20 +500,20 @@ class Home extends React.Component {
       }
     });
   };
-  render () {
+  render() {
     return (
-    <>
-      <div className={ this.state.colorName}>
-        {/* 设备信息配置，选择医院 */}
-        <Login
-          visibleLogin={this.state.visibleLogin}
-          formData={this.state.cache}
-          hideLogin={this.hideLogin}
-          loginInit={this.loginInit}
-          deviceID={this.state.deviceID}
+      <>
+        <div className={this.state.colorName}>
+          {/* 设备信息配置，选择医院 */}
+          <Login
+            visibleLogin={this.state.visibleLogin}
+            formData={this.state.cache}
+            hideLogin={this.hideLogin}
+            loginInit={this.loginInit}
+            deviceID={this.state.deviceID}
           />
-        {this.state.showType == 'doctor'
-          ? <DoctorScreen
+          {this.state.showType == 'doctor'
+            ? <DoctorScreen
               userData={this.state.userData}
               patList={this.state.patList}
               callPat={this.state.callPat}
@@ -519,8 +521,8 @@ class Home extends React.Component {
               reWaitPat={this.state.reWaitPat}
               hosLogo={this.state.hosLogo}
             />
-          : this.state.showType == 'operate'
-            ? <OperateScreen
+            : this.state.showType == 'operate'
+              ? <OperateScreen
                 patList={this.state.waitPat}
                 userData={this.state.userData}
                 hosLogo={this.state.hosLogo}
@@ -532,31 +534,37 @@ class Home extends React.Component {
                   delayPat={this.state.delayPat}
                   hosLogo={this.state.hosLogo}
                 />
-                :< BigScreen
+                : < BigScreen
                   userData={this.state.userData}
                   roomObj={this.state.roomObj}
                   patListArea={this.state.patListArea}
                   delayPat={this.state.delayPat}
                   hosLogo={this.state.hosLogo}
                 />
-        }
-        <span
-          className='bottom-set'
-        >
-          <AntOutline
-            style={{color: this.state.colorName == 'dark-bg' ? '#fff' : '#0D2764', marginLeft: '10px'}}
-            onClick={this.changeSwitch}
-          />
-          <SetOutline
-            onClick={this.openLogin}
-            style={{color: this.state.colorName == 'dark-bg' ? '#fff' : '#0D2764', marginLeft: '10px'}}
-          />
-        </span>
-        <audio controls id="audio"
-          style={{ position: 'fixed', left: '-1000px', top: '100px' }}
-        ></audio>
-      </div>
-    </>
+          }
+          <span
+            className='bottom-set'
+          >
+            {/* 测试用，现在出现的问题就是显示的与实际的数据不符，不知道是没有监听到还是前端拿到了数据没更新 */}
+            {!!(this.state?.updateTime) && (
+              <span style={{ color: this.state.colorName == 'dark-bg' ? '#fff' : '#0D2764', marginLeft: '10px' }}>
+                {this.state?.updateTime || ''}
+              </span>
+            )}
+            <AntOutline
+              style={{ color: this.state.colorName == 'dark-bg' ? '#fff' : '#0D2764', marginLeft: '10px' }}
+              onClick={this.changeSwitch}
+            />
+            <SetOutline
+              onClick={this.openLogin}
+              style={{ color: this.state.colorName == 'dark-bg' ? '#fff' : '#0D2764', marginLeft: '10px' }}
+            />
+          </span>
+          <audio controls id="audio"
+            style={{ position: 'fixed', left: '-1000px', top: '100px' }}
+          ></audio>
+        </div>
+      </>
     );
   }
 }