| | |
| | | <div class="shuju-scroll"> |
| | | <div class="shuju-table-line2" v-for="(item,index) in LabourTable" :key="index"> |
| | | <div class="biao-title"> |
| | | <h1>{{ item.dataType | dataFilter }}</h1> |
| | | <el-tooltip placement="top"> |
| | | <div slot="content"> |
| | | <h1>{{ item.dataType | dataFilter }}</h1> |
| | | </div> |
| | | <template> |
| | | <div class="content"> |
| | | <h1>{{ item.dataType | dataFilter }}</h1> |
| | | </div> |
| | | </template> |
| | | </el-tooltip> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="shuju-scroll"> |
| | | <div class="shuju-table-line2"> |
| | | <div class="shuju-table-line2 chengzhen_scroll" v-for="(item,index) in TownTable" :key="index"> |
| | | <div class="biao-title"> |
| | | <h1>人数(万人)</h1> |
| | | <h1>{{ item.name }}</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>277.8</h1> |
| | | <h1>{{ item.total }}</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>35.5</h1> |
| | | <h1>{{ item.office }}</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>242.3</h1> |
| | | <h1>{{ item.enterprise }}</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2 shuju-bj-color"> |
| | | <div class="biao-title"> |
| | | <h1>在职(万人)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>217.8</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>13.5</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>142.3</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>离退休(万人)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>23.8</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>16.5</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>52.3</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>供养比</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>3.8</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>2.5</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>1.3</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>收入(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>233.8</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>24.5</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>341.3</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>支出(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>533.8</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>84.5</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>541.3</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>结余(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>33.8</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>34.5</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>341.3</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <!-- <div class="shuju-table-line2 shuju-bj-color">--> |
| | | <!-- <div class="biao-title">--> |
| | | <!-- <h1>在职(万人)</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title-flex">--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>217.8</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>13.5</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>142.3</h1>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="shuju-table-line2">--> |
| | | <!-- <div class="biao-title">--> |
| | | <!-- <h1>离退休(万人)</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title-flex">--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>23.8</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>16.5</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>52.3</h1>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="shuju-table-line2">--> |
| | | <!-- <div class="biao-title">--> |
| | | <!-- <h1>供养比</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title-flex">--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>3.8</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>2.5</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>1.3</h1>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="shuju-table-line2">--> |
| | | <!-- <div class="biao-title">--> |
| | | <!-- <h1>收入(亿元)</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title-flex">--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>233.8</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>24.5</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>341.3</h1>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="shuju-table-line2">--> |
| | | <!-- <div class="biao-title">--> |
| | | <!-- <h1>支出(亿元)</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title-flex">--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>533.8</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>84.5</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>541.3</h1>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="shuju-table-line2">--> |
| | | <!-- <div class="biao-title">--> |
| | | <!-- <h1>结余(亿元)</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title-flex">--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>33.8</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>34.5</h1>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title">--> |
| | | <!-- <h1>341.3</h1>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-echarts" id="chengzhenZhigongYanglaoEcharts"></div> |
| | |
| | | <h1>失业保险</h1> |
| | | </div> |
| | | <div class="shuju-main-box"> |
| | | <div class="shuju-table"> |
| | | <div class="shuju-table-line"> |
| | | <div class="biao-title"></div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>本月</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>本年同期</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>同比</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>上月</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>环比</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-scroll"> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>人数(万人)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>138957</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>128417</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1 class="fontColor">111.2%</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | </div> |
| | | |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>收入(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>138957</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>128417</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1 class="fontColor">111.2%</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>支出(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>138957</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>128417</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1 class="fontColor">111.2%</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>本月结余(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>138957</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>128417</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1 class="fontColor">111.2%</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>累计结余(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>138957</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>128417</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1 class="fontColor">111.2%</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | </div> |
| | | <shiyeAndgongshangBaoxian typeString="4"></shiyeAndgongshangBaoxian> |
| | | <div class="shuju-echarts" id="shiyeBaoxianEcharts"></div> |
| | | </div> |
| | | |
| | |
| | | <h1>工伤保险</h1> |
| | | </div> |
| | | <div class="shuju-main-box"> |
| | | <div class="shuju-table"> |
| | | <div class="shuju-table-line"> |
| | | <div class="biao-title"></div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>本月</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>本年同比</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>同比</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>上月</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>环比</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-scroll"> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>人数(万人)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>138957</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>128417</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1 class="fontColor">111.2%</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>收入(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>138957</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>128417</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1 class="fontColor">111.2%</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>支出(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>138957</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>128417</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1 class="fontColor">111.2%</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>本月结余(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>138957</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>128417</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1 class="fontColor">111.2%</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="shuju-table-line2"> |
| | | <div class="biao-title"> |
| | | <h1>累计结余(亿元)</h1> |
| | | </div> |
| | | <div class="title-flex"> |
| | | <div class="title"> |
| | | <h1>138957</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>128417</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1 class="fontColor">111.2%</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | <div class="title"> |
| | | <h1>125000</h1> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | </div> |
| | | <shiyeAndgongshangBaoxian typeString="5"></shiyeAndgongshangBaoxian> |
| | | <div class="shuju-echarts" id="gongshangBaoxianEcharts"></div> |
| | | </div> |
| | | |
| | |
| | | <script> |
| | | import echarts from "echarts/lib/echarts"; |
| | | import nowSize from "../../../libs/nowSize"; |
| | | import shiyeAndgongshangBaoxian from "../../components/index/shiyeAndgongshangBaoxian"; |
| | | import { |
| | | getInsured, |
| | | getInstitution, |
| | |
| | | getLoan, |
| | | getPersonnel, |
| | | getLabourTable, |
| | | getLabourChart |
| | | getLabourChart, |
| | | getInsuranceChart, |
| | | getTownTable |
| | | } from "@/api/index"; |
| | | |
| | | export default { |
| | | name: "index", |
| | | components: { |
| | | shiyeAndgongshangBaoxian |
| | | }, |
| | | data() { |
| | | return { |
| | | // 被保险人 |
| | |
| | | // 24. 查询首页就业数据表格接口 |
| | | LabourTable: {}, |
| | | // 25.首页就业数据折线图 |
| | | addJob: [], |
| | | reJob: [], |
| | | hardJob: [], |
| | | LabourChartYear: [] |
| | | JiuYeEchart: { |
| | | addJob: [], |
| | | reJob: [], |
| | | hardJob: [], |
| | | LabourChartYear: [] |
| | | }, |
| | | // 26. 查询首页养老、工伤、失业保险折线图接口 |
| | | // 城镇职工养老 |
| | | YangLaoEchart: { |
| | | years: [], |
| | | shouru: [], |
| | | zhichu: [], |
| | | jieyu: [] |
| | | }, |
| | | // 失业保险 |
| | | ShiYeEchart: { |
| | | years: [], |
| | | shouru: [], |
| | | zhichu: [], |
| | | jieyu: [] |
| | | }, |
| | | // 工伤 |
| | | GongShangEchart: { |
| | | years: [], |
| | | shouru: [], |
| | | zhichu: [], |
| | | jieyu: [] |
| | | }, |
| | | // 27. 查询首页城镇职工养老表格数据接口 |
| | | TownTable: [], |
| | | // 28.失业保险 |
| | | type:'', |
| | | } |
| | | }, |
| | | mounted() { |
| | |
| | | this.getPersonnel() |
| | | this.getLabourTable() |
| | | this.getLabourChart() |
| | | this.getInsuranceChart() |
| | | this.getTownTable() |
| | | // this.getshiyeTable() |
| | | // this.getGongshangTable() |
| | | }, |
| | | filters: { |
| | | dataFilter(type) { |
| | |
| | | trigger: 'axis' |
| | | }, |
| | | legend: { |
| | | data: ['总数', '在职职工', '离退休'], |
| | | itemWidth: nowSize(24), |
| | | itemHeight: nowSize(4), |
| | | itemGap: nowSize(10), |
| | |
| | | xAxis: { |
| | | type: 'category', |
| | | boundaryGap: false, |
| | | data: this.LabourChartYear, |
| | | data: this.JiuYeEchart.LabourChartYear, |
| | | axisLabel: { |
| | | show: true, |
| | | textStyle: { |
| | |
| | | } |
| | | }, |
| | | series: [{ |
| | | name: '总数', |
| | | name: '城镇新增就业', |
| | | type: 'line', |
| | | data: this.addJob |
| | | data: this.JiuYeEchart.addJob |
| | | }, |
| | | { |
| | | name: '在职职工', |
| | | name: '失业再就业', |
| | | type: 'line', |
| | | data: this.reJob |
| | | data: this.JiuYeEchart.reJob |
| | | }, |
| | | { |
| | | name: '离退休', |
| | | name: '困难再就业', |
| | | type: 'line', |
| | | data: this.hardJob |
| | | data: this.JiuYeEchart.hardJob |
| | | }] |
| | | }; |
| | | myEchart.setOption(option) |
| | |
| | | trigger: 'axis' |
| | | }, |
| | | legend: { |
| | | data: ['总数', '在职职工', '离退休'], |
| | | itemWidth: nowSize(24), |
| | | itemHeight: nowSize(4), |
| | | itemGap: nowSize(10), |
| | | right: '0%', |
| | | right: '10%', |
| | | top: '0%', |
| | | textStyle: { |
| | | color: '#FFFFFF', |
| | |
| | | xAxis: { |
| | | type: 'category', |
| | | boundaryGap: false, |
| | | data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'], |
| | | data: this.YangLaoEchart.years, |
| | | axisLabel: { |
| | | show: true, |
| | | textStyle: { |
| | |
| | | }, |
| | | series: [ |
| | | { |
| | | name: '总数', |
| | | name: '收入', |
| | | type: 'line', |
| | | data: [370, 332, 401, 534, 490, 530, 910] |
| | | data: this.YangLaoEchart.shouru |
| | | }, |
| | | { |
| | | name: '在职职工', |
| | | name: '支出', |
| | | type: 'line', |
| | | data: [220, 182, 191, 234, 290, 330, 310] |
| | | data: this.YangLaoEchart.zhichu |
| | | }, |
| | | { |
| | | name: '离退休', |
| | | name: '结余', |
| | | type: 'line', |
| | | data: [150, 132, 201, 154, 190, 330, 410] |
| | | data: this.YangLaoEchart.jieyu |
| | | } |
| | | ] |
| | | }; |
| | |
| | | trigger: 'axis' |
| | | }, |
| | | legend: { |
| | | data: ['总数', '在职职工', '离退休'], |
| | | itemWidth: nowSize(24), |
| | | itemHeight: nowSize(4), |
| | | itemGap: nowSize(1), |
| | | right: '0%', |
| | | right: '10%', |
| | | top: '0%', |
| | | textStyle: { |
| | | color: '#FFFFFF', |
| | |
| | | xAxis: { |
| | | type: 'category', |
| | | boundaryGap: false, |
| | | data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'], |
| | | data: this.ShiYeEchart.years, |
| | | axisLabel: { |
| | | show: true, |
| | | textStyle: { |
| | |
| | | }, |
| | | series: [ |
| | | { |
| | | name: '总数', |
| | | name: '收入', |
| | | type: 'line', |
| | | data: [370, 332, 401, 534, 490, 530, 910] |
| | | data: this.ShiYeEchart.shouru |
| | | }, |
| | | { |
| | | name: '在职职工', |
| | | name: '支出', |
| | | type: 'line', |
| | | data: [220, 182, 191, 234, 290, 330, 310] |
| | | data: this.ShiYeEchart.zhichu |
| | | }, |
| | | { |
| | | name: '离退休', |
| | | name: '结余', |
| | | type: 'line', |
| | | data: [150, 132, 201, 154, 190, 330, 410] |
| | | data: this.ShiYeEchart.jieyu |
| | | } |
| | | ] |
| | | }; |
| | |
| | | trigger: 'axis' |
| | | }, |
| | | legend: { |
| | | data: ['总数', '在职职工', '离退休'], |
| | | itemWidth: nowSize(24), |
| | | itemHeight: nowSize(4), |
| | | itemGap: nowSize(10), |
| | | right: '0%', |
| | | right: '10%', |
| | | top: '0%', |
| | | textStyle: { |
| | | color: '#FFFFFF', |
| | |
| | | xAxis: { |
| | | type: 'category', |
| | | boundaryGap: false, |
| | | data: ['2021/4', '2021/5', '2021/6', '2021/7', '2021/8', '2021/9', '2021/10'], |
| | | data: this.GongShangEchart.years, |
| | | axisLabel: { |
| | | show: true, |
| | | textStyle: { |
| | |
| | | }, |
| | | series: [ |
| | | { |
| | | name: '总数', |
| | | name: '收入', |
| | | type: 'line', |
| | | data: [370, 332, 401, 534, 490, 530, 910] |
| | | data: this.GongShangEchart.shouru |
| | | }, |
| | | { |
| | | name: '在职职工', |
| | | name: '支出', |
| | | type: 'line', |
| | | data: [220, 182, 191, 234, 290, 330, 310] |
| | | data: this.GongShangEchart.zhichu |
| | | }, |
| | | { |
| | | name: '离退休', |
| | | name: '结余', |
| | | type: 'line', |
| | | data: [150, 132, 201, 154, 190, 330, 410] |
| | | data: this.GongShangEchart.jieyu |
| | | } |
| | | ] |
| | | }; |
| | |
| | | }) |
| | | }, |
| | | // 25. 查询首页就业数据折线图接口 |
| | | getLabourChart() { |
| | | getLabourChart().then(res => { |
| | | async getLabourChart() { |
| | | await getLabourChart().then(res => { |
| | | if (res.code === 1000) { |
| | | this.JiuYeEchart.LabourChartYear = res.obj.years; |
| | | this.JiuYeEchart.addJob = res.obj.addJob; |
| | | this.JiuYeEchart.reJob = res.obj.hardJob; |
| | | this.JiuYeEchart.hardJob = res.obj.reJob; |
| | | this.jiuyeshujuEcharts() |
| | | } |
| | | }) |
| | | }, |
| | | // 26. 查询首页养老、工伤、失业保险折线图接口 |
| | | async getInsuranceChart() { |
| | | // 城镇职工养老 |
| | | await getInsuranceChart({type: 1}).then(res => { |
| | | if (res.code === 1000) { |
| | | this.YangLaoEchart.shouru = res.obj.shouru |
| | | this.YangLaoEchart.zhichu = res.obj.zhichu |
| | | this.YangLaoEchart.jieyu = res.obj.jieyu |
| | | this.YangLaoEchart.years = res.obj.years |
| | | this.chengzhenZhigongYanglaoEcharts() |
| | | } |
| | | }) |
| | | // 失业保险 |
| | | await getInsuranceChart({type: 5}).then(res => { |
| | | if (res.code === 1000) { |
| | | this.ShiYeEchart.shouru = res.obj.shouru |
| | | this.ShiYeEchart.zhichu = res.obj.zhichu |
| | | this.ShiYeEchart.jieyu = res.obj.jieyu |
| | | this.ShiYeEchart.years = res.obj.years |
| | | this.shiyeBaoxianEcharts() |
| | | } |
| | | }) |
| | | // 工伤保险 |
| | | await getInsuranceChart({type: 6}).then(res => { |
| | | if (res.code === 1000) { |
| | | this.GongShangEchart.shouru = res.obj.shouru |
| | | this.GongShangEchart.zhichu = res.obj.zhichu |
| | | this.GongShangEchart.jieyu = res.obj.jieyu |
| | | this.GongShangEchart.years = res.obj.years |
| | | this.gongshangBaoxianEcharts() |
| | | } |
| | | }) |
| | | }, |
| | | // 27. 查询首页城镇职工养老表格数据接口 |
| | | getTownTable() { |
| | | getTownTable().then(res => { |
| | | console.log(res); |
| | | if (res.code === 1000) { |
| | | this.LabourChartYear = res.obj.years; |
| | | this.addJob = res.obj.addJob; |
| | | this.reJob = res.obj.hardJob; |
| | | this.hardJob = res.obj.reJob; |
| | | this.jiuyeshujuEcharts() |
| | | this.TownTable = res.list |
| | | } |
| | | }) |
| | | } |
| | |
| | | box-sizing: border-box; |
| | | display: flex; |
| | | |
| | | .shuju-table { |
| | | width: 3.1328125rem /* 802/256 */ |
| | | ; |
| | | height: 1.2109375rem /* 310/256 */ |
| | | ; |
| | | } |
| | | } |
| | | |
| | | .shuju-table { |
| | | width: 100%; |
| | | width: 3.1328125rem /* 802/256 */; |
| | | height: 1.2109375rem /* 310/256 */; |
| | | display: flex; |
| | | flex-direction: column; |
| | | |
| | |
| | | display: flex; |
| | | |
| | | .biao-title { |
| | | width: 1.328125rem /* 340/256 */ |
| | | ; |
| | | width: 0.859375rem /* 220/256 */; |
| | | } |
| | | |
| | | .title-flex { |
| | | width: 100%; |
| | | width: calc(100% - 0.859375rem); |
| | | display: flex; |
| | | } |
| | | |
| | | .title { |
| | | flex: 1; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | |
| | | h1 { |
| | | font-size: $fontSize-26; |
| | |
| | | |
| | | .title { |
| | | flex: 1; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | |
| | | h1 { |
| | | font-size: $fontSize-26; |
| | |
| | | line-height: 1.5; |
| | | } |
| | | |
| | | .fontColor { |
| | | .fontColorBlue { |
| | | color: $color-blue; |
| | | } |
| | | .fontColorRed { |
| | | color: #FF3939; |
| | | } |
| | | } |
| | | |
| | | .title-flex { |
| | | width: 100%; |
| | | width: calc(100% - 0.859375rem); |
| | | display: flex; |
| | | } |
| | | |
| | | .biao-title { |
| | | width: 1.328125rem /* 340/256 */ |
| | | width: 0.859375rem /* 220/256 */ |
| | | ; |
| | | |
| | | h1 { |
| | |
| | | color: $color-white; |
| | | text-align: right; |
| | | line-height: 1.5; |
| | | @include ellipsis() |
| | | } |
| | | |
| | | .fontColor { |
| | |
| | | } |
| | | } |
| | | } |
| | | // 城市职工养老第2,3条数据 |
| | | .chengzhen_scroll { |
| | | &:nth-of-type(2) { |
| | | background: rgba(81, 210, 255, 0.10); |
| | | |
| | | h1 { |
| | | font-size: 24px; |
| | | line-height: 1; |
| | | color: #999999; |
| | | } |
| | | } |
| | | |
| | | &:nth-of-type(3) { |
| | | background: rgba(81, 210, 255, 0.10); |
| | | |
| | | h1 { |
| | | font-size: 24px; |
| | | line-height: 1; |
| | | color: #999999; |
| | | |
| | | } |
| | | } |
| | | } |
| | | |
| | | .shuju-bj-color { |
| | | background: rgba(81, 210, 255, 0.10); |