[义诊] 根据接诊时间计算目前是否正在接诊并显示

wuhan2020 · Feb 5, 2020 · 100b089 · 100b089
1 parent da013bc
commit 100b089
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 3 deletions.
diff --git a/source/page/Clinic/index.tsx b/source/page/Clinic/index.tsx
@@ -9,12 +9,24 @@ import { Button } from 'boot-cell/source/Form/Button';
 
 import { AuditBar } from '../../component/AuditBar';
 import { clinic, Clinic } from '../../model';
+import { getTimeFromTimeStr } from './time';
 
 interface ClinicListState {
     loading?: boolean;
     noMore?: boolean;
 }
 
+interface FormattedClinic extends Clinic {
+    isLive: boolean | null;
+}
+
+const getIsLive = (startTimeStr:string, endTimeStr:string) => {
+    const now = new Date().getTime();
+    const startTime = getTimeFromTimeStr(startTimeStr).getTime();
+    const endTime = getTimeFromTimeStr(endTimeStr).getTime();
+    return now > startTime && now < endTime;
+}
+
 @observer
 @component({
     tagName: 'clinic-list',
@@ -40,12 +52,13 @@ export class ClinicList extends mixin<{}, ClinicListState>() {
     renderItem = ({
         url,
         name,
+        isLive,
         startTime,
         endTime,
         contacts,
         remark,
         ...rest
-    }: Clinic) => (
+    }: FormattedClinic) => (
         <Card
             className="mx-auto mb-4 mx-sm-1"
             style={{ minWidth: '20rem', maxWidth: '20rem' }}
@@ -60,7 +73,7 @@ export class ClinicList extends mixin<{}, ClinicListState>() {
             }
         >
             <p>
-                每日接诊起止时间：{startTime} ~ {endTime}
+                每日接诊起止时间：{startTime} ~ {endTime} {isLive ? <span>正在接诊</span> : null}
             </p>
             {contacts[0] && (
                 <ol className="list-unstyled">
@@ -81,6 +94,7 @@ export class ClinicList extends mixin<{}, ClinicListState>() {
     );
 
     render(_, { loading, noMore }: ClinicListState) {
+        const formattedClinics = clinic.list.map((c: Clinic)=>({...c, isLive: c.startTime && c.endTime ? getIsLive(c.startTime, c.endTime): null}))
         return (
             <Fragment>
                 <header className="d-flex justify-content-between">
@@ -97,7 +111,7 @@ export class ClinicList extends mixin<{}, ClinicListState>() {
                         cover={loading}
                         className="card-deck justify-content-around"
                     >
-                        {clinic.list.map(this.renderItem)}
+                        {formattedClinics.map(this.renderItem)}
                     </SpinnerBox>
                     <p slot="bottom" className="text-center mt-2">
                         {noMore ? '没有更多数据了' : '加载更多...'}

diff --git a/source/page/Clinic/time.ts b/source/page/Clinic/time.ts
@@ -0,0 +1,15 @@
+// 目前的时间格式为 hh:mm 的 String, 该方法将其转化为当天的该时间
+export const getTimeFromTimeStr = (timeStr:string) => {
+    const [hours, minutes] = timeStr.split(':').map(parseInt)
+    const time = new Date();
+    if(hours){
+        time.setHours(hours);
+    }
+    if(minutes) {
+        time.setMinutes(minutes)
+    }
+    return time;
+}
+
+
+