index5.js 74 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439
  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. start: 0,
  8. end: 9,
  9. touch: true,
  10. timeCommon: '',
  11. echartC1: {
  12. national: '',
  13. province: ''
  14. },
  15. echartC2: {
  16. national: '',
  17. province: ''
  18. },
  19. titleName: '',
  20. twinkle7: [],
  21. twinkle8: [],
  22. twinkleR6: [],
  23. showTip: false,
  24. tipNum: '',
  25. time: '',
  26. year: '2022',
  27. config1: {
  28. number: [100],
  29. content: '{nt}个',
  30. },
  31. centerData: '',
  32. storageRecordConfig: {
  33. header: ['', '公司名称', '工作情况'],
  34. headerBGC: '#05507b33',
  35. oddRowBGC: '#69c0ff0f',
  36. evenRowBGC: '',
  37. headerHeight: '50',
  38. rowNum: 4,
  39. align: ['center', 'center', 'center', 'center'],
  40. data: [],
  41. },
  42. storageRecordConfig2: {
  43. header: ['企业名称', '预警内容', '数据抓取日期', '累计未获取数据日期'],
  44. headerBGC: '#05507b33',
  45. oddRowBGC: '#05507b33',
  46. evenRowBGC: '',
  47. headerHeight: '50',
  48. rowNum: 4,
  49. align: ['center', 'center', 'center', 'center'],
  50. data: [],
  51. },
  52. companyList: companyList,
  53. commonOption: []
  54. }
  55. },
  56. beforeMount () {
  57. },
  58. mounted () {
  59. this.getUrlParams()
  60. this.time = formatDate()
  61. this.timer = setInterval(() => {
  62. this.time = formatDate()
  63. }, 1000)
  64. this.centerData = data
  65. },
  66. beforeDestroy () {
  67. clearInterval(this.timer);
  68. clearInterval(this.timeCommon);
  69. },
  70. methods: {
  71. change () {
  72. if (this.end < this.companyList.length) {
  73. this.start += 9
  74. this.end += 9
  75. } else {
  76. this.start = 0
  77. this.end = 9
  78. }
  79. },
  80. judgeCarousel () {
  81. let a = {
  82. title: {
  83. text: 'xxx',
  84. x: 'center',
  85. y: '3%',
  86. textStyle: {
  87. color: '#69C0FF',
  88. fontSize: 24,
  89. },
  90. },
  91. tooltip: {
  92. trigger: 'axis',
  93. axisPointer: {
  94. type: 'shadow',
  95. },
  96. },
  97. grid: {
  98. top: '22%',
  99. right: '5%',
  100. left: '8%',
  101. bottom: '25%',
  102. },
  103. legend: {
  104. data: '',
  105. top: '12%',
  106. right: '5%',
  107. textStyle: {
  108. color: 'rgba(250,250,250,0.6)',
  109. fontSize: 16,
  110. },
  111. },
  112. xAxis: {
  113. // data: companyList.map(item => item.name),
  114. data: '',
  115. axisLine: {
  116. show: true, //隐藏X轴轴线
  117. lineStyle: {
  118. color: '#005094',
  119. width: 1,
  120. },
  121. },
  122. axisTick: {
  123. show: false, //隐藏X轴刻度
  124. },
  125. axisLabel: {
  126. show: true,
  127. rotate: 15,
  128. textStyle: {
  129. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  130. fontSize: 16,
  131. },
  132. },
  133. },
  134. yAxis: [
  135. {
  136. type: 'value',
  137. nameTextStyle: {
  138. color: '#ebf8ac',
  139. fontSize: 16,
  140. },
  141. splitLine: {
  142. show: true,
  143. lineStyle: {
  144. color: '#68b4dd66',
  145. type: 'dashed',
  146. },
  147. },
  148. axisLine: {
  149. show: false,
  150. },
  151. axisLabel: {
  152. show: true,
  153. textStyle: {
  154. color: 'rgba(250,250,250,0.6)',
  155. fontSize: 16,
  156. },
  157. },
  158. },
  159. ],
  160. }
  161. a.xAxis.data = this.companyList.map(item => item.name)
  162. if (this.companyList.length > 18) {
  163. a.dataZoom = [
  164. {
  165. // start: 9,//默认为@
  166. // end: 100,//黑认认为1@0
  167. type: "slider",
  168. show: false,
  169. // xAxisIndex: [0]
  170. handlesize: 0,//滑动条的 左右2个滑动条的大小
  171. startValue: 17,// 初始显示值
  172. endValue: 0,// 结束显示值
  173. height: 10,//组件高度
  174. left: "5%",
  175. right: "4%",//右边的距离
  176. bottom: "25%",//底边的距离
  177. borderColor: "#939",
  178. fillerColor: "#269cdb",
  179. borderRadius: 5,
  180. backgroundColor: "#33384b",//两边未选中的滑动条区域的额色
  181. showDataShadow: false,//是否显示数据阴影
  182. showDetail: false,//即拖拽时候是否显示详细数值信息
  183. truerealtime: true,//是否实时更新
  184. filterMode: "filter"
  185. }, {
  186. type: 'inside',
  187. show: true,
  188. start: 1,
  189. end: 100
  190. }
  191. ]
  192. }
  193. this.commonOption = a
  194. },
  195. // 获取地址栏参数
  196. getUrlParams (id) {
  197. let url = window.location.href
  198. // 通过 ? 分割获取后面的参数字符串
  199. let urlStr = url.split('?')[1]
  200. // 创建空对象存储参数
  201. let obj = {};
  202. // 再通过 & 将每一个参数单独分割出来
  203. let paramsArr = urlStr.split('&')
  204. for (let i = 0, len = paramsArr.length; i < len; i++) {
  205. // 再通过 = 将每一个参数分割为 key:value 的形式
  206. let arr = paramsArr[i].split('=')
  207. obj[arr[0]] = arr[1];
  208. }
  209. this.access_token = obj.access_token
  210. this.orgNumber = obj.id
  211. this.titleName = decodeURIComponent(obj.name)
  212. // this.getData()
  213. this.getInstitutional()
  214. },
  215. // 获取组织机构
  216. getInstitutional () {
  217. return new Promise((resolve, err) => {
  218. let value = {
  219. access_token: this.access_token,
  220. "Data": {
  221. "paramType": "ORG",
  222. "orgNumber": this.orgNumber
  223. // "orgNumber": '1494979736584079360'
  224. }
  225. }
  226. post('/ierp/kapi/v2/mdnb/mdnb_das/Data/CockpitScreen', value).then(res => {
  227. this.companyList = res.data.map(item => {
  228. return { name: item.orgName, id: item.orgNumber }
  229. })
  230. this.getData()
  231. this.judgeCarousel()
  232. resolve(1);
  233. })
  234. });
  235. },
  236. generateEcharts () {
  237. // 左侧图表
  238. this.initChartL1()
  239. // this.initChartL2()
  240. this.initChartL3()
  241. // this.initChartL4()
  242. // this.initChartL5()
  243. this.initChartL6()
  244. // this.initChartL7()
  245. // this.initChartL8()
  246. // 中间图表
  247. this.initChartC1()
  248. this.initChartC2()
  249. // 右侧图表
  250. // this.initChartR1()
  251. // this.initChartR2()
  252. // this.initChartR3()
  253. this.initChartR4()
  254. this.initChartR5()
  255. // this.initChartR6()
  256. this.initChartR7()
  257. // this.initChartR8()
  258. },
  259. getData () {
  260. return new Promise((resolve, err) => {
  261. let value = {
  262. access_token: this.access_token,
  263. "Data": {
  264. "paramType": "DATA",
  265. "orgNumber": this.orgNumber
  266. }
  267. }
  268. post('/ierp/kapi/v2/mdnb/mdnb_das/Data/CockpitScreen', value).then(res => {
  269. res.orgData = res.data[0]
  270. // 定机构
  271. // 弹窗
  272. // return
  273. // 左侧图表
  274. tipData.analysis[0] = res.orgData.area1.intAnalysis.map(item => item.analysis)
  275. //各二级企业本部机构数
  276. dataL1[0] = []
  277. dataL1[1] = []
  278. dataL1[2] = []
  279. res.orgData.area1.card1.forEach(item => {
  280. dataL1[0].push(item['ZBPZ0088'])
  281. dataL1[1].push(item['ZBPZ0010'])
  282. dataL1[2].push(item['ZBPZ0089'])
  283. })
  284. // 各二级企业所属架构数
  285. dataL2[0] = []
  286. res.orgData.area1.card2.forEach(item => {
  287. dataL2[0].push(item['ZBPZ0024'])
  288. })
  289. // 定职数
  290. // 弹窗
  291. // 左侧图表
  292. tipData.analysis[2] = res.orgData.area2.intAnalysis.map(item => item.analysis)
  293. //各二级企业本部中层管理人数
  294. dataL3[0] = []
  295. res.orgData.area2.card1.forEach(item => {
  296. dataL3[0].push(item['ZBPZ0091'])
  297. })
  298. // 各二级企业管理人员数
  299. dataL4[1] = []
  300. dataL4[0] = []
  301. dataL4[2] = []
  302. res.orgData.area2.card1.forEach(item => {
  303. dataL4[1].push(item['ZBPZ0091'])
  304. dataL4[0].push(item['ZBPZ0093'])
  305. dataL4[2].push(item['ZBPZ0092'])
  306. })
  307. // 定员额
  308. // 弹窗
  309. tipData.analysis[1] = res.orgData.area3.intAnalysis.map(item => item.analysis)
  310. // 各二级企业总人数
  311. dataL5[0] = []
  312. dataL5[1] = []
  313. dataL5[2] = []
  314. res.orgData.area3.card1.forEach(item => {
  315. dataL5[0].push(item['ZBPZ0006'])
  316. dataL5[1].push(item['ZBPZ0050'])
  317. dataL5[2].push(item['ZBPZ0051'])
  318. })
  319. // 各二级企业本部员额数
  320. dataL6[0] = []
  321. dataL6[2] = []
  322. dataL6[1] = []
  323. res.orgData.area3.card2.forEach(item => {
  324. dataL6[0].push(item['ZBPZ0031'])
  325. dataL6[2].push(item['ZBPZ0094'])
  326. dataL6[1].push(item['ZBPZ0095'])
  327. })
  328. // 人数变化和全员劳动生产率变化率分析
  329. dataL7[0] = []
  330. dataL7[1] = []
  331. res.orgData.area3.card3.forEach(item => {
  332. dataL7[0].push(item['ZBPZ0050'])
  333. dataL7[1].push(item['ZBPZ0039'])
  334. })
  335. // 人数变化和人工利润率变化分析
  336. dataL8[0] = []
  337. dataL8[1] = []
  338. res.orgData.area3.card4.forEach(item => {
  339. dataL8[0].push(item['ZBPZ0050'])
  340. dataL8[1].push(item['ZBPZ0041'])
  341. })
  342. // 定机制
  343. // 弹窗
  344. tipData.analysis[6] = res.orgData.area4.intAnalysis.map(item => item.analysis)
  345. // 各二级企业招聘需求公告人次情况
  346. dataR1[0] = []
  347. dataR1[1] = []
  348. res.orgData.area4.card1.forEach(item => {
  349. dataR1[0].push(item['ZBPZ0057'])
  350. dataR1[1].push(item['ZBPZ0058'])
  351. })
  352. // 各二级企业录用结果公示人次
  353. dataR2[0] = []
  354. dataR2[1] = []
  355. res.orgData.area4.card2.forEach(item => {
  356. dataR2[0].push(item['ZBPZ0059'])
  357. dataR2[1].push(item['ZBPZ0060'])
  358. })
  359. // 各二级企业年利润与招聘情况分析
  360. dataR3[0] = []
  361. dataR3[1] = []
  362. res.orgData.area4.card3.forEach(item => {
  363. dataR3[0].push(item['ZBPZ0054'])
  364. dataR3[1].push(item['ZBPZ0055'])
  365. })
  366. // 各二级企业"退二进一"完成情况
  367. dataR4[0] = []
  368. dataR4[1] = []
  369. res.orgData.area4.card4.forEach(item => {
  370. dataR4[0].push(item['ZBPZ0056'])
  371. dataR4[1].push(item['ZBPZ0055'])
  372. })
  373. // 定薪酬
  374. // 弹窗
  375. tipData.analysis[5] = res.orgData.area5.intAnalysis.map(item => item.analysis)
  376. // 各二级企业在岗职工平均薪酬
  377. dataR5[0] = []
  378. dataR5[1] = []
  379. res.orgData.area5.card1.forEach(item => {
  380. dataR5[0].push(item['ZBPZ0063'])
  381. dataR5[1].push(item['ZBPZ0064'])
  382. })
  383. // 各二级企业利润与薪酬变动情况
  384. dataR6[0] = []
  385. dataR6[1] = []
  386. res.orgData.area5.card2.forEach(item => {
  387. dataR6[0].push(item['ZBPZ0061'])
  388. dataR6[1].push(item['ZBPZ0062'])
  389. })
  390. // 定任期
  391. // 弹窗
  392. tipData.analysis[6] = res.orgData.area6.intAnalysis.map(item => item.analysis)
  393. // 各二级企业全员绩效考核
  394. dataR7[0] = []
  395. res.orgData.area6.card1.forEach(item => {
  396. dataR7[0].push(item['ZBPZ0066'])
  397. })
  398. // 各二级企业任期制契约化考核完成率
  399. dataR8[0] = []
  400. res.orgData.area6.card2.forEach(item => {
  401. dataR8[0].push(item['ZBPZ0065'])
  402. })
  403. // 中间
  404. // 架岗人员
  405. this.centerData.info.value1 = res.orgData.area7.ZBPZ0037
  406. this.centerData.info.value2 = res.orgData.area7.ZBPZ0038
  407. this.centerData.info.value3 = res.orgData.area7.ZBPZ0006
  408. // 六定改革成效
  409. // this.centerData.changeInfo[0].value1 = res.orgData.area8.ZBPZ0067
  410. // this.centerData.changeInfo[0].value2 = res.orgData.area8.ZBPZ0068
  411. // this.centerData.changeInfo[0].value3 = res.orgData.area8.ZBPZ0069
  412. this.centerData.changeInfo[0].value1 = res.orgData.area8.ZBPZ0077
  413. this.centerData.changeInfo[0].value2 = res.orgData.area8.ZBPZ0078
  414. this.centerData.changeInfo[0].value3 = res.orgData.area8.ZBPZ0079
  415. this.centerData.changeInfo[2].value1 = res.orgData.area8.ZBPZ0074
  416. this.centerData.changeInfo[2].value2 = res.orgData.area8.ZBPZ0075
  417. this.centerData.changeInfo[2].value3 = res.orgData.area8.ZBPZ0076
  418. this.centerData.changeInfo[1].value1 = res.orgData.area8.ZBPZ0071
  419. this.centerData.changeInfo[1].value2 = res.orgData.area8.ZBPZ0072
  420. this.centerData.changeInfo[1].value3 = res.orgData.area8.ZBPZ0073
  421. // 核心指标监测
  422. // 弹窗
  423. tipData.analysis[3] = res.orgData.area9.intAnalysis.map(item => item.analysis)
  424. // 各二级企业全员劳动生产率
  425. dataC1[0] = []
  426. dataC1[1] = []
  427. res.orgData.area9.card1.forEach(item => {
  428. dataC1[0].push(item['ZBPZ0035'])
  429. dataC1[1].push(item['ZBPZ0039'])
  430. })
  431. // 各二级企业人工成本利润率
  432. dataC2[1] = []
  433. dataC2[0] = []
  434. res.orgData.area9.card2.forEach(item => {
  435. dataC2[1].push(item['ZBPZ0040'])
  436. dataC2[0].push(item['ZBPZ0041'])
  437. })
  438. this.echartC1.national = res.orgData.area9.card1[0].ZBPZ0097
  439. this.echartC1.province = res.orgData.area9.card1[0].ZBPZ0096
  440. this.echartC2.national = res.orgData.area9.card2[0].ZBPZ0099
  441. this.echartC2.province = res.orgData.area9.card2[0].ZBPZ0098
  442. // 分析预警中心
  443. // 工作台分析
  444. this.storageRecordConfig.data = []
  445. res.orgData.area10.card1.forEach(item => {
  446. this.storageRecordConfig.data.push(['<span class="lightOut"><span class="light ' + (item.lightsup === '0' ? 'red' : item.lightsup === '1' ? 'yellow' : 'green') + '"></span></span>', item.enterprise, item.work])
  447. })
  448. this.storageRecordConfig = { ...this.storageRecordConfig }
  449. // 数据库预警
  450. // this.storageRecordConfig2.data = []
  451. // res.orgData.area10.card2.forEach(item => {
  452. // this.storageRecordConfig.data.push(['<span class="lightOut"><span class="light ' + (item.lightsup === '0' ? 'red' : item.lightsup === '1' ? 'yellow' : 'green') + '"></span></span>', item.warning, item.date])
  453. // })
  454. dataL7[0].forEach((item, index) => {
  455. if (dataL7[1][index] < 0 && dataL7[0][index] > 0) {
  456. let obj = { value: [this.companyList[index].name, dataL7[0][index]], symbolSize: 15 }
  457. this.twinkle7.push(obj)
  458. }
  459. })
  460. // if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
  461. dataL8[0].forEach((item, index) => {
  462. if (dataL8[1][index] < 0 && dataL8[0][index] > 0) {
  463. let obj = { value: [this.companyList[index].name, dataL8[0][index]], symbolSize: 15 }
  464. this.twinkle8.push(obj)
  465. }
  466. })
  467. //params.value > 0 && dataR6[0][params.dataIndex] < 0
  468. // params.value > 0 && fjxdataL2[0][params.dataIndex] < 0
  469. dataR6[0].forEach((item, index) => {
  470. if (dataR6[1][index] > 0 && dataR6[0][index] < 0) {
  471. let obj = { value: [this.companyList[index].name, dataR6[1][index]], symbolSize: 15 }
  472. this.twinkleR6.push(obj)
  473. }
  474. })
  475. this.tipData = tipData.analysis
  476. this.generateEcharts()
  477. if (this.companyList.length > 18) {
  478. this.timeCommon = setInterval(() => {
  479. if (that.touch) {
  480. if (that.commonOption.dataZoom[0].startValue < that.companyList.length) {
  481. that.commonOption.dataZoom[0].endValue += 18
  482. that.commonOption.dataZoom[0].startValue += 18
  483. } else {
  484. that.commonOption.dataZoom[0].endValue = 0
  485. that.commonOption.dataZoom[0].startValue = 18
  486. }
  487. that.generateEcharts()
  488. }
  489. }, 15000)
  490. }
  491. resolve(1)
  492. })
  493. });
  494. },
  495. handleShowTip (index) {
  496. this.showTip = true
  497. this.tipNum = index
  498. },
  499. handleGoPage (id,name) {
  500. window.location.href = './index5.html?id=' + id + `&access_token=${this.access_token}` + `&name=${name}`
  501. // this.orgNumber = id
  502. // this.titleName = name
  503. // this.getInstitutional()
  504. },
  505. handleGoIndex () {
  506. window.location.href = './index.html'
  507. },
  508. handleGoBack () {
  509. window.history.go(-1)
  510. },
  511. numFormat (value) {
  512. if (!value) return '0'
  513. // var intPart = Number(value).toFixed(0) // 获取整数部分
  514. var intPart = parseInt(value)// 获取整数部分
  515. var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') // 将整数部分逢三一断
  516. var floatPart = '.00' // 预定义小数部分
  517. var value2Array = value.toString().split('.')
  518. // =2表示数据有小数位
  519. if (value2Array.length === 2) {
  520. floatPart = value2Array[1].toString() // 拿到小数部分
  521. if (floatPart.length === 1) {
  522. // 补0
  523. return intPartFormat + '.' + floatPart + '0'
  524. } else {
  525. return intPartFormat + '.' + floatPart
  526. }
  527. } else {
  528. return intPartFormat
  529. }
  530. },
  531. initChartL1 () {
  532. let myChart = echarts.init(this.$refs['echartL1'])
  533. let option = {
  534. ..._.cloneDeep(this.commonOption),
  535. color: [
  536. {
  537. x: 0,
  538. y: 0,
  539. x2: 0,
  540. y2: 1,
  541. colorStops: [{
  542. offset: 0,
  543. color: '#5e7ae9',
  544. },
  545. {
  546. offset: 1,
  547. color: '#082550',
  548. },],
  549. }
  550. ],
  551. series: [
  552. {
  553. name: '各企业本部机构数核定上限',
  554. type: 'line',
  555. // yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  556. smooth: true, //平滑曲线显示
  557. showAllSymbol: true, //显示所有图形。
  558. symbol: 'circle', //标记的图形为实心圆
  559. symbolSize: 8, //标记的大小
  560. smooth: false,
  561. itemStyle: {
  562. //折线拐点标志的样式
  563. color: '#fbe138',
  564. borderColor: '#fbe138',
  565. width: 2,
  566. shadowColor: '#fbe138',
  567. shadowBlur: 4,
  568. },
  569. lineStyle: {
  570. color: '#fbe138',
  571. width: 2,
  572. },
  573. data: dataL1[2],
  574. },
  575. {
  576. name: '六定改革前各企业本部机构数',
  577. type: 'bar',
  578. barWidth: 15,
  579. itemStyle: {
  580. normal: {
  581. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  582. {
  583. offset: 0,
  584. color: '#43ede3',
  585. },
  586. {
  587. offset: 1,
  588. color: '#082550',
  589. },
  590. ]),
  591. },
  592. },
  593. data: dataL1[0],
  594. },
  595. {
  596. name: '当前各企业本部机构数',
  597. type: 'bar',
  598. barWidth: 15,
  599. itemStyle: {
  600. normal: {
  601. color: params => {
  602. if (params.value > dataL1[2][params.dataIndex]) {
  603. return 'yellow'
  604. } else {
  605. return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  606. {
  607. offset: 0,
  608. color: '#5e7ae9',
  609. },
  610. {
  611. offset: 1,
  612. color: '#082550',
  613. },
  614. ])
  615. }
  616. },
  617. },
  618. },
  619. data: dataL1[1],
  620. },
  621. ],
  622. // tooltip: {
  623. // trigger: 'item',
  624. // position: 'top'
  625. // },
  626. }
  627. option.title.text = '本部机构数'
  628. option.legend.data = ['六定改革前各企业本部机构数', '当前各企业本部机构数', '各企业本部机构数核定上限']
  629. option.yAxis.push({
  630. splitLine: {
  631. show: false,
  632. },
  633. axisLine: {
  634. show: false,
  635. },
  636. })
  637. myChart.setOption(option)
  638. },
  639. initChartL2 () {
  640. let myChart = echarts.init(this.$refs['echartL2'])
  641. let option = {
  642. ..._.cloneDeep(this.commonOption),
  643. color: [
  644. {
  645. x: 0,
  646. y: 0,
  647. x2: 0,
  648. y2: 1,
  649. colorStops: [{
  650. offset: 0,
  651. color: '#69c0ff',
  652. },
  653. {
  654. offset: 1,
  655. color: '#082550',
  656. },],
  657. }
  658. ],
  659. series: [
  660. {
  661. name: '当前各企业所属架构数',
  662. type: 'bar',
  663. barWidth: 15,
  664. itemStyle: {
  665. normal: {
  666. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  667. {
  668. offset: 0,
  669. color: '#69c0ff',
  670. },
  671. {
  672. offset: 1,
  673. color: '#082550',
  674. },
  675. ]),
  676. },
  677. },
  678. data: dataL2[0]
  679. }
  680. ],
  681. }
  682. option.title.text = '各企业所属架构数'
  683. option.legend.data = ['当前各企业所属架构数']
  684. option.yAxis.push({
  685. splitLine: {
  686. show: false,
  687. },
  688. axisLine: {
  689. show: false,
  690. },
  691. })
  692. myChart.setOption(option)
  693. },
  694. initChartL3 () {
  695. let myChart = echarts.init(this.$refs['echartL3'])
  696. let option = {
  697. ..._.cloneDeep(this.commonOption),
  698. color: [
  699. {
  700. x: 0,
  701. y: 0,
  702. x2: 0,
  703. y2: 1,
  704. colorStops: [{
  705. offset: 0,
  706. color: '#6480f3',
  707. },
  708. {
  709. offset: 1,
  710. color: '#082550',
  711. },],
  712. }
  713. ],
  714. series: [
  715. {
  716. name: '六定改革前各本部中层管理人数',
  717. type: 'bar',
  718. barWidth: 15,
  719. label: {
  720. normal: {
  721. show: true,
  722. position: 'top',
  723. textStyle: {
  724. color: '#69c0ff',
  725. fontStyle: 'normal',
  726. textAlign: 'left',
  727. fontSize: 16,
  728. },
  729. formatter: function (data) {
  730. if (data.name == '云时代') {
  731. return data.value
  732. } else {
  733. return ''
  734. }
  735. }
  736. }
  737. },
  738. itemStyle: {
  739. normal: {
  740. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  741. {
  742. offset: 0,
  743. color: '#6480f3',
  744. },
  745. {
  746. offset: 1,
  747. color: '#082550',
  748. },
  749. ]),
  750. },
  751. },
  752. data: dataL4[0],
  753. },
  754. {
  755. name: '当前各本部中层管理人数',
  756. type: 'bar',
  757. barWidth: 15,
  758. label: {
  759. normal: {
  760. show: true,
  761. position: 'top',
  762. textStyle: {
  763. color: '#6480f3',
  764. fontStyle: 'normal',
  765. textAlign: 'left',
  766. fontSize: 16,
  767. },
  768. formatter: function (data) {
  769. if (data.name == '云时代') {
  770. return data.value
  771. } else {
  772. return ''
  773. }
  774. }
  775. }
  776. },
  777. itemStyle: {
  778. normal: {
  779. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  780. {
  781. offset: 0,
  782. color: '#43ede3',
  783. },
  784. {
  785. offset: 1,
  786. color: '#082550',
  787. },
  788. ]),
  789. },
  790. },
  791. data: dataL4[1],
  792. },
  793. {
  794. name: '各本部中层管理人数核定上限',
  795. type: 'line',
  796. // yAxisIndex: 1,
  797. smooth: true, //平滑曲线显示
  798. showAllSymbol: true, //显示所有图形。
  799. symbol: 'circle', //标记的图形为实心圆
  800. symbolSize: 8, //标记的大小
  801. smooth: false,
  802. label: {
  803. normal: {
  804. show: true,
  805. position: 'top',
  806. textStyle: {
  807. color: '#fbe138',
  808. fontStyle: 'normal',
  809. textAlign: 'left',
  810. fontSize: 16,
  811. },
  812. formatter: function (data) {
  813. if (data.name == '云时代') {
  814. return data.value
  815. } else {
  816. return ''
  817. }
  818. }
  819. }
  820. },
  821. itemStyle: {
  822. //折线拐点标志的样式
  823. color: '#fbe138',
  824. borderColor: '#fbe138',
  825. width: 2,
  826. shadowColor: '#fbe138',
  827. shadowBlur: 4,
  828. },
  829. lineStyle: {
  830. color: '#fbe138',
  831. width: 2,
  832. },
  833. data: dataL4[2],
  834. },
  835. ],
  836. }
  837. option.title.text = '各企业本部中层管理人数'
  838. option.legend.data = ['六定改革前各本部中层管理人数', '当前各本部中层管理人数', '各本部中层管理人数核定上限']
  839. option.yAxis.push({
  840. type: 'value',
  841. axisLine: {
  842. show: false,
  843. },
  844. splitLine: {
  845. show: false,
  846. },
  847. })
  848. myChart.setOption(option)
  849. },
  850. initChartL4 () {
  851. let myChart = echarts.init(this.$refs['echartL4'])
  852. let option = {
  853. ..._.cloneDeep(this.commonOption),
  854. color: [
  855. {
  856. x: 0,
  857. y: 0,
  858. x2: 0,
  859. y2: 1,
  860. colorStops: [{
  861. offset: 0,
  862. color: '#6480f3',
  863. },
  864. {
  865. offset: 1,
  866. color: '#082550',
  867. },],
  868. }
  869. ],
  870. series: [
  871. {
  872. name: '六定改革前各本部中层管理人数',
  873. type: 'bar',
  874. barWidth: 15,
  875. label: {
  876. normal: {
  877. show: true,
  878. position: 'top',
  879. textStyle: {
  880. color: '#69c0ff',
  881. fontStyle: 'normal',
  882. textAlign: 'left',
  883. fontSize: 16,
  884. },
  885. formatter: function (data) {
  886. if (data.name == '云时代') {
  887. return data.value
  888. } else {
  889. return ''
  890. }
  891. }
  892. }
  893. },
  894. itemStyle: {
  895. normal: {
  896. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  897. {
  898. offset: 0,
  899. color: '#6480f3',
  900. },
  901. {
  902. offset: 1,
  903. color: '#082550',
  904. },
  905. ]),
  906. },
  907. },
  908. data: dataL4[0],
  909. },
  910. {
  911. name: '当前各本部中层管理人数',
  912. type: 'bar',
  913. barWidth: 15,
  914. label: {
  915. normal: {
  916. show: true,
  917. position: 'top',
  918. textStyle: {
  919. color: '#6480f3',
  920. fontStyle: 'normal',
  921. textAlign: 'left',
  922. fontSize: 16,
  923. },
  924. formatter: function (data) {
  925. if (data.name == '云时代') {
  926. return data.value
  927. } else {
  928. return ''
  929. }
  930. }
  931. }
  932. },
  933. itemStyle: {
  934. normal: {
  935. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  936. {
  937. offset: 0,
  938. color: '#43ede3',
  939. },
  940. {
  941. offset: 1,
  942. color: '#082550',
  943. },
  944. ]),
  945. },
  946. },
  947. data: dataL4[1],
  948. },
  949. {
  950. name: '各本部中层管理人数核定上限',
  951. type: 'line',
  952. // yAxisIndex: 1,
  953. smooth: true, //平滑曲线显示
  954. showAllSymbol: true, //显示所有图形。
  955. symbol: 'circle', //标记的图形为实心圆
  956. symbolSize: 8, //标记的大小
  957. smooth: false,
  958. label: {
  959. normal: {
  960. show: true,
  961. position: 'top',
  962. textStyle: {
  963. color: '#fbe138',
  964. fontStyle: 'normal',
  965. textAlign: 'left',
  966. fontSize: 16,
  967. },
  968. formatter: function (data) {
  969. if (data.name == '云时代') {
  970. return data.value
  971. } else {
  972. return ''
  973. }
  974. }
  975. }
  976. },
  977. itemStyle: {
  978. //折线拐点标志的样式
  979. color: '#fbe138',
  980. borderColor: '#fbe138',
  981. width: 2,
  982. shadowColor: '#fbe138',
  983. shadowBlur: 4,
  984. },
  985. lineStyle: {
  986. color: '#fbe138',
  987. width: 2,
  988. },
  989. data: dataL4[2],
  990. },
  991. ],
  992. }
  993. option.title.text = '各企业本部中层管理人数'
  994. option.legend.data = ['六定改革前各本部中层管理人数', '当前各本部中层管理人数', '各本部中层管理人数核定上限']
  995. option.legend.show = true
  996. // option.yAxis.push({
  997. // splitLine: {
  998. // show: false,
  999. // },
  1000. // axisLine: {
  1001. // show: false,
  1002. // },
  1003. // })
  1004. myChart.setOption(option)
  1005. },
  1006. initChartL5 () {
  1007. let myChart = echarts.init(this.$refs['echartL5'])
  1008. let option = {
  1009. ..._.cloneDeep(this.commonOption),
  1010. color: [
  1011. {
  1012. x: 0,
  1013. y: 0,
  1014. x2: 0,
  1015. y2: 1,
  1016. colorStops: [{
  1017. offset: 0,
  1018. color: '#69c0ff',
  1019. },
  1020. {
  1021. offset: 1,
  1022. color: '#082550',
  1023. },],
  1024. }
  1025. ],
  1026. series: [
  1027. {
  1028. name: '各企业总人数',
  1029. type: 'bar',
  1030. barWidth: 15,
  1031. itemStyle: {
  1032. normal: {
  1033. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1034. {
  1035. offset: 0,
  1036. color: '#69c0ff',
  1037. },
  1038. {
  1039. offset: 1,
  1040. color: '#082550',
  1041. },
  1042. ]),
  1043. },
  1044. },
  1045. data: dataL5[0],
  1046. },
  1047. {
  1048. name: '人数变化率',
  1049. type: 'line',
  1050. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  1051. smooth: true, //平滑曲线显示
  1052. showAllSymbol: true, //显示所有图形。
  1053. symbol: 'circle', //标记的图形为实心圆
  1054. symbolSize: 8, //标记的大小
  1055. smooth: false,
  1056. itemStyle: {
  1057. //折线拐点标志的样式
  1058. color: '#b889ea',
  1059. borderColor: '#b889ea',
  1060. width: 2,
  1061. shadowColor: '#b889ea',
  1062. shadowBlur: 4,
  1063. },
  1064. lineStyle: {
  1065. color: '#b889ea',
  1066. width: 2,
  1067. },
  1068. data: dataL5[1],
  1069. },
  1070. ],
  1071. }
  1072. option.title.text = '各企业总人数'
  1073. option.legend.data = ['各企业总人数', '人数变化率']
  1074. option.legend.show = true
  1075. option.tooltip = {
  1076. trigger: 'axis',
  1077. formatter: '{a0}:{c0}' + '<br/>' + '{a1}:{c1}' + '%'
  1078. }
  1079. option.yAxis.push({
  1080. type: 'value',
  1081. axisLine: {
  1082. show: false,
  1083. },
  1084. splitLine: {
  1085. show: false,
  1086. },
  1087. axisLabel: {
  1088. show: true,
  1089. formatter: '{value} %',
  1090. textStyle: {
  1091. color: 'rgba(250,250,250,0.6)',
  1092. },
  1093. },
  1094. })
  1095. myChart.setOption(option)
  1096. },
  1097. initChartL6 () {
  1098. let myChart = echarts.init(this.$refs['echartL6'])
  1099. let option = {
  1100. ..._.cloneDeep(this.commonOption),
  1101. color: [
  1102. {
  1103. x: 0,
  1104. y: 0,
  1105. x2: 0,
  1106. y2: 1,
  1107. colorStops: [{
  1108. offset: 0,
  1109. color: '#43ede3',
  1110. },
  1111. {
  1112. offset: 1,
  1113. color: '#082550',
  1114. },],
  1115. }
  1116. ],
  1117. series: [
  1118. {
  1119. name: '各企业本部员额数',
  1120. type: 'bar',
  1121. barWidth: 15,
  1122. itemStyle: {
  1123. color: params => {
  1124. if (params.value > dataL6[1][params.dataIndex]) {
  1125. return 'red'
  1126. } else {
  1127. return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1128. {
  1129. offset: 0,
  1130. color: '#43ede3',
  1131. },
  1132. {
  1133. offset: 1,
  1134. color: '#082550',
  1135. },
  1136. ])
  1137. }
  1138. },
  1139. },
  1140. data: dataL6[0],
  1141. },
  1142. {
  1143. name: '六定改革前各企业本部员额数',
  1144. type: 'bar',
  1145. barWidth: 15,
  1146. itemStyle: {
  1147. normal: {
  1148. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1149. {
  1150. offset: 0,
  1151. color: '#5e7ae9',
  1152. },
  1153. {
  1154. offset: 1,
  1155. color: '#082550',
  1156. },
  1157. ]),
  1158. },
  1159. },
  1160. data: dataL6[2],
  1161. },
  1162. {
  1163. name: '各企业本部员额数核定上限值',
  1164. type: 'line',
  1165. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  1166. smooth: true, //平滑曲线显示
  1167. showAllSymbol: true, //显示所有图形。
  1168. symbol: 'circle', //标记的图形为实心圆
  1169. symbolSize: 8, //标记的大小
  1170. smooth: false,
  1171. itemStyle: {
  1172. //折线拐点标志的样式
  1173. color: '#fbe138',
  1174. borderColor: '#fbe138',
  1175. width: 2,
  1176. shadowColor: '#fbe138',
  1177. shadowBlur: 4,
  1178. },
  1179. lineStyle: {
  1180. color: '#fbe138',
  1181. width: 2,
  1182. },
  1183. data: dataL6[1],
  1184. },
  1185. ],
  1186. }
  1187. option.title.text = '各企业本部员额数'
  1188. option.legend.data = ['各企业本部员额数', '六定改革前各企业本部员额数', '各企业本部员额数核定上限值']
  1189. option.legend.show = true
  1190. option.yAxis.push({
  1191. splitLine: {
  1192. show: false,
  1193. },
  1194. axisLine: {
  1195. show: false,
  1196. },
  1197. })
  1198. myChart.setOption(option)
  1199. },
  1200. showTipClose () {
  1201. console.log('点击了哦哦')
  1202. // this.paymentShow = false
  1203. this.showTip = false
  1204. this.showTip2 = false
  1205. this.titleShow = false
  1206. },
  1207. initChartL7 () {
  1208. let myChart = echarts.init(this.$refs['echartL7'])
  1209. let option = {
  1210. ..._.cloneDeep(this.commonOption),
  1211. color: ['#43ede3'],
  1212. series: [
  1213. {
  1214. name: '人数变化',
  1215. type: 'line',
  1216. barWidth: 15,
  1217. showAllSymbol: true, //显示所有图形。
  1218. symbol: 'circle', //标记的图形为实心圆
  1219. symbolSize: 15, //标记的大小
  1220. smooth: false,
  1221. itemStyle: {
  1222. color: params => {
  1223. if (dataL7[1][params.dataIndex] < 0 && params.value > 0) {
  1224. return 'red'
  1225. } else {
  1226. return '#43ede3'
  1227. }
  1228. },
  1229. },
  1230. // markLine: {
  1231. // data: [{ type: 'average', name: 'Avg' }],
  1232. // },
  1233. data: dataL7[0],
  1234. },
  1235. {
  1236. name: '全员劳动生产率同比变化',
  1237. type: 'line',
  1238. barWidth: 15,
  1239. // yAxisIndex: 1,
  1240. showAllSymbol: true, //显示所有图形。
  1241. symbol: 'circle', //标记的图形为实心圆
  1242. symbolSize: 15, //标记的大小
  1243. smooth: false,
  1244. itemStyle: {
  1245. //折线拐点标志的样式
  1246. color: '#b889ea',
  1247. borderColor: '#b889ea',
  1248. width: 2,
  1249. shadowColor: '#b889ea',
  1250. shadowBlur: 4,
  1251. },
  1252. data: dataL7[1],
  1253. },
  1254. {
  1255. type: 'effectScatter',
  1256. coordinateSystem: 'cartesian2d',
  1257. showEffectOn: 'render',
  1258. rippleEffect: {
  1259. period: 10,
  1260. scale: 4,
  1261. brushType: 'stroke'
  1262. },
  1263. hoverAnimation: true,
  1264. itemStyle: {
  1265. color: 'red'
  1266. },
  1267. lineStyle: {
  1268. color: '#43ede3',
  1269. width: 2,
  1270. },
  1271. data: this.twinkle7,
  1272. },
  1273. ],
  1274. }
  1275. option.title.text = '人数变化和全员劳动生产率变化率分析'
  1276. option.legend.data = ['人数变化', '全员劳动生产率同比变化']
  1277. option.legend.show = true
  1278. option.tooltip = {
  1279. trigger: 'axis',
  1280. formatter: '{a0}:{c0}' + '%' + '<br/>' + '{a1}:{c1}' + '%'
  1281. }
  1282. option.yAxis = [
  1283. {
  1284. type: 'value',
  1285. axisLine: {
  1286. show: false,
  1287. },
  1288. splitLine: {
  1289. show: true,
  1290. lineStyle: {
  1291. color: '#68b4dd66',
  1292. type: 'dashed',
  1293. },
  1294. },
  1295. axisLabel: {
  1296. show: true,
  1297. formatter: '{value} %',
  1298. textStyle: {
  1299. color: 'rgba(250,250,250,0.6)',
  1300. },
  1301. },
  1302. },
  1303. {
  1304. type: 'value',
  1305. axisLine: {
  1306. show: false,
  1307. },
  1308. splitLine: {
  1309. show: false,
  1310. },
  1311. axisLabel: {
  1312. show: true,
  1313. formatter: '{value} %',
  1314. textStyle: {
  1315. color: 'rgba(250,250,250,0.6)',
  1316. },
  1317. },
  1318. }
  1319. ]
  1320. myChart.setOption(option)
  1321. },
  1322. initChartL8 () {
  1323. let myChart = echarts.init(this.$refs['echartL8'])
  1324. let option = {
  1325. ..._.cloneDeep(this.commonOption),
  1326. color: ['#43ede3'],
  1327. series: [
  1328. {
  1329. name: '人数变化',
  1330. type: 'line',
  1331. barWidth: 15,
  1332. showAllSymbol: true, //显示所有图形。
  1333. symbol: 'circle', //标记的图形为实心圆
  1334. symbolSize: 15, //标记的大小
  1335. smooth: false,
  1336. itemStyle: {
  1337. color: params => {
  1338. if (dataL8[1][params.dataIndex] < 0 && params.value > 0) {
  1339. return 'red'
  1340. } else {
  1341. return '#43ede3'
  1342. }
  1343. },
  1344. },
  1345. lineStyle: {
  1346. color: '#43ede3',
  1347. width: 2,
  1348. },
  1349. // markLine: {
  1350. // data: [{ type: 'average', name: 'Avg' }],
  1351. // },
  1352. data: dataL8[0],
  1353. },
  1354. {
  1355. name: '人工成本利润率同比变化',
  1356. type: 'line',
  1357. barWidth: 15,
  1358. // yAxisIndex: 1,
  1359. showAllSymbol: true, //显示所有图形。
  1360. symbol: 'circle', //标记的图形为实心圆
  1361. symbolSize: 15, //标记的大小
  1362. smooth: false,
  1363. itemStyle: {
  1364. //折线拐点标志的样式
  1365. color: '#b889ea',
  1366. borderColor: '#b889ea',
  1367. width: 2,
  1368. shadowColor: '#b889ea',
  1369. shadowBlur: 4,
  1370. },
  1371. data: dataL8[1],
  1372. },
  1373. {
  1374. type: 'effectScatter',
  1375. coordinateSystem: 'cartesian2d',
  1376. showEffectOn: 'render',
  1377. rippleEffect: {
  1378. period: 10,
  1379. scale: 4,
  1380. brushType: 'stroke'
  1381. },
  1382. hoverAnimation: true,
  1383. itemStyle: {
  1384. color: 'red'
  1385. },
  1386. lineStyle: {
  1387. color: '#43ede3',
  1388. width: 2,
  1389. },
  1390. data: this.twinkle8,
  1391. },
  1392. ],
  1393. }
  1394. option.title.text = '人数变化和人工利润率变化分析'
  1395. option.legend.data = ['人数变化', '人工成本利润率同比变化']
  1396. option.legend.show = true
  1397. option.tooltip = {
  1398. trigger: 'axis',
  1399. formatter: '{a0}:{c0}' + '%' + '<br/>' + '{a1}:{c1}' + '%'
  1400. }
  1401. option.yAxis = [
  1402. {
  1403. type: 'value',
  1404. axisLine: {
  1405. show: false,
  1406. },
  1407. splitLine: {
  1408. show: true,
  1409. lineStyle: {
  1410. color: '#68b4dd66',
  1411. type: 'dashed',
  1412. },
  1413. },
  1414. axisLabel: {
  1415. show: true,
  1416. formatter: '{value} %',
  1417. textStyle: {
  1418. color: 'rgba(250,250,250,0.6)',
  1419. },
  1420. },
  1421. },
  1422. {
  1423. type: 'value',
  1424. axisLine: {
  1425. show: false,
  1426. },
  1427. splitLine: {
  1428. show: false,
  1429. },
  1430. axisLabel: {
  1431. show: true,
  1432. formatter: '{value} %',
  1433. textStyle: {
  1434. color: 'rgba(250,250,250,0.6)',
  1435. },
  1436. },
  1437. }
  1438. ]
  1439. myChart.setOption(option)
  1440. },
  1441. // 中间图表---------------------------------------------开始
  1442. initChartC1 () {
  1443. let myChart = echarts.init(this.$refs['echartC1'])
  1444. let option = {
  1445. ..._.cloneDeep(this.commonOption),
  1446. color: [
  1447. {
  1448. x: 0,
  1449. y: 0,
  1450. x2: 0,
  1451. y2: 1,
  1452. colorStops: [{
  1453. offset: 0,
  1454. color: '#69c0ff',
  1455. },
  1456. {
  1457. offset: 1,
  1458. color: '#082550',
  1459. },],
  1460. }
  1461. ],
  1462. series: [
  1463. {
  1464. name: '全员劳动生产率(万/人)',
  1465. type: 'bar',
  1466. barWidth: 12,
  1467. smooth: true, //平滑曲线显示
  1468. showAllSymbol: true, //显示所有图形。
  1469. symbol: 'circle', //标记的图形为实心圆
  1470. symbolSize: 8, //标记的大小
  1471. smooth: false,
  1472. itemStyle: {
  1473. color: params => {
  1474. if (params.value < 0 && dataC1[1][params.dataIndex] < 0) {
  1475. return 'red'
  1476. } else if (params.value > this.echartC1.province) {
  1477. return 'green'
  1478. } else {
  1479. return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1480. {
  1481. offset: 0,
  1482. color: '#69c0ff',
  1483. },
  1484. {
  1485. offset: 1,
  1486. color: '#082550',
  1487. },
  1488. ])
  1489. }
  1490. },
  1491. },
  1492. lineStyle: {
  1493. color: '#B889EA',
  1494. width: 2,
  1495. },
  1496. // data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
  1497. data: dataC1[0],
  1498. markLine: {
  1499. data: [
  1500. {
  1501. name: '省属企业平均水平',
  1502. yAxis: this.echartC1.national,
  1503. lineStyle: {
  1504. color: '#fff',
  1505. },
  1506. label: {
  1507. formatter: '{b}',
  1508. position: 'end',
  1509. padding: [20, 100, 10, 30],
  1510. color: '#fff',
  1511. },
  1512. },
  1513. {
  1514. name: '央企平均水平',
  1515. yAxis: this.echartC1.province,
  1516. lineStyle: {
  1517. color: '#fff',
  1518. },
  1519. label: {
  1520. formatter: '{b}',
  1521. position: 'end',
  1522. padding: [-4, 150, 10, 30],
  1523. color: '#fff',
  1524. },
  1525. },
  1526. ],
  1527. label: {
  1528. distance: [20, 8],
  1529. },
  1530. },
  1531. },
  1532. {
  1533. name: '全员劳动生产率同比变化',
  1534. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  1535. type: 'line',
  1536. itemStyle: {
  1537. normal: {
  1538. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1539. {
  1540. offset: 0,
  1541. color: '#69c0ff',
  1542. },
  1543. {
  1544. offset: 1,
  1545. color: '#082550',
  1546. },
  1547. ]),
  1548. },
  1549. },
  1550. data: dataC1[1],
  1551. },
  1552. ],
  1553. }
  1554. option.title.text = '各全员劳动生产率'
  1555. option.legend.data = ['全员劳动生产率(万/人)', '全员劳动生产率同比变化']
  1556. option.legend.show = true
  1557. option.grid.right = '15%'
  1558. option.tooltip = {
  1559. show:true,
  1560. trigger: 'axis',
  1561. formatter: '{a0}:{c0}' + '%' + '<br/>' + '{a1}:{c1}' + '%'
  1562. }
  1563. option.yAxis.push({
  1564. type: 'value',
  1565. axisLine: {
  1566. show: false,
  1567. },
  1568. splitLine: {
  1569. show: false,
  1570. },
  1571. axisLabel: {
  1572. show: true,
  1573. formatter: '{value} %',
  1574. textStyle: {
  1575. color: 'rgba(250,250,250,0.6)',
  1576. },
  1577. },
  1578. })
  1579. myChart.setOption(option)
  1580. // tools.loopShowTooltip(myChart, option, {
  1581. // nterval: 2000,
  1582. // loopSeries: true,
  1583. // });
  1584. },
  1585. initChartC2 () {
  1586. let myChart = echarts.init(this.$refs['echartC2'])
  1587. let option = {
  1588. ..._.cloneDeep(this.commonOption),
  1589. color: [
  1590. {
  1591. x: 0,
  1592. y: 0,
  1593. x2: 0,
  1594. y2: 1,
  1595. colorStops: [{
  1596. offset: 0,
  1597. color: '#69c0ff',
  1598. },
  1599. {
  1600. offset: 1,
  1601. color: '#082550',
  1602. },],
  1603. }
  1604. ],
  1605. series: [
  1606. {
  1607. name: '人工成本利润率同比变化',
  1608. type: 'line',
  1609. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  1610. smooth: true, //平滑曲线显示
  1611. showAllSymbol: true, //显示所有图形。
  1612. symbol: 'circle', //标记的图形为实心圆
  1613. symbolSize: 8, //标记的大小
  1614. smooth: false,
  1615. itemStyle: {
  1616. //折线拐点标志的样式
  1617. color: '#B889EA',
  1618. borderColor: '#B889EA',
  1619. width: 2,
  1620. shadowColor: '#B889EA',
  1621. shadowBlur: 4,
  1622. },
  1623. lineStyle: {
  1624. color: '#B889EA',
  1625. width: 2,
  1626. },
  1627. data: dataC2[0],
  1628. },
  1629. {
  1630. name: '人工成本利润率',
  1631. type: 'bar',
  1632. barWidth: 15,
  1633. itemStyle: {
  1634. color: params => {
  1635. if (params.value < 0 && dataC2[1][params.dataIndex] < 0) {
  1636. return 'red'
  1637. } else if (params.value > this.echartC2.province) {
  1638. return 'green'
  1639. } else {
  1640. return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1641. {
  1642. offset: 0,
  1643. color: '#69c0ff',
  1644. },
  1645. {
  1646. offset: 1,
  1647. color: '#082550',
  1648. },
  1649. ])
  1650. }
  1651. },
  1652. },
  1653. data: dataC2[1],
  1654. markLine: {
  1655. data: [
  1656. {
  1657. name: '省属企业平均水平',
  1658. yAxis: this.echartC2.province,
  1659. lineStyle: {
  1660. color: '#fff',
  1661. },
  1662. label: {
  1663. formatter: '{b}',
  1664. position: 'end',
  1665. padding: [24, 100, 10, 30],
  1666. color: '#fff',
  1667. },
  1668. },
  1669. {
  1670. name: '央企平均水平',
  1671. yAxis: this.echartC2.national,
  1672. lineStyle: {
  1673. color: '#fff',
  1674. },
  1675. label: {
  1676. formatter: '{b}',
  1677. position: 'end',
  1678. padding: [-24, 200, 10, 30],
  1679. color: '#fff',
  1680. },
  1681. },
  1682. ],
  1683. label: {
  1684. distance: [20, 8],
  1685. },
  1686. },
  1687. },
  1688. ],
  1689. }
  1690. option.title.text = '各人工成本利润率'
  1691. option.legend.data = ['人工成本利润率', '人工成本利润率同比变化']
  1692. option.legend.show = true
  1693. option.tooltip = {
  1694. show:true,
  1695. trigger: 'axis',
  1696. formatter: '{a0}:{c0}' + '%' + '<br/>' + '{a1}:{c1}' + '%'
  1697. }
  1698. option.grid.right = '15%'
  1699. option.yAxis = [
  1700. {
  1701. splitLine: {
  1702. show: true,
  1703. lineStyle: {
  1704. color: '#68b4dd66',
  1705. type: 'dashed',
  1706. },
  1707. },
  1708. axisLine: {
  1709. show: false,
  1710. },
  1711. axisLabel: {
  1712. show: true,
  1713. formatter: '{value} %',
  1714. textStyle: {
  1715. color: 'rgba(250,250,250,0.6)',
  1716. },
  1717. },
  1718. },
  1719. {
  1720. splitLine: {
  1721. show: false,
  1722. },
  1723. axisLine: {
  1724. show: false,
  1725. },
  1726. axisLabel: {
  1727. show: true,
  1728. formatter: '{value} %',
  1729. textStyle: {
  1730. color: 'rgba(250,250,250,0.6)',
  1731. },
  1732. },
  1733. }
  1734. ]
  1735. myChart.setOption(option)
  1736. // tools.loopShowTooltip(myChart, option, {
  1737. // nterval: 2000,
  1738. // loopSeries: true,
  1739. // });
  1740. },
  1741. // 右侧图表---------------------------------------------开始
  1742. initChartR1 () {
  1743. let myChart = echarts.init(this.$refs['echartR1'])
  1744. let commonOptions = this.commonOption
  1745. commonOptions.yAxis[0].splitNumber = 2
  1746. let option = {
  1747. ..._.cloneDeep(commonOptions),
  1748. series: [
  1749. {
  1750. name: '招聘需求公告次数',
  1751. type: 'bar',
  1752. barWidth: 15,
  1753. itemStyle: {
  1754. normal: {
  1755. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1756. {
  1757. offset: 0,
  1758. color: '#69c0ff',
  1759. },
  1760. {
  1761. offset: 1,
  1762. color: '#082550',
  1763. },
  1764. ]),
  1765. },
  1766. },
  1767. data: dataR1[0],
  1768. },
  1769. {
  1770. name: '招聘需求公告累计公开招聘人数',
  1771. type: 'bar',
  1772. barWidth: 15,
  1773. itemStyle: {
  1774. normal: {
  1775. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1776. {
  1777. offset: 0,
  1778. color: '#43ede3',
  1779. },
  1780. {
  1781. offset: 1,
  1782. color: '#082550',
  1783. },
  1784. ]),
  1785. },
  1786. },
  1787. data: dataR1[1],
  1788. },
  1789. ],
  1790. }
  1791. option.title.text = '各企业招聘需求公告人次情况'
  1792. option.legend.data = ['招聘需求公告次数', '招聘需求公告累计公开招聘人数']
  1793. option.legend.show = true
  1794. option.yAxis.push({
  1795. splitLine: {
  1796. show: false,
  1797. },
  1798. axisLine: {
  1799. show: false,
  1800. },
  1801. })
  1802. myChart.setOption(option)
  1803. },
  1804. initChartR2 () {
  1805. let myChart = echarts.init(this.$refs['echartR2'])
  1806. let commonOptions = this.commonOption
  1807. commonOptions.yAxis[0].splitNumber = 2
  1808. let option = {
  1809. ..._.cloneDeep(commonOptions),
  1810. series: [
  1811. {
  1812. name: '录用结果公示次数',
  1813. type: 'bar',
  1814. barWidth: 15,
  1815. itemStyle: {
  1816. normal: {
  1817. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1818. {
  1819. offset: 0,
  1820. color: '#69c0ff',
  1821. },
  1822. {
  1823. offset: 1,
  1824. color: '#082550',
  1825. },
  1826. ]),
  1827. },
  1828. },
  1829. data: dataR2[0],
  1830. },
  1831. {
  1832. name: '录用结果公示累计公示人数',
  1833. type: 'bar',
  1834. barWidth: 15,
  1835. itemStyle: {
  1836. normal: {
  1837. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1838. {
  1839. offset: 0,
  1840. color: '#45DAD1',
  1841. },
  1842. {
  1843. offset: 1,
  1844. color: '#082550',
  1845. },
  1846. ]),
  1847. },
  1848. },
  1849. data: dataR2[1],
  1850. },
  1851. ],
  1852. }
  1853. option.title.text = '各企业录用结果公示人次'
  1854. option.legend.data = ['录用结果公示次数', '录用结果公示累计公示人数']
  1855. option.legend.show = true
  1856. option.yAxis.push({
  1857. splitLine: {
  1858. show: false,
  1859. },
  1860. axisLine: {
  1861. show: false,
  1862. },
  1863. })
  1864. myChart.setOption(option)
  1865. },
  1866. initChartR3 () {
  1867. let myChart = echarts.init(this.$refs['echartR3'])
  1868. let commonOptions = this.commonOption
  1869. commonOptions.yAxis[0].splitNumber = 2
  1870. let option = {
  1871. ..._.cloneDeep(commonOptions),
  1872. color: [
  1873. {
  1874. x: 0,
  1875. y: 0,
  1876. x2: 0,
  1877. y2: 1,
  1878. colorStops: [{
  1879. offset: 0,
  1880. color: '#45DAD1',
  1881. },
  1882. {
  1883. offset: 1,
  1884. color: '#082550',
  1885. },],
  1886. }
  1887. ],
  1888. series: [
  1889. {
  1890. name: '年利润(万)',
  1891. type: 'bar',
  1892. barWidth: 15,
  1893. itemStyle: {
  1894. normal: {
  1895. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1896. {
  1897. offset: 0,
  1898. color: '#69c0ff',
  1899. },
  1900. {
  1901. offset: 1,
  1902. color: '#082550',
  1903. },
  1904. ]),
  1905. },
  1906. },
  1907. data: dataR3[0],
  1908. },
  1909. {
  1910. name: '2022年累计招聘数',
  1911. type: 'bar',
  1912. yAxisIndex: 1, //使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用
  1913. barWidth: 15,
  1914. itemStyle: {
  1915. color: params => {
  1916. if (params.value > 0 && dataR3[0][params.dataIndex] < 0) {
  1917. return 'red'
  1918. } else {
  1919. return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1920. {
  1921. offset: 0,
  1922. color: '#45DAD1',
  1923. },
  1924. {
  1925. offset: 1,
  1926. color: '#082550',
  1927. },
  1928. ])
  1929. }
  1930. },
  1931. },
  1932. data: dataR3[1],
  1933. },
  1934. ],
  1935. }
  1936. option.title.text = '各企业年利润与招聘情况分析'
  1937. option.legend.data = ['年利润(万)', '2022年累计招聘数']
  1938. option.legend.show = true
  1939. option.yAxis[0].max = function (value) {
  1940. if (Math.abs(value.max) > Math.abs(value.min)) {
  1941. return (Math.abs(value.max) * 1.2).toFixed(2);
  1942. } else {
  1943. return (Math.abs(value.min) * 1.2).toFixed(2);
  1944. }
  1945. }
  1946. option.yAxis[0].min = function (value) {
  1947. if (Math.abs(value.max) > Math.abs(value.min)) {
  1948. return (-Math.abs(value.max) * 1.2).toFixed(2);
  1949. } else {
  1950. return (-Math.abs(value.min) * 1.2).toFixed(2);
  1951. }
  1952. }
  1953. option.yAxis.push({
  1954. max: function (val) {
  1955. if (Math.abs(val.max) > Math.abs(val.min)) {
  1956. return (Math.abs(val.max) * 1.2).toFixed(0)
  1957. } else {
  1958. return (Math.abs(val.min) * 1.2).toFixed(0)
  1959. }
  1960. },
  1961. min: function (val) {
  1962. if (Math.abs(val.max) > Math.abs(val.min)) {
  1963. return (-Math.abs(val.max) * 1.2).toFixed(0)
  1964. } else {
  1965. return (Math.abs(val.min) * 1.2).toFixed(0)
  1966. }
  1967. },
  1968. splitLine: {
  1969. show: false,
  1970. },
  1971. axisLine: {
  1972. show: false,
  1973. },
  1974. axisLabel: {
  1975. show: true,
  1976. formatter: '{value}',
  1977. textStyle: {
  1978. color: 'rgba(250,250,250,0.6)',
  1979. },
  1980. },
  1981. })
  1982. myChart.setOption(option)
  1983. },
  1984. initChartR4 () {
  1985. let myChart = echarts.init(this.$refs['echartR4'])
  1986. let commonOptions = this.commonOption
  1987. commonOptions.yAxis[0].splitNumber = 2
  1988. let option = {
  1989. ..._.cloneDeep(commonOptions),
  1990. color: [
  1991. {
  1992. x: 0,
  1993. y: 0,
  1994. x2: 0,
  1995. y2: 1,
  1996. colorStops: [{
  1997. offset: 0,
  1998. color: '#6480f3',
  1999. },
  2000. {
  2001. offset: 1,
  2002. color: '#082550',
  2003. },],
  2004. }
  2005. ],
  2006. series: [
  2007. {
  2008. name: '2022年退出人数和2023年当前累计退出人数之和',
  2009. type: 'bar',
  2010. barWidth: 15,
  2011. itemStyle: {
  2012. normal: {
  2013. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  2014. {
  2015. offset: 0,
  2016. color: '#69c0ff',
  2017. },
  2018. {
  2019. offset: 1,
  2020. color: '#082550',
  2021. },
  2022. ]),
  2023. },
  2024. },
  2025. data: dataR4[0],
  2026. },
  2027. {
  2028. name: '2022年招聘人数和2023年当前累计招聘人数之和',
  2029. type: 'bar',
  2030. barWidth: 15,
  2031. itemStyle: {
  2032. normal: {
  2033. color: params => {
  2034. if (dataR4[0][params.dataIndex] / 2 < params.value) {
  2035. return 'red'
  2036. }
  2037. else {
  2038. return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  2039. {
  2040. offset: 0,
  2041. color: '#6480f3',
  2042. },
  2043. {
  2044. offset: 1,
  2045. color: '#082550',
  2046. },
  2047. ])
  2048. }
  2049. },
  2050. },
  2051. },
  2052. data: dataR4[1],
  2053. },
  2054. ],
  2055. }
  2056. option.title.text = '各企业"退二进一"完成情况'
  2057. option.legend.data = ['2022年退出人数和2023年当前累计退出人数之和', '2022年招聘人数和2023年当前累计招聘人数之和']
  2058. option.legend.show = true
  2059. option.yAxis[0] = {
  2060. //type: 'log',
  2061. //min: 1,
  2062. //logBase: 3,
  2063. axisLine: {
  2064. show: false,
  2065. },
  2066. splitLine: {
  2067. show: true,
  2068. lineStyle: {
  2069. color: '#68b4dd66',
  2070. type: 'dashed',
  2071. },
  2072. },
  2073. axisLabel: {
  2074. show: true,
  2075. formatter: function (value) {
  2076. return value === 1 ? 0 : value
  2077. },
  2078. textStyle: {
  2079. color: 'rgba(250,250,250,0.6)',
  2080. },
  2081. },
  2082. }
  2083. myChart.setOption(option)
  2084. },
  2085. initChartR5 () {
  2086. let myChart = echarts.init(this.$refs['echartR5'])
  2087. let option = {
  2088. ..._.cloneDeep(this.commonOption),
  2089. series: [
  2090. {
  2091. name: '在岗职工平均薪酬',
  2092. type: 'bar',
  2093. barWidth: 15,
  2094. itemStyle: {
  2095. normal: {
  2096. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  2097. {
  2098. offset: 0,
  2099. color: '#6682F5',
  2100. },
  2101. {
  2102. offset: 1,
  2103. color: '#082550',
  2104. },
  2105. ]),
  2106. },
  2107. },
  2108. data: dataR5[0],
  2109. },
  2110. {
  2111. name: '去年同期在岗职工平均薪酬',
  2112. type: 'bar',
  2113. barWidth: 15,
  2114. itemStyle: {
  2115. normal: {
  2116. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  2117. {
  2118. offset: 0,
  2119. color: '#69c0ff',
  2120. },
  2121. {
  2122. offset: 1,
  2123. color: '#082550',
  2124. },
  2125. ]),
  2126. },
  2127. },
  2128. data: dataR5[1],
  2129. }
  2130. ],
  2131. }
  2132. option.title.text = '各企业在岗职工平均薪酬'
  2133. option.legend.data = ['在岗职工平均薪酬', '去年同期在岗职工平均薪酬']
  2134. option.legend.show = true
  2135. option.yAxis.push({
  2136. splitLine: {
  2137. show: false,
  2138. },
  2139. axisLine: {
  2140. show: false,
  2141. },
  2142. })
  2143. myChart.setOption(option)
  2144. },
  2145. initChartR6 () {
  2146. let myChart = echarts.init(this.$refs['echartR6'])
  2147. let option = {
  2148. ..._.cloneDeep(this.commonOption),
  2149. color: ['#69c0ff'],
  2150. series: [
  2151. {
  2152. name: '2022年利润累计涨幅率',
  2153. type: 'line',
  2154. smooth: true, //平滑曲线显示
  2155. showAllSymbol: true, //显示所有图形。
  2156. symbol: 'circle', //标记的图形为实心圆
  2157. symbolSize: 8, //标记的大小
  2158. smooth: false,
  2159. itemStyle: {
  2160. //折线拐点标志的样式
  2161. color: '#B889EA',
  2162. borderColor: '#B889EA',
  2163. width: 2,
  2164. shadowColor: '#B889EA',
  2165. shadowBlur: 4,
  2166. },
  2167. lineStyle: {
  2168. color: '#B889EA',
  2169. width: 2,
  2170. },
  2171. data: dataR6[0],
  2172. },
  2173. {
  2174. name: '2022年薪酬累计涨幅率',
  2175. type: 'line',
  2176. barWidth: 15,
  2177. yAxisIndex: 1,
  2178. showAllSymbol: true, //显示所有图形。
  2179. symbol: 'circle', //标记的图形为实心圆
  2180. symbolSize: 12, //标记的大小
  2181. smooth: false,
  2182. itemStyle: {
  2183. color: params => {
  2184. if (params.value > 0 && dataR6[0][params.dataIndex] < 0) {
  2185. return 'yellow'
  2186. } else {
  2187. return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  2188. {
  2189. offset: 0,
  2190. color: '#69c0ff',
  2191. },
  2192. {
  2193. offset: 1,
  2194. color: '#082550',
  2195. },
  2196. ])
  2197. }
  2198. },
  2199. },
  2200. lineStyle: {
  2201. color: '#69C0FF',
  2202. width: 2,
  2203. },
  2204. data: dataR6[1],
  2205. },
  2206. {
  2207. yAxisIndex: 1,
  2208. type: 'effectScatter',
  2209. coordinateSystem: 'cartesian2d',
  2210. showEffectOn: 'render',
  2211. rippleEffect: {
  2212. period: 10,
  2213. scale: 4,
  2214. brushType: 'stroke'
  2215. },
  2216. hoverAnimation: true,
  2217. itemStyle: {
  2218. color: 'yellow'
  2219. },
  2220. lineStyle: {
  2221. color: '#43ede3',
  2222. width: 2,
  2223. },
  2224. data: this.twinkleR6,
  2225. },
  2226. ],
  2227. }
  2228. option.title.text = '各企业利润与薪酬变动情况'
  2229. option.legend.data = ['2022年利润累计涨幅率', '2022年薪酬累计涨幅率']
  2230. option.tooltip = {
  2231. trigger: 'axis',
  2232. formatter: '{a0}:{c0}' + '%' + '<br/>' + '{a1}:{c1}' + '%'
  2233. }
  2234. option.yAxis = [
  2235. {
  2236. max: function (value) {
  2237. if (Math.abs(value.max) > Math.abs(value.min)) {
  2238. return (Math.abs(value.max) * 1.2).toFixed(2);
  2239. } else {
  2240. return (Math.abs(value.min) * 1.2).toFixed(2);
  2241. }
  2242. },
  2243. min: function (value) {
  2244. if (Math.abs(value.max) > Math.abs(value.min)) {
  2245. return (-Math.abs(value.max) * 1.2).toFixed(2);
  2246. } else {
  2247. return (-Math.abs(value.min) * 1.2).toFixed(2);
  2248. }
  2249. },
  2250. splitLine: {
  2251. show: true,
  2252. lineStyle: {
  2253. color: '#68b4dd66',
  2254. type: 'dashed',
  2255. },
  2256. },
  2257. axisLine: {
  2258. show: false,
  2259. },
  2260. axisLabel: {
  2261. show: true,
  2262. formatter: '{value} %',
  2263. textStyle: {
  2264. color: 'rgba(250,250,250,0.6)',
  2265. },
  2266. },
  2267. },
  2268. {
  2269. max: function (value) {
  2270. if (Math.abs(value.max) > Math.abs(value.min)) {
  2271. return (Math.abs(value.max) * 1.2).toFixed(2);
  2272. } else {
  2273. return (Math.abs(value.min) * 1.2).toFixed(2);
  2274. }
  2275. },
  2276. min: function (value) {
  2277. if (Math.abs(value.max) > Math.abs(value.min)) {
  2278. return (-Math.abs(value.max) * 1.2).toFixed(2);
  2279. } else {
  2280. return (-Math.abs(value.min) * 1.2).toFixed(2);
  2281. }
  2282. },
  2283. splitLine: {
  2284. show: false,
  2285. },
  2286. axisLine: {
  2287. show: false,
  2288. },
  2289. axisLabel: {
  2290. show: true,
  2291. formatter: '{value} %',
  2292. textStyle: {
  2293. color: 'rgba(250,250,250,0.6)',
  2294. },
  2295. },
  2296. }
  2297. ]
  2298. myChart.setOption(option)
  2299. },
  2300. initChartR7 () {
  2301. let myChart = echarts.init(this.$refs['echartR7'])
  2302. let option = {
  2303. ..._.cloneDeep(this.commonOption),
  2304. color: [
  2305. {
  2306. x: 0,
  2307. y: 0,
  2308. x2: 0,
  2309. y2: 1,
  2310. colorStops: [{
  2311. offset: 0,
  2312. color: '#B889EA',
  2313. },
  2314. {
  2315. offset: 1,
  2316. color: '#082550',
  2317. },],
  2318. }
  2319. ],
  2320. series: [
  2321. {
  2322. name: '全员绩效考核完成率',
  2323. type: 'bar',
  2324. barWidth: 15,
  2325. itemStyle: {
  2326. normal: {
  2327. color: params => {
  2328. if (params.value < 50) {
  2329. return 'yellow'
  2330. }
  2331. else {
  2332. return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  2333. {
  2334. offset: 0,
  2335. color: '#B889EA',
  2336. },
  2337. {
  2338. offset: 1,
  2339. color: '#082550',
  2340. },
  2341. ])
  2342. }
  2343. },
  2344. },
  2345. },
  2346. data: dataR7[0],
  2347. },
  2348. ],
  2349. }
  2350. option.title.text = '各企业全员绩效考核'
  2351. // option.legend.data = ['劳动合同签约完成率', '目标值']
  2352. option.tooltip = {
  2353. trigger: 'axis',
  2354. formatter: '{a0}:{c0}' + '%'
  2355. }
  2356. option.yAxis[0].axisLabel = {
  2357. show: true,
  2358. formatter: '{value} %',
  2359. textStyle: {
  2360. color: 'rgba(250,250,250,0.6)',
  2361. },
  2362. }
  2363. myChart.setOption(option)
  2364. },
  2365. initChartR8 () {
  2366. let myChart = echarts.init(this.$refs['echartR8'])
  2367. let option = {
  2368. ..._.cloneDeep(this.commonOption),
  2369. color: [
  2370. {
  2371. x: 0,
  2372. y: 0,
  2373. x2: 0,
  2374. y2: 1,
  2375. colorStops: [{
  2376. offset: 0,
  2377. color: '#43ede3',
  2378. },
  2379. {
  2380. offset: 1,
  2381. color: '#082550',
  2382. },],
  2383. }
  2384. ],
  2385. series: [
  2386. {
  2387. name: '任期制契约化考核完成率',
  2388. type: 'bar',
  2389. barWidth: 15,
  2390. itemStyle: {
  2391. normal: {
  2392. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  2393. {
  2394. offset: 0,
  2395. color: '#43ede3',
  2396. },
  2397. {
  2398. offset: 1,
  2399. color: '#082550',
  2400. },
  2401. ]),
  2402. },
  2403. },
  2404. data: dataR8[0],
  2405. },
  2406. ],
  2407. }
  2408. option.title.text = '各企业任期制契约化考核完成率'
  2409. option.tooltip = {
  2410. trigger: 'axis',
  2411. formatter: '{a0}:{c0}' + '%'
  2412. }
  2413. option.yAxis[0].axisLabel = {
  2414. show: true,
  2415. formatter: '{value} %',
  2416. textStyle: {
  2417. color: 'rgba(250,250,250,0.6)',
  2418. },
  2419. }
  2420. myChart.setOption(option)
  2421. },
  2422. },
  2423. })