index.js 46 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411
  1. let barImg =
  2. 'data:image/png;base64,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'
  3. let app = new Vue({
  4. el: '#app',
  5. data () {
  6. return {
  7. year: '2022',
  8. config1: {
  9. number: [100],
  10. content: '{nt}个',
  11. },
  12. centerData: '',
  13. storageRecordConfig: {
  14. header: ['时间', '所属集团', '工作情况'],
  15. headerBGC: '#05507b33',
  16. oddRowBGC: '#69c0ff0f',
  17. evenRowBGC: '',
  18. headerHeight: '40',
  19. rowNum: 4,
  20. align: ['center'],
  21. data: [
  22. ['2022年1月', '山西焦煤', '已经开展高层次人才引进工作'],
  23. ['2022年2月', '山西文旅', '不能按期完成序时进度'],
  24. ['2022年3月', '大地控股', '已经实现中长期激励机制贯彻'],
  25. ['2022年4月', '国际能源', '薪酬结果没有做到公开'],
  26. ['2022年5月', '山西焦煤', '已经开展高层次人才引进工作'],
  27. ['2022年6月', '山西焦煤', '不能按期完成序时进度'],
  28. ],
  29. },
  30. storageRecordConfig2: {
  31. header: ['企业名称', '预警内容', '数据抓取日期', '累计未获取数据日期'],
  32. headerBGC: '#05507b33',
  33. oddRowBGC: '#05507b33',
  34. evenRowBGC: '',
  35. headerHeight: '40',
  36. rowNum: 4,
  37. align: ['center', 'center', 'center', 'center'],
  38. data: [
  39. ['山西焦煤', '经营业绩考核延迟更新', '2022.12.01-12.31', '3天'],
  40. ['山西文旅', '六定长效机制情况未更新', '2022.12.01-12.31', '7天'],
  41. ['大地控股', '经营业绩考核延迟更新', '2022.12.01-12.31', '3天'],
  42. ['国际能源', '六定长效机制情况未更新', '2022.12.01-12.31', '1天'],
  43. ['山西焦煤', '经营业绩考核延迟更新', '2022.12.01-12.31', '3天'],
  44. ['山西焦煤', '六定长效机制情况未更新', '2022.12.01-12.31', '3天'],
  45. ],
  46. },
  47. companyList: companyList,
  48. commonOption: {
  49. title: {
  50. text: 'xxx',
  51. x: 'center',
  52. y: '3%',
  53. textStyle: {
  54. color: '#69C0FF',
  55. fontSize: 24,
  56. },
  57. },
  58. tooltip: {
  59. trigger: 'axis',
  60. axisPointer: {
  61. type: 'shadow',
  62. },
  63. },
  64. grid: {
  65. top: '22%',
  66. right: '5%',
  67. left: '8%',
  68. bottom: '20%',
  69. },
  70. legend: {
  71. data: '',
  72. top: '12%',
  73. right: '5%',
  74. textStyle: {
  75. color: 'rgba(250,250,250,0.6)',
  76. fontSize: 16,
  77. },
  78. },
  79. xAxis: {
  80. data: companyList.map(item => item.name),
  81. axisLine: {
  82. show: true, //隐藏X轴轴线
  83. lineStyle: {
  84. color: '#005094',
  85. width: 1,
  86. },
  87. },
  88. axisTick: {
  89. show: false, //隐藏X轴刻度
  90. },
  91. axisLabel: {
  92. show: true,
  93. rotate: 50,
  94. textStyle: {
  95. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  96. fontSize: 16,
  97. },
  98. },
  99. },
  100. yAxis: [
  101. {
  102. type: 'value',
  103. nameTextStyle: {
  104. color: '#ebf8ac',
  105. fontSize: 16,
  106. },
  107. splitLine: {
  108. show: true,
  109. lineStyle: {
  110. color: '#68b4dd66',
  111. type: 'dashed',
  112. },
  113. },
  114. axisLine: {
  115. show: false,
  116. },
  117. axisLabel: {
  118. show: true,
  119. textStyle: {
  120. color: 'rgba(250,250,250,0.6)',
  121. fontSize: 16,
  122. },
  123. },
  124. },
  125. ],
  126. },
  127. }
  128. },
  129. mounted () {
  130. this.centerData = data
  131. // 左侧图表
  132. this.initChartL1()
  133. this.initChartL2()
  134. this.initChartL3()
  135. this.initChartL4()
  136. this.initChartL5()
  137. this.initChartL6()
  138. this.initChartL7()
  139. this.initChartL8()
  140. // 中间图表
  141. this.initChartC1()
  142. this.initChartC2()
  143. // 右侧图表
  144. this.initChartR1()
  145. this.initChartR2()
  146. this.initChartR3()
  147. this.initChartR4()
  148. this.initChartR5()
  149. this.initChartR6()
  150. this.initChartR7()
  151. this.initChartR8()
  152. },
  153. methods: {
  154. numFormat (value) {
  155. if (!value) return '0'
  156. var intPart = Number(value).toFixed(0) // 获取整数部分
  157. var intPartFormat = intPart.toString()
  158. .replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') // 将整数部分逢三一断
  159. var floatPart = '.00' // 预定义小数部分
  160. var value2Array = value.toString().split('.')
  161. // =2表示数据有小数位
  162. if (value2Array.length === 2) {
  163. floatPart = value2Array[1].toString() // 拿到小数部分
  164. if (floatPart.length === 1) {
  165. // 补0
  166. return intPartFormat + '.' + floatPart + '0'
  167. } else {
  168. return intPartFormat + '.' + floatPart
  169. }
  170. } else {
  171. return intPartFormat
  172. }
  173. },
  174. initChartL1 () {
  175. let myChart = echarts.init(this.$refs['echartL1'])
  176. let option = {
  177. ..._.cloneDeep(this.commonOption),
  178. series: [
  179. {
  180. name: '总部机构数核定上限',
  181. type: 'line',
  182. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  183. smooth: true, //平滑曲线显示
  184. showAllSymbol: true, //显示所有图形。
  185. symbol: 'circle', //标记的图形为实心圆
  186. symbolSize: 8, //标记的大小
  187. smooth: false,
  188. itemStyle: {
  189. //折线拐点标志的样式
  190. color: '#fbe138',
  191. borderColor: '#fbe138',
  192. width: 2,
  193. shadowColor: '#fbe138',
  194. shadowBlur: 4,
  195. },
  196. lineStyle: {
  197. color: '#fbe138',
  198. width: 2,
  199. },
  200. data: dataL1[2],
  201. },
  202. {
  203. name: '六定改革前总部机构数',
  204. type: 'bar',
  205. barWidth: 15,
  206. itemStyle: {
  207. normal: {
  208. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  209. {
  210. offset: 0,
  211. color: '#43ede3',
  212. },
  213. {
  214. offset: 1,
  215. color: '#082550',
  216. },
  217. ]),
  218. },
  219. },
  220. data: dataL1[0],
  221. },
  222. {
  223. name: '当前各省属企业总部机构数',
  224. type: 'bar',
  225. barWidth: 15,
  226. itemStyle: {
  227. normal: {
  228. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  229. {
  230. offset: 0,
  231. color: '#69c0ff',
  232. },
  233. {
  234. offset: 1,
  235. color: '#082550',
  236. },
  237. ]),
  238. },
  239. },
  240. data: dataL1[1],
  241. },
  242. ],
  243. }
  244. option.title.text = '当前各省属企业总部机构数'
  245. option.legend.data = ['六定改革前总部机构数', '当前各省属企业总部机构数', '总部机构数核定上限']
  246. option.yAxis.push({
  247. splitLine: {
  248. show: false,
  249. },
  250. axisLine: {
  251. show: false,
  252. },
  253. })
  254. myChart.setOption(option)
  255. },
  256. initChartL2 () {
  257. let myChart = echarts.init(this.$refs['echartL2'])
  258. let option = {
  259. ..._.cloneDeep(this.commonOption),
  260. series: [
  261. {
  262. name: '当前共享服务中心/事业部数',
  263. type: 'bar',
  264. barWidth: 15,
  265. itemStyle: {
  266. normal: {
  267. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  268. {
  269. offset: 0,
  270. color: '#69c0ff',
  271. },
  272. {
  273. offset: 1,
  274. color: '#082550',
  275. },
  276. ]),
  277. },
  278. },
  279. data: dataL2[0]
  280. },
  281. {
  282. name: '共享服务中心/事业部核定上限',
  283. type: 'line',
  284. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  285. smooth: true, //平滑曲线显示
  286. showAllSymbol: true, //显示所有图形。
  287. symbol: 'circle', //标记的图形为实心圆
  288. symbolSize: 8, //标记的大小
  289. smooth: false,
  290. itemStyle: {
  291. //折线拐点标志的样式
  292. color: '#fbe138',
  293. borderColor: '#fbe138',
  294. width: 2,
  295. shadowColor: '#fbe138',
  296. shadowBlur: 4,
  297. },
  298. lineStyle: {
  299. color: '#fbe138',
  300. width: 2,
  301. },
  302. data: dataL2[1],
  303. },
  304. ],
  305. }
  306. option.title.text = '各省属企业共享服务中心/事业部数'
  307. option.legend.data = ['当前共享服务中心/事业部数', '共享服务中心/事业部核定上限']
  308. option.yAxis.push({
  309. splitLine: {
  310. show: false,
  311. },
  312. axisLine: {
  313. show: false,
  314. },
  315. })
  316. myChart.setOption(option)
  317. },
  318. initChartL3 () {
  319. let myChart = echarts.init(this.$refs['echartL3'])
  320. console.log(this.commonOption, "this.commonOption")
  321. let option = {
  322. ..._.cloneDeep(this.commonOption),
  323. series: [
  324. {
  325. name: '当前管理人员数',
  326. type: 'bar',
  327. barWidth: 15,
  328. itemStyle: {
  329. normal: {
  330. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  331. {
  332. offset: 0,
  333. color: '#5e7ae9',
  334. },
  335. {
  336. offset: 1,
  337. color: '#082550',
  338. },
  339. ]),
  340. },
  341. },
  342. data: dataL3[0],
  343. },
  344. {
  345. name: '管理人员数占总人数比值',
  346. type: 'line',
  347. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  348. smooth: true, //平滑曲线显示
  349. showAllSymbol: true, //显示所有图形。
  350. symbol: 'circle', //标记的图形为实心圆
  351. symbolSize: 8, //标记的大小
  352. smooth: false,
  353. yAxisIndex: 1,
  354. itemStyle: {
  355. //折线拐点标志的样式
  356. color: '#fbe138',
  357. borderColor: '#fbe138',
  358. width: 2,
  359. shadowColor: '#fbe138',
  360. shadowBlur: 4,
  361. },
  362. lineStyle: {
  363. color: '#fbe138',
  364. width: 2,
  365. },
  366. data: dataL3[1],
  367. },
  368. ],
  369. }
  370. option.title.text = '各省属企业管理人员数'
  371. option.legend.data = ['当前管理人员数', '管理人员数占总人数比值']
  372. option.yAxis.push({
  373. type: 'value',
  374. axisLine: {
  375. show: false,
  376. },
  377. splitLine: {
  378. show: false,
  379. },
  380. axisLabel: {
  381. show: true,
  382. formatter: '{value} %',
  383. textStyle: {
  384. color: 'rgba(250,250,250,0.6)',
  385. },
  386. },
  387. })
  388. myChart.setOption(option)
  389. },
  390. initChartL4 () {
  391. let myChart = echarts.init(this.$refs['echartL4'])
  392. let option = {
  393. ..._.cloneDeep(this.commonOption),
  394. series: [
  395. {
  396. name: '六定改革前总部中层管理人数',
  397. type: 'bar',
  398. barWidth: 15,
  399. itemStyle: {
  400. normal: {
  401. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  402. {
  403. offset: 0,
  404. color: '#69c0ff',
  405. },
  406. {
  407. offset: 1,
  408. color: '#082550',
  409. },
  410. ]),
  411. },
  412. },
  413. data: dataL4[0]
  414. },
  415. {
  416. name: '当前总部中层管理人数',
  417. type: 'bar',
  418. barWidth: 15,
  419. itemStyle: {
  420. normal: {
  421. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  422. {
  423. offset: 0,
  424. color: '#6480f3',
  425. },
  426. {
  427. offset: 1,
  428. color: '#082550',
  429. },
  430. ]),
  431. },
  432. },
  433. data: dataL4[1]
  434. },
  435. ],
  436. }
  437. option.title.text = '各省属企业总部中层管理人数'
  438. option.legend.data = ['六定改革前总部中层管理人数', '当前总部中层管理人数']
  439. option.legend.show = true
  440. option.yAxis.push({
  441. splitLine: {
  442. show: false,
  443. },
  444. axisLine: {
  445. show: false,
  446. },
  447. })
  448. myChart.setOption(option)
  449. },
  450. initChartL5 () {
  451. let myChart = echarts.init(this.$refs['echartL5'])
  452. let option = {
  453. ..._.cloneDeep(this.commonOption),
  454. series: [
  455. {
  456. name: '各省属企业总人数',
  457. type: 'bar',
  458. barWidth: 15,
  459. itemStyle: {
  460. normal: {
  461. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  462. {
  463. offset: 0,
  464. color: '#69c0ff',
  465. },
  466. {
  467. offset: 1,
  468. color: '#082550',
  469. },
  470. ]),
  471. },
  472. },
  473. data: dataL5[0],
  474. },
  475. {
  476. name: '去年同期人数变化率',
  477. type: 'line',
  478. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  479. smooth: true, //平滑曲线显示
  480. showAllSymbol: true, //显示所有图形。
  481. symbol: 'circle', //标记的图形为实心圆
  482. symbolSize: 8, //标记的大小
  483. smooth: false,
  484. itemStyle: {
  485. //折线拐点标志的样式
  486. color: '#b889ea',
  487. borderColor: '#b889ea',
  488. width: 2,
  489. shadowColor: '#b889ea',
  490. shadowBlur: 4,
  491. },
  492. lineStyle: {
  493. color: '#b889ea',
  494. width: 2,
  495. },
  496. data: dataL5[1],
  497. },
  498. ],
  499. }
  500. option.title.text = '各省属企业总人数'
  501. option.legend.data = ['各省属企业总人数', '去年同期人数变化率']
  502. option.legend.show = true
  503. option.yAxis.push({
  504. type: 'value',
  505. axisLine: {
  506. show: false,
  507. },
  508. splitLine: {
  509. show: false,
  510. },
  511. axisLabel: {
  512. show: true,
  513. formatter: '{value} %',
  514. textStyle: {
  515. color: 'rgba(250,250,250,0.6)',
  516. },
  517. },
  518. })
  519. myChart.setOption(option)
  520. },
  521. initChartL6 () {
  522. let myChart = echarts.init(this.$refs['echartL6'])
  523. let option = {
  524. ..._.cloneDeep(this.commonOption),
  525. series: [
  526. {
  527. name: '',
  528. type: 'bar',
  529. barWidth: 15,
  530. itemStyle: {
  531. normal: {
  532. barBorderRadius: [10, 10, 0, 0],
  533. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  534. {
  535. offset: 0,
  536. color: '#43ede3',
  537. },
  538. {
  539. offset: 1,
  540. color: '#082550',
  541. },
  542. ]),
  543. },
  544. },
  545. data: [500, 900, 600, 800, 450, 700, 600, 800, 850, 700, 500, 900, 600, 500, 450, 600, 500, 900],
  546. },
  547. ],
  548. }
  549. option.title.text = '当前各省属企业人工成本利润率'
  550. myChart.setOption(option)
  551. },
  552. initChartL7 () {
  553. let myChart = echarts.init(this.$refs['echartL7'])
  554. let option = {
  555. ..._.cloneDeep(this.commonOption),
  556. series: [
  557. {
  558. name: '总部员额数目标值',
  559. type: 'line',
  560. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  561. smooth: true, //平滑曲线显示
  562. showAllSymbol: true, //显示所有图形。
  563. symbol: 'circle', //标记的图形为实心圆
  564. symbolSize: 8, //标记的大小
  565. smooth: false,
  566. itemStyle: {
  567. //折线拐点标志的样式
  568. color: '#fbe138',
  569. borderColor: '#fbe138',
  570. width: 2,
  571. shadowColor: '#fbe138',
  572. shadowBlur: 4,
  573. },
  574. lineStyle: {
  575. color: '#fbe138',
  576. width: 2,
  577. },
  578. data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  579. },
  580. {
  581. name: '六定前总部员额数',
  582. type: 'bar',
  583. barWidth: 15,
  584. itemStyle: {
  585. normal: {
  586. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  587. {
  588. offset: 0,
  589. color: '#43ede3',
  590. },
  591. {
  592. offset: 1,
  593. color: '#082550',
  594. },
  595. ]),
  596. },
  597. },
  598. data: [50, 90, 60, 80, 45, 70, 60, 80, 45, 70, 50, 90, 60, 50, 45, 10, 50, 90],
  599. },
  600. {
  601. name: '六定后总部员额数',
  602. type: 'bar',
  603. barWidth: 15,
  604. itemStyle: {
  605. normal: {
  606. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  607. {
  608. offset: 0,
  609. color: '#69c0ff',
  610. },
  611. {
  612. offset: 1,
  613. color: '#082550',
  614. },
  615. ]),
  616. },
  617. },
  618. data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
  619. },
  620. ],
  621. }
  622. option.title.text = '当前各省属企业总部员额数'
  623. option.legend.data = ['六定前总部员额数', '六定后总部员额数', '总部员额数目标值']
  624. option.legend.show = true
  625. option.yAxis.push({
  626. splitLine: {
  627. show: false,
  628. },
  629. axisLine: {
  630. show: false,
  631. },
  632. })
  633. myChart.setOption(option)
  634. },
  635. initChartL8 () {
  636. let myChart = echarts.init(this.$refs['echartL8'])
  637. let option = {
  638. ..._.cloneDeep(this.commonOption),
  639. series: [
  640. {
  641. name: '各省属企业主业员额数',
  642. type: 'bar',
  643. barWidth: 15,
  644. itemStyle: {
  645. normal: {
  646. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  647. {
  648. offset: 0,
  649. color: '#5e7ae9',
  650. },
  651. {
  652. offset: 1,
  653. color: '#082550',
  654. },
  655. ]),
  656. },
  657. },
  658. data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  659. },
  660. {
  661. name: '各省属企业辅业员额数',
  662. type: 'bar',
  663. barWidth: 15,
  664. itemStyle: {
  665. normal: {
  666. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  667. {
  668. offset: 0,
  669. color: '#69c0ff',
  670. },
  671. {
  672. offset: 1,
  673. color: '#082550',
  674. },
  675. ]),
  676. },
  677. },
  678. data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
  679. },
  680. ],
  681. }
  682. option.title.text = '当前各省属企业主副业员额数情况对比'
  683. option.legend.data = ['各省属企业主业员额数', '各省属企业辅业员额数']
  684. option.legend.show = true
  685. option.yAxis.push({
  686. splitLine: {
  687. show: false,
  688. },
  689. axisLine: {
  690. show: false,
  691. },
  692. })
  693. myChart.setOption(option)
  694. },
  695. // 中间图表---------------------------------------------开始
  696. initChartC1 () {
  697. let myChart = echarts.init(this.$refs['echartC1'])
  698. let option = {
  699. ..._.cloneDeep(this.commonOption),
  700. series: [
  701. {
  702. name: '全员劳动生产率',
  703. type: 'bar',
  704. barWidth: 12,
  705. smooth: true, //平滑曲线显示
  706. showAllSymbol: true, //显示所有图形。
  707. symbol: 'circle', //标记的图形为实心圆
  708. symbolSize: 8, //标记的大小
  709. smooth: false,
  710. itemStyle: {
  711. //折线拐点标志的样式
  712. color: '#B889EA',
  713. borderColor: '#B889EA',
  714. width: 2,
  715. shadowColor: '#B889EA',
  716. shadowBlur: 4,
  717. },
  718. lineStyle: {
  719. color: '#B889EA',
  720. width: 2,
  721. },
  722. // data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  723. data: c1[0],
  724. markLine: {
  725. data: [
  726. {
  727. name: '省属企业平均水平(万/人)',
  728. yAxis: 50.13,
  729. lineStyle: {
  730. color: '#fff',
  731. },
  732. label: {
  733. formatter: '{b}',
  734. position: 'middle',
  735. color: '#fff',
  736. },
  737. },
  738. {
  739. name: '央企平均水平(万/人)',
  740. yAxis: 69.4,
  741. lineStyle: {
  742. color: '#fff',
  743. },
  744. label: {
  745. formatter: '{b}',
  746. position: 'middle',
  747. color: '#fff',
  748. },
  749. },
  750. ],
  751. label: {
  752. distance: [20, 8],
  753. },
  754. },
  755. },
  756. {
  757. name: '全员劳动生产率同比',
  758. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  759. type: 'line',
  760. itemStyle: {
  761. normal: {
  762. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  763. {
  764. offset: 0,
  765. color: '#69c0ff',
  766. },
  767. {
  768. offset: 1,
  769. color: '#082550',
  770. },
  771. ]),
  772. },
  773. },
  774. // data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
  775. data: c1[1],
  776. },
  777. ],
  778. }
  779. option.title.text = '全员劳动生产率'
  780. option.legend.data = ['全员劳动生产率同比', '全员劳动生产率']
  781. option.legend.show = true
  782. option.yAxis.push({
  783. type: 'value',
  784. axisLine: {
  785. show: false,
  786. },
  787. splitLine: {
  788. show: false,
  789. },
  790. axisLabel: {
  791. show: true,
  792. formatter: '{value} %',
  793. textStyle: {
  794. color: 'rgba(250,250,250,0.6)',
  795. },
  796. },
  797. })
  798. myChart.setOption(option)
  799. },
  800. initChartC2 () {
  801. let myChart = echarts.init(this.$refs['echartC2'])
  802. let option = {
  803. ..._.cloneDeep(this.commonOption),
  804. series: [
  805. {
  806. name: '人工成本利润同比',
  807. type: 'line',
  808. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  809. smooth: true, //平滑曲线显示
  810. showAllSymbol: true, //显示所有图形。
  811. symbol: 'circle', //标记的图形为实心圆
  812. symbolSize: 8, //标记的大小
  813. smooth: false,
  814. itemStyle: {
  815. //折线拐点标志的样式
  816. color: '#B889EA',
  817. borderColor: '#B889EA',
  818. width: 2,
  819. shadowColor: '#B889EA',
  820. shadowBlur: 4,
  821. },
  822. lineStyle: {
  823. color: '#B889EA',
  824. width: 2,
  825. },
  826. // data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  827. data: c2[0],
  828. markLine: {
  829. data: [
  830. {
  831. name: '省属企业平均水平(万/人)',
  832. yAxis: 67.09,
  833. lineStyle: {
  834. color: '#fff',
  835. },
  836. label: {
  837. formatter: '{b}',
  838. position: 'end',
  839. color: '#fff',
  840. },
  841. },
  842. {
  843. name: '央企平均水平(万/人)',
  844. yAxis: 81,
  845. lineStyle: {
  846. color: '#fff',
  847. },
  848. label: {
  849. formatter: '{b}',
  850. position: 'middle',
  851. color: '#fff',
  852. },
  853. },
  854. ],
  855. label: {
  856. distance: [20, 8],
  857. },
  858. },
  859. },
  860. {
  861. name: '人工成本利润率',
  862. type: 'bar',
  863. barWidth: 15,
  864. itemStyle: {
  865. normal: {
  866. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  867. {
  868. offset: 0,
  869. color: '#69c0ff',
  870. },
  871. {
  872. offset: 1,
  873. color: '#082550',
  874. },
  875. ]),
  876. },
  877. },
  878. // data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
  879. data: c2[1]
  880. },
  881. ],
  882. }
  883. option.title.text = '人工成本利润率'
  884. option.legend.data = ['人工成本利润同比', '人工成本利润率']
  885. option.legend.show = true
  886. option.grid.right = '15%'
  887. option.yAxis.push({
  888. splitLine: {
  889. show: false,
  890. },
  891. axisLine: {
  892. show: false,
  893. },
  894. })
  895. myChart.setOption(option)
  896. },
  897. // 右侧图表---------------------------------------------开始
  898. initChartR1 () {
  899. let myChart = echarts.init(this.$refs['echartR1'])
  900. let option = {
  901. ..._.cloneDeep(this.commonOption),
  902. series: [
  903. {
  904. name: '全员劳动生产率',
  905. type: 'line',
  906. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  907. smooth: true, //平滑曲线显示
  908. showAllSymbol: true, //显示所有图形。
  909. symbol: 'circle', //标记的图形为实心圆
  910. symbolSize: 8, //标记的大小
  911. smooth: false,
  912. itemStyle: {
  913. //折线拐点标志的样式
  914. color: '#B889EA',
  915. borderColor: '#B889EA',
  916. width: 2,
  917. shadowColor: '#B889EA',
  918. shadowBlur: 4,
  919. },
  920. lineStyle: {
  921. color: '#B889EA',
  922. width: 2,
  923. },
  924. data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  925. },
  926. {
  927. name: '人工成本利润率同比',
  928. type: 'bar',
  929. barWidth: 15,
  930. itemStyle: {
  931. normal: {
  932. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  933. {
  934. offset: 0,
  935. color: '#69c0ff',
  936. },
  937. {
  938. offset: 1,
  939. color: '#082550',
  940. },
  941. ]),
  942. },
  943. },
  944. data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
  945. },
  946. ],
  947. }
  948. option.title.text = '各集团人工成本利润率情况'
  949. option.legend.data = ['人工成本利润率同比', '全员劳动生产率']
  950. option.legend.show = true
  951. option.yAxis.push({
  952. splitLine: {
  953. show: false,
  954. },
  955. axisLine: {
  956. show: false,
  957. },
  958. })
  959. myChart.setOption(option)
  960. },
  961. initChartR2 () {
  962. let myChart = echarts.init(this.$refs['echartR2'])
  963. let option = {
  964. ..._.cloneDeep(this.commonOption),
  965. series: [
  966. {
  967. name: '2023年公开招聘数',
  968. type: 'bar',
  969. barWidth: 15,
  970. itemStyle: {
  971. normal: {
  972. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  973. {
  974. offset: 0,
  975. color: '#45DAD1',
  976. },
  977. {
  978. offset: 1,
  979. color: '#082550',
  980. },
  981. ]),
  982. },
  983. },
  984. data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
  985. },
  986. {
  987. name: '2022年退出人数',
  988. type: 'bar',
  989. barWidth: 15,
  990. itemStyle: {
  991. normal: {
  992. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  993. {
  994. offset: 0,
  995. color: '#69c0ff',
  996. },
  997. {
  998. offset: 1,
  999. color: '#082550',
  1000. },
  1001. ]),
  1002. },
  1003. },
  1004. data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  1005. },
  1006. ],
  1007. }
  1008. option.title.text = '当前各省属企业公开招聘数/退出人数对比'
  1009. option.legend.data = ['2023年公开招聘数', '2022年退出人数']
  1010. option.legend.show = true
  1011. option.yAxis.push({
  1012. splitLine: {
  1013. show: false,
  1014. },
  1015. axisLine: {
  1016. show: false,
  1017. },
  1018. })
  1019. myChart.setOption(option)
  1020. },
  1021. initChartR3 () {
  1022. let myChart = echarts.init(this.$refs['echartR3'])
  1023. let option = {
  1024. ..._.cloneDeep(this.commonOption),
  1025. series: [
  1026. {
  1027. name: '招聘需求公开次数',
  1028. type: 'bar',
  1029. barWidth: 15,
  1030. itemStyle: {
  1031. normal: {
  1032. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1033. {
  1034. offset: 0,
  1035. color: '#45DAD1',
  1036. },
  1037. {
  1038. offset: 1,
  1039. color: '#082550',
  1040. },
  1041. ]),
  1042. },
  1043. },
  1044. data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
  1045. },
  1046. {
  1047. name: '招聘需求公告需要招聘数',
  1048. type: 'bar',
  1049. barWidth: 15,
  1050. itemStyle: {
  1051. normal: {
  1052. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1053. {
  1054. offset: 0,
  1055. color: '#69c0ff',
  1056. },
  1057. {
  1058. offset: 1,
  1059. color: '#082550',
  1060. },
  1061. ]),
  1062. },
  1063. },
  1064. data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  1065. },
  1066. ],
  1067. }
  1068. option.title.text = '当前各省属企业招聘需求公示人次'
  1069. option.legend.data = ['招聘需求公开次数', '招聘需求公告需要招聘数']
  1070. option.legend.show = true
  1071. option.yAxis.push({
  1072. splitLine: {
  1073. show: false,
  1074. },
  1075. axisLine: {
  1076. show: false,
  1077. },
  1078. })
  1079. myChart.setOption(option)
  1080. },
  1081. initChartR4 () {
  1082. let myChart = echarts.init(this.$refs['echartR4'])
  1083. let option = {
  1084. ..._.cloneDeep(this.commonOption),
  1085. series: [
  1086. {
  1087. name: '录用结果公告次数',
  1088. type: 'bar',
  1089. barWidth: 15,
  1090. itemStyle: {
  1091. normal: {
  1092. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1093. {
  1094. offset: 0,
  1095. color: '#6682F5',
  1096. },
  1097. {
  1098. offset: 1,
  1099. color: '#082550',
  1100. },
  1101. ]),
  1102. },
  1103. },
  1104. data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
  1105. },
  1106. {
  1107. name: '录用结果公告总人数',
  1108. type: 'bar',
  1109. barWidth: 15,
  1110. itemStyle: {
  1111. normal: {
  1112. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1113. {
  1114. offset: 0,
  1115. color: '#69c0ff',
  1116. },
  1117. {
  1118. offset: 1,
  1119. color: '#082550',
  1120. },
  1121. ]),
  1122. },
  1123. },
  1124. data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  1125. },
  1126. ],
  1127. }
  1128. option.title.text = '当前各省属企业录用结果公示人次'
  1129. option.legend.data = ['录用结果公告次数', '录用结果公告总人数']
  1130. option.legend.show = true
  1131. option.yAxis.push({
  1132. splitLine: {
  1133. show: false,
  1134. },
  1135. axisLine: {
  1136. show: false,
  1137. },
  1138. })
  1139. myChart.setOption(option)
  1140. },
  1141. initChartR5 () {
  1142. let myChart = echarts.init(this.$refs['echartR5'])
  1143. let option = {
  1144. ..._.cloneDeep(this.commonOption),
  1145. series: [
  1146. {
  1147. name: '省属企业年利润增长率',
  1148. type: 'line',
  1149. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  1150. smooth: true, //平滑曲线显示
  1151. showAllSymbol: true, //显示所有图形。
  1152. symbol: 'circle', //标记的图形为实心圆
  1153. symbolSize: 8, //标记的大小
  1154. smooth: false,
  1155. itemStyle: {
  1156. //折线拐点标志的样式
  1157. color: '#fbe138',
  1158. borderColor: '#fbe138',
  1159. width: 2,
  1160. shadowColor: '#fbe138',
  1161. shadowBlur: 4,
  1162. },
  1163. lineStyle: {
  1164. color: '#fbe138',
  1165. width: 2,
  1166. },
  1167. areaStyle: {
  1168. //区域填充样式
  1169. normal: {
  1170. color: new echarts.graphic.LinearGradient(
  1171. 0,
  1172. 0,
  1173. 0,
  1174. 1,
  1175. [
  1176. {
  1177. offset: 0,
  1178. color: '#fbe138',
  1179. },
  1180. {
  1181. offset: 1,
  1182. color: 'rgba(0,0,0,0)',
  1183. },
  1184. ],
  1185. false
  1186. ),
  1187. },
  1188. },
  1189. data: [60, 50, 40, 90, 30, 55, 40, 20, 50, 40, 40, 55, 40, 30, 50, 40, 35, 40],
  1190. },
  1191. {
  1192. name: '省属企业年薪酬增长率',
  1193. type: 'line',
  1194. smooth: true, //平滑曲线显示
  1195. showAllSymbol: true, //显示所有图形。
  1196. symbol: 'circle', //标记的图形为实心圆
  1197. symbolSize: 8, //标记的大小
  1198. smooth: false,
  1199. itemStyle: {
  1200. //折线拐点标志的样式
  1201. color: '#69C0FF',
  1202. borderColor: '#69C0FF',
  1203. width: 2,
  1204. shadowColor: '#69C0FF',
  1205. shadowBlur: 4,
  1206. },
  1207. lineStyle: {
  1208. color: '#69C0FF',
  1209. width: 2,
  1210. },
  1211. areaStyle: {
  1212. //区域填充样式
  1213. normal: {
  1214. color: new echarts.graphic.LinearGradient(
  1215. 0,
  1216. 0,
  1217. 0,
  1218. 1,
  1219. [
  1220. {
  1221. offset: 0,
  1222. color: '#1DADFF',
  1223. },
  1224. {
  1225. offset: 1,
  1226. color: 'rgba(0,0,0,0)',
  1227. },
  1228. ],
  1229. false
  1230. ),
  1231. },
  1232. },
  1233. data: [70, 60, 60, 80, 95, 70, 60, 90, 85, 70, 80, 90, 60, 80, 85, 70, 75, 90],
  1234. },
  1235. ],
  1236. }
  1237. option.title.text = '省属企业年利润涨幅率与年薪酬涨幅率对比'
  1238. option.legend.data = ['省属企业年利润增长率', '省属企业年薪酬增长率']
  1239. option.legend.show = true
  1240. myChart.setOption(option)
  1241. },
  1242. initChartR6 () {
  1243. let myChart = echarts.init(this.$refs['echartR6'])
  1244. let option = {
  1245. ..._.cloneDeep(this.commonOption),
  1246. series: [
  1247. {
  1248. name: '当前各省属下属企业数',
  1249. type: 'bar',
  1250. barWidth: 15,
  1251. itemStyle: {
  1252. normal: {
  1253. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1254. {
  1255. offset: 0,
  1256. color: '#69c0ff',
  1257. },
  1258. {
  1259. offset: 1,
  1260. color: '#082550',
  1261. },
  1262. ]),
  1263. },
  1264. },
  1265. data: [500, 900, 600, 800, 450, 700, 600, 800, 350, 700, 500, 900, 600, 500, 450, 100, 500, 900],
  1266. },
  1267. {
  1268. data: [500, 900, 600, 800, 450, 700, 600, 800, 350, 700, 500, 900, 600, 500, 450, 100, 500, 900],
  1269. type: 'pictorialBar',
  1270. barMaxWidth: '20',
  1271. symbolPosition: 'end',
  1272. symbol: 'image://' + barImg,
  1273. symbolOffset: ['0', '-25'],
  1274. symbolSize: [35, 35],
  1275. zlevel: 2,
  1276. },
  1277. ],
  1278. }
  1279. option.title.text = '当前各省属企业在岗职工平均薪酬'
  1280. myChart.setOption(option)
  1281. },
  1282. initChartR7 () {
  1283. let myChart = echarts.init(this.$refs['echartR7'])
  1284. let option = {
  1285. ..._.cloneDeep(this.commonOption),
  1286. series: [
  1287. {
  1288. name: '目标值',
  1289. type: 'line',
  1290. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  1291. smooth: true, //平滑曲线显示
  1292. showAllSymbol: true, //显示所有图形。
  1293. symbol: 'circle', //标记的图形为实心圆
  1294. symbolSize: 8, //标记的大小
  1295. smooth: false,
  1296. itemStyle: {
  1297. //折线拐点标志的样式
  1298. color: '#B889EA',
  1299. borderColor: '#B889EA',
  1300. width: 2,
  1301. shadowColor: '#B889EA',
  1302. shadowBlur: 4,
  1303. },
  1304. lineStyle: {
  1305. color: '#B889EA',
  1306. width: 2,
  1307. },
  1308. data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  1309. },
  1310. {
  1311. name: '劳动合同签约完成率',
  1312. type: 'bar',
  1313. barWidth: 15,
  1314. itemStyle: {
  1315. normal: {
  1316. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1317. {
  1318. offset: 0,
  1319. color: '#69C0FF',
  1320. },
  1321. {
  1322. offset: 1,
  1323. color: '#082550',
  1324. },
  1325. ]),
  1326. },
  1327. },
  1328. data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
  1329. },
  1330. ],
  1331. }
  1332. option.title.text = '当前省属企业劳动合同签约完成率'
  1333. option.legend.data = ['劳动合同签约完成率', '目标值']
  1334. option.yAxis.push({
  1335. splitLine: {
  1336. show: false,
  1337. },
  1338. axisLine: {
  1339. show: false,
  1340. },
  1341. })
  1342. myChart.setOption(option)
  1343. },
  1344. initChartR8 () {
  1345. let myChart = echarts.init(this.$refs['echartR8'])
  1346. let option = {
  1347. ..._.cloneDeep(this.commonOption),
  1348. series: [
  1349. {
  1350. name: '目标值',
  1351. type: 'line',
  1352. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  1353. smooth: true, //平滑曲线显示
  1354. showAllSymbol: true, //显示所有图形。
  1355. symbol: 'circle', //标记的图形为实心圆
  1356. symbolSize: 8, //标记的大小
  1357. smooth: false,
  1358. itemStyle: {
  1359. //折线拐点标志的样式
  1360. color: '#fbe138',
  1361. borderColor: '#fbe138',
  1362. width: 2,
  1363. shadowColor: '#fbe138',
  1364. shadowBlur: 4,
  1365. },
  1366. lineStyle: {
  1367. color: '#fbe138',
  1368. width: 2,
  1369. },
  1370. data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  1371. },
  1372. {
  1373. name: '全员绩效考核',
  1374. type: 'bar',
  1375. barWidth: 15,
  1376. itemStyle: {
  1377. normal: {
  1378. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1379. {
  1380. offset: 0,
  1381. color: '#43ede3',
  1382. },
  1383. {
  1384. offset: 1,
  1385. color: '#082550',
  1386. },
  1387. ]),
  1388. },
  1389. },
  1390. data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
  1391. },
  1392. ],
  1393. }
  1394. option.title.text = '当前各省属企业全员绩效考核情况'
  1395. option.legend.data = ['全员绩效考核', '目标值']
  1396. option.yAxis.push({
  1397. splitLine: {
  1398. show: false,
  1399. },
  1400. axisLine: {
  1401. show: false,
  1402. },
  1403. })
  1404. myChart.setOption(option)
  1405. },
  1406. },
  1407. })