Commit 069ee31c authored by 郭铭瑶's avatar 郭铭瑶 🤘

电梯加装撒点emit

parent 2e95b6bd
......@@ -34,6 +34,7 @@ const _config = {
api1: '/service-basicdatasync-ddd/public/indCous',
api2: '/service-basicdatasync-ddd/public/residentsCommitteesV2',
api3: '/service-basicdatasync-ddd/public/propCompanies',
streets: '/service-basicdatasync-ddd/public/getCspHocByStreet',
},
}
export default _config
......@@ -80,62 +81,75 @@ Promise.all([
]
})
const barData = {
const barData = ref({
dimensions: [
{ name: 'street', displayName: '街道' },
{ name: 'partyNum', displayName: '党小组数量' },
{ name: 'data1', displayName: '居委会' },
{ name: 'data2', displayName: '业委会' },
{ name: 'data3', displayName: '物业企业' },
{ name: 'streetName', displayName: '街道' },
{ name: 'hocNum', displayName: '业委会' },
{ name: 'cspNum', displayName: '物业企业' },
],
source: [
{ street: '街道1', partyNum: 60, data1: 20, data2: 20, data3: 20 },
{ street: '街道2', partyNum: 90, data1: 20, data2: 30, data3: 40 },
{ street: '街道3', partyNum: 130, data1: 30, data2: 40, data3: 60 },
{ street: '街道4', partyNum: 120, data1: 40, data2: 50, data3: 30 },
{ street: '街道5', partyNum: 120, data1: 50, data2: 60, data3: 10 },
{ street: '街道6', partyNum: 140, data1: 50, data2: 60, data3: 30 },
{ street: '街道7', partyNum: 130, data1: 50, data2: 60, data3: 20 },
{ street: '街道8', partyNum: 110, data1: 20, data2: 60, data3: 30 },
],
}
source: [],
})
ajax
.get({
url: _config.apis.streets,
})
.then((res) => {
barData.value.source = res?.data?.content || []
})
const barOption = {
color: ['#785CDD', '#77BFF9', '#EDB872', '#64C29D'],
color: ['#785CDD', '#77BFF9'],
legend: {
right: '2%',
itemWidth: fontSize.value * 0.6,
itemHeight: fontSize.value * 0.8,
},
grid: {
left: '2%',
right: '1%',
bottom: 0,
top: '20%',
containLabel: true,
height: '92%',
},
yAxis: {
minInterval: 1,
},
xAxis: [
{
type: 'category',
axisLabel: {
interval: 0,
},
},
],
series: [
{
type: 'bar',
barWidth: '18%',
itemStyle: {
borderRadius: 8,
},
barGap: 0,
},
...[1, 2, 3].map(() => ({
type: 'bar',
barWidth: '18%',
itemStyle: {
borderRadius: 8,
show: false,
},
barGap: 0,
stack: '总量',
})),
],
// xAxis: [
// {
// type: 'category',
// axisLabel: {
// interval: 0,
// rotate: 45,
// fontSize: fontSize.value * 0.8,
// },
// },
// ],
// series: [
// {
// type: 'bar',
// barWidth: '20%',
// itemStyle: {
// borderRadius: 8,
// },
// barGap: 0,
// },
// {
// type: 'bar',
// barWidth: '20%',
// itemStyle: {
// borderRadius: 8,
// },
// barGap: 0,
// },
// ],
}
</script>
......
......@@ -38,6 +38,14 @@
</template>
<m-empty v-else />
</div>
<div class="chart">
<m-bar
v-if="charData.source.length > 0"
:dataset="charData"
:option="option"
/>
<m-empty v-else />
</div>
</m-card>
</template>
......@@ -49,12 +57,13 @@ const _config = {
apis: {
streets: '/service-special-ja-ddd/public/getStreetData',
list: '/service-special-ja-ddd/public/elevatorInstallationInfos',
chart: '/service-special-ja-ddd/public/elevator/statistical',
},
}
export default _config
</script>
<script lang="ts" setup>
import { ref, watch } from 'vue'
import { computed, ref, watch } from 'vue'
import { NSpace, NSelect } from 'naive-ui'
import { ajax } from '@/ajax'
import bus from '@/util/event-bus'
......@@ -140,6 +149,86 @@ fetchList()
function onClick(data) {
bus.emit('elevatorInfo', data)
}
const fontSize = computed(() => Math.floor((screen.height * 1.6) / 100))
const charData = ref({
dimensions: [
{ name: 'streetName', displayName: '街道' },
{ name: 'passNum', displayName: '已完成征询' },
{ name: 'shouldPassNum', displayName: '应完成征询' },
{ name: 'startNum', displayName: '已开工' },
{ name: 'shouldStartNum', displayName: '应开工' },
{ name: 'finishNum', displayName: '已完工' },
{ name: 'shouldFinishNum', displayName: '应完工' },
],
source: [],
})
const option = {
color: [
'#0076FF',
'#00BFFF',
'#9FC444',
'#FFCE34',
'#FF9D27',
'#FF6161',
'#BABABA',
'#ff0000',
'#00ff00',
],
grid: {
left: '2%',
right: '1%',
bottom: '1%',
top: '20%',
containLabel: true,
},
legend: {
left: 0,
right: 0,
itemWidth: fontSize.value * 0.6,
itemHeight: fontSize.value * 0.8,
textStyle: {
fontSize: fontSize.value * 0.8,
},
},
xAxis: [
{
type: 'category',
axisLabel: {
interval: 0,
rotate: 45,
fontSize: fontSize.value * 0.8,
},
},
],
series: [
{
type: 'bar',
barWidth: '20%',
},
{
type: 'line',
},
{
type: 'bar',
barWidth: '20%',
},
{
type: 'line',
},
{
type: 'bar',
barWidth: '20%',
},
{
type: 'line',
},
],
}
ajax.get({ url: _config.apis.chart }).then((res) => {
const { streetData = [] } = res?.data?.content || {}
charData.value.source = streetData
})
</script>
<style lang="stylus" scoped>
......@@ -162,9 +251,8 @@ function onClick(data) {
transform scale(1.1)
.content
margin-top .1rem
flex 1
overflow-y auto
max-height 60vh
height 30vh
margin-bottom .05rem
>div
$box()
......@@ -188,6 +276,9 @@ function onClick(data) {
text-overflow ellipsis
&.status
color $yellow
.chart
width 100%
height 1.5rem
</style>
<style lang="stylus">
@import '../../components/MyComponent/main.styl'
......
......@@ -135,7 +135,7 @@ function onClick({ query, icon }) {
})
.then((res) => {
const data = res?.data?.content || []
bus.emit('addPoints', { data, icon, size: 12 })
bus.emit('addPoints', { data, icon, size: 12, _key: 'safety' })
})
}
</script>
......
<template>
<m-card title="电梯加装">
<div class="sum">
<div v-for="item in list" :key="item.name" @click="onClick(item.state)">
<div v-for="item in list" :key="item.name" @click="onClick(item)">
<span>{{ item.name }}</span>
<m-count class="orange-count" :value="item.value" />
<span>{{ item.unit }}</span>
......@@ -48,12 +48,14 @@ ajax.get({ url: _config.apis.main }).then((res) => {
value: +statistical.passNum || 0,
unit: '幢',
state: '2',
data: statistical?.passList || [],
},
{
name: '加梯完工',
value: +statistical.finishNum || 0,
unit: '幢',
state: '7',
data: statistical?.finishList || [],
},
]
charData.value.source = streetData
......@@ -136,21 +138,22 @@ const option = {
const list = ref([
// { name: '多层住宅房屋', value: 0, unit: '幢' },
// { name: '可加梯门牌数', value: 0, unit: '幢' },
{ name: '完成加梯征询', value: 0, unit: '幢', state: '2' },
{ name: '加梯完工', value: 0, unit: '幢', state: '7' },
{ name: '完成加梯征询', value: 0, unit: '幢', state: '2', data: [] },
{ name: '加梯完工', value: 0, unit: '幢', state: '7', data: [] },
])
const onClick = (state) => {
const onClick = ({ state, data }) => {
const icon = state === '2' ? ele1 : ele2
ajax
.get({
url: _config.apis.elevator,
params: { state, createTime_desc: 'desc', pageSize: 9000 },
})
.then((res) => {
const data = res?.data?.content || []
bus.emit('addPoints', { data, icon })
})
bus.emit('addPoints', { data, icon, size: 12, _key: 'elevator' })
// ajax
// .get({
// url: _config.apis.elevator,
// params: { state, createTime_desc: 'desc', pageSize: 9000 },
// })
// .then((res) => {
// const data = res?.data?.content || []
// bus.emit('addPoints', { data, icon })
// })
}
</script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment