制造成本分析部分字段

2026-04-24 14:33:54 +08:00
parent 62340233e2
commit 59a1654cbd
13 changed files with 488 additions and 21 deletions
--- a/src/views/home/budgetSubmissionDetails.vue
+++ b/src/views/home/budgetSubmissionDetails.vue
@@ -0,0 +1,252 @@
+<template>
+  <div id="dayReport" class="dayReport" :style="styles">
+    <div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
+    <sidebar v-if="!sidebar.hide" class="sidebar-container" />
+    <ReportHeader top-title="预算填报" :is-full-screen="isFullScreen" @screenfullChange="screenfullChange"
+      @getTimeType="handleTimeChange" :isBudget="true" />
+    <div class="main-body" style="
+        flex: 1;
+        display: flex;
+        padding: 0px 16px 0 272px;
+        flex-direction: column;
+      ">
+      <div class="top" style="margin-top: -20px;  display: flex; gap: 16px">
+        <div class="top-three" style="
+            display: grid;
+            gap: 12px;
+            grid-template-columns:186px 1422px;
+          ">
+          <indicatorCalendar :timeType="timeType" :calendarObj='calendarObj'/>
+          <indicatorDetails :timeType="timeType" @updateLeft='getData' @updateLevel='getLevel'/>
+        </div>
+      </div>
+      <!-- <div class="top" style="margin-top: -20px;  display: flex; gap: 16px">
+        <div class="top-three" style="
+            display: grid;
+            gap: 12px;
+            grid-template-columns:416px 1192px;
+          ">
+        </div>
+      </div> -->
+      <!-- <div class="centerImg" style="
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 1; /* 确保在 backp 之上、内容之下 */
+      "></div> -->
+    </div>
+  </div>
+</template>
+<script>
+import ReportHeader from "./components/budgetHeader.vue";
+import { Sidebar } from "../../layout/components";
+import screenfull from "screenfull";
+import indicatorCalendar from "./components/budgetCalendar.vue";
+import indicatorDetails from "./components/budgetDetails.vue";
+// import premProdStatus from "./components/premProdStatus.vue";
+import { mapState } from "vuex";
+// import operatingLineChart from "../operatingComponents/operatingLineChart";
+// import operatingLineChartCumulative from "../operatingComponents/operatingLineChartCumulative.vue";
+import { getSalesRevenueGroupData } from '@/api/cockpit'
+import moment from "moment";
+import {getCalendar, getCalendarYear} from '@/api/cockpit';
+export default {
+  name: "DayReport",
+  components: {
+    ReportHeader,
+    indicatorCalendar,
+    indicatorDetails,
+    // operatingLineChartCumulative,
+    // operatingLineChart,
+    // premProdStatus,
+    Sidebar,
+  },
+  data() {
+    return {
+      weekArr: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
+      isFullScreen: false,
+      timer: null,
+      beilv: 1,
+      timeType:'month',
+      value: 100,
+      sort:1,
+      selectDate:{},
+      monthData: {},
+      ytdData: {},
+      calendarObj:{},
+      levelId: null
+    };
+  },
+  created() {
+    this.init();
+    this.windowWidth(document.documentElement.clientWidth);
+  },
+  computed: {
+    ...mapState({
+      theme: (state) => state.settings.theme,
+      sideTheme: (state) => state.settings.sideTheme,
+      sidebar: (state) => state.app.sidebar,
+      device: (state) => state.app.device,
+      needTagsView: (state) => state.settings.tagsView,
+      fixedHeader: (state) => state.settings.fixedHeader,
+    }),
+    classObj() {
+      return {
+        hideSidebar: !this.sidebar.opened,
+        openSidebar: this.sidebar.opened,
+        withoutAnimation: this.sidebar.withoutAnimation,
+        mobile: this.device === "mobile",
+      };
+    },
+    variables() {
+      return variables;
+    },
+    // ...mapGetters(['sidebar']),
+    styles() {
+      const v = Math.floor(this.value * this.beilv * 100) / 10000;
+      return {
+        transform: `scale(${v})`,
+        transformOrigin: "left top",
+        // overflow: hidden;
+      };
+    },
+  },
+  watch: {
+    clientWidth(val) {
+      if (!this.timer) {
+        this.clientWidth = val;
+        this.beilv2 = this.clientWidth / 1920;
+        this.timer = true;
+        let _this = this;
+        setTimeout(function () {
+          _this.timer = false;
+        }, 500);
+      }
+      // 这里可以添加修改时的方法
+      this.windowWidth(val);
+    },
+  },
+  beforeDestroy() {
+    clearInterval(this.timer);
+    this.destroy();
+  },
+  mounted() {
+    const _this = this;
+    _this.beilv = document.documentElement.clientWidth / 1920;
+    window.onresize = () => {
+      return (() => {
+        _this.clientWidth = `${document.documentElement.clientWidth}`;
+        this.beilv = _this.clientWidth / 1920;
+      })();
+    };
+    // this.getData()
+  },
+  methods: {
+    getData() {
+      if(this.timeType == 'month'){
+        getCalendar({levelId: this.levelId}).then((res) => {
+          this.calendarObj = res.data
+        })
+      }else{
+        getCalendarYear({levelId: this.levelId}).then((res) => {
+          this.calendarObj = res.data
+        })
+      }
+    },
+    // 层级变动
+    getLevel(id) {
+      this.levelId = id
+      this.getData()
+    },
+    handleTimeChange(obj) {
+      console.log(obj, 'obj');
+      this.timeType = obj
+      this.getData()
+    },
+    handleClickOutside() {
+      this.$store.dispatch("app/closeSideBar", { withoutAnimation: false });
+    },
+    windowWidth(value) {
+      this.clientWidth = value;
+      this.beilv2 = this.clientWidth / 1920;
+    },
+    change() {
+      this.isFullScreen = screenfull.isFullscreen;
+    },
+    init() {
+      if (!screenfull.isEnabled) {
+        this.$message({
+          message: "you browser can not work",
+          type: "warning",
+        });
+        return false;
+      }
+      screenfull.on("change", this.change);
+    },
+    destroy() {
+      if (!screenfull.isEnabled) {
+        this.$message({
+          message: "you browser can not work",
+          type: "warning",
+        });
+        return false;
+      }
+      screenfull.off("change", this.change);
+    },
+    // 全屏
+    screenfullChange() {
+      console.log("screenfull.enabled", screenfull.isEnabled);
+      if (!screenfull.isEnabled) {
+        this.$message({
+          message: "you browser can not work",
+          type: "warning",
+        });
+        return false;
+      }
+      screenfull.toggle(this.$refs.dayReportB);
+    },
+    // 导出
+    // exportPDF() {
+    //   this.$message.success('正在导出，请稍等！')
+    //   const element = document.getElementById('dayRepDom')
+    //   element.style.display = 'block'
+    //   const fileName = '株洲碲化镉生产日报' + moment().format('yyMMDD') + '.pdf'
+    //   html2canvas(element, {
+    //     dpi: 300, // Set to 300 DPI
+    //     scale: 3 // Adjusts your resolution
+    //   }).then(function(canvas) {
+    //     const imgWidth = 595.28
+    //     const imgHeight = 841.89
+    //     const pageData = canvas.toDataURL('image/jpeg', 1.0)
+    //     const PDF = new JsPDF('', 'pt', [imgWidth, imgHeight])
+    //     PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
+    //     setTimeout(() => {
+    //       PDF.save(fileName) // 导出文件名
+    //     }, 1000)
+    //   })
+    //   element.style.display = 'none'
+    // }
+  },
+};
+</script>
+<style scoped lang="scss">
+@import "~@/assets/styles/mixin.scss";
+@import "~@/assets/styles/variables.scss";
+.dayReport {
+  width: 1920px;
+  height: 1080px;
+  background: url("../../assets/img/backp.png") no-repeat;
+  background-size: cover;
+}
+.hideSidebar .fixed-header {
+  width: calc(100% - 54px);
+}
+.sidebarHide .fixed-header {
+  width: calc(100%);
+}
+.mobile .fixed-header {
+  width: 100%;
+}
+</style>
--- a/src/views/home/indicatorSubmissionDetails.vue
+++ b/src/views/home/indicatorSubmissionDetails.vue
@@ -0,0 +1,197 @@
+<template>
+  <div id="dayReport" class="dayReport" :style="styles">
+    <div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
+    <sidebar v-if="!sidebar.hide" class="sidebar-container" />
+    <ReportHeader top-title="指标填报" :is-full-screen="isFullScreen" @screenfullChange="screenfullChange"
+   :isBudget="false" />
+    <div class="main-body" style="
+        flex: 1;
+        display: flex;
+        padding: 0px 16px 0 272px;
+        flex-direction: column;
+      ">
+      <div class="top" style="margin-top: -20px;  display: flex; gap: 16px">
+        <div class="top-three" style="
+            display: grid;
+            gap: 12px;
+            grid-template-columns:186px 1422px;
+          ">
+          <indicatorCalendar :calendarList="calendarList" />
+          <indicatorDetails @updateLeft='getData' @updateLevel='getLevel'/>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import ReportHeader from "./components/budgetHeader.vue";
+import { Sidebar } from "../../layout/components";
+import screenfull from "screenfull";
+import indicatorCalendar from "./components/indicatorCalendar.vue";
+import indicatorDetails from "./components/indicatorDetails.vue";
+import { mapState } from "vuex";
+import { getRealMonthCalendar } from '@/api/cockpit'
+export default {
+  name: "DayReport",
+  components: {
+    ReportHeader,
+    indicatorCalendar,
+    indicatorDetails,
+    Sidebar,
+  },
+  data() {
+    return {
+      weekArr: ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
+      isFullScreen: false,
+      timer: null,
+      beilv: 1,
+      value: 100,
+      sort:1,
+      selectDate:{},
+      monthData: {},
+      ytdData: {},
+      calendarList:{},
+      levelId:null
+    };
+  },
+  created() {
+    this.init();
+    this.windowWidth(document.documentElement.clientWidth);
+  },
+  computed: {
+    ...mapState({
+      theme: (state) => state.settings.theme,
+      sideTheme: (state) => state.settings.sideTheme,
+      sidebar: (state) => state.app.sidebar,
+      device: (state) => state.app.device,
+      needTagsView: (state) => state.settings.tagsView,
+      fixedHeader: (state) => state.settings.fixedHeader,
+    }),
+    classObj() {
+      return {
+        hideSidebar: !this.sidebar.opened,
+        openSidebar: this.sidebar.opened,
+        withoutAnimation: this.sidebar.withoutAnimation,
+        mobile: this.device === "mobile",
+      };
+    },
+    variables() {
+      return variables;
+    },
+    // ...mapGetters(['sidebar']),
+    styles() {
+      const v = Math.floor(this.value * this.beilv * 100) / 10000;
+      return {
+        transform: `scale(${v})`,
+        transformOrigin: "left top",
+        // overflow: hidden;
+      };
+    },
+  },
+  watch: {
+    clientWidth(val) {
+      if (!this.timer) {
+        this.clientWidth = val;
+        this.beilv2 = this.clientWidth / 1920;
+        this.timer = true;
+        let _this = this;
+        setTimeout(function () {
+          _this.timer = false;
+        }, 500);
+      }
+      // 这里可以添加修改时的方法
+      this.windowWidth(val);
+    },
+  },
+  beforeDestroy() {
+    clearInterval(this.timer);
+    this.destroy();
+  },
+  mounted() {
+    const _this = this;
+    _this.beilv = document.documentElement.clientWidth / 1920;
+    window.onresize = () => {
+      return (() => {
+        _this.clientWidth = `${document.documentElement.clientWidth}`;
+        this.beilv = _this.clientWidth / 1920;
+      })();
+    };
+  },
+  methods: {
+    // 层级变动
+    getLevel(id) {
+      this.levelId = id
+      this.getData()
+    },
+    getData() {
+      getRealMonthCalendar({
+        levelId: this.levelId
+      }).then((res) => {
+        console.log(res, 'res');
+        this.calendarList = res.data
+      })
+    },
+    handleClickOutside() {
+      this.$store.dispatch("app/closeSideBar", { withoutAnimation: false });
+    },
+    windowWidth(value) {
+      this.clientWidth = value;
+      this.beilv2 = this.clientWidth / 1920;
+    },
+    change() {
+      this.isFullScreen = screenfull.isFullscreen;
+    },
+    init() {
+      if (!screenfull.isEnabled) {
+        this.$message({
+          message: "you browser can not work",
+          type: "warning",
+        });
+        return false;
+      }
+      screenfull.on("change", this.change);
+    },
+    destroy() {
+      if (!screenfull.isEnabled) {
+        this.$message({
+          message: "you browser can not work",
+          type: "warning",
+        });
+        return false;
+      }
+      screenfull.off("change", this.change);
+    },
+    // 全屏
+    screenfullChange() {
+      console.log("screenfull.enabled", screenfull.isEnabled);
+      if (!screenfull.isEnabled) {
+        this.$message({
+          message: "you browser can not work",
+          type: "warning",
+        });
+        return false;
+      }
+      screenfull.toggle(this.$refs.dayReportB);
+    }
+  },
+};
+</script>
+<style scoped lang="scss">
+@import "~@/assets/styles/mixin.scss";
+@import "~@/assets/styles/variables.scss";
+.dayReport {
+  width: 1920px;
+  height: 1080px;
+  background: url("../../assets/img/backp.png") no-repeat;
+  background-size: cover;
+}
+.hideSidebar .fixed-header {
+  width: calc(100% - 54px);
+}
+.sidebarHide .fixed-header {
+  width: calc(100%);
+}
+.mobile .fixed-header {
+  width: 100%;
+}
+</style>
--- a/src/views/home/operatingRevenue/operatingRevenueBase.vue
+++ b/src/views/home/operatingRevenue/operatingRevenueBase.vue
@@ -179,6 +179,7 @@ export default {
  methods: {
    handleChange(value) {
      this.index =value
+      console.log('+++++++++++++++++++++++++++++++++111111')
      this.getData()
    },
    getData() {
@@ -202,19 +203,21 @@ export default {
    },

    handleTimeChange(obj) {
+      console.log('=====================================222222222222',obj);
      this.month = obj.targetMonth
      this.dateData = {
        startTime: obj.startTime,
        endTime: obj.endTime,
        // mode: obj.mode,
      }
-
+      console.log('+++++++++++++++++++++++++++++++++22222')
      this.getData()
    },
    selectChange(data) {
      console.log('选中的数据：', data);
      this.factory = data
      if (this.dateData.startTime && this.dateData.endTime) {
+        console.log('+++++++++++++++++++++++++++++++++33333')
        this.getData();
      }
    },
@@ -263,8 +266,6 @@ export default {
    },
    changeDate(val) {
      this.date = val;
-      // this.weekDay = this.weekArr[moment(this.date).format('e')]
-      // this.getData()
      if (this.date === moment().format("yyyy-MM-DD")) {
        this.loopTime();
      } else {
--- a/src/views/home/productionCostAnalysis/SIMFRMCostAnalysis.vue
+++ b/src/views/home/productionCostAnalysis/SIMFRMCostAnalysis.vue
@@ -193,7 +193,7 @@ export default {
      const requestParams = {
        startTime: this.dateData.startTime,
        endTime: this.dateData.endTime,
-        trendName: '原料' + this.meterialName + this.trendName,
+        trendName: this.trendName,
        analysisObject: [this.meterialName],
        levelId: this.factory,
        isOriginal:0,//0:原片 1:加工
--- a/src/views/home/productionCostAnalysis/mfgOverheadSingleCostAnalysis.vue
+++ b/src/views/home/productionCostAnalysis/mfgOverheadSingleCostAnalysis.vue
@@ -187,19 +187,19 @@ export default {
      // 调用接口
      getSingleMaterialCostAnalysis(requestParams).then((res) => {
        this.monData = res.data.currentMonthData.find(item => {
-          return item.name === this.overheadName+'成本';
+          return item.name === '原片'+this.overheadName+'成本';
        });

        this.totalData = res.data.totalMonthData.find(item => {
-          return item.name === this.overheadName+'成本';
+          return item.name === '原片'+this.overheadName+'成本';
        });
        // this.relatedMon = res.data.relatedMon
        this.relatedData = {
          relatedMon: res.data.currentMonthData.filter(item => {
-            return item.name !== this.overheadName+'成本';
+            return item.name !== '原片'+this.overheadName+'成本';
          }), // 兜底月度数据
          relatedTotal: res.data.totalMonthData.filter(item => {
-            return item.name !== this.overheadName+'成本';
+            return item.name !== '原片'+this.overheadName+'成本';
          }) // 兜底累计数据
        }
        this.trend = res.data.dataTrend
--- a/src/views/home/productionCostAnalysis/processingFuel.vue
+++ b/src/views/home/productionCostAnalysis/processingFuel.vue
@@ -37,8 +37,8 @@
            grid-template-columns: 804px 804px;
          ">
          <monthlyRelatedMetrics :dateData="dateData" :factory="factory" :relatedData="monthRelatedData"
-            :title="'月度概览'" />
-          <yearRelatedMetrics :dateData="dateData" :factory="factory" :relatedData="totalRelatedData" :title="'累计概览'" />
+            :title="'月度·相关指标分析'" />
+          <yearRelatedMetrics :dateData="dateData" :factory="factory" :relatedData="totalRelatedData" :title="'累计·相关指标分析'" />
        </div>
      </div>
      <div class="bottom" style="display: flex; gap: 16px;margin-top: 6px;">
--- a/src/views/home/productionCostAnalysis/singleCombustible.vue
+++ b/src/views/home/productionCostAnalysis/singleCombustible.vue
@@ -231,17 +231,33 @@ export default {
      // 调用接口
      getSingleMaterialAnalysis(requestParams).then((res) => {
        this.monData = res.data.currentMonthData.find(item => {
-          return item.name === this.fuelName + '成本';
+          if(this.fuelName === '水') {
+            return item.name === '原片'+this.fuelName + '成本';
+          }else{
+            return item.name === this.fuelName + '成本';
+          }
        });
        this.totalData = res.data.totalMonthData.find(item => {
-          return item.name === this.fuelName + '成本';
+          if(this.fuelName === '水') {
+            return item.name === '原片'+this.fuelName + '成本';
+          }else{
+            return item.name === this.fuelName + '成本';
+          }
        });
        this.relatedData = {
          relatedMon: res.data.currentMonthData.filter(item => {
+            if(this.fuelName === '水') {
+            return item.name !== '原片'+this.fuelName + '成本';
+          }else{
            return item.name !== this.fuelName + '成本';
+          }
          }), // 兜底月度数据
          relatedTotal: res.data.totalMonthData.filter(item => {
+            if(this.fuelName === '水') {
+            return item.name !== '原片'+this.fuelName + '成本';
+          }else{
            return item.name !== this.fuelName + '成本';
+          }
          }) // 兜底累计数据
        }
        this.trend = res.data.dataTrend
--- a/src/views/home/productionCostAnalysis/singleProcAuxMatCost.vue
+++ b/src/views/home/productionCostAnalysis/singleProcAuxMatCost.vue
@@ -190,7 +190,7 @@ export default {
      const requestParams = {
        startTime: this.dateData.startTime,
        endTime: this.dateData.endTime,
-        trendName: this.auxMatName + this.trendName,
+        trendName: this.trendName,
        analysisObject: [this.auxMatName],
        levelId: this.factory,
        isOriginal:1,//0:原片 1:加工
@@ -218,6 +218,7 @@ export default {
    },

    handleTimeChange(obj) {
+      console.log('=====================================222222222222',obj);
      this.month = obj.targetMonth
      this.dateData = {
        startTime: obj.startTime,
--- a/src/views/home/productionCostAnalysis/singleProcMfgOverheadCost.vue
+++ b/src/views/home/productionCostAnalysis/singleProcMfgOverheadCost.vue
@@ -174,11 +174,11 @@ export default {
      // 调用接口
      getSingleMaterialCostAnalysis(requestParams).then((res) => {
        this.monData = res.data.currentMonthData.find(item => {
-          return item.name === this.overheadName+'成本';
+          return item.name === '加工'+this.overheadName+'成本';
        });

        this.totalData = res.data.totalMonthData.find(item => {
-          return item.name === this.overheadName+'成本';
+          return item.name === '加工'+this.overheadName+'成本';
        });
        this.trend = res.data.dataTrend
      });
--- a/src/views/home/productionCostAnalysisComponents/monthlyRelatedMetricsProcessingFuel.vue
+++ b/src/views/home/productionCostAnalysisComponents/monthlyRelatedMetricsProcessingFuel.vue
@@ -74,7 +74,7 @@ export default {
  computed: {
    // 1. 销量数据：从当前激活数据集中筛选（依赖 activeData，自动响应变化）
    dianData() {
-      return (this.relatedData.find(item => item.name === "电成本")) || {
+      return (this.relatedData.find(item => item.name === "加工电成本")) || {
        targetValue: 0,
        value: 0,
        completed: 0,
@@ -84,7 +84,7 @@ export default {
    },
    // 2. 单价数据：从当前激活数据集中筛选
    shuiData() {
-      return (this.relatedData.find(item => item.name === "水成本")) || {
+      return (this.relatedData.find(item => item.name === "加工水成本")) || {
        targetValue: 0,
        value: 0,
        proportion: 0,
--- a/src/views/home/productionCostAnalysisComponents/relateSingleFuelCostAnalysisDian.vue
+++ b/src/views/home/productionCostAnalysisComponents/relateSingleFuelCostAnalysisDian.vue
@@ -20,7 +20,7 @@
          </div>
          <div class="dashboard">
            <div class="title">
-              产量.{{unitList[1]}}
+              产量·{{unitList[1]}}
            </div>
            <div style='font-size: 14px;text-align: right;padding-right: 5px;'>
              <span>完成率:<span style='color: #0B58FF;'>{{productData.proportion}}%</span></span>
--- a/src/views/home/productionCostAnalysisComponents/relatedIndicatorsAnalysis.vue
+++ b/src/views/home/productionCostAnalysisComponents/relatedIndicatorsAnalysis.vue
@@ -81,7 +81,7 @@ export default {
      const list = (Array.isArray(this.activeData) ? this.activeData : [])

      return this.indicatorDefs.map(def => {
-        const data = list.find(item => item && item.name === def.label) || fallback
+        const data = list.find(item => item && item.name.includes(def.label)) || fallback
        return {
          ...def,
          data,
--- a/src/views/home/productionCostAnalysisComponents/yearRelatedMetricsFuel.vue
+++ b/src/views/home/productionCostAnalysisComponents/yearRelatedMetricsFuel.vue
@@ -74,7 +74,7 @@ export default {
  computed: {
    // 1. 销量数据：从当前激活数据集中筛选（依赖 activeData，自动响应变化）
    dianData() {
-      return (this.relatedData.find(item => item.name === "电成本")) || {
+      return (this.relatedData.find(item => item.name === "加工电成本")) || {
        targetValue: 0,
        value: 0,
        completed: 0,
@@ -84,7 +84,7 @@ export default {
    },
    // 2. 单价数据：从当前激活数据集中筛选
    shuiData() {
-      return (this.relatedData.find(item => item.name === "水成本")) || {
+      return (this.relatedData.find(item => item.name === "加工水成本")) || {
        targetValue: 0,
        value: 0,
        proportion: 0,