index4.js 53 KB

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