年度投资管理

src/api/invest/index.js

@@ -1,57 +1,77 @@
 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')
-    },
-    /**
-     * 首页年度投资比例
-     * @param params
-     * @returns {Promise | Promise<unknown>}
-     */
-    homeInvest(params) {
-        return fetch('/blade-project-manage-v2/project/v2/homeCountInvestment', params, 'post')
-    },
-    /**
-     * 保存责任目标
-     * @returns {Promise | Promise<unknown>}
-     */
-    savePlan(params) {
-        return fetch('/blade-project-manage-v2/depttarget/updateTarget', params, 'post', 'json')
-    },
-    /**
-     * 投资是否低于平均值
-     */
-    belowAverage(params) {
-        return fetch(
-            '/blade-project-manage-v2/project/v2/isBelowAvg',
-            params,
-            'post',
-            'json'
-        )
-    },
-
+  /**
+   * 首页各部门-乡镇投资完成情况总览
+   * @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'
+    )
+  },
+  /**
+   * 首页年度投资比例
+   * @param params
+   * @returns {Promise | Promise<unknown>}
+   */
+  homeInvest(params) {
+    return fetch(
+      '/blade-project-manage-v2/project/v2/homeCountInvestment',
+      params,
+      'post'
+    )
+  },
+  /**
+   * 保存责任目标
+   * @returns {Promise | Promise<unknown>}
+   */
+  savePlan(params) {
+    return fetch(
+      '/blade-project-manage-v2/depttarget/updateTarget',
+      params,
+      'post',
+      'json'
+    )
+  },
+  /**
+   * 投资是否低于平均值
+   */
+  belowAverage(params) {
+    return fetch(
+      '/blade-project-manage-v2/project/v2/isBelowAvg',
+      params,
+      'post',
+      'json'
+    )
+  }
 }

src/views/invest/components/complete.vue

@@ -55,7 +55,7 @@ export default {
       handler(val) {
         this.initOption(val)
       },
-      immediate: false
+      immediate: true
     },
     deptId: {
       handler(val) {

src/views/invest/components/years.vue

@@ -1,35 +1,63 @@
 <template>
-  <div class='flex flex-center flex-col'>
-    <div class='full-width'>
-      <basic-tab :tabs='tabs' :full='true' @change='change' style='width:99%'/>
+  <div class="flex flex-center flex-col">
+    <div class="full-width">
+      <basic-tab
+        :tabs="tabs"
+        :full="true"
+        @change="change"
+        style="width: 99%"
+      />
     </div>
-    <div class='flex flex-center full-width mt-10'>
-      <div v-for='i in dash' class='flex-child-average' :key='i'>
-        <div class='box' :style='`box-shadow: `+ i.box'>
+    <div class="flex flex-center full-width mt-10">
+      <div v-for="i in dash" class="flex-child-average" :key="i">
+        <div class="box" :style="`box-shadow: ` + i.box">
           <div class="flex flex-col bold font-16 padding-14">
-            <div class='flex flex-justify-start flex-align-end'>
-              <img :src='i.icon'/>
+            <div class="flex flex-justify-start flex-align-end">
+              <img :src="i.icon" />
               <span class="grey-6 ml-5">{{ i.name }}</span>
-              <span v-if='i.index !== 2' class='font-12 grey-6 ml-10'>万元</span>
+              <span v-if="i.index !== 2" class="font-12 grey-6 ml-10"
+                >万元</span
+              >
             </div>
-            <div v-if="i.index !== 2" class='flex flex-align-end flex-justify-start mt-10'>
+            <div
+              v-if="i.index !== 2"
+              class="flex flex-align-end flex-justify-start mt-10"
+            >
               <span class="grey" style="margin-left: 3px">￥</span>
-              <span class="ml-5 font-24 "
-                    :style='`color:` + i.color'>{{ info[i.prop] ? info[i.prop].toLocaleString() : '0' }}</span>
-              <el-icon :size="15" v-if='i.index === 0 && user.info.viewStage === 1' class='ml-10 pointer'
-                       @click='edit(i)'>
-                <Edit/>
+              <span class="ml-5 font-24" :style="`color:` + i.color">{{
+                info[i.prop] ? info[i.prop].toLocaleString() : '0'
+              }}</span>
+              <el-icon
+                :size="15"
+                v-if="i.index === 0 && user.info.viewStage === 1"
+                class="ml-10 pointer"
+                @click="edit(i)"
+              >
+                <Edit />
               </el-icon>
             </div>
-            <div v-else class='flex flex-justify-start flex-center mt-10'>
+            <div v-else class="flex flex-justify-start flex-center mt-10">
               <div class="progress-bar mt-10">
-                <div class="bar full-height" :style="`width: `+ info[i.prop]"></div>
+                <div
+                  v-if="info[i.prop]"
+                  class="bar full-height"
+                  :style="
+                    `width: ` +
+                    Number.parseFloat(
+                      info[i.prop].replace('%', '') > 100
+                        ? '100%'
+                        : info[i.prop]
+                    )
+                  "
+                ></div>
               </div>
-              <span class="ml-10 font-24 mt-10" :style='`color:` + i.color'>{{ info[i.prop] }}</span>
+              <span class="ml-10 font-24 mt-10" :style="`color:` + i.color">{{
+                info[i.prop]
+              }}</span>
             </div>
           </div>
-          <div style='margin-top: -20px'>
-            <wave :color='i.color'/>
+          <div style="margin-top: -20px">
+            <wave :color="i.color" />
           </div>
         </div>
       </div>
@@ -40,8 +68,8 @@
 <script>
 import basicTab from '@/components/basic-tab/index.vue'
 import wave from '@/views/invest/components/wave.vue'
-import {useStore} from '@/store/user.js'
-import {ElMessageBox} from 'element-plus'
+import { useStore } from '@/store/user.js'
+import { ElMessageBox } from 'element-plus'
 import index from '@/views/task/Index.vue'
 
 export default {
@@ -51,10 +79,10 @@ export default {
       return index
     }
   },
-  components: {basicTab, wave},
+  components: { basicTab, wave },
   setup() {
     const user = useStore()
-    return {user}
+    return { user }
   },
   props: {
     deptId: {
@@ -85,26 +113,31 @@ export default {
       times: [],
       info: {},
       tabs: [
-        {name: '总览', value: 0},
-        {name: '一季度', value: 1},
-        {name: '二季度', value: 2},
-        {name: '三季度', value: 3},
-        {name: '四季度', value: 4}
+        { name: '总览', value: 0 },
+        { name: '一季度', value: 1 },
+        { name: '二季度', value: 2 },
+        { name: '三季度', value: 3 },
+        { name: '四季度', value: 4 }
       ],
       quarter: '',
       dash: [
         {
-          icon: new URL('../../../assets/svg/invest/1.svg', import.meta.url).href,
+          icon: new URL('../../../assets/svg/invest/1.svg', import.meta.url)
+            .href,
           name: '责任目标',
           value: 0,
           prop: 'plan_complete_amount',
           box: '0 1px 10px 0 rgba(105, 204, 243, 0.3)',
           color: '#32B5F3',
           index: 0,
-          background: new URL('../../../assets/svg/invest/bg1.svg', import.meta.url).href
+          background: new URL(
+            '../../../assets/svg/invest/bg1.svg',
+            import.meta.url
+          ).href
         },
         {
-          icon: new URL('../../../assets/svg/invest/2.svg', import.meta.url).href,
+          icon: new URL('../../../assets/svg/invest/2.svg', import.meta.url)
+            .href,
           name: '累计完成投资',
           value: 0,
           prop: 'total_complete_amount',
@@ -113,7 +146,8 @@ export default {
           index: 1
         },
         {
-          icon: new URL('../../../assets/svg/invest/3.svg', import.meta.url).href,
+          icon: new URL('../../../assets/svg/invest/3.svg', import.meta.url)
+            .href,
           name: '投资完成比例',
           value: 0,
           prop: 'rate',
@@ -122,7 +156,8 @@ export default {
           index: 2
         },
         {
-          icon: new URL('../../../assets/svg/invest/4.svg', import.meta.url).href,
+          icon: new URL('../../../assets/svg/invest/4.svg', import.meta.url)
+            .href,
           name: '计划纳统投资',
           value: 0,
           prop: 'total_investment_amount',
@@ -139,15 +174,17 @@ export default {
   methods: {
     load() {
       this.tabs[0].name = this.year + '年总览'
-      this.$api.invest.homeInvest({
-        deptId: this.deptId === null ? '' : this.deptId,
-        year: this.year === null ? '' : this.year,
-        quarter: this.quarter
-      }).then(res => {
-        if (res.code === 200) {
-          this.info = res.data
-        }
-      })
+      this.$api.invest
+        .homeInvest({
+          deptId: this.deptId === null ? '' : this.deptId,
+          year: this.year === null ? '' : this.year,
+          quarter: this.quarter
+        })
+        .then(res => {
+          if (res.code === 200) {
+            this.info = res.data
+          }
+        })
     },
     init() {
       const year = new Date().getFullYear()
@@ -159,53 +196,64 @@ export default {
       this.load()
     },
     edit(item) {
-      ElMessageBox.prompt('当前责任目标为' + this.info[item.prop].toLocaleString() + '万元，请输入新的责任目标(数字，小数点)', '提示', {
-        confirmButtonText: '保存',
-        cancelButtonText: '取消',
-        inputPattern:
-            /^([1-9]\d*|0)(\.\d+)?$/,
-        inputErrorMessage: '信息错误'
-      })
-          .then(({value}) => {
-            let data = {}
-            switch (this.quarter) {
-              case 0: // 年度
-                data = {number: value}
-                break
-              case 1: // 1季度
-                data = {number: value, type: 1}
-                break
-              case 2: // 2季度
-                data = {number: value, type: 2}
-                break
-              case 3: // 3季度
-                data = {number: value, type: 3}
-                break
-              case 4: // 4季度
-                data = {number: value, type: 4}
-                break
-              default:
-                data = {number: value}
-                break
+      ElMessageBox.prompt(
+        '当前责任目标为' +
+          this.info[item.prop].toLocaleString() +
+          '万元，请输入新的责任目标(数字，小数点)',
+        '提示',
+        {
+          confirmButtonText: '保存',
+          cancelButtonText: '取消',
+          inputPattern: /^([1-9]\d*|0)(\.\d+)?$/,
+          inputErrorMessage: '信息错误'
+        }
+      ).then(({ value }) => {
+        let data = {}
+        switch (this.quarter) {
+          case 0: // 年度
+            data = { number: value }
+            break
+          case 1: // 1季度
+            data = { number: value, type: 1 }
+            break
+          case 2: // 2季度
+            data = { number: value, type: 2 }
+            break
+          case 3: // 3季度
+            data = { number: value, type: 3 }
+            break
+          case 4: // 4季度
+            data = { number: value, type: 4 }
+            break
+          default:
+            data = { number: value }
+            break
+        }
+        this.$api.invest
+          .savePlan(
+            Object.assign(
+              {
+                deptId: this.deptId === null ? '' : this.deptId,
+                year: this.year === null ? '' : this.year
+              },
+              data
+            )
+          )
+          .then(res => {
+            if (res.code === 200) {
+              this.$message.success(res.msg)
+              this.info[item.prop] = value
+            } else {
+              this.$message.error(res.msg)
             }
-            this.$api.invest.savePlan(Object.assign({
-              deptId: this.deptId === null ? '' : this.deptId,
-              year: this.year === null ? '' : this.year
-            }, data)).then(res => {
-              if (res.code === 200) {
-                this.$message.success(res.msg)
-                this.info[item.prop] = value
-              } else {
-                this.$message.error(res.msg)
-              }
-            })
           })
+      })
     }
   }
 }
 </script>
 
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .content {
   background-image: url('./src/assets/svg/invest/wave/1.svg');
   background-size: 100% 100%;
@@ -216,21 +264,20 @@ export default {
   border-radius: 8px;
   min-height: 115px;
   margin: 20px;
-  background-color: #F6F9FD;
+  background-color: #f6f9fd;
 }
 
 .progress-bar {
-  width: 140px;
+  width: 240px;
   height: 10px;
   background: white;
   border-radius: 10px;
   margin-left: 5px;
-  border: 1px solid #F8B65F
+  border: 1px solid #f8b65f;
 }
 
 .bar {
-  background: #F8B65F;
-  border-radius: 10px
+  background: #f8b65f;
+  border-radius: 10px;
 }
-
 </style>

src/views/invest/index.vue

@@ -78,7 +78,7 @@
             <div class="white-bg padding"></div>
             <div class="flex-child-average">
               <amount
-                v-if="dept === null && hasChildrenDept"
+                v-if="user.info.viewStage === 1"
                 :type="yearType"
                 :deptId="dept"
                 :year="year"
@@ -162,9 +162,7 @@ export default {
         .then(res => {
           if (res.code === 200) {
             this.hasChildrenDept = res.data.hasChildren
-            console.log(res.data)
-          } else {
-            console.log(res.msg)
+            this.dept = res.data.id
           }
         })
     },