Jelajahi Sumber

模板修改添加科室和性别(3147)

zhangxc 5 tahun lalu
induk
melakukan
18c40bcb32

TEMPAT SAMPAH
src/components/PushContainer/Search/imgs/clear.png


TEMPAT SAMPAH
src/components/PushContainer/Search/imgs/search.png


+ 116 - 0
src/components/PushContainer/Search/index.jsx

@@ -0,0 +1,116 @@
+import React from 'react';
+import styles from './index.less';
+import clear from './imgs/clear.png';
+import search from './imgs/search.png';
+import config from '@config/index';
+import $ from 'jquery';
+/**
+ * 前提条件父元素有定位
+ * visible  搜索显示隐藏
+ * handleChangeValue  函数参数为输入框的value值
+ */
+class SearchList extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            val:'',
+            border:'',
+            show:false,
+            timer:null
+        }
+        this.textInput = React.createRef();
+        this.handleClearVal = this.handleClearVal.bind(this);
+        this.handleFocus = this.handleFocus.bind(this);
+        this.handleBlur = this.handleBlur.bind(this);
+    }
+    componentDidMount(){
+      this.props.handleChangeValue('');
+    //   this.textInput.current.focus();
+      const {windowHeight,pageTop,height,refreshScroller} = this.props;
+      const {value} = this.props;
+        if(value && value.trim()){
+            this.textInput.current.value = value;
+            this.setState({
+                val:value,
+                show:true
+            });
+        }
+    }
+    handleClearVal(){
+        const { handleChangeValue,handleChangeIpt } = this.props;
+        this.textInput.current.value = '';
+        this.textInput.current.focus();
+        this.setState({
+            val:'',
+            show:false
+        });
+        handleChangeIpt('');
+        handleChangeValue('');
+    }
+    handleInput(e){
+      const { handleChangeValue,handleChangeIpt } = this.props;
+        clearTimeout(this.state.timer);
+        let timer = setTimeout(()=>{
+            clearTimeout(this.state.timer);
+            handleChangeIpt(e.target.value);
+            if(e.target.value.trim() == ''){
+                this.setState({
+                    show:false
+                })
+                return  handleChangeValue('');
+            }
+            this.setState({
+                val:e.target.value,
+                show:true
+            })
+            handleChangeValue(e.target.value);
+        },config.delayTime);
+        this.setState({
+            timer
+        });
+    }
+    handleFocus(){
+      if(this.state.val.trim() != ''){
+        return;
+      }else{
+          this.setState({border:true})
+      }
+    }
+    handleBlur(){
+      this.setState({border:false,val:''})
+    }
+    componentWillReceiveProps(next){
+
+        if(next.value&&(next.value != this.props.value)){
+            this.textInput.current.value = next.value;
+        }
+    }
+    render() {
+        const { children,visible,zIndex } = this.props;
+        const { show } = this.state;
+        return (
+            <div id="searchOption" className={styles.search} style={{zIndex:zIndex?zIndex:10}}>
+                <img style={{display:show?'block':'none'}} className={styles.clearVal} src={clear} onClick={this.handleClearVal} alt="清空" />
+                <input
+                    className={this.state.border ?`${styles.border}`:`${styles.borderNone}`}
+                    type="text"
+                    maxLength="30"
+                    ref={this.textInput}
+                    onFocus={this.handleFocus}
+                    onBlur={this.handleBlur}
+                    onInput={(e) => { 
+                        this.handleInput(e)
+                    }}
+                    onPropertyChange={(e) => {  // 兼容ie
+                        this.handleInput(e)
+                    }}
+                    placeholder="搜索"
+                />
+                <div className={styles.autoList}>
+                    {children}
+                </div>
+            </div>
+        )
+    }
+}
+export default SearchList;

+ 38 - 0
src/components/PushContainer/Search/index.less

@@ -0,0 +1,38 @@
+@import "~@less/variables.less";
+
+.search {
+    .contentZIndex1;
+    width: 240px;
+    box-sizing: border-box;
+    position: relative;
+    background-color: #fff;
+    display: inline-block !important;
+    margin-right: 20px;
+
+    input {
+        width: 100%;
+        height: 30px;
+        line-height: 30px;
+        padding: 0 30px 0 10px;
+        box-sizing: border-box;
+        border: 1px solid #ccc;
+    }
+    .border {
+        // border: 1px solid @blue;
+    }
+    .borderNone {
+        border: 1px solid #ccc;
+    }
+    img {
+        position: absolute;
+        top: 5px;
+    }
+    .clearVal{
+        cursor: pointer;
+        right: 5px;
+    }
+}
+
+.hide {
+    display: none;
+}

TEMPAT SAMPAH
src/components/PushContainer/img/check-circle.png


TEMPAT SAMPAH
src/components/PushContainer/img/check-right.png


+ 140 - 42
src/components/PushContainer/index.jsx

@@ -1,8 +1,8 @@
 import React, { Component } from 'react';
 import style from './index.less';
 import { Tab, ConfirmModal, Notify } from '@commonComp';
-import { tabChange, allChecked, changeVisible, keepPushData, allCheckedShow,allCheckedAdmin,allCheckedShowAdmin,whichTemp,floderSlide,floderAction,folderModal,clearSearchTemplateNorms,folderOrder } from '@store/actions/tabTemplate';
-import { initItemList,initAdminItemList, delItem,delItemAdmin, delBatchItem, delBatchItemAdmin,changeTitleAsync, setPageView,changeTitleAsyncAdmin,setPageViewAdmin,getFloderList,delFloder,addTemplateQuote,newFloder,findTemplateNorms,getFloderListAll } from '@store/async-actions/tabTemplate';
+import { tabChange, allChecked, changeVisible, keepPushData, allCheckedShow,allCheckedAdmin,allCheckedShowAdmin,whichTemp,floderSlide,floderAction,folderModal,clearSearchTemplateNorms,folderOrder,getDptLis } from '@store/actions/tabTemplate';
+import { initItemList,initAdminItemList, delItem,delItemAdmin, delBatchItem, delBatchItemAdmin,changeTitleAsync, setPageView,changeTitleAsyncAdmin,setPageViewAdmin,getFloderList,delFloder,addTemplateQuote,newFloder,findTemplateNorms,getFloderListAll,getDepartments } from '@store/async-actions/tabTemplate';
 import { connect } from "react-redux";
 import store from '@store';
 import { billing } from '@store/async-actions/pushMessage';
@@ -13,8 +13,12 @@ import { pushAllDataList, getWindowInnerHeight, didPushParamChange } from '@util
 import CopyRightContainer from "@containers/CopyRightContainer";
 import MedicalInfoContainer from '@containers/MedicalInfoContainer';
 import FolderName from '@components/FolderName';
+// import Search from './../Operation/Search';
+import Search from './Search';
 import slideDown from '@common/images/slideDown.png';
 import CaseQuailty from "../CaseQuailty";
+import check_circle from './img/check-circle.png';
+import check_right from './img/check-right.png';
 import pinyin from '@utils/Convert_Pinyin.js';
 import $ from "jquery";
 
@@ -48,7 +52,8 @@ class PushContainer extends Component {
       okColor: 'red',
       num: 0,          //计数
       deptId:'',       //科室id
-      
+      value:'',//科室name
+      sex:'3',
       floderName:'',   //文件夹名称
       folderListShow:false,
       folderNameVal:'',
@@ -56,7 +61,9 @@ class PushContainer extends Component {
       spell:'',
       fstName:'',
       tmpFolder:'',
-      hasCalcIndex: false
+      hasCalcIndex: false,
+      hospitalDeptName:''
+
     }
     this.$cont = React.createRef();
     this.itemList = null;
@@ -80,6 +87,10 @@ class PushContainer extends Component {
     this.setFolderId = this.setFolderId.bind(this);
     this.floderDelete = this.floderDelete.bind(this);
     this.folderManage = this.folderManage.bind(this);
+    this.changeRadio = this.changeRadio.bind(this);
+    this.handleChangeIpt = this.handleChangeIpt.bind(this);
+    this.setDeptId = this.setDeptId.bind(this);
+    this.handleClearValue = this.handleClearValue.bind(this);
   }
   componentDidMount() {
     // const height = getWindowInnerHeight()-160;
@@ -250,7 +261,7 @@ class PushContainer extends Component {
    * 改变模板标题
    * @param {模板id和模板title} obj
    */
-  handleTitleChange(id, text,deptId,folderId,spell,folderName) {
+  handleTitleChange(id, text,deptId,folderId,spell,folderName,sex,hospitalDeptName) {
     store.dispatch(changeVisible(true))
     this.props.admin&&store.dispatch(getFloderList())
     this.setState({
@@ -265,9 +276,12 @@ class PushContainer extends Component {
       okColor: '#fff',
       oKBg: '#3B9ED0',
       folderId:folderId,
+      sex: sex,
       spell:spell,
       folderNameVal:folderName,
       tmpFolder:folderName,
+      value:hospitalDeptName
+
     }, () => {
       this.setState({
         message: this.changeTitle(),
@@ -375,10 +389,36 @@ class PushContainer extends Component {
     // store.dispatch(delFloder(id))
     
   }
- 
+  changeRadio(sex){
+    if(sex == 1){
+      $('#commonSex img').attr('src',check_right)
+      $('#maleSex img').attr('src',check_circle)
+      $('#femaleSex img').attr('src',check_circle)
+      $('#commonSex i').css('color','#000')
+      $('#maleSex i').css('color','#6b6969')
+      $('#femaleSex i').css('color','#6b6969')
+      this.setState({sex:'3'})
+    }else if(sex == 2){
+      $('#commonSex img').attr('src',check_circle)
+      $('#maleSex img').attr('src',check_right)
+      $('#femaleSex img').attr('src',check_circle)
+      $('#commonSex i').css('color','#6b6969')
+      $('#maleSex i').css('color','#000')
+      $('#femaleSex i').css('color','#6b6969')
+      this.setState({sex:'1'})
+    }else if(sex == 3){
+      $('#commonSex img').attr('src',check_circle)
+      $('#maleSex img').attr('src',check_circle)
+      $('#femaleSex img').attr('src',check_right)
+      $('#commonSex i').css('color','#6b6969')
+      $('#maleSex i').css('color','#6b6969')
+      $('#femaleSex i').css('color','#000')
+      this.setState({sex:'2'})
+    }
+  }
 
   makeSure() {
-    const {type,id,title,tmpFolder,folderNameVal,text,fstName,spell,currId,deptId,folderId,floderName} = this.state
+    const {type,id,title,tmpFolder,folderNameVal,text,fstName,spell,currId,deptId,folderId,floderName,sex,hospitalDeptName} = this.state
     if (type == 1) {
       if(this.props.admin){
         store.dispatch(delItemAdmin(id,folderId))
@@ -394,11 +434,11 @@ class PushContainer extends Component {
       }
       store.dispatch(changeVisible(false))
     } else if (type == 3) {
-      if (title == text &&tmpFolder==folderNameVal&&fstName==spell) {
-        store.dispatch(changeVisible(false))
-        Notify.success('标题修改成功');
-        return;
-      }
+      // if (title == text &&tmpFolder==folderNameVal&&fstName==spell&&deptId) {
+      //   store.dispatch(changeVisible(false))
+      //   Notify.success('标题修改成功');
+      //   return;
+      // }
       if (title.trim() == '') {
         Notify.info('请输入模板名称');
         return;
@@ -409,7 +449,9 @@ class PushContainer extends Component {
         deptId:deptId,
         folderId:folderId,
         folderName:folderNameVal,
-        spell:fstName
+        spell:fstName,
+        sex: sex,
+        hospitalDeptName:hospitalDeptName
       }
       if(this.props.admin){
         store.dispatch(changeTitleAsyncAdmin(tempObj))
@@ -491,9 +533,34 @@ class PushContainer extends Component {
   folderManage(flg) {
     store.dispatch(folderOrder(flg))
   }
+  handleChangeValue(val)  {
+    val && store.dispatch(getDepartments(val))
+  }
+  handleChangeIpt(val){//搜索科室
+    if(val == ''){
+      this.setState({
+        deptId:'',
+      })
+      return
+    }
+    this.setState({
+      value:val
+    })
+  }
+  setDeptId(id,name){
+    this.handleClearValue()
+    this.setState({
+      deptId :id,
+      value:name
+    })
+  }
+  handleClearValue () {
+    store.dispatch(getDptLis([]))
+  }
   render() {
-    const { activeId, checkItems,selectTemp,folderListContentArr, visible, showMsg,hasMore,current,floderListAdmin, items, allCheckShow,allCheckShowAdmin,adminItems,admin,checkItemsAdmin,clearSearch, templateNormsSearchList} = this.props;
-    const { type,okBorderColor,okColor,oKBg,okText,message,folderListShow } = this.state
+    const { activeId, checkItems,selectTemp,folderListContentArr, visible, showMsg,hasMore,current,floderListAdmin, items, allCheckShow,allCheckShowAdmin,adminItems,admin,checkItemsAdmin,clearSearch, templateNormsSearchList, departLis} = this.props;
+    const { type,okBorderColor,okColor,oKBg,okText,message,folderListShow,value } = this.state
+    const { handleChangeValue, handleChangeIpt} = this
     return <div className={style["container"]} ref={this.$cont} >
       <Tab tabs={this.state.tabs}
         activeId={activeId}
@@ -552,33 +619,64 @@ class PushContainer extends Component {
       >
         {message}
         {
-          admin&&type==3?<div className={style.department}>
-            <span className={style.leftName}>存储为:</span>
-              <div  className={style.selectFolder} onClick={(e) => {
-                    this.handleFolderShow(e)
-                  }}>
-                <input className={style.selectFolderIpt}
-                  type="text"
-                  maxLength='20'
-                  readOnly
-                  value={this.state.folderNameVal}
-                  
-                />
-                <img src={slideDown} alt=""/>
+          admin&&type==3?<div>
+            <div  className={style.iptWrap}>
+              <div className={style.male}>
+                <span className={style.leftName}>性别归属:</span>
+                <span className={style['commonSex']} id="commonSex" onClick={this.changeRadio.bind(this,1)}><img src={check_right} alt=""/><i style={{color:'#000'}}>通用</i></span>
+                <span id="maleSex" onClick={this.changeRadio.bind(this,2)}><img src={check_circle} alt=""/><i>男</i></span>
+                <span id="femaleSex" onClick={this.changeRadio.bind(this,3)}><img src={check_circle} alt=""/><i>女</i></span>
+                <span style={{paddingRight:0,color:'#777777'}}>(注:错误引用,显示可能有误)</span>
               </div>
-              {
-                floderListAdmin.length>0&&folderListShow&&<ul className={`${style.departLis} ${style.departLisFolder}`}>
-                  {
-                    floderListAdmin.map((item,idx)=>{
-                      return <li onClick={()=>this.setFolderId(item.id,item.name)}>
-                        {item.name}
-                      </li>
-                    })
-                  }
-                </ul>
-              }
-              <span className={style.newFolder} onClick={()=>this.newFolder(true)}>新建文件夹</span>
-              <span className={style.mangerFolder} onClick={()=>this.folderManage(true)}>管理文件夹</span>  
+            </div>
+            <div className={style.department}>
+              <span className={style.leftName}>科室归属:</span>
+                <Search handleChangeValue={handleChangeValue} handleChangeIpt={handleChangeIpt} value={value} visible={true} zIndex={11}>
+                {
+                  departLis.length>0&&value&&<ul className={style.departLis}>
+                    {
+                      departLis.map((item,idx)=>{
+                        return <li onClick={()=>this.setDeptId(item.id,item.conceptDeptName)}>
+                          {item.conceptDeptName}
+                        </li>
+                      })
+                    }
+                  </ul>
+                }
+                </Search>
+              <span style={{paddingRight:0,color:'#777777'}}>(支持汉字关键字搜索)</span>
+          </div>
+
+
+            <div className={style.department}>
+              <span className={style.leftName}>存储为:</span>
+                <div  className={style.selectFolder} onClick={(e) => {
+                      this.handleFolderShow(e)
+                    }}>
+                  <input className={style.selectFolderIpt}
+                    type="text"
+                    maxLength='20'
+                    readOnly
+                    value={this.state.folderNameVal}
+                    
+                  />
+                  <img src={slideDown} alt=""/>
+                {
+                  floderListAdmin.length>0&&folderListShow&&<ul className={`${style.departLis} ${style.departLisFolder}`}>
+                    {
+                      floderListAdmin.map((item,idx)=>{
+                        return <li onClick={()=>this.setFolderId(item.id,item.name)}>
+                          {item.name}
+                        </li>
+                      })
+                    }
+                  </ul>
+                }
+                </div>
+
+                <span className={style.newFolder} onClick={()=>this.newFolder(true)}>新建文件夹</span>
+                <span className={style.mangerFolder} onClick={()=>this.folderManage(true)}>管理文件夹</span>  
+            </div>
           </div>:null
         }
       </ConfirmModal>
@@ -605,7 +703,7 @@ const mapStateToProps = (state) => {//console.log(state)
     allCheckShowAdmin: state.tabTemplate.allCheckShowAdmin,
     checkItemsAdmin: state.tabTemplate.checkItemsAdmin,
     clearSearch:state.print.clearSearch,
-    
+    departLis: state.tabTemplate.departLis,
     selectTemp:state.tabTemplate.selectTemp,
     floderListAdmin:state.tabTemplate.floderListAdmin,
     folderListContentArr:state.tabTemplate.folderListContentArr,

+ 103 - 0
src/components/PushContainer/index.less

@@ -198,4 +198,107 @@
 }
 .selectFolderIpt {
   cursor: pointer;
+}
+.department {
+  position: relative;
+  text-align: left;
+  padding: 0 0 15px 16px;
+  .selectFolder {
+      position: relative;
+      display: inline-block;
+      input {
+          border: 1px solid #CCCCCC;
+          padding: 5px 10px;
+          width: 240px;
+          margin-right: 20px;
+      }
+      img {
+          position: absolute;
+          right: 20px;
+          top: 0;
+          width: 30px;
+          height: 30px;
+      }
+  }
+}
+.leftName {
+  width: 100px;
+  text-align: right;
+  padding-right: 16px;
+  display: inline-block;
+}
+.departLis {
+  position: absolute;
+  top: 29px;
+  left: 0;
+  max-height: 200px;
+  overflow: auto;
+  background-color: #fff;
+  width: 240px;
+  // box-shadow: 0 10px 20px 0 #989DA3;
+  border: 1px solid #dedede;
+  z-index: 101;
+  li {
+      height: 36px;
+      line-height: 36px;
+      padding: 0 10px;
+      padding-top: 0;
+      box-sizing: border-box;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      border: 1px solid transparent;
+      cursor: pointer;
+  }
+  li:hover {
+      border: 1px solid #3B9ED0;
+  }
+}
+.male {
+  span {
+      padding-right: 16px;
+  }
+}
+.line {
+  height: 1px;
+  background-color: #979797;
+  position: relative;
+  top: -2px;
+}
+.iptWrap {
+  padding: 0 15px;
+  line-height: 18px;
+  margin: 18px auto;
+  text-align: left;
+  .name {
+      text-align: left;
+      input {
+          border: 1px solid #CCCCCC;
+          padding: 5px 10px;
+          display: inline-block;
+          width: 240px;
+      }
+  }
+  .firstname {
+      margin-top: 15px;
+  }
+  p {
+    text-align: left;
+    font-size: 12px;
+    color: #6b6969;
+    margin-bottom: 5px;
+  }
+  span {
+    display: inline-block;
+    cursor: pointer;
+    font-size: 14px;
+    i {
+      color: #6b6969;
+    }
+    img {
+      vertical-align: middle;
+      position: relative;
+      top: -1px;
+    }
+  }
 }

+ 4 - 4
src/components/TemplateItems/TemplateItem/index.jsx

@@ -113,10 +113,10 @@ class TemplateItem extends React.Component {
     });
   }
 
-  handleEditIconClick(e, name,deptId,folderId,spell,folderName) {
+  handleEditIconClick(e, name,deptId,folderId,spell,folderName,sex,hospitalDeptName) {
     e.stopPropagation();
     let currId = this.props.id
-    this.props.handleTitleChange(currId, name,deptId,folderId,spell,folderName);
+    this.props.handleTitleChange(currId, name,deptId,folderId,spell,folderName,sex,hospitalDeptName);
   }
 
   handleTitleClick(e) {
@@ -211,7 +211,7 @@ class TemplateItem extends React.Component {
     }
   }
   render() {
-    const { allCheckShow, id, name,hospitalDeptId,folderId,spell,preview,conceptDeptName, sex,admin,checkItemsAdmin,allCheckShowAdmin,adminflg,folderName } = this.props;
+    const { allCheckShow, id, name,hospitalDeptId,folderId,spell,preview,conceptDeptName, sex,admin,checkItemsAdmin,allCheckShowAdmin,adminflg,folderName,hospitalDeptName } = this.props;
     let previewJson = JSON.parse(preview);
     let sexStr = sex == 2 ? ' (女' : sex == 1 ? ' (男': ' (通用';
     if(conceptDeptName) {
@@ -247,7 +247,7 @@ class TemplateItem extends React.Component {
             src={this.getEditIcon()}
             onMouseEnter={() => this.handleEditIconMouseEnter()}
             onMouseLeave={() => this.handleEditIconMouseLeave()}
-            onClick={(e) => this.handleEditIconClick(e, name,hospitalDeptId,folderId,spell,folderName)}
+            onClick={(e) => this.handleEditIconClick(e, name,hospitalDeptId,folderId,spell,folderName,sex,hospitalDeptName)}
           />}
         </div>
         <div

+ 1 - 1
src/store/async-actions/tabTemplate.js

@@ -270,7 +270,6 @@ export const delFloder = (id) => { //文件夹删除
     }).then((res) => {
       let data = res.data;
       if (data.code == 0) {
-        console.log(res,'管理员文件夹列表获取')
         Notify.success('文件夹删除成功');
         dispatch(getFloderListAll())
         // axios.json('/templateAdmin/getTemplateNorms').then((res) => {
@@ -379,6 +378,7 @@ export const changeTitleAsyncAdmin = (obj) => { //改标题
       "hospitalDeptId": obj.deptId,
       "hospitalId": state.hospitalId,
       "id": obj.id,
+      "sex": obj.sex,
       "modeName": obj.title,
       "type": whichSign,
       "folderId": obj.folderId,