From 51ad59e2373cd307fef7918fbc52d9a61e308086 Mon Sep 17 00:00:00 2001
From: yuzongping <835949940@qq.com>
Date: Tue, 10 Jun 2025 15:08:31 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A8=AA=E5=90=91=E6=9F=B1=E7=8A=B6=E5=9B=BE?=
 =?UTF-8?q?=E5=B0=81=E8=A3=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/charts/horizontal-bar/icon.png | Bin 0 -> 630 bytes
 .../charts/horizontal-bar/index.html          |   1 +
 src/components/charts/horizontal-bar/index.js | 201 ++++++++++++++++++
 .../charts/horizontal-bar/index.scss          |   6 +
 .../charts/horizontal-bar/index.vue           |   3 +
 src/views/resources/comps/buttom/1/data.js    |  40 +---
 src/views/resources/comps/left/top/1/1.png    | Bin 2934 -> 0 bytes
 src/views/resources/comps/left/top/1/2.png    | Bin 2890 -> 0 bytes
 src/views/resources/comps/left/top/1/3.png    | Bin 2848 -> 0 bytes
 src/views/resources/comps/left/top/1/data.js  |  26 ---
 .../resources/comps/left/top/1/index.html     |  15 +-
 src/views/resources/comps/left/top/1/index.js |   6 +-
 .../resources/comps/left/top/1/index.scss     |  16 +-
 .../resources/comps/right/bottom/1/index.html |   4 +-
 .../resources/comps/right/bottom/1/index.js   |   1 +
 .../resources/comps/right/middle/1/index.html |  12 +-
 .../resources/comps/right/middle/1/index.js   |  14 +-
 .../resources/comps/right/middle/1/index.scss |  17 ++
 18 files changed, 278 insertions(+), 84 deletions(-)
 create mode 100644 src/components/charts/horizontal-bar/icon.png
 create mode 100644 src/components/charts/horizontal-bar/index.html
 create mode 100644 src/components/charts/horizontal-bar/index.js
 create mode 100644 src/components/charts/horizontal-bar/index.scss
 create mode 100644 src/components/charts/horizontal-bar/index.vue
 delete mode 100644 src/views/resources/comps/left/top/1/1.png
 delete mode 100644 src/views/resources/comps/left/top/1/2.png
 delete mode 100644 src/views/resources/comps/left/top/1/3.png
 delete mode 100644 src/views/resources/comps/left/top/1/data.js

diff --git a/src/components/charts/horizontal-bar/icon.png b/src/components/charts/horizontal-bar/icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..1e2736d31748412623e715a0005f3cde76253880
GIT binary patch
literal 630
zcmV-+0*U>JP)<h;3K|Lk000e1NJLTq000sI000sQ1^@s6R?d!B00001b5ch_0Itp)
z=>Px%FiAu~R5(wilut;LaTv!x&sMovtu{*t49X-boOXyc=cR*?7}T*cvglyTOH#+K
zU5n}<<{{9?>{w75bm-EiBcgnTBL4*rgW0xN%?)YqFWzmsz42;-@8LZ>&+qyCp6B^J
z-$$_cJi&>RN>n>Y0My>X5t#!O5+#F)-ul=7hDo`hs&o91vdJTaCejO#n1XE5fPljd
zo?6&i4T`Yn>Poz?;mdOT3TS6gJ7E)f&f<cL$ze!LTO|wbS~%DSmAg~AQfGeldf(>r
zHGWlH+F_*_B{}0l8-m=DHDuXp-vZuq1~estKi=d0oCkS=;~_HfCf@h`A5soG)(OsC
z;Y6=DAVy;mHNwXMNY1QeqW0}UT|bX%ZY;F=-6!P15HdSo%GN0JXa^{1756o*U(&G-
zB0VOE{^U07*k&#<mB!Y73;FiFWcPKUDytuhJE%=bbo2mIBP-6_y&KSS+`3P1#;|wa
zE&1wNQ8oT)BcrTL4p$HzD}f^YQ0cG+EoQO%E|q*WK2%-XQW5m3f@oxYpx+tn{>v61
z%hGN_i*J?EBG|j{Sd<pj24pdIal_4C>-qKWc4%&ZoPtpe+x@4jKYw8$wGf#f8ym<x
z=<0_f*fxhr&bpX*27j_^OJtJ+>d%6EzgZ$iR9>|3f=qlnUtgN0+(gZb_7pg)e(7-9
zB--VJ<~0&4Y=DfhMgXU0eQTur*5YEjfFb}C7aMa3A<^~0#KXpt42pq&0eZar^9W1J
QGXMYp07*qoM6N<$g5<g>xc~qF

literal 0
HcmV?d00001

diff --git a/src/components/charts/horizontal-bar/index.html b/src/components/charts/horizontal-bar/index.html
new file mode 100644
index 0000000..d60fced
--- /dev/null
+++ b/src/components/charts/horizontal-bar/index.html
@@ -0,0 +1 @@
+<div :id="id" class="chart"></div>
diff --git a/src/components/charts/horizontal-bar/index.js b/src/components/charts/horizontal-bar/index.js
new file mode 100644
index 0000000..6b44938
--- /dev/null
+++ b/src/components/charts/horizontal-bar/index.js
@@ -0,0 +1,201 @@
+import * as echarts from 'echarts';
+import elementResizeDetectorMaker from 'element-resize-detector';
+export default {
+  props: {
+    id: {
+      type: String,
+      default: 'horizontal-bar'
+    },
+    data: {
+      type: Array,
+      default: function () {
+        return [
+          {
+            name: '闲置',
+            value: '10'
+          },
+          {
+            name: '出租/出借',
+            value: '19'
+          }
+        ];
+      }
+    },
+    unit: {
+      type: String,
+      default: '单位：万元'
+    },
+    color: {
+      type: Array,
+      default: function () {
+        return ['rgba(15, 252, 252, 1)', 'rgba(53, 197, 124, 1)']
+      }
+    }
+  },
+  data () {
+    return {
+      icon: require('./icon.png'),
+      chart: null
+    };
+  },
+  mounted () {
+    this.initChart();
+  },
+  computed: {
+  },
+  methods: {
+    // 设置监听器 页面尺寸变化重新绘制图表
+    initResizeCallBack () {
+      const erd = elementResizeDetectorMaker();
+      erd.listenTo(document.getElementById(this.id), () => {
+        this.$nextTick(() => {
+          this.chart.resize();
+        });
+      });
+    },
+    initChart () {
+      this.chart = echarts.init(document.getElementById(this.id));
+      this.chartSetOption();
+    },
+    chartSetOption () {
+      let yAxis1 = [];
+      let yAxis2 = [];
+      let data = [];
+
+      let pictorialBarData = [];
+      this.data.forEach((item, index) => {
+        yAxis1.push(item.name)
+        yAxis2.push(item.value + '亩')
+        data.push(
+          {
+            value: item.value,
+            itemStyle: {
+              color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [
+                {
+                  offset: 0,
+                  color: index === 0 ? 'rgba(134, 91, 252, 1)' : 'rgba(15, 252, 252, 1)',
+                },
+                {
+                  offset: 1,
+                  color: index === 0 ? 'rgba(49, 129, 246, 1)' : 'rgba(194, 255, 255, 1)',
+                },
+              ]),
+            },
+          }
+        )
+
+
+        pictorialBarData.push({
+          value: item.value,
+          itemStyle: {
+            color: "rgba(255, 255, 255, 1)",
+          },
+        })
+      });
+      const option = {
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            type: "shadow",
+          },
+          formatter: function (objs, index) {
+            let obj = objs[0];
+            return `${obj.name}<br/>${obj.marker}${obj.seriesName} : ${obj.value}%`;
+          },
+        },
+        grid: {
+          top: "3%",
+          left: "3%",
+          right: "4%",
+          bottom: "3%",
+          containLabel: true,
+        },
+        xAxis: {
+          show: false,
+          type: "value",
+          boundaryGap: [0, 0.01],
+          interval: 20,
+          min: 0,
+          max: 100,
+          splitLine: {
+            lineStyle: {
+              type: "dashed",
+            },
+          },
+          axisLine: {
+            show: false,
+            lineStyle: {
+              color: "#909396",
+            },
+          },
+          axisLabel: {
+            formatter: function (value, index) {
+              return value + "%";
+            },
+            color: "#303439",
+          },
+          axisTick: {
+            show: false,
+          },
+        },
+        yAxis: [
+          {
+            type: "category",
+            boundaryGap: true,
+            axisLabel: {
+              formatter: "{value}",
+              textStyle: {
+                color: "rgba(185, 211, 235, 1)",
+              },
+            },
+            axisLine: {
+              show: false
+            },
+            axisTick: {
+              show: false,
+            },
+            data: yAxis1,
+          },
+          {
+            type: "category",
+            boundaryGap: true,
+            axisLabel: {
+              formatter: "{value}",
+              textStyle: {
+                color: "rgba(185, 211, 235, 1)",
+              },
+            },
+            axisLine: {
+              show: false
+            },
+            axisTick: {
+              show: false,
+            },
+            data: yAxis2,
+          }
+        ],
+        series: [
+          {
+            name: "",
+            barMaxWidth: 6,
+            type: "bar",
+            data: data,
+          },
+          {
+            name: "2",
+            barMaxWidth: 10,
+            type: "pictorialBar",
+            symbol: 'rect',
+            symbolSize: [4, 14],
+            symbolOffset: [4, 0],
+            symbolPosition: 'end',
+            data: pictorialBarData,
+          }
+        ],
+      };
+      this.chart.setOption(option);
+      this.initResizeCallBack();
+
+    }
+  }
+};
diff --git a/src/components/charts/horizontal-bar/index.scss b/src/components/charts/horizontal-bar/index.scss
new file mode 100644
index 0000000..b89d9dc
--- /dev/null
+++ b/src/components/charts/horizontal-bar/index.scss
@@ -0,0 +1,6 @@
+.chart {
+  overflow: visible;
+  width: 100%;
+  height: 100%;
+  z-index: 2;
+}
\ No newline at end of file
diff --git a/src/components/charts/horizontal-bar/index.vue b/src/components/charts/horizontal-bar/index.vue
new file mode 100644
index 0000000..5ca257a
--- /dev/null
+++ b/src/components/charts/horizontal-bar/index.vue
@@ -0,0 +1,3 @@
+<template src='./index.html'/>
+<script lang='js' src='./index.js'></script>
+<style lang='scss' src='./index.scss' scoped></style>
diff --git a/src/views/resources/comps/buttom/1/data.js b/src/views/resources/comps/buttom/1/data.js
index 4798bc8..33dd7a4 100644
--- a/src/views/resources/comps/buttom/1/data.js
+++ b/src/views/resources/comps/buttom/1/data.js
@@ -1,61 +1,33 @@
 export default [
-  [
-    {
-      show: false
-    },
-    {
-      show: true,
-      name: '经营收入',
-      value: '716'
-    },
-    {
-      show: true,
-      name: '投资收益',
-      value: '716'
-    },
-    {
-      show: true,
-      name: '补助收入',
-      value: '716'
-    },
-    {
-      show: true,
-      name: '其他收入',
-      value: '716'
-    },
-    {
-      show: false
-    }
-  ],
   [
     {
       show: true,
-      name: '经营支出',
+      name: '农用地（亩）',
       value: '716'
     },
     {
       show: true,
-      name: '税金及附加',
+      name: '建设用地（亩）',
       value: '716'
     },
     {
       show: true,
-      name: '管理费用',
+      name: '未利用地（亩）',
       value: '716'
     },
     {
       show: true,
-      name: '公益支出',
+      name: '农用地（宗）',
       value: '716'
     },
     {
       show: true,
-      name: '其他支出',
+      name: '建设用地（宗）',
       value: '716'
     },
     {
       show: true,
-      name: '所得税费用',
+      name: '未利用地（宗）',
       value: '103'
     }
   ]
diff --git a/src/views/resources/comps/left/top/1/1.png b/src/views/resources/comps/left/top/1/1.png
deleted file mode 100644
index bf8ed4a435ada2d7529b7e8d4de98c616e317cd6..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2934
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

diff --git a/src/views/resources/comps/left/top/1/2.png b/src/views/resources/comps/left/top/1/2.png
deleted file mode 100644
index b86d43c03afe6ae85c876584ac93668f7ec2c27c..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2890
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

diff --git a/src/views/resources/comps/left/top/1/3.png b/src/views/resources/comps/left/top/1/3.png
deleted file mode 100644
index 1a99eb80230b53694db4051ff33835bc98d94da3..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 2848
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

diff --git a/src/views/resources/comps/left/top/1/data.js b/src/views/resources/comps/left/top/1/data.js
deleted file mode 100644
index 7f9e969..0000000
--- a/src/views/resources/comps/left/top/1/data.js
+++ /dev/null
@@ -1,26 +0,0 @@
-export default [
-  [
-    {
-      name: '存款额（万元）',
-      icon: require('./1.png'),
-      value: '3420'
-    },
-    {
-      name: '组织数（个）',
-      icon: require('./2.png'),
-      value: '257'
-    }
-  ],
-  [
-    {
-      name: '现金额（万元）',
-      icon: require('./3.png'),
-      value: '160'
-    },
-    {
-      name: '组织数（个）',
-      icon: require('./2.png'),
-      value: '101'
-    }
-  ]
-]
\ No newline at end of file
diff --git a/src/views/resources/comps/left/top/1/index.html b/src/views/resources/comps/left/top/1/index.html
index 264b3b6..804e4a2 100644
--- a/src/views/resources/comps/left/top/1/index.html
+++ b/src/views/resources/comps/left/top/1/index.html
@@ -1,9 +1,8 @@
-<Pannel title="货币资金分析" height="232">
-  <table>
-    <tr v-for="line in data">
-      <td v-for="item in line">
-        <Block :data="item"></Block>
-      </td>
-    </tr>
-  </table>
+<Pannel title="资源概况分析" height="232">
+  <div class="full colbox">
+    <div class="top border"></div>
+    <div class="buttom border">
+      <HorizontalBar></HorizontalBar>
+    </div>
+  </div>
 </Pannel>
\ No newline at end of file
diff --git a/src/views/resources/comps/left/top/1/index.js b/src/views/resources/comps/left/top/1/index.js
index dd153d1..9ad101c 100644
--- a/src/views/resources/comps/left/top/1/index.js
+++ b/src/views/resources/comps/left/top/1/index.js
@@ -1,14 +1,12 @@
 import Pannel from '@/components/pannel/index.vue';
-import Block from '@/components/block/index.vue';
-import data from './data.js';
+import HorizontalBar from '@/components/charts/horizontal-bar/index.vue';
 export default {
   components: {
-    Block,
+    HorizontalBar,
     Pannel
   },
   data () {
     return {
-      data
     };
   }
 };
diff --git a/src/views/resources/comps/left/top/1/index.scss b/src/views/resources/comps/left/top/1/index.scss
index f157533..0812b5a 100644
--- a/src/views/resources/comps/left/top/1/index.scss
+++ b/src/views/resources/comps/left/top/1/index.scss
@@ -1,12 +1,14 @@
-table {
-  width: 100%;
-  height: 100%;
+.colbox {
+  display: flex;
+  flex-direction: column;
 
-  tr {
+  .top {
     width: 100%;
+    flex: 1;
+  }
 
-    td {
-      width: 50%;
-    }
+  .buttom {
+    width: 100%;
+    flex: 1;
   }
 }
\ No newline at end of file
diff --git a/src/views/resources/comps/right/bottom/1/index.html b/src/views/resources/comps/right/bottom/1/index.html
index 95bb6de..acc4586 100644
--- a/src/views/resources/comps/right/bottom/1/index.html
+++ b/src/views/resources/comps/right/bottom/1/index.html
@@ -1,3 +1,3 @@
-<Pannel title="资金支出排名" height="340">
-  <ScrollTable></ScrollTable>
+<Pannel title="合同不规范管理排名分析" height="340">
+  <ScrollTable :headers="headers"></ScrollTable>
 </Pannel>
\ No newline at end of file
diff --git a/src/views/resources/comps/right/bottom/1/index.js b/src/views/resources/comps/right/bottom/1/index.js
index bcaba7d..82f0947 100644
--- a/src/views/resources/comps/right/bottom/1/index.js
+++ b/src/views/resources/comps/right/bottom/1/index.js
@@ -8,6 +8,7 @@ export default {
   },
   data () {
     return {
+      headers: ['部门名称', '合同数量', '排名']
     };
   },
   created () {
diff --git a/src/views/resources/comps/right/middle/1/index.html b/src/views/resources/comps/right/middle/1/index.html
index 2063689..2b75f12 100644
--- a/src/views/resources/comps/right/middle/1/index.html
+++ b/src/views/resources/comps/right/middle/1/index.html
@@ -1,3 +1,11 @@
-<Pannel title="资金收入排名" height="340">
-  <ScrollTable></ScrollTable>
+<Pannel title="合同数量/金额排名分析" height="340">
+
+  <div class="full">
+    <div class="top">
+      <PannelTabs @change="tabChange" :data="pannelTabData"></PannelTabs>
+    </div>
+    <div class="buttom">
+      <ScrollTable :headers="headers"></ScrollTable>
+    </div>
+  </div>
 </Pannel>
\ No newline at end of file
diff --git a/src/views/resources/comps/right/middle/1/index.js b/src/views/resources/comps/right/middle/1/index.js
index bcaba7d..f03e899 100644
--- a/src/views/resources/comps/right/middle/1/index.js
+++ b/src/views/resources/comps/right/middle/1/index.js
@@ -1,13 +1,25 @@
 import Pannel from '@/components/pannel/index.vue';
 import ScrollTable from '@/components/scroll-table/index.vue';
-
+import PannelTabs from '@/components/pannel-tabs/index.vue';
 export default {
   components: {
+    PannelTabs,
     ScrollTable,
     Pannel
   },
   data () {
     return {
+      headers: ['部门名称', '数量', '排名'],
+      pannelTabData: [
+        {
+          id: '1',
+          name: '数量'
+        },
+        {
+          id: '2',
+          name: '金额'
+        }
+      ],
     };
   },
   created () {
diff --git a/src/views/resources/comps/right/middle/1/index.scss b/src/views/resources/comps/right/middle/1/index.scss
index e69de29..938adcd 100644
--- a/src/views/resources/comps/right/middle/1/index.scss
+++ b/src/views/resources/comps/right/middle/1/index.scss
@@ -0,0 +1,17 @@
+.full {
+  display: flex;
+  flex-direction: column;
+
+  .top {
+    height: 50px !important;
+    width: 100%;
+    display: flex !important;
+    align-items: center !important;
+    justify-content: flex-end;
+  }
+
+  .buttom {
+    flex: 1;
+    width: 100%;
+  }
+}
\ No newline at end of file