diff --git a/src/pages/home/branch/manage/company/companyDetails/financialAnalysis.js b/src/pages/home/branch/manage/company/companyDetails/financialAnalysis.js index b599855..64897f8 100644 --- a/src/pages/home/branch/manage/company/companyDetails/financialAnalysis.js +++ b/src/pages/home/branch/manage/company/companyDetails/financialAnalysis.js @@ -2,10 +2,10 @@ import React, { useState, useEffect } from 'react' import "./index.css" import { Row, Col, Descriptions } from 'antd' import * as echarts from 'echarts/lib/echarts' -import "echarts/lib/chart/line"; -import "echarts/lib/chart/pie"; +import "echarts/lib/chart/bar"; import 'echarts/lib/component/grid' import "echarts/lib/component/tooltip" +import "echarts/lib/component/legend" import api from "@/api/request" import FeTable from "@/components/table" import { getColumn } from "@/utils/utils" @@ -18,17 +18,16 @@ function FinancialAnalysis(props) { api.post("/admin/company/financial_analysis", { cid: props.cid, update_time: props.updateTime }).then(res => { setValue(res) if (Object.keys(res).length !== 0) { - initLine("line-1", res["财务得分去年比较"]) - initLine("line-2", res["财务得分同行比较"]) - initPie("pie-1", res["财务得分较去年变化"]) - initPie("pie-2", res["财务得分较同行差异"]) + // initDoubleBar("bar-1", res["财务得分去年比较"]) + initDoubleBar("bar-2", res["财务得分同行比较"]) + initBar("bar-3", res["财务得分较去年变化"]) + initBar("bar-4", res["财务得分较同行差异"]) } }) } }, [props.cid, props.updateTime, props.table]) - - function initLine(id, param) { + function initDoubleBar(id, param) { const myChart = echarts.init(document.getElementById(id)) myChart.setOption({ tooltip: { @@ -36,6 +35,17 @@ function FinancialAnalysis(props) { trigger: "item", showContent: true, borderColor: "#fff", + formatter: (params) => { + return `${params.name} ${params.data}%` + } + }, + legend:{ + show:true, + x: "right", + y: "top", + itemHeight: 10, + itemGap: 8, + background: "#fff", }, grid: { top: '20px', @@ -45,7 +55,6 @@ function FinancialAnalysis(props) { }, xAxis: { type: 'category', - boundaryGap: false, data: Object.keys(param[Object.keys(param)[0]]).map(key => { return key }), @@ -70,14 +79,14 @@ function FinancialAnalysis(props) { }, series: Object.keys(param).map(key => { return { - name: key, - type: 'line', + type: 'bar', + barWidth: "20%", + name:key, data: Object.keys(param[key]).map(k => { return param[key][k] }) } - }), - + }) }) window.onresize = function () { @@ -85,7 +94,8 @@ function FinancialAnalysis(props) { } } - function initPie(id, param) { + + function initBar(id, param) { const myChart = echarts.init(document.getElementById(id)) myChart.setOption({ tooltip: { @@ -93,39 +103,47 @@ function FinancialAnalysis(props) { trigger: "item", showContent: true, borderColor: "#fff", + formatter: (params) => { + return `${params.name} ${params.data}%` + } }, grid: { top: '20px', left: '50px', right: '50px', bottom: '20px', - width: '100%', - height: '100%' }, - label: { - show: false + xAxis: { + type: 'category', + data: Object.keys(param).map(key => { + return key + }), + axisLine: { + show: true + }, + axisTick: { + show: false + }, }, - series: [ - { - name: 'Data', - type: 'pie', - radius: ['50%', '70%'], - avoidLabelOverlap: false, - labelLine: { - show: false - }, - itemStyle: { - borderWidth: 5, - borderColor: '#fff', - }, - data: Object.keys(param).map(key => { - return { - name: key, - value: param[key].substring(0, param[key].length - 1) - } - }), + yAxis: { + type: 'value', + axisLine: { + show: false + }, + axisTick: { + show: false + }, + splitLine: { + show: true } - ] + }, + series: [{ + type: 'bar', + barWidth: "20%", + data: Object.keys(param).map(key => { + return param[key] + }) + }] }) window.onresize = function () { @@ -142,21 +160,21 @@ function FinancialAnalysis(props) {

财务得分去年比较

-
+

财务得分同行比较

-
+

财务得分较去年变化

-
+

财务得分较同行差异

-
+
diff --git a/src/pages/home/branch/manage/company/companyDetails/financialData.js b/src/pages/home/branch/manage/company/companyDetails/financialData.js index 32b118f..906c64d 100644 --- a/src/pages/home/branch/manage/company/companyDetails/financialData.js +++ b/src/pages/home/branch/manage/company/companyDetails/financialData.js @@ -3,21 +3,82 @@ import { } from 'antd' import api from "@/api/request" import "./index.css" import { getColumn } from "@/utils/utils" +import FeTable from "@/components/table" function FinancialData(props) { - const [value, setValue] = useState({}) + const [profits, setProfits] = useState([]) + const [assets, setAssets] = useState([]) + const [financial, setFinancial] = useState([]) + const [supplement, setSupplement] = useState([]) useEffect(() => { - if (props.table === '财务数据' && props.updateTime) { + if (props.table === '财务数据' && props.updateTime !== "") { api.post("/admin/company/financial_data", { cid: props.cid, report_date: props.updateTime }).then(res => { - setValue(res) + if (res) { + setProfits([...profits, res['资产负债表']]) + setAssets([...assets, res['利润表']]) + setFinancial([...financial, res['财务指标']]) + setSupplement([...supplement, res['补充数据表']]) + } }) } }, [props.cid, props.updateTime, props.table]) + + function analysisArray(params) { + var columns = [] + const matrixData = params.map((row) => { + var arr = []; + for (var i in row) { + columns.push(i) + arr.push(row[i]); + } + return arr; + }); + + const transData = matrixData[0].map((col, i) => { + return [ + columns[i], + ...matrixData.map((row) => { + return row[i]; + }), + ]; + }); + + const transTitle = transData[0].map((item, i) => { + return { + title: item, dataIndex: item, align: 'center', key: i + } + } + ); + + const data = transData.map((item, i) => { + var obj = {} + item.forEach((child, j) => { + Object.assign(obj, { + [transTitle[j].title]: child, + key: i + }) + }) + return obj + }) + + data.shift() + + return + + } + return ( <> - +

资产负债表

+ {profits.length !== 0 && analysisArray(profits)} +

利润表

+ {assets.length!==0&&analysisArray(assets)} +

财务指标

+ {financial.length!==0&&analysisArray(financial)} +

补充数据表

+ {supplement.length!==0&&analysisArray(supplement)} ) } diff --git a/src/pages/home/branch/manage/company/companyDetails/index.js b/src/pages/home/branch/manage/company/companyDetails/index.js index 7bfd265..a3c441c 100644 --- a/src/pages/home/branch/manage/company/companyDetails/index.js +++ b/src/pages/home/branch/manage/company/companyDetails/index.js @@ -28,7 +28,7 @@ function CompanyDetails(props) { const [value, setValue] = useState({}) const [tabPane, setTabPane] = useState(tab[0].title) const [updateTime, setUpdateTime] = useState([]) - const [targetUpdateTime, setTargetUpdateTime] = useState([]) + const [targetUpdateTime, setTargetUpdateTime] = useState("") useEffect(() => { api.get("/admin/company/head_info", { cid: props.cid }).then(res => { @@ -39,8 +39,8 @@ function CompanyDetails(props) { useEffect(() => { api.post("/admin/company/update_time", { cid: props.cid, table: tabPane }).then(res => { if (res.update_time) { + // setTargetUpdate(res.update_time[0]) setUpdateTime(res.update_time) - setTargetUpdate(res.update_time[0]) } else { setUpdateTime([]) } @@ -78,7 +78,7 @@ function CompanyDetails(props) {

更新日期

{ updateTime.map(item => { - return

{item}

+ return

{item}

}) } 返回条数

{updateTime.length}