@@ -226,30 +226,30 @@ export default { | |||||
data: data, | data: data, | ||||
zlevel: 11, | zlevel: 11, | ||||
}, | }, | ||||
{ | |||||
type: 'custom', | |||||
itemStyle: { | |||||
color: 'rgba(18, 40, 83, 0.4)' | |||||
}, | |||||
renderItem: function (params, api) { | |||||
//获取对应类目的axisTick中心点坐标 | |||||
var start = api.coord([api.value(0)]); | |||||
//通过坐标系的宽度和类目数,计算单个类目的背景 | |||||
var width = (params.coordSys.width / 7) * 0.6; | |||||
return { | |||||
type: 'rect', | |||||
shape: { | |||||
// 相对左上角坐标 | |||||
x: start[0] - width / 2, | |||||
y: params.coordSys.y, | |||||
width: width, | |||||
height: params.coordSys.height, | |||||
}, | |||||
style: api.style() | |||||
}; | |||||
}, | |||||
data: bgData | |||||
} | |||||
// { | |||||
// type: 'custom', | |||||
// itemStyle: { | |||||
// color: 'rgba(18, 40, 83, 0.4)' | |||||
// }, | |||||
// renderItem: function (params, api) { | |||||
// //获取对应类目的axisTick中心点坐标 | |||||
// var start = api.coord([api.value(0)]); | |||||
// //通过坐标系的宽度和类目数,计算单个类目的背景 | |||||
// var width = (params.coordSys.width / 7) * 0.6; | |||||
// return { | |||||
// type: 'rect', | |||||
// shape: { | |||||
// // 相对左上角坐标 | |||||
// x: start[0] - width / 2, | |||||
// y: params.coordSys.y, | |||||
// width: width, | |||||
// height: params.coordSys.height, | |||||
// }, | |||||
// style: api.style() | |||||
// }; | |||||
// }, | |||||
// data: bgData | |||||
// } | |||||
] | ] | ||||
}; | }; | ||||
this.chart.setOption(option); | this.chart.setOption(option); | ||||
@@ -10,7 +10,7 @@ element-loading-background="rgba(0, 0, 0, 0.1)" | |||||
</div> | </div> | ||||
<div class="buttom"> | <div class="buttom"> | ||||
<LineCharts v-if="tabIndex === '1' && isLoad" id="otherline" :data="data"></LineCharts> | <LineCharts v-if="tabIndex === '1' && isLoad" id="otherline" :data="data"></LineCharts> | ||||
<PieCharts v-if="tabIndex === '2' && isLoad" id="otherpie" :data="data"></PieCharts> | |||||
<PieCharts v-if="tabIndex === '2' && isLoad" id="otherpie" :data="data" :title="'总支出'" :titleNum="titleNum + '万元'"></PieCharts> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</Pannel> | |||||
</Pannel> |
@@ -16,7 +16,8 @@ export default { | |||||
return { | return { | ||||
data: [], // 数据 | data: [], // 数据 | ||||
isLoad: false, // 是否加载完成 | isLoad: false, // 是否加载完成 | ||||
tabIndex: '1' | |||||
tabIndex: '1', | |||||
titleNum: 0 | |||||
}; | }; | ||||
}, | }, | ||||
computed: { | computed: { | ||||
@@ -68,7 +69,7 @@ export default { | |||||
analysisOfCapitalExpenditureType(this.deptId, this.year).then(res => { | analysisOfCapitalExpenditureType(this.deptId, this.year).then(res => { | ||||
let data = res.data.list.map(item => { | let data = res.data.list.map(item => { | ||||
this.titleNum += item.value; | |||||
return { | return { | ||||
name: item.name, | name: item.name, | ||||
value: item.value, | value: item.value, | ||||
@@ -10,7 +10,7 @@ element-loading-background="rgba(0, 0, 0, 0.1)" | |||||
</div> | </div> | ||||
<div class="buttom"> | <div class="buttom"> | ||||
<LineCharts v-if="tabIndex === '1' && isLoad" :data="data"></LineCharts> | <LineCharts v-if="tabIndex === '1' && isLoad" :data="data"></LineCharts> | ||||
<PieCharts v-if="tabIndex === '2' && isLoad" :data="data"></PieCharts> | |||||
<PieCharts v-if="tabIndex === '2' && isLoad" :data="data" :title="'总收入'" :titleNum="titleNum + '万元'"></PieCharts> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</Pannel> | |||||
</Pannel> |
@@ -7,9 +7,9 @@ import { leftbottomcapitalgainstrend, leftbottomcapitalgainstype } from '../../. | |||||
const map = { | const map = { | ||||
'经营收入': '万元', | '经营收入': '万元', | ||||
'补助收入': '万吨', | |||||
'补助收入': '万元', | |||||
'投资收益': '万元', | '投资收益': '万元', | ||||
'其他收入': '万吨' | |||||
'其他收入': '万元' | |||||
} | } | ||||
export default { | export default { | ||||
components: { | components: { | ||||
@@ -22,7 +22,8 @@ export default { | |||||
return { | return { | ||||
data: [], // 数据 | data: [], // 数据 | ||||
isLoad: false, // 是否加载完成 | isLoad: false, // 是否加载完成 | ||||
tabIndex: '1' | |||||
tabIndex: '1', | |||||
titleNum: 0 | |||||
}; | }; | ||||
}, | }, | ||||
computed: { | computed: { | ||||
@@ -47,6 +48,7 @@ export default { | |||||
getData () { | getData () { | ||||
if (this.year || this.deptId) { | if (this.year || this.deptId) { | ||||
this.isLoad = false; | this.isLoad = false; | ||||
this.titleNum = 0; | |||||
// 如果是趋势 | // 如果是趋势 | ||||
if (this.tabIndex == 1) { | if (this.tabIndex == 1) { | ||||
leftbottomcapitalgainstrend( this.deptId, this.year).then(res => { | leftbottomcapitalgainstrend( this.deptId, this.year).then(res => { | ||||
@@ -63,6 +65,7 @@ export default { | |||||
// 获取类型 | // 获取类型 | ||||
leftbottomcapitalgainstype(this.deptId, this.year).then(res => { | leftbottomcapitalgainstype(this.deptId, this.year).then(res => { | ||||
let data = res.data.list.map(item => { | let data = res.data.list.map(item => { | ||||
this.titleNum += item.value; | |||||
return { | return { | ||||
name: item.name, | name: item.name, | ||||
value: item.value, | value: item.value, | ||||
@@ -1,4 +1,4 @@ | |||||
<Pannel title="资产负债分析" height="232" | |||||
<Pannel title="资产状况分析" height="232" | |||||
v-loading="!isLoad" | v-loading="!isLoad" | ||||
element-loading-text="拼命加载中" | element-loading-text="拼命加载中" | ||||
element-loading-spinner="el-icon-loading" | element-loading-spinner="el-icon-loading" | ||||
@@ -11,4 +11,4 @@ element-loading-background="rgba(0, 0, 0, 0.1)" | |||||
</td> | </td> | ||||
</tr> | </tr> | ||||
</table> | </table> | ||||
</Pannel> | |||||
</Pannel> |
@@ -1,16 +1,53 @@ | |||||
import Pannel from '@/components/pannel/index.vue'; | import Pannel from '@/components/pannel/index.vue'; | ||||
import ScrollTable from '@/components/scroll-table/index.vue'; | import ScrollTable from '@/components/scroll-table/index.vue'; | ||||
import {mapGetters} from "vuex"; | |||||
import { listDebtOrganizations } from '../../../../api/index.js'; | |||||
export default { | export default { | ||||
components: { | components: { | ||||
ScrollTable, | ScrollTable, | ||||
Pannel | Pannel | ||||
}, | }, | ||||
computed: { | |||||
...mapGetters(['year', 'deptId']) | |||||
}, | |||||
watch: { | |||||
year: { | |||||
handler () { | |||||
this.getData(); | |||||
}, | |||||
immediate: true, // 立即执行 | |||||
}, | |||||
deptId: { | |||||
handler () { | |||||
this.getData(); | |||||
}, | |||||
immediate: true, // 立即执行 | |||||
} | |||||
}, | |||||
data () { | data () { | ||||
return { | return { | ||||
headers: ['组织名称', '负债总额', '资产总额', '负债率'], | |||||
headers: ['组织名称', '负债总额(万元)', '资产总额(万元)', '负债率'], | |||||
data: [ | data: [ | ||||
['组织名称', '负债总额(万元)', '资产总额(万元)', '负债率'] | |||||
['组织名称', '负债总额', '资产总额', '负债率'] | |||||
] | ] | ||||
}; | }; | ||||
}, | |||||
methods: { | |||||
getData () { | |||||
if (this.year, this.deptId) { | |||||
this.isLoad = false; | |||||
listDebtOrganizations(this.deptId, this.year).then(res => { | |||||
let data = res.rows.map(item => { | |||||
return [item.name, item.fzze, item.zcze, item.zcfzl] | |||||
}) | |||||
this.data = data; | |||||
this.isLoad = true; | |||||
}) | |||||
} | |||||
}, | |||||
tabChange (info) { | |||||
this.tabIndex = info.id; | |||||
this.getData(); | |||||
} | |||||
} | } | ||||
}; | }; |
@@ -37,4 +37,4 @@ export default { | |||||
} | } | ||||
] | ] | ||||
] | ] | ||||
} | |||||
} |
@@ -27,7 +27,7 @@ export default { | |||||
data () { | data () { | ||||
return { | return { | ||||
isLoad: false, | isLoad: false, | ||||
headers: ['组织名称', '负债总额', '资产总额', '负债率'], | |||||
headers: ['组织名称', '负债总额(万元)', '资产总额(万元)', '债务率'], | |||||
data: [ | data: [ | ||||
] | ] | ||||
}; | }; | ||||
@@ -4,16 +4,16 @@ export default { | |||||
{ | { | ||||
value: '29', | value: '29', | ||||
unit: '个', | unit: '个', | ||||
name: '资不抵债', | |||||
text: '资产负债率>100%', | |||||
name: '资不抵债务', | |||||
text: '资产债务率>100%', | |||||
color: 'rgba(252, 91, 110, 1)', | color: 'rgba(252, 91, 110, 1)', | ||||
icon: require('./组 4669@2x.png') | icon: require('./组 4669@2x.png') | ||||
}, | }, | ||||
{ | { | ||||
value: '29', | value: '29', | ||||
unit: '个', | unit: '个', | ||||
name: '高负债率', | |||||
text: '60%<资产负债率≤100%', | |||||
name: '高债务率', | |||||
text: '60%<资产债务率≤100%', | |||||
color: 'rgba(252, 133, 91, 1)', | color: 'rgba(252, 133, 91, 1)', | ||||
icon: require('./组 4669@2x(1).png') | icon: require('./组 4669@2x(1).png') | ||||
} | } | ||||
@@ -22,19 +22,19 @@ export default { | |||||
{ | { | ||||
value: '29', | value: '29', | ||||
unit: '个', | unit: '个', | ||||
name: '中负债率', | |||||
name: '中债务率', | |||||
color: 'rgba(252, 231, 91, 1)', | color: 'rgba(252, 231, 91, 1)', | ||||
text: '40%≤资产负债率≤60%', | |||||
text: '40%≤资产债务率≤60%', | |||||
icon: require('./组 4669@2x(2).png') | icon: require('./组 4669@2x(2).png') | ||||
}, | }, | ||||
{ | { | ||||
value: '29', | value: '29', | ||||
unit: '个', | unit: '个', | ||||
name: '低负债率', | |||||
name: '低债务率', | |||||
color: 'rgba(91, 252, 114, 1)', | color: 'rgba(91, 252, 114, 1)', | ||||
text: '资产负债率<40%', | |||||
text: '资产债务率<40%', | |||||
icon: require('./组 4669@2x(3).png') | icon: require('./组 4669@2x(3).png') | ||||
} | } | ||||
] | ] | ||||
] | ] | ||||
} | |||||
} |
@@ -1,6 +1,6 @@ | |||||
<div class="page"> | <div class="page"> | ||||
<MainGis v-if="tab === '1'"></MainGis> | <MainGis v-if="tab === '1'"></MainGis> | ||||
<GisMap v-else :showYears="false"></GisMap> | |||||
<GisMap v-else></GisMap> | |||||
<Header title="资产一张图" callBack> | <Header title="资产一张图" callBack> | ||||
<div slot="left"> | <div slot="left"> | ||||
<Tabs @change="tabChange" :data="tabData"></Tabs> | <Tabs @change="tabChange" :data="tabData"></Tabs> | ||||
@@ -13,7 +13,7 @@ | |||||
<div class="right_side col space_between zIndextop"> | <div class="right_side col space_between zIndextop"> | ||||
<component :is="item" v-for="(item, index) in currentComp.right" :key="index"></component> | <component :is="item" v-for="(item, index) in currentComp.right" :key="index"></component> | ||||
</div> | </div> | ||||
<div class="buttom_side row space_between zIndextop"> | |||||
<div class="buttom_side row space_between zIndextop" style="z-index: 1;"> | |||||
<component :is="item" v-for="(item, index) in currentComp.buttom" :key="index"></component> | <component :is="item" v-for="(item, index) in currentComp.buttom" :key="index"></component> | ||||
</div> | </div> | ||||
</div> | </div> |