ソースを参照

新增右侧慢病推送模块;量表弹窗

liucf 6 年 前
コミット
4926b3f5a7

+ 58 - 25
src/components/PushItems/index.jsx

@@ -23,7 +23,8 @@ class PushItems extends Component {
 
     this.state = {
       moreAssay: false,
-      moreCheck: false
+      moreCheck: false,
+      showTableInfo:true
     };
 
     this.showMore = this.showMore.bind(this);
@@ -135,9 +136,11 @@ class PushItems extends Component {
     const { hideTipsDetailsModal } = this.props;
     hideTipsDetailsModal && hideTipsDetailsModal()
   }
-  showTableList(item){
-    const {chronicMagItem,getTableList} = this.props;
-    getTableList(chronicMagItem.id);
+
+  // 量表部分
+  showTableList(item){//量表
+    const {chronicMagItem,getTableList,questionId} = this.props;
+    getTableList(questionId&&questionId.id);
   }
   confirm(){
     const {hideList} = this.props;
@@ -147,6 +150,40 @@ class PushItems extends Component {
     const {hideList} = this.props;
     hideList&&hideList();
   }
+  showManage(){//管理和评估
+    console.log("点击了管理和评估");
+  }
+  getTableInfo(){//整个量表模块
+    const {tips} = this.props.pushMessage;
+    let info = 
+        <div className={style["tips"]} style={{marginBottom:'15px'}}>
+              <div className={style["tips-title"]}>
+                <div className={style["tips-name"]}>
+                  <h2>{tips.tagName||'冠状动脉'}</h2>
+                  <span className={style["redTips"]}>(页面信息有更新可能影响评估结果)</span>
+                </div>
+                <div className={style["tips-btn"]}>
+                  <span
+                    className={style["tipsDetails"]}
+                    style={{width:'70px'}}
+                    onClick={() => this.showManage(tips)}
+                  >
+                    管理和评估
+                  </span>
+                  <span
+                    className={style["tipsDetails"]}
+                    onClick={() => this.showTableList(tips)}
+                  >
+                    量表
+                  </span>
+                </div>
+              </div>
+              <div className={style["content"]}>
+                  这里放置量表列表
+              </div>
+            </div>
+    return info;
+  }
   componentDidMount() {
     const height = getWindowInnerHeight() - 200;
     this.$cont.current.style.height = height + "px";
@@ -170,7 +207,7 @@ class PushItems extends Component {
       tipsDetails
     } = this.props.pushMessage;
     const { tipsDiscalimer,tableList ,showList} = this.props;
-    const { moreAssay, moreCheck } = this.state;
+    const { moreAssay, moreCheck ,showTableInfo} = this.state;
     const {
       showMore,
       closeMore,
@@ -433,6 +470,7 @@ class PushItems extends Component {
                 )}
               </div>
             </div>
+            {showTableInfo?this.getTableInfo():''}
             <div className={style["tips"]}>
               <h1>
                 <img src={tipsImg} />
@@ -449,18 +487,6 @@ class PushItems extends Component {
                       >
                         详情
                       </span>
-                      <span
-                        className={style["tips-details"]}
-                        onClick={() => showTips(tips)}
-                      >
-                        管理和评估
-                      </span>
-                      <span
-                        className={style["tips-details"]}
-                        onClick={() => showTableList(tips)}
-                      >
-                        量表
-                      </span>
                     </div>
                     {tips.introduceDetailList &&
                       tips.introduceDetailList.map((item, index) => {
@@ -499,14 +525,21 @@ class PushItems extends Component {
             showTipsDetails = {showTipsDetails}
             hideTips = {this.hideTips}
             tipsDetails = {tipsDetails}/>}
-        <ConfirmModal visible={showList} okText='确定' cancelText='' confirm={this.confirm} close={this.close}>
-            {/*<div className={style['confirm-info']}>确定选择“{item.name}”为</div>*/}
-            <div>
-              {tableList&&tableList.map((v,i)=>{
-                return <label><input type="radio" name="chronic" />{v.name}</label>
-              })}
-            </div>
-             
+        {/*<ConfirmModal visible={showList} okText='确定' cancelText='' confirm={this.confirm} close={this.close}>*/}
+        <ConfirmModal 
+        visible={showList} 
+        noFooter="true" 
+        close={this.close}
+        height={300}
+        width={400}>
+          <h2 className={style['toast-title']}>全部量表</h2>
+          <ul className={style['toast-cont']}>
+            {tableList&&tableList.map((v,i)=>{
+              return <li>
+              <a href="#">{'【'+v.name+'】'}</a>
+              </li>
+            })}
+          </ul>    
         </ConfirmModal>
       </div>
     );

+ 52 - 1
src/components/PushItems/index.less

@@ -176,7 +176,7 @@
   }
   .tips{
     border:1px solid #EAEDF1;
-    h1{
+    .tips-title,h1{
       font-size: 14px;
       color: #000;
       padding: 8px 15px;
@@ -188,6 +188,41 @@
         margin-right: 5px;
       }
     }
+    .tips-title{
+      .tips-name{
+        width: 255px;
+        display: inline-block;
+      }
+      h2{
+        display: inline-block;
+      }
+      .tips-btn{
+        display: inline-block;
+        float: right;
+      }
+      .redTips{
+        display: inline-block;
+        font-size: 12px;
+        -webkit-transform:scale(0.9);
+        color: red;
+        font-weight: normal;
+        white-space: nowrap;
+      }
+      .tipsDetails {
+        display: inline-block;
+        font-weight: normal;
+        width: 42px;
+        height: 20px;
+        border: 1px solid #3B9ED0;
+        border-radius: 4px;
+        text-align: center;
+        font-size: 12px;
+        color: #3B9ED0;
+        line-height: 18px;
+        margin: 0 0 -2px 10px;
+        cursor: pointer;
+      }
+    }
     .content{
       font-size: 14px;
       padding:6px 15px;
@@ -353,3 +388,19 @@
   color: #979797;
   text-align: center;
 }
+
+.toast-title{
+  position: absolute;
+  top: 27px;
+  font-size: 16px;
+  border-bottom: 1px solid #666;
+  width: 94%;
+  height: 25px;
+}
+.toast-cont{
+  line-height: 24px;
+  font-size: 14px;
+  margin-top: 15px;
+  height: 222px;
+  overflow-y: auto;
+}

+ 1 - 0
src/containers/PushItemsContainer.js

@@ -11,6 +11,7 @@ function mapStateToProps(state) {
         pushMessage: state.pushMessage,
         tipsDiscalimer:  state.copyRight.disContent,
         chronicMagItem: state.diagnosticList.chronicMagItem,
+        questionId: state.diagnosticList.clickDiag,
         tableList: state.pushMessage.tableList,
         showList: state.pushMessage.showList,
     }