diff --git a/src/api/construction.js b/src/api/construction.js
index 13cbc95..92dbb0e 100644
--- a/src/api/construction.js
+++ b/src/api/construction.js
@@ -63,6 +63,18 @@
   })
 }
 
+// 工地环境监测
+export function fetchConstructionEnvoriment (year) {
+  return request({
+    baseURL: config.baseUrl,
+    url: '/construction/envoriment',
+    method: 'get',
+    params: {
+      params: year
+    }
+  })
+}
+
 // 工地报警状态
 export function fetchConstructionAlarmByState (year) {
   return request({

diff --git a/src/api/construction.js b/src/api/construction.js
index 13cbc95..92dbb0e 100644
--- a/src/api/construction.js
+++ b/src/api/construction.js
@@ -63,6 +63,18 @@
   })
 }
 
+// 工地环境监测
+export function fetchConstructionEnvoriment (year) {
+  return request({
+    baseURL: config.baseUrl,
+    url: '/construction/envoriment',
+    method: 'get',
+    params: {
+      params: year
+    }
+  })
+}
+
 // 工地报警状态
 export function fetchConstructionAlarmByState (year) {
   return request({
diff --git a/src/views/cityConstruction/components/construction/components/constructionBar.vue b/src/views/cityConstruction/components/construction/components/constructionBar.vue
index 1cfdda9..a739fdd 100644
--- a/src/views/cityConstruction/components/construction/components/constructionBar.vue
+++ b/src/views/cityConstruction/components/construction/components/constructionBar.vue
@@ -18,6 +18,9 @@
 <script>
 import ColorfulBarChart from '@/components/barChart/colorfulBarChart'
 import SingleLayout from '@/components/layout/singleLayout'
+import {fetchConstructionByType} from '@/api/construction'
+import {getYear} from '@/utils/formatDate'
+
 export default {
   name: 'ConstructionBar',
   components: {SingleLayout, ColorfulBarChart},
@@ -33,9 +36,22 @@
       }
     }
   },
+  created () {
+    this.getData()
+  },
   methods: {
     getData () {
-
+      console.log('fetchConstructionByType')
+      let year = getYear()
+      fetchConstructionByType(year).then(res => {
+        console.log('fetchConstructionByType', res.data)
+        this.options.xAxisData = []
+        this.options.seriesData = []
+        for (const item of res.data) {
+          this.options.xAxisData.push(item.type)
+          this.options.seriesData.push(item.value)
+        }
+      })
     }
   }
 }

diff --git a/src/api/construction.js b/src/api/construction.js
index 13cbc95..92dbb0e 100644
--- a/src/api/construction.js
+++ b/src/api/construction.js
@@ -63,6 +63,18 @@
   })
 }
 
+// 工地环境监测
+export function fetchConstructionEnvoriment (year) {
+  return request({
+    baseURL: config.baseUrl,
+    url: '/construction/envoriment',
+    method: 'get',
+    params: {
+      params: year
+    }
+  })
+}
+
 // 工地报警状态
 export function fetchConstructionAlarmByState (year) {
   return request({
diff --git a/src/views/cityConstruction/components/construction/components/constructionBar.vue b/src/views/cityConstruction/components/construction/components/constructionBar.vue
index 1cfdda9..a739fdd 100644
--- a/src/views/cityConstruction/components/construction/components/constructionBar.vue
+++ b/src/views/cityConstruction/components/construction/components/constructionBar.vue
@@ -18,6 +18,9 @@
 <script>
 import ColorfulBarChart from '@/components/barChart/colorfulBarChart'
 import SingleLayout from '@/components/layout/singleLayout'
+import {fetchConstructionByType} from '@/api/construction'
+import {getYear} from '@/utils/formatDate'
+
 export default {
   name: 'ConstructionBar',
   components: {SingleLayout, ColorfulBarChart},
@@ -33,9 +36,22 @@
       }
     }
   },
+  created () {
+    this.getData()
+  },
   methods: {
     getData () {
-
+      console.log('fetchConstructionByType')
+      let year = getYear()
+      fetchConstructionByType(year).then(res => {
+        console.log('fetchConstructionByType', res.data)
+        this.options.xAxisData = []
+        this.options.seriesData = []
+        for (const item of res.data) {
+          this.options.xAxisData.push(item.type)
+          this.options.seriesData.push(item.value)
+        }
+      })
     }
   }
 }
diff --git a/src/views/cityConstruction/components/construction/components/constructionPie.vue b/src/views/cityConstruction/components/construction/components/constructionPie.vue
index eecdebf..967ae9a 100644
--- a/src/views/cityConstruction/components/construction/components/constructionPie.vue
+++ b/src/views/cityConstruction/components/construction/components/constructionPie.vue
@@ -19,6 +19,9 @@
 <script>
 import SimplePieChart from '@/components/pieChart/simplePieChart'
 import SingleLayout from '@/components/layout/singleLayout'
+import {fetchConstructionByType} from '@/api/construction'
+import {getYear} from '@/utils/formatDate'
+
 export default {
   name: 'ConstructionPie',
   components: {SingleLayout, SimplePieChart},
@@ -44,11 +47,22 @@
   },
   methods: {
     getData () {
-      // fetchCaseByArea().then(response=>{
-      //   if(response.code===200){
-      //     this.data.data = response.data
-      //   }
-      // })
+      console.log('fetchConstructionByType')
+      let year = getYear()
+      fetchConstructionByType(year).then(res => {
+        console.log('fetchConstructionByType', res.data)
+        // todo fetchConstructionByType
+        this.data.legend = []
+        this.data.data = []
+        for (const item of res.data) {
+          const newitem = {
+            value: item.value,
+            name: item.type
+          }
+          this.data.legend.push(item.type)
+          this.data.data.push(newitem)
+        }
+      })
     }
   }
 }

diff --git a/src/api/construction.js b/src/api/construction.js
index 13cbc95..92dbb0e 100644
--- a/src/api/construction.js
+++ b/src/api/construction.js
@@ -63,6 +63,18 @@
   })
 }
 
+// 工地环境监测
+export function fetchConstructionEnvoriment (year) {
+  return request({
+    baseURL: config.baseUrl,
+    url: '/construction/envoriment',
+    method: 'get',
+    params: {
+      params: year
+    }
+  })
+}
+
 // 工地报警状态
 export function fetchConstructionAlarmByState (year) {
   return request({
diff --git a/src/views/cityConstruction/components/construction/components/constructionBar.vue b/src/views/cityConstruction/components/construction/components/constructionBar.vue
index 1cfdda9..a739fdd 100644
--- a/src/views/cityConstruction/components/construction/components/constructionBar.vue
+++ b/src/views/cityConstruction/components/construction/components/constructionBar.vue
@@ -18,6 +18,9 @@
 <script>
 import ColorfulBarChart from '@/components/barChart/colorfulBarChart'
 import SingleLayout from '@/components/layout/singleLayout'
+import {fetchConstructionByType} from '@/api/construction'
+import {getYear} from '@/utils/formatDate'
+
 export default {
   name: 'ConstructionBar',
   components: {SingleLayout, ColorfulBarChart},
@@ -33,9 +36,22 @@
       }
     }
   },
+  created () {
+    this.getData()
+  },
   methods: {
     getData () {
-
+      console.log('fetchConstructionByType')
+      let year = getYear()
+      fetchConstructionByType(year).then(res => {
+        console.log('fetchConstructionByType', res.data)
+        this.options.xAxisData = []
+        this.options.seriesData = []
+        for (const item of res.data) {
+          this.options.xAxisData.push(item.type)
+          this.options.seriesData.push(item.value)
+        }
+      })
     }
   }
 }
diff --git a/src/views/cityConstruction/components/construction/components/constructionPie.vue b/src/views/cityConstruction/components/construction/components/constructionPie.vue
index eecdebf..967ae9a 100644
--- a/src/views/cityConstruction/components/construction/components/constructionPie.vue
+++ b/src/views/cityConstruction/components/construction/components/constructionPie.vue
@@ -19,6 +19,9 @@
 <script>
 import SimplePieChart from '@/components/pieChart/simplePieChart'
 import SingleLayout from '@/components/layout/singleLayout'
+import {fetchConstructionByType} from '@/api/construction'
+import {getYear} from '@/utils/formatDate'
+
 export default {
   name: 'ConstructionPie',
   components: {SingleLayout, SimplePieChart},
@@ -44,11 +47,22 @@
   },
   methods: {
     getData () {
-      // fetchCaseByArea().then(response=>{
-      //   if(response.code===200){
-      //     this.data.data = response.data
-      //   }
-      // })
+      console.log('fetchConstructionByType')
+      let year = getYear()
+      fetchConstructionByType(year).then(res => {
+        console.log('fetchConstructionByType', res.data)
+        // todo fetchConstructionByType
+        this.data.legend = []
+        this.data.data = []
+        for (const item of res.data) {
+          const newitem = {
+            value: item.value,
+            name: item.type
+          }
+          this.data.legend.push(item.type)
+          this.data.data.push(newitem)
+        }
+      })
     }
   }
 }
diff --git a/src/views/cityConstruction/components/construction/components/constructionState.vue b/src/views/cityConstruction/components/construction/components/constructionState.vue
index c5ac7f9..ca071dd 100644
--- a/src/views/cityConstruction/components/construction/components/constructionState.vue
+++ b/src/views/cityConstruction/components/construction/components/constructionState.vue
@@ -15,6 +15,8 @@
 
 <script>
 import SimpleBlock from '@/components/block/simpleBlock'
+import {fetchConstructionByState, fetchConstructionCount, fetchConstructionInvestment} from '@/api/construction'
+import {getYear} from '@/utils/formatDate'
 // import {fetchInfrastructure} from '@/api/total'
 export default {
   name: 'ConstructionState',
@@ -31,14 +33,55 @@
       }
     }
   },
-  mounted () {
+  created () {
     this.getData()
   },
   methods: {
     getData () {
-      for (const item of Object.keys(this.data)) {
-        this.getItemData(item)
-      }
+      this.getStateData()
+      this.getTotalData()
+      this.getInvData()
+    },
+    getStateData () {
+      console.log('fetchConstructionByState')
+      let year = getYear()
+      fetchConstructionByState(year).then((res) => {
+        console.log('fetchConstructionByState', res.data)
+        for (const item of res.data) {
+          switch (item.type) {
+            case '在建':
+              this.data.doing.value = item.value
+              break
+            case '未开工':
+              this.data.ready.value = item.value
+              break
+            case '暂停':
+              this.data.pause.value = item.value
+              break
+            case '竣工':
+              this.data.over.value = item.value
+              break
+            default:
+              break
+          }
+        }
+      })
+    },
+    getTotalData () {
+      console.log('fetchConstructionCount')
+      let year = getYear()
+      fetchConstructionCount(year).then((res) => {
+        console.log('fetchConstructionCount', res.data)
+        this.data.total.value = res.data.total
+      })
+    },
+    getInvData () {
+      console.log('fetchConstructionInvestment')
+      let year = getYear()
+      fetchConstructionInvestment(year).then((res) => {
+        console.log('fetchConstructionInvestment', res.data)
+        this.data.investment.value = (res.data.total / 10000).toFixed(1)
+      })
     },
     // item，传参数
     getItemData (item) {

diff --git a/src/api/construction.js b/src/api/construction.js
index 13cbc95..92dbb0e 100644
--- a/src/api/construction.js
+++ b/src/api/construction.js
@@ -63,6 +63,18 @@
   })
 }
 
+// 工地环境监测
+export function fetchConstructionEnvoriment (year) {
+  return request({
+    baseURL: config.baseUrl,
+    url: '/construction/envoriment',
+    method: 'get',
+    params: {
+      params: year
+    }
+  })
+}
+
 // 工地报警状态
 export function fetchConstructionAlarmByState (year) {
   return request({
diff --git a/src/views/cityConstruction/components/construction/components/constructionBar.vue b/src/views/cityConstruction/components/construction/components/constructionBar.vue
index 1cfdda9..a739fdd 100644
--- a/src/views/cityConstruction/components/construction/components/constructionBar.vue
+++ b/src/views/cityConstruction/components/construction/components/constructionBar.vue
@@ -18,6 +18,9 @@
 <script>
 import ColorfulBarChart from '@/components/barChart/colorfulBarChart'
 import SingleLayout from '@/components/layout/singleLayout'
+import {fetchConstructionByType} from '@/api/construction'
+import {getYear} from '@/utils/formatDate'
+
 export default {
   name: 'ConstructionBar',
   components: {SingleLayout, ColorfulBarChart},
@@ -33,9 +36,22 @@
       }
     }
   },
+  created () {
+    this.getData()
+  },
   methods: {
     getData () {
-
+      console.log('fetchConstructionByType')
+      let year = getYear()
+      fetchConstructionByType(year).then(res => {
+        console.log('fetchConstructionByType', res.data)
+        this.options.xAxisData = []
+        this.options.seriesData = []
+        for (const item of res.data) {
+          this.options.xAxisData.push(item.type)
+          this.options.seriesData.push(item.value)
+        }
+      })
     }
   }
 }
diff --git a/src/views/cityConstruction/components/construction/components/constructionPie.vue b/src/views/cityConstruction/components/construction/components/constructionPie.vue
index eecdebf..967ae9a 100644
--- a/src/views/cityConstruction/components/construction/components/constructionPie.vue
+++ b/src/views/cityConstruction/components/construction/components/constructionPie.vue
@@ -19,6 +19,9 @@
 <script>
 import SimplePieChart from '@/components/pieChart/simplePieChart'
 import SingleLayout from '@/components/layout/singleLayout'
+import {fetchConstructionByType} from '@/api/construction'
+import {getYear} from '@/utils/formatDate'
+
 export default {
   name: 'ConstructionPie',
   components: {SingleLayout, SimplePieChart},
@@ -44,11 +47,22 @@
   },
   methods: {
     getData () {
-      // fetchCaseByArea().then(response=>{
-      //   if(response.code===200){
-      //     this.data.data = response.data
-      //   }
-      // })
+      console.log('fetchConstructionByType')
+      let year = getYear()
+      fetchConstructionByType(year).then(res => {
+        console.log('fetchConstructionByType', res.data)
+        // todo fetchConstructionByType
+        this.data.legend = []
+        this.data.data = []
+        for (const item of res.data) {
+          const newitem = {
+            value: item.value,
+            name: item.type
+          }
+          this.data.legend.push(item.type)
+          this.data.data.push(newitem)
+        }
+      })
     }
   }
 }
diff --git a/src/views/cityConstruction/components/construction/components/constructionState.vue b/src/views/cityConstruction/components/construction/components/constructionState.vue
index c5ac7f9..ca071dd 100644
--- a/src/views/cityConstruction/components/construction/components/constructionState.vue
+++ b/src/views/cityConstruction/components/construction/components/constructionState.vue
@@ -15,6 +15,8 @@
 
 <script>
 import SimpleBlock from '@/components/block/simpleBlock'
+import {fetchConstructionByState, fetchConstructionCount, fetchConstructionInvestment} from '@/api/construction'
+import {getYear} from '@/utils/formatDate'
 // import {fetchInfrastructure} from '@/api/total'
 export default {
   name: 'ConstructionState',
@@ -31,14 +33,55 @@
       }
     }
   },
-  mounted () {
+  created () {
     this.getData()
   },
   methods: {
     getData () {
-      for (const item of Object.keys(this.data)) {
-        this.getItemData(item)
-      }
+      this.getStateData()
+      this.getTotalData()
+      this.getInvData()
+    },
+    getStateData () {
+      console.log('fetchConstructionByState')
+      let year = getYear()
+      fetchConstructionByState(year).then((res) => {
+        console.log('fetchConstructionByState', res.data)
+        for (const item of res.data) {
+          switch (item.type) {
+            case '在建':
+              this.data.doing.value = item.value
+              break
+            case '未开工':
+              this.data.ready.value = item.value
+              break
+            case '暂停':
+              this.data.pause.value = item.value
+              break
+            case '竣工':
+              this.data.over.value = item.value
+              break
+            default:
+              break
+          }
+        }
+      })
+    },
+    getTotalData () {
+      console.log('fetchConstructionCount')
+      let year = getYear()
+      fetchConstructionCount(year).then((res) => {
+        console.log('fetchConstructionCount', res.data)
+        this.data.total.value = res.data.total
+      })
+    },
+    getInvData () {
+      console.log('fetchConstructionInvestment')
+      let year = getYear()
+      fetchConstructionInvestment(year).then((res) => {
+        console.log('fetchConstructionInvestment', res.data)
+        this.data.investment.value = (res.data.total / 10000).toFixed(1)
+      })
     },
     // item，传参数
     getItemData (item) {
diff --git a/src/views/cityConstruction/components/construction/components/envDetail.vue b/src/views/cityConstruction/components/construction/components/envDetail.vue
index 21477cb..144e4ef 100644
--- a/src/views/cityConstruction/components/construction/components/envDetail.vue
+++ b/src/views/cityConstruction/components/construction/components/envDetail.vue
@@ -15,6 +15,9 @@
 import ChartLayout from '@/components/layout/chartLayout'
 // import {fetchOccupationByPark} from '@/api/cityManage'
 import ScrollBoard from '@/components/board/ScrollBoard'
+import {fetchConstructionEnvoriment} from '@/api/construction'
+import {getYear} from '@/utils/formatDate'
+
 export default {
   name: 'EnvDetail',
   components: {ScrollBoard, ChartLayout, Corner1, SimplePieChart},
@@ -53,6 +56,15 @@
   },
   methods: {
     getData () {
+      console.log('fetchConstructionEnvoriment')
+      let year = getYear()
+      this.data = []
+      fetchConstructionEnvoriment(year).then(res => {
+        console.log('fetchConstructionEnvoriment', res.data)
+        for (const item of res.data) {
+          this.data.push([item.name, item.pm2, item.noise])
+        }
+      })
       // fetchOccupationByPark().then(response => {
       //   if (response.code === 200) {
       //     const data = response.data