fix avg

src/views/invest/components/chart.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <charts id="chart" height="255px" :option="option"/>
+    <charts id="chart" height="255px" :option="option" />
   </div>
 </template>
 
@@ -25,25 +25,25 @@ export default {
   },
   watch: {
     deptId: {
-      handler (val) {
+      handler(val) {
         this.init()
       },
       immediate: true
     },
     quarter: {
-      handler (val) {
+      handler(val) {
         this.init()
       },
       immediate: true
     },
     year: {
-      handler (val) {
+      handler(val) {
         this.init()
       },
       immediate: true
     }
   },
-  data () {
+  data() {
     return {
       option: {
         title: {
@@ -157,28 +157,33 @@ export default {
       type: 1
     }
   },
-  created () {
-  },
+  created() {},
   methods: {
-    init () {
-      this.$api.invest.count({
-        deptId: this.deptId === null ? '' : this.deptId,
-        year: this.year === null ? '' : this.year,
-        quarter: this.quarter.value === undefined ? '' : this.quarter.value
-      }).then(res => {
-        if (res.code === 200) {
-          this.option.xAxis[0].data = res.data.map(res => res.month)
-          this.option.series[0].data = res.data.map(res => res.sum_complete_amount)
-          this.option.series[1].data = res.data.map(res => res.average)
-          this.avg(this.option.series[0].data[0], this.option.series[1].data[0])
-        }
-      })
+    init() {
+      this.$api.invest
+        .count({
+          deptId: this.deptId === null ? '' : this.deptId,
+          year: this.year === null ? '' : this.year,
+          quarter: this.quarter.value === undefined ? '' : this.quarter.value
+        })
+        .then(res => {
+          if (res.code === 200) {
+            this.option.xAxis[0].data = res.data.map(res => res.month)
+            this.option.series[0].data = res.data.map(
+              res => res.sum_complete_amount
+            )
+            this.option.series[1].data = res.data.map(res => res.average)
+            const size = this.option.series[0].data.length
+            this.avg(
+              this.option.series[0].data[size - 1],
+              this.option.series[1].data[size - 1]
+            )
+          }
+        })
     },
-    avg (lastComplete, lastAvg) {
-      this.$emit('avg', lastComplete < lastAvg)
+    avg(lastComplete, lastAvg) {
+      this.$emit('avg', lastAvg === 0 ? true : lastComplete < lastAvg)
     }
   }
 }
 </script>
-
-<style scoped lang="scss" type="text/scss"></style>

src/views/invest/components/chart2.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <charts id="chart2" height="305px" :option="option"/>
+    <charts id="chart2" height="305px" :option="option" />
   </div>
 </template>
 
@@ -8,7 +8,7 @@
 import charts from '../../../components/echarts/index.vue'
 
 export default {
-  components: {charts},
+  components: { charts },
   props: {
     deptId: {
       type: String,
@@ -58,8 +58,8 @@ export default {
         color: ['#ED7B30', '#64D4F4'],
         xAxis: {
           type: 'category',
-          axisTick: {show: false},
-          splitLine: {show: false},
+          axisTick: { show: false },
+          splitLine: { show: false },
           boundaryGap: true,
           axisLine: {
             show: true,
@@ -72,8 +72,8 @@ export default {
         },
         yAxis: {
           type: 'value',
-          axisTick: {show: true},
-          splitLine: {show: true},
+          axisTick: { show: true },
+          splitLine: { show: true },
           axisLine: {
             show: true,
             lineStyle: {
@@ -82,44 +82,43 @@ export default {
             }
           }
         },
-        series:
-            {
-              name: '项目入库',
-              type: 'bar',
-              data: [],
-              smooth: true,
-              barWidth: '60',
-              itemStyle: {
-                normal: {
-                  color: '#ED7B30',
-                  borderWidth: '20',
-                  label: {
-                    show: true,
-                    color: 'white',
-                    fontSize: 14
-                  }
-                }
+        series: {
+          name: '项目入库',
+          type: 'bar',
+          data: [],
+          smooth: true,
+          barWidth: '60',
+          itemStyle: {
+            normal: {
+              color: '#ED7B30',
+              borderWidth: '20',
+              label: {
+                show: true,
+                color: 'white',
+                fontSize: 14
               }
             }
-
+          }
+        }
       },
       type: 1
     }
   },
-  created() {
-  },
+  created() {},
   methods: {
     init() {
-      this.$api.invest.stroageCount({
-        deptId: this.deptId === null ? '' : this.deptId,
-        year: this.year === null ? '' : this.year,
-        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)
-        }
-      })
+      this.$api.invest
+        .stroageCount({
+          deptId: this.deptId === null ? '' : this.deptId,
+          year: this.year === null ? '' : this.year,
+          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)
+          }
+        })
     }
   }
 }

src/views/invest/components/complete.vue

@@ -1,23 +1,33 @@
 <template>
-  <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="month" class="m-2" placeholder="请选择" ref='month' clearable @change='changeMonth'>
+  <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="month"
+        class="m-2"
+        placeholder="请选择"
+        ref="month"
+        clearable
+        @change="changeMonth"
+      >
         <el-option
-            v-for="item in selectOption"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
+          v-for="item in selectOption"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
         />
       </el-select>
     </div>
     <avue-crud
-        :option="option"
-        :before-open="beforeOpen"
-        v-model="form"
-        :data="data">
-      <template #projectname='{row}'>
-        <div :class='row.yearlyCompleteAmount === "0" ? "red":"" '>{{ row.projectName }}</div>
+      :option="option"
+      :before-open="beforeOpen"
+      v-model="form"
+      :data="data"
+    >
+      <template #projectname="{ row }">
+        <div :class="row.yearlyCompleteAmount === '0' ? 'red' : ''">
+          {{ row.projectName }}
+        </div>
       </template>
     </avue-crud>
   </div>
@@ -42,25 +52,25 @@ export default {
   },
   watch: {
     type: {
-      handler (val) {
+      handler(val) {
         this.initOption(val)
       },
       immediate: false
     },
     deptId: {
-      handler (val) {
+      handler(val) {
         this.onLoad()
       },
       immediate: true
     },
     year: {
-      handler (val) {
+      handler(val) {
         this.onLoad()
       },
       immediate: true
     }
   },
-  data () {
+  data() {
     return {
       month: '',
       quarter: '',
@@ -106,7 +116,7 @@ export default {
     }
   },
   methods: {
-    onLoad () {
+    onLoad() {
       const data = {
         deptId: this.deptId === null ? '' : this.deptId,
         year: this.year === null ? '' : this.year,
@@ -119,7 +129,7 @@ export default {
         }
       })
     },
-    initOption (res) {
+    initOption(res) {
       this.month = ''
       this.selectOption.length = 0
       switch (res.value) {
@@ -162,16 +172,20 @@ export default {
       }
       this.onLoad()
     },
-    changeMonth (res) {
+    changeMonth(res) {
       console.log('changeMonth')
       this.month = res
       this.onLoad()
     },
-    beforeOpen (done, type) {
+    beforeOpen(done, type) {
       if (type === 'view') {
         this.$router.push({
           path: '/home/pro_detail',
-          query: { id: this.form.id, projectStage: this.form.project_stage, editYear: true }
+          query: {
+            id: this.form.id,
+            projectStage: this.form.project_stage,
+            editYear: true
+          }
         })
       }
     }
@@ -179,7 +193,7 @@ export default {
 }
 </script>
 
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .m-2 {
 }
 </style>

src/views/invest/index.vue

@@ -1,55 +1,90 @@
 <template>
-  <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' v-if='user.info.viewStage === 1'>
-        <left @change='changeDept'/>
+  <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"
+        v-if="user.info.viewStage === 1"
+      >
+        <left @change="changeDept" />
       </basic-container>
-      <div class='full-width ml-5' style='flex:4;'>
-        <basic-container class='full-width'>
+      <div class="full-width ml-5" style="flex: 4">
+        <basic-container class="full-width">
           <div class="flex flex-align-start mb-15">
-            <el-select v-model="year" clearable
-                       style="width: 15%"
-                       @change="yearSelect"
+            <el-select
+              v-model="year"
+              clearable
+              style="width: 15%"
+              @change="yearSelect"
             >
               <el-option
-                  v-for="item in years"
-                  :key="item.value"
-                  :label="item.value"
-                  :value="item.value"
+                v-for="item in years"
+                :key="item.value"
+                :label="item.value"
+                :value="item.value"
               />
             </el-select>
           </div>
           <div>
-            <years :dept-id='dept' :year="year" @change='change'/>
+            <years :dept-id="dept" :year="year" @change="change" />
           </div>
         </basic-container>
         <basic-container>
-          <div class='flex '>
-            <div class='flex-child-average full-width flex flex-col flex-justify-start'>
+          <div class="flex">
+            <div
+              class="flex-child-average full-width flex flex-col flex-justify-start"
+            >
               <div class="flex flex-center flex-justify-between">
-                <span class='font-16 bold full-width text-left '>投资数据统计 单位（亿元）</span>
-                <div  class="flex flex-center" :class='isAverage ? "red" :"blue" '>
+                <span class="font-16 bold full-width text-left"
+                  >投资数据统计 单位（亿元）</span
+                >
+                <div
+                  class="flex flex-center"
+                  :class="isAverage ? 'red' : 'blue'"
+                >
                   <el-icon>
-                    <Warning/>
+                    <Warning />
                   </el-icon>
-                  <span class='full-width text-right ml-5 nowrap mr-20' v-if='isAverage'>上月未完成平均投资指标</span>
-                  <span class='full-width text-right  ml-5 nowrap mr-20' v-else>上月已完成平均投资指标</span>
+                  <span
+                    class="full-width text-right ml-5 nowrap mr-20"
+                    v-if="isAverage"
+                    >上月未完成平均投资指标</span
+                  >
+                  <span class="full-width text-right ml-5 nowrap mr-20" v-else
+                    >上月已完成平均投资指标</span
+                  >
                 </div>
               </div>
-              <div class='full-width mt-10' style='background-color: #F7FAFD'>
-                <chart :dept-id='dept' :quarter='yearType.value === 0 ? "":yearType ' :year="year" @avg='avg'/>
+              <div class="full-width mt-10" style="background-color: #f7fafd">
+                <chart
+                  :dept-id="dept"
+                  :quarter="yearType.value === 0 ? '' : yearType"
+                  :year="year"
+                  @avg="avg"
+                />
               </div>
 
-              <span class='font-16 bold full-width text-left mt-20'>项目入库统计  单位（个）</span>
-              <div class='full-width mt-10' style='background-color: #F7FAFD'>
-                <chart2 :dept-id='dept' :quarter='yearType.value === 0 || yearType === "0" ? "":yearType '
-                        :year="year"/>
+              <span class="font-16 bold full-width text-left mt-20"
+                >项目入库统计 单位（个）</span
+              >
+              <div class="full-width mt-10" style="background-color: #f7fafd">
+                <chart2
+                  :dept-id="dept"
+                  :quarter="
+                    yearType.value === 0 || yearType === '0' ? '' : yearType
+                  "
+                  :year="year"
+                />
               </div>
             </div>
-            <div class='white-bg padding'></div>
-            <div class='flex-child-average'>
-              <amount v-if='dept===null && user.info.viewStage === 1' :type='yearType' :deptId='dept' :year="year"/>
-              <complete v-else :type='yearType' :deptId='dept' :year="year"/>
+            <div class="white-bg padding"></div>
+            <div class="flex-child-average">
+              <amount
+                v-if="dept === null && user.info.viewStage === 1"
+                :type="yearType"
+                :deptId="dept"
+                :year="year"
+              />
+              <complete v-else :type="yearType" :deptId="dept" :year="year" />
             </div>
           </div>
         </basic-container>
@@ -78,11 +113,11 @@ import { useStore } from '@/store/user.js'
 export default {
   name: 'index',
   components: { BasicContainer, left, years, amount, chart, chart2, complete },
-  setup () {
+  setup() {
     const user = useStore()
     return { user }
   },
-  data () {
+  data() {
     return {
       yearType: {
         value: 0
@@ -115,32 +150,32 @@ export default {
       isAverage: true
     }
   },
-  created () {
+  created() {
     this.year = new Date().getFullYear()
     this.isBelowAverage()
   },
   methods: {
-    changeDept (res) {
+    changeDept(res) {
       if (res === null) {
         this.dept = null
         return
       }
       this.dept = res.id
     },
-    change (index) {
+    change(index) {
       this.yearType = index
     },
-    yearSelect (res) {
+    yearSelect(res) {
       this.year = res
     },
-    isBelowAverage () {
+    isBelowAverage() {
       this.$api.invest.belowAverage().then(res => {
         if (res.code === 200) {
           // this.isAverage = res.data
         }
       })
     },
-    avg (res) {
+    avg(res) {
       console.log(res)
       this.isAverage = res
     }
@@ -148,6 +183,4 @@ export default {
 }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>