project.html 43 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  6. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7. <meta http-equiv="refresh" content="3600">
  8. <title>{$info['name']}&nbsp;|&nbsp;{:get_config('web_site_title')}&nbsp;&nbsp;</title>
  9. <link rel="Shortcut Icon" href="/logo.png" type="image/x-icon" />
  10. <link rel="stylesheet" href="/static/bootstrap-3.3.7/css/bootstrap.min.css">
  11. <link rel="stylesheet" href="/static/screen/css/style.css">
  12. </head>
  13. <body>
  14. <style>
  15. </style>
  16. <div class="nav-header">
  17. <div class="nav-title">医院后勤管理系统数据大屏</div>
  18. </div>
  19. <div class="main">
  20. <div class="main-left1">
  21. <div class="box">
  22. <div class="box-title">
  23. 医废数据统计
  24. </div>
  25. <div id="waste-count">
  26. </div>
  27. <!-- <div class="user-box">-->
  28. <!-- <img src="/static/screen/images/project/left1.png" alt="">-->
  29. <!-- <div class="user-box-nums">10</div>-->
  30. <!-- <div class="user-box-title">保洁人员</div>-->
  31. <!-- <div class="user-box-header">-->
  32. <!-- <div class="user-box-nums">20%</div>-->
  33. <!-- <div class="user-box-title">保洁</div>-->
  34. <!-- </div>-->
  35. <!-- </div>-->
  36. </div>
  37. </div>
  38. <div class="main-left2">
  39. <div class="box">
  40. <div class="box-title">
  41. 项目在岗人员
  42. </div>
  43. <table class="table2" style="margin: 10px 0;" border="0">
  44. <thead>
  45. <tr>
  46. <th>姓名</th>
  47. <th>已完成任务</th>
  48. <th>最新位置信息</th>
  49. </tr>
  50. </thead>
  51. <tbody id="ys-user">
  52. </tbody>
  53. </table>
  54. </div>
  55. </div>
  56. <div class="main-left3">
  57. <div class="box">
  58. <div class="box-title">
  59. 安保数据统计
  60. </div>
  61. <div class="box-yhyj-chart" id="yhyj-chart"></div>
  62. </div>
  63. </div>
  64. <div class="main-left4">
  65. <div class="box">
  66. <div class="box-title">
  67. 报修任务数据统计
  68. </div>
  69. <div class="box-bx-chart" id="repair-chart"></div>
  70. </div>
  71. </div>
  72. <div class="main-middle1">
  73. <div class="middle-box">
  74. <img class="middle-box-img" src="{$info['img']}" onerror="this.src='/static/screen/images/project/zhongshan.png'" alt="">
  75. <div class="middle-box-title"><?=$info['name']?></div>
  76. <div class="order-box">
  77. <div class="order-box-box">
  78. <img src="/static/screen/images/project/middle22.png" alt="">
  79. <div class="order-box-pos" id="todo-count">
  80. <!-- <div class="order-box-list">-->
  81. <!-- <div>运送任务</div>-->
  82. <!-- <div class="order-box-list-num">1000</div>-->
  83. <!-- </div>-->
  84. <!-- <div class="order-box-list">-->
  85. <!-- <div>维修任务</div>-->
  86. <!-- <div class="order-box-list-num">1000</div>-->
  87. <!-- </div>-->
  88. <!-- <div class="order-box-list">-->
  89. <!-- <div>日常保洁</div>-->
  90. <!-- <div class="order-box-list-num">1000</div>-->
  91. <!-- </div>-->
  92. </div>
  93. </div>
  94. </div>
  95. </div>
  96. </div>
  97. <div class="main-middle2">
  98. <div class="task-box">
  99. <div class="task-box-title">运送任务数据总览</div>
  100. <div style="overflow: hidden" id="yscount-box">
  101. <div class="yscount-box">
  102. <img src="/static/screen/images/project/ybp.png" alt="">
  103. <div class="yscount-box-title">标准时间内送达</div>
  104. <div class="yscount-box-des">完成率</div>
  105. <div class="yscount-box-nums" id="yscount1"></div>
  106. </div>
  107. <div class="yscount-box">
  108. <img src="/static/screen/images/project/ybp.png" alt="">
  109. <div class="yscount-box-title">平均派工时间</div>
  110. <div class="yscount-box-des">单位:分</div>
  111. <div class="yscount-box-nums" id="yscount2"></div>
  112. </div>
  113. <div class="yscount-box">
  114. <img src="/static/screen/images/project/ybp.png" alt="">
  115. <div class="yscount-box-title">未派工任务数量</div>
  116. <div class="yscount-box-des">未派工</div>
  117. <div class="yscount-box-nums" id="yscount3"></div>
  118. </div>
  119. <div class="yscount-box">
  120. <img src="/static/screen/images/project/ybp.png" alt="">
  121. <div class="yscount-box-title">进行中任务数量</div>
  122. <div class="yscount-box-des">进行中</div>
  123. <div class="yscount-box-nums" id="yscount4"></div>
  124. </div>
  125. <div class="yscount-box">
  126. <img src="/static/screen/images/project/ybp.png" alt="">
  127. <div class="yscount-box-title">已完成任务数量</div>
  128. <div class="yscount-box-des">已完成</div>
  129. <div class="yscount-box-nums" id="yscount5"></div>
  130. </div>
  131. <div class="yscount-box">
  132. <img src="/static/screen/images/project/ybp.png" alt="">
  133. <div class="yscount-box-title">被驳回任务数量</div>
  134. <div class="yscount-box-des">被驳回</div>
  135. <div class="yscount-box-nums" id="yscount6"></div>
  136. </div>
  137. </div>
  138. </div>
  139. <div class="task-box">
  140. <div class="task-box-title" style="padding-left: 40px;">运送热点区域总览</div>
  141. <div class="hot-chart" id="hot-chart"></div>
  142. </div>
  143. <div class="bottom-box">
  144. <table class="table2" border="0">
  145. <thead>
  146. <tr>
  147. <th>任务状态</th>
  148. <th>任务内容</th>
  149. <th>发单时间</th>
  150. <th>执行人</th>
  151. <th>派工时间</th>
  152. <th>接收时间</th>
  153. </tr>
  154. </thead>
  155. <tbody id="yunsong-table">
  156. </tbody>
  157. </table>
  158. </div>
  159. </div>
  160. <div class="main-right1">
  161. <div class="box">
  162. <div class="box-title">
  163. 网格化管理数据
  164. </div>
  165. <table class="table2" border="0" style="margin-top: 10px">
  166. <thead>
  167. <tr>
  168. <th>任务大厅</th>
  169. <th>执行人员</th>
  170. <th>任务详情</th>
  171. <th>任务时间</th>
  172. </tr>
  173. </thead>
  174. <tbody id="daily-table">
  175. </tbody>
  176. </table>
  177. </div>
  178. </div>
  179. <div class="main-right2">
  180. <div class="box">
  181. <div class="box-title">
  182. 可视化轨迹展示
  183. </div>
  184. <table class="table2" border="0" style="margin-top: 10px">
  185. <thead>
  186. <tr>
  187. <th>巡更地点</th>
  188. <th>巡更时间</th>
  189. <th>巡更人员</th>
  190. <th>巡更内容</th>
  191. </tr>
  192. </thead>
  193. <tbody id="patrol-table">
  194. </tbody>
  195. </table>
  196. </div>
  197. </div>
  198. <div class="main-right3" id="patrol-img-table">
  199. </div>
  200. </div>
  201. <script src="/static/jquery-1.11.3.min.js"></script>
  202. <script type="text/javascript" src="/static/echarts.js"></script>
  203. <script type="text/javascript" src="/static/layer/layer.js"></script>
  204. <script>
  205. $(window).resize(function(){
  206. location.reload()
  207. });
  208. $(function () {
  209. changeZoom();
  210. });
  211. var orgid = "{$info.id}";
  212. var text = document.title;
  213. var timer;
  214. function loadingTitle() {
  215. clearTimeout(timer);
  216. document.title = text.substring(1,text.length) + text.substring(0,1);
  217. text = document.title.substring(0,text.length);
  218. timer = setTimeout("loadingTitle()", 500)
  219. }
  220. loadingTitle();
  221. getYinhuan();
  222. getRepair();
  223. getHot();
  224. getYsTask();
  225. getDailyTask();
  226. getPatrolTask();
  227. getPatrolImg();
  228. getTodoStis();
  229. getYsUser();
  230. getYsCount();
  231. getWaste();
  232. // getTodo();
  233. // getComment();
  234. // getTodotime();
  235. // getPatrol();
  236. // getDevice();
  237. // getPatrolRecord();
  238. setInterval(function () {
  239. getPatrolTask();
  240. getPatrolImg();
  241. }, 10000);
  242. setInterval(function () {
  243. getYinhuan();
  244. getRepair();
  245. getHot();
  246. getYsTask();
  247. getDailyTask();
  248. getTodoStis();
  249. getYsUser();
  250. getYsCount();
  251. getWaste();
  252. }, 1*60000);
  253. function changeZoom() {
  254. var wb = $(window).width()/1920;
  255. var hb = $(window).height()/1080;
  256. if(wb >= hb){
  257. $('body').css({
  258. 'zoom': hb,
  259. });
  260. }else{
  261. $('body').css({
  262. 'zoom': wb,
  263. });
  264. }
  265. }
  266. function getWaste() {
  267. var url = '/api/screen/project/waste';
  268. $.post(url,{orgid:orgid},function (res) {
  269. if(res.code == 0){
  270. let option = {
  271. color: ['#0C9BFF','#FEC006'],
  272. legend: {
  273. textStyle: {
  274. color: "#ffffff"
  275. }
  276. },
  277. xAxis: {
  278. type: 'category',
  279. axisLabel: {
  280. show: true,
  281. textStyle: {
  282. color: '#ffffff' //这里用参数代替了
  283. }
  284. },
  285. axisLine:{
  286. lineStyle:{
  287. color:'#FFFFFF',
  288. width:1,//这里是为了突出显示加上的
  289. }
  290. },
  291. data: res.data.xdata
  292. },
  293. yAxis: {
  294. type: 'value',
  295. splitLine:{
  296. show:false // 去掉背景的网格线
  297. },
  298. axisLabel: {
  299. show: true,
  300. textStyle: {
  301. color:'#ffffff' //这里用参数代替了
  302. }
  303. },
  304. axisLine:{
  305. lineStyle:{
  306. color:'#FFFFFF',
  307. width:1,//这里是为了突出显示加上的
  308. }
  309. }
  310. },
  311. series: [{
  312. data: res.data.ydata,
  313. type: 'line'
  314. }]
  315. };
  316. var myChart = echarts.init(document.getElementById('waste-count'));
  317. myChart.setOption(option);
  318. }
  319. });
  320. }
  321. function getYsCount() {
  322. var url = '/api/screen/project/yscount';
  323. $.post(url,{orgid:orgid},function (res) {
  324. if(res.code == 0){
  325. $('#yscount1').html(res.data.count1);
  326. $('#yscount2').html(res.data.count2);
  327. $('#yscount3').html(res.data.count3);
  328. $('#yscount4').html(res.data.count4);
  329. $('#yscount5').html(res.data.count5);
  330. $('#yscount6').html(res.data.count6);
  331. }
  332. })
  333. }
  334. function getYsUser() {
  335. var url = '/api/screen/project/ysuser';
  336. $.post(url,{orgid:orgid},function (res) {
  337. if(res.code == 0){
  338. var str = '';
  339. var lists = res.data;
  340. for (let o in lists){
  341. str += '<tr>';
  342. str += '<td>'+lists[o].realName+'</td>';
  343. str += '<td>'+lists[o].count+'</td>';
  344. str += '<td>'+lists[o].addrTitle+'</td>';
  345. str += '</tr>';
  346. }
  347. $('#ys-user').html(str);
  348. }
  349. })
  350. }
  351. function getYsTask() {
  352. var url = '/api/screen/project/ystask';
  353. $.post(url,{orgid:orgid,size:20},function (res) {
  354. if(res.code == 0){
  355. var str = '';
  356. var lists = res.data;
  357. for (let o in lists){
  358. // if(lists[o].orderMode == 1){
  359. // str += '<tr>';
  360. // str += '<td>新任务</td>';
  361. // }else if(lists[o].orderMode == 5 && !lists[o].confirmTime){
  362. // str += '<tr class="table-color2">';
  363. // str += '<td>已派工</td>';
  364. // }else{
  365. // str += '<tr class="table-color3">';
  366. // str += '<td>进行中</td>';
  367. // }
  368. str += '<tr>';
  369. str += '<td>'+lists[o].orderModelTxt+'</td>';
  370. str += '<td>'+lists[o].content+'</td>';
  371. str += '<td>'+lists[o].createTime+'</td>';
  372. str += '<td>'+lists[o].realNames+'</td>';
  373. str += '<td>'+lists[o].sendTime+'</td>';
  374. str += '<td>'+lists[o].confirmTime+'</td>';
  375. }
  376. $('#yunsong-table').html(str);
  377. }
  378. })
  379. }
  380. function getDailyTask() {
  381. var url = '/api/screen/project/daily';
  382. $.post(url,{orgid:orgid},function (res) {
  383. if(res.code == 0){
  384. var str = '';
  385. var lists = res.data;
  386. for (let o in lists){
  387. str += '<tr>';
  388. str += '<td>'+lists[o].title+'</td>';
  389. str += '<td>'+lists[o].realName+'</td>';
  390. str += '<td>'+lists[o].content+'</td>';
  391. str += '<td>'+lists[o].createTime+'</td>';
  392. }
  393. $('#daily-table').html(str);
  394. }
  395. })
  396. }
  397. function getPatrolTask() {
  398. var url = '/api/screen/project/patrolList';
  399. $.post(url,{orgid:orgid},function (res) {
  400. if(res.code == 0){
  401. var str = '';
  402. var lists = res.data;
  403. for (let o in lists){
  404. str += '<tr>';
  405. str += '<td>'+lists[o].title+'</td>';
  406. str += '<td>'+lists[o].createTime+'</td>';
  407. str += '<td>'+lists[o].realName+'</td>';
  408. str += '<td>'+lists[o].taskTitle+'</td>';
  409. }
  410. $('#patrol-table').html(str);
  411. }
  412. })
  413. }
  414. function getPatrolImg() {
  415. var url = '/api/screen/project/patrolImg';
  416. $.post(url,{orgid:orgid},function (res) {
  417. if(res.code == 0){
  418. var str = '';
  419. var lists = res.data;
  420. for (let o in lists){
  421. str += '<div class="patrol-box">';
  422. str += '<div class="patrol-box-list">';
  423. str += '<img onclick="open_img(this)" src="'+lists[o].images+'" alt="">';
  424. str += '<div>'+lists[o].taskTitle+'</div>';
  425. str += '</div>';
  426. str += '</div>';
  427. }
  428. $('#patrol-img-table').html(str);
  429. }
  430. })
  431. }
  432. function getYinhuan() {
  433. var url = '/api/screen/project/yinhuan';
  434. $.post(url,{orgid:orgid},function (res) {
  435. if(res.code == 0){
  436. var option = {
  437. title: {
  438. textStyle: {
  439. color: "#fff"
  440. }
  441. },
  442. color: ['#0C9BFF','#FEC006'],
  443. legend: {
  444. // orient: 'vertical',
  445. // right: 10,
  446. textStyle: {
  447. color: "#ffffff"
  448. }
  449. },
  450. tooltip: {},
  451. dataset: {
  452. source:res.data.list
  453. },
  454. xAxis: {
  455. type: 'category',
  456. axisLabel: {
  457. show: true,
  458. textStyle: {
  459. color: '#ffffff' //这里用参数代替了
  460. }
  461. },
  462. axisLine:{
  463. lineStyle:{
  464. color:'#FFFFFF',
  465. width:1,//这里是为了突出显示加上的
  466. }
  467. }
  468. },
  469. yAxis: {
  470. splitLine:{
  471. show:false
  472. },
  473. // 去掉背景的网格线
  474. axisLabel: {
  475. show: true,
  476. textStyle: {
  477. color:'#ffffff' //这里用参数代替了
  478. }
  479. },
  480. axisLine:{
  481. lineStyle:{
  482. color:'#FFFFFF',
  483. width:1,//这里是为了突出显示加上的
  484. }
  485. }
  486. },
  487. // Declare several bar series, each will be mapped
  488. // to a column of dataset.source by default.
  489. series: [
  490. {type: 'bar', barWidth:10},
  491. {type: 'bar',barWidth:10}
  492. ]
  493. };
  494. var myChart = echarts.init(document.getElementById('yhyj-chart'));
  495. myChart.setOption(option);
  496. }
  497. })
  498. }
  499. function getHot() {
  500. var url = '/api/screen/project/hotaddr';
  501. $.post(url,{orgid:orgid},function (res) {
  502. if(res.code == 0){
  503. let option = {
  504. title: {
  505. textStyle: {
  506. color: "#fff"
  507. }
  508. },
  509. color: ['#23A3F4','#FEC006'],
  510. legend: {
  511. data: ['当天运送', '30天内平均运送'],
  512. textStyle: {
  513. color: "#ffffff"
  514. }
  515. },
  516. xAxis: [
  517. {
  518. type: 'category',
  519. data: res.data.x,
  520. axisPointer: {
  521. type: 'shadow'
  522. },
  523. axisLabel: {
  524. show: true,
  525. rotate:25,
  526. textStyle: {
  527. color: '#ffffff' //这里用参数代替了
  528. }
  529. },
  530. axisLine:{
  531. lineStyle:{
  532. color:'#FFFFFF',
  533. width:1,//这里是为了突出显示加上的
  534. }
  535. }
  536. }
  537. ],
  538. yAxis: [
  539. {
  540. type: 'value',
  541. name: '数量',
  542. axisLabel: {
  543. formatter: '{value}'
  544. },
  545. splitLine:{
  546. show:false
  547. },
  548. // 去掉背景的网格线
  549. axisLabel: {
  550. show: true,
  551. textStyle: {
  552. color:'#ffffff' //这里用参数代替了
  553. }
  554. },
  555. axisLine:{
  556. lineStyle:{
  557. color:'#FFFFFF',
  558. width:1,//这里是为了突出显示加上的
  559. }
  560. }
  561. },
  562. {
  563. type: 'value',
  564. name: '数量',
  565. axisLabel: {
  566. formatter: '{value}'
  567. },
  568. splitLine:{
  569. show:false
  570. },
  571. // 去掉背景的网格线
  572. axisLabel: {
  573. show: true,
  574. textStyle: {
  575. color:'#ffffff' //这里用参数代替了
  576. }
  577. },
  578. axisLine:{
  579. lineStyle:{
  580. color:'#FFFFFF',
  581. width:1,//这里是为了突出显示加上的
  582. }
  583. }
  584. }
  585. ],
  586. series: [
  587. {
  588. name: '当天运送',
  589. type: 'bar',
  590. barWidth:10,
  591. data: res.data.y1
  592. },
  593. {
  594. name: '30天内平均运送',
  595. type: 'line',
  596. yAxisIndex: 1,
  597. data: res.data.y2
  598. }
  599. ]
  600. };
  601. var myChart = echarts.init(document.getElementById('hot-chart'));
  602. myChart.setOption(option);
  603. }
  604. });
  605. }
  606. function getTodoStis() {
  607. var url = '/api/screen/project/todostis';
  608. $.post(url,{orgid:orgid},function (res) {
  609. if(res.code == 0){
  610. var str = '';
  611. var lists = res.data;
  612. for (let o in lists){
  613. str += '<div class="order-box-list">';
  614. str += '<div>'+lists[o].name+'</div>';
  615. str += '<div class="order-box-list-num">'+lists[o].count+'</div>';
  616. str += '</div>';
  617. }
  618. $('#todo-count').html(str);
  619. }
  620. })
  621. }
  622. function getUser() {
  623. var url = '/api/screen/project/user';
  624. $.post(url,{orgid:orgid},function (res) {
  625. if(res.code == 0){
  626. var str = '';
  627. var lists = res.data.list;
  628. for (let o in lists){
  629. str += '<div class="user-box">';
  630. str += '<img src="/static/screen/images/project/left1.png" alt="">';
  631. str += '<div class="user-box-nums">'+lists[o].value+'</div>';
  632. str += '<div class="user-box-title">'+lists[o].name+'</div>';
  633. str += '<div class="user-box-header">';
  634. str += '<div class="user-box-nums">'+lists[o].bl+'%</div>';
  635. str += '<div class="user-box-title">'+lists[o].name2+'</div>';
  636. str += '</div>';
  637. str += '</div>';
  638. }
  639. $('#user-count').html(str);
  640. }
  641. })
  642. }
  643. function getTodo() {
  644. var url = '/api/screen/project/todo';
  645. $.post(url,{orgid:orgid},function (res) {
  646. if(res.code == 0){
  647. $('#todoTotal').html(res.data.total);
  648. $('#todoToday').html(res.data.today);
  649. $('#todoUndeal').html(res.data.undeal);
  650. $('#todoComment').html(res.data.comment);
  651. $('#todoFinish').html(res.data.finish);
  652. $('#todoUnfinish').html(res.data.unfinish);
  653. }
  654. })
  655. }
  656. function getComment() {
  657. var url = '/api/screen/project/comment';
  658. $.post(url,{orgid:orgid},function (res) {
  659. if(res.code == 0){
  660. var option = {
  661. color: ['#FFD900','#24C768','#FF7E00','#00A1E4','#FE546D'],
  662. tooltip: {
  663. trigger: 'item',
  664. formatter: '{a} <br/>{b} : {c} ({d}%)'
  665. },
  666. series: [
  667. {
  668. name: '满意度',
  669. type: 'pie',
  670. radius: '55%',
  671. center: ['50%', '50%'],
  672. data: res.data.count.sort(function (a, b) { return a.value - b.value; }),
  673. roseType: 'radius',
  674. label: {
  675. show: true,
  676. formatter:'{b}: {d}%',
  677. },
  678. labelLine: {
  679. lineStyle: {
  680. color: 'rgba(255, 255, 255, 0.3)'
  681. },
  682. smooth: 0.2,
  683. length: 10,
  684. length2: 20
  685. },
  686. animationType: 'scale',
  687. animationEasing: 'elasticOut',
  688. animationDelay: function (idx) {
  689. return Math.random() * 200;
  690. }
  691. }
  692. ]
  693. };
  694. var myChart = echarts.init(document.getElementById('comment-chart'));
  695. myChart.setOption(option);
  696. var ulist = res.data.list;
  697. var str = '';
  698. for (var o in ulist){
  699. str += '<div class="common-box">';
  700. str += '<div class="common-box-list1">';
  701. if(o == 0){
  702. str += '<img src="/static/screen/images/first.png" alt="">';
  703. }else if(o == 1){
  704. str += '<img src="/static/screen/images/second.png" alt="">';
  705. }else if(o == 2){
  706. str += '<img src="/static/screen/images/third.png" alt="">';
  707. }
  708. str += '</div>';
  709. str += '<div class="common-box-list2">'+ulist[o].DEP_NAME+'</div>';
  710. str += '<div class="common-box-list3">'+ulist[o].REAL_NAME+'</div>';
  711. str += '<div class="common-box-list4">'+ulist[o].SCORE+'</div>';
  712. if(o < 3){
  713. str += '<div class="common-box-list5">';
  714. str += '<img src="/static/screen/images/trophy.png" alt="">'
  715. str += '</div>';
  716. }
  717. }
  718. $('#comment-box').html(str);
  719. }
  720. })
  721. }
  722. function getPatrol() {
  723. var url = '/api/screen/project/patrol';
  724. $.post(url,{orgid:orgid},function (res) {
  725. if(res.code == 0){
  726. $('#patrolAddr').html(res.data.TITLE);
  727. $('#patrolUser').html(res.data.REAL_NAME);
  728. $('#patrolTime').html(res.data.CREATE_TIME);
  729. $('#patrolContent').html(res.data.CONTENT);
  730. if(res.data.IMAGES){
  731. $('#patrolImg').attr('src',res.data.IMAGES).show();
  732. }else{
  733. $('#patrolImg').attr('src','#').hide();
  734. }
  735. }
  736. })
  737. }
  738. function getTodotime() {
  739. var url = '/api/screen/project/todotime';
  740. $.post(url,{orgid:orgid},function (res) {
  741. if(res.code == 0){
  742. $('#todoBx').html(res.data.bx);
  743. $('#todoBj').html(res.data.bj);
  744. $('#todoYs').html(res.data.ys);
  745. $('#todoYh').html(res.data.yh);
  746. var option = {
  747. title: {
  748. textStyle: {
  749. color: "#fff"
  750. }
  751. },
  752. color: ['#1E88E5','#26C6DA','#FF7E00'],
  753. legend: {
  754. // orient: 'vertical',
  755. // right: 10,
  756. textStyle: {
  757. color: "#ffffff"
  758. }
  759. },
  760. tooltip: {},
  761. dataset: {
  762. source:res.data.list
  763. },
  764. xAxis: {
  765. type: 'category',
  766. axisLabel: {
  767. show: true,
  768. textStyle: {
  769. color: '#ffffff' //这里用参数代替了
  770. }
  771. },
  772. },
  773. yAxis: {
  774. splitLine:{
  775. show:false
  776. },
  777. // 去掉背景的网格线
  778. axisLabel: {
  779. show: true,
  780. textStyle: {
  781. color:'#ffffff' //这里用参数代替了
  782. }
  783. },
  784. },
  785. // Declare several bar series, each will be mapped
  786. // to a column of dataset.source by default.
  787. series: [
  788. {type: 'bar', barWidth:10},
  789. {type: 'bar',barWidth:10}
  790. ]
  791. };
  792. var myChart = echarts.init(document.getElementById('order-chart'));
  793. myChart.setOption(option);
  794. }
  795. })
  796. }
  797. function getDevice() {
  798. var url = '/api/screen/project/device';
  799. $.post(url,{orgid:orgid},function (res) {
  800. if(res.code == 0){
  801. $('#deviceCount').html(res.data.dcount);
  802. $('#recordCount').html(res.data.rcount);
  803. var option = {
  804. tooltip: {
  805. trigger: 'axis',
  806. axisPointer: {
  807. type: 'cross',
  808. label: {
  809. backgroundColor: '#6a7985'
  810. }
  811. }
  812. },
  813. color: ['#36f6f9','#8efaff'],
  814. legend: {
  815. data: ['台账记录'],
  816. textStyle: {
  817. color: "#ffffff"
  818. }
  819. },
  820. toolbox: {
  821. // feature: {
  822. // saveAsImage: {}
  823. // }
  824. },
  825. grid: {
  826. left: '3%',
  827. right: '4%',
  828. bottom: '3%',
  829. containLabel: true
  830. },
  831. xAxis: [
  832. {
  833. type: 'category',
  834. boundaryGap: false,
  835. data: res.data.month,
  836. axisLabel: {
  837. show: true,
  838. textStyle: {
  839. color: '#ffffff' //这里用参数代替了
  840. }
  841. },
  842. }
  843. ],
  844. yAxis: [
  845. {
  846. type: 'value',
  847. splitLine:{
  848. show:false
  849. },
  850. // 去掉背景的网格线
  851. axisLabel: {
  852. show: true,
  853. textStyle: {
  854. color:'#ffffff' //这里用参数代替了
  855. }
  856. },
  857. }
  858. ],
  859. series: [
  860. {
  861. name: '台账记录',
  862. type: 'line',
  863. stack: '总量',
  864. smooth: true,
  865. areaStyle: {
  866. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
  867. offset: 0,
  868. color: '#1E8BFF'
  869. }, {
  870. offset: 1,
  871. color: '#7937FF'
  872. }])
  873. },
  874. data: res.data.list
  875. }
  876. ]
  877. };
  878. var myChart = echarts.init(document.getElementById('device-chart'));
  879. myChart.setOption(option);
  880. }
  881. })
  882. }
  883. function getPatrolRecord() {
  884. var url = '/api/screen/project/patrolRecord';
  885. $.post(url,{orgid:orgid},function (res) {
  886. if(res.code == 0){
  887. var option = {
  888. tooltip: {
  889. trigger: 'axis',
  890. axisPointer: {
  891. type: 'cross',
  892. label: {
  893. backgroundColor: '#6a7985'
  894. }
  895. }
  896. },
  897. color: ['#1E8BFF','#9433D6'],
  898. legend: {
  899. data: ['巡更', '巡视', '巡查', '巡检'],
  900. textStyle: {
  901. color: "#ffffff"
  902. }
  903. },
  904. toolbox: {
  905. // feature: {
  906. // saveAsImage: {}
  907. // }
  908. },
  909. grid: {
  910. left: '3%',
  911. right: '4%',
  912. bottom: '3%',
  913. containLabel: true
  914. },
  915. xAxis: [
  916. {
  917. type: 'category',
  918. boundaryGap: false,
  919. data: res.data.hour,
  920. axisLabel: {
  921. show: true,
  922. textStyle: {
  923. color: '#ffffff' //这里用参数代替了
  924. }
  925. },
  926. }
  927. ],
  928. yAxis: [
  929. {
  930. type: 'value',
  931. splitLine:{
  932. show:false
  933. },
  934. // 去掉背景的网格线
  935. axisLabel: {
  936. show: true,
  937. textStyle: {
  938. color:'#ffffff' //这里用参数代替了
  939. }
  940. },
  941. }
  942. ],
  943. series: [
  944. {
  945. name: '巡更',
  946. type: 'line',
  947. stack: '总量',
  948. smooth: true,
  949. areaStyle: {
  950. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
  951. offset: 0,
  952. color: '#1E8BFF'
  953. }, {
  954. offset: 1,
  955. color: '#7937FF'
  956. }])
  957. },
  958. data: res.data.plist1
  959. },
  960. {
  961. name: '巡视',
  962. type: 'line',
  963. stack: '总量',
  964. smooth: true,
  965. areaStyle: {
  966. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
  967. offset: 0,
  968. color: '#B745FF'
  969. }, {
  970. offset: 1,
  971. color: '#7937FF'
  972. }])
  973. },
  974. data: res.data.plist2
  975. },
  976. {
  977. name: '巡查',
  978. type: 'line',
  979. stack: '总量',
  980. smooth: true,
  981. areaStyle: {
  982. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
  983. offset: 0,
  984. color: '#ff7e00'
  985. }, {
  986. offset: 1,
  987. color: '#091759'
  988. }])
  989. },
  990. data: res.data.plist3
  991. },
  992. {
  993. name: '巡检',
  994. type: 'line',
  995. stack: '总量',
  996. smooth: true,
  997. areaStyle: {
  998. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
  999. offset: 0,
  1000. color: '#00f8fd'
  1001. }, {
  1002. offset: 1,
  1003. color: '#091759'
  1004. }])
  1005. },
  1006. data: res.data.plist4
  1007. }
  1008. ]
  1009. };
  1010. var myChart = echarts.init(document.getElementById('patrol-chart'));
  1011. myChart.setOption(option);
  1012. }
  1013. })
  1014. }
  1015. function getRepair() {
  1016. var url = '/api/screen/project/repair';
  1017. $.post(url,{orgid:orgid},function (res) {
  1018. if(res.code == 0){
  1019. var option = {
  1020. color: ['#0C9BFF'],
  1021. xAxis: {
  1022. type: 'category',
  1023. data: res.data.names,
  1024. axisLabel: {
  1025. show: true,
  1026. // rotate:45,
  1027. textStyle: {
  1028. color: '#ffffff' //这里用参数代替了
  1029. }
  1030. },
  1031. axisLine:{
  1032. lineStyle:{
  1033. color:'#FFFFFF',
  1034. width:1,//这里是为了突出显示加上的
  1035. }
  1036. }
  1037. },
  1038. yAxis: {
  1039. type: 'value',
  1040. splitLine:{
  1041. show:false
  1042. },
  1043. // 去掉背景的网格线
  1044. axisLabel: {
  1045. show: true,
  1046. textStyle: {
  1047. color:'#ffffff' //这里用参数代替了
  1048. }
  1049. },
  1050. axisLine:{
  1051. lineStyle:{
  1052. color:'#FFFFFF',
  1053. width:1,//这里是为了突出显示加上的
  1054. }
  1055. }
  1056. },
  1057. series: [{
  1058. data: res.data.counts,
  1059. type: 'bar',
  1060. center: ['30%', '80%'],
  1061. barWidth : 10,
  1062. // itemStyle: {
  1063. // normal: {
  1064. // label: {
  1065. // show: true, //开启显示
  1066. // position: 'top', //在上方显示
  1067. // textStyle: { //数值样式
  1068. // color: '#fff',
  1069. // fontSize: 12,
  1070. // }
  1071. // }
  1072. // }
  1073. // },
  1074. }]
  1075. };
  1076. var myChart = echarts.init(document.getElementById('repair-chart'));
  1077. myChart.setOption(option);
  1078. }
  1079. })
  1080. }
  1081. function open_img(_self) {
  1082. var src = $(_self).attr('src');
  1083. var img = new Image();
  1084. img.src = src;
  1085. var width = $(window).width()*0.8;
  1086. var height = $(window).height()*0.6;
  1087. img.onload = function(){
  1088. var imgw = img.width;
  1089. var imgh = img.height;
  1090. if(imgw > width&&imgh < height){
  1091. imgh = imgh*width/imgw;
  1092. imgw = width;
  1093. }else if(imgw < width&&imgh > height){
  1094. imgw = imgw*height/imgh;
  1095. imgh = height;
  1096. }else if(imgw > width&&imgh > height){
  1097. var bl1 = width/height;
  1098. var bl2 = imgw/imgh;
  1099. if(bl1 < bl2){
  1100. imgh = imgh*width/imgw;
  1101. imgw = width;
  1102. }else if(bl1 > bl2){
  1103. imgw = imgw*height/imgh;
  1104. imgh = height;
  1105. }else{
  1106. imgh = height;
  1107. imgw = width;
  1108. }
  1109. }
  1110. var imgs = '<img width="'+imgw+'" height="'+imgh+'" src="'+src+'" />';
  1111. layer.open({
  1112. type: 1,
  1113. title: false,
  1114. closeBtn: 1,
  1115. area: [imgw+'px', imgh+'px'],
  1116. skin: 'layui-layer-nobg', //没有背景色
  1117. shadeClose: true,
  1118. content: imgs
  1119. });
  1120. };
  1121. }
  1122. function logout() {
  1123. window.location.href = '/Account/logout';
  1124. }
  1125. </script>
  1126. </body>
  1127. </html>