增加A020电梯加装图表组件

src/lib/A013/index.vue

@@ -38,14 +38,6 @@
       </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>
 
@@ -57,7 +49,6 @@ 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
@@ -150,85 +141,6 @@ 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>
@@ -250,9 +162,10 @@ ajax.get({ url: _config.apis.chart }).then((res) => {
       color $yellow
       transform scale(1.1)
 .content
+  flex 1
   margin-top .1rem
   overflow-y auto
-  height 30vh
+  max-height 60vh
   margin-bottom .05rem
   >div
     $box()
@@ -276,9 +189,6 @@ ajax.get({ url: _config.apis.chart }).then((res) => {
         text-overflow ellipsis
       &.status
         color $yellow
-.chart
-  width 100%
-  height 1.5rem
 </style>
 <style lang="stylus">
 @import  '../../components/MyComponent/main.styl'

src/lib/A016/index.vue

@@ -157,7 +157,7 @@ const barOption = {
   },
   grid: {
     bottom: 0,
-    height: '100%',
+    height: '92%',
   },
   xAxis: [
     {

src/lib/A020/index.vue

+<template>
+  <m-card title="加装电梯">
+    <div class="chart">
+      <m-bar
+        v-if="charData.source.length > 0"
+        :dataset="charData"
+        :option="option"
+      />
+      <m-empty v-else />
+    </div>
+  </m-card>
+</template>
+
+<script lang="ts">
+const _config = {
+  name: 'A020',
+  title: '加装电梯',
+  row: 1,
+  apis: {
+    chart: '/service-special-ja-ddd/public/elevator/statistical',
+  },
+}
+export default _config
+</script>
+<script lang="ts" setup>
+import { ajax } from '@/ajax'
+import { ref, computed } from 'vue'
+
+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>
+@import  '../../components/MyComponent/main.styl'
+.chart
+  width 100%
+  height 1.5rem
+</style>

src/lib/index.ts

@@ -17,3 +17,4 @@ export { default as A016 } from './A016/index.vue'
 export { default as A017 } from './A017/index.vue'
 export { default as A018 } from './A018/index.vue'
 export { default as A019 } from './A019/index.vue'
+export { default as A020 } from './A020/index.vue'