select-patient.html 8.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>同步出院小结</title>
  6. <link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
  7. <link rel="stylesheet" type="text/css" href="../../../css/cross.ui.css" />
  8. <link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
  9. <link href="../../../plugins/toastr/toastr.min.css" rel="stylesheet">
  10. <link rel="stylesheet" type="text/css" href="../css/select-patient.css" />
  11. </head>
  12. <body class="m0">
  13. <div id="app" style="height: 100%;" v-cloak>
  14. <div class="plr20 ptb10 c-border-b">
  15. <div class="clearfix c-border">
  16. <input class="fl search-input plr10" type="text" placeholder="输入居民姓名或身份证号码" v-model="keyword" />
  17. <span class="fr search-btn" @click="getPatientInfoByDoctor()"></span>
  18. </div>
  19. </div>
  20. <div style="overflow: hidden; height: calc(100% - 59px);">
  21. <ul class="pat-list p0 m0" style="overflow: auto; height: 100%;" v-if="isSearch">
  22. <li class="clearfix lh40 plr20 ptb10" v-for="(pati, index) in patiList" :key="index" @click="getPatientInfo(pati)">
  23. <div class="fl set-img">
  24. <img :src="setPatImg(pati.photo)" alt="居民头像" />
  25. </div>
  26. <span class="fl ml20 mr10 c-333 c-f16">{{pati.patientName}}</span>
  27. <span class="fl c-999">({{pati.sex}}&emsp;{{pati.age}}岁)</span>
  28. </li>
  29. <li v-if="!patiList.length" class="c-t-center pt40 set-no-hover">无查询数据</li>
  30. </ul>
  31. <ul class="label-list p0 m0" style="overflow: auto; height: 100%;" v-if="isLabel">
  32. <li v-for="(label, index) in labelList" :key="index">
  33. <h4 class="c-border-b m0 lh40 pl10 pr50 cur-pit clearfix" @click="selectIndexFn(index, label)" :class="{'active':selectIndex == index}">{{label.labelName}}<span class="fr">{{label.count}}</span></h4>
  34. <ul class="pat-list p0 m0 c-border-b" v-if="selectIndex == index">
  35. <li class="clearfix lh40 plr20 ptb10 cur-pit" v-for="(pati, ind) in patiList" @click="getPatientInfo(pati)">
  36. <div class="fl set-img">
  37. <img :src="setPatImg(pati.photo)" alt="居民头像" />
  38. </div>
  39. <span class="fl ml20 mr10 c-333 c-f16">{{pati.patientName}}</span>
  40. <span class="fl c-999">({{pati.sex}}&emsp;{{pati.age == 0 ? "<1" : pati.age}}岁)</span>
  41. </li>
  42. </ul>
  43. </li>
  44. </ul>
  45. <div class="selected-patient c-h100" v-if="!isSearch && !isLabel">
  46. <div class="clearfix plr20 ptb10">
  47. <div class="fl set-img">
  48. <img :src="setPatImg(patiInfo.photo)" alt="居民头像" />
  49. </div>
  50. <div class="fl ml10 set-txt c-999 clearfix">
  51. <div class="m0 lh22 clearfix"><span class="c-333 c-f16">{{patiInfo.patientName}}</span>&emsp;{{patiInfo.sex}}&emsp;{{patiInfo.age}}岁<p class="fr m0 p0 c-f14 mr20 c-333">出院医嘱:<span>0</span></p></div>
  52. <p class="m0">身份证号: <span class="c-333 c-f14">{{patiInfo.idcard}}</span></p>
  53. </div>
  54. </div>
  55. <div class="result plr20" style="overflow: hidden; height: calc(100% - 60px);">
  56. <div class="no-result c-t-center c-border-t ptb20" v-if="true">
  57. <img src="../images/wushuju01_img.png" alt="" />
  58. <p class="c-999 mt10 mb20">暂无相关信息</p>
  59. <span class="c-fff btn cur-pit plr10 ptb5 bgc-12b7f5 b-r-3" @click="selectPatient()">同步居民</span>
  60. </div>
  61. <ul class="p0 m0 c-333 c-border-t" style="overflow: auto; height: 100%;" v-if="false">
  62. <li class="ptb10 c-border-b">
  63. <div class="clearfix">
  64. <p class="fl p0 m0 w-100-70"><span class="c-999">出院医嘱:</span>这是出院医学征服世界爱的色放卡大V阿大V撒<span class="ml10 c-12b7f5 txt-underline cur-pit" @click="showLayer()">查看</span></p>
  65. <span class="fr w40 c-t-center c-fff btn cur-pit plr10 ptb5 bgc-12b7f5 b-r-3" @click="selectPatient()">提取</span>
  66. </div>
  67. <div class="clearfix mt5">
  68. <p class="fl m0"><span class="c-999">主治医生:</span>名字</p>
  69. <p class="fr m0"><span class="c-999">出院时间:</span>2018-08-28</p>
  70. </div>
  71. </li>
  72. </ul>
  73. </div>
  74. </div>
  75. </div>
  76. </div>
  77. <script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
  78. <script src="../../../js/jquery-2.2.4.js"></script>
  79. <script src="../../../plugins/layer/layer.min.js"></script>
  80. <script src="../../../plugins/toastr/toastr.min.js"></script>
  81. <script src="../../../js/bootstrap.min.js"></script>
  82. <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
  83. <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
  84. <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
  85. <script src="../../../api/http-request.js" type="text/javascript"></script>
  86. <script src="../../../api/recover_api.js" type="text/javascript"></script>
  87. <script type="text/javascript">
  88. var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType,
  89. doctorCode = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).uid
  90. var httpData=GetRequest()
  91. function showSuccessMessage(msg) {
  92. layer.msg(msg, {
  93. icon: 1
  94. })
  95. }
  96. function showErrorMessage(msg) {
  97. layer.msg(msg, {
  98. icon: 5
  99. })
  100. }
  101. function showWarningMessage(msg) {
  102. layer.msg(msg, {
  103. icon: 2
  104. })
  105. }
  106. function showInfoMessage(msg) {
  107. layer.msg(msg, {
  108. icon: 6
  109. })
  110. }
  111. selectVue = new Vue({
  112. el: "#app",
  113. data: {
  114. page: 1,
  115. keyword: null,
  116. selectIndex: null,
  117. labelList: [],
  118. isLabel: true,
  119. isSearch: false,
  120. patiList: [],
  121. patiInfo: null
  122. },
  123. mounted: function() {
  124. this.findLabelAndPatientCountByDoctor()
  125. },
  126. methods: {
  127. showLayer: function() {
  128. top.layer.open({
  129. type: 1,
  130. area: ['400px', '500px'],
  131. shade: 0.5,
  132. title: "出院医嘱",
  133. closeBtn: 1,
  134. shift: 5,
  135. shadeClose: true, //点击遮罩关闭层
  136. content: "<div class='plr10 ptb10'>&emsp;&emsp;" + "这是医嘱大的大爱大" + "</div>"
  137. })
  138. },
  139. findLabelAndPatientCountByDoctor: function() {
  140. var vm = this,
  141. loadding = layer.load(0, {shade: false}),
  142. params = {
  143. doctor: doctorCode
  144. }
  145. recoverAPI.findLabelAndPatientCountByDoctor(params).then(function(res) {
  146. layer.close(loadding)
  147. if(res.status == 200) {
  148. vm.labelList = res.data
  149. } else {
  150. showErrorMessage(res.msg);
  151. }
  152. })
  153. },
  154. getPatientInfoByDoctor: function(label) {
  155. if(!label && !this.keyword) {
  156. this.selectIndex = null
  157. this.isSearch = false
  158. this.isLabel = true
  159. return false
  160. }
  161. var vm = this,
  162. loadding = layer.load(0, {shade: false}),
  163. params = {
  164. doctor: doctorCode,
  165. patientInfo: this.keyword, // 居民身份证或者姓名
  166. disease: label ? label.label : "",
  167. page: vm.page,
  168. size: 50
  169. }
  170. recoverAPI.getPatientInfoByDoctor(params).then(function(res) {
  171. layer.close(loadding)
  172. if(res.status == 200) {
  173. vm.patiList = res.data
  174. if(!label) {
  175. vm.isSearch = true
  176. vm.isLabel = false
  177. }
  178. } else {
  179. showErrorMessage(res.msg);
  180. }
  181. })
  182. },
  183. getPatientInfo: function(pati) {
  184. this.isSearch = false
  185. this.isLabel = false
  186. this.patiInfo = pati
  187. },
  188. selectIndexFn: function(index, label) {
  189. if(this.selectIndex == index) {
  190. this.selectIndex = null
  191. } else {
  192. this.selectIndex = index
  193. this.getPatientInfoByDoctor(label)
  194. }
  195. },
  196. selectPatient: function() {
  197. top.recoverVue.selectPatientOk(this.patiInfo)
  198. top.layer.close(top.selectPatientIndex)
  199. },
  200. setPatImg: function(src) {
  201. if(!src) {
  202. return "../../../images/p-female.png"
  203. } else {
  204. var str = httpRequest.getImgUrl(src);
  205. return str
  206. }
  207. }
  208. }
  209. })
  210. </script>
  211. </body>
  212. </html>