From af931abceb636ebdb7980f3d54d3186c2a534f85 Mon Sep 17 00:00:00 2001
From: panxinyu-YUYwp <youremail@example.com>
Date: Tue, 22 Sep 2026 14:17:45 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=90=88=E5=90=8C=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E5=8A=9F=E8=83=BD(=E5=A2=9E=E5=88=A0=E6=94=B9?=
 =?UTF-8?q?=E6=9F=A5=E5=AF=BC=E5=87=BA)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/contract/contract.js        |   16 +
 src/api/oss/oss.js                  |    2 +-
 src/views/modules/contract/info.vue | 1001 +++++++++++++++++++++++++++
 3 files changed, 1018 insertions(+), 1 deletion(-)
 create mode 100644 src/api/contract/contract.js
 create mode 100644 src/views/modules/contract/info.vue

diff --git a/src/api/contract/contract.js b/src/api/contract/contract.js
new file mode 100644
index 0000000..517ed59
--- /dev/null
+++ b/src/api/contract/contract.js
@@ -0,0 +1,16 @@
+import { createAPI } from "@/utils/httpRequest.js";
+
+// 合同分页查询
+export const contractData = data => createAPI(`/contract/contractData`, 'post', data)
+
+// 合同新增/编辑保存
+export const contractSave = data => createAPI(`/contract/contractSave`, 'post', data)
+
+// 合同删除
+export const contractDelete = data => createAPI(`/contract/contractDelete`, 'post', data)
+
+// 客户下拉列表（复用已有的 projectInfo 接口）
+export const getCustomerList = () => createAPI(`/projectInfo/getCustomerList`, 'get')
+
+// 根据客户ID获取项目下拉列表（仅未结案项目）
+export const getProjectListByCustomer = customerId => createAPI(`/contract/getProjectListByCustomer/${customerId}`, 'get')
diff --git a/src/api/oss/oss.js b/src/api/oss/oss.js
index 77c1e1e..bb48a84 100644
--- a/src/api/oss/oss.js
+++ b/src/api/oss/oss.js
@@ -1,3 +1,3 @@
 import { createAPI } from "@/utils/httpRequest.js";
 
-export const updateOssRef = data => createAPI(`/sys/oss/updateOssRef`,'post',data)
+export const updateOssRef = data => createAPI(`/sys/oss/updateOssRef`, 'post', data)
diff --git a/src/views/modules/contract/info.vue b/src/views/modules/contract/info.vue
new file mode 100644
index 0000000..c6c3dc3
--- /dev/null
+++ b/src/views/modules/contract/info.vue
@@ -0,0 +1,1001 @@
+<template>
+  <div class="contract-maintenance">
+    <!-- 查询和按钮区 -->
+    <el-form inline>
+      <el-form-item label="合同号">
+        <el-input v-model="searchData.contractNo" placeholder="请输入" size="small"
+                  style="width: 140px;margin-top: 2px" clearable></el-input>
+      </el-form-item>
+      <el-form-item label="客户名称">
+        <el-select filterable v-model="searchData.customerId" clearable size="small" style="width: 200px;">
+          <el-option :label="item.customerName" :value="item.id"
+                     v-for="(item,index) in customerListOptions" :key="index"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="往来单位类型">
+        <el-select v-model="searchData.partnerType" clearable size="small" placeholder="请选择" style="width: 100px;">
+          <el-option label="供应商" value="供应商"></el-option>
+          <el-option label="客户" value="客户"></el-option>
+          <el-option label="其他" value="其他"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="合同日期">
+        <el-date-picker v-model="searchData.startDate" type="date" format="yyyy-MM-dd"
+                        value-format="yyyy-MM-dd" placeholder="开始日期" size="small"
+                        style="width: 100px;"></el-date-picker>
+        <span style="margin: 0 4px;">~</span>
+        <el-date-picker v-model="searchData.endDate" type="date" format="yyyy-MM-dd"
+                        value-format="yyyy-MM-dd" placeholder="结束日期" size="small"
+                        style="width: 100px;"></el-date-picker>
+      </el-form-item>
+      <el-form-item label="有效期至">
+        <el-date-picker v-model="searchData.validEndDate" type="date" format="yyyy-MM-dd"
+                        value-format="yyyy-MM-dd" placeholder="请选择" size="small"
+                        style="width: 100px;"></el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="searchContract">查询</el-button>
+        <el-button @click="resetSearch" style="margin-left: 10px;">重置</el-button>
+        <el-button type="primary" @click="openAddContractModal" style="margin-left: 10px;">新增</el-button>
+        <el-button @click="exportContract" style="margin-left: 10px;">导出</el-button>
+      </el-form-item>
+    </el-form>
+
+    <!-- 合同信息列表 -->
+    <el-table :data="contractList" border :height="height" style="width: 100%;">
+      <el-table-column prop="contractNo" header-align="center" align="center" min-width="120" label="合同号" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="customerName" header-align="center" align="left" min-width="180" label="客户名称" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="projectName" header-align="center" align="left" min-width="150" label="项目名称" show-overflow-tooltip></el-table-column>
+      <el-table-column prop="contractDate" header-align="center" align="center" min-width="100" label="合同日期"></el-table-column>
+      <el-table-column prop="contractAmount" header-align="center" align="right" min-width="100" label="合同金额"></el-table-column>
+      <el-table-column prop="currency" header-align="center" align="center" min-width="70" label="货币"></el-table-column>
+      <el-table-column prop="versionNo" header-align="center" align="center" min-width="80" label="版本号"></el-table-column>
+      <el-table-column prop="partnerType" header-align="center" align="center" min-width="100" label="往来单位类型"></el-table-column>
+      <el-table-column prop="validStartDate" header-align="center" align="center" min-width="110" label="有效期起始"></el-table-column>
+      <el-table-column prop="validEndDate" header-align="center" align="center" min-width="110" label="有效期终止"></el-table-column>
+      <el-table-column prop="remark" header-align="center" align="left" min-width="120" label="备注" show-overflow-tooltip></el-table-column>
+      <el-table-column fixed="right" header-align="center" align="center" width="130" label="操作">
+        <template slot-scope="scope">
+          <a type="text" size="small" @click="editContract(scope.row)">编辑</a>
+          <a type="text" size="small" @click="deleteContract(scope.row)">删除</a>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页栏 -->
+    <el-pagination
+      @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>
+
+    <!-- 隐藏的导出组件：由 exportContract 方法触发 -->
+    <download-excel
+      ref="exportExcel"
+      :data="exportList"
+      :fields="exportFields"
+      name="合同列表.xls"
+      style="display:none">
+      导出
+    </download-excel>
+
+    <!-- 合同新增/编辑模态框 -->
+    <el-dialog
+      :title="contractModalTitle"
+      :visible.sync="showContractModal"
+      width="760px"
+      :before-close="beforeCloseContractModal"
+      :close-on-click-modal="false">
+
+      <el-form :inline="true" label-position="top" :model="contractForm" style="margin-left:7px; margin-top:-5px; font-size: 0;">
+        <!-- 表单字段：统一宽度自动换行（4列），控件宽度由底部样式统一控制 -->
+        <el-form-item label="客户名称" required class="wide-item">
+          <el-select filterable v-model="contractForm.customerId" placeholder="请选择" size="small"
+                     style="font-size:12px; height:30px;width: 200px"
+                     :disabled="isEditContract"
+                     @change="customerChange">
+            <el-option :label="item.customerName" :value="item.id"
+                       v-for="(item,index) in customerListOptions" :key="index"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="项目名称" required class="wide-item">
+          <el-select filterable v-model="contractForm.projectId" :placeholder="contractForm.customerId ? '请选择项目' : '请先选择客户'" size="small"
+                     style="font-size:12px; height:30px;width: 200px"
+                     :disabled="!contractForm.customerId || isEditContract">
+            <el-option :label="item.projectName" :value="item.id"
+                       v-for="(item,index) in projectListOptions" :key="index"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="合同日期" required>
+          <el-date-picker v-model="contractForm.contractDate" type="date" format="yyyy-MM-dd"
+                          value-format="yyyy-MM-dd" placeholder="选择日期" size="small"
+                          class="customer-css"
+                          style="width: 160px"
+                          :prefix-icon="''"
+                          @change="contractDateChange">
+          </el-date-picker>
+        </el-form-item>
+
+        <el-form-item label="合同号" required>
+          <el-input v-model="contractForm.contractNo" size="small" placeholder="手工录入"
+                    @input="handleContractNoInput"
+                    style="font-size:12px; height:30px;width: 200px"></el-input>
+        </el-form-item>
+        <el-form-item label="合同金额">
+          <el-input v-model="contractForm.contractAmount" placeholder="请输入金额" size="small"
+                    style="font-size:12px; height:30px;width: 200px"
+                    @input="handleAmountInput"></el-input>
+        </el-form-item>
+        <el-form-item label="货币">
+          <el-select v-model="contractForm.currency" placeholder="请选择" size="small"
+                     style="font-size:12px; height:30px;width: 160px">
+            <el-option label="CNY" value="CNY"></el-option>
+            <el-option label="USD" value="USD"></el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="版本号">
+          <el-input v-model="contractForm.versionNo" size="small"
+                    style="font-size:12px; height:30px;width: 200px"></el-input>
+        </el-form-item>
+        <el-form-item label="版本描述">
+          <el-input v-model="contractForm.contactVersionOverview" size="small"
+                    style="font-size:12px; height:30px;width: 200px"></el-input>
+        </el-form-item>
+        <el-form-item label="有效期起始">
+          <el-date-picker v-model="contractForm.validStartDate" type="date" format="yyyy-MM-dd"
+                          value-format="yyyy-MM-dd" placeholder="选择日期" size="small"
+                          class="customer-css"
+                          style="width: 200px"
+                          :prefix-icon="''">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="有效期终止">
+          <el-date-picker v-model="contractForm.validEndDate" type="date" format="yyyy-MM-dd"
+                          value-format="yyyy-MM-dd" placeholder="选择日期" size="small"
+                          class="customer-css"
+                          style="width: 200px"
+                          :prefix-icon="''">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="往来单位类型">
+          <el-select v-model="contractForm.partnerType" placeholder="请选择" size="small"
+                     style="font-size:12px; height:30px;width: 160px">
+            <el-option label="供应商" value="供应商"></el-option>
+            <el-option label="客户" value="客户"></el-option>
+            <el-option label="其他" value="其他"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="合同经手人">
+          <el-input v-model="contractForm.contractPerson" size="small"
+                    style="font-size:12px; height:30px;width: 160px"></el-input>
+        </el-form-item>
+        <el-form-item label="客户经手人">
+          <el-input v-model="contractForm.partnerPerson" size="small"
+                    style="font-size:12px; height:30px;width: 160px"></el-input>
+        </el-form-item>
+        <!-- 主要内容 / 付款条款 / 备注：用普通div布局，避免主题把label吃掉 -->
+        <div style="width: 708px; margin-bottom: 10px;">
+          <div style="font-size: 12px; color: #606266; margin-bottom: 4px;">主要内容</div>
+          <el-input v-model="contractForm.mainContent" type="textarea" :rows="3"
+                    style="width: 100%;"></el-input>
+        </div>
+
+<!--        <div style="width: 724px; margin-bottom: 10px;">-->
+<!--          <div style="font-size: 12px; color: #606266; margin-bottom: 4px;">付款条款</div>-->
+<!--          <el-input v-model="contractForm.paymentTerms" type="textarea" :rows="3"-->
+<!--                    style="width: 100%;"></el-input>-->
+<!--        </div>-->
+
+        <div style="width: 708px; margin-bottom: 10px;">
+          <div style="font-size: 12px; color: #606266; margin-bottom: 4px;">备注</div>
+          <el-input v-model="contractForm.remark" type="textarea" :rows="3"
+                    style="width: 100%;"></el-input>
+        </div>
+
+        <!-- 附件上传 + 已上传附件列表（老系统样式） -->
+        <div style="width: 708px; margin-bottom: 10px;">
+          <div style="display: flex; align-items: center; margin-bottom: 6px;">
+            <span style="font-size: 12px; color: #606266;">上传文件</span>
+            <el-upload
+              ref="contractUpload"
+              :action="uploadUrl"
+              :show-file-list="false"
+              :auto-upload="false"
+              :on-change="onFileChange"
+              :on-success="uploadSuccessHandle"
+              :on-error="uploadErrorHandle"
+              multiple
+              style="display: inline-block; margin: 0 10px;">
+              <el-button size="mini" type="primary" plain>选择文件</el-button>
+            </el-upload>
+            <span v-if="pendingFiles.length === 0" style="font-size: 12px; color: #909399;">未选择任何文件</span>
+            <!-- 已选待上传文件列表：可预览、可删除 -->
+            <div v-else style="display: inline-flex; flex-direction: column; font-size: 12px;">
+              <div v-for="(f, idx) in pendingFiles" :key="idx"
+                   style="display: flex; align-items: center; margin-bottom: 2px;">
+                <span style="color: #606266; max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"
+                      :title="f.name">{{ f.name }}</span>
+                <a style="margin-left: 8px; color: #409EFF;" @click="previewPendingFile(f)">预览</a>
+                <a style="margin-left: 8px; color: #F56C6C;" @click="removePendingFile(idx)">删除</a>
+              </div>
+            </div>
+            <span v-if="pendingFiles.length > 0"
+                  style="font-size: 12px; color: #E6A23C; margin-left: 10px;">附件将随合同保存时一并上传</span>
+          </div>
+
+          <!-- 待上传文件预览弹窗 -->
+          <el-dialog :visible.sync="previewVisible" append-to-body width="70%"
+                     :title="previewName" style="margin-top: -8vh;">
+            <img v-if="previewType === 'image'" :src="previewUrl" style="width: 100%;"/>
+            <iframe v-else-if="previewType === 'pdf'" :src="previewUrl" frameborder="0"
+                    width="100%" height="600"></iframe>
+            <div v-else style="text-align: center; padding: 30px; color: #909399;">
+              该文件类型不支持预览，请下载后查看
+            </div>
+          </el-dialog>
+
+          <!-- 上传信息：仅编辑时显示（新增合同还没有历史附件） -->
+          <div v-if="isEditContract" style="font-size: 12px; color: #606266; margin-bottom: 4px;">上传信息</div>
+          <el-table v-if="isEditContract" :data="attachmentList" border size="mini" style="width: 708px;"
+                    :header-cell-style="{background:'#d4e8e8', color:'#333'}">
+            <el-table-column prop="fileName" header-align="center" align="left" label="文件名称" show-overflow-tooltip></el-table-column>
+            <el-table-column prop="fileSuffix" header-align="center" align="center" width="90" label="文件类型"></el-table-column>
+            <el-table-column prop="createdBy" header-align="center" align="center" width="100" label="上传人"></el-table-column>
+            <el-table-column header-align="center" align="center" width="140" label="操作">
+              <template slot-scope="scope">
+                <a type="text" size="small" @click="previewAttachment(scope.row)">预览</a>
+                <a type="text" size="small" style="margin-left: 8px;" @click="downloadAttachment(scope.row)">下载</a>
+                <a type="text" size="small" style="margin-left: 8px;" @click="deleteAttachment(scope.row)">删除</a>
+              </template>
+            </el-table-column>
+            <template slot="empty">
+              <span style="color:#909399; font-size:12px;">暂无附件</span>
+            </template>
+          </el-table>
+        </div>
+      </el-form>
+
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="closeContractModal">取消</el-button>
+        <el-button type="primary" @click="saveContract">保存</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { contractData, contractSave, contractDelete, getCustomerList, getProjectListByCustomer } from '@/api/contract/contract.js'
+import { updateOssRef } from '@/api/oss/oss.js'
+import axios from "axios";
+import Vue from "vue";
+
+export default {
+  components: {},
+  data() {
+    return {
+      height: 600,
+      searchData: {
+        contractNo: '',
+        customerId: null,
+        partnerType: '',
+        startDate: '',
+        endDate: '',
+        validEndDate: '',
+        page: 1,
+        limit: 20
+      },
+      contractList: [],
+      exportList: [],
+      exportFields: {
+        '合同号': 'contractNo',
+        '客户名称': 'customerName',
+        '项目名称': 'projectName',
+        '合同日期': 'contractDate',
+        '合同金额': 'contractAmount',
+        '货币': 'currency',
+        '版本号': 'versionNo',
+        '往来单位类型': 'partnerType',
+        '有效期起始': 'validStartDate',
+        '有效期终止': 'validEndDate',
+        '备注': 'remark'
+      },
+      pageIndex: 1,
+      pageSize: 20,
+      totalPage: 0,
+      showContractModal: false,
+      contractModalTitle: '',
+      isEditContract: false,
+      customerListOptions: [],
+      projectListOptions: [],
+      attachmentList: [],
+      uploadUrl: '',
+      pendingFiles: [],
+      selectedFileNames: '',
+      uploadTotal: 0,
+      uploadDone: 0,
+      closeModalAfterUpload: false,
+      uploading: false,
+      previewVisible: false,
+      previewUrl: '',
+      previewType: '',
+      previewName: '',
+      contractForm: {
+        id: null,
+        customerId: null,
+        projectId: null,
+        contractDate: '',
+        contractNo: '',
+        contractAmount: null,
+        currency: 'CNY',
+        versionNo: '',
+        contactVersionOverview: '',
+        partnerType: '',
+        validStartDate: '',
+        validEndDate: '',
+        contractPerson: '',
+        partnerPerson: '',
+        mainContent: '',
+        paymentTerms: '',
+        remark: ''
+      }
+    }
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.height = window.innerHeight - 180
+    })
+  },
+  created() {
+    this.initData()
+  },
+  methods: {
+    resetSearch() {
+      this.searchData = {
+        contractNo: '',
+        customerId: null,
+        partnerType: '',
+        startDate: '',
+        endDate: '',
+        validEndDate: '',
+        page: 1,
+        limit: this.pageSize
+      }
+      this.fetchContracts()
+    },
+    initData() {
+      this.fetchContracts()
+      this.fetchCustomerOptions()
+      // 附件上传地址：主目录"系统文件" + 子目录"合同"
+      this.uploadUrl = this.$http.adornUrl(`/ftp/file/upload?token=${this.$cookie.get('token')}&folder=` + encodeURIComponent('系统文件/合同'))
+    },
+    // 查询合同列表
+    fetchContracts() {
+      this.searchData.page = this.pageIndex
+      this.searchData.limit = this.pageSize
+      contractData(this.searchData).then(({data}) => {
+        if (data.code === 0) {
+          this.contractList = data.page.list
+          this.totalPage = data.page.totalCount
+        } else {
+          this.contractList = []
+          this.totalPage = 0
+        }
+      }).catch(err => {
+        console.error(err)
+      })
+    },
+    searchContract() {
+      this.pageIndex = 1
+      this.fetchContracts()
+    },
+    // 导出：按当前查询条件拉全部数据，再触发隐藏的 downloadExcel 组件
+    exportContract() {
+      if (!this.totalPage) {
+        this.$message.warning('没有可导出的数据')
+        return
+      }
+      const params = Object.assign({}, this.searchData, { page: 1, limit: this.totalPage })
+      contractData(params).then(({data}) => {
+        if (data.code === 0 && data.page.list.length) {
+          this.exportList = data.page.list
+          this.$nextTick(() => {
+            this.$refs.exportExcel.$el.click()
+          })
+        } else {
+          this.$message.warning('没有可导出的数据')
+        }
+      }).catch(err => {
+        console.error(err)
+        this.$message.error('导出失败')
+      })
+    },
+    // 客户下拉选项
+    fetchCustomerOptions() {
+      getCustomerList().then(({data}) => {
+        if (data && data.code === 0) {
+          this.customerListOptions = data.rows
+        }
+      }).catch(err => {
+        console.error(err)
+      })
+    },
+    // 弹窗里客户变化：清空已选项目，加载该客户未结案项目
+    customerChange(customerId) {
+      this.contractForm.projectId = null
+      this.projectListOptions = []
+      if (customerId) {
+        getProjectListByCustomer(customerId).then(({data}) => {
+          if (data && data.code === 0) {
+            this.projectListOptions = data.rows
+          }
+        }).catch(err => {
+          console.error(err)
+        })
+      }
+    },
+    // 合同日期变化：有效期起始默认等于合同日期（需求：默认一样，但可修改）
+    contractDateChange(val) {
+      if (!this.contractForm.validStartDate) {
+        this.contractForm.validStartDate = val
+      }
+    },
+    // 每页数
+    sizeChangeHandle(val) {
+      this.pageSize = val
+      this.pageIndex = 1
+      this.fetchContracts()
+    },
+    // 当前页
+    currentChangeHandle(val) {
+      this.pageIndex = val
+      this.fetchContracts()
+    },
+    // 新增
+    openAddContractModal() {
+      this.contractModalTitle = '新增合同'
+      this.isEditContract = false
+      this.projectListOptions = []
+      this.attachmentList = []
+      this.pendingFiles = []
+      this.selectedFileNames = ''
+      this.uploading = false
+      this.closeModalAfterUpload = false
+      this.contractForm = {
+        id: null,
+        customerId: null,
+        projectId: null,
+        contractDate: (() => {
+          let d = new Date()
+          let pad = n => n < 10 ? '0' + n : n
+          return d.getFullYear() + '-' + pad(d.getMonth() + 1) + '-' + pad(d.getDate())
+        })(),
+        contractNo: '',
+        contractAmount: null,
+        currency: 'CNY',
+        versionNo: '',
+        contactVersionOverview: '',
+        partnerType: '',
+        validStartDate: '',
+        validEndDate: '',
+        contractPerson: '',
+        partnerPerson: '',
+        mainContent: '',
+        paymentTerms: '',
+        remark: ''
+      }
+      this.showContractModal = true
+    },
+    // 编辑
+    editContract(row) {
+      this.contractModalTitle = '编辑合同'
+      this.isEditContract = true
+      // 重置待上传状态，避免新增弹窗里选了文件未保存时残留
+      this.pendingFiles = []
+      this.selectedFileNames = ''
+      this.uploading = false
+      this.closeModalAfterUpload = false
+      if (this.$refs.contractUpload) {
+        this.$refs.contractUpload.clearFiles()
+      }
+      this.contractForm = Object.assign({}, row)
+      this.fetchAttachments(this.contractForm.id)
+      // 编辑时加载该客户的项目列表，让项目下拉能正确回显
+      if (this.contractForm.customerId) {
+        getProjectListByCustomer(this.contractForm.customerId).then(({data}) => {
+          if (data && data.code === 0) {
+            this.projectListOptions = data.rows
+          }
+        })
+      }
+      this.showContractModal = true
+    },
+    // 合同号输入：英文小写自动转大写
+    handleContractNoInput(val) {
+      this.contractForm.contractNo = val.toUpperCase()
+    },
+    handleAmountInput(value) {
+      let filtered = value.replace(/[^\d.]/g, '')
+      let dotIndex = filtered.indexOf('.')
+      if (dotIndex !== -1) {
+        filtered = filtered.substring(0, dotIndex + 1) + filtered.substring(dotIndex + 1).replace(/\./g, '')
+      }
+      this.$nextTick(() => {
+        this.contractForm.contractAmount = filtered
+      })
+    },
+
+    // 保存前校验，返回 true/false
+    validateContract() {
+      if (this.contractForm.contractAmount !== null && this.contractForm.contractAmount !== '') {
+        let amount = Number(this.contractForm.contractAmount)
+        if (isNaN(amount) || amount <= 0) {
+          this.$message.error('合同金额必须为大于0的数字')
+          return false
+        }
+      }
+      if (!this.contractForm.customerId) {
+        this.$message.error('请选择客户')
+        return false
+      }
+      if (!this.contractForm.projectId) {
+        this.$message.error('请选择项目')
+        return false
+      }
+      if (!this.contractForm.contractDate) {
+        this.$message.error('请选择合同日期')
+        return false
+      }
+      if (!this.contractForm.contractNo || !this.contractForm.contractNo.trim()) {
+        this.$message.error('请输入合同号')
+        return false
+      }
+      this.contractForm.contractNo = this.contractForm.contractNo.trim()
+      // 有效期校验：终止日期不能早于起始日期
+      if (this.contractForm.validStartDate && this.contractForm.validEndDate
+        && this.contractForm.validEndDate < this.contractForm.validStartDate) {
+        this.$message.error('有效期终止不能早于有效期起始')
+        return false
+      }
+      return true
+    },
+
+    // 保存（点"保存"按钮：保存合同后自动上传已选附件，全部完成后关闭弹窗）
+    saveContract() {
+      if (!this.validateContract()) return
+      if (this.uploading) {
+        this.$message.warning('附件上传中，请稍候再保存')
+        return
+      }
+      let inData = Object.assign({}, this.contractForm)
+      contractSave(inData).then(({data}) => {
+        if (data && data.code === 0) {
+          if (data.id && !inData.id) {
+            this.contractForm.id = data.id
+          }
+          // 有待上传附件：先上传附件，全部完成后由 afterOneUploadFinished 关闭弹窗
+          if (this.pendingFiles.length > 0) {
+            this.$message.success('合同保存成功，开始上传附件')
+            this.fetchContracts()
+            this.startUpload()
+          } else {
+            this.$message.success('保存成功')
+            this.showContractModal = false
+            this.fetchContracts()
+          }
+        } else {
+          this.$message.error((data && data.msg) || '保存失败')
+        }
+      }).catch(err => {
+        console.error(err)
+        this.$message.error('保存失败')
+      })
+    },
+    // 删除
+    deleteContract(row) {
+      let inData = Object.assign({}, row)
+      this.$confirm('确定要删除该合同吗？', '提示', {
+        type: 'warning'
+      }).then(() => {
+        contractDelete(inData).then(({data}) => {
+          if (data && data.code === 0) {
+            this.$message.success('删除成功')
+            this.fetchContracts()
+          } else {
+            this.$message.error((data && data.msg) || '删除失败')
+          }
+        }).catch(err => {
+          console.error(err)
+          this.$message.error('删除失败')
+        })
+      }).catch(() => {})
+    },
+    // 关闭弹窗时重置表单
+    beforeCloseContractModal(done) {
+      this.closeContractModal()
+      done()
+    },
+    closeContractModal() {
+      this.showContractModal = false
+      this.isEditContract = false
+      this.projectListOptions = []
+      this.attachmentList = []
+      this.pendingFiles = []
+      this.selectedFileNames = ''
+      this.uploading = false
+      this.closeModalAfterUpload = false
+      if (this.$refs.contractUpload) {
+        this.$refs.contractUpload.clearFiles()
+      }
+      this.contractForm = {
+        id: null,
+        customerId: null,
+        projectId: null,
+        contractDate: '',
+        contractNo: '',
+        contractAmount: null,
+        currency: 'CNY',
+        versionNo: '',
+        contactVersionOverview: '',
+        partnerType: '',
+        validStartDate: '',
+        validEndDate: '',
+        contractPerson: '',
+        partnerPerson: '',
+        mainContent: '',
+        paymentTerms: '',
+        remark: ''
+      }
+    },
+    // 附件上传成功：绑定合同ID
+    uploadSuccessHandle(response, file, fileList) {
+      if (response && response.code === 0 && response.ossEntity) {
+        let ossTo = {
+          id: response.ossEntity.id,
+          orderRef1: this.contractForm.id,
+          fileType: 'contract',
+          fileTypeCode: 1,
+          fileSuffix: file.name.substring(file.name.lastIndexOf(".") + 1)
+        }
+        updateOssRef(ossTo).then(({data}) => {
+          if (data.code === 0) {
+            this.$message.success('上传成功：' + file.name)
+          } else {
+            this.$message.error(data.msg || ('附件关联失败：' + file.name))
+          }
+          this.afterOneUploadFinished()
+        }).catch(() => {
+          this.$message.error('附件关联失败：' + file.name)
+          this.afterOneUploadFinished()
+        })
+      } else {
+        this.$message.error((response && response.msg) || ('上传失败：' + file.name))
+        this.afterOneUploadFinished()
+      }
+    },
+    // 单个文件上传+绑定流程结束：计数、刷新列表，全部完成后才清空待上传列表
+    afterOneUploadFinished() {
+      this.uploadDone++
+      // 每次完成都刷新列表，保证最后一次刷新在所有文件绑定完成之后
+      this.fetchAttachments(this.contractForm.id)
+      if (this.uploadTotal > 0 && this.uploadDone >= this.uploadTotal) {
+        this.pendingFiles = []
+        this.selectedFileNames = ''
+        this.uploadTotal = 0
+        this.uploadDone = 0
+        this.uploading = false
+        // 所有 on-success 回调都已触发，此时清空才安全
+        if (this.$refs.contractUpload) {
+          this.$refs.contractUpload.clearFiles()
+        }
+        // 保存合同后自动上传的场景：全部传完才关闭弹窗、刷新列表
+        if (this.closeModalAfterUpload) {
+          this.closeModalAfterUpload = false
+          this.showContractModal = false
+          this.fetchContracts()
+        }
+      }
+    },
+    // 查询该合同的附件列表（每次重新拼 URL，确保带最新的合同ID）
+    fetchAttachments(contractId) {
+      if (!contractId) {
+        this.attachmentList = []
+        return
+      }
+      // 重新拼上传地址，让 el-upload 带上最新合同ID
+      this.uploadUrl = this.$http.adornUrl(`/ftp/file/upload?token=${this.$cookie.get('token')}&folder=` + encodeURIComponent('系统文件/合同') + '&orderRef1=' + contractId)
+      this.$http({
+        url: this.$http.adornUrl('/sys/oss/list'),
+        method: 'get',
+        params: this.$http.adornParams({
+          page: 1,
+          limit: 999,
+          orderRef1: contractId,
+          fileType: 'contract'
+        })
+      }).then(({data}) => {
+        if (data && data.code === 0) {
+          this.attachmentList = data.page.list
+        } else {
+          this.attachmentList = []
+        }
+      })
+    },
+    normalizeFileName(name) {
+      return (name || '').trim().toLowerCase()
+    },
+
+    pendingFileKey(file) {
+      let raw = file.raw || file
+      return [
+        raw.name || file.name || '',
+        raw.size == null ? '' : raw.size,
+        raw.lastModified == null ? '' : raw.lastModified
+      ].join('|')
+    },
+
+    dedupePendingFiles(fileList) {
+      let existNameSet = new Set(
+        (this.attachmentList || []).map(item => this.normalizeFileName(item.fileName))
+      )
+      let seen = new Set()
+      let uniqueList = []
+      let localDupNames = []     // 本次选择里重复
+      let uploadedDupNames = []  // 已上传附件里已有同名
+
+      ;(fileList || []).forEach(file => {
+        let raw = file.raw || file
+        let fileName = raw.name || file.name || ''
+        let localKey = this.pendingFileKey(file)
+        let nameKey = this.normalizeFileName(fileName)
+
+        // 本次选择里重复：同一个文件重复选
+        if (seen.has(localKey)) {
+          localDupNames.push(fileName)
+          return
+        }
+
+        // 已上传附件列表里已有同名文件
+        if (existNameSet.has(nameKey)) {
+          uploadedDupNames.push(fileName)
+          return
+        }
+
+        seen.add(localKey)
+        uniqueList.push(file)
+      })
+
+      if (uploadedDupNames.length > 0) {
+        this.$message.warning('当前文件已被上传，请选择其他文件：' + Array.from(new Set(uploadedDupNames)).join('、'))
+      }
+
+      if (localDupNames.length > 0) {
+        this.$message.warning('当前文件已重复选择，请选择其他文件：' + Array.from(new Set(localDupNames)).join('、'))
+      }
+
+      return uniqueList
+    },
+
+    syncUploadFiles(uniqueList) {
+      this.$nextTick(() => {
+        if (this.$refs.contractUpload) {
+          this.$refs.contractUpload.uploadFiles = (uniqueList || []).slice()
+        }
+      })
+    },
+    // 选择文件：只记录待上传文件，绝不触发合同保存；附件随"保存"一并上传
+    onFileChange(file, fileList) {
+      let uniqueList = this.dedupePendingFiles(fileList)
+      this.setPending(uniqueList)
+      this.syncUploadFiles(uniqueList)
+    },
+    // 清空待上传列表
+    resetPending() {
+      this.pendingFiles = []
+      this.selectedFileNames = ''
+      this.previewVisible = false
+      if (this.$refs.contractUpload) {
+        this.$refs.contractUpload.clearFiles()
+      }
+    },
+    // 预览待上传文件（本地对象URL，不走后端）
+    previewPendingFile(file) {
+      let raw = file.raw
+      if (!raw) return
+      let name = raw.name || file.name || ''
+      let suffix = name.substring(name.lastIndexOf('.') + 1).toLowerCase()
+      if (this.previewUrl) {
+        URL.revokeObjectURL(this.previewUrl)
+      }
+      this.previewUrl = URL.createObjectURL(raw)
+      this.previewName = name
+      if (['jpg', 'jpeg', 'png', 'gif', 'bmp'].indexOf(suffix) > -1) {
+        this.previewType = 'image'
+      } else if (suffix === 'pdf') {
+        this.previewType = 'pdf'
+      } else {
+        this.previewType = 'other'
+      }
+      this.previewVisible = true
+    },
+    // 删除某个待上传文件
+    removePendingFile(idx) {
+      let target = this.pendingFiles[idx]
+      if (!target) return
+      let key = this.pendingFileKey(target)
+      this.pendingFiles.splice(idx, 1)
+      let uploadFiles = this.$refs.contractUpload ? this.$refs.contractUpload.uploadFiles : []
+      let uploadIdx = uploadFiles.findIndex(f => this.pendingFileKey(f) === key)
+      if (uploadIdx > -1) {
+        uploadFiles.splice(uploadIdx, 1)
+      }
+      this.selectedFileNames = this.pendingFiles.map(f => {
+        let raw = f.raw || f
+        return raw.name || f.name
+      }).join('、')
+    },
+    setPending(fileList) {
+      // 用副本，避免和 el-upload 内部 uploadFiles 是同一个数组引用（删除时会重复删）
+      this.pendingFiles = (fileList || []).slice()
+      this.selectedFileNames = this.pendingFiles.map(f => {
+        let raw = f.raw || f
+        return raw.name || f.name
+      }).join('、')
+    },
+    // 执行实际上传（保存合同时调用，此时合同已有ID）
+    // 全部传完后由 afterOneUploadFinished 关闭弹窗并刷新列表
+    startUpload() {
+      // 上传前再过滤一次，确保 el-upload 内部 uploadFiles 也没有重复
+      let currentFiles = this.$refs.contractUpload ? this.$refs.contractUpload.uploadFiles : this.pendingFiles
+      let uniqueList = this.dedupePendingFiles(currentFiles)
+      this.setPending(uniqueList)
+      this.syncUploadFiles(uniqueList)
+      if (this.pendingFiles.length === 0) {
+        this.showContractModal = false
+        this.fetchContracts()
+        return
+      }
+      this.closeModalAfterUpload = true
+      this.uploading = true
+      // 记录本次要传的文件总数，全部回调完成后才清空列表
+      this.uploadTotal = this.pendingFiles.length
+      this.uploadDone = 0
+      this.fetchAttachments(this.contractForm.id)
+      this.$refs.contractUpload.submit()
+    },
+    // 上传失败回调
+    uploadErrorHandle(err, file, fileList) {
+      this.$message.error('上传失败：' + file.name)
+      this.afterOneUploadFinished()
+    },
+    // 预览已上传附件（从后端取文件流，按后缀设置类型后转本地URL，复用预览弹窗）
+    previewAttachment(row) {
+      let name = row.fileName || ''
+      let suffix = (row.fileSuffix || name.substring(name.lastIndexOf('.') + 1) || '').toLowerCase()
+      let mimeMap = {
+        jpg: 'image/jpeg',
+        jpeg: 'image/jpeg',
+        png: 'image/png',
+        gif: 'image/gif',
+        bmp: 'image/bmp',
+        pdf: 'application/pdf'
+      }
+      axios.get(this.$http.adornUrl('/ftp/file/downFtpFile/' + row.id), {
+        responseType: 'blob',
+        headers: {
+          'Content-Type': 'application/json',
+          'token': Vue.cookie.get('token')
+        }
+      }).then(({data}) => {
+        const blob = new Blob([data], {type: mimeMap[suffix] || 'application/octet-stream'})
+        if (this.previewUrl) {
+          URL.revokeObjectURL(this.previewUrl)
+        }
+        this.previewUrl = URL.createObjectURL(blob)
+        this.previewName = name
+        if (['jpg', 'jpeg', 'png', 'gif', 'bmp'].indexOf(suffix) > -1) {
+          this.previewType = 'image'
+        } else if (suffix === 'pdf') {
+          this.previewType = 'pdf'
+        } else {
+          this.previewType = 'other'
+        }
+        this.previewVisible = true
+      }).catch(err => {
+        console.error(err)
+        this.$message.error('预览失败：' + name)
+      })
+    },
+    // 下载附件
+    downloadAttachment(row) {
+      axios.get(this.$http.adornUrl('/ftp/file/downFtpFile/' + row.id), {
+        responseType: 'blob',
+        headers: {
+          'Content-Type': 'application/json',
+          'token': Vue.cookie.get('token')
+        }
+      }).then(({data}) => {
+        const blob = new Blob([data], {type: "application/octet-stream"})
+        const linkNode = document.createElement('a')
+        linkNode.download = row.fileName
+        linkNode.style.display = 'none'
+        linkNode.href = URL.createObjectURL(blob)
+        document.body.appendChild(linkNode)
+        linkNode.click()
+        URL.revokeObjectURL(linkNode.href)
+        document.body.removeChild(linkNode)
+      })
+    },
+    // 删除附件
+    deleteAttachment(row) {
+      this.$confirm('确定删除该附件吗？', '提示', {type: 'warning'}).then(() => {
+        this.$http({
+          url: this.$http.adornUrl('/sys/oss/delete'),
+          method: 'post',
+          data: this.$http.adornData([row.id], false)
+        }).then(({data}) => {
+          if (data && data.code === 0) {
+            this.$message.success('删除成功')
+            this.fetchAttachments(this.contractForm.id)
+          } else {
+            this.$message.error((data && data.msg) || '删除失败')
+          }
+        })
+      }).catch(err => {
+        console.error(err)
+        this.$message.error('删除失败')
+      })
+    },
+    // 时间格式化显示
+    formatDateTime(val) {
+      if (!val) return ''
+      let d = new Date(val)
+      let pad = n => n < 10 ? '0' + n : n
+      return d.getFullYear() + '-' + pad(d.getMonth() + 1) + '-' + pad(d.getDate()) +
+             ' ' + pad(d.getHours()) + ':' + pad(d.getMinutes())
+    },
+  }
+}
+</script>
+
+<style>
+.contract-maintenance {
+  margin-top: 10px;
+}
+.contract-maintenance .el-input__prefix {
+  top: 50%;
+  transform: translateY(-50%);
+  font-size: 14px;
+  height: auto;
+  line-height: 1;
+}
+.contract-maintenance .el-date-editor .el-input__inner {
+  padding-left: 28px;
+}
+.contract-maintenance .el-input__suffix {
+  top: 50%;
+  transform: translateY(-50%);
+  height: auto;
+}
+/* 弹窗表单字段：每列等宽（180px=控件170+列间距10），4列布局，消除右侧留白 */
+.contract-maintenance .el-dialog .el-form .el-form-item {
+  width: 180px;
+  margin-right: 0;
+}
+.contract-maintenance .el-dialog .el-form-item .el-input,
+.contract-maintenance .el-dialog .el-form-item .el-select {
+  width: 170px !important;
+}
+/* 客户名称/项目名称：占两列宽，一行正好排满 */
+.contract-maintenance .el-dialog .el-form .el-form-item.wide-item {
+  width: 360px;
+}
+.contract-maintenance .el-dialog .el-form-item.wide-item .el-select,
+.contract-maintenance .el-dialog .el-form-item.wide-item .el-input {
+  width: 351px !important;
+}
+</style>