新疆马铃薯 1.过程检验下载添加3个模版

gaoluyang

2026-06-02 7c2cdcbc7f5585b96fba76a07b0e4417a09c4d7e

 src/views/qualityManagement/processInspection/index.vue

@@ -2,13 +2,6 @@
  <div class="app-container">
    <div class="search_form mb20">
      <div>
        <span class="search_title">工序：</span>
        <el-input v-model="searchForm.process"
                  style="width: 240px"
                  placeholder="请输入工序搜索"
                  @change="handleQuery"
                  clearable
                  :prefix-icon="Search" />
        <span style="margin-left: 10px"
              class="search_title">检测日期：</span>
        <el-date-picker v-model="searchForm.entryDate"
@@ -18,28 +11,18 @@
                        placeholder="请选择"
                        clearable
                        @change="changeDaterange" />
        <span style="margin-left: 10px"
              class="search_title">生产工单号：</span>
        <el-input v-model="searchForm.workOrderNo"
                  style="width: 240px"
                  placeholder="请输入生产工单号搜索"
                  @change="handleQuery"
                  clearable
                  :prefix-icon="Search" />
        <el-button type="primary"
                   @click="handleQuery"
                   style="margin-left: 10px">搜索</el-button>
      </div>
      <div>
        <el-button type="primary"
                   @click="openForm('add')">新增</el-button>
        <el-button @click="handleOut">导出</el-button>
        <el-button type="danger"
                   plain
                   @click="handleDelete">删除</el-button>
      </div>
    </div>
    <div class="table_list">
       <div style="margin-bottom: 20px; text-align: right;">
      <el-button type="primary" @click="openQuickCheck">快速检验</el-button>
      <el-button type="primary" @click="openForm('add')">新增</el-button>
      <el-button @click="handleOut">导出</el-button>
      <el-button type="danger" plain @click="handleDelete">删除</el-button>
    </div>
      <PIMTable rowKey="id"
                :column="tableColumn"
                :tableData="tableData"
@@ -56,6 +39,9 @@
             @close="handleQuery"></FormDia>
    <files-dia ref="filesDia"
               @close="handleQuery"></files-dia>
    <QuickCheckDia ref="quickCheckDia"
                   @close="handleQuery"
                   @success="getList"></QuickCheckDia>
    <el-dialog v-model="dialogFormVisible"
               title="编辑检验员"
               width="30%"
@@ -85,6 +71,37 @@
        </div>
      </template>
    </el-dialog>

    <el-dialog v-model="templateDialogVisible"
               title="选择导出模板"
               width="450px"
               @close="closeTemplateDialog">
      <div class="template-grid">
        <div class="template-item" @click="handleTemplateExport('weilong')">
          <div class="template-icon weilong-icon">伟</div>
          <div class="template-name">伟龙模板</div>
        </div>
        <!-- <div class="template-item" @click="handleTemplateExport('baishi')">
          <div class="template-icon baishi-icon">百</div>
          <div class="template-name">百事模板</div>
        </div> -->
        <div class="template-item" @click="handleTemplateExport('dali')">
          <div class="template-icon dali-icon">达</div>
          <div class="template-name">达利模板</div>
        </div>
        <div class="template-item" @click="handleTemplateExport('common')">
          <div class="template-icon common-icon">通</div>
          <div class="template-name">通用模板</div>
        </div>
      </div>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="closeTemplateDialog">取消</el-button>
        </div>
      </template>
    </el-dialog>


  </div>
</template>

@@ -100,6 +117,7 @@
  } from "vue";
  import InspectionFormDia from "@/views/qualityManagement/processInspection/components/inspectionFormDia.vue";
  import FormDia from "@/views/qualityManagement/processInspection/components/formDia.vue";
  import QuickCheckDia from "@/views/qualityManagement/processInspection/components/quickCheckDia.vue";
  import { ElMessageBox } from "element-plus";
  import {
    downloadQualityInspect,
@@ -107,6 +125,10 @@
    qualityInspectListPage,
    qualityInspectUpdate,
    submitQualityInspect,
    exportWeilongTemplate,
    exportBaishiTemplate,
    exportDaliTemplate,
    exportCommonTemplate,
  } from "@/api/qualityManagement/rawMaterialInspection.js";
  import FilesDia from "@/views/qualityManagement/processInspection/components/filesDia.vue";
  import dayjs from "dayjs";
@@ -115,7 +137,6 @@

  const data = reactive({
    searchForm: {
      process: "",
      entryDate: undefined, // 录入日期
      workOrderNo: "",
      entryDateStart: undefined,
@@ -126,6 +147,7 @@
    },
  });
  const { searchForm } = toRefs(data);

  const tableColumn = ref([
    {
      label: "检测日期",
@@ -133,18 +155,13 @@
      width: 120,
    },
    {
      label: "生产工单号",
      prop: "workOrderNo",
      width: 120,
    },
    {
      label: "工序",
      prop: "process",
      width: 230,
    },
    {
      label: "检验员",
      prop: "checkName",
    },
    {
      label: "采购合同号",
      prop: "purchaseContractNo",
         width: 150,
    },
    {
      label: "产品名称",
@@ -314,8 +331,12 @@
  const formDia = ref();
  const filesDia = ref();
  const inspectionFormDia = ref();
  const quickCheckDia = ref();
  const { proxy } = getCurrentInstance();
  const userStore = useUserStore();

  const templateDialogVisible = ref(false);
  const currentExportRow = ref(null);
  const changeDaterange = value => {
    searchForm.value.entryDateStart = undefined;
    searchForm.value.entryDateEnd = undefined;
@@ -372,6 +393,26 @@
      formDia.value?.openDialog(type, row);
    });
  };

  // 打开快速检验确认框
  const openQuickCheck = () => {
    // 检查是否选择了数据
    if (!selectedRows.value || selectedRows.value.length === 0) {
      proxy.$modal.msgWarning("请先选择要检验的数据");
      return;
    }

    // 过滤出未提交的数据
    const unSubmittedRows = selectedRows.value.filter(item => item.inspectState !== 1);
    if (unSubmittedRows.length === 0) {
      proxy.$modal.msgWarning("选中的数据已全部提交，无需重复检验");
      return;
    }

    const ids = unSubmittedRows.map(item => item.id);
    quickCheckDia.value?.openDialog(ids, unSubmittedRows);
  };

  // 打开新增检验弹框
  const openInspectionForm = (type, row) => {
    nextTick(() => {
@@ -442,21 +483,51 @@
      });
  };
  const downLoadFile = row => {
    downloadQualityInspect({ id: row.id }).then(blobData => {
      const blob = new Blob([blobData], {
    currentExportRow.value = row;
    templateDialogVisible.value = true;
  };

  const closeTemplateDialog = () => {
    templateDialogVisible.value = false;
    currentExportRow.value = null;
  };

  const handleTemplateExport = async (templateType) => {
    if (!currentExportRow.value) {
      proxy.$modal.msgError("请选择要导出的数据");
      return;
    }
    const id = currentExportRow.value.id;
    const fileNameMap = {
      weilong: "伟龙模版检验结果.doc",
      baishi: "百事模版检验结果.doc",
      dali: "达利模版检验结果.doc",
      common: "通用模版检验结果.doc",
    };
    const exportFuncMap = {
      weilong: exportWeilongTemplate,
      baishi: exportBaishiTemplate,
      dali: exportDaliTemplate,
      common: exportCommonTemplate,
    };
    try {
      const response = await exportFuncMap[templateType](id);
      const blob = new Blob([response], {
        type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
      });
      const downloadUrl = window.URL.createObjectURL(blob);

      const link = document.createElement("a");
      link.href = downloadUrl;
      link.download = "过程检验报告.docx";
      link.href = URL.createObjectURL(blob);
      link.download = fileNameMap[templateType];
      document.body.appendChild(link);
      link.click();

      document.body.removeChild(link);
      window.URL.revokeObjectURL(downloadUrl);
    });
      URL.revokeObjectURL(link.href);
      proxy.$modal.msgSuccess("导出成功");
      closeTemplateDialog();
    } catch (error) {
      console.error("导出失败", error);
      proxy.$modal.msgError("导出失败");
    }
  };
  // 导出
  const handleOut = () => {
@@ -481,4 +552,64 @@
  });
</script>

<style scoped></style>
<style scoped>
.template-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  padding: 20px 10px;
}

.template-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  border: 1px solid #e4e7ed;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.3s;
}

.template-item:hover {
  border-color: #409eff;
  box-shadow: 0 2px 12px rgba(64, 158, 255, 0.2);
  transform: translateY(-2px);
}

.template-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  font-weight: bold;
  color: #fff;
  margin-bottom: 12px;
}

.weilong-icon {
  background: linear-gradient(135deg, #409eff, #1677ff);
}

.baishi-icon {
  background: linear-gradient(135deg, #67c23a, #529b2e);
}

.dali-icon {
  background: linear-gradient(135deg, #e6a23c, #c4860c);
}

.common-icon {
  background: linear-gradient(135deg, #909399, #6d6d6d);
}

.template-name {
  font-size: 15px;
  color: #303133;
  font-weight: 500;
}
</style>