index2.js 52 KB

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