Browse Source

质控评分

zhangxc 5 years ago
parent
commit
cf1d92b08d

+ 7 - 0
src/css/index.less

@@ -294,4 +294,11 @@
   opacity: 0.5;
   left: 0;
   top: 0;
+}
+.loadingImg{
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  width: 60px;
+  margin: -30px 0 0 -30px;
 }

+ 14 - 4
src/css/itemManager.less

@@ -109,6 +109,8 @@ table{
     color: #fff;
     text-align: center;
     line-height: 36px;
+    position: relative;
+    top: -2px;
 }
 .editItem{
    color: #5A8EEE;
@@ -137,13 +139,21 @@ table{
 .activePage{
     color: #5A8EEE;
 }
-.pageNum,.prePage,.nextPage{
-    cursor: pointer;
-}
-.pageNum, .more{
+.pageNum,.prePage,.nextPage, .more{
     display: inline-block;
     width: 20px;
+    cursor: pointer;
     margin: 0 20px 0 0;
+    text-align: center;
+}
+.prePage,.nextPage{
+    img{
+        position: relative;
+        top: -2px   ;
+    }
+}
+ .more{
+    cursor: not-allowed;
 }
 .arrowPage{
     width: 6px;

+ 97 - 6
src/css/qcList.less

@@ -21,15 +21,52 @@ table{
     th,td{
         height: 40px;
         box-sizing: border-box;
-        padding: 0 30px;
+        padding: 0 10px;
         border:1px solid #E2E5EF;
         border-collapse: collapse;
     }
     .moduleNumber{
         text-align: center;
     }
+    .scoreOperaItem{
+        width: 50px;
+        cursor: pointer;
+    }
     
 }
+.tabFoot{
+    height: 50px;
+    border: 1px solid #E2E5EF;
+    border-top: none;
+    box-sizing: border-box;
+    margin-right: 1px;
+}
+.scoreOpera{
+    height: 50px;
+    line-height: 50px;
+    margin: 0 20px 0 17px;
+    cursor: pointer;
+    img{
+        margin: 0 10px 0 0;
+    }
+}
+
+.recordScoreOperaBtn{
+    cursor: pointer;
+    color: #5A8EEE;
+}
+.recordScoreBtn{
+    cursor: pointer;
+    display: inline-block;
+    width:68px;
+    height:30px;
+    line-height: 30px;
+    text-align: center;
+    border-radius:4px;
+    box-sizing: border-box;
+    border: 1px solid #5A8EEE;
+    color: #5A8EEE;
+}
 .filterBox{
     margin: 0 0 20px 0;
 }
@@ -39,8 +76,54 @@ table{
     margin-right: 20px;
     height: 40px;
     line-height: 40px;
+    input{
+        width:120px;
+        height:40px;
+        border-radius:4px;
+        border: 1px solid #E2E5EF;
+        outline: none;
+        margin-right: 10px;
+        padding: 0 10px;
+    }
+}
+.filter{
+    display: inline-block;
+    width:60px;
+    height:36px;
+    background:#5A8EEE;
+    border-radius:4px;
+    color: #fff;
+    text-align: center;
+    line-height: 36px;
+    position: relative;
+    top: -2px;
+}
+.iconCheck{
+    width: 14px;
+}
+.datapickerBox{
+    position: relative;
+    display: inline-block;
+    width: 150px;
+    height: 40px;
+    top: 10px;
+    input{
+        position: absolute;
+    }
+}
+.iconCalen{
+    position: absolute;
+    width: 15px;
+    top: 15px;
+    right: 20px;
+}
+.textCenter{
+    text-align: center;
+}
+.patientNameSpan{
+    color: #5A8EEE;
+    cursor: pointer;
 }
-
 
 
 
@@ -51,13 +134,21 @@ table{
 .activePage{
     color: #5A8EEE;
 }
-.pageNum,.prePage,.nextPage{
-    cursor: pointer;
-}
-.pageNum, .more{
+.pageNum,.prePage,.nextPage, .more{
     display: inline-block;
     width: 20px;
+    cursor: pointer;
     margin: 0 20px 0 0;
+    text-align: center;
+}
+.prePage,.nextPage{
+    img{
+        position: relative;
+        top: -2px;
+    }
+}
+ .more{
+    cursor: not-allowed;
 }
 .arrowPage{
     width: 6px;

+ 24 - 16
src/html/qcList.html

@@ -16,37 +16,45 @@
             <div class="filterBox">
                 <span class="filterItem typeFilter">
                     <span>输入搜索:</span>
-                    <input class="moduleItemInp" type="text" placeholder="请输入病案号">
+                    <input class="patientNumInp" type="text" placeholder="请输入病案号">
                     <input class="patientNameInp" type="text" placeholder="请输入病人姓名">
                 </span>
                 <span class="filterItem">
                     <span>出院日期</span>
-                    <input type="text" id="datepicker">
+                    <span class="datapickerBox"><input type="text" id="datepicker" autocomplete="off" /></span> -
+                    <span class="datapickerBox"><input type="text" id="datepicker2"  autocomplete="off" /></span>
                 </span>
                 
                 <span class="filter">查询</span>
             </div>
             <table>
                 <thead>
-                    <th class="scoreOpera" data-selectAll=false>未选择</th>
-                    <th class="beHospitalId">病历号</th>
-                    <th class="patientNo">病案号</th>
-                    <th class="patientName">病人姓名</th>
-                    <th class="patientSex">性别</th>
-                    <th class="patientage">年龄</th>
-                    <th class="bedNum">床号</th>
-                    <th class="inHospitalDate">入院日期</th>
-                    <th class="outHospitalDate">出院日期</th>
-                    <th class="doctorName">主治医生</th>
-                    <th class="deptName">科室</th>
-                    <th class="recordLevel">病历等级</th>
-                    <th class="recordScore">病历得分</th>
-                    <th class="scoreTime">评分时间</th>
+                    <th class="textCenter" ></th>
+                    <th class="beHospitalId textCenter">病历号</th>
+                    <th class="patientNo textCenter">病案号</th>
+                    <th class="patientName textCenter">病人姓名</th>
+                    <th class="patientSex textCenter">性别</th>
+                    <th class="patientage textCenter">年龄</th>
+                    <th class="bedNum textCenter">床号</th>
+                    <th class="inHospitalDate textCenter">入院日期</th>
+                    <th class="outHospitalDate textCenter">出院日期</th>
+                    <th class="doctorName textCenter">主治医生</th>
+                    <th class="deptName textCenter">科室</th>
+                    <th class="recordLevel textCenter">病历等级</th>
+                    <th class="recordScore textCenter">病历得分</th>
+                    <th class="scoreTime textCenter">评分时间</th>
+                    <th class="recordScoreOpera textCenter">操作</th>
                 </thead>
                 <tbody>
     
                 </tbody>
             </table>
+            <div class="tabFoot">
+                <span class="scoreOpera" data-selectAll=false><img class="iconCheck" src="" alt="checkbox">全选</span>
+                <span class="recordScoreBtn">评分</span>
+            </div>
+
+            <div class="pagination"></div>
         </div>
         
     </div>

BIN
src/images/icon_calen_blue.png


BIN
src/images/icon_calen_grey.png


BIN
src/images/icon_check.png


BIN
src/images/icon_unchecked.png


+ 201 - 30
src/js/qcList.js

@@ -1,34 +1,66 @@
 const $ = require('jquery');
 require("../css/qcList.less");
-// require("./../resource/My97DatePicker/WdatePicker.js")
-// require("./../resource/My97DatePicker/skin/WdatePicker.css")
+
 const {api} = require('./api.js')
 const {post} = require('./utils.js')
 require('./../resource/jquery-ui/jquery-ui.min.js');
 require('./../resource/jquery-ui/jquery-ui.min.css');
-require('./../resource/layui/css/layui.css');
+const iconCheck= require("./../images/icon_check.png")
+const iconUnCheck = require("./../images/icon_unchecked.png")
+const  iconCalenBlue= require("./../images/icon_calen_blue.png")
+const  iconCalenGrey= require("./../images/icon_calen_grey.png")
+const iconDown= require("./../images/arrow_down.png")
+const iconUp = require("./../images/arrow_up.png")
+const loadingImg = require("./../images/loading.gif")
+const arrowLeft= require("./../images/arrow_left.png")
+const arrowRight = require("./../images/arrow_right.png")
 
-let tabList
+let tabList = [], name = "", fileCode="", leaveHosDateStart="", leaveHosDateEnd="", scoreSum = 0
 
-function getTabData(){
+$('.datapickerBox').append(`<img class="iconCalen" src=${iconCalenGrey} />`)
+$('.iconCalen').on("mouseenter", function(e){
+    $(this).attr("src", iconCalenBlue)
+})
+$('.iconCalen').on("mouseleave", function(e){
+    $(this).attr("src", iconCalenGrey)
+})
+$('.iconCalen').on("click", function(e){
+    $(this).parent().find("input").focus()
+})
+function getTabData(activePage){
     const param = {
-        fileCode: "",
-        name: "", //条目名
-        behosDateStart: "", //1-单项否决 0-非
-        leaveHosDateEnd: "" //0-未启用 1-启用
+        current:activePage,
+        fileCode: fileCode,
+        name: name, //条目名
+        leaveHosDateStart: leaveHosDateStart, //1-单项否决 0-非
+        leaveHosDateEnd: leaveHosDateEnd //0-未启用 1-启用
     }
     post(api.qcList,param).then(res =>{
         console.log('ress', res)
         if(res.data.code == '0'){
             tabList = res.data.data.records
+            const totalPage = res.data.data.pages
+            const totalNum = res.data.data.total
             renderTab(tabList)
+            renderPagination(totalPage,activePage,totalNum)
+            if(totalPage > 1){
+                renderPagination(totalPage,activePage,totalNum)
+            } else{
+                $('.pagination').html("")
+            }
         }else{}
     }).catch((e) =>{
     
     })
 }
 
-getTabData()
+getTabData(1)
+
+$(".filter").on("click", function(e){
+    leaveHosDateStart = $("#datepicker").val().trim()
+    leaveHosDateEnd = $("#datepicker2").val().trim()
+    getTabData(1)
+})
 function renderTab(data){
     let str = ``
     let hasSelectAll = true
@@ -39,33 +71,48 @@ function renderTab(data){
         }
         str += `
             <tr  data-index=${i}>
-                <td class="scoreOperaItem">${item.hasSelect ? '选择':'未选择'}</td>
-                <td>${item.behospitalCode}</td>
-                <td>${item.fileCode}</td>
-                <td>${item.name}</td>
-                <td>${item.sex}</td>
-                <td>${item.age}</td>
-                <td>${item.bedCode}</td>
-                <td>${item.behospitalDate}</td>
-                <td>${item.leaveHospitalDate}</td>
-                <td>${item.doctorName}</td>
-                <td>${item.behDeptName}</td>
-                <td>${item.level}</td>
-                <td>${item.scoreRes}</td>
-                <td>${item.gradeTime}</td>
+                <td class="scoreOperaItem textCenter">${item.hasSelect ? `<img class="iconCheck" src=${iconCheck} />`:`<img class="iconCheck" src=${iconUnCheck} />`}</td>
+                <td >${item.behospitalCode || ""}</td>
+                <td>${item.fileCode || ""}</td>
+                <td  class="textCenter"><span  data-index=${i} class="patientNameSpan">${item.name || ""}<span></td>
+                <td  class="textCenter">${item.sex || ""}</td>
+                <td  class="textCenter">${item.age || ""}</td>
+                <td  class="textCenter">${item.bedCode || ""}</td>
+                <td  class="textCenter">${item.behospitalDate&&item.behospitalDate.slice(0,10)}</td>
+                <td  class="textCenter">${item.leaveHospitalDate&&item.leaveHospitalDate.slice(0,10)}</td>
+                <td  class="textCenter">${item.doctorName || ""}</td>
+                <td  class="textCenter">${item.behDeptName || ""}</td>
+                <td  class="textCenter">${item.level || ""}</td>
+                <td  class="textCenter">${item.scoreRes || ""}</td>
+                <td  class="textCenter">${item.gradeTime&&item.gradeTime.slice(0,10) || ""}</td>
+                <td  class="recordScoreOperaBtn textCenter">评分</td>
             </tr>
         `
     }
     if(hasSelectAll){
-        $('.scoreOpera').html("选择")
+        $('.scoreOpera img').attr("src" ,iconCheck)
         $('.scoreOpera').attr("data-selectall",true)
     }else{
-        $('.scoreOpera').html("未选择")
+        $('.scoreOpera img').attr("src" ,iconUnCheck)
         $('.scoreOpera').attr("data-selectall",false)
     }
     $('tbody').html(str)
     bindScoreOperaItem()
+    bindRecordScoreOper()
+    bindScoreDetail()
 }
+
+function scoreDetail(id){
+    window.open(`./qcScore.html?id=${id}`)
+}
+function bindScoreDetail(){
+    $('.patientNameSpan').on('click',function(e){
+        const index = $(this).attr("data-index")
+        const id = tabList[index].behospitalCode
+        scoreDetail(id)
+    })
+}
+
 //全选绑定
 bindOperaAll()
 function bindScoreOperaItem(){
@@ -76,7 +123,14 @@ function bindScoreOperaItem(){
         renderTab(tabList)
     })
 }
-
+function bindRecordScoreOper(){
+    $(".recordScoreOperaBtn").on("click",  function(e){
+        const index = $(this).parent().attr("data-index")
+        const behospitalCode = tabList[index].behospitalCode
+        loading()
+        recordScore(behospitalCode,1)
+    })
+}
 function bindOperaAll(){
     $('.scoreOpera').on("click", function(e){
         const hasSelectAll = $('.scoreOpera').attr("data-selectall")
@@ -94,20 +148,62 @@ function bindOperaAll(){
         renderTab(tabList)
     })
 }
-
-function recordScore(behospitalCode){
+function loading(){
+    const str = `
+    <div class="loadingBox">
+            <div class="mask"></div>
+            <img class="loadingImg" src=${loadingImg}  alt="loading" />
+        </div>
+    `
+    $("#mainBox", parent.document).append(str)
+}
+function hideLoading(){
+    $("#mainBox .loadingBox", parent.document).remove()
+}
+$('.recordScoreBtn').on("click",function(e){
+    let scoreList = []
+    for(let i = 0; i <tabList.length; i++){
+        if(tabList[i].hasSelect){
+            scoreList.push(tabList[i].behospitalCode)
+        }
+    }
+    if(scoreList.length === 0){
+        return
+    } else{
+        loading()
+        for(let j = 0; j < scoreList.length; j++){
+            recordScore(scoreList[j],scoreList.length)
+        }
+    }
+})
+function recordScore(behospitalCode,totalNum){
     const param = {
         behospitalCode: behospitalCode
     }
     post(api.recordScore,param).then(res =>{
         if(res.data.code == '0'){
+            scoreSum++
+            if(scoreSum === totalNum){
+                hideLoading()
+                scoreSum = 0
+                const activePage = $(".activePage").attr('data-page') || 1
+
+                getTabData(activePage)
+            }
       
         }else{}
     }).catch((e) =>{
     
     })
 }
-
+$(".patientNumInp").on("input", function(e){
+    const val = $(this).val().trim()
+    fileCode = val
+})
+$(".patientNameInp").on("input", function(e){
+    const val = $(this).val().trim()
+    name = val
+})
 
 $(function() {
     $.datepicker.regional['zh-CN'] = {
@@ -148,7 +244,82 @@ $(function() {
         changeYear: true,
         dateFormat:"yy/mm/dd"
     });
+    $( "#datepicker2" ).datepicker({
+        changeMonth: true,
+        changeYear: true,
+        dateFormat:"yy/mm/dd"
+    });
 });
 
+//分页渲染
+function renderPagination(totalPage,activePage,totalNum){
+    let str = `<span class="totalSum">共${totalPage}页/${totalNum}条数据</span><span class="prePage"><img class="arrowPage" src=${arrowLeft} /></span>`
+    if(totalPage <= 6){
+        for(let i = 1; i <= totalPage; i++){
+          
+            str += `<span class="pageNum ${'page'+i}" data-page=${i}>${i}</span>`
+        }
+    }else{
+        if(activePage <= 3){ //选中页数小于4
+            for(let i = 1; i <= 4; i++){
+                str += `<span class="pageNum ${'page'+i}" data-page=${i}>${i}</span>`
+            }
+            str += `<span class="more" >...</span>`
+        str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
+
+        } else if(activePage > totalPage -3){
+            str += `<span class="pageNum page1" data-page=1>1</span>`
+            str += `<span class="more" >...</span>`
+            str += `<span class="pageNum ${'page'+(totalPage-3)}" data-page=${totalPage -3}>${totalPage -3}</span>`
+            str += `<span class="pageNum ${'page'+(totalPage-2)}" data-page=${totalPage -2}>${totalPage -2}</span>`
+            str += `<span class="pageNum ${'page'+(totalPage-1)}" data-page=${totalPage -1}>${totalPage -1}</span>`
+            str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
+        } else {
+            str += `<span class="pageNum page1" data-page=1>1</span>`
+            str += `<span class="more" >...</span>`
+            str += `<span class="pageNum ${'page'+(activePage -1)}" data-page=${activePage -1}>${activePage -1}</span>`
+            str += `<span class="pageNum ${'page'+activePage}" data-page=${activePage}>${activePage}</span>`
+            str += `<span class="pageNum ${'page'+(activePage +1)}" data-page=${activePage +1}>${activePage +1}</span>`
+            str += `<span class="more" >...</span>`
+            str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
+        }
+       
+    }
+    str += `<span class="nextPage"><img class="arrowPage" src=${arrowRight} /></span>`
+    $('.pagination').html(str)
+    $('.page' + activePage).addClass('activePage')
+    $(".pageNum").on("click", function(e){
+        const activePageNow = Number($(this).attr('data-page'))
+        getTabData(activePageNow)
+        // renderPagination(totalPage,activePageNow,totalNum)
+    })
+    $(".prePage").on("click", function(e){
+        let activePageNow = Number($(".activePage").attr('data-page'))
+        if(activePageNow > 1){
+            activePageNow--
+            getTabData(activePageNow)
+            // renderPagination(totalPage,activePageNow,totalNum)
+        }
+    })
+    $(".nextPage").on("click", function(e){
+        let activePageNow = Number($(".activePage").attr('data-page'))
+        if(activePageNow < totalPage){
+            activePageNow++
+            getTabData(activePageNow)
+            // renderPagination(totalPage,activePageNow,totalNum)
+        }
+    })
+    
+}
+
+$(document).on("click", function(){
+    $(".moduleTypeList ").css("display", "none")
+    $(".rejectList ").css("display","none")
+    $(".usedList ").css("display", "none")
+    $(".selectModuleType .arrow").attr("src",iconDown)
+    $(".selectReject .arrow").attr("src",iconDown)
+    $(".selectUsed .arrow").attr("src",iconDown)
+})
+
 $((function($){
 })($));