index3.js 54 KB

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