index3.js 53 KB

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