This commit is contained in:
zlwu committed 2026-05-22 12:40:22 +08:00
1 parent 320f7e75f0
commit 53d3b21f57
41 files changed
+10854 -7752

No files matched your search

@@ -39,7 +39,7 @@
<div class="section-title">
<div class="section-title-left"><h3>基本信息</h3></div>
</div>
<div class="form-grid">
<div class="form-grid form-grid--col4">
<el-form-item label="协议号" prop="protocolNo">
<el-select
v-model="formData.protocolNoId"
@@ -110,89 +110,89 @@
</el-form-item>
</div>
<!-- 协议附件 -->
<el-form-item label="协议附件" style="margin-top: 18px">
<div class="attachment-upload">
<div class="attachment-list">
<el-upload
ref="attachmentUploadRef"
:auto-upload="false"
:show-file-list="false"
:multiple="true"
accept="image/*,video/*,.pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.txt,.zip,.rar"
@change="handleAttachmentChange"
>
<div class="upload-card">
<el-icon :size="28" color="#10b981"><Plus /></el-icon>
<span class="upload-card-text">上传附件</span>
</div>
</el-upload>
<div
v-for="(file, index) in formData.attachments"
:key="file.id || index"
class="attachment-item"
:class="{ 'is-uploading': file._uploading }"
>
<div
class="attachment-preview"
@click="
isImageFile(file) && file.fileUrl
? handlePreviewAttachment(file)
: undefined
"
<div class="form-grid form-grid--col2 basic-remark-attach-row">
<el-form-item label="备注">
<el-input
v-model="formData.remark"
type="textarea"
:rows="3"
placeholder="可选"
/>
</el-form-item>
<el-form-item label="协议附件">
<div class="attachment-upload">
<div class="attachment-list">
<el-upload
ref="attachmentUploadRef"
:auto-upload="false"
:show-file-list="false"
:multiple="true"
accept="image/*,video/*,.pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.txt,.zip,.rar"
@change="handleAttachmentChange"
>
<template v-if="isImageFile(file) && file.fileUrl">
<img :src="fullFileUrl(file.fileUrl)" :alt="file.fileName" />
</template>
<template v-else-if="isImageFile(file) && !file.fileUrl">
<el-icon :size="24" color="#94a3b8"><Loading /></el-icon>
</template>
<template v-else-if="isVideoFile(file)">
<div class="attachment-preview__icon attachment-preview__icon--video">
<el-icon :size="28"><VideoPlay /></el-icon>
<div class="upload-card">
<el-icon :size="28" color="#10b981"><Plus /></el-icon>
<span class="upload-card-text">上传附件</span>
</div>
</el-upload>
<div
v-for="(file, index) in formData.attachments"
:key="file.id || index"
class="attachment-item"
:class="{ 'is-uploading': file._uploading }"
>
<div
class="attachment-preview"
@click="
isImageFile(file) && file.fileUrl
? handlePreviewAttachment(file)
: undefined
"
>
<template v-if="isImageFile(file) && file.fileUrl">
<img :src="fullFileUrl(file.fileUrl)" :alt="file.fileName" />
</template>
<template v-else-if="isImageFile(file) && !file.fileUrl">
<el-icon :size="24" color="#94a3b8"><Loading /></el-icon>
</template>
<template v-else-if="isVideoFile(file)">
<div class="attachment-preview__icon attachment-preview__icon--video">
<el-icon :size="28"><VideoPlay /></el-icon>
</div>
</template>
<template v-else>
<div class="attachment-preview__icon attachment-preview__icon--doc">
<el-icon :size="28"><Document /></el-icon>
</div>
</template>
</div>
<div class="attachment-footer">
<span class="attachment-name" :title="file.fileName">{{
file.fileName
}}</span>
<div class="attachment-actions">
<el-icon
class="action-btn"
title="下载"
@click="handleDownloadAttachment(file)"
><Download
/></el-icon>
<el-icon
class="action-btn action-btn--danger"
title="删除"
@click="removeAttachment(index)"
><Delete
/></el-icon>
</div>
</template>
<template v-else>
<div class="attachment-preview__icon attachment-preview__icon--doc">
<el-icon :size="28"><Document /></el-icon>
</div>
</template>
</div>
<div class="attachment-footer">
<span class="attachment-name" :title="file.fileName">{{
file.fileName
}}</span>
<div class="attachment-actions">
<el-icon
class="action-btn"
title="下载"
@click="handleDownloadAttachment(file)"
><Download
/></el-icon>
<el-icon
class="action-btn action-btn--danger"
title="删除"
@click="removeAttachment(index)"
><Delete
/></el-icon>
</div>
</div>
</div>
<span class="upload-hint"
>支持图片、视频、PDF、Word、Excel等文件,单文件不超过 20MB</span
>
</div>
<span class="upload-hint"
>支持图片、视频、PDF、Word、Excel等文件,单文件不超过 20MB</span
>
</div>
</el-form-item>
<el-form-item label="备注">
<el-input
v-model="formData.remark"
type="textarea"
:rows="3"
placeholder="可选"
/>
</el-form-item>
</el-form-item>
</div>
</div>
</div>
@@ -527,7 +527,7 @@
</el-button>
</div>
</div>
<div class="form-grid">
<div class="form-grid form-grid--col4">
<el-form-item label="样本类型">
<el-select
v-model="row.sampleTypeId"
@@ -749,7 +749,7 @@
<!-- 缴费主表 -->
<div class="payment-main-card">
<div class="section-subtitle">缴费主表</div>
<div class="form-grid">
<div class="form-grid form-grid--col5">
<el-form-item label="缴费模式">
<el-radio-group v-model="formData.payMode" @change="onPayModeChange">
<el-radio label="dj">趸交</el-radio>
@@ -872,7 +872,7 @@
</div>
<div v-show="detail._expanded" class="detail-body">
<div class="detail-body-inner">
<div class="form-grid">
<div class="form-grid form-grid--col4">
<el-form-item label="应缴费金额(元)">
<el-input
v-model="detail.dueAmount"
@@ -3008,6 +3008,22 @@
&--col2 {
grid-template-columns: repeat(2, 1fr);
}
&--col4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
&--col5 {
grid-template-columns: repeat(5, minmax(0, 1fr));
}
:deep(.el-form-item) {
margin-bottom: 0;
}
}
.basic-remark-attach-row {
margin-top: 16px;
}
.form-col-span-2 {
@@ -3516,6 +3532,18 @@
&--col2 {
grid-template-columns: 1fr;
}
&--col4 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
&--col5 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
&--col2.basic-remark-attach-row {
grid-template-columns: 1fr;
}
}
.client-sub-cards {