123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194 |
- import React from 'react';
- import ReactDOM from 'react-dom';
- import style from './index.less';
- import close from './img/close.png';
- import { Notify } from '@commonComp';
- import floderR from './img/floderR.png';
- import floderD from './img/floderD.png';
- import diagUp from '@common/images/diagUp.png';
- import diagDown from '@common/images/diagDown.png';
- class FolderOrder extends React.Component {
- constructor(props) {
- super(props);
- this.state = {
- folderModal:false,
- selectIndex: -1,
- folderList: null,
- }
- this.textInput = React.createRef();
- this.orderFolder = this.orderFolder.bind(this)
- this.saveOrderFolder = this.saveOrderFolder.bind(this)
- }
- componentWillReceiveProps(props) {
- this.setState({
- folderList: JSON.parse(JSON.stringify(props.adminItems)),
- selectIndex: -1
- })
- }
- floderSlide(e,i) {
- const selectIndex = this.state.selectIndex
- if(selectIndex === i) {
- this.setState({
- selectIndex: -1
- })
- } else {
- this.setState({
- selectIndex: i
- })
- }
-
- }
- saveOrderFolder(){
- const {saveOrderFolder,patInfo,folderManage} = this.props
- const {folderList} = this.state
- let folderListFilter = []
- for(let i = 0; i < folderList.length; i++) {
- let templateList = []
- if(folderList[i].templateInfo) {
- for(let j = 0; j < folderList[i].templateInfo.length;j++) {
- const templateItem = folderList[i].templateInfo[j]
- templateList.push({
- "folderId": templateItem.folderId,
- "id": templateItem.folderMappingId,
- "isDeleted": "N",
- "orderNo": j,
- "templateId": templateItem.id
- })
- }
- }
-
- const item =
- {
- "doctorId": patInfo.doctorId,
- "hospitalId": patInfo.hospitalId,
- "id": folderList[i].id,
- "isDeleted": "N",
- "name": folderList[i].name,
- "orderNo": i,
- "templateSortVOList": templateList
- }
- folderListFilter.push(item)
- }
- saveOrderFolder(folderListFilter)
- folderManage(false)
- }
- orderFolder(index,e) {
- e.stopPropagation();
- const {selectIndex, folderList} = this.state
- const folderListCopy = JSON.parse(JSON.stringify(folderList))
- const item = folderListCopy[index]
- if(index > 0) {
- folderListCopy.splice(index, 1)
- folderListCopy.splice(index-1, 0 , item)
- if(index === selectIndex) {
- this.setState({
- selectIndex: selectIndex-1
- })
- }else if(index === selectIndex+1){
- this.setState({
- selectIndex: selectIndex+1
- })
- }
- } else {
- folderListCopy.splice(index, 1)
- folderListCopy.splice(index+1, 0 , item)
- if(selectIndex === index + 1) {
- this.setState({
- selectIndex: selectIndex - 1
- })
- }else if(selectIndex == 0 ) {
- this.setState({
- selectIndex: selectIndex+1
- })
- }
-
- }
- this.setState({
- folderList: folderListCopy
- })
- }
- orderTemplate(i,index, e) {
- e.stopPropagation();
- const folderListCopy = JSON.parse(JSON.stringify(this.state.folderList))
- const olderItem = folderListCopy[i]
- const templateList = olderItem.templateInfo
- const templateItem = templateList[index]
- if(index > 0) {
- templateList.splice(index, 1)
- templateList.splice(index-1, 0 , templateItem)
- } else {
- templateList.splice(index, 1)
- templateList.splice(index+1, 0 , templateItem)
- }
- this.setState({
- folderList: folderListCopy
- })
- }
- genAdminItems(items,flg) {
- const Floder=[],Items = [];
- const {admin,checkItemsAdmin} = this.props;
-
- const { selectIndex } = this.state;
- for(let i = 0;i < items.length;i++){
- let tmpItm = items[i]
- Floder.push(
- <div className={style.floderBox}>
- <div className={style.floderItem} onClick={(e)=>{tmpItm.templateInfo&&tmpItm.templateInfo.length>0 ?this.floderSlide(e,i) :''}}>
- <img src={selectIndex == i?floderD:floderR} className={style.floderRD}/>
- {tmpItm.name}({tmpItm.templateInfoCount})
- <span class={`${i ===0 ? style.arrowDown : style.arrowUp}`} onClick={this.orderFolder.bind(this, i)}></span>
- {/* <img class={style.orderIcon} src={i===0?diagDown:diagUp} alt="排序" onClick={this.orderFolder.bind(this, i)}/> */}
- {/* <span className={`${style.floderPartAction}`} id="floderActionBtn" onClick={(e)=>{this.floderAction(e,i)}}>...</span> */}
- </div>
- {
- i==selectIndex&&tmpItm.templateInfo&&tmpItm.templateInfo.length>0&&<div className={style.floderPartFr}>
- { tmpItm.templateInfo.map((templateItem, index) => {
- return (<div class={style.templateItem}>
- {templateItem.name}
- <span class={`${index===0 ? style.arrowDown : style.arrowUp}`} onClick={this.orderTemplate.bind(this, i, index)}></span>
- {/* <img class={style.orderIcon} src={index===0?diagDown:diagUp} alt="排序" onClick={this.orderTemplate.bind(this, i, index)}/> */}
- </div>)
- })}
- </div>
- }
- </div>
- )
- }
- return Floder
- }
- onKeyPress(event){
- let e = event?event:window.event;
- if (e.keyCode == 13) {
- this.saveNewFolder()
- }
- }
- render() {
- const { folderOrderShow,title,folderManage,adminItems, } = this.props;
- const domNode = document.getElementById('root');
- const items = this.state.folderList
- return folderOrderShow&&ReactDOM.createPortal(
- <div className={style.newFolderWrap}>
- <div className={style.folderModal} onClick={()=>folderManage(false)}></div>
- <div className={style.nameWrap}>
- <div className={style.title}>
- {
- title?<div className={style.titleCon}>{title}</div>:null
- }
- <img src={close} alt="关闭" onClick={()=>folderManage(false)}/>
- </div>
- <div className={style['delContent']}>
- {this.genAdminItems(items,true)}
- </div>
- <div className={style['delFoot']}>
- <div className={style.halfBtn}>
- <span className={`${style['delBtn']} ${style['delDel']}`} onClick={this.saveOrderFolder}>保存</span>
- </div>
- <div className={style.halfBtn}>
- <span className={`${style['delBtn']} ${style['delCancel']}`} onClick={()=>folderManage(false)}>取消</span>
- </div>
- </div>
- </div>
- </div>,domNode)
- }
- }
- export default FolderOrder;
|