index3.js 50 KB

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