From bd1deebf5dba50cc661c000f88046ef6f2eed1ba Mon Sep 17 00:00:00 2001
From: qiankanghui <kanghui.qian@xujiesoft.com>
Date: Fri, 29 May 2026 17:05:58 +0800
Subject: [PATCH] =?UTF-8?q?feat(quality):=20=E6=B7=BB=E5=8A=A0=E8=B4=A8?=
 =?UTF-8?q?=E9=87=8F=E6=A8=A1=E5=9D=97=E9=97=AE=E9=A2=98=E9=99=84=E4=BB=B6?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=E5=92=8C=E8=AF=A6=E6=83=85=E5=B1=95=E7=A4=BA?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增质量模块问题附件组件，支持上传、下载、删除操作
- 实现质量模块问题详情展示组件，显示问题基本信息和处理流程
- 添加检验申请列表页面，支持多条件查询和批量操作
- 集成附件管理功能到检验申请流程中，完善文档管理机制
---
 .../inspection/inspectionRequestList.vue      |  22 +-
 .../quality/com_qualityIssueAttachment.vue    | 266 ++++++
 .../quality/com_qualityIssueDetail.vue        | 209 +++++
 .../modules/quality/qualityIssueList.vue      | 772 ++++++++++++++++++
 4 files changed, 1257 insertions(+), 12 deletions(-)
 create mode 100644 src/views/modules/quality/com_qualityIssueAttachment.vue
 create mode 100644 src/views/modules/quality/com_qualityIssueDetail.vue
 create mode 100644 src/views/modules/quality/qualityIssueList.vue

diff --git a/src/views/modules/inspection/inspectionRequestList.vue b/src/views/modules/inspection/inspectionRequestList.vue
index 0b79397..3aabee4 100644
--- a/src/views/modules/inspection/inspectionRequestList.vue
+++ b/src/views/modules/inspection/inspectionRequestList.vue
@@ -96,14 +96,12 @@
       </el-table-column>
       <el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
         <template slot-scope="scope">
-          <el-link v-if="scope.row.status === '草稿' || scope.row.statusDb === 'Draft'"
-                   style="cursor: pointer; color: #409EFF; margin-right: 10px;"
-                   @click="confirmInspection(scope.row)">确认</el-link>
-          <el-link v-if="(scope.row.status === '草稿' || scope.row.statusDb === 'Draft') ||
-                         (scope.row.status === '已确认' || scope.row.statusDb === 'Confirmed')"
-                   style="cursor: pointer; color: #F56C6C;"
-                   @click="deleteInspectionRequest(scope.row)">删除</el-link>
-          <span v-else style="color: #909399;">{{ scope.row.status }}</span>
+          <a v-if="scope.row.status === '草稿' || scope.row.statusDb === 'Draft'"
+             class="customer-a" @click="confirmInspection(scope.row)">确认 |</a>
+          <a v-if="(scope.row.status === '草稿' || scope.row.statusDb === 'Draft') ||
+                   (scope.row.status === '已确认' || scope.row.statusDb === 'Confirmed')"
+             class="customer-a" @click="deleteInspectionRequest(scope.row)">删除</a>
+          <span v-else class="customer-a" style="color: #909399; cursor: default;">{{ scope.row.status }}</span>
         </template>
       </el-table-column>
     </el-table>
@@ -137,14 +135,14 @@
       <el-tab-pane label="验货结果" name="result">
         <inspection-result-tab ref="resultTab" :detail-data="currentRow" :table-height="detailHeight" />
       </el-tab-pane>
-      <!-- 附件管理 -->
-      <el-tab-pane label="附件管理" name="attachment">
-        <inspection-request-attachment-tab ref="attachmentTab" :detail-data="currentRow" :table-height="detailHeight" />
-      </el-tab-pane>
       <!-- 费用明细 -->
       <el-tab-pane label="费用明细" name="fee">
         <inspection-request-fee-tab ref="feeTab" :detail-data="currentRow" :table-height="detailHeight" />
       </el-tab-pane>
+      <!-- 附件管理 -->
+      <el-tab-pane label="附件管理" name="attachment">
+        <inspection-request-attachment-tab ref="attachmentTab" :detail-data="currentRow" :table-height="detailHeight" />
+      </el-tab-pane>
     </el-tabs>
 
     <!-- 新增弹窗 -->
diff --git a/src/views/modules/quality/com_qualityIssueAttachment.vue b/src/views/modules/quality/com_qualityIssueAttachment.vue
new file mode 100644
index 0000000..a8aa956
--- /dev/null
+++ b/src/views/modules/quality/com_qualityIssueAttachment.vue
@@ -0,0 +1,266 @@
+<template>
+  <div class="customer-css">
+    <!-- 操作按钮 -->
+    <el-form :inline="true" style="margin-bottom: 2px;">
+      <el-button type="primary" icon="el-icon-upload" @click="handleUpload" :disabled="!searchData.issueNo">上传附件</el-button>
+    </el-form>
+
+    <!-- 附件文件列表表格 -->
+    <el-table
+      :data="fileList"
+      :height="tableHeight"
+      border
+      v-loading="loading"
+      style="width: 100%;">
+      <el-table-column
+        type="index"
+        label="序号"
+        width="80"
+        align="center" />
+      <el-table-column
+        prop="fileName"
+        label="附件名称"
+        min-width="250"
+        show-overflow-tooltip />
+      <el-table-column
+        prop="createdBy"
+        label="创建人"
+        width="120"
+        align="center" />
+      <el-table-column
+        prop="createDate"
+        label="创建时间"
+        width="160"
+        align="center" />
+      <el-table-column
+        label="操作"
+        width="150"
+        align="center"
+        fixed="right">
+        <template slot-scope="scope">
+          <el-link type="primary" @click="handleDownload(scope.row)">查看 |</el-link>
+          <el-link type="danger" @click="handleRemove(scope.row)">删除</el-link>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 上传附件弹窗 -->
+    <el-dialog title="上传附件" :visible.sync="ossVisible" width="450px" append-to-body :close-on-click-modal="false">
+      <el-form ref="form" :model="ossForm" label-width="80px" label-position="top">
+        <el-form-item label=" " class="auto">
+          <el-upload
+            drag
+            :file-list="uploadFileList"
+            action="#"
+            ref="upload"
+            :on-remove="onRemoveFile"
+            :on-change="onChangeFile"
+            multiple
+            :auto-upload="false">
+            <i class="el-icon-upload"></i>
+            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" :loading="uploadLoading" @click="submitData">确定</el-button>
+        <el-button @click="ossVisible = false">取消</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { queryOssFilePlus, removeOss, previewOssFileById } from '@/api/oss/oss'
+import { ossUploadNoSaveOSSForYJY } from '@/api/oss/oss'
+
+export default {
+  name: 'QualityIssueAttachment',
+
+  props: {
+    detailData: {
+      type: Object,
+      default: () => ({})
+    },
+    tableHeight: {
+      type: Number,
+      default: 400
+    }
+  },
+
+  data() {
+    return {
+      fileList: [],
+      loading: false,
+      searchData: {
+        issueNo: '',
+        site: ''
+      },
+      ossVisible: false,
+      uploadLoading: false,
+      uploadFileList: [],
+      ossForm: {
+        remark: ''
+      }
+    }
+  },
+
+  watch: {
+    // 监听 detailData 变化，触发查询
+    detailData: {
+      handler(newVal) {
+        if (newVal && newVal.issueNo) {
+          this.searchData.issueNo = newVal.issueNo
+          this.searchData.site = newVal.site || ''
+          this.searchTable()
+        } else {
+          this.fileList = []
+        }
+      },
+      deep: true,
+      immediate: true
+    }
+  },
+
+  methods: {
+    // 查询附件列表
+    searchTable() {
+      if (!this.searchData.issueNo) {
+        this.fileList = []
+        return
+      }
+
+      console.log('当前 searchData:', this.searchData)
+      this.loading = true
+      let params = {
+        orderRef1: this.searchData.site,
+        orderRef2: this.searchData.issueNo,
+        orderRef3: '',
+        orderReftype: 'QualityIssueAttachment'
+      }
+      console.log('查询附件参数:', params)
+
+      queryOssFilePlus(params).then(({ data }) => {
+        console.log('查询附件返回:', data)
+        if (data && data.code === 0) {
+          this.fileList = data.rows || []
+          console.log('附件列表:', this.fileList)
+        } else {
+          this.fileList = []
+        }
+        this.loading = false
+      }).catch((error) => {
+        console.error('查询附件失败:', error)
+        this.loading = false
+      })
+    },
+
+    // 打开上传弹窗
+    handleUpload() {
+      this.$nextTick(() => {
+        if (this.$refs.upload) {
+          this.$refs.upload.clearFiles()
+        }
+      })
+      this.uploadFileList = []
+      this.ossForm.remark = ''
+      this.ossVisible = true
+    },
+
+    // 移除文件
+    onRemoveFile(file, fileList) {
+      this.uploadFileList = fileList
+    },
+
+    // 文件选择变化
+    onChangeFile(file, fileList) {
+      this.uploadFileList = fileList
+    },
+
+    // 提交上传
+    submitData() {
+      if (this.uploadFileList.length === 0) {
+        this.$message.error('请选择文件')
+        return
+      }
+
+      this.uploadLoading = true
+
+      let formData = new FormData()
+      for (let i = 0; i < this.uploadFileList.length; i++) {
+        formData.append('file', this.uploadFileList[i].raw)
+      }
+      formData.append('orderRef1', this.searchData.site)
+      formData.append('orderRef2', this.searchData.issueNo)
+      formData.append('orderRef3', '')
+      formData.append('createdBy', this.$store.state.user.name)
+      formData.append('fileRemark', this.ossForm.remark || '')
+      formData.append('orderReftype', 'QualityIssueAttachment')
+
+      ossUploadNoSaveOSSForYJY(formData).then(({ data }) => {
+        if (data && data.code === 0) {
+          this.$message.success('上传成功')
+          this.searchTable()
+          this.ossVisible = false
+        } else {
+          this.$message.warning(data.msg || '上传失败')
+        }
+        this.uploadLoading = false
+      }).catch((error) => {
+        this.$message.error('上传失败')
+        this.uploadLoading = false
+      })
+    },
+
+    // 查看文件
+    handleDownload(row) {
+      let params = {
+        id: row.id
+      }
+      previewOssFileById(params).then((response) => {
+        const blob = new Blob([response.data], { type: response.headers['content-type'] })
+        const link = document.createElement('a')
+        link.href = URL.createObjectURL(blob)
+        link.setAttribute('download', row.fileName)
+        link.target = '_blank'
+        link.click()
+        URL.revokeObjectURL(link.href)
+      })
+    },
+
+    // 删除文件
+    handleRemove(row) {
+      this.$confirm('确定要删除该附件吗？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        let ids = [row.id]
+        removeOss(ids).then(({ data }) => {
+          if (data && data.code === 0) {
+            this.$message.success('删除成功')
+            this.searchTable()
+          } else {
+            this.$message.warning(data.msg || '删除失败')
+          }
+        }).catch((error) => {
+          this.$message.error('删除失败')
+        })
+      }).catch(() => {})
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.customer-css {
+  padding: 0;
+  margin: 0;
+  background: #fff;
+}
+
+.auto /deep/ .el-form-item__content {
+  height: auto;
+  line-height: 1.5;
+}
+</style>
diff --git a/src/views/modules/quality/com_qualityIssueDetail.vue b/src/views/modules/quality/com_qualityIssueDetail.vue
new file mode 100644
index 0000000..ae4281f
--- /dev/null
+++ b/src/views/modules/quality/com_qualityIssueDetail.vue
@@ -0,0 +1,209 @@
+<template>
+  <div class="detail-container">
+
+    <!-- 第一行 -->
+    <div class="detail-row">
+
+      <div class="detail-item">
+        <span class="label">反馈单号：</span>
+        <span class="value">{{ detailData.issueNo }}</span>
+      </div>
+
+      <div class="detail-item">
+        <span class="label">问题日期：</span>
+        <span class="value">{{ formatDate(detailData.issueDate) }}</span>
+      </div>
+
+      <div class="detail-item">
+        <span class="label">供应商编码：</span>
+        <span class="value">{{ detailData.supplierNo }}</span>
+      </div>
+
+      <div class="detail-item long">
+        <span class="label">供应商名称：</span>
+        <span class="value">{{ detailData.supplierName }}</span>
+      </div>
+
+    </div>
+
+    <!-- 第二行 -->
+    <div class="detail-row">
+
+      <div class="detail-item">
+        <span class="label">问题分类：</span>
+        <span class="value">{{ detailData.issueCategory }}</span>
+      </div>
+
+      <div class="detail-item long">
+        <span class="label">问题简述：</span>
+        <span class="value">{{ detailData.issueSummary }}</span>
+      </div>
+
+    </div>
+
+    <!-- 第三行 - 问题详细描述 -->
+    <div class="detail-row full-width">
+      <span class="label">问题详细描述：</span>
+      <div class="value textarea">{{ detailData.issueDescription }}</div>
+    </div>
+
+    <!-- 第四行 -->
+    <div class="detail-row">
+
+      <div class="detail-item">
+        <span class="label">录入人：</span>
+        <span class="value">{{ detailData.createBy }}</span>
+      </div>
+
+      <div class="detail-item">
+        <span class="label">录入时间：</span>
+        <span class="value">{{ detailData.createDate }}</span>
+      </div>
+
+      <div class="detail-item">
+        <span class="label">要求回复日期：</span>
+        <span class="value">{{ formatDate(detailData.requireReplyDate) }}</span>
+      </div>
+
+      <div class="detail-item">
+        <span class="label">状态：</span>
+        <span class="value">{{ detailData.status }}</span>
+      </div>
+
+    </div>
+
+    <!-- 第五行 - 原因分析 -->
+    <div class="detail-row full-width">
+      <span class="label">原因分析：</span>
+      <div class="value textarea">{{ detailData.causeAnalysis }}</div>
+    </div>
+
+    <!-- 第六行 - 后续措施 -->
+    <div class="detail-row full-width">
+      <span class="label">后续措施：</span>
+      <div class="value textarea">{{ detailData.followUpMeasures }}</div>
+    </div>
+
+    <!-- 第七行 -->
+    <div class="detail-row">
+
+      <div class="detail-item">
+        <span class="label">回复人：</span>
+        <span class="value">{{ detailData.replyBy }}</span>
+      </div>
+
+      <div class="detail-item">
+        <span class="label">回复时间：</span>
+        <span class="value">{{ detailData.replyTime }}</span>
+      </div>
+
+    </div>
+
+    <!-- 第八行 -->
+    <div class="detail-row">
+
+      <div class="detail-item">
+        <span class="label">关闭人：</span>
+        <span class="value">{{ detailData.closedBy }}</span>
+      </div>
+
+      <div class="detail-item">
+        <span class="label">关闭时间：</span>
+        <span class="value">{{ detailData.closedTime }}</span>
+      </div>
+
+    </div>
+
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'QualityIssueDetail',
+
+  props: {
+    detailData: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+
+  methods: {
+    // 格式化日期，只显示年月日
+    formatDate (dateStr) {
+      if (!dateStr) return ''
+      // 如果包含时分秒，截取前10位
+      if (dateStr.length > 10) {
+        return dateStr.substring(0, 10)
+      }
+      return dateStr
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+.detail-container {
+  padding: 15px 20px;
+  border: 1px solid #dcdfe6;
+  background: #fff;
+}
+
+.detail-row {
+  display: flex;
+  align-items: center;
+  margin-bottom: 18px;
+}
+
+.detail-row.full-width {
+  flex-direction: column;
+  align-items: flex-start;
+
+  .label {
+    margin-bottom: 8px;
+  }
+}
+
+.detail-item {
+  display: flex;
+  align-items: center;
+  width: 300px;
+  margin-right: 30px;
+}
+
+.detail-item.long {
+  width: 450px;
+}
+
+.label {
+  color: #606266;
+  font-size: 14px;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.value {
+  flex: 1;
+  min-height: 28px;
+  line-height: 28px;
+  padding: 0 10px;
+  border: 1px solid #dcdfe6;
+  background: #fff;
+  color: #303133;
+  font-size: 14px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.value.textarea {
+  width: 100%;
+  min-height: 60px;
+  line-height: 1.5;
+  padding: 10px;
+  white-space: pre-wrap;
+  word-break: break-all;
+}
+
+</style>
diff --git a/src/views/modules/quality/qualityIssueList.vue b/src/views/modules/quality/qualityIssueList.vue
new file mode 100644
index 0000000..ce82187
--- /dev/null
+++ b/src/views/modules/quality/qualityIssueList.vue
@@ -0,0 +1,772 @@
+<template>
+  <div class="customer-css">
+    <!-- 查询条件 -->
+    <el-form :inline="true" label-position="top" class="search-form-inline">
+      <div class="search-row">
+        <el-form-item label="供应商编码" class="search-item">
+          <el-input v-model="searchData.supplierNo" style="width: 120px" @keyup.enter.native="getMainData"/>
+        </el-form-item>
+        <el-form-item label="供应商名称" class="search-item">
+          <el-input v-model="searchData.supplierName" style="width: 200px" @keyup.enter.native="getMainData"/>
+        </el-form-item>
+        <el-form-item label="反馈单号" class="search-item">
+          <el-input v-model="searchData.issueNo" style="width: 120px" @keyup.enter.native="getMainData"/>
+        </el-form-item>
+        <el-form-item label="问题日期" class="search-item">
+          <el-date-picker
+            v-model="searchData.issueDate"
+            type="date"
+            value-format="yyyy-MM-dd"
+            placeholder="选择日期"
+            style="width: 150px"
+            clearable>
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="状态" class="search-item">
+          <el-select v-model="searchData.statusDb" clearable placeholder="全部" style="width: 100%">
+            <el-option label="全部" value="" />
+            <el-option label="已确认" value="Confirmed" />
+            <el-option label="已分析" value="Analyzed" />
+            <el-option label="已关闭" value="Closed" />
+            <el-option label="已取消" value="Cancelled" />
+          </el-select>
+        </el-form-item>
+
+      </div>
+
+      <div class="search-row">
+        <el-form-item label=" " class="search-item search-btn-item">
+          <el-button type="primary" @click="getMainData" class="customer-bun-min">查询</el-button>
+          <el-button type="primary" @click="addQualityIssue" class="customer-bun-min">新增</el-button>
+          <el-button type="primary" @click="exportExcel" class="customer-bun-min">导出</el-button>
+        </el-form-item>
+      </div>
+    </el-form>
+
+    <el-table
+      :height="height"
+      :data="mainDataList"
+      border
+      ref="mainTable"
+      highlight-current-row
+      @row-click="changeData"
+      v-loading="dataListLoading"
+      style="margin-top: 0px; width: 100%;">
+      <el-table-column
+        v-for="(item,index) in columnArray1" :key="index"
+        :sortable="item.columnSortable"
+        :prop="item.columnProp"
+        :header-align="item.headerAlign"
+        :show-overflow-tooltip="item.showOverflowTooltip"
+        :align="item.align"
+        :fixed="item.fixed==''?false:item.fixed"
+        :min-width="item.columnWidth"
+        :label="item.columnLabel">
+        <template slot-scope="scope">
+          <span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
+          <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]"
+                                             style="width: 100px; height: 100px"/></span>
+        </template>
+      </el-table-column>
+      <el-table-column fixed="right" header-align="center" align="center" width="180" label="操作">
+        <template slot-scope="scope">
+          <a class="customer-a" @click="editQualityIssue(scope.row)">编辑 |</a>
+          <a class="customer-a" @click="deleteQualityIssue(scope.row)">删除 |</a>
+          <a class="customer-a" @click="replyQualityIssue(scope.row)">回复</a>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页插件 -->
+    <el-pagination style="margin-top: 0px"
+                   @size-change="sizeChangeHandle"
+                   @current-change="currentChangeHandle"
+                   :current-page="pageIndex"
+                   :page-sizes="[20, 50, 100, 200, 500]"
+                   :page-size="pageSize"
+                   :total="totalPage"
+                   layout="total, sizes, prev, pager, next, jumper">
+    </el-pagination>
+
+    <!-- 详情页签 -->
+    <el-tabs v-model="activeTab" style="margin-top: 0px; width: 99%;" @tab-click="handleTabClick" class="customer-tab" type="border-card">
+      <!-- 详情 -->
+      <el-tab-pane label="详情" name="detail">
+        <quality-issue-detail :detail-data="currentRow" />
+      </el-tab-pane>
+      <!-- 附件 -->
+      <el-tab-pane label="附件" name="attachment">
+        <quality-issue-attachment :detail-data="currentRow" :table-height="detailHeight" />
+      </el-tab-pane>
+    </el-tabs>
+
+    <!-- 新增弹窗 -->
+    <el-dialog
+      title="质量问题 - 新增"
+      :visible.sync="addDialogVisible"
+      width="45%"
+      top="10vh"
+      :close-on-click-modal="false"
+      @close="handleCloseAddDialog">
+
+      <el-form :model="addFormData" :rules="addRules" ref="addFormData" label-width="110px" size="mini" class="add-dialog-form">
+        <!-- 第一行 -->
+        <el-row :gutter="10">
+          <el-col :span="8">
+            <el-form-item label="反馈单号">
+              <el-input v-model="addFormData.issueNo" placeholder="自动生成" disabled size="mini"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="问题日期" prop="issueDate">
+              <el-date-picker
+                v-model="addFormData.issueDate"
+                type="date"
+                value-format="yyyy-MM-dd"
+                placeholder="选择日期"
+                size="mini"
+                style="width: 100%">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="要求回复日期" prop="requireReplyDate">
+              <el-date-picker
+                v-model="addFormData.requireReplyDate"
+                type="date"
+                value-format="yyyy-MM-dd"
+                placeholder="选择日期"
+                size="mini"
+                style="width: 100%">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <!-- 第二行 -->
+        <el-row :gutter="10">
+          <el-col :span="8">
+            <el-form-item label="供应商编码" prop="supplierNo">
+              <el-input v-model="addFormData.supplierNo" placeholder="请选择" readonly @click.native="selectSupplier" size="mini">
+                <i slot="suffix" class="el-icon-search" style="cursor: pointer;"></i>
+              </el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商名称">
+              <el-input v-model="addFormData.supplierName" disabled size="mini"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <!-- 第三行 -->
+        <el-row :gutter="10">
+          <el-col :span="8">
+            <el-form-item label="问题分类" prop="issueCategory">
+              <el-select v-model="addFormData.issueCategory" placeholder="请选择" size="mini" style="width: 100%">
+                <el-option label="产品外观" value="产品外观"></el-option>
+                <el-option label="产品性能" value="产品性能"></el-option>
+                <el-option label="尺寸不符" value="尺寸不符"></el-option>
+                <el-option label="材质问题" value="材质问题"></el-option>
+                <el-option label="包装破损" value="包装破损"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <!-- 第四行 -->
+        <el-row :gutter="10">
+          <el-col :span="24">
+            <el-form-item label="问题简述" prop="issueSummary">
+              <el-input v-model="addFormData.issueSummary" placeholder="请输入问题简述" size="mini"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <!-- 第五行 -->
+        <el-row :gutter="10">
+          <el-col :span="24">
+            <el-form-item label="问题详细描述">
+              <el-input
+                v-model="addFormData.issueDescription"
+                type="textarea"
+                :rows="4"
+                placeholder="请输入问题详细描述"
+                size="mini">
+              </el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="handleSaveAdd" class="customer-bun-min">保存</el-button>
+        <el-button @click="handleCloseAddDialog" class="customer-bun-min">关闭</el-button>
+      </div>
+    </el-dialog>
+
+    <Chooselist ref="baseList" @getBaseData="getBaseData"></Chooselist>
+  </div>
+</template>
+
+<script>
+import { queryQualityIssuePage, saveQualityIssue } from '@/api/quality/qualityIssue.js'
+import Chooselist from '@/views/modules/common/Chooselist_eam'
+import ComQualityIssueDetail from './com_qualityIssueDetail.vue'
+import ComQualityIssueAttachment from './com_qualityIssueAttachment.vue'
+import excel from '@/utils/excel-util.js'
+
+export default {
+  components: {
+    Chooselist,
+    QualityIssueDetail: ComQualityIssueDetail,
+    QualityIssueAttachment: ComQualityIssueAttachment
+  },
+  data () {
+    return {
+      functionId: this.$route.meta.menuId,
+      height: 400,
+      detailHeight: 400,
+      currentRow: {},
+      activeTab: 'detail',
+      // 新增弹窗相关数据
+      addDialogVisible: false,
+      addFormData: {
+        issueNo: '',
+        issueDate: '',
+        requireReplyDate: '',
+        supplierNo: '',
+        supplierName: '',
+        issueCategory: '',
+        issueSummary: '',
+        issueDescription: ''
+      },
+      addRules: {
+        issueDate: [
+          { required: true, message: '请选择问题日期', trigger: 'change' }
+        ],
+        requireReplyDate: [
+          { required: true, message: '请选择要求回复日期', trigger: 'change' }
+        ],
+        supplierNo: [
+          { required: true, message: '请选择供应商', trigger: 'change' }
+        ],
+        issueCategory: [
+          { required: true, message: '请选择问题分类', trigger: 'change' }
+        ],
+        issueSummary: [
+          { required: true, message: '请输入问题简述', trigger: 'blur' }
+        ]
+      },
+      tagNo: '',
+      searchData: {
+        issueNo: '',
+        supplierNo: '',
+        supplierName: '',
+        issueCategory: '',
+        statusDb: '',
+        issueDate: '',
+        page: 1,
+        limit: 50
+      },
+      searchType: '',
+      pageIndex: 1,
+      pageSize: 50,
+      totalPage: 0,
+      mainDataList: [],
+      dataListLoading: false,
+      columnArray1: [
+        {
+          userId: this.$store.state.user.name,
+          functionId: this.functionId,
+          serialNumber: 'QualityIssueTable1IssueNo',
+          tableId: 'QualityIssueTable1',
+          tableName: '质量问题',
+          columnProp: 'issueNo',
+          headerAlign: 'center',
+          align: 'left',
+          columnLabel: '反馈单号',
+          columnWidth: '120',
+          columnHidden: false,
+          columnImage: false,
+          columnSortable: false,
+          sortLv: 0,
+          status: true,
+          fixed: false
+        },
+        {
+          userId: this.$store.state.user.name,
+          functionId: this.functionId,
+          serialNumber: 'QualityIssueTable1IssueDate',
+          tableId: 'QualityIssueTable1',
+          tableName: '质量问题',
+          columnProp: 'issueDate',
+          headerAlign: 'center',
+          align: 'center',
+          columnLabel: '问题日期',
+          columnWidth: '120',
+          columnHidden: false,
+          columnImage: false,
+          columnSortable: false,
+          sortLv: 0,
+          status: true,
+          fixed: false
+        },
+        {
+          userId: this.$store.state.user.name,
+          functionId: this.functionId,
+          serialNumber: 'QualityIssueTable1SupplierNo',
+          tableId: 'QualityIssueTable1',
+          tableName: '质量问题',
+          columnProp: 'supplierNo',
+          headerAlign: 'center',
+          align: 'left',
+          columnLabel: '供应商编码',
+          columnWidth: '120',
+          columnHidden: false,
+          columnImage: false,
+          columnSortable: false,
+          sortLv: 0,
+          status: true,
+          fixed: false
+        },
+        {
+          userId: this.$store.state.user.name,
+          functionId: this.functionId,
+          serialNumber: 'QualityIssueTable1SupplierName',
+          tableId: 'QualityIssueTable1',
+          tableName: '质量问题',
+          columnProp: 'supplierName',
+          headerAlign: 'center',
+          align: 'left',
+          columnLabel: '供应商名称',
+          columnWidth: '150',
+          columnHidden: false,
+          columnImage: false,
+          columnSortable: false,
+          sortLv: 0,
+          status: true,
+          fixed: false
+        },
+        {
+          userId: this.$store.state.user.name,
+          functionId: this.functionId,
+          serialNumber: 'QualityIssueTable1IssueCategory',
+          tableId: 'QualityIssueTable1',
+          tableName: '质量问题',
+          columnProp: 'issueCategory',
+          headerAlign: 'center',
+          align: 'left',
+          columnLabel: '问题分类',
+          columnWidth: '120',
+          columnHidden: false,
+          columnImage: false,
+          columnSortable: false,
+          sortLv: 0,
+          status: true,
+          fixed: false
+        },
+        {
+          userId: this.$store.state.user.name,
+          functionId: this.functionId,
+          serialNumber: 'QualityIssueTable1IssueSummary',
+          tableId: 'QualityIssueTable1',
+          tableName: '质量问题',
+          columnProp: 'issueSummary',
+          headerAlign: 'center',
+          align: 'left',
+          columnLabel: '问题简述',
+          columnWidth: '200',
+          columnHidden: false,
+          columnImage: false,
+          columnSortable: false,
+          sortLv: 0,
+          status: true,
+          fixed: false
+        },
+        {
+          userId: this.$store.state.user.name,
+          functionId: this.functionId,
+          serialNumber: 'QualityIssueTable1Status',
+          tableId: 'QualityIssueTable1',
+          tableName: '质量问题',
+          columnProp: 'status',
+          headerAlign: 'center',
+          align: 'center',
+          columnLabel: '状态',
+          columnWidth: '100',
+          columnHidden: false,
+          columnImage: false,
+          columnSortable: false,
+          sortLv: 0,
+          status: true,
+          fixed: false
+        },
+        {
+          userId: this.$store.state.user.name,
+          functionId: this.functionId,
+          serialNumber: 'QualityIssueTable1CreateBy',
+          tableId: 'QualityIssueTable1',
+          tableName: '质量问题',
+          columnProp: 'createBy',
+          headerAlign: 'center',
+          align: 'left',
+          columnLabel: '录入人',
+          columnWidth: '100',
+          columnHidden: false,
+          columnImage: false,
+          columnSortable: false,
+          sortLv: 0,
+          status: true,
+          fixed: false
+        },
+        {
+          userId: this.$store.state.user.name,
+          functionId: this.functionId,
+          serialNumber: 'QualityIssueTable1CreateDate',
+          tableId: 'QualityIssueTable1',
+          tableName: '质量问题',
+          columnProp: 'createDate',
+          headerAlign: 'center',
+          align: 'center',
+          columnLabel: '录入时间',
+          columnWidth: '150',
+          columnHidden: false,
+          columnImage: false,
+          columnSortable: false,
+          sortLv: 0,
+          status: true,
+          fixed: false
+        }
+      ]
+    }
+  },
+  mounted () {
+    this.$nextTick(() => {
+      this.height = (window.innerHeight - 220) / 2
+      this.detailHeight = (window.innerHeight - 220) / 2
+      this.getMainData()
+    })
+  },
+  methods: {
+    // 获取基础数据列表
+    getBaseList (val, type) {
+      this.tagNo = val
+      this.searchType = type || ''
+      this.$nextTick(() => {
+        let strVal = ''
+        let conSql = ''
+        if (val === 1100) {
+          strVal = this.addFormData.supplierNo || ''
+          conSql = " and site = '" + this.$store.state.user.site + "'"
+        }
+        this.$refs.baseList.init(val, strVal, conSql)
+      })
+    },
+
+    /* 列表方法的回调 */
+    getBaseData (val) {
+      if (this.tagNo === 1100) {
+        // 新增弹窗：使用下划线命名的字段，使用$set确保响应式
+        this.$set(this.addFormData, 'supplierNo', val.supplier_no || '')
+        this.$set(this.addFormData, 'supplierName', val.supplier_name || '')
+      }
+    },
+    // 查询数据
+    getMainData () {
+      this.searchData.limit = this.pageSize
+      this.searchData.page = this.pageIndex
+      this.searchData.site = this.$store.state.user.site
+      this.dataListLoading = true
+
+      queryQualityIssuePage(this.searchData).then(({ data }) => {
+        if (data.code === 0) {
+          this.mainDataList = data.page.list
+          this.pageIndex = data.page.currPage
+          this.pageSize = data.page.pageSize
+          this.totalPage = data.page.totalCount
+
+          this.$nextTick(() => {
+            if (this.$refs.mainTable) {
+              this.$refs.mainTable.clearSelection()
+            }
+          })
+
+          // 判断是否有数据
+          if (this.mainDataList.length > 0) {
+            this.$refs.mainTable.setCurrentRow(this.mainDataList[0])
+            this.changeData(this.mainDataList[0])
+          } else {
+            this.changeData(null)
+          }
+        }
+        this.dataListLoading = false
+      }).catch(() => {
+        this.dataListLoading = false
+      })
+    },
+
+    // 每页数
+    sizeChangeHandle (val) {
+      this.pageSize = val
+      this.pageIndex = 1
+      this.getMainData()
+    },
+
+    // 当前页
+    currentChangeHandle (val) {
+      this.pageIndex = val
+      this.getMainData()
+    },
+
+    // 页签点击事件
+    handleTabClick (tab) {
+      // 每次点击页签都触发对应页签的查询
+      if (tab.name === 'detail') {
+        // 详情页签
+      } else if (tab.name === 'attachment') {
+        // 附件页签
+        this.$nextTick(() => {
+          if (this.$refs.attachmentTab) {
+            this.$refs.attachmentTab.loadAttachmentList()
+          }
+        })
+      }
+    },
+
+    // 行点击事件
+    changeData (row) {
+      this.currentRow = row ? JSON.parse(JSON.stringify(row)) : {}
+    },
+
+    // 新增质量问题
+    addQualityIssue () {
+      this.addDialogVisible = true
+      this.resetAddForm()
+    },
+
+    // 关闭新增弹窗
+    handleCloseAddDialog () {
+      this.addDialogVisible = false
+      this.resetAddForm()
+    },
+
+    // 重置表单
+    resetAddForm () {
+      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')
+      const todayStr = `${year}-${month}-${day}`
+
+      this.addFormData = {
+        issueNo: '',
+        issueDate: todayStr,
+        requireReplyDate: '',
+        supplierNo: '',
+        supplierName: '',
+        issueCategory: '',
+        issueSummary: '',
+        issueDescription: ''
+      }
+      if (this.$refs.addFormData) {
+        this.$refs.addFormData.clearValidate()
+      }
+    },
+
+    // 选择供应商
+    selectSupplier () {
+      this.tagNo = 1100
+      this.$nextTick(() => {
+        const conSql = " and site = '" + this.$store.state.user.site + "'"
+        this.$refs.baseList.init(1100, this.addFormData.supplierNo || '', conSql)
+      })
+    },
+
+    // 保存新增
+    handleSaveAdd () {
+      this.$refs.addFormData.validate((valid) => {
+        if (valid) {
+          // 构建提交数据
+          const submitData = {
+            issueDate: this.addFormData.issueDate,
+            requireReplyDate: this.addFormData.requireReplyDate,
+            supplierNo: this.addFormData.supplierNo,
+            supplierName: this.addFormData.supplierName,
+            issueCategory: this.addFormData.issueCategory,
+            issueSummary: this.addFormData.issueSummary,
+            issueDescription: this.addFormData.issueDescription,
+            site: this.$store.state.user.site
+          }
+
+          console.log('提交数据：', submitData)
+
+          saveQualityIssue(submitData).then(({ data }) => {
+            console.log('保存接口返回：', data)
+            if (data.code === 0) {
+              this.$message.success('保存成功')
+              this.handleCloseAddDialog()
+              this.getMainData()
+            } else {
+              this.$message.error(data.msg || '保存失败')
+            }
+          }).catch((error) => {
+            console.error('保存接口错误：', error)
+            this.$message.error('保存失败，请稍后重试')
+          })
+        } else {
+          console.log('表单验证失败')
+          this.$message.warning('请填写完整的表单信息')
+        }
+      })
+    },
+
+    // 编辑质量问题
+    editQualityIssue (row) {
+      this.$message.info('编辑功能开发中...')
+    },
+
+    // 删除质量问题
+    deleteQualityIssue (row) {
+      this.$confirm('确定要删除该质量问题吗?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$message.info('删除功能开发中...')
+      }).catch(() => {
+        this.$message.info('已取消删除')
+      })
+    },
+
+    // 回复质量问题
+    replyQualityIssue (row) {
+      this.$message.info('回复功能开发中...')
+    },
+
+    // 导出
+    exportExcel () {
+      console.log('开始导出...')
+
+      // 生成文件名（使用原生 Date）
+      const now = new Date()
+      const year = now.getFullYear()
+      const month = String(now.getMonth() + 1).padStart(2, '0')
+      const day = String(now.getDate()).padStart(2, '0')
+      const hour = String(now.getHours()).padStart(2, '0')
+      const minute = String(now.getMinutes()).padStart(2, '0')
+      const second = String(now.getSeconds()).padStart(2, '0')
+      const exportName = `质量问题${year}${month}${day}${hour}${minute}${second}`
+
+      console.log('导出参数:', this.searchData)
+
+      // 获取当前查询条件
+      const exportParams = {
+        ...this.searchData,
+        limit: -1,  // 导出全部数据
+        page: 1
+      }
+
+      try {
+        excel.exportTable({
+          url: '/srm/qualityIssue/queryPage',
+          columnMapping: this.columnArray1,
+          mergeSetting: [],
+          params: exportParams,
+          fileName: exportName + '.xlsx',
+          rowFetcher: res => {
+            console.log('导出数据响应:', res)
+            return res.data.page.list
+          },
+          columnFormatter: [],
+          dropColumns: []
+        })
+        console.log('导出请求已发送')
+      } catch (error) {
+        console.error('导出失败:', error)
+        this.$message.error('导出失败: ' + error.message)
+      }
+    }
+  },
+  created () {
+    this.getMainData()
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+.search-form-inline {
+  background: #fff;
+}
+
+.search-row {
+  display: flex;
+  align-items: flex-end;
+  flex-wrap: nowrap;
+  gap: 15px;
+}
+
+.search-item {
+  flex: none;
+  margin-bottom: 10px;
+}
+
+.search-btn-item {
+  flex: none;
+  margin-bottom: 10px;
+}
+
+.search-btn-item /deep/ .el-form-item__content {
+  line-height: normal;
+}
+
+.search-item /deep/ .el-form-item__label {
+  font-size: 13px;
+  color: #606266;
+  padding-bottom: 5px;
+  line-height: 1;
+  height: auto;
+}
+
+.search-item /deep/ .el-form-item__content {
+  line-height: normal;
+}
+
+.date-range {
+  display: flex;
+  align-items: center;
+}
+
+.split {
+  padding: 0 6px;
+  color: #606266;
+  font-size: 13px;
+}
+
+/deep/ .customer-tab .el-tabs__content {
+  padding: 5px !important;
+}
+
+.add-dialog-form /deep/ .el-form-item {
+  margin-bottom: 10px;
+}
+
+.add-dialog-form /deep/ .el-form-item__label {
+  text-align: left;
+  float: none;
+  display: block;
+  padding: 0 0 5px 0;
+  line-height: 1;
+  font-size: 13px;
+}
+
+.add-dialog-form /deep/ .el-form-item__content {
+  margin-left: 0 !important;
+}
+
+.dialog-footer {
+  text-align: center;
+}
+
+</style>