project.html 43 KB

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