@@ -90,3 +90,29 @@ export function resourceTypeAnalysis (deptId, year) { | |||
params: query | |||
}) | |||
} | |||
// 资源一张图-左下-资源发包分析 | |||
export function resourceOutsourcingAnalysis (deptId, year) { | |||
let query = { | |||
deptId, | |||
year | |||
} | |||
return request({ | |||
url: 'api/home/xixia/resource/zyfbfx', | |||
method: 'get', | |||
params: query | |||
}) | |||
} | |||
// 资源一张图-右上-合同类型分析 | |||
export function analysisContractTypes (deptId, year) { | |||
let query = { | |||
deptId, | |||
year | |||
} | |||
return request({ | |||
url: 'api/home/xixia/resource/htgkfx', | |||
method: 'get', | |||
params: query | |||
}) | |||
} |
@@ -1,10 +1,15 @@ | |||
<Pannel title="资源发包分析" height="340" flexIble> | |||
<Pannel title="资源发包分析" height="340" flexIble | |||
v-loading="!isLoad" | |||
element-loading-text="拼命加载中" | |||
element-loading-spinner="el-icon-loading" | |||
element-loading-background="rgba(0, 0, 0, 0.1)" | |||
> | |||
<div class="full"> | |||
<div class="top"> | |||
<PannelTabs @change="tabChange" :data="pannelTabData"></PannelTabs> | |||
</div> | |||
<div class="buttom"> | |||
<Bar id="bar2"></Bar> | |||
<Bar v-if="isLoad" id="bar2"></Bar> | |||
</div> | |||
</div> | |||
</Pannel> |
@@ -1,15 +1,34 @@ | |||
import Pannel from '@/components/pannel/index.vue'; | |||
import PannelTabs from '@/components/pannel-tabs/index.vue'; | |||
import Bar from '@/components/charts/bar/index.vue'; | |||
import { resourceOutsourcingAnalysis } from '../../../../api/index.js' | |||
import { mapGetters } from 'vuex' | |||
export default { | |||
components: { | |||
Bar, | |||
PannelTabs, | |||
Pannel | |||
}, | |||
computed: { | |||
...mapGetters(['year', 'deptId']) | |||
}, | |||
watch: { | |||
year: { | |||
handler () { | |||
this.getData(); | |||
}, | |||
immediate: true, // 立即执行 | |||
}, | |||
deptId: { | |||
handler () { | |||
this.getData(); | |||
}, | |||
immediate: true, // 立即执行 | |||
} | |||
}, | |||
data () { | |||
return { | |||
isLoad: false, | |||
pannelTabData: [ | |||
{ | |||
id: '1', | |||
@@ -28,9 +47,24 @@ export default { | |||
mounted () { | |||
}, | |||
methods: { | |||
getData () { | |||
if (this.year, this.deptId) { | |||
this.isLoad = false; | |||
resourceOutsourcingAnalysis(this.deptId, this.year).then(res => { | |||
if (this.tabIndex == 1) { | |||
this.data = res.data.xz | |||
} else if (this.tabIndex == 2) { | |||
this.data = res.data.cz | |||
} | |||
this.isLoad = true; | |||
}) | |||
} | |||
}, | |||
tabChange (info) { | |||
//console.log(info); | |||
this.tabIndex = info.id | |||
this.getData() | |||
} | |||
} | |||
}; |
@@ -1,26 +1,26 @@ | |||
export default [ | |||
[ | |||
{ | |||
name: '总资产(万元)', | |||
name: '合同数量(个)', | |||
icon: require('./1.png'), | |||
value: '8000' | |||
value: '0' | |||
}, | |||
{ | |||
name: '总负债(万元)', | |||
name: '总合同额(万元)', | |||
icon: require('./2.png'), | |||
value: '257' | |||
value: '0' | |||
} | |||
], | |||
[ | |||
{ | |||
name: '总收入(万元)', | |||
name: '已结款(万元)', | |||
icon: require('./3.png'), | |||
value: '1460' | |||
value: '0' | |||
}, | |||
{ | |||
name: '总支出(万元)', | |||
name: '待借款(万元)', | |||
icon: require('./2.png'), | |||
value: '1011' | |||
value: '0' | |||
} | |||
] | |||
] |
@@ -1,14 +1,48 @@ | |||
import Pannel from '@/components/pannel/index.vue'; | |||
import Block from '@/components/block/index.vue'; | |||
import data from './data.js'; | |||
import { analysisContractTypes } from '../../../../api/index.js' | |||
import { mapGetters } from 'vuex' | |||
export default { | |||
components: { | |||
Block, | |||
Pannel | |||
}, | |||
computed: { | |||
...mapGetters(['year', 'deptId']) | |||
}, | |||
watch: { | |||
year: { | |||
handler () { | |||
this.getData(); | |||
}, | |||
immediate: true, // 立即执行 | |||
}, | |||
deptId: { | |||
handler () { | |||
this.getData(); | |||
}, | |||
immediate: true, // 立即执行 | |||
} | |||
}, | |||
data () { | |||
return { | |||
data | |||
}; | |||
}, | |||
methods: { | |||
getData () { | |||
if (this.year, this.deptId) { | |||
this.isLoad = false; | |||
analysisContractTypes(this.deptId, this.year).then(res => { | |||
console.log('analysisContractTypes', res); | |||
this.data[0][0].value = res.data.numHt | |||
this.data[0][1].value = res.data.zhte | |||
this.data[1][0].value = res.data.yjk | |||
this.data[1][1].value = res.data.djk | |||
this.isLoad = true; | |||
}) | |||
} | |||
} | |||
} | |||
}; |