Merge remote-tracking branch 'origin/develop' into develop

src/api/common.js

@@ -1,19 +1,19 @@
 import fetch from '../api/fetch.js'
 
 export default {
-    dicList(params) {
-        return fetch('/blade-system/dict-biz/dictionary', params)
-    },
-    submit(params) { // 保存上传文件素材
-        return fetch('/wutong-library/library/save', params, 'post', 'json')
-    },
-    basicFormRequest(url) {
-        return fetch(url)
-    },
-    region(params) {
-        return fetch('/blade-system/region/lazy-tree', params)
-    },
-    deptList() {
-        return fetch('/blade-project-manage-v2/other/v2/deptList')
-    }
+  dicList (params) {
+    return fetch('/blade-system/dict-biz/dictionary', params)
+  },
+  submit (params) { // 保存上传文件素材
+    return fetch('/wutong-library/library/save', params, 'post', 'json')
+  },
+  basicFormRequest (url) {
+    return fetch(url)
+  },
+  region (params) {
+    return fetch('/blade-system/region/lazy-tree', params)
+  },
+  deptList (params) {
+    return fetch('/blade-project-manage-v2/other/v2/deptList', params)
+  }
 }

src/api/index.js

@@ -8,6 +8,7 @@ import task from './task/index.js'
 import company from './company/index.js'
 import inspect from './inspect/index.js'
 import params from './params/index.js'
+import invest from './invest/index'
 
 export default {
   offices: ['pdf', 'doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx'],
@@ -21,5 +22,6 @@ export default {
   task,
   company,
   inspect,
-  params
+  params,
+  invest
 }

src/api/invest/index.js

@@ -0,0 +1,30 @@
+import fetch from '../fetch.js'
+
+export default {
+  /**
+     * 首页各部门-乡镇投资完成情况总览
+     * @param params
+     * @returns {Promise | Promise<unknown>}
+     */
+  list (params) {
+    return fetch('/blade-project-manage-v2/project/v2/homeCountChildren', {
+      ...params
+    }, 'post')
+  },
+  /**
+   * 首页投资数据统计
+   * @param params
+   * @returns {Promise | Promise<unknown>}
+   */
+  count (params) {
+    return fetch('/blade-project-manage-v2/project/v2/homeMonthCount', params, 'post')
+  },
+  /**
+   * 项目入库统计
+   * @param params
+   * @returns {Promise | Promise<unknown>}
+   */
+  stroageCount (params) {
+    return fetch('/blade-project-manage-v2/project/v2/homeStorageCount', params, 'post')
+  }
+}

src/views/invest/components/amount.vue

@@ -2,7 +2,7 @@
   <div class='flex flex-justify-start flex-col'>
     <span class='font-16 bold full-width text-left'>各部分/乡镇投资完成情况总览</span>
     <div class='full-width flex-justify-end  flex'>
-      <el-select v-model="value" class="m-2" placeholder="请选择">
+      <el-select v-model="month" class="m-2" placeholder="请选择" ref='month' clearable @change='changeMonth'>
         <el-option
             v-for="item in selectOption"
             :key="item.value"
@@ -15,8 +15,7 @@
         :option="option"
         :data="data"
         ref="crud"
-        v-model="form"
-        @on-load="onLoad">
+        v-model="form">
     </avue-crud>
   </div>
 </template>
@@ -28,6 +27,10 @@ export default {
     type: {
       type: Number,
       default: 0
+    },
+    deptId: {
+      type: String,
+      default: ''
     }
   },
   watch: {
@@ -36,10 +39,18 @@ export default {
         this.initOption(val)
       },
       immediate: true
+    },
+    deptId: {
+      handler (val) {
+        this.onLoad()
+      },
+      immediate: true
     }
   },
   data () {
     return {
+      month: '',
+      quarter: '',
       form: {},
       data: [],
       option: {
@@ -56,23 +67,23 @@ export default {
         column: [
           {
             label: '部门/乡镇',
-            prop: 'noticeType'
+            prop: 'deptName'
           },
           {
             label: '责任目标',
-            prop: 'noticeType'
+            prop: 'planCompleteAmount'
           },
           {
             label: '完成投资（万元）',
-            prop: 'noticeType'
+            prop: 'totalCompleteAmount'
           },
           {
             label: '完成率',
-            prop: 'noticeType'
+            prop: 'completionRate'
           },
           {
             label: '计划入库',
-            prop: 'noticeType'
+            prop: 'storageNum'
           }
         ]
       },
@@ -81,9 +92,18 @@ export default {
   },
   methods: {
     onLoad () {
-      this.loading = true
+      this.$api.invest.list({
+        deptId: this.deptId === null ? '' : this.deptId,
+        month: this.month,
+        quarter: this.quarter
+      }).then(res => {
+        if (res.code === 200) {
+          this.data = res.data
+        }
+      })
     },
     initOption (res) {
+      this.month = ''
       this.selectOption.length = 0
       switch (res.value) {
         case 1:
@@ -91,32 +111,43 @@ export default {
             const item = { label: i + '月', value: i }
             this.selectOption.push(item)
           }
+          this.quarter = 1
           break
         case 2:
           for (let i = 4; i <= 6; i++) {
             const item = { label: i + '月', value: i }
             this.selectOption.push(item)
           }
+          this.quarter = 2
           break
         case 3:
           for (let i = 7; i <= 9; i++) {
             const item = { label: i + '月', value: i }
             this.selectOption.push(item)
           }
+          this.quarter = 3
           break
         case 4:
           for (let i = 10; i <= 12; i++) {
             const item = { label: i + '月', value: i }
             this.selectOption.push(item)
           }
+          this.quarter = 4
           break
         default:
           for (let i = 1; i <= 12; i++) {
             const item = { label: i + '月', value: i }
             this.selectOption.push(item)
+            this.month = 1
+            this.quarter = ''
           }
           break
       }
+      this.onLoad()
+    },
+    changeMonth (res) {
+      this.month = res
+      this.onLoad()
     }
   }
 }

src/views/invest/components/chart.vue

@@ -9,100 +9,111 @@ import charts from '../../../components/echarts/index.vue'
 
 export default {
   components: { charts },
+  props: {
+    deptId: {
+      type: String,
+      default: ''
+    },
+    quarter: {
+      type: Object,
+      default: null
+    }
+  },
+  watch: {
+    deptId: {
+      handler (val) {
+        this.init()
+      },
+      immediate: true
+    },
+    quarter: {
+      handler (val) {
+        this.init()
+      },
+      immediate: true
+    }
+  },
   data () {
     return {
       option: {
         title: {
-          text: '单位（个）',
-          x: 'right',
-          y: 'top',
+          text: '单位：(万元)',
           textStyle: {
             color: 'white',
             fontSize: '12'
-          }
-        },
-        color: ['#ED7B30', '#64D4F4'],
-        legend: {
-          textStyle: {
-            color: 'white'
           },
-          data: ['项目入库', '项目开工']
-        },
-        toolbox: {
-          show: true
+          x: 'right',
+          y: 'top'
         },
-        xAxis: {
-          type: 'category',
-          axisTick: { show: false },
-          splitLine: { show: false },
-          boundaryGap: true,
-          axisLine: {
-            show: true,
-            lineStyle: {
-              color: '#B0F0EE',
-              width: '2'
+        xAxis: [
+          {
+            type: 'category',
+            axisTick: { show: false },
+            splitLine: { show: false },
+            data: ['2', '3'],
+            axisPointer: {
+              type: 'shadow'
+            },
+            axisLine: {
+              show: true,
+              lineStyle: {
+                color: '#B2BFCB',
+                width: '2'
+              }
+            }
+          }
+        ],
+        yAxis: [
+          {
+            type: 'value',
+            axisTick: { show: true },
+            splitLine: { show: false },
+            axisLine: {
+              show: true,
+              lineStyle: {
+                color: '#B2BFCB',
+                width: '2'
+              }
             }
           },
-          data: []
-        },
-        yAxis: {
-          type: 'value',
-          axisTick: { show: false },
-          splitLine: { show: false },
-          axisLine: {
-            show: true,
-            lineStyle: {
-              color: '#B0F0EE',
-              width: '2'
+          {
+            type: 'value',
+            name: '',
+            axisTick: { show: false },
+            splitLine: { show: false },
+            min: 0,
+            max: 25,
+            interval: 5,
+            axisLabel: {
+              formatter: ''
             }
           }
-        },
+        ],
         series: [
           {
-            name: '项目入库',
+            name: '计划完成总投资',
             type: 'line',
-            data: [9, 15, 14, 12, 11, 12],
-            smooth: true,
-            itemStyle: {
-              normal: {
-                color: '#ED7B30',
-                label: {
-                  show: true,
-                  color: '#ED7B30',
-                  fontSize: 14
-                }
+            barWidth: '45',
+            tooltip: {
+              valueFormatter: function (value) {
+                return value + ' ml'
               }
             },
-            markPoint: {
-              data: [
-                { type: 'max', name: 'Max' },
-                { type: 'min', name: 'Min' }
-              ]
-            }
-          },
-          {
-            name: '项目开工',
-            type: 'line',
-            data: [6, 12, 12, 15, 13, 12],
             itemStyle: {
-              color: '#5EC7D5',
-              borderColor: '#5EC7D5',
               normal: {
-                color: '#5EC7D5',
                 label: {
                   show: true,
-                  color: '#5EC7D5',
-                  fontSize: 14
+                  color: 'red',
+                  fontSize: 12
                 }
               }
             },
-            smooth: true,
-            markPoint: {
-              data: [
-                { type: 'max', name: 'Max' },
-                { type: 'min', name: 'Min' }
-              ]
-            }
+            label: {
+              show: true,
+              position: 'top'
+            },
+            lineStyle: { color: '#528BEC', type: 'solid', borderColor: 'red' },
+            data: []
           }
         ]
       },
@@ -112,7 +123,17 @@ export default {
   created () {
   },
   methods: {
-
+    init () {
+      this.$api.invest.count({
+        deptId: this.deptId === null ? '' : this.deptId,
+        quarter: this.quarter.value === undefined ? '' : this.quarter.value
+      }).then(res => {
+        if (res.code === 200) {
+          this.option.xAxis[0].data = res.data.list.map(res => res.month)
+          this.option.series[0].data = res.data.list.map(res => res.sum_complete_amount)
+        }
+      })
+    }
   }
 }
 </script>

src/views/invest/components/chart2.vue

@@ -9,6 +9,30 @@ import charts from '../../../components/echarts/index.vue'
 
 export default {
   components: { charts },
+  props: {
+    deptId: {
+      type: String,
+      default: ''
+    },
+    quarter: {
+      type: Object,
+      default: null
+    }
+  },
+  watch: {
+    deptId: {
+      handler (val) {
+        this.init()
+      },
+      immediate: true
+    },
+    quarter: {
+      handler (val) {
+        this.init()
+      },
+      immediate: true
+    }
+  },
   data () {
     return {
       option: {
@@ -22,15 +46,6 @@ export default {
           }
         },
         color: ['#ED7B30', '#64D4F4'],
-        legend: {
-          textStyle: {
-            color: 'white'
-          },
-          data: ['项目入库', '项目开工']
-        },
-        toolbox: {
-          show: true
-        },
         xAxis: {
           type: 'category',
           axisTick: { show: false },
@@ -39,7 +54,7 @@ export default {
           axisLine: {
             show: true,
             lineStyle: {
-              color: '#B0F0EE',
+              color: '#B2BFCB',
               width: '2'
             }
           },
@@ -47,64 +62,37 @@ export default {
         },
         yAxis: {
           type: 'value',
-          axisTick: { show: false },
-          splitLine: { show: false },
+          axisTick: { show: true },
+          splitLine: { show: true },
           axisLine: {
             show: true,
             lineStyle: {
-              color: '#B0F0EE',
+              color: '#B2BFCB',
               width: '2'
             }
           }
         },
-        series: [
-          {
-            name: '项目入库',
-            type: 'line',
-            data: [9, 15, 14, 12, 11, 12],
-            smooth: true,
-            itemStyle: {
-              normal: {
-                color: '#ED7B30',
-                label: {
-                  show: true,
+        series:
+            {
+              name: '项目入库',
+              type: 'bar',
+              data: [],
+              smooth: true,
+              barWidth: '60',
+              itemStyle: {
+                normal: {
                   color: '#ED7B30',
-                  fontSize: 14
-                }
-              }
-            },
-            markPoint: {
-              data: [
-                { type: 'max', name: 'Max' },
-                { type: 'min', name: 'Min' }
-              ]
-            }
-          },
-          {
-            name: '项目开工',
-            type: 'line',
-            data: [6, 12, 12, 15, 13, 12],
-            itemStyle: {
-              color: '#5EC7D5',
-              borderColor: '#5EC7D5',
-              normal: {
-                color: '#5EC7D5',
-                label: {
-                  show: true,
-                  color: '#5EC7D5',
-                  fontSize: 14
+                  borderWidth: '20',
+                  barBorderRadius: [30, 30, 0, 0],
+                  label: {
+                    show: true,
+                    color: 'white',
+                    fontSize: 14
+                  }
                 }
               }
-            },
-            smooth: true,
-            markPoint: {
-              data: [
-                { type: 'max', name: 'Max' },
-                { type: 'min', name: 'Min' }
-              ]
             }
-          }
-        ]
+
       },
       type: 1
     }
@@ -112,7 +100,17 @@ export default {
   created () {
   },
   methods: {
-
+    init () {
+      this.$api.invest.stroageCount({
+        deptId: this.deptId === null ? '' : this.deptId,
+        quarter: this.quarter.value === undefined ? '' : this.quarter.value
+      }).then(res => {
+        if (res.code === 200) {
+          this.option.xAxis.data = res.data.map(res => res.time)
+          this.option.series.data = res.data.map(res => res.sum_storage)
+        }
+      })
+    }
   }
 }
 </script>

src/views/invest/components/left.vue

@@ -1,21 +1,79 @@
 <template>
   <div>
     <div class="flex flex-col flex-center">
-      <span class="font-15 grey-6 bold">年度资金管理</span>
-      <base-button class="mt-20" title="全县投资情况" icon=""/>
+      <span class="font-16 grey-6 bold">年度资金管理</span>
+      <base-button class="mt-20" title="全县投资情况" icon="" :type='active === -1 ? "1" :"2" '  @click='viewAll'/>
+      <div class='full-width flex flex-center mt-20'>
+        <el-tabs v-model="activeName" class="font-16" @tab-change="getOrg">
+          <el-tab-pane label="住建局" name="1"/>
+          <el-tab-pane label="乡镇" name="2"/>
+        </el-tabs>
+      </div>
+      <div style='height: 1030px;overflow-y: scroll' class='hide-scrollbar'>
+        <div v-for='(i,index) in deptList' class='item white bold font-16' :key='i.id'
+             :class='active === index ? "item-select white" : "" ' @click='change(index)'>
+          {{ i.deptName }}
+        </div>
+      </div>
     </div>
   </div>
 </template>
 
 <script>
-import baseButton from "@/components/base-button.vue";
+import baseButton from '@/components/base-button.vue'
 
 export default {
   name: 'left',
-  components: {baseButton}
+  components: { baseButton },
+  data () {
+    return {
+      activeName: '1',
+      deptList: [],
+      active: -1
+    }
+  },
+  created () {
+    this.getOrg()
+  },
+  methods: {
+    getOrg () {
+      this.$api.common.deptList({ type: this.activeName }).then(res => {
+        if (res.code === 200) {
+          this.deptList = res.data.map(e => {
+            e.checked = false
+            return e
+          })
+        } else {
+          this.$message.error(res.msg)
+        }
+      })
+    },
+
+    change (index) {
+      this.active = index
+      this.$emit('change', this.deptList[index])
+    },
+    viewAll () {
+      this.active = -1
+      this.$emit('change', null)
+    }
+  }
 }
 </script>
 
-<style scoped>
+<style lang='scss' scoped>
+.item {
+  padding: 10px 20px;
+  margin-bottom: 10px;
+  color: #ABADAA;
+  border-bottom: #ABADAA solid 0.5px;
+}
 
+.item-select {
+  background-color: #4390F9;
+  border-radius: 10px;
+  padding: 10px 20px;
+  margin-bottom: 10px;
+  color: white;
+}
 </style>

src/views/invest/index.vue

@@ -2,7 +2,7 @@
   <div class='flex flex-center full-width'>
     <div class='ml-10 mr-10 mt-10 flex flex-align-start full-width'>
       <basic-container style='flex: 1;padding: 0'>
-        <left/>
+        <left @change='changeDept'/>
       </basic-container>
       <div class='full-width ml-5' style='flex:4;'>
         <basic-container class='full-width'>
@@ -15,17 +15,17 @@
             <div class='flex-child-average full-width flex flex-col flex-justify-start'>
               <span class='font-16 bold full-width text-left '>投资数据统计</span>
               <div class='full-width mt-10' style='background-color: #F7FAFD'>
-                <chart />
+                <chart :dept-id='dept' :quarter='yearType.value === 0 ? "":yearType '/>
               </div>
 
               <span class='font-16 bold full-width text-left mt-20'>项目入库统计</span>
               <div class='full-width mt-10' style='background-color: #F7FAFD'>
-                <chart2 />
+                <chart2 :dept-id='dept' :quarter='yearType.value === 0 || yearType === "0" ? "":yearType '/>
               </div>
             </div>
             <div class='white-bg padding'></div>
             <div class='flex-child-average'>
-              <amount :type='yearType'/>
+              <amount :type='yearType' :deptId='dept'/>
             </div>
           </div>
         </basic-container>
@@ -47,13 +47,23 @@ export default {
   components: { BasicContainer, left, years, amount, chart, chart2 },
   data () {
     return {
-      yearType: 0
+      yearType: {
+        value: 0
+      },
+      dept: null
     }
   },
   methods: {
+    changeDept (res) {
+      if (res === null) {
+        this.dept = ''
+        return
+      }
+      this.dept = res.id
+    },
     change (index) {
-      console.log(index)
       this.yearType = index
+      console.log(this.yearType)
     }
   }
 }