index4.js 53 KB

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