From 1daf3eace45de5b9c9c417569b309d1b632aec2d Mon Sep 17 00:00:00 2001
From: yanfeiyong <2060201549@qq.com>
Date: Thu, 8 May 2025 15:21:01 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B5=8B=E8=AF=95=E5=86=85=E5=AE=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/ManageApi/index.js                    |   8 ++
 src/views/components/ProjectDetails/Basic.vue |  36 +++++-
 src/views/components/analysis/chubeixm.vue    |  93 +++++++++++++
 src/views/components/analysis/ndwcqk.vue      | 122 ++++++++++++++++++
 4 files changed, 257 insertions(+), 2 deletions(-)
 create mode 100644 src/views/components/analysis/chubeixm.vue
 create mode 100644 src/views/components/analysis/ndwcqk.vue

diff --git a/src/api/ManageApi/index.js b/src/api/ManageApi/index.js
index 590af52..b4f3733 100644
--- a/src/api/ManageApi/index.js
+++ b/src/api/ManageApi/index.js
@@ -714,6 +714,14 @@ export function  xmlist(){
 //政务统计结束
 
 //企业统计
+//储备项目统计分析
+export function getAllProjects() {
+  return request({
+    url: '/gysl/zwStats/cbxmtj',
+    method: 'get'
+  })
+}
+
 //整体项目情况
 export function allinformationtwo(){
   return request({
diff --git a/src/views/components/ProjectDetails/Basic.vue b/src/views/components/ProjectDetails/Basic.vue
index 5522468..39874a1 100644
--- a/src/views/components/ProjectDetails/Basic.vue
+++ b/src/views/components/ProjectDetails/Basic.vue
@@ -30,7 +30,7 @@
             <div class="descriptionsdiv">
                 <el-descriptions class="margin-top" :column="3" border>
                     <el-descriptions-item v-for="(item, index) in descriptions" :key="index"
-                        :span="item.label === '项目法人单位简介' || item.label === '计划投资额' ? 3 : 1">
+                        :span="item.label === '项目法人单位简介' || item.label === '所属细分产业' ? 3 : 1">
                         <template slot="label">
                             {{ item.label }}
                         </template>
@@ -186,6 +186,24 @@
                         </el-form-item>
                     </el-col>
                 </el-row>
+                <el-row>
+                    <el-col :span="12">
+                        <el-form-item label="所属产业目录" prop="ml">
+                            <el-select v-model="form.ml" placeholder="请选择产业目录" value-key="value" style="width: 100%;">
+                                <el-option v-for="dict in dict.type.shangloumulu" :key="dict.value" :label="dict.label"
+                                    :value="parseInt(dict.value)" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="所属细分产业" prop="xfcy">
+                            <el-select v-model="form.xfcy" placeholder="请选择所属细分产业" value-key="value" style="width: 100%;">
+                                <el-option v-for="dict in dict.type.bqlx" :key="dict.value" :label="dict.label"
+                                    :value="parseInt(dict.value)" />
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
                 <el-row style="display: none;">
                     <el-col :span="12">
                         <el-form-item label="经度" prop="longitude">
@@ -231,7 +249,7 @@ export default {
         ImageUpload, luotu
     },
     dicts: [
-        'ssgnq', 'xmfrdwxz', 'xzfl', 'jsms'
+        'ssgnq', 'xmfrdwxz', 'xzfl', 'jsms','shangloumulu',"bqlxbqlx",'bqlx'
     ],
     props: {
         size: {
@@ -359,6 +377,18 @@ export default {
                 1: '已建',
                 2: '在建',
                 3: '拟建',
+            },
+            mlMap:{
+                1:'重点鼓励上楼',
+                2:'有条件上楼',
+            },
+            xfMap:{
+                1:'新一代信息技术',
+                2:'高端装备制造',
+                3:'生物医药及大健康',
+                4:'纳米技术应用及新材料',
+                5:'人工智能及数字产业',
+                6:'新能源及绿色产业',
             }
         };
     },
@@ -418,6 +448,8 @@ export default {
                 { label: '建设进度', value: data.jsjd },
                 { label: '统一社会信用代码', value: data.tyshxydm },
                 { label: '计划投资额', value: data.jhtze },
+                { label: '所属产业目录', value: this.mlMap[data.ml] || ''  },
+                { label: '所属细分产业', value: this.xfMap[data.xfcy] || ''  },
                 { label: '项目法人单位简介', value: data.unitIntroduction },
                 { label: '项目简介', value: data.introduction }
             ];
diff --git a/src/views/components/analysis/chubeixm.vue b/src/views/components/analysis/chubeixm.vue
new file mode 100644
index 0000000..d4ca29c
--- /dev/null
+++ b/src/views/components/analysis/chubeixm.vue
@@ -0,0 +1,93 @@
+<template>
+    <div class="container">
+        <div id="pieChart" style="width: 700px; height: 200px;"></div>
+    </div>
+</template>
+
+<script>
+import * as echarts from 'echarts';
+import { getAllProjects } from '@/api/ManageApi/index';
+export default {
+    name: 'ChubeiXm',
+    mounted() {
+        this.initPieChart();
+    },
+    methods: {
+        async initPieChart() {
+            try {
+                const res = await getAllProjects();
+                if (res.code === 200) { 
+                    const chartData = this.formatData(res.data); 
+                    this.renderChart(chartData);
+                }
+            } catch (error) {
+                console.error('获取数据失败:', error);
+            }
+        },
+        formatData(rawData) {
+            const mapping = {
+                '1': '新供地实施',
+                '2': '存量产业用地改扩建'
+            };
+
+            return rawData.map(item => ({
+                name: mapping[item.ssgnq] || '未知类型',
+                value: item.count
+            }));
+        },
+        renderChart(data) {
+            const chartDom = document.getElementById('pieChart');
+            const myChart = echarts.init(chartDom);
+
+            const option = {
+                tooltip: {
+                    trigger: 'item',
+                    formatter: '{b}: {d}%'
+                },
+                legend: {
+                    orient: 'horizontal',
+                    bottom: '0%',
+                    itemGap: 30
+                },
+                series: [
+                    {
+                        name: '储备项目统计',
+                        type: 'pie',
+                        radius: '50%',
+                        data: data,
+                        color: ['#409EFF', '#36CBCB'],
+                        emphasis: {
+                            itemStyle: {
+                                shadowBlur: 10,
+                                shadowOffsetX: 0,
+                                shadowColor: 'rgba(0, 0, 0, 0.5)'
+                            },
+                            label: {
+                                show: true,
+                                formatter: '{b}: {d}%'
+                            }
+                        }
+                    }
+                ]
+            };
+
+            myChart.setOption(option);
+        }
+    }
+};
+</script>
+
+<style scoped>
+.container {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding-bottom: 2%;
+}
+
+/* #pieChart {
+    margin: 20px auto;
+} */
+</style>
\ No newline at end of file
diff --git a/src/views/components/analysis/ndwcqk.vue b/src/views/components/analysis/ndwcqk.vue
new file mode 100644
index 0000000..f5cc3cd
--- /dev/null
+++ b/src/views/components/analysis/ndwcqk.vue
@@ -0,0 +1,122 @@
+<template>
+    <div class="year-progress-container">
+        <div class="top">
+            <span>时间截止至2025年2月</span>
+        </div>
+        <!-- 循环渲染 4 年的数据 -->
+        <div class="year-progress" v-for="item in progressData" :key="item.year">
+            <div class="header">
+                <span>{{ item.year }}年</span>
+                <span>已完成 {{ item.completed }} / 目标 {{ item.target }} / 未完成 {{ item.remaining }}</span>
+            </div>
+            <div class="progress-bar">
+                <!-- 已完成 -->
+                <div class="completed" :style="{ width: completedWidth(item) }"></div>
+
+
+                <!-- 未完成 -->
+                <div class="remaining" :style="{ width: remainingWidth(item) }"></div>
+
+                <!-- 缓冲区：只有当 completed <= target 时才显示 -->
+                <div class="buffer" :style="{
+                    width: shouldShowBuffer(item) ? bufferWidth(item) : '0%',
+                    transition: 'width 0.3s ease'
+                }"></div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'YearProgress',
+    data() {
+        const currentYear = new Date().getFullYear();
+        return {
+            // 示例数据：你可以替换成接口获取的真实数据
+            progressData: [
+                { year: currentYear, completed: 950, target: 900, remaining: 50 },
+                { year: currentYear - 1, completed: 800, target: 800, remaining: 0 },
+                { year: currentYear - 2, completed: 750, target: 700, remaining: 0 },
+                { year: currentYear - 3, completed: 500, target: 600, remaining: 100 },
+            ],
+            bufferZone: 50 
+        };
+    },
+    methods: {
+
+        shouldShowBuffer(item) {
+            return item.completed <= item.target;
+        },
+        // 计算已完成百分比（不超过目标+缓冲）
+        completedWidth(item) {
+            const max = item.target + this.bufferZone;
+            const value = Math.min(item.completed, max);
+            return `${(value / max) * 100}%`;
+        },
+        // 缓冲区固定比例
+        bufferWidth(item) {
+            const max = item.target + this.bufferZone;
+            return `${(this.bufferZone / max) * 100}%`;
+        },
+        // 剩余部分
+        remainingWidth(item) {
+            const max = item.target + this.bufferZone;
+            const remaining = Math.max(0, max - item.completed);
+            return `${(remaining / max) * 100}%`;
+        }
+    }
+};
+</script>
+
+<style scoped>
+.year-progress-container {
+    padding: 0rem 1rem 1rem 1rem;
+    height: 9rem;
+    overflow: auto;
+}
+.top{
+    width: 100%;
+    display: flex;
+    margin-bottom: 10px;
+    font-size: 0.88rem;
+    color: gray;
+    justify-content: flex-end;
+}
+.year-progress {
+    margin-bottom: 1.5rem;
+}
+
+.header {
+    display: flex;
+    justify-content: space-between;
+    font-size: 0.875rem;
+    color: #666;
+}
+
+.progress-bar {
+    height: 1rem;
+    border-radius: 0.5rem;
+    background-color: #e0e0e0;
+    overflow: hidden;
+    display: flex;
+}
+
+.completed {
+    background-color: #409EFF;
+    /* 蓝色 - 已完成 */
+    height: 100%;
+}
+
+.buffer {
+    background-color: #f0f0f0;
+    /* 浅灰 - 缓冲区 */
+    height: 100%;
+}
+
+.remaining {
+    background-color: #87CEFA;
+    /* 淡蓝色 - 未完成 */
+    height: 100%;
+}
+</style>
\ No newline at end of file