index4.js 50 KB

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