FJManager.js 54 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373
  1. //var bootstrap = function ($, learun) {
  2. $(function () {
  3. "use strict";
  4. var tabName = 'fj1';
  5. function GetTodayInOutPie(data) {
  6. var dom = document.getElementById(tabName + 'todayinoutpie');
  7. var myChart = echarts.init(dom, null, {
  8. renderer: 'canvas',
  9. useDirtyRect: false
  10. });
  11. var app = {};
  12. var option;
  13. option = {
  14. title: {
  15. text: data.total,
  16. textStyle: {
  17. color: '#1C3554',
  18. },
  19. subtext: '今日任务总数',
  20. subtextStyle: {
  21. color: '#5A5E66',
  22. },
  23. left: 'center',
  24. top: '37%'
  25. },
  26. tooltip: {
  27. trigger: 'item'
  28. },
  29. legend: {
  30. top: '1%',
  31. left: 'center'
  32. },
  33. series: [
  34. {
  35. name: '出入库统计',
  36. type: 'pie',
  37. radius: ['40%', '70%'],
  38. avoidLabelOverlap: false,
  39. itemStyle: {
  40. normal: {
  41. label: {
  42. show: false
  43. },
  44. labelLine: {
  45. show: false
  46. },
  47. color: function (colors) {
  48. var colorList = [
  49. '#9287e7',
  50. '#40A0FF',
  51. '#F7CA4D',
  52. '#23B89A',
  53. '#9287e7',
  54. '#40A0FF',
  55. '#F7CA4D',
  56. '#23B89A',
  57. ];
  58. return colorList[colors.dataIndex];
  59. }
  60. }
  61. },
  62. label: {
  63. show: false,
  64. position: 'center'
  65. },
  66. emphasis: {
  67. label: {
  68. show: true,
  69. fontSize: 40,
  70. fontWeight: 'bold'
  71. }
  72. },
  73. labelLine: {
  74. show: false
  75. },
  76. data: data.datas
  77. //[
  78. //{ value: 1048, name: '出库任务' },
  79. //{ value: 735, name: '入库任务' },
  80. //{ value: 580, name: '移库任务' }
  81. //]
  82. }
  83. ]
  84. };
  85. if (option && typeof option === 'object') {
  86. myChart.setOption(option);
  87. }
  88. window.addEventListener('resize', myChart.resize);
  89. }
  90. function Get7daysTaskBar(data) {
  91. var dom = document.getElementById(tabName + 'sevendaysTask');
  92. var myChart = echarts.init(dom, null, {
  93. renderer: 'canvas',
  94. useDirtyRect: false
  95. });
  96. var app = {};
  97. var option;
  98. const labelOption = {
  99. show: true,
  100. position: 'insideBottom',
  101. distance: 15,
  102. align: 'left',
  103. verticalAlign: 'middle',
  104. rotate: 90,
  105. formatter: '{c} {name|{a}}',
  106. fontSize: 16,
  107. rich: {
  108. name: {}
  109. }
  110. };
  111. option = {
  112. tooltip: {
  113. trigger: 'axis',
  114. axisPointer: {
  115. type: 'cross',
  116. crossStyle: {
  117. color: '#999'
  118. }
  119. }
  120. },
  121. color: ['#40A0FF', '#23B89A', '#FF8541', '#9287e7'],
  122. //tooltip: {
  123. // trigger: 'axis',
  124. // axisPointer: {
  125. // type: 'shadow'
  126. // }
  127. //},
  128. legend: {
  129. left: '57%',//调整位置
  130. data: ['出库', '入库', '移库', '组盘']
  131. },
  132. xAxis: [
  133. {
  134. type: 'category',
  135. axisTick: { show: false },
  136. data: data.xAxis,// ['5-10', '5-11', '5-12', '5-13', '5-14', '5-15', '5-16'],
  137. }
  138. ],
  139. yAxis: [
  140. {
  141. /* interval: 50,*/
  142. axisLabel: {
  143. formatter: '{value}'
  144. },
  145. type: 'value'
  146. }
  147. ],
  148. series: [
  149. {
  150. name: '出库',
  151. type: 'bar',
  152. //label: labelOption,
  153. emphasis: {
  154. focus: 'series'
  155. },
  156. lineStyle: { // 设置线条的style等
  157. normal: {
  158. color: '#40A0FF', // 折线线条颜色:红色
  159. },
  160. },
  161. itemStyle: {
  162. normal: {
  163. label: {
  164. show: true,
  165. position: 'top',
  166. },
  167. //这里是颜色
  168. color: function (params) {
  169. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  170. var colorList = ['#40A0FF'];
  171. return colorList[params.dataIndex]
  172. }
  173. }, // 移入当前的柱状图时改变颜色
  174. emphasis: {
  175. color: '#40A0FF',
  176. }
  177. },
  178. data: data.series[0].data//[22, 18, 19, 34, 29]
  179. },
  180. {
  181. name: '入库',
  182. type: 'bar',
  183. barGap: 0,
  184. //label: labelOption,
  185. emphasis: {
  186. focus: 'series'
  187. },
  188. lineStyle: { // 设置线条的style等
  189. normal: {
  190. color: '#23B89A', // 折线线条颜色:红色
  191. },
  192. },
  193. itemStyle: {
  194. normal: {
  195. label: {
  196. show: true,
  197. position: 'top',
  198. },
  199. //这里是颜色
  200. color: function (params) {
  201. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  202. var colorList = ['#23B89A'];
  203. return colorList[params.dataIndex]
  204. }
  205. },
  206. emphasis: {
  207. color: '#23B89A',
  208. }
  209. },
  210. data: data.series[1].data//[32, 32, 30, 34, 39]
  211. },
  212. {
  213. name: '移库',
  214. type: 'bar',
  215. //label: labelOption,
  216. emphasis: {
  217. focus: 'series'
  218. },
  219. lineStyle: { // 设置线条的style等
  220. normal: {
  221. color: '#FF8541', // 折线线条颜色:红色
  222. },
  223. },
  224. itemStyle: {
  225. normal: {
  226. label: {
  227. show: true,
  228. position: 'top',
  229. },
  230. //这里是颜色
  231. color: function (params) {
  232. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  233. var colorList = ['#FF8541'];
  234. return colorList[params.dataIndex]
  235. }
  236. },
  237. emphasis: {
  238. color: '#FF8541',
  239. }
  240. },
  241. data: data.series[2].data// [15, 23, 21, 15, 19]
  242. },
  243. {
  244. name: '组盘',
  245. type: 'bar',
  246. //label: labelOption,
  247. emphasis: {
  248. focus: 'series'
  249. },
  250. lineStyle: { // 设置线条的style等
  251. normal: {
  252. color: '#9287e7', // 折线线条颜色:红色
  253. },
  254. },
  255. itemStyle: {
  256. normal: {
  257. label: {
  258. show: true,
  259. position: 'top',
  260. },
  261. //这里是颜色
  262. color: function (params) {
  263. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  264. var colorList = ['#9287e7'];
  265. return colorList[params.dataIndex]
  266. }
  267. },
  268. emphasis: {
  269. color: '#9287e7',
  270. }
  271. },
  272. data: data.series[3].data// [15, 23, 21, 15, 19]
  273. },
  274. ]
  275. };
  276. if (option && typeof option === 'object') {
  277. myChart.setOption(option);
  278. }
  279. }
  280. function GetWarehouseCellPie(data) {
  281. var chartDom = document.getElementById(tabName + 'WarehouseCell');
  282. var myChart = echarts.init(chartDom);
  283. var option;
  284. option = {
  285. tooltip: {
  286. trigger: 'item'
  287. },
  288. legend: {
  289. data: ['已使用', '空闲', '禁用', '锁定'],
  290. //orient: 'vertical',
  291. orient: 'horizontal',
  292. bottom: '-5',
  293. // left: 'center',
  294. // top: "50",
  295. //right: '-80%',
  296. textStyle: { color: "#000000" },//字体颜色
  297. //icon: "circle"//图例形状设置
  298. //orient: 'vertical',
  299. //right: 'right'
  300. //left: '77%',//调整位置
  301. },
  302. series: [
  303. {
  304. name: '货位使用情况',
  305. type: 'pie',
  306. radius: '60%',
  307. data: data
  308. //[{ value: 1048, name: '已使用' },
  309. //{ value: 735, name: '空闲' },
  310. //{ value: 580, name: '禁用' },
  311. //{ value: 484, name: '锁定' }]
  312. , itemStyle: {
  313. normal: {
  314. label: {
  315. show: true,
  316. formatter: '{b}:{c}({d}%)'
  317. },
  318. labelLine: {
  319. show: true
  320. },
  321. color: function (colors) {
  322. var colorList = [
  323. '#F4BD37', '#23B89A',
  324. '#D8E7FC',
  325. '#E46989',
  326. ];
  327. return colorList[colors.dataIndex];
  328. }
  329. }
  330. },
  331. label: {
  332. show: false,
  333. position: 'center'
  334. },
  335. emphasis: {
  336. label: {
  337. show: true,
  338. fontSize: 40,
  339. fontWeight: 'bold'
  340. },
  341. itemStyle: {
  342. shadowBlur: 10,
  343. shadowOffsetX: 0,
  344. shadowColor: 'rgba(0, 0, 0, 0.5)'
  345. }
  346. },
  347. labelLine: {
  348. show: false
  349. }
  350. }
  351. ]
  352. };
  353. option && myChart.setOption(option);
  354. }
  355. function GetTunnelWarehouseCellBar(data) {
  356. var dom = document.getElementById(tabName + 'TunnelWarehouseCell');
  357. var myChart = echarts.init(dom, null, {
  358. renderer: 'canvas',
  359. useDirtyRect: false
  360. });
  361. var app = {};
  362. var option;
  363. //https://blog.csdn.net/fu983531588/article/details/121338767
  364. //Echarts绘制横向柱状图(圆角+渐变) https://blog.csdn.net/weixin_43953710/article/details/106694317
  365. //https://blog.csdn.net/lilycheng1986/article/details/121853940
  366. //var data = [{ "qty": 16, "total": 1732 }, { "qty": 787, "total": 1732 }, { "qty": 841, "total": 1700 }];
  367. var barWidth = 20;
  368. //option = {
  369. // grid: {
  370. // top: '5%',
  371. // left: '25%',
  372. // right: '25%',
  373. // bottom: '0%',
  374. // containLabel: true // 显示范围包含坐标刻度
  375. // },
  376. // //grid: {
  377. // // top: '10px',
  378. // // left: '120px',
  379. // // bottom: '30px',
  380. // //},
  381. // xAxis: {
  382. // show: false
  383. // },
  384. // yAxis: {
  385. // type: 'category',
  386. // inverse: true, // 倒叙
  387. // axisLabel: {
  388. // margin: 0,
  389. // align: 'left',
  390. // formatter: (val) => {
  391. // return `${val}`;
  392. // }
  393. // },
  394. // axisLine: {
  395. // show: false // 轴线
  396. // },
  397. // axisTick: {
  398. // show: false // 刻度线
  399. // },
  400. // data: ['栏目1', '栏目2', '栏目3']
  401. // },
  402. // series: [
  403. // {
  404. // type: 'bar',
  405. // showBackground: true,
  406. // barWidth: 10,
  407. // barMaxWidth: 20,
  408. // barMinWidth: 5,
  409. // label: {
  410. // show: true,
  411. // position: 'left',
  412. // offset: [100, 0],
  413. // valueAnimation: true,
  414. // fontFamily: 'monospace',
  415. // fontSize: 12,
  416. // textStyle: {
  417. // //数值样式
  418. // color: "#1C3554",
  419. // fontSize: 12
  420. // },
  421. // formatter: function (params) {
  422. // return params.data.realValue + '/' + params.data.value;
  423. // },
  424. // // distance: -22
  425. // },
  426. // itemStyle: {
  427. // normal: {
  428. // barBorderRadius: [0, 20, 20, 0], //设置圆角方向[上,右,下,左]
  429. // //这里是颜色
  430. // color: function (params) {
  431. // //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  432. // var colorList = ['#40A0FF'];
  433. // return colorList[params.dataIndex]
  434. // }
  435. // }
  436. // },
  437. // data: data.map(function (item) {
  438. // return {
  439. // realValue: item.qty,
  440. // value: item.total,
  441. // };
  442. // }),
  443. // }
  444. // ]
  445. //};
  446. option = {
  447. //backgroundColor: 'black',
  448. grid: {
  449. top: '15%',
  450. left: '25%',
  451. right: '25%',
  452. bottom: '0%',
  453. containLabel: true // 显示范围包含坐标刻度
  454. },
  455. xAxis: {
  456. show: false,
  457. },
  458. yAxis: {
  459. data: data.map(item => item.tunnel),
  460. inverse: true,
  461. splitLine: {
  462. show: false,
  463. },
  464. axisLabel: {
  465. textStyle: { fontSize: '80%', color: '#5A5E66' },
  466. },
  467. axisLine: {
  468. show: false,
  469. },
  470. axisTick: false,
  471. },
  472. series: [
  473. {
  474. type: 'bar',
  475. barWidth: barWidth,
  476. barGap: '5%',
  477. barCategoryGap: '5%',/*多个并排柱子设置柱子之间的间距*/
  478. zlevel: 2,
  479. data: data.map(function (item) {
  480. return {
  481. value: item.qty
  482. };
  483. }),
  484. itemStyle: {
  485. normal: {
  486. barBorderRadius: [0, 20, 20, 0], //设置圆角方向[上,右,下,左]
  487. //这里是颜色
  488. color: function (params) {
  489. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  490. var colorList = ['#40A0FF'];
  491. return colorList[params.dataIndex]
  492. }
  493. }
  494. }
  495. },
  496. {
  497. type: 'bar',
  498. barWidth: barWidth,
  499. distance: 15,// 标签距离柱条的距离
  500. barGap: '-100%',
  501. barCategoryGap: '5%',/*多个并排柱子设置柱子之间的间距*/
  502. data: data.map(function (item) {
  503. return {
  504. value: item.total,
  505. realValue: item.qty,
  506. total: item.total,
  507. };
  508. }),
  509. label: {
  510. normal: {
  511. show: true,
  512. precision: 1,
  513. position: 'right',
  514. offset: [10, 0],
  515. valueAnimation: true,
  516. fontFamily: 'monospace',
  517. fontSize: 12,
  518. textStyle: {
  519. //数值样式
  520. color: "#1C3554",
  521. fontSize: 12
  522. },
  523. formatter: function (params) {
  524. return params.data.realValue + '/' + params.data.total;
  525. },
  526. }
  527. },
  528. itemStyle: {
  529. borderRadius: [0, 20, 20, 0],
  530. normal: {
  531. barBorderRadius: [0, 20, 20, 0], //设置圆角方向[上,右,下,左]
  532. //这里是颜色
  533. color: function (params) {
  534. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  535. var colorList = ['#E1E5E8'];
  536. return colorList[params.dataIndex]
  537. }
  538. }, // 移入当前的柱状图时改变颜色
  539. }
  540. },
  541. ],
  542. };
  543. if (option && typeof option === 'object') {
  544. myChart.setOption(option);
  545. }
  546. window.addEventListener('resize', myChart.resize);
  547. }
  548. function GettodaysHourTask(data) {
  549. var chartDom = document.getElementById(tabName + 'todaysHourTask');
  550. var myChart = echarts.init(chartDom, null, {
  551. renderer: 'canvas',
  552. useDirtyRect: false
  553. });
  554. var option;
  555. option = {
  556. tooltip: {
  557. trigger: 'axis',
  558. axisPointer: {
  559. type: 'cross',
  560. label: {
  561. backgroundColor: '#6a7985'
  562. }
  563. }
  564. },
  565. legend: {
  566. left: '57%',//调整位置
  567. top: '30',
  568. data: ['出库', '入库', '移库', '组盘']
  569. },
  570. grid: {
  571. left: '3%',
  572. right: '4%',
  573. bottom: '1%',
  574. containLabel: true
  575. },
  576. xAxis: [
  577. {
  578. //type: 'category',
  579. boundaryGap: false,
  580. data: data.xAxis,//['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23']
  581. }
  582. ],
  583. yAxis: [
  584. {
  585. axisLabel: {
  586. formatter: '{value}'
  587. },
  588. axisLine: {
  589. show: true
  590. },
  591. type: 'value'
  592. }
  593. ],
  594. series: [
  595. {
  596. name: '出库',
  597. type: 'line',
  598. //stack: 'Total',
  599. label: {
  600. show: true,
  601. position: 'top'
  602. },
  603. lineStyle: { // 设置线条的style等
  604. normal: {
  605. color: '#40A0FF', // 折线线条颜色:红色
  606. },
  607. },
  608. itemStyle: {
  609. normal: {
  610. //这里是颜色
  611. color: function (params) {
  612. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  613. var colorList = ['#40A0FF'];
  614. return colorList[params.dataIndex]
  615. }
  616. }
  617. },
  618. areaStyle: {},
  619. emphasis: {
  620. focus: 'series'
  621. },
  622. data: data.series[0].data//[78, 93, 76, 55, 68, 89, 82]
  623. },
  624. {
  625. name: '入库',
  626. type: 'line',
  627. //stack: 'Total',
  628. label: {
  629. show: true,
  630. position: 'top'
  631. },
  632. areaStyle: {},
  633. lineStyle: { // 设置线条的style等
  634. normal: {
  635. color: '#23B89A', // 折线线条颜色:红色
  636. },
  637. },
  638. itemStyle: {
  639. normal: {
  640. //这里是颜色
  641. color: function (params) {
  642. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  643. var colorList = ['#23B89A'];
  644. return colorList[params.dataIndex]
  645. }
  646. }
  647. },
  648. emphasis: {
  649. focus: 'series'
  650. },
  651. data: data.series[1].data//[38, 23, 36, 45, 58, 59, 62]
  652. }
  653. ,
  654. {
  655. name: '移库',
  656. type: 'line',
  657. //stack: 'Total',
  658. label: {
  659. show: true,
  660. position: 'top'
  661. },
  662. lineStyle: { // 设置线条的style等
  663. normal: {
  664. color: '#FF8541', // 折线线条颜色:红色
  665. },
  666. },
  667. areaStyle: {},
  668. itemStyle: {
  669. normal: {
  670. //这里是颜色
  671. color: function (params) {
  672. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  673. var colorList = ['#FF8541'];
  674. return colorList[params.dataIndex]
  675. }
  676. }
  677. },
  678. emphasis: {
  679. focus: 'series'
  680. },
  681. data: data.series[2].data//[8, 3, 6, 5, 8, 9, 6]
  682. },
  683. {
  684. name: '组盘',
  685. type: 'line',
  686. //stack: 'Total',
  687. label: {
  688. show: true,
  689. position: 'top'
  690. },
  691. lineStyle: { // 设置线条的style等
  692. normal: {
  693. color: '#9287e7', // 折线线条颜色:红色
  694. },
  695. },
  696. areaStyle: {},
  697. itemStyle: {
  698. normal: {
  699. //这里是颜色
  700. color: function (params) {
  701. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  702. var colorList = ['#9287e7'];
  703. return colorList[params.dataIndex]
  704. }
  705. }
  706. },
  707. emphasis: {
  708. focus: 'series'
  709. },
  710. data: data.series[3].data//[8, 3, 6, 5, 8, 9, 6]
  711. },
  712. ]
  713. };
  714. option && myChart.setOption(option);
  715. }
  716. function GetHourTask(data) {
  717. var chartDom = document.getElementById(tabName + 'HourTask');
  718. var myChart = echarts.init(chartDom, null, {
  719. renderer: 'canvas',
  720. useDirtyRect: false
  721. });
  722. var option;
  723. option = {
  724. tooltip: {
  725. trigger: 'axis',
  726. axisPointer: {
  727. type: 'cross',
  728. label: {
  729. backgroundColor: '#6a7985'
  730. }
  731. }
  732. },
  733. legend: {
  734. left: '57%',//调整位置
  735. top: '30',
  736. data: ['出库', '入库', '移库', '组盘']
  737. },
  738. grid: {
  739. left: '3%',
  740. right: '4%',
  741. bottom: '1%',
  742. containLabel: true
  743. },
  744. xAxis: [
  745. {
  746. //type: 'category',
  747. boundaryGap: false,
  748. data: data.xAxis,//['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23']
  749. }
  750. ],
  751. yAxis: [
  752. {
  753. axisLabel: {
  754. formatter: '{value}'
  755. },
  756. axisLine: {
  757. show: true
  758. },
  759. type: 'value'
  760. }
  761. ],
  762. series: [
  763. {
  764. name: '出库',
  765. type: 'line',
  766. //stack: 'Total',
  767. label: {
  768. show: true,
  769. position: 'top'
  770. },
  771. lineStyle: { // 设置线条的style等
  772. normal: {
  773. color: '#40A0FF', // 折线线条颜色:红色
  774. },
  775. },
  776. itemStyle: {
  777. normal: {
  778. //这里是颜色
  779. color: function (params) {
  780. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  781. var colorList = ['#40A0FF'];
  782. return colorList[params.dataIndex]
  783. }
  784. }
  785. },
  786. areaStyle: {},
  787. emphasis: {
  788. focus: 'series'
  789. },
  790. data: data.series[0].data//[78, 93, 76, 55, 68, 89, 82]
  791. },
  792. {
  793. name: '入库',
  794. type: 'line',
  795. //stack: 'Total',
  796. label: {
  797. show: true,
  798. position: 'top'
  799. },
  800. areaStyle: {},
  801. lineStyle: { // 设置线条的style等
  802. normal: {
  803. color: '#23B89A', // 折线线条颜色:红色
  804. },
  805. },
  806. itemStyle: {
  807. normal: {
  808. //这里是颜色
  809. color: function (params) {
  810. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  811. var colorList = ['#23B89A'];
  812. return colorList[params.dataIndex]
  813. }
  814. }
  815. },
  816. emphasis: {
  817. focus: 'series'
  818. },
  819. data: data.series[1].data//[38, 23, 36, 45, 58, 59, 62]
  820. }
  821. ,
  822. {
  823. name: '移库',
  824. type: 'line',
  825. //stack: 'Total',
  826. label: {
  827. show: true,
  828. position: 'top'
  829. },
  830. lineStyle: { // 设置线条的style等
  831. normal: {
  832. color: '#FF8541', // 折线线条颜色:红色
  833. },
  834. },
  835. areaStyle: {},
  836. itemStyle: {
  837. normal: {
  838. //这里是颜色
  839. color: function (params) {
  840. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  841. var colorList = ['#FF8541'];
  842. return colorList[params.dataIndex]
  843. }
  844. }
  845. },
  846. emphasis: {
  847. focus: 'series'
  848. },
  849. data: data.series[2].data//[8, 3, 6, 5, 8, 9, 6]
  850. },
  851. {
  852. name: '组盘',
  853. type: 'line',
  854. //stack: 'Total',
  855. label: {
  856. show: true,
  857. position: 'top'
  858. },
  859. lineStyle: { // 设置线条的style等
  860. normal: {
  861. color: '#9287e7', // 折线线条颜色:红色
  862. },
  863. },
  864. areaStyle: {},
  865. itemStyle: {
  866. normal: {
  867. //这里是颜色
  868. color: function (params) {
  869. //注意,如果颜色太少的话,后面颜色不会自动循环,最好多定义几个颜色
  870. var colorList = ['#9287e7'];
  871. return colorList[params.dataIndex]
  872. }
  873. }
  874. },
  875. emphasis: {
  876. focus: 'series'
  877. },
  878. data: data.series[3].data//[8, 3, 6, 5, 8, 9, 6]
  879. },
  880. ]
  881. };
  882. option && myChart.setOption(option);
  883. }
  884. function GetTaskGoodsTypesData(data) {
  885. var dom = document.getElementById(tabName + 'BomType');
  886. var myChart = echarts.init(dom, null, {
  887. renderer: 'canvas',
  888. useDirtyRect: false
  889. });
  890. var option;
  891. option = {
  892. tooltip: {
  893. trigger: 'item',
  894. position: ['20%', '50%']
  895. },
  896. legend: {
  897. data: data.map(item => item.name),
  898. orient: 'vertical',
  899. top: "15",
  900. //right: '-80%',
  901. textStyle: { color: "#000000" },//字体颜色
  902. //icon: "circle"//图例形状设置
  903. //orient: 'vertical',
  904. //right: 'right'
  905. left: '66%',//调整位置
  906. tooltip: {
  907. show: true,
  908. trigger: 'item',//鼠标移动上去展示全称
  909. },
  910. formatter: function (params) {
  911. var val = "";
  912. if (!!params && params.length > 6) {
  913. val = params.substr(0, 12) + '...';
  914. return val;
  915. } else {
  916. return params;
  917. }
  918. },
  919. },
  920. series: [
  921. {
  922. name: '物料占比',
  923. type: 'pie',
  924. radius: ['30%', '60%'],
  925. avoidLabelOverlap: false,
  926. itemStyle: {
  927. normal: {
  928. label: {
  929. show: false
  930. },
  931. labelLine: {
  932. show: false
  933. },
  934. color: function (colors) {
  935. var colorList = [
  936. '#12D8E4',
  937. '#75B1FF',
  938. '#3383FF',
  939. '#FFCD7E',
  940. '#FF8A8A',
  941. '#23B89A',
  942. '#F4BD37',
  943. '#D8E7FC',
  944. '#E46989',
  945. ];
  946. return colorList[colors.dataIndex];
  947. }
  948. }
  949. },
  950. label: {
  951. show: false,
  952. position: 'center'
  953. },
  954. emphasis: {
  955. label: {
  956. show: true,
  957. fontSize: 40,
  958. fontWeight: 'bold'
  959. }
  960. },
  961. labelLine: {
  962. show: false
  963. },
  964. data: data
  965. // [
  966. // { value: 1048, name: '出库任务' },
  967. // { value: 735, name: '入库任务' },
  968. // { value: 580, name: '移库任务' }
  969. //]
  970. }
  971. ]
  972. };
  973. if (option && typeof option === 'object') {
  974. myChart.setOption(option);
  975. }
  976. window.addEventListener('resize', myChart.resize);
  977. }
  978. function init() {
  979. GetTodayTaskInOutPie(1);
  980. top.learun.httpAsyncGet(top.$.rootUrl + '/' + Tenant + '/AdminDesktopHome/Get7daysTaskBar?warehouse=' + tabName, function (res) {
  981. if (res.code > 0) {
  982. Get7daysTaskBar(res.data);
  983. }
  984. });
  985. top.learun.httpAsyncGet(top.$.rootUrl + '/' + Tenant + '/AdminDesktopHome/GettodaysHourTask?warehouse=' + tabName, function (res) {
  986. if (res.code > 0) {
  987. GettodaysHourTask(res.data);
  988. }
  989. });
  990. top.learun.httpAsyncGet(top.$.rootUrl + '/' + Tenant + '/AdminDesktopHome/GetHourTask?warehouse=' + tabName, function (res) {
  991. if (res.code > 0) {
  992. GetHourTask(res.data);
  993. }
  994. });
  995. top.learun.httpAsyncGet(top.$.rootUrl + '/' + Tenant + '/Report/GetLocationUsageReportList?queryJson=%7B%7D', function (res) {
  996. if (res.code > 0) {
  997. var datas = [];
  998. var WarehouseCellPie = [];
  999. let MaterilLocation = 0, SpareLocation = 0, StopLocation = 0, LockLocation = 0;
  1000. for (var i = 0; i < res.data.length; i++) {
  1001. if (tabName == "fj1") {
  1002. if (res.data[i].Tunnel == '1') {
  1003. datas.push({ tunnel: "一巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1004. MaterilLocation += res.data[i].MaterilLocation;
  1005. SpareLocation += res.data[i].SpareLocation;
  1006. StopLocation += res.data[i].StopLocation;
  1007. LockLocation += res.data[i].LockLocation;
  1008. } else if (res.data[i].Tunnel == '2') {
  1009. datas.push({ tunnel: "二巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1010. MaterilLocation += res.data[i].MaterilLocation;
  1011. SpareLocation += res.data[i].SpareLocation;
  1012. StopLocation += res.data[i].StopLocation;
  1013. LockLocation += res.data[i].LockLocation;
  1014. }
  1015. }
  1016. else if (tabName == "fj2") {
  1017. if (res.data[i].Tunnel == '3') {
  1018. datas.push({ tunnel: "三巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1019. MaterilLocation += res.data[i].MaterilLocation;
  1020. SpareLocation += res.data[i].SpareLocation;
  1021. StopLocation += res.data[i].StopLocation;
  1022. LockLocation += res.data[i].LockLocation;
  1023. } else if (res.data[i].Tunnel == '4') {
  1024. datas.push({ tunnel: "四巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1025. MaterilLocation += res.data[i].MaterilLocation;
  1026. SpareLocation += res.data[i].SpareLocation;
  1027. StopLocation += res.data[i].StopLocation;
  1028. LockLocation += res.data[i].LockLocation;
  1029. }
  1030. }
  1031. else if (tabName == "fj3") {
  1032. if (res.data[i].Tunnel == '5') {
  1033. datas.push({ tunnel: "五巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1034. MaterilLocation += res.data[i].MaterilLocation;
  1035. SpareLocation += res.data[i].SpareLocation;
  1036. StopLocation += res.data[i].StopLocation;
  1037. LockLocation += res.data[i].LockLocation;
  1038. } else if (res.data[i].Tunnel == '6') {
  1039. datas.push({ tunnel: "六巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1040. MaterilLocation += res.data[i].MaterilLocation;
  1041. SpareLocation += res.data[i].SpareLocation;
  1042. StopLocation += res.data[i].StopLocation;
  1043. LockLocation += res.data[i].LockLocation;
  1044. }
  1045. }
  1046. else if (tabName == "fjall") {
  1047. if (res.data[i].Tunnel == '1') {
  1048. datas.push({ tunnel: "一巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1049. MaterilLocation += res.data[i].MaterilLocation;
  1050. SpareLocation += res.data[i].SpareLocation;
  1051. StopLocation += res.data[i].StopLocation;
  1052. LockLocation += res.data[i].LockLocation;
  1053. } else if (res.data[i].Tunnel == '2') {
  1054. datas.push({ tunnel: "二巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1055. MaterilLocation += res.data[i].MaterilLocation;
  1056. SpareLocation += res.data[i].SpareLocation;
  1057. StopLocation += res.data[i].StopLocation;
  1058. LockLocation += res.data[i].LockLocation;
  1059. }
  1060. else if (res.data[i].Tunnel == '3') {
  1061. datas.push({ tunnel: "三巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1062. MaterilLocation += res.data[i].MaterilLocation;
  1063. SpareLocation += res.data[i].SpareLocation;
  1064. StopLocation += res.data[i].StopLocation;
  1065. LockLocation += res.data[i].LockLocation;
  1066. } else if (res.data[i].Tunnel == '4') {
  1067. datas.push({ tunnel: "四巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1068. MaterilLocation += res.data[i].MaterilLocation;
  1069. SpareLocation += res.data[i].SpareLocation;
  1070. StopLocation += res.data[i].StopLocation;
  1071. LockLocation += res.data[i].LockLocation;
  1072. }
  1073. else if (res.data[i].Tunnel == '5') {
  1074. datas.push({ tunnel: "五巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1075. MaterilLocation += res.data[i].MaterilLocation;
  1076. SpareLocation += res.data[i].SpareLocation;
  1077. StopLocation += res.data[i].StopLocation;
  1078. LockLocation += res.data[i].LockLocation;
  1079. } else if (res.data[i].Tunnel == '6') {
  1080. datas.push({ tunnel: "六巷道", qty: res.data[i].MaterilLocation, total: res.data[i].AllLocationTotal });
  1081. MaterilLocation += res.data[i].MaterilLocation;
  1082. SpareLocation += res.data[i].SpareLocation;
  1083. StopLocation += res.data[i].StopLocation;
  1084. LockLocation += res.data[i].LockLocation;
  1085. }
  1086. }
  1087. }
  1088. //var data = [{ "qty": 16, "total": 1732 }, { "qty": 787, "total": 1732 }, { "qty": 841, "total": 1700 }];
  1089. GetTunnelWarehouseCellBar(datas);
  1090. WarehouseCellPie.push({ value: MaterilLocation, name: '已使用' });
  1091. WarehouseCellPie.push({ value: SpareLocation, name: '空闲' });
  1092. WarehouseCellPie.push({ value: StopLocation, name: '禁用' });
  1093. WarehouseCellPie.push({ value: LockLocation, name: '锁定' });
  1094. GetWarehouseCellPie(WarehouseCellPie);
  1095. }
  1096. });
  1097. GetTaskGoodsTypes(1);
  1098. }
  1099. function GetTodayTaskInOutPie(data) {
  1100. top.learun.httpAsyncGet(top.$.rootUrl + '/' + Tenant + '/AdminDesktopHome/GetTodayTaskInOutPie?bctime=' + data + '&warehouse=' + tabName, function (res) {
  1101. if (res.code > 0) {
  1102. var datas = [];
  1103. for (var i = 0; i < res.data.tasks.length; i++) {
  1104. if (res.data.tasks[i].name == '出库') {
  1105. $("#" + tabName + "outtoday").text(res.data.tasks[i].value);
  1106. datas.push({ value: res.data.tasks[i].value, name: "出库" });
  1107. }
  1108. else if (res.data.tasks[i].name == '入库') {
  1109. $("#" + tabName + "intoday").text(res.data.tasks[i].value);
  1110. datas.push({ value: res.data.tasks[i].value, name: "入库" });
  1111. }
  1112. else if (res.data.tasks[i].name == '移库') {
  1113. $("#" + tabName + "movetoday").text(res.data.tasks[i].value);
  1114. datas.push({ value: res.data.tasks[i].value, name: "移库" });
  1115. }
  1116. else if (res.data.tasks[i].name == '组盘') {
  1117. $("#" + tabName + "SetPlate").text(res.data.tasks[i].value);
  1118. datas.push({ value: res.data.tasks[i].value, name: "组盘" });
  1119. }
  1120. }
  1121. GetTodayInOutPie({ total: res.data.total, datas: datas });
  1122. }
  1123. });
  1124. }
  1125. function GetTaskGoodsTypes(data) {
  1126. top.learun.httpAsyncGet(top.$.rootUrl + '/' + Tenant + '/AdminDesktopHome/GetTaskGoodsTypes?warehouse=' + tabName + '&bctime=' + data, function (res) {
  1127. if (res.code > 0) {
  1128. GetTaskGoodsTypesData(res.data);
  1129. }
  1130. });
  1131. }
  1132. function GetDailyStatistics(data, begin, end) {
  1133. let url = '';
  1134. if (data) {
  1135. url = top.$.rootUrl + '/' + Tenant + '/AdminDesktopHome/GetDailyStatistics?bctime=' + data + '&begintime=' + begin + '&endtime=' + end;
  1136. }
  1137. else {
  1138. url = top.$.rootUrl + '/' + Tenant + '/AdminDesktopHome/GetDailyStatistics?begintime=' + begin + '&endtime=' + end;
  1139. }
  1140. top.learun.httpAsyncGet(url, function (res) {
  1141. $("#btn_Search").removeAttr('disabled');
  1142. if (res.code > 0) {
  1143. //
  1144. var orderhtml = "";
  1145. var orderres = eval(res.data.rows);
  1146. $.each(orderres, function (index, orderres) {
  1147. orderhtml += "<div style='position:relative;width:100%;'>";
  1148. orderhtml += "<label class='portal-panel-content-lable'>" + orderres.WarehouseName + "</label>";
  1149. orderhtml += "<label class='portal-panel-content-lable'>" + orderres.TrussNorthQty + "</label>";
  1150. orderhtml += "<label class='portal-panel-content-lable'>" + orderres.TrussSouthQty + "</label>";
  1151. orderhtml += "<label class='portal-panel-content-lable'>" + orderres.CircularSouthQty + "</label>";
  1152. orderhtml += "<label class='portal-panel-content-lable'>" + orderres.CircularNorthQty + "</label>";
  1153. orderhtml += "<label class='portal-panel-content-lable'>" + orderres.DailySummary + "</label>";
  1154. orderhtml += "<label class='portal-panel-content-lable'>" + orderres.FullNormalQty + "</label>";
  1155. orderhtml += "<label class='portal-panel-content-lable'>" + orderres.EmptyAbnormalQty + "</label>";
  1156. orderhtml += "<label class='portal-panel-content-lable'>" + orderres.EmptyAutomaticQty + "</label>";
  1157. orderhtml += "<label class='portal-panel-content-lable'>" + orderres.EmptyWarehouseQty + "</label>";
  1158. orderhtml += "</div>";
  1159. });
  1160. $("#dailylst").html(orderhtml);
  1161. }
  1162. });
  1163. }
  1164. function bind() {
  1165. $('#dailybegin').val(YStartDate);
  1166. $('#dailyend').val(YEndDate);
  1167. $('.' + tabName + 'todaytask').on('click', function () {
  1168. let bctime = $(this).attr("bctime");
  1169. for (var i = 0; i < $("." + tabName + "todaytask").length; i++) {
  1170. $($("." + tabName + "todaytask")[i]).removeClass("btn-primary");
  1171. $($("." + tabName + "todaytask")[i]).addClass("btn-default");
  1172. }
  1173. $(this).removeClass("btn-default");
  1174. $(this).addClass("btn-primary");
  1175. GetTodayTaskInOutPie(bctime);
  1176. });
  1177. $('.' + tabName + 'todaytype').on('click', function () {
  1178. let bctime = $(this).attr("bctime");
  1179. for (var i = 0; i < $("." + tabName + "todaytype").length; i++) {
  1180. $($("." + tabName + "todaytype")[i]).removeClass("btn-primary");
  1181. $($("." + tabName + "todaytype")[i]).addClass("btn-default");
  1182. }
  1183. $(this).removeClass("btn-default");
  1184. $(this).addClass("btn-primary");
  1185. GetTaskGoodsTypes(bctime);
  1186. });
  1187. $('.fjdailytime').on('click', function () {
  1188. let bctime = $(this).attr("bctime");
  1189. for (var i = 0; i < $(".fjdailytime").length; i++) {
  1190. $($(".fjdailytime")[i]).removeClass("btn-primary");
  1191. $($(".fjdailytime")[i]).addClass("btn-default");
  1192. }
  1193. $(this).removeClass("btn-default");
  1194. $(this).addClass("btn-primary");
  1195. GetDailyStatistics(bctime, '', '');
  1196. });
  1197. //$('#lr_left_list a').click(function (e) {
  1198. // $(this).tab('show');
  1199. //})
  1200. $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
  1201. // 获取已激活的标签页的名称
  1202. //tabName = $(e.target).text();
  1203. var seltab = $(e.target).attr("tabvalue");
  1204. tabName = "fj" + seltab;
  1205. if (seltab == 'daily') {
  1206. $('.' + tabName + 'time' + ':first')[0].click();
  1207. return;
  1208. }
  1209. $('.' + tabName + 'todaytask').on('click', function () {
  1210. let bctime = $(this).attr("bctime");
  1211. for (var i = 0; i < $("." + tabName + "todaytask").length; i++) {
  1212. $($("." + tabName + "todaytask")[i]).removeClass("btn-primary");
  1213. $($("." + tabName + "todaytask")[i]).addClass("btn-default");
  1214. }
  1215. $(this).removeClass("btn-default");
  1216. $(this).addClass("btn-primary");
  1217. GetTodayTaskInOutPie(bctime);
  1218. });
  1219. $('.' + tabName + 'todaytype').on('click', function () {
  1220. let bctime = $(this).attr("bctime");
  1221. for (var i = 0; i < $("." + tabName + "todaytype").length; i++) {
  1222. $($("." + tabName + "todaytype")[i]).removeClass("btn-primary");
  1223. $($("." + tabName + "todaytype")[i]).addClass("btn-default");
  1224. }
  1225. $(this).removeClass("btn-default");
  1226. $(this).addClass("btn-primary");
  1227. GetTaskGoodsTypes(bctime);
  1228. });
  1229. init();
  1230. $('.' + tabName + 'todaytask' + ':first')[0].click();
  1231. $('.' + tabName + 'todaytype' + ':first')[0].click();
  1232. });
  1233. // 查询
  1234. $('#btn_Search').on('click', function () {
  1235. var begin = $('#dailybegin').val();
  1236. var end = $('#dailyend').val();
  1237. if (begin.length <=0) {
  1238. alert('时间输入不能为空!');
  1239. return;
  1240. }
  1241. if (end.length <= 0) {
  1242. alert('时间输入不能为空!');
  1243. return;
  1244. }
  1245. $("#btn_Search").attr('disabled',true);
  1246. GetDailyStatistics(null, begin, end);
  1247. //top.learun.httpAsyncGet(top.$.rootUrl + '/' + Tenant + '/AdminDesktopHome/GetDailyStatistics?begintime=' + begin + '&endtime=' + begin, function (res) {
  1248. // if (res.code > 0) {
  1249. // //
  1250. // var orderhtml = "";
  1251. // var orderres = eval(res.data.rows);
  1252. // $.each(orderres, function (index, orderres) {
  1253. // orderhtml += "<div style='position:relative;width:100%;'>";
  1254. // orderhtml += "<label class='portal-panel-content-lable'>" + orderres.WarehouseName + "</label>";
  1255. // orderhtml += "<label class='portal-panel-content-lable'>" + orderres.TrussNorthQty + "</label>";
  1256. // orderhtml += "<label class='portal-panel-content-lable'>" + orderres.TrussSouthQty + "</label>";
  1257. // orderhtml += "<label class='portal-panel-content-lable'>" + orderres.CircularSouthQty + "</label>";
  1258. // orderhtml += "<label class='portal-panel-content-lable'>" + orderres.CircularNorthQty + "</label>";
  1259. // orderhtml += "<label class='portal-panel-content-lable'>" + orderres.DailySummary + "</label>";
  1260. // orderhtml += "<label class='portal-panel-content-lable'>" + orderres.FullNormalQty + "</label>";
  1261. // orderhtml += "<label class='portal-panel-content-lable'>" + orderres.EmptyAbnormalQty + "</label>";
  1262. // orderhtml += "<label class='portal-panel-content-lable'>" + orderres.EmptyAutomaticQty + "</label>";
  1263. // orderhtml += "<label class='portal-panel-content-lable'>" + orderres.EmptyWarehouseQty + "</label>";
  1264. // orderhtml += "</div>";
  1265. // });
  1266. // $("#dailylst").html(orderhtml);
  1267. // }
  1268. //});
  1269. });
  1270. }
  1271. bind();
  1272. init();
  1273. });