预算和指标填报

2026-04-10 08:41:39 +08:00
parent 0c8bd440ae
commit bdd73b8868
18 changed files with 162 additions and 39 deletions
--- a/src/views/home/components/budgetCalendar.vue
+++ b/src/views/home/components/budgetCalendar.vue
@@ -1,14 +1,13 @@
 <template>
  <div style="flex: 1">
-    <Container name="预算填报日历" icon="cockpitItemIcon" size="calendarBg" topSize="calendarTitleBg">
+    <Container name="填报总览" icon="cockpitItemIcon" size="calendarBg" topSize="calendarTitleBg">
      <!-- 1. 移除 .kpi-content 的固定高度，改为自适应 -->
      <div class="kpi-content" style="padding: 14px 14px; display: flex;flex-direction: column; width: 100%;">
        <!-- 2. .top 保持 flex，无需固定高度，自动跟随子元素拉伸 -->
        <div class="bottom"
-          style="display: flex; width: 100%;margin-top: 8px;background-color: rgba(249, 252, 255, 1);height: 844px;padding: 26px 16px;">
+          style="width: 100%;margin-top: 8px;background-color: rgba(249, 252, 255, 1);height: 844px;padding: 26px 0px;">
          <!-- 动态生成12个月的容器：优化flex布局，缩小行间距 -->
-          <div class="month-list"
-            style="display: flex; gap: 16px; flex-wrap: wrap; align-content: flex-start; row-gap: 8px;">
+          <div class="month-list">
            <!-- 循环生成12个月：通过判断当前月份索引，添加current类 -->
            <div class="monthItem" :class="{
              'has-data': calendar.haveData,
@@ -91,19 +90,19 @@ export default {

 // 基础月份样式
 .monthItem {
-  width: 164px;
-  height: 42px;
+  width: 100px;
+  height: 57px;
  border-radius: 4px;
  font-family: PingFangSC, PingFang SC;
  font-weight: 400;
  font-size: 20px;
  color: rgba(0, 0, 0, 0.85);
-  line-height: 42px;
+  line-height: 57px;
  text-align: center;
  font-style: normal;
  transition: all 0.2s ease; // 过渡效果，样式切换更平滑
  border: 2px solid transparent; // 透明边框，避免选中时布局偏移
-  margin: 0; // 清除默认外边距，进一步缩小缝隙
+  margin: 0 auto 10px; // 清除默认外边距，进一步缩小缝隙
 }

 // 有数据的样式（背景色#D1E8FF）
--- a/src/views/home/components/budgetDetails.vue
+++ b/src/views/home/components/budgetDetails.vue
@@ -22,7 +22,9 @@
            </el-form-item>
            <el-form-item>
              <el-button style="background-color: #0B58FF;" type="primary" @click="onSubmit">查询</el-button>
+              <el-button type="primary" plain size="medium" @click='downLoadExcel'>模板下载</el-button>
              <el-button type="primary" plain size="medium" @click='importExcel'>导入</el-button>
+              <el-button type="primary" plain size="medium" @click='exportExcel'>导出</el-button>
            </el-form-item>
          </el-form>
        </div>
@@ -99,7 +101,7 @@

 <script>
 import Container from './container.vue'
-import { getLevelStruc, getTargetMonthPage, updateTargetMonthData, getTargetYearPage, updateTargetYearData,copyLastMonthData, copyLastYearData} from '@/api/cockpit'
+import { getLevelStruc, getTargetMonthPage, updateTargetMonthData, getTargetYearPage, updateTargetYearData,copyLastMonthData, copyLastYearData,importTemplateYS} from '@/api/cockpit'
 import inputArea from './inputArea.vue' // 导入输入组件
 import { publicFormatter } from '@/utils/dict';
 import {getAccessToken, getTenantId} from '@/utils/auth'
@@ -460,6 +462,41 @@ export default {
    importExcel() {
      this.upload.open = true
    },
+    downLoadExcel() {
+      importTemplateYS({
+        levelId:this.form.levelId,
+        startTime: this.form.startTime,
+        endTime: this.form.endTime,
+        pageSize: 1000,
+        template:1,
+        pageNo: this.form.pageNo,
+        timeDim:this.form.timeDim
+      }).then(response => {
+        let fileName = '';
+        if (this.timeType === 'month') {
+          fileName = '月度预算导入模板.xls';
+        }else{
+          fileName = '年度预算导入模板.xls';
+        }
+        this.$download.excel(response, fileName);
+      });
+    },
+    exportExcel() {
+      importTemplateYS({
+        levelId:this.form.levelId,
+        startTime: this.form.startTime,
+        endTime: this.form.endTime,
+        pageSize: 1000,
+        template:0,
+        pageNo: this.form.pageNo,
+        timeDim:this.form.timeDim
+      }).then(response => {
+        let mon = this.timeType=== 'month'?moment(this.form.endTime).format('YYYYMM'):moment(this.form.endTime).format('YYYY');
+        let factoryName = this.levelLList.filter(item => item.id == this.form.levelId)[0].name;
+        let fileName = this.timeType=== 'month'?mon + factoryName + '月度预算表.xls':mon + factoryName + '年度预算表.xls';
+        this.$download.excel(response, fileName);
+      });
+    },
    // 文件上传中处理
    handleFileUploadProgress(file, fileList) {
      console.log('文件上传中：',file, fileList)
--- a/src/views/home/components/indicatorCalendar.vue
+++ b/src/views/home/components/indicatorCalendar.vue
@@ -1,14 +1,13 @@
 <template>
  <div style="flex: 1">
-    <Container name="指标填报日历" icon="cockpitItemIcon" size="calendarBg" topSize="calendarTitleBg">
+    <Container name="填报总览" icon="cockpitItemIcon" size="calendarBg" topSize="calendarTitleBg">
      <!-- 1. 移除 .kpi-content 的固定高度，改为自适应 -->
      <div class="kpi-content" style="padding: 14px 14px; display: flex;flex-direction: column; width: 100%;">
        <!-- 2. .top 保持 flex，无需固定高度，自动跟随子元素拉伸 -->
        <div class="bottom"
-          style="display: flex; width: 100%;margin-top: 8px;background-color: rgba(249, 252, 255, 1);height: 844px;padding: 26px 16px;">
+          style="width: 100%;margin-top: 8px;background-color: rgba(249, 252, 255, 1);height: 844px;padding: 26px 0px;">
          <!-- 动态生成12个月的容器：优化flex布局，缩小行间距 -->
-          <div class="month-list"
-            style="display: flex; gap: 16px; flex-wrap: wrap; align-content: flex-start; row-gap: 8px;">
+          <div class="month-list">
            <!-- 循环生成12个月：通过判断当前月份索引，添加current类 -->
            <div class="monthItem" :class="{
              'has-data': month.haveData,
@@ -91,20 +90,20 @@ export default {

 // 基础月份样式
 .monthItem {
-  width: 164px;
-  height: 42px;
+  width: 100px;
+  height: 57px;
  border-radius: 4px;
  font-family: PingFangSC, PingFang SC;
  font-weight: 400;
  font-size: 20px;
  color: rgba(0, 0, 0, 0.85);
-  line-height: 42px;
+  line-height: 57px;
  text-align: center;
  font-style: normal;
  cursor: pointer; // 鼠标悬浮手型
  transition: all 0.2s ease; // 过渡效果，样式切换更平滑
  border: 2px solid transparent; // 透明边框，避免选中时布局偏移
-  margin: 0; // 清除默认外边距，进一步缩小缝隙
+  margin: 0 auto 10px; // 清除默认外边距，进一步缩小缝隙
 }

 // 有数据的样式（背景色#D1E8FF）
--- a/src/views/home/components/indicatorDetails.vue
+++ b/src/views/home/components/indicatorDetails.vue
@@ -15,12 +15,14 @@
            </el-form-item>

            <el-form-item label="填报月份">
-              <el-date-picker v-model="form.month" type="month" placeholder="选择月" @change="handleMonthChange">
+              <el-date-picker v-model="form.month" type="month" placeholder="选择月" :editable='false' :clearable='false' @change="handleMonthChange">
              </el-date-picker>
            </el-form-item>
            <el-form-item>
              <el-button style="background-color: #0B58FF;" type="primary" @click="onSubmit">查询</el-button>
+              <el-button type="primary" plain size="medium" @click='downLoadExcel'>模板下载</el-button>
              <el-button type="primary" plain size="medium" @click='importExcel'>导入</el-button>
+              <el-button type="primary" plain size="medium" @click='exportExcel'>导出</el-button>
            </el-form-item>
          </el-form>
        </div>
@@ -86,10 +88,11 @@ font-style: normal;">指标详情</div>

 <script>
 import Container from './container.vue'
-import { getLevelStruc, getRealMonthPage, updateRealMonthData, getDictListData, } from '@/api/cockpit'
+import { getLevelStruc, getRealMonthPage, updateRealMonthData, getDictListData,importTemplateZB } from '@/api/cockpit'
 import inputArea from './inputArea.vue' // 导入输入组件
 import {getAccessToken, getTenantId} from '@/utils/auth'
 import axios from 'axios';
+import moment from 'moment'
 export default {
  name: 'ProductionStatus',
  components: {
@@ -338,6 +341,33 @@ export default {
    importExcel() {
      this.upload.open = true
    },
+    downLoadExcel() {
+      importTemplateZB({
+        levelId:this.form.levelId,
+        startTime: this.form.startTime,
+        endTime: this.form.endTime,
+        pageSize: 1000,
+        template:1,
+        pageNo: this.form.pageNo
+      }).then(response => {
+        this.$download.excel(response, '指标导入模板.xls');
+      });
+    },
+    exportExcel() {
+      importTemplateZB({
+        levelId:this.form.levelId,
+        startTime: this.form.startTime,
+        endTime: this.form.endTime,
+        pageSize: 1000,
+        template:0,
+        pageNo: this.form.pageNo
+      }).then(response => {
+        let mon = moment(this.form.endTime).format('YYYYMM');
+        let factoryName = this.levelLList.filter(item => item.id == this.form.levelId)[0].name;
+        let fileName = mon + factoryName + '月度指标填报表.xls';
+        this.$download.excel(response, fileName);
+      });
+    },
    // 文件上传中处理
    handleFileUploadProgress(file, fileList) {
      console.log('文件上传中：',file, fileList)