sousuojigouyisheng.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318
  1. //// TODO 医院、社区列表示例数据
  2. //var orgData = {"msg":"查询成功","list":[{"code":"3502050100","name":"海沧区嵩屿街道社区卫生服务中心",address:"升平路40号"},{"code":"3502050101","name":"海沧社区卫生服务站",address:"升平路40号"},{"code":"3502050200","name":"石塘社区卫生服务中心",address:"升平路40号"},{"code":"3502050300","name":"东孚卫生院",address:"升平路40号"},{"code":"3502050301","name":"天竺社区卫生服务站",address:"升平路40号"},{"code":"3502050302","name":"国营厦门第一农场社区卫生服务站",address:"升平路40号"},{"code":"3502050400","name":"新阳社区卫生服务中心",address:"升平路40号"},{"code":"0a11148d-5b04-11e6-8344-fa163e8aee56","name":"厦门市海沧医院","photo":"",address:"升平路40号"}],"status":200};
  3. //// TODO 医生列表示例数据
  4. //var doctorData = {"msg":"查询成功","list":[
  5. //{"id":"3502050100","consult":"",patient:"P123",photo:"",title:"",name:"张敏敏",age:23,comment:"激光治疗红血丝治疗部位保持清洁,避免感染和摩擦;部位有痂皮的会自行脱落,不要手动进行抠除。",star:3,type:5,time:"2016-09-12 16:49:17",status:"",sex:0,doctorRead:""},
  6. //{"id":"3502050101","consult":"",patient:"P124",photo:"",title:"",name:"李佳佳",age:23,comment:"激光治疗红血丝治疗部位保持清洁",star:3,type:5,time:"2016-09-13 16:49:17",status:"",sex:0,doctorRead:""},
  7. //{"id":"3502050100","consult":"",patient:"P123",photo:"",title:"",name:"张敏敏",age:23,comment:"激光治疗红血丝治疗部位保持清洁,避免感染和摩擦;部位有痂皮的会自行脱落,不要手动进行抠除。",star:3,type:5,time:"2016-09-12 16:49:17",status:"",sex:0,doctorRead:""},
  8. //{"id":"3502050101","consult":"",patient:"P124",photo:"",title:"",name:"李佳佳",age:23,comment:"激光治疗红血丝治疗部位保持清洁",star:3,type:5,time:"2016-09-13 16:49:17",status:"",sex:0,doctorRead:""}],"status":200};
  9. // TODO 临时构造plus对象,使得能够在浏览器中进行调试
  10. //var plus = null;
  11. var plus;
  12. // 基本信息(包括userAgent、上个页面传递的数据)
  13. var baseInfo = null,
  14. // 基础环境信息(包括当前webview)
  15. baseEnv = null;
  16. // 搜索框
  17. var $searchbar = $('.searchbar'),
  18. // 搜索输入框
  19. $searchbarInput = $('.searchbar input'),
  20. // 搜索取消按钮
  21. $searchCancelBtn = $('.searchbar-cancel'),
  22. // 搜索框下面悬浮的搜索提示
  23. $searchSuggest = $('#search_suggest_text'),
  24. // 搜索结果展示容器
  25. $searchtResult = $('#search_result'),
  26. // 搜索无结果时显示
  27. $noResultWrap = $('#no_result_wrap'),
  28. $yiyuanWrapper = $('#yiyuan_wrapper'),
  29. $shequWrapper = $('#shequ_wrapper'),
  30. $yishengWrapper = $('#yisheng_wrapper'),
  31. $yiyuanList = $('#yiyuan_list'),
  32. $shequList = $('#shequ_list'),
  33. $yishengList = $('#yisheng_list'),
  34. $moreResult = $('.more-result');
  35. // 获取基本信息(包括userAgent、上个页面传递的数据)
  36. var getBaseInfoPromise = function() {
  37. // 登录的相关信息
  38. var userAgent = plus && JSON.parse(plus.storage.getItem("userAgent"))
  39. return {
  40. userAgent: userAgent
  41. }
  42. },
  43. // 获取基础环境信息
  44. getBaseEnvPromise = function () {
  45. var env = {
  46. webview: plus&&plus.webview.currentWebview()
  47. };
  48. return Promise.resolve().then(function(res) {
  49. return env;
  50. });
  51. },
  52. // $el: $('.c-content-warp')
  53. getRowProps = function ($el) {
  54. var $textEllipsis = $el.find('.j-text-ellipsis'),
  55. $text = $textEllipsis.eq(0),
  56. $chart = $text.text('a'),
  57. enWidth = $chart.width(),
  58. $chart = $text.text('中'),
  59. zhWidth = $chart.width(),
  60. lineHeight = parseFloat($chart.css("lineHeight"), 10),
  61. rowHeight = $chart.height();
  62. $chart.text('');
  63. return {
  64. chartWidth: {
  65. zh: zhWidth,
  66. en: enWidth
  67. },
  68. rowHeight: Math.max(rowHeight, lineHeight),
  69. rowWidth: $el.width()
  70. };
  71. },
  72. replaceAll = function (text, arr) {
  73. var html = text;
  74. _.each(arr,function(kw) {
  75. var reg = new RegExp(kw+"(?!>)","gi");
  76. html = html.replace(reg,'<em>'+kw+'</em>');
  77. });
  78. return html;
  79. },
  80. highlineKeyword = function ($el,searchText) {
  81. var props = getRowProps($el),
  82. chartWidth = props.chartWidth,
  83. rowHeight = props.rowHeight,
  84. rowWidth = props.rowWidth,
  85. // 每行显示字符数(以中文字符为标准计算)
  86. chartNum = Math.floor(rowWidth / chartWidth.zh),
  87. // 排除指定字符数所占宽度
  88. exceptNum = 0,
  89. // 行数
  90. rowNum = 1,
  91. // 预计显示总字符数
  92. expectedNum = chartNum * rowNum - exceptNum,
  93. $target = $el.find('.j-text-ellipsis'),
  94. // 目标文本
  95. text = $target.attr('data-text').trim(),
  96. length = text.length,
  97. // 关键字数组
  98. kws = searchText.trim().replace(/\s+/g," ").split(" ");
  99. var fidx = 0,preFidx,diff = 0;
  100. $target.html(replaceAll(text, kws));
  101. if(Math.floor($target.height() / rowHeight) <= rowNum) {
  102. return ;
  103. }
  104. if(text.length > expectedNum) {
  105. fidx = text.indexOf(kws[0])+kws[0].length-1;
  106. diff = fidx - expectedNum + 1;
  107. preFidx = fidx;
  108. diff = (diff<0)?0:diff;
  109. var preChar = (diff>0)?"...":"";
  110. $target.html(preChar+replaceAll(text.slice(diff,preFidx+1), kws)+"...");
  111. while((Math.floor($target.height() / rowHeight) <= rowNum) && (preFidx < length)) {
  112. preFidx++;
  113. $target.html(preChar+replaceAll(text.slice(diff,preFidx+1), kws)+"...");
  114. }
  115. if(preFidx == length && (Math.floor($target.height() / rowHeight) <= rowNum)) {
  116. diff = diff>0?(diff - 1):0;
  117. $target.html(preChar+replaceAll(text.slice(diff,preFidx), kws));
  118. } else if((Math.floor($target.height() / rowHeight) > rowNum)) {
  119. $target.html(preChar+replaceAll(text.slice(diff,preFidx), kws)+"...");
  120. }
  121. }
  122. },
  123. ellipsisText = function ($elements, searchText) {
  124. //$el.ellipsis({ row: 2});
  125. _.each($elements,function(el) {
  126. highlineKeyword($(el),searchText)
  127. });
  128. },
  129. // 控制搜索关键字悬浮提示的显示
  130. showSearchSuggest = function(text) {
  131. var suggestText = '搜索“'+text+'”';
  132. // 如果text不为空,则显示;否则隐藏
  133. if(text&&text.trim().length) {
  134. $searchSuggest.text(suggestText);
  135. $searchSuggest.show();
  136. } else {
  137. $searchSuggest.text('');
  138. $searchSuggest.hide();
  139. }
  140. },
  141. // 初始化“医院”视图列表
  142. initYiYuanViewList = function(list) {
  143. var html = template("org_li_tmpl", {list: list.slice(0,3)}),
  144. searchText = $searchbarInput.val().trim();
  145. // 搜索结果小于等于3个时,隐藏“查看更多”
  146. if(list.length<=3) {
  147. $yiyuanWrapper.find('.more-result').hide();
  148. } else {
  149. $yiyuanWrapper.find('.more-result').show();
  150. }
  151. $yiyuanList.html(html);
  152. ellipsisText($yiyuanList.find('.c-content-warp'),searchText);
  153. },
  154. // 初始化“社区”视图列表
  155. initSheQuViewList = function(list) {
  156. var html = template("org_li_tmpl", {list: list.slice(0,3)}),
  157. searchText = $searchbarInput.val().trim();
  158. // 搜索结果小于等于3个时,隐藏“查看更多”
  159. if(list.length<=3) {
  160. $shequWrapper.find('.more-result').hide();
  161. } else {
  162. $shequWrapper.find('.more-result').show();
  163. }
  164. $shequList.html(html);
  165. ellipsisText($shequList.find('.c-content-warp'),searchText);
  166. },
  167. // 初始化“医生”视图列表
  168. initYiShengViewList = function(list) {
  169. var html = template("yisheng_li_tmpl", {list: list.slice(0,3)}),
  170. searchText = $searchbarInput.val().trim();
  171. // 搜索结果小于等于3个时,隐藏“查看更多”
  172. if(list.length<=3) {
  173. $yishengWrapper.find('.more-result').hide();
  174. } else {
  175. $yishengWrapper.find('.more-result').show();
  176. }
  177. $yishengList.html(html);
  178. ellipsisText($yishengList.find('.c-content-warp'),searchText);
  179. },
  180. // 搜索框搜索执行方法
  181. search = function () {
  182. var kw = $searchbarInput.val().trim(),
  183. // "进行中"搜索结果列表数据
  184. doingList = [],
  185. // "已结束"搜索结果列表数据
  186. endList = [],
  187. // TODO promise请求测试示例
  188. //promise = Promise.resolve();
  189. promise = getReqPromises([{url:"doctor/hospitals",data:{id:0,key: kw, type:1, pagesize:4}},
  190. {url:"doctor/hospitals",data:{id:0,key: kw,type:2,pagesize:4}},
  191. {url:"/doctor/findDoctorByDept",data:{id:0,key: kw,page:1,pagesize:4}}])
  192. // 隐藏搜索提示
  193. showSearchSuggest(false);
  194. return kw && promise.then(function(datas){
  195. // TODO 测试数据示例
  196. // var yiyuanList = orgData.list,
  197. // shequList = orgData.list,
  198. // yishengList = doctorData.list;
  199. var yiyuanList = datas[0].list,
  200. shequList = datas[1].list,
  201. yishengList = datas[2].list;
  202. if(!yiyuanList.length && !shequList.length && !yishengList.length) {
  203. $noResultWrap.show();
  204. } else {
  205. $noResultWrap.hide();
  206. $searchtResult.show();
  207. initYiYuanViewList(yiyuanList);
  208. initSheQuViewList(shequList);
  209. initYiShengViewList(yishengList);
  210. }
  211. })
  212. },
  213. // 绑定页面事件
  214. bindEvents = function () {
  215. $searchbarInput.on('input', function() {
  216. var text = $(this).val().trim();
  217. $searchtResult.hide();
  218. showSearchSuggest(text);
  219. }).on('keydown',function(e) {
  220. if (e.which === 13) {
  221. search();
  222. }
  223. });
  224. $searchCancelBtn.on('click',function() {
  225. mui.back();
  226. });
  227. $searchSuggest.on('click',function() {
  228. $searchSuggest.hide();
  229. search();
  230. });
  231. $moreResult.on('click',function() {
  232. var kw = $searchbarInput.val().trim(),
  233. href = $(this).attr('data-href');
  234. openWebview(href,{accessData: {
  235. keyword: kw
  236. }});
  237. });
  238. $searchtResult.on('tap','.list-item',function() {
  239. var code = $(this).attr('data-code');
  240. var oldWebview = plus.webview.getWebviewById('xuanzekeshi');
  241. if(oldWebview) {
  242. oldWebview.close();
  243. }
  244. openWebview("xuanzekeshi.html",{accessData: {
  245. hospital: code,
  246. createNew: true
  247. }});
  248. }).on('tap','.yisheng-list-item',function() {
  249. var code = $(this).attr('data-code');
  250. openWebview("doctor-homepage.html",{accessData: {
  251. doctor: code
  252. }});
  253. });
  254. /*聚焦搜索框事件*/
  255. window.addEventListener("focusSearchInput", function group(e) {
  256. setTimeout(function() {
  257. $searchbarInput.focus();
  258. },0)
  259. });
  260. };
  261. // 页面业务处理流程开始
  262. new Promise(function(resolve, reject) {
  263. // TODO 临时放开
  264. // resolve(true);
  265. mui.plusReady(function() {
  266. var xzksWebview = plus.webview.getWebviewById('xuanzekeshi');
  267. if(xzksWebview) {
  268. xzksWebview.close();
  269. }
  270. mui.back = backToWebviewById('xinzengmingyi');
  271. // plus已经准备好,可以往下执行
  272. resolve(true);
  273. });
  274. }).then(function() {
  275. // 获取基础环境信息
  276. return getBaseEnvPromise().then(function(env) {
  277. baseEnv = env;
  278. }).then(function() {
  279. // 获取登录医生信息
  280. baseInfo = getBaseInfoPromise();
  281. $searchbar.searchBar();
  282. $searchbarInput.focus();
  283. // 绑定页面事件
  284. bindEvents();
  285. })
  286. }).catch(function(e) {
  287. plus.nativeUI.closeWaiting();
  288. console && console.error(e);
  289. });
  290. template.helper("setPhoto", function(p) {
  291. return getImgUrl(p);
  292. });
  293. template.helper("setHosPhoto", function(p) {
  294. if(!p || p == ""){
  295. return '../images/hospital_default.png';
  296. }
  297. return getImgUrl(p);
  298. });