project-detail.html 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  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 rel="stylesheet" type="text/css" href="../css/project-detail.css" />
  10. </head>
  11. <body class="m0">
  12. <div id="app" style="height: 100%;" v-cloak>
  13. <h4 class="p0 pt10 pb5 m0 plr30">{{planDetail.title}}</h4>
  14. <p class="p0 m0 plr30 pb5 c-border-b c-333 clearfix">
  15. <span class="fl plr10 lh18 c-border border-c12b7f5 c-12b7f5 mr10 b-r-3">{{planDetail.shortExecuteTime}}</span>
  16. <span class="fl plr10 lh18 c-border border-c12b7f5 c-12b7f5 mr10 b-r-3" v-for="(name, index) in planDetail.executeDoctorList" :key="index">{{name}}</span>
  17. <span class="fr pl20 c-12b7f5 set-finish">{{planDetail.statusName}}</span>
  18. </p>
  19. <div style="overflow: hidden; height: calc(100% - 60px);">
  20. <div class="plr15 c-999" style="overflow: auto; height: 100%;">
  21. <p class="p0 m0 ptb10 c-border-b">项目内涵:{{planDetail.content}}</p>
  22. <div class="ptb10 c-border-b clearfix">
  23. <span class="fl w-50 mb5">地点:{{planDetail.hospitalName}}</span>
  24. <span class="fl w-50 mb5">执行:{{handleArr(planDetail.executeDoctorList)}}</span>
  25. <span class="fl w-50">时间:{{handleTime(planDetail.executeTime)}}</span>
  26. <span class="fl w-50">收费:{{planDetail.expense}}元</span>
  27. </div>
  28. <p class="p0 m0 ptb10 c-333 clearfix">指导与汇报记录<span class="fr pl15 set-show c-12b7f5" :class="{'active':isShowMore}" @click="changeShow()">{{isShowMore ? "收起详情" : "查看详情"}}</span></p>
  29. <ul class="p0 m0" v-show="isShowMore">
  30. <li class="bgc-f2fcfe plr10 ptb10 mb10" v-for="(record, index) in planDetail.messageList" :key="index">
  31. <p class="m0 p0 mb10 clearfix">
  32. <span class="fl w-50">{{record.doctorName}}&emsp;{{record.adminTeamName}}</span>
  33. <span class="fl w-50">{{record.createTime}}</span>
  34. </p>
  35. <p class="m0 p0 c-333">{{record.content}}</p>
  36. </li>
  37. <li class="c-t-center" v-if="!planDetail.messageList.length">暂无记录</li>
  38. </ul>
  39. <p class="m0 p0 ptb10 c-333 c-border-b">完成信息</p>
  40. <div class="ptb10">
  41. <p class="m0 p0 mb5">完成时间:<span class="c-333">{{planDetail.completeTime}}</span></p>
  42. <p class="m0 p0">执行医生:<span class="c-333">{{planDetail.operatorDoctorName}}</span></p>
  43. </div>
  44. <p class="m0 p0 ptb10 c-333 c-border-b">服务完成笔记</p>
  45. <div class="ptb10">
  46. {{planDetail.node}}
  47. </div>
  48. <p class="m0 p0 ptb10 c-333">相关记录</p>
  49. <ul class="p0 m0 ptb10 plr10 mb10 c-border b-r-3 clearfix">
  50. <li class="fl set-photo c-border mr10 cur-pit clearfix" v-for="(record, index) in planDetail.relationRecordImg" :key="index">
  51. <img class="fl" :src="handleImg(record)" alt="记录图" @click="lookPhoto(record)" />
  52. </li>
  53. <li class="c-t-center" v-if="planDetail.relationRecordImg && !planDetail.relationRecordImg.length">暂无相关记录</li>
  54. </ul>
  55. <div class="mb20" v-if="(planDetail.type==2 || planDetail.type==3 || planDetail.type==4) && planDetail.relationRecordCode">
  56. <p class="m0 p0 ptb10 f14 c-333">关联记录</p>
  57. <p class="m0 p0 ptb10 c-border b-r-3 c-t-center cur-pit c-333 clearfix" @click="viewDetial(planDetail.type,planDetail.relationRecordCode)">
  58. <span class="fl"><i class="icon icon-arrow-right"></i></span>{{planDetail.type==2?'健康文章':(planDetail.type==3?'健康指导':'随访记录')}}&emsp;{{planDetail.completeTimeShort}}
  59. </p>
  60. </div>
  61. </div>
  62. </div>
  63. </div>
  64. <script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
  65. <script src="../../../js/jquery-2.2.4.js"></script>
  66. <script src="../../../plugins/layer/layer.min.js"></script>
  67. <script src="../../../js/bootstrap.min.js"></script>
  68. <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
  69. <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
  70. <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
  71. <script src="../../../api/http-request.js" type="text/javascript"></script>
  72. <script src="../../../api/recover_api.js" type="text/javascript"></script>
  73. <script type="text/javascript">
  74. var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType
  75. var httpData=GetRequest()
  76. function showSuccessMessage(msg) {
  77. layer.msg(msg, {
  78. icon: 1
  79. })
  80. }
  81. function showErrorMessage(msg) {
  82. layer.msg(msg, {
  83. icon: 5
  84. })
  85. }
  86. function showWarningMessage(msg) {
  87. layer.msg(msg, {
  88. icon: 2
  89. })
  90. }
  91. function showInfoMessage(msg) {
  92. layer.msg(msg, {
  93. icon: 6
  94. })
  95. }
  96. selectVue = new Vue({
  97. el: "#app",
  98. data: {
  99. isShowMore: false,
  100. planDetail: null
  101. },
  102. mounted: function() {
  103. this.serviceItem()
  104. },
  105. methods: {
  106. changeShow: function() {
  107. this.isShowMore = !this.isShowMore
  108. },
  109. serviceItem: function() {
  110. var vm = this,
  111. loadding = layer.load(0, {shade: false}),
  112. params = {
  113. planDetailId: httpData.planId
  114. }
  115. recoverAPI.serviceItem(params).then(function(res) {
  116. layer.close(loadding)
  117. if(res.status == 200) {
  118. vm.planDetail = res.data
  119. } else {
  120. showErrorMessage(res.msg);
  121. }
  122. })
  123. },
  124. handleArr: function(arr) {
  125. return arr.join()
  126. },
  127. handleTime: function(time) {
  128. var getTime = new Date(time),
  129. morth = getTime.getMonth() + 1
  130. return getTime.getFullYear() + '-' + this.addZero(morth) + '-' + this.addZero(getTime.getDay()) + " " + this.addZero(getTime.getHours()) + ":" + this.addZero(getTime.getMinutes())
  131. },
  132. addZero: function(num) {
  133. return num >= 10 ? num : '0' + num
  134. },
  135. lookPhoto: function(src) {
  136. parent.photoLayerIndex = parent.layer.open({
  137. type: 2,
  138. area: ['400px', '400px'],
  139. title: false,
  140. shade: 0.5,
  141. shadeClose: true,
  142. content: '../html/photo_show.html?src=' + src
  143. })
  144. },
  145. handleImg: function(src) {
  146. var str = httpRequest.getImgUrl(src);
  147. return str
  148. },
  149. viewDetial:function(type,code){
  150. var vm=this;
  151. if (type==3 || type==4){
  152. top.layer.msg('客户端暂不支持查询随访记录');
  153. } else {
  154. top.layer.open({
  155. type: 2,
  156. // offset: ['100px'], //右下角弹出
  157. area: ['80%', '600px'],
  158. shade: 0.5,
  159. title: '指导教育',
  160. fixed: true, //不固定
  161. maxmin: true,
  162. closeBtn: 1,
  163. shift: 5,
  164. shadeClose: false, //点击遮罩关闭层
  165. content: '../../article/html/article-info.html?articleId=' + code,
  166. end: function() { // 未点击确定按钮,点击关闭按钮
  167. vm.getServiceItem();    
  168. }
  169. });
  170. }
  171. }
  172. }
  173. })
  174. </script>
  175. </body>
  176. </html>