日期区间选择

src/common/components/Calendar/MonthItem/index.less

@@ -1,13 +1,13 @@
 @import "~@less/mixin.less";
 
 .item{
-  display: inline-block;
   width: 42px;
   height: 24px;
   margin: 5px 0 0 5px;
   text-align: center;
   font-size: @font-size-h5;
   line-height: 24px;
+  float: left;
   cursor: pointer;
   vertical-align: middle;
   &.gray{

src/common/components/Calendar/SelectList/index.less

@@ -98,6 +98,7 @@
     background-color: #fff;
     .items{
       font-size: 0;
+      overflow: hidden;
     }
   }
 }

src/common/components/Calendar/Time/index.jsx

@@ -47,7 +47,9 @@ class Time extends React.Component {
     render() {
         return (
             <div className={styles.wrapper}>
-                <input value={this.props.hour} onInput={(e)=>this.handleHourChange(window.parseInt(e.target.value))} />&nbsp;{'时'}&nbsp;<input value={this.props.minute} onInput={(e)=>this.handleMinuteChange(window.parseInt(e.target.value))}/>&nbsp;{'分'}&nbsp;<input value={this.props.second} onInput={(e)=>this.handleSecondChange(window.parseInt(e.target.value))}/>&nbsp;{'秒'}
+                <input className={styles.input} value={this.props.hour} onInput={(e)=>this.handleHourChange(window.parseInt(e.target.value))} />&nbsp;{'时'}&nbsp;
+                <input className={styles.input} value={this.props.minute} onInput={(e)=>this.handleMinuteChange(window.parseInt(e.target.value))}/>&nbsp;{'分'}&nbsp;
+                <input className={styles.input} value={this.props.second} onInput={(e)=>this.handleSecondChange(window.parseInt(e.target.value))}/>&nbsp;{'秒'}
             </div>
         )
     }

src/common/components/Calendar/Time/index.less

@@ -3,7 +3,9 @@
 .wrapper{
   margin-top: 5px;
   text-align: center;
-  input{
+  height: 34px;
+  line-height: 34px;
+  .input{
     width: 40px;
     border: 1px solid @border-color;
     height: 22px;

src/common/components/Calendar/YearItem/index.less

@@ -1,12 +1,13 @@
 @import "~@less/mixin.less";
 
 .item{
-  display: inline-block;
+  float: left;
   width: 60px;
-  height: 15px;
+  height: 20px;
   text-align: center;
   font-size: @font-size-h5;
-  line-height: 15px;
+  line-height: 20px;
+  margin: 3px 0;
   cursor: pointer;
   &.gray{
     color:@gray;

src/common/components/Calendar/index.jsx

@@ -124,7 +124,7 @@ class Calendar extends React.Component {
   }
   render() {
     return (
-      <div className={style.wrapper} style={{ top: this.props.top }}>
+      <div className={style.wrapper} id="calendarDate" style={{ top: this.props.top }}>
         <div className={style.top}>
           <div className={style.year}>
             <YearList select={this.state.year} canSelectFuture={this.props.canSelectFuture} handleChange={(info) => this.handleYearSelect(info)} />

src/common/components/Calendar/index.less

@@ -56,7 +56,7 @@
     line-height: 26px;
     position: absolute;
     right: 5px;
-    bottom: 15px;
+    bottom: 10px;
     box-sizing: border-box;
     color:#1F547E;
     border: 1px solid #b1d2ec;

src/components/AddAssistCheck/index.jsx

@@ -140,7 +140,7 @@ class AddAssistCheck extends React.Component {
   }
   getAssistLabel() {
     const { assistLabel, handleChangeAssistValue, handleChangeDate, isRead, handlePush, winWidth,getInfomation } = this.props;
-    const { visible,activeName,id } = this.state;
+    const { visible,activeName,id,date } = this.state;
     return <ul className={styles.labelWrap} id="datePick">
       {
         assistLabel.map((item, idx) => {
@@ -159,9 +159,9 @@ class AddAssistCheck extends React.Component {
               <i onClick={() => this.handleShowDate(idx)}></i>
               {/*<a href="javascript:void(0);" onClick={() => { this.handleDelClick(idx,item) }}><img src={close} alt="" /></a>*/}
               <span className={styles.closeIcon} id="assiClose" onClick={() => { this.handleDelClick(idx,item) }}></span>
-              <div style={{ display: this.state.date && idx == this.state.active ? "block" : "none", position: "relative" }}>
-                <Calendar isShow={true} handleChange={(info) => { handleChangeDate(info, idx); this.setState({ date: false }) }}></Calendar>
-              </div>
+              {
+                this.state.date && idx == this.state.active ?<Calendar handleChange={(info) => { handleChangeDate(info, idx); this.setState({ date: false }) }} top={30}></Calendar>:null
+              }
             </div>
           <DelToast show={idx==id?visible:false}
                     name={activeName} 

src/components/AssistCheck/index.jsx

@@ -2,14 +2,14 @@ import React from 'react';
 import AddAssistCheck from '../AddAssistCheck';
 import { ItemBox, ConfirmModal, WrapModalContainer } from '@commonComp';
 import styles from './index.less';
-import { getExcelList } from '@store/actions/inspect';
 import Notify from '@commonComp/Notify';
-import store from '@store';
 import $ from 'jquery';
-import { host, prefix } from '@utils/config.js';
 import { isIE, getUrlArgObject } from '@utils/tools.js';
 import { dragBox } from '@utils/drag';
 import WrapModalBodyPac from '../WrapModalBodyPac';
+import { getExcelList } from '@store/actions/inspect';
+import store from '@store';
+import { host, prefix } from '@utils/config.js';
 
 
 // (function ($) {
@@ -48,23 +48,23 @@ class AssistCheck extends React.Component {
           importLis:false
         }
         this.showSlideImport=this.showSlideImport.bind(this)
-        this.handleBindFileApi=this.handleBindFileApi.bind(this)
+        // this.handleBindFileApi=this.handleBindFileApi.bind(this)
         this.checkSystemIpt=this.checkSystemIpt.bind(this)
         this.showInIcss=this.showInIcss.bind(this)
         this.onClose=this.onClose.bind(this)
         this.handleImportExcel=this.handleImportExcel.bind(this)
     } 
-    componentDidMount() {
-      $(document).click((event) => {
-        let searchWrap = $('#importExcelBtn')[0];   // 导入按钮按钮
-        let searchOption = $('#importExcelList')[0];   // 下拉列表
-        if (searchOption) {
-          if(searchWrap != event.target){
-            this.setState({ importLis: false });
-          }
-        }
-      });
-    }
+    // componentDidMount() {
+    //   $(document).click((event) => {
+    //     let searchWrap = $('#importExcelBtns')[0];   // 导入按钮按钮
+    //     let searchOption = $('#importExcelLists')[0];   // 下拉列表
+    //     if (searchOption) {
+    //       if(searchWrap != event.target){
+    //         this.setState({ importLis: false });
+    //       }
+    //     }
+    //   });
+    // }
     handleImportExcel() {
       this.inputRef.click();
     }
@@ -75,74 +75,74 @@ class AssistCheck extends React.Component {
       })
     }
 
-    handleBindFileApi(){
-      const {message} = this.props;
-      var ua = navigator.userAgent;
-      var _isIE = ua.indexOf("MSIE") > -1;
-      if (_isIE) {
-        let version = ua.match(/MSIE ([\d.]+)/)[1];
-        this.setState({
-          ieVersion: version
-        })
-      }
-      $('iframe').bind('load', function () { })
-      const { fetchPushInfos } = this.props;
-      // FileAPI.debug = true
-      $.support.cors = true;
-      const that = this;
-      var choose = document.getElementById('choose');
-      FileAPI.event.on(choose, 'change', function (evt) {
-        var files = FileAPI.getFiles(evt);
-        FileAPI.filterFiles(files, function (file, info) {
-          let name = file.name;
-          // if( name.split('.')[1] == 'xlsx' || name.split('.')[1] == 'xls' ){
-          //     Notify.error('请选择正确的excel表格')
-          //     return false;
-          // }else{
-          //     return true;
-          //   }
-            return true;
-        },
-          function (files, rejected) {
-            if (files.length) {
-              //console.log(files[0])
-              const securityCode = getUrlArgObject("code");
-              const appKeyId = getUrlArgObject("appI");
-              const appKeySecret = getUrlArgObject("appS");
-              FileAPI.upload({
-                // url: '/api/icss/lisExcelRes/lisExcelAnalysis',
-                url: api.upload,
-                data: { hospitalCode: message == '{}' ? '' : message.hospitalCode },
-                files: { uploadfile: files[0] },
-                headers: {
-                  appKeyId: appKeyId,
-                  appKeySecret: appKeySecret,
-                  securityCode: securityCode
-                },
-                complete: function (err, xhr) {
-                  if (!err) {
-                    let res = JSON.parse(xhr.response);
-                    let message = res.data.messages;
-                    // store.dispatch(getExcelList(res.data));
-                    // fetchPushInfos && fetchPushInfos();
-                    // if (message && message.length != 0) {
-                    //   that.setState({
-                    //     visible: true,
-                    //     dom: message,
-                    //     height: message.length
-                    //   })
-                    // }
-                    // $("#choose").val("");
-                  } else {
-                    let res = JSON.parse(xhr.response);
-                    Notify.error(res.msg)
-                  }
-                }
-              });
-            }
-          });
-      });
-    }
+    // handleBindFileApi(){
+    //   const {message} = this.props;
+    //   var ua = navigator.userAgent;
+    //   var _isIE = ua.indexOf("MSIE") > -1;
+    //   if (_isIE) {
+    //     let version = ua.match(/MSIE ([\d.]+)/)[1];
+    //     this.setState({
+    //       ieVersion: version
+    //     })
+    //   }
+    //   $('iframe').bind('load', function () { })
+    //   const { fetchPushInfos } = this.props;
+    //   // FileAPI.debug = true
+    //   $.support.cors = true;
+    //   const that = this;
+    //   var choose = document.getElementById('choose');
+    //   FileAPI.event.on(choose, 'change', function (evt) {
+    //     var files = FileAPI.getFiles(evt);
+    //     FileAPI.filterFiles(files, function (file, info) {
+    //       let name = file.name;
+    //       // if( name.split('.')[1] == 'xlsx' || name.split('.')[1] == 'xls' ){
+    //       //     Notify.error('请选择正确的excel表格')
+    //       //     return false;
+    //       // }else{
+    //       //     return true;
+    //       //   }
+    //         return true;
+    //     },
+    //       function (files, rejected) {
+    //         if (files.length) {
+    //           //console.log(files[0])
+    //           const securityCode = getUrlArgObject("code");
+    //           const appKeyId = getUrlArgObject("appI");
+    //           const appKeySecret = getUrlArgObject("appS");
+    //           FileAPI.upload({
+    //             // url: '/api/icss/lisExcelRes/lisExcelAnalysis',
+    //             url: api.upload,
+    //             data: { hospitalCode: message == '{}' ? '' : message.hospitalCode },
+    //             files: { uploadfile: files[0] },
+    //             headers: {
+    //               appKeyId: appKeyId,
+    //               appKeySecret: appKeySecret,
+    //               securityCode: securityCode
+    //             },
+    //             complete: function (err, xhr) {
+    //               if (!err) {
+    //                 let res = JSON.parse(xhr.response);
+    //                 let message = res.data.messages;
+    //                 // store.dispatch(getExcelList(res.data));
+    //                 // fetchPushInfos && fetchPushInfos();
+    //                 // if (message && message.length != 0) {
+    //                 //   that.setState({
+    //                 //     visible: true,
+    //                 //     dom: message,
+    //                 //     height: message.length
+    //                 //   })
+    //                 // }
+    //                 // $("#choose").val("");
+    //               } else {
+    //                 let res = JSON.parse(xhr.response);
+    //                 Notify.error(res.msg)
+    //               }
+    //             }
+    //           });
+    //         }
+    //       });
+    //   });
+    // }
     
     onClose() {
       this.setState({
@@ -185,9 +185,9 @@ class AssistCheck extends React.Component {
                       </div> : hospitalMsg.importWayLis == 22 ? <div className={styles.pushButton} disabled={ieVersion && ieVersion > 9 ? true : false} onClick={checkSystemIpt}>
                         检查系统导入
                       </div> : hospitalMsg.importWayLis == 2 ? <div className={`${styles.pushButton} ${styles.importInspect}`} onClick={showSlideImport}>
-                        <p id="importExcelBtn" className={styles.importInspectBtn}>导入化验结果</p>
+                        <p id="importExcelBtns" className={styles.importInspectBtn}>导入化验结果</p>
                         {
-                          importLis?<ul className={styles.importSelect} id="importExcelList">
+                          importLis?<ul className={styles.importSelect} id="importExcelLists">
                             <li className={styles.excelIpt}>
                               <div onClick={ieVersion && ieVersion <= 9 ? null : this.handleImportExcel}>本地导入</div>
                               <input type="file" name="uploadfile" id="choose" style={{ display: 'none' }} ref={(DOM) => this.inputRef = DOM} />

src/components/Emergency/HisList/index.jsx

@@ -17,8 +17,8 @@ class HisList extends Component {
       hasSecond:-1,
       all:false,
       index:0,
-      startTime:getCurrentDate(false,'/')+' 00:00:00',
-      endTime:getCurrentDate(false,'/')+' 23:59:59',
+      startTime:getCurrentDate(false)+' 00:00:00',
+      endTime:getCurrentDate(false)+' 23:59:59',
     }
     this.handleGetMore = this.handleGetMore.bind(this);
     this.handleSelect = this.handleSelect.bind(this);
@@ -32,8 +32,8 @@ class HisList extends Component {
     const {handleFilter} = this.props;
     const {endTime} = this.state;
     const obj = {
-      startDate:date.replace(/\//g,'-'),
-      endDate:endTime.replace(/\//g,'-'),
+      startDate:date,
+      endDate:endTime,
       flag:999 //自定义以区分筛选条件
     }
     handleFilter&&handleFilter(obj);
@@ -43,8 +43,8 @@ class HisList extends Component {
     const {handleFilter} = this.props;
     const {startTime} = this.state;
     const obj = {
-      startDate:startTime.replace(/\//g,'-'),
-      endDate:data.replace(/\//g,'-'),
+      startDate:startTime,
+      endDate:date,
       flag:999 //自定义以区分筛选条件
     }
     handleFilter&&handleFilter(obj);

src/components/TimeInterval/index.jsx

@@ -1,7 +1,8 @@
 import React from "react";
 import style from "./index.less";
-import { Calendar} from '@commonComp';
-import {getCalendarDate,getCurrentDate} from "@utils/tools";
+import $ from "jquery";
+import { Calendar } from '@commonComp';
+import { getCalendarDate, getCurrentDate } from "@utils/tools";
 /**
  * top  定位距离
  * sure 是否显示确认按钮
@@ -14,90 +15,111 @@ class TimeInterval extends React.Component {
   constructor(props) {
     super(props);
     const date = new Date();
-    this.state={
-      startTime:getCurrentDate(false,'/')+' 00:00:00',
-      endTime:getCurrentDate(false,'/')+' 23:59:59',
-      show:false,
-      flg:0,
-      timeLisStart:{
-        year:  date.getFullYear(),
-        month:  date.getMonth() + 1,
-        day:  date.getDate(),
-        hour:'00',
-        minute:'00',
-        second:'00'
+    this.state = {
+      startTime: getCurrentDate(false) + ' 00:00:00',
+      endTime: getCurrentDate(false) + ' 23:59:59',
+      show: false,
+      flg: 0,
+      timeLisStart: {
+        year: date.getFullYear(),
+        month: date.getMonth() + 1,
+        day: date.getDate(),
+        hour: '00',
+        minute: '00',
+        second: '00'
       },
-      timeLisEnd:{
-        year:  date.getFullYear(),
-        month:  date.getMonth() + 1,
-        day:  date.getDate(),
-        hour:'23',
-        minute:'59',
-        second:'59'
+      timeLisEnd: {
+        year: date.getFullYear(),
+        month: date.getMonth() + 1,
+        day: date.getDate(),
+        hour: '23',
+        minute: '59',
+        second: '59'
       }
     }
     this.handleShowTime = this.handleShowTime.bind(this)
     this.timeSure = this.timeSure.bind(this)
   }
-  handleChangeDate(date){
+  handleChangeDate(date) {
     // console.log(date,'外')
   }
-  timeSure(date){
-    const {getStartTime,getEndTime} = this.props;
-    if(this.state.flg == 1){
+  componentDidMount() {
+    $(document).click((event) => {
+      let startTimeDes = document.getElementById("startTimeDes")
+      let endTimeDes = document.getElementById("endTimeDes")  
+      let calendarDate = document.getElementById("calendarDate")
+      if (calendarDate) {
+        if (startTimeDes != event.target && endTimeDes != event.target && !calendarDate.contains(event.target)) {
+          this.setState({ show: false });
+        }
+      }
+    });
+  }
+  timeSure(date) {
+    const { getStartTime, getEndTime } = this.props;
+    if (this.state.flg == 1) {
       this.setState({
-        show:false,
-        startTime:getCalendarDate(date,true,'/'),//页面显示的时间
-        timeLisStart:date//事件组件的日期
+        show: false,
+        startTime: getCalendarDate(date, true),//页面显示的时间
+        timeLisStart: date//事件组件的日期
       })
-      getStartTime(getCalendarDate(date,true,'/'))
-    }else if(this.state.flg == 2){
+      getStartTime(getCalendarDate(date, true))
+    } else if (this.state.flg == 2) {
       this.setState({
-        show:false,
-        endTime:getCalendarDate(date,true,'/'),
-        timeLisEnd:date
+        show: false,
+        endTime: getCalendarDate(date, true),
+        timeLisEnd: date
       })
-      getEndTime(getCalendarDate(date,true,'/'))
+      getEndTime(getCalendarDate(date, true))
     }
   }
-  handleShowTime(flg){
-    if(this.state.show){
-      this.setState({show:false},()=>{
+  handleShowTime(flg) {
+    if (this.state.show) {
+      if(flg == this.state.flg){
         this.setState({
-          show:true,
-          flg:flg
+          show: false,
+          flg: flg
         })
-      })
-    }else{
+      }else{
+        this.setState({ show: false }, () => {
+          this.setState({
+            show: true,
+            flg: flg
+          })
+        })
+      }
+    } else {
       this.setState({
-        show:true,
-        flg:flg
+        show: true,
+        flg: flg
       })
     }
   }
   render() {
-    const {startTime,endTime,show,timeLisStart,timeLisEnd,flg} = this.state
-    const {handleShowTime,timeSure,handleChangeDate} = this
+    const { startTime, endTime, show, timeLisStart, timeLisEnd, flg } = this.state
+    const { handleShowTime, timeSure, handleChangeDate } = this
     return <div className={style.timeWrap}>
-          <div className={style.timeIpts}>
-            <input 
-              value={startTime} 
-              readOnly 
-              className={style.ipt} 
-              onClick={()=>handleShowTime(1)} 
-              type="text" 
-              placeholder="起始时间"/>~
-            <input 
-              value={endTime}
-              readOnly
-              className={style.ipt}
-               onClick={()=>handleShowTime(2)}
-               type="text"
-               placeholder="终止时间"/>
-          </div>
-          {
-            show?<Calendar timeLis={flg==2?timeLisEnd:timeLisStart} top={40} sure={true} timeSure={timeSure} needTime={true} isShow={true} handleChange={handleChangeDate}></Calendar>:null
-          }
+      <div className={style.timeIpts}>
+        <input
+          value={startTime}
+          readOnly
+          className={style.ipt}
+          onClick={() => handleShowTime(1)}
+          type="text"
+          id="startTimeDes"
+          placeholder="起始时间" />~
+              <input
+          value={endTime}
+          readOnly
+          id="endTimeDes"
+          className={style.ipt}
+          onClick={() => handleShowTime(2)}
+          type="text"
+          placeholder="终止时间" />
+      </div>
+        {
+          show ? <Calendar timeLis={flg == 2 ? timeLisEnd : timeLisStart} top={40} sure={true} timeSure={timeSure} needTime={true} isShow={true} handleChange={handleChangeDate}></Calendar> : null
+        }
     </div>
   }
 }

src/components/TimeInterval/index.less

@@ -10,4 +10,5 @@
 input.ipt {
   width: 126px;
   text-align: center;
+  font-size: 12px;
 }