project-detail.html 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199
  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">执&ensp;行&ensp;人:{{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" v-html="getContent(record.content, record.contentType)"></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="../../../plugins/toastr/toastr.min.js"></script>
  68. <script src="../../../js/bootstrap.min.js"></script>
  69. <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
  70. <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
  71. <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
  72. <script src="../../../api/http-request.js" type="text/javascript"></script>
  73. <script src="../../../api/recover_api.js" type="text/javascript"></script>
  74. <script type="text/javascript">
  75. var doctorType = (JSON.parse(window.localStorage.getItem('wlyyAgent'))||{}).doctorType
  76. var httpData=GetRequest()
  77. function showSuccessMessage(msg) {
  78. layer.msg(msg, {
  79. icon: 1
  80. })
  81. }
  82. function showErrorMessage(msg) {
  83. layer.msg(msg, {
  84. icon: 5
  85. })
  86. }
  87. function showWarningMessage(msg) {
  88. layer.msg(msg, {
  89. icon: 2
  90. })
  91. }
  92. function showInfoMessage(msg) {
  93. layer.msg(msg, {
  94. icon: 6
  95. })
  96. }
  97. selectVue = new Vue({
  98. el: "#app",
  99. data: {
  100. isShowMore: false,
  101. planDetail: {}
  102. },
  103. mounted: function() {
  104. this.serviceItem()
  105. },
  106. methods: {
  107. changeShow: function() {
  108. this.isShowMore = !this.isShowMore
  109. },
  110. serviceItem: function() {
  111. var vm = this,
  112. loadding = layer.load(0, {shade: false}),
  113. params = {
  114. planDetailId: httpData.planId
  115. }
  116. recoverAPI.serviceItem(params).then(function(res) {
  117. layer.close(loadding)
  118. if(res.status == 200) {
  119. vm.planDetail = res.data
  120. } else {
  121. showErrorMessage(res.msg);
  122. }
  123. })
  124. },
  125. handleArr: function(arr) {
  126. if(!arr) {
  127. return false;
  128. }
  129. return arr.join()
  130. },
  131. handleTime: function(time) {
  132. var getTime = new Date(time),
  133. morth = getTime.getMonth() + 1
  134. return getTime.getFullYear() + '-' + this.addZero(morth) + '-' + this.addZero(getTime.getDay()) + " " + this.addZero(getTime.getHours()) + ":" + this.addZero(getTime.getMinutes())
  135. },
  136. addZero: function(num) {
  137. return num >= 10 ? num : '0' + num
  138. },
  139. lookPhoto: function(src) {
  140. parent.photoLayerIndex = parent.layer.open({
  141. type: 2,
  142. area: ['400px', '400px'],
  143. title: false,
  144. shade: 0.5,
  145. shadeClose: true,
  146. content: '../html/photo_show.html?src=' + src
  147. })
  148. },
  149. handleImg: function(src) {
  150. var str = httpRequest.getImgUrl(src);
  151. return str
  152. },
  153. getContent: function(value, type) {
  154. var res=value;
  155. if(type==2 || type==9){
  156. res = "<img src='"+httpRequest.getImgUrl(res)+"'>";
  157. }else if(type==3){
  158. res = '【语音】';
  159. }else if(type==19){
  160. res = '【聊天记录】';
  161. }else if(type==12){
  162. res = '【视频】';
  163. }
  164. return res;
  165. },
  166. viewDetial:function(type,code){
  167. var vm=this;
  168. if(type == 3) {
  169. top.layer.msg('客户端暂不支持查询健康指导记录');
  170. } else if (type==4){
  171. top.layer.msg('客户端暂不支持查询随访记录');
  172. } else {
  173. top.layer.open({
  174. type: 2,
  175. // offset: ['100px'], //右下角弹出
  176. area: ['80%', '600px'],
  177. shade: 0.5,
  178. title: '指导教育',
  179. fixed: true, //不固定
  180. maxmin: true,
  181. closeBtn: 1,
  182. shift: 5,
  183. shadeClose: false, //点击遮罩关闭层
  184. content: '../../article/html/article-info.html?articleId=' + code,
  185. end: function() { // 未点击确定按钮,点击关闭按钮
  186. // vm.getServiceItem();    
  187. }
  188. });
  189. }
  190. }
  191. }
  192. })
  193. </script>
  194. </body>
  195. </html>