From 594a921880c1ca4e8f8228998fcbccaf7bbf772b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A0=82=E7=B3=96?= <2178503051@qq.com>
Date: Fri, 24 Apr 2026 17:49:01 +0800
Subject: [PATCH] =?UTF-8?q?feat(wms):=20=E6=96=B0=E5=A2=9E=E7=BB=BC?=
 =?UTF-8?q?=E5=90=88=E6=8A=A5=E8=A1=A8=E6=A8=A1=E6=9D=BF=E5=8F=8A=E5=88=86?=
 =?UTF-8?q?=E6=9D=A1=E7=BA=BF=E6=8A=A5=E8=A1=A8=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

添加mands.vue模板组件用于综合报表展示，包含日期筛选、数据统计、图表展示等功能
新增and.vue分条线报表组件，继承综合报表模板功能
实现产出与消耗钢卷数据的对比统计及可视化展示
---
 klp-ui/src/views/wms/report/split/and.vue     |  26 +
 .../src/views/wms/report/template/mands.vue   | 745 ++++++++++++++++++
 2 files changed, 771 insertions(+)
 create mode 100644 klp-ui/src/views/wms/report/split/and.vue
 create mode 100644 klp-ui/src/views/wms/report/template/mands.vue

diff --git a/klp-ui/src/views/wms/report/split/and.vue b/klp-ui/src/views/wms/report/split/and.vue
new file mode 100644
index 00000000..f185cbe2
--- /dev/null
+++ b/klp-ui/src/views/wms/report/split/and.vue
@@ -0,0 +1,26 @@
+<template>
+  <MandsTemplate
+    :actionTypes="actionTypes"
+    :actionQueryParams="actionQueryParams"
+    :baseQueryParams="baseQueryParams"
+    :warehouseOptions="warehouseOptions"
+    :productionLine="productionLine"
+  />
+</template>
+
+<script>
+import MandsTemplate from '@/views/wms/report/template/mands.vue'
+import { splitConfig } from '@/views/wms/report/js/config.js'
+
+export default {
+  name: 'AndReport',
+  components: {
+    MandsTemplate,
+  },
+  data() {
+    return {
+      ...splitConfig,
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/klp-ui/src/views/wms/report/template/mands.vue b/klp-ui/src/views/wms/report/template/mands.vue
new file mode 100644
index 00000000..cd5a597a
--- /dev/null
+++ b/klp-ui/src/views/wms/report/template/mands.vue
@@ -0,0 +1,745 @@
+<template>
+  <div class="app-container" v-loading="loading">
+    <!-- 对日期的筛选另起一行 -->
+    <div style="margin-bottom: 10px;">
+      <!-- 单选按钮，用于切换视图，可以使用日视图、月视图、年视图、自定义, 默认使用自定义日期 -->
+      <!-- 日视图时选择一天, 月视图时选择一个月, 年视图时选择一年, 自定义时选择自定义时间范围 -->
+      <el-radio-group v-model="viewType" @change="handleViewTypeChange">
+        <el-radio-button label="day">日视图</el-radio-button>
+        <el-radio-button label="month">月视图</el-radio-button>
+        <el-radio-button label="year">年视图</el-radio-button>
+        <el-radio-button label="custom">自定义</el-radio-button>
+      </el-radio-group>
+
+      <!-- 日视图日期选择器 -->
+      <el-date-picker v-if="viewType === 'day'" style="width: 200px; margin-left: 10px;" v-model="dayDate" type="date"
+        value-format="yyyy-MM-dd" placeholder="选择日期" @change="handleDayDateChange" />
+
+      <!-- 月视图日期选择器 -->
+      <el-date-picker v-if="viewType === 'month'" style="width: 200px; margin-left: 10px;" v-model="monthDate"
+        type="month" value-format="yyyy-MM" placeholder="选择月份" @change="handleMonthDateChange" />
+
+      <!-- 年视图日期选择器 -->
+      <el-date-picker v-if="viewType === 'year'" style="width: 200px; margin-left: 10px;" v-model="yearDate" type="year"
+        value-format="yyyy" placeholder="选择年份" @change="handleYearDateChange" />
+
+      <!-- 自定义日期选择器 -->
+      <span v-if="viewType === 'custom'" style="margin-left: 10px;">
+        <el-date-picker  style="width: 200px;" v-model="queryParams.byCreateTimeStart"
+          type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择开始日期"></el-date-picker>
+        至
+        <el-date-picker style="width: 200px;" v-model="queryParams.byCreateTimeEnd"
+          type="datetime" value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择结束日期"></el-date-picker>
+      </span>
+    </div>
+    <el-row>
+      <el-form label-width="80px" inline>
+        <el-form-item label="入场钢卷号" prop="enterCoilNo">
+          <el-input style="width: 200px; display: inline-block;" v-model="queryParams.enterCoilNo"
+            placeholder="请输入入场钢卷号" clearable @keyup.enter.native="handleQuery" />
+        </el-form-item>
+        <el-form-item label="当前钢卷号" prop="currentCoilNo">
+          <el-input style="width: 200px;" v-model="queryParams.currentCoilNo" placeholder="请输入当前钢卷号" clearable
+            @keyup.enter.native="handleQuery" />
+        </el-form-item>
+        <el-form-item label="逻辑库位" prop="warehouseIds">
+          <el-select v-model="warehouseIds" collapse-tags multiple placeholder="请选择逻辑库位" style="width: 200px;">
+            <el-option v-for="item in warehouseOptions" :key="item.value" :label="item.label" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="产品名称" prop="itemName">
+          <el-input style="width: 200px;" v-model="queryParams.itemName" placeholder="请输入产品名称" clearable
+            @keyup.enter.native="handleQuery" />
+        </el-form-item>
+        <el-form-item label="规格" prop="itemSpecification">
+          <memo-input style="width: 200px;" v-model="queryParams.itemSpecification" storageKey="coilSpec"
+            placeholder="请选择规格" clearable @keyup.enter.native="handleQuery" />
+        </el-form-item>
+        <el-form-item label="材质" prop="itemMaterial">
+          <dict-select style="width: 200px;" v-model="queryParams.itemMaterial" dictType="coil_material"
+            placeholder="请选择材质" clearable multiple />
+        </el-form-item>
+        <el-form-item label="厂家" prop="itemManufacturer">
+          <dict-select style="width: 200px;" v-model="queryParams.itemManufacturer" dictType="coil_manufacturer"
+            placeholder="请选择厂家" clearable multiple />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="handleQuery">查询</el-button>
+          <el-button type="primary" @click="exportData">导出产出钢卷</el-button>
+          <el-button type="primary" @click="exportLossData">导出消耗钢卷</el-button>
+          <el-button type="primary" @click="settingVisible = true">列设置</el-button>
+          <el-button type="primary" @click="saveOutputReport">保存产出报表</el-button>
+          <el-button type="primary" @click="saveLossReport">保存消耗报表</el-button>
+        </el-form-item>
+      </el-form>
+    </el-row>
+
+    <el-descriptions title="统计信息" :column="3" border>
+      <el-descriptions-item label="产出数量">{{ summary.outCount }}<span v-if="viewType === 'day' && yesterdaySummary.outCount" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.outCount }})</span></el-descriptions-item>
+      <el-descriptions-item label="产出总重">{{ summary.outTotalWeight }}t<span v-if="viewType === 'day' && yesterdaySummary.outTotalWeight" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.outTotalWeight }}t)</span></el-descriptions-item>
+      <el-descriptions-item label="产出均重">{{ summary.outAvgWeight }}t<span v-if="viewType === 'day' && yesterdaySummary.outAvgWeight" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.outAvgWeight }}t)</span></el-descriptions-item>
+
+      <el-descriptions-item label="消耗数量">{{ summary.lossCount }}<span v-if="viewType === 'day' && yesterdaySummary.lossCount" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.lossCount }})</span></el-descriptions-item>
+      <el-descriptions-item label="消耗总重">{{ summary.lossTotalWeight }}t<span v-if="viewType === 'day' && yesterdaySummary.lossTotalWeight" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.lossTotalWeight }}t)</span></el-descriptions-item>
+      <el-descriptions-item label="消耗均重">{{ summary.lossAvgWeight }}t<span v-if="viewType === 'day' && yesterdaySummary.lossAvgWeight" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.lossAvgWeight }}t)</span></el-descriptions-item>
+
+      <el-descriptions-item label="数量差值">{{ summary.countDiff }}<span v-if="viewType === 'day' && yesterdaySummary.countDiff" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.countDiff }})</span></el-descriptions-item>
+      <el-descriptions-item label="总重差值">{{ summary.weightDiff }}<span v-if="viewType === 'day' && yesterdaySummary.weightDiff" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.weightDiff }})</span></el-descriptions-item>
+      <el-descriptions-item label="均重差值">{{ summary.avgWeightDiff }}t<span v-if="viewType === 'day' && yesterdaySummary.avgWeightDiff" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.avgWeightDiff }}t)</span></el-descriptions-item>
+      <!-- <el-descriptions-item label="合计均重">{{ summary.totalAvgWeight }}t</el-descriptions-item> -->
+
+      <!-- 成品率 -->
+      <el-descriptions-item label="成品率">{{ summary.passRate }}<span v-if="viewType === 'day' && yesterdaySummary.passRate" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.passRate }})</span></el-descriptions-item>
+      <el-descriptions-item label="损耗率">{{ summary.lossRate }}<span v-if="viewType === 'day' && yesterdaySummary.lossRate" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.lossRate }})</span></el-descriptions-item>
+      <!-- 异常率 -->
+      <el-descriptions-item label="异常率">{{ summary.abRate }}<span v-if="viewType === 'day' && yesterdaySummary.abRate" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.abRate }})</span></el-descriptions-item>
+      <!-- 正品率 -->
+      <el-descriptions-item label="正品率">{{ summary.passRate2 }}<span v-if="viewType === 'day' && yesterdaySummary.passRate2" style="margin-left: 10px; font-size: 12px; color: #999;">(昨日: {{ yesterdaySummary.passRate2 }})</span></el-descriptions-item>
+    </el-descriptions>
+
+    <!-- 已处理M统计信息 -->
+    <el-descriptions title="已处理M统计信息" :column="3" border>
+      <el-descriptions-item label="产出数量">{{ mSummary.outCount }}</el-descriptions-item>
+      <el-descriptions-item label="产出总重">{{ mSummary.outTotalWeight }}t</el-descriptions-item>
+      <el-descriptions-item label="产出均重">{{ mSummary.outAvgWeight }}t</el-descriptions-item>
+
+      <el-descriptions-item label="消耗数量">{{ mSummary.lossCount }}</el-descriptions-item>
+      <el-descriptions-item label="消耗总重">{{ mSummary.lossTotalWeight }}t</el-descriptions-item>
+      <el-descriptions-item label="消耗均重">{{ mSummary.lossAvgWeight }}t</el-descriptions-item>
+
+      <el-descriptions-item label="数量差值">{{ mSummary.countDiff }}</el-descriptions-item>
+      <el-descriptions-item label="总重差值">{{ mSummary.weightDiff }}</el-descriptions-item>
+      <el-descriptions-item label="均重差值">{{ mSummary.avgWeightDiff }}t</el-descriptions-item>
+      <!-- 成品率 -->
+      <el-descriptions-item label="成品率">{{ mSummary.passRate }}</el-descriptions-item>
+      <el-descriptions-item label="损耗率">{{ mSummary.lossRate }}</el-descriptions-item>
+      <!-- 异常率 -->
+      <el-descriptions-item label="异常率">{{ mSummary.abRate }}</el-descriptions-item>
+      <!-- 正品率 -->
+      <el-descriptions-item label="正品率">{{ mSummary.passRate2 }}</el-descriptions-item>
+    </el-descriptions>
+
+    <!-- 异常统计 -->
+    <el-descriptions title="异常统计" :column="4" border>
+      <el-descriptions-item v-for="item in abSummary" :key="item.label" :label="item.label">{{ item.value
+        }}</el-descriptions-item>
+    </el-descriptions>
+
+    <!-- 月视图日数据折线图 -->
+    <div v-if="viewType === 'month'" style="margin-top: 20px; height: 400px;">
+      <el-card>
+        <template slot="header">
+          <div class="clearfix">
+            <span>日数据趋势</span>
+          </div>
+        </template>
+        <div ref="monthChart" style="width: 100%; height: 350px;"></div>
+      </el-card>
+    </div>
+
+    <!-- 分条信息统计 -->
+    <split-summary v-if="productionLine == '分条线'" :origin-outputlist="list" :origin-loss-list="lossList"
+      :common-coil-ids="commonCoilIds"></split-summary>
+
+    <el-descriptions title="明细信息" :column="3" border>
+    </el-descriptions>
+    <el-tabs v-model="activeTab">
+      <el-tab-pane label="产出钢卷" name="output">
+        <coil-table :columns="outputColumns" :data="list" :highlight-config="{ rows: commonCoilIds }"></coil-table>
+      </el-tab-pane>
+      <el-tab-pane label="投入钢卷" name="loss">
+        <coil-table :columns="lossColumns" :data="lossList" :highlight-config="{ rows: commonCoilIds }"></coil-table>
+      </el-tab-pane>
+    </el-tabs>
+
+    <el-dialog title="列设置" :visible.sync="settingVisible" width="50%">
+      <el-radio-group v-model="activeColumnConfig">
+        <el-radio-button label="coil-report-loss">投入明细配置</el-radio-button>
+        <el-radio-button label="coil-report-output">产出明细配置</el-radio-button>
+      </el-radio-group>
+      <columns-setting :reportType="activeColumnConfig"></columns-setting>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { listCoilWithIds } from "@/api/wms/coil";
+import {
+  listPendingAction,
+} from '@/api/wms/pendingAction';
+import ProductInfo from "@/components/KLPService/Renderer/ProductInfo";
+import RawMaterialInfo from "@/components/KLPService/Renderer/RawMaterialInfo";
+import CoilNo from "@/components/KLPService/Renderer/CoilNo.vue";
+import MemoInput from "@/components/MemoInput";
+import MutiSelect from "@/components/MutiSelect";
+import WarehouseSelect from "@/components/KLPService/WarehouseSelect";
+import { calcSummary, calcAbSummary, calcMSummary } from "@/views/wms/report/js/calc";
+import ColumnsSetting from "@/views/wms/report/components/setting/columns.vue";
+import CoilTable from "@/views/wms/report/components/coilTable/index.vue";
+import SplitSummary from "@/views/wms/report/components/summary/splitSummary.vue";
+import { saveReportFile } from "@/views/wms/report/js/reportFile";
+import * as echarts from 'echarts';
+import { fetchLossList, fetchOutputList } from "@/views/wms/report/js/fetch";
+
+export default {
+  name: 'ComprehensiveTemplate',
+  components: {
+    ProductInfo,
+    RawMaterialInfo,
+    CoilNo,
+    MemoInput,
+    MutiSelect,
+    WarehouseSelect,
+    ColumnsSetting,
+    CoilTable,
+    SplitSummary,
+  },
+  props: {
+    actionTypes: {
+      type: Array,
+      default: () => [],
+    },
+    actionQueryParams: {
+      type: Object,
+      default: () => { },
+    },
+    baseQueryParams: {
+      type: Object,
+      default: () => ({})
+    },
+    warehouseOptions: {
+      type: Array,
+      default: () => []
+    },
+    productionLine: {
+      type: String,
+      default: '',
+    },
+  },
+  dicts: ['product_coil_status', 'coil_material', 'coil_itemname', 'coil_manufacturer'],
+  data() {
+    // 工具函数：个位数补零
+    const addZero = (num) => num.toString().padStart(2, '0')
+
+    // 获取当前日期（默认选中当天）
+    const now = new Date()
+    const currentDate = `${now.getFullYear()}-${addZero(now.getMonth() + 1)}`
+
+    /**
+     * 生成指定日期/月份的时间范围字符串
+     * @param {string} dateStr - 支持格式：yyyy-MM（月份） 或 yyyy-MM-dd（具体日期）
+     * @returns {object} 包含start（开始时间）和end（结束时间）的对象
+     */
+    const getDayTimeRange = (dateStr) => {
+      // 先校验输入格式是否合法
+      const monthPattern = /^\d{4}-\d{2}$/; // yyyy-MM 正则
+      const dayPattern = /^\d{4}-\d{2}-\d{2}$/; // yyyy-MM-dd 正则
+
+      if (!monthPattern.test(dateStr) && !dayPattern.test(dateStr)) {
+        throw new Error('输入格式错误，请传入 yyyy-MM 或 yyyy-MM-dd 格式的字符串');
+      }
+
+      let startDate, endDate;
+
+      if (monthPattern.test(dateStr)) {
+        // 处理 yyyy-MM 格式：获取本月第一天和最后一天
+        const [year, month] = dateStr.split('-').map(Number);
+        // 月份是0基的（0=1月，1=2月...），所以要减1
+        // 第一天：yyyy-MM-01
+        startDate = `${dateStr}-01`;
+        // 最后一天：通过 new Date(year, month, 0) 计算（month是原始月份，比如2代表2月，传2则取3月0日=2月最后一天）
+        const lastDayOfMonth = new Date(year, month, 0).getDate();
+        endDate = `${dateStr}-${lastDayOfMonth.toString().padStart(2, '0')}`;
+      } else {
+        // 处理 yyyy-MM-dd 格式：直接使用传入的日期
+        startDate = dateStr;
+        endDate = dateStr;
+      }
+
+      // 拼接时间部分
+      return {
+        start: `${startDate} 00:00:00`,
+        end: `${endDate} 23:59:59`
+      };
+    };
+
+    const { start, end } = getDayTimeRange(currentDate)
+
+    return {
+      mergeCoils: [],
+      activeTab: 'output',
+      activeColumnConfig: 'coil-report-loss',
+      settingVisible: false,
+      list: [],
+      lossList: [],
+      // 视图类型：day(日视图), month(月视图), year(年视图), custom(自定义)
+      viewType: 'custom',
+      // 日视图日期
+      dayDate: currentDate.split('-').length === 3 ? currentDate : `${currentDate}-01`,
+      // 月视图日期
+      monthDate: currentDate,
+      // 年视图日期
+      yearDate: currentDate.split('-')[0],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 99999,
+        date: currentDate,  // 绑定日期选择器的默认值（当天）
+        byCreateTimeStart: start,  // 默认当天0点
+        byCreateTimeEnd: end,      // 默认当天23:59:59
+        selectType: 'product',
+        enterCoilNo: '',
+        currentCoilNo: '',
+        warehouseId: '',
+        itemName: '',  // 修正原代码的productName为itemName（和表单绑定一致）
+        itemSpecification: '',
+        itemMaterial: '',
+        itemManufacturer: '',
+      },
+      loading: false,
+      warehouseIds: [
+        '1988150099140866050',
+        '1988150263284953089',
+        '1988150545175736322',
+        '1988150150521090049',
+        '2019583656787259393',
+        '2019583325311414274',
+        '2019583429955104769',
+        '2019583137616310273',
+      ],
+      getDayTimeRange,  // 挂载时间范围生成函数
+
+      lossColumns: [],
+      outputColumns: [],
+
+      actionIds: '',
+      // 昨日数据
+      yesterdaySummary: {},
+      // 折线图实例
+      monthChart: null,
+    }
+  },
+  watch: {
+    warehouseOptions: {
+      handler(newVal, oldVal) {
+        if (newVal !== oldVal) {
+          this.warehouseIds = newVal.map(item => item.value)
+        }
+      },
+      immediate: true,
+    }
+  },
+  computed: {
+    summary() {
+      return calcSummary(this.list, this.lossList)
+    },
+    abSummary() {
+      return calcAbSummary(this.list)
+    },
+    mSummary() {
+      return calcMSummary(this.list, this.lossList)
+    },
+    // 找出list和lossList中id相同的卷
+    commonCoilIds() {
+      if (this.productionLine !== '分条线') {
+        return []
+      }
+
+      // 获取list中的coilId集合
+      const outputCoilIds = new Set(this.list.map(item => item.coilId))
+      // 获取lossList中的coilId集合
+      const lossCoilIds = new Set(this.lossList.map(item => item.coilId))
+
+      // 找出两个集合中相同的coilId
+      const commonIds = []
+      outputCoilIds.forEach(id => {
+        if (lossCoilIds.has(id)) {
+          commonIds.push(id)
+        }
+      })
+      
+      return commonIds
+    },
+  },
+  methods: {
+    // 加载列设置
+    loadColumns() {
+      this.lossColumns = JSON.parse(localStorage.getItem('preference-tableColumns-coil-report-loss') || '[]') || []
+      this.outputColumns = JSON.parse(localStorage.getItem('preference-tableColumns-coil-report-output') || '[]') || []
+    },
+    // 视图类型变更处理
+    handleViewTypeChange() {
+      switch (this.viewType) {
+        case 'day':
+          // 切换到日视图时，默认选中今天
+          const today = new Date();
+          const year = today.getFullYear();
+          const month = String(today.getMonth() + 1).padStart(2, '0');
+          const day = String(today.getDate()).padStart(2, '0');
+          this.dayDate = `${year}-${month}-${day}`;
+          this.handleDayDateChange();
+          break;
+        case 'month':
+          this.handleMonthDateChange();
+          break;
+        case 'year':
+          this.handleYearDateChange();
+          break;
+        case 'custom':
+          // 自定义视图保持当前日期范围
+          break;
+      }
+    },
+    // 日视图日期变更处理
+    handleDayDateChange() {
+      if (this.dayDate) {
+        const { start, end } = this.getDayTimeRange(this.dayDate);
+        this.queryParams.byCreateTimeStart = start;
+        this.queryParams.byCreateTimeEnd = end;
+        this.handleQuery();
+      }
+    },
+    // 月视图日期变更处理
+    handleMonthDateChange() {
+      if (this.monthDate) {
+        const { start, end } = this.getDayTimeRange(this.monthDate);
+        this.queryParams.byCreateTimeStart = start;
+        this.queryParams.byCreateTimeEnd = end;
+        this.handleQuery();
+      }
+    },
+    // 年视图日期变更处理
+    handleYearDateChange() {
+      if (this.yearDate) {
+        // 年视图：1月1日到12月31日
+        this.queryParams.byCreateTimeStart = `${this.yearDate}-01-01 00:00:00`;
+        this.queryParams.byCreateTimeEnd = `${this.yearDate}-12-31 23:59:59`;
+        this.handleQuery();
+      }
+    },
+    // 日期变更处理：更新开始/结束时间
+    handleDateChange() {
+      if (this.viewType === 'custom') {
+        // 自定义视图下，使用开始和结束日期
+        if (this.queryParams.byCreateTimeStart && this.queryParams.byCreateTimeEnd) {
+          // 确保时间格式正确
+          if (!this.queryParams.byCreateTimeStart.includes(' ')) {
+            this.queryParams.byCreateTimeStart = `${this.queryParams.byCreateTimeStart} 00:00:00`;
+          }
+          if (!this.queryParams.byCreateTimeEnd.includes(' ')) {
+            this.queryParams.byCreateTimeEnd = `${this.queryParams.byCreateTimeEnd} 23:59:59`;
+          }
+          // 日期变更后自动查询
+          this.handleQuery();
+        }
+      }
+    },
+    // 统一查询入口（兼容回车和按钮点击）
+    async handleQuery() {
+      this.loading = true
+      await this.fetchMergeCoil()
+      Promise.all([
+        fetchLossList(this.actionTypes, {
+          ...this.queryParams,
+          ...this.actionQueryParams,
+        }, (ids) => { this.actionIds = ids }),
+        fetchOutputList({
+          ...this.queryParams,
+          ...this.baseQueryParams,
+          warehouseIds: this.warehouseIds.join(','),
+        }),
+      ]).then(([lossList, outputList]) => {
+        // 将mergeCoils中存在的卷剔除
+        this.lossList = lossList.filter(item => !this.mergeCoils.includes(item.coilId))
+        // 找出所有被剔除的卷的id, 
+        const removedCoilIds = lossList.filter(item => this.mergeCoils.includes(item.coilId)).map(item => item.coilId)
+        console.log(removedCoilIds)
+        this.list = outputList.filter(item => !removedCoilIds.includes(item.parentCoilId))
+        // if (this.viewType == 'day') {
+        //   this.getYesterdayData()
+        // }
+        if (this.viewType == 'month') {
+          this.initMonthChart()
+        }
+        this.loading = false
+      })
+    },
+    async fetchMergeCoil() {
+      const mergeActionRes = await listPendingAction({
+        actionTypes: '201,202,203,204,205,206',
+        actionStatus: 2,
+        pageSize: 99999,
+        pageNum: 1,
+      })
+      const mergeCoils = mergeActionRes.rows.map(item => item.processedCoilIds).join(',').split(',')
+      this.mergeCoils = mergeCoils
+    },
+    // 获取昨日数据
+    // getYesterdayData() {
+    //   const yesterday = new Date(this.dayDate)
+    //   yesterday.setDate(yesterday.getDate() - 1)
+    //   const year = yesterday.getFullYear()
+    //   const month = String(yesterday.getMonth() + 1).padStart(2, '0')
+    //   const day = String(yesterday.getDate()).padStart(2, '0')
+    //   const yesterdayDate = `${year}-${month}-${day}`
+    //   const { start, end } = this.getDayTimeRange(yesterdayDate)
+
+    //   Promise.all([
+    //     listCoilWithIds({
+    //       selectType: 'raw_material',
+    //       itemType: 'raw_material',
+    //       warehouseIds: this.warehouseIds.join(','),
+    //       ...this.queryParams,
+    //       ...this.baseQueryParams,
+    //       byCreateTimeStart: start,
+    //       byCreateTimeEnd: end,
+    //     }),
+    //     listCoilWithIds({
+    //       selectType: 'product',
+    //       itemType: 'product',
+    //       warehouseIds: this.warehouseIds.join(','),
+    //       ...this.queryParams,
+    //       ...this.baseQueryParams,
+    //       byCreateTimeStart: start,
+    //       byCreateTimeEnd: end,
+    //     }),
+    //   ]).then((resList) => {
+    //     const list = resList.flatMap(res => res.rows)
+    //     // 按照createTime 降序排序
+    //     const yesterdayList = list.sort(
+    //       (a, b) => new Date(b.createTime) - new Date(a.createTime)
+    //     ).map(item => {
+    //       return item
+    //     })
+
+    //     // 获取昨日消耗数据
+    //     Promise.all(this.actionTypes.map(actionType => {
+    //       return listPendingAction({
+    //         actionStatus: 2,
+    //         warehouseId: this.queryParams.planId,
+    //         actionType,
+    //         pageSize: 99999,
+    //         pageNum: 1,
+    //         startTime: start,
+    //         endTime: end,
+    //         ...this.actionQueryParams,
+    //       })
+    //     })).then((lossResList) => {
+    //       const lossActions = lossResList.flatMap(item => item.rows)
+    //       const lossCoilIds = lossActions.map(item => item.coilId).join(',')
+
+    //       if (lossCoilIds) {
+    //         listCoilWithIds({
+    //           ...this.queryParams,
+    //           byCreateTimeStart: undefined,
+    //           byCreateTimeEnd: undefined,
+    //           coilIds: lossCoilIds,
+    //         }).then(res => {
+    //           const yesterdayLossList = res.rows.filter(item => !this.mergeCoils.includes(item.coilId))
+    //           this.yesterdaySummary = calcSummary(yesterdayList, yesterdayLossList)
+    //         })
+    //       } else {
+    //         this.yesterdaySummary = calcSummary(yesterdayList, [])
+    //       }
+    //     })
+    //   })
+    // },
+    // 初始化月视图折线图
+    initMonthChart() {
+      if (!this.$refs.monthChart) return
+
+      // 销毁旧的图表实例
+      if (this.monthChart) {
+        this.monthChart.dispose()
+      }
+
+      // 创建新的图表实例
+      this.monthChart = echarts.init(this.$refs.monthChart)
+
+      // 处理数据，按日期分组
+      const dailyData = {}
+      this.list.forEach(item => {
+        const date = item.createTime.split(' ')[0]
+        if (!dailyData[date]) {
+          dailyData[date] = {
+            outCount: 0,
+            outTotalWeight: 0,
+            lossCount: 0,
+            lossTotalWeight: 0,
+          }
+        }
+        dailyData[date].outCount++
+        dailyData[date].outTotalWeight += parseFloat(item.netWeight) || 0
+      })
+
+      this.lossList.forEach(item => {
+        const date = item.actionCompleteTime?.split(' ')[0]
+        if (!dailyData[date]) {
+          dailyData[date] = {
+            outCount: 0,
+            outTotalWeight: 0,
+            lossCount: 0,
+            lossTotalWeight: 0,
+          }
+        }
+        dailyData[date].lossCount++
+        dailyData[date].lossTotalWeight += parseFloat(item.netWeight) || 0
+      })
+
+      // 生成日期数组和数据数组
+      const dates = Object.keys(dailyData).sort()
+      const outCountData = dates.map(date => dailyData[date].outCount)
+      const outTotalWeightData = dates.map(date => dailyData[date].outTotalWeight.toFixed(2))
+      const lossCountData = dates.map(date => dailyData[date].lossCount)
+      const lossTotalWeightData = dates.map(date => dailyData[date].lossTotalWeight.toFixed(2))
+
+      // 配置项
+      const option = {
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            type: 'cross',
+            label: {
+              backgroundColor: '#6a7985'
+            }
+          }
+        },
+        legend: {
+          data: ['产出数量', '产出总重', '消耗数量', '消耗总重']
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        xAxis: [
+          {
+            type: 'category',
+            boundaryGap: false,
+            data: dates
+          }
+        ],
+        yAxis: [
+          {
+            type: 'value',
+            name: '数量',
+            position: 'left',
+          },
+          {
+            type: 'value',
+            name: '重量(t)',
+            position: 'right',
+          }
+        ],
+        series: [
+          {
+            name: '产出数量',
+            type: 'line',
+            data: outCountData,
+            yAxisIndex: 0,
+          },
+          {
+            name: '产出总重',
+            type: 'line',
+            data: outTotalWeightData,
+            yAxisIndex: 1,
+          },
+          {
+            name: '消耗数量',
+            type: 'line',
+            data: lossCountData,
+            yAxisIndex: 0,
+          },
+          {
+            name: '消耗总重',
+            type: 'line',
+            data: lossTotalWeightData,
+            yAxisIndex: 1,
+          }
+        ]
+      }
+
+      // 应用配置项
+      this.monthChart.setOption(option)
+
+      // 监听窗口大小变化
+      window.addEventListener('resize', () => {
+        this.monthChart.resize()
+      })
+    },
+    // 导出
+    exportData() {
+      if (this.list.length === 0) {
+        this.$message.warning('暂无数据可导出')
+        return
+      }
+      // 格式化日期用于文件名
+      const startDate = this.queryParams.byCreateTimeStart.split(' ')[0];
+      const endDate = this.queryParams.byCreateTimeEnd.split(' ')[0];
+      this.download('wms/materialCoil/export', {
+        coilIds: this.list.map(item => item.coilId).join(',')
+      }, `materialCoil_${startDate}_${endDate}_${new Date().getTime()}.xlsx`)
+    },
+    exportLossData() {
+      if (this.lossList.length === 0) {
+        this.$message.warning('暂无数据可导出')
+        return
+      }
+      // 格式化日期用于文件名
+      const startDate = this.queryParams.byCreateTimeStart.split(' ')[0];
+      const endDate = this.queryParams.byCreateTimeEnd.split(' ')[0];
+      this.download('wms/materialCoil/export', {
+        coilIds: this.lossList.map(item => item.coilId).join(',')
+      }, `materialCoil_${startDate}_${endDate}_${new Date().getTime()}.xlsx`)
+    },
+    // 保存产出报表
+    saveOutputReport() {
+      this.loading = true
+      saveReportFile(this.list.map(item => item.coilId).join(','), {
+        reportParams: this.queryParams,
+        reportType: '产出报表,综合报表',
+        productionLine: this.productionLine,
+      }).then(res => {
+        this.$message({
+          message: '保存成功',
+          type: 'success',
+        })
+      }).catch(err => {
+        this.$message({
+          message: '保存失败',
+          type: 'error',
+        })
+      }).finally(() => {
+        this.loading = false
+      })
+    },
+    // 保存消耗报表
+    saveLossReport() {
+      this.loading = true
+      saveReportFile(this.lossList.map(item => item.coilId).join(','), {
+        reportParams: this.queryParams,
+        reportType: '消耗报表,综合报表',
+        productionLine: this.productionLine,
+      }).then(res => {
+        this.$message({
+          message: '保存成功',
+          type: 'success',
+        })
+      }).catch(err => {
+        this.$message({
+          message: '保存失败',
+          type: 'error',
+        })
+      }).finally(() => {
+        this.loading = false
+      })
+    },
+  },
+  mounted() {
+    this.handleQuery()
+    this.loadColumns()
+  }
+}
+</script>
+
+<style scoped></style>
\ No newline at end of file