b2894lxlx/tms-erp-web
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

style(attachment): 统一附件上传按钮位置及样式及提示文案格式

Browse Source 
- 将站点所有附件上传按钮移至表格下方左侧，与批量下载按钮分开，布局统一
- 统一附件上传按钮旁提示文案格式，改为同一行按钮右侧显示，间距固定30px，文本左对齐
- 统一附件上传支持文件格式说明为“支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过500M”
- 统一单个附件文件大小限制改为500M，涉及多页面文件修改
- 恢复vehicle-attachment-upload组件showTip属性门控，支持按需隐藏提示
- 修复master-order编辑页附件上传按钮与描述文字排列，改为单行且按钮左侧描述右侧排列
- 优化customer-archive客商材料上传按钮及提示的布局，按钮左、提示右，间距30px，超长文案省略
- 调整部分页面缩进与标签样式，提升视觉一致性
- 修改部分组件及页面的css样式，适配上述布局与样式调整
This commit is contained in:
赵忠林
2026-08-25 18:43:25 +08:00
parent 7c12163966
commit 3cb365253b
16 changed files with 553 additions and 176 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.workbuddy/memory/2026-08-25.md
+51
View File
@@ -82,3 +82,54 @@
- 实现：复用已有组件 `src/views/settlement/components/formal-settlement-table-panel.vue`（工具栏+表格+分页一体，通过 emit 事件与父通信），分别挂入"应付""应收"两个 `el-tab-pane` 内，共享父级 `rows/columns/loading/page/hasPermissionFn`，事件回连：@create→openCreate、@payment→openPaymentDialog、@sync→handleSync、@export→handleExport、@refresh→loadTable、@page-change→onPageChange、@action→onAction（分发 view/edit/delete/submit/approve/return/void/print）、@update:selection→selection 同步。切 tab 仍走 `handleSettlementTypeChange` 重载数据。
- 配套改动：父页 `:has-permission` 传 `hasPermissionFn`（computed 返回箭头函数，避免方法作 prop 时 this 丢失导致权限恒为 true）；`handlePrint(row)` 增加可选 row 入参；移除父页内联表格及对应 scoped 样式（.formal-page__toolbar/links/pagination）；组件操作列 width 120→320（符合 AGENTS.md >3 按钮规范）。
- 校验：@vue/compiler-sfc parse/compileTemplate 0 错误、esbuild 脚本语法 OK；`pnpm build` 因沙箱保护 dist/ 被拦截（非代码问题）。仅改 formal-settlement.vue 一个页面文件 + 组件 width。
## 临时额度管理附件上传按钮移至表格左下角
- 需求：用户截图反馈 `business/temporary-credit-limit` 新增弹窗中「上传附件」按钮在表格上方，要求统一放到附件表格左下角，与 project-apply 的项目材料交互一致。
- 改动文件：`src/views/business/temporary-credit-limit.vue`：
- 模板：将 `vehicle-attachment-upload` 从 `temporary-credit-limit-page__attachment-head` 移除，放到 `el-table` 之后的新增 `temporary-credit-limit-page__attachment-upload` 容器内；head 内只保留「批量下载」按钮。
- 样式：`&__attachment-head` 的 `justify-content` 由 `space-between` 改为 `flex-end`；新增 `&__attachment-upload` 样式，左对齐并控制上传组件宽度自适应。
- 结论：临时额度管理附件区域现与合同管理、项目材料保持一致：批量下载在表格上方右侧，上传附件在表格下方左侧。
## 项目材料上传提示文字移到按钮右侧
- 需求：用户要求 project-apply/form「上传附件」按钮支持指定格式（pdf/bmp/jpeg/png/jpg/doc/docx/ppt/pptx/xlsx/xls/eml/msg/zip）、单文件 50M，并把提示文字放到按钮后面（右侧同一行）。
- 现状：project-apply.vue 第 537-540 行早已配置 `:file-types`、`:max-size="50"` 与完整 `tip` 文案，但 vehicle-attachment-upload 组件默认把提示渲染在按钮下方。
- 修复：仅改 `&__upload` 样式，用 `:deep` 把 `.vehicle-attachment-upload` 设为 `display:flex; align-items:center`，并把 `.el-upload__tip` 由默认块级（下方）改为 `display:inline-block; margin-left:12px`，使格式/大小提示与按钮同一行、位于按钮右侧。
- 结论：project-apply 附件提示现为"上传附件按钮 + 右侧灰色提示文字"，未改动组件逻辑与其它页面。
## 附件格式说明三页统一（按钮右侧 30px / 500M）
- 需求：用户要求「支持pdf、bmp、…、zip，单个文件不超过500M」这段说明在 project-apply / temporary-credit-limit / contract-manage 三处附件上传区统一摆放：放到「上传附件」按钮右侧、间距 30px、文字左对齐；文件限制上限由 50M 改为 500M（说明与校验一致）。
- 实现（三页一致）：
- 统一 `tip` 文案：`支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过500M`。
- `:max-size`（contract-manage 为 `maxSize`）统一 500；project-apply / temporary-credit-limit 由 50→500。
- 样式：用 `:deep` 把 `.vehicle-attachment-upload` 设为 `display:flex;align-items:center`，`.el-upload__tip` 改 `display:inline-block;margin-left:30px;color:#909399;font-size:13px;text-align:left`，使说明在按钮右侧 30px、左对齐。
- contract-manage 的 AttachmentSection render 把上传按钮从表格上方 head 移到表格下方左侧（`.contract-manage-form__attachment-upload`），head 仅保留「批量下载」；同步删除失效的 `__attachment-actions` 死样式，新增 `__attachment-upload` 样式。至此三页上传按钮均位于附件表格左下角、说明在按钮右侧。
- 校验：@vue/compiler-sfc 对三文件 parse/compileScript/compileTemplate 均 OK；dev localhost:2889 HMR 已生效。
## 全站附件上传统一（vehicle-attachment-upload 组件级单一事实来源）
- 需求：把"上传附件按钮在附件表格左下角 + 按钮右侧 30px 左对齐统一说明 + 单文件 500M"方案应用到整个站点，统一风格。
- 核心做法（改 1 个组件即全站生效）：`src/components/vehicle-attachment-upload/main.vue`
- 新增常量 `UNIFIED_ATTACHMENT_TIP = '支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过500M'`；`tipText` 改为 `this.tip || UNIFIED_ATTACHMENT_TIP`（不再按 acceptText 拼装）。
- `maxSize` 默认值 `0` → `500`（说明与校验一致）。
- 模板 `v-if="showTip && ..."` 去掉 `showTip` 门控 → `v-if="tipText && !readonly"`，全站始终显示统一说明（原 `:show-tip="false"` 变为无害 no-op，未逐一清理）。
- SCSS 新增 `.vehicle-attachment-upload :deep(.el-upload){display:flex;align-items:center}` 与 `:deep(.el-upload__tip){display:inline-block;margin:0 0 0 30px;color:#909399;font-size:13px;text-align:left}`，按钮与说明内联、说明在按钮右侧 30px 左对齐。
- 表格型附件区布局对齐（上传移表格下方左侧，批量下载留表头右侧）：business-crud-page.vue（2 处 attachmentsJson-form / 派车明细附件）、contract-manage-change.vue、pre-settlement-editor.vue、master-order-editor.vue、payment-application-form.vue、invoice-application-form.vue；各页新增 `__attachment-upload` 左对齐样式、`__attachment-head` 改 `justify-content:flex-end`。
- 大小异常值修正：bill-ledger-form / bill-payment-form 的 `:max-size="10"` → 500；invoice-application-form `:max-size="50"` → 500（同时把上传从表格上方移到下方）。
- 已是下方布局无需移动（仅随组件生效）：invoice-receipt / receipt-claim-record / receipt-flow / bill-ledger / bill-payment / formal-settlement-editor（独立上传无表格）/ 各 vehicle 页（独立上传无表格）。
- 校验：@vue/compiler-sfc 对 12 个改动文件（组件 + 上述各页 + 此前已改的 project-apply/temporary-credit-limit/contract-manage）全部编译通过；grep 确认全站无残留非 500M 的附件 max-size。
## master-order 附件上传"按钮 + 描述"由两行改一行
- 需求：用户截图 `/business/master-order?mode=editor` 详情附件区，"上传附件"按钮与"支持pdf…"描述文字分别居中、各占一行，要求并到同一行（与 vehicle-attachment-upload 组件默认样式一致）。
- 根因：`master-order-editor.vue` 第 1814-1824 行 scoped CSS 把 `.master-editor__attachment-upload .el-upload` 强制 `display: inline-flex` 但未显式 `flex-wrap/align-items/text-align`；而 Element Plus 全局 `.el-upload` 默认 `text-align: center`，加 inline-flex 子元素被 EP 默认行为按各自一行居中显示。
- 修复：在 `.master-editor__attachment-upload` 内用 `:deep(.el-upload)` 显式声明 `display: inline-flex; align-items: center; flex-wrap: nowrap; text-align: left`，并 `:deep(.el-upload__tip)` 改 `display: inline-block; margin: 0 0 0 8px; color:#909399; font-size:13px; line-height:1.4; white-space:normal; text-align:left`，让按钮与说明内联排成一行。
- 结论：master-order 附件区与 project-apply/temporary-credit-limit/contract-manage 风格一致（按钮左 + 描述贴右侧）。
## vehicle-attachment-upload 恢复 showTip 门控
- 根因：用户截图 feedback `customer-archive/form` 的「OCR上传识别」按钮下方仍显示统一附件说明，要求「OCR上传识别这里不用加描述」。该组件虽有 `showTip` prop，但此前「全站附件上传统一」时把模板门控 `v-if="showTip && tipText && !readonly"` 简化成了 `v-if="tipText && !readonly"`，导致 `:show-tip="false"` 失效。
- 修复：恢复 `src/components/vehicle-attachment-upload/main.vue` 第 24 行的 `showTip &&` 条件，使 `:show-tip="false"` 可正常隐藏按钮旁说明；`customer-archive.vue` 中 OCR 上传实例已配置 `:show-tip="false"`，无需额外改动。
- 影响：所有 `:show-tip="false"` 的调用点（annual-inspection/maintenance/accident/violation/tire/customer-archive 等）现在会按预期隐藏提示；未配置 `show-tip` 或 `:show-tip="true"` 的实例继续显示 `UNIFIED_ATTACHMENT_TIP`。
## customer-archive 客商材料上传按钮左、描述右、间距 30px
- 需求：用户第三轮明确「客商材料」表格下"上传附件"按钮与「支持pdf…」描述需并排、按钮左、描述右、间距严格 30px。
- 定位：`src/views/vehicle/customer-archive.vue` 第 4637-4666 行 `.qualification-upload-bar`（grid 1fr auto 1fr 改 flex 的二次修正）。
- 修复：保留 flex 容器，按钮区 `.vehicle-attachment-upload > :deep(.el-upload)` `flex: 0 0 auto` 贴左固定；描述 `:deep(.el-upload__tip)` `margin-left: 30px + white-space: nowrap + overflow:hidden + text-overflow:ellipsis + text-align:left`，与按钮同行紧贴、间距固定 30px、超长文案省略号。
- 结论：布局"「上传附件」按钮 ←30px→ 「支持pdf…」描述"，单行两端对齐。
src/components/vehicle-attachment-upload/main.vue
+26 -5
View File
@@ -75,6 +75,9 @@ import pdfWorkerSrc from 'pdfjs-dist/build/pdf.worker.mjs?url';
import { baseUrl } from '@/config/env';
import { getUploadHeaders } from '@/utils/upload';
const UNIFIED_ATTACHMENT_TIP =
'支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过500M';
const MIME_MAP = {
jpg: 'image/jpeg',
jpeg: 'image/jpeg',
@@ -143,7 +146,7 @@ export default {
},
maxSize: {
type: Number,
default: 0,
default: 500,
},
readonly: {
type: Boolean,
@@ -212,10 +215,7 @@ export default {
return this.acceptedList.join(',');
},
tipText() {
if (this.tip) return this.tip;
const typeText = this.acceptText || '所有类型';
const sizeText = this.maxSize > 0 ? `，单文件不超过 ${this.maxSize}MB` : '';
return `支持上传 ${typeText}${sizeText}`;
return this.tip || UNIFIED_ATTACHMENT_TIP;
},
uploadingCount() {
return this.fileList.filter(file => ['ready', 'uploading'].includes(file.status)).length;
@@ -372,6 +372,27 @@ export default {
<style lang="scss" scoped>
.vehicle-attachment-upload {
width: 100%;
div{
display: flex;
flex-direction: row;
align-items: center;
}
:deep(.el-upload) {
display: flex;
align-items: center;
flex-wrap: nowrap;
}
:deep(.el-upload__tip) {
display: inline-block;
margin: 0 0 0 30px;
color: #909399;
font-size: 13px;
line-height: 1.4;
white-space: normal;
text-align: left;
}
:deep(.el-upload-list__item-name) {
cursor: pointer;
src/views/business/components/business-crud-page.vue
+36 -20
View File
@@ -1981,16 +1981,6 @@
<template #attachmentsJson-form>
<div class="business-crud-page__attachment">
<div class="business-crud-page__attachment-head">
<vehicle-attachment-upload
v-model="attachmentRows"
:readonly="dialogReadonly"
:file-types="attachmentFileTypes"
:max-size="500"
:show-tip="false"
:show-file-list="false"
button-text="上传附件"
@change="handleAttachmentChange"
/>
<el-button
type="primary"
:disabled="!attachmentRows.length"
@@ -2043,6 +2033,17 @@
</template>
</el-table-column>
</el-table>
<div class="business-crud-page__attachment-upload">
<vehicle-attachment-upload
v-model="attachmentRows"
:readonly="dialogReadonly"
:file-types="attachmentFileTypes"
:max-size="500"
:show-file-list="false"
button-text="上传附件"
@change="handleAttachmentChange"
/>
</div>
</div>
</template>
@@ -4124,15 +4125,6 @@
<div class="dialog-section-title">附件</div>
<div class="business-crud-page__attachment">
<div class="business-crud-page__attachment-head">
<vehicle-attachment-upload
v-model="dispatchItemAttachmentRows"
:file-types="attachmentFileTypes"
:max-size="500"
:show-tip="false"
:show-file-list="false"
button-text="上传附件"
@change="handleDispatchItemAttachmentChange"
/>
<el-button
type="primary"
:disabled="!dispatchItemAttachmentRows.length"
@@ -4178,6 +4170,16 @@
</template>
</el-table-column>
</el-table>
<div class="business-crud-page__attachment-upload">
<vehicle-attachment-upload
v-model="dispatchItemAttachmentRows"
:file-types="attachmentFileTypes"
:max-size="500"
:show-file-list="false"
button-text="上传附件"
@change="handleDispatchItemAttachmentChange"
/>
</div>
</div>
</el-form>
<template #footer>
@@ -14254,10 +14256,24 @@ export default {
&__attachment-head {
display: flex;
align-items: center;
justify-content: space-between;
justify-content: flex-end;
margin-bottom: 16px;
}
&__attachment-upload {
display: flex;
justify-content: flex-start;
margin-top: 12px;
:deep(.vehicle-attachment-upload) {
width: auto;
}
:deep(.el-upload) {
display: inline-flex;
}
}
&__attachment-table {
width: 100%;
min-width: 0;
src/views/business/components/master-order-editor.vue
+35 -10
View File
@@ -217,15 +217,6 @@
<h3>附件</h3>
<div class="master-editor__attachment">
<div class="master-editor__attachment-head">
<vehicle-attachment-upload
v-model="attachmentRows"
:file-types="attachmentFileTypes"
:max-size="500"
:show-tip="false"
:show-file-list="false"
button-text="上传附件"
@change="handleAttachmentChange"
/>
<el-button
type="primary"
:disabled="!attachmentRows.length"
@@ -261,6 +252,16 @@
</template>
</el-table-column>
</el-table>
<div class="master-editor__attachment-upload">
<vehicle-attachment-upload
v-model="attachmentRows"
:file-types="attachmentFileTypes"
:max-size="500"
:show-file-list="false"
button-text="上传附件"
@change="handleAttachmentChange"
/>
</div>
</div>
</section>
<el-dialog
@@ -1807,9 +1808,33 @@ export default {
.master-editor__attachment-head {
display: flex;
align-items: center;
justify-content: space-between;
justify-content: flex-end;
margin-bottom: 16px;
}
.master-editor__attachment-upload {
display: flex;
justify-content: flex-start;
align-items: center;
margin-top: 12px;
:deep(.el-upload) {
display: inline-flex;
align-items: center;
flex-wrap: nowrap;
text-align: left;
}
:deep(.el-upload__tip) {
display: inline-block;
margin: 0 0 0 8px;
color: #909399;
font-size: 13px;
line-height: 1.4;
white-space: normal;
text-align: left;
}
}
.master-editor__attachment-upload .vehicle-attachment-upload {
width: auto;
}
.master-editor__attachment-table {
width: 100%;
:deep(.el-table__header th) {
src/views/business/contract-manage-change.vue
+10 -2
View File
@@ -25,8 +25,13 @@
<section class="change-section">
<div class="dialog-section-title">合同文件</div>
<div class="attachment-head"><vehicle-attachment-upload v-model="contractFileRows" :readonly="false" :file-types="attachmentFileTypes" :max-size="500" :show-tip="false" :show-file-list="false" button-text="上传附件" @change="handleContractFileChange" /><el-button type="primary" :disabled="!contractFileRows.length" @click="handleContractFileBatchDownload">批量下载</el-button></div>
<div class="attachment-head">
<el-button type="primary" :disabled="!contractFileRows.length" @click="handleContractFileBatchDownload">批量下载</el-button>
</div>
<el-table :data="contractFileRows" border class="change-table" @selection-change="selectedContractFiles = $event"><el-table-column type="selection" width="55" /><el-table-column type="index" label="序号" width="70" /><el-table-column label="文件名" min-width="240"><template #default="{ row }"><el-link type="primary" @click="previewAttachment(row, contractFileRows)">{{ row.originalName || row.name }}</el-link></template></el-table-column><el-table-column label="文件大小" width="120"><template #default="{ row }">{{ formatFileSize(row.size) }}</template></el-table-column><el-table-column prop="uploadUserName" label="上传人" width="140" /><el-table-column prop="uploadTime" label="上传时间" width="170" /><el-table-column label="操作" width="100"><template #default="{ $index }"><el-link type="danger" @click="removeContractFile($index)">删除</el-link></template></el-table-column></el-table>
<div class="attachment-upload">
<vehicle-attachment-upload v-model="contractFileRows" :readonly="false" :file-types="attachmentFileTypes" :max-size="500" :show-file-list="false" button-text="上传附件" @change="handleContractFileChange" />
</div>
</section>
<section class="change-section">
@@ -144,7 +149,10 @@ export default {
.ratio-tip { margin-bottom: 8px; color: #f56c6c; }
.unit { margin-left: 8px; }
.inline-field { display: flex; align-items: center; gap: 8px; }
.attachment-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.attachment-head { display: flex; align-items: center; justify-content: flex-end; margin-bottom: 12px; }
.attachment-upload { display: flex; justify-content: flex-start; margin-top: 12px; }
.attachment-upload .vehicle-attachment-upload { width: auto; }
.attachment-upload .el-upload { display: inline-flex; }
.settlement-switch { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.settlement-form { display: grid; grid-template-columns: repeat(3, minmax(240px, 1fr)); gap: 8px 28px; }
.change-reason-section { border: 1px dashed #ff8f9a; margin: 20px 16px; }
src/views/business/contract-manage.vue
+59 -72
View File
@@ -275,25 +275,19 @@
<el-option label="是" :value="1" />
</el-select>
</el-form-item>
<el-form-item label="一式">
<div class="contract-manage-form__inline-number">
<el-input
v-model="form.copyCount"
placeholder="请输入"
@input="value => integerInput('copyCount', value)"
/>
<span>份</span>
</div>
<el-form-item label="一式（份）">
<el-input
v-model="form.copyCount"
placeholder="请输入"
@input="value => integerInput('copyCount', value)"
/>
</el-form-item>
<el-form-item label="回款账期">
<div class="contract-manage-form__inline-number">
<el-input
v-model="form.paymentDays"
placeholder="请输入"
@input="value => integerInput('paymentDays', value)"
/>
<span>天</span>
</div>
<el-form-item label="回款账期（天）">
<el-input
v-model="form.paymentDays"
placeholder="请输入"
@input="value => integerInput('paymentDays', value)"
/>
</el-form-item>
</div>
<el-form-item label="备注" prop="remark" class="contract-manage-form__remark">
@@ -1059,27 +1053,11 @@ const AttachmentSection = defineComponent({
[
h('div', { class: 'dialog-section-title' }, this.title),
h('div', { class: 'contract-manage-form__attachment-head' }, [
h('div', { class: 'contract-manage-form__attachment-actions' }, [
...(!this.readonly
? [
h(VehicleAttachmentUpload, {
modelValue: this.rows,
fileTypes: this.attachmentFileTypes,
maxSize: 500,
showTip: false,
showFileList: false,
buttonText: '上传附件',
'onUpdate:modelValue': this.handleChange,
onChange: this.handleChange,
}),
]
: []),
h(
ElButton,
{ type: 'primary', disabled: !this.rows.length, onClick: this.batchDownload },
() => '批量下载'
),
]),
h(
ElButton,
{ type: 'primary', disabled: !this.rows.length, onClick: this.batchDownload },
() => '批量下载'
),
]),
h(
ElTable,
@@ -1093,6 +1071,23 @@ const AttachmentSection = defineComponent({
},
() => columns
),
...(!this.readonly
? [
h('div', { class: 'contract-manage-form__attachment-upload' }, [
h(VehicleAttachmentUpload, {
modelValue: this.rows,
fileTypes: this.attachmentFileTypes,
maxSize: 500,
showTip: true,
tip: '支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过500M',
showFileList: false,
buttonText: '上传附件',
'onUpdate:modelValue': this.handleChange,
onChange: this.handleChange,
}),
]),
]
: []),
]
);
},
@@ -2229,25 +2224,6 @@ export default {
}
}
&__inline-number {
display: flex;
align-items: center;
gap: 8px;
width: 360px;
max-width: 100%;
:deep(.el-input) {
flex: 1;
width: auto;
min-width: 0;
}
span {
flex: none;
color: #606266;
}
}
&__billing-head,
&__attachment-head {
display: flex;
@@ -2350,22 +2326,29 @@ export default {
margin-bottom: 16px;
}
:deep(.contract-manage-form__attachment-actions) {
display: inline-flex;
align-items: center;
justify-content: flex-end;
flex-wrap: nowrap;
gap: 8px;
white-space: nowrap;
}
:deep(.contract-manage-form__attachment-upload) {
display: flex;
justify-content: flex-start;
margin-top: 12px;
:deep(.contract-manage-form__attachment-actions .vehicle-attachment-upload) {
flex: 0 0 auto;
width: auto !important;
}
:deep(.vehicle-attachment-upload) {
display: flex;
align-items: center;
width: auto;
}
:deep(.contract-manage-form__attachment-actions .el-upload) {
display: inline-flex;
:deep(.el-upload) {
display: inline-flex;
}
:deep(.el-upload__tip) {
display: inline-block;
margin: 0 0 0 30px;
color: #909399;
font-size: 13px;
line-height: 1.4;
text-align: left;
}
}
.contract-manage-detail {
@@ -2415,4 +2398,8 @@ export default {
white-space: normal;
line-height: 1.2;
}
.contract-manage-form__tip {
color: #ff0000;
font-size: 12px;
}
</style>
src/views/business/process-config.vue
+1 -1
View File
@@ -105,7 +105,7 @@
:title="dialogReadonly ? '查看过程配置' : form.id ? '编辑过程配置' : '新建过程配置'"
append-to-body
v-model="configBox"
width="96%"
width="90%"
top="4vh"
class="process-config-dialog"
:close-on-click-modal="false"
src/views/business/project-apply.vue
+19 -2
View File
@@ -535,9 +535,9 @@
class="project-apply-form__upload"
:readonly="dialogReadonly"
:file-types="attachmentFileTypes"
:max-size="50"
:max-size="500"
button-text="上传附件"
tip="支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件大小限制50M"
tip="支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过500M"
@change="handleAttachmentChange"
/>
</div>
@@ -2060,6 +2060,23 @@ export default {
border-radius: 6px;
padding: 12px 0;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
:deep(.vehicle-attachment-upload) {
display: flex;
align-items: center;
}
:deep(.el-upload) {
display: inline-flex;
}
:deep(.el-upload__tip) {
display: inline-block;
margin: 0 0 0 30px;
color: #909399;
font-size: 13px;
line-height: 1.4;
}
}
&__change-textarea {
src/views/business/temporary-credit-limit.vue
+42 -10
View File
@@ -84,15 +84,6 @@
<template #attachmentsJson-form>
<div class="temporary-credit-limit-page__attachment">
<div class="temporary-credit-limit-page__attachment-head">
<vehicle-attachment-upload
v-model="attachmentRows"
:readonly="dialogReadonly"
:file-types="attachmentFileTypes"
:max-size="50"
:show-file-list="false"
button-text="上传附件"
@change="handleAttachmentChange"
/>
<el-button type="primary" :disabled="!attachmentRows.length" @click="batchDownload">
批量下载
</el-button>
@@ -121,6 +112,18 @@
</template>
</el-table-column>
</el-table>
<div class="temporary-credit-limit-page__attachment-upload">
<vehicle-attachment-upload
v-model="attachmentRows"
:readonly="dialogReadonly"
:file-types="attachmentFileTypes"
:max-size="500"
:show-file-list="false"
button-text="上传附件"
tip="支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip的文件格式，单个文件不超过500M"
@change="handleAttachmentChange"
/>
</div>
</div>
</template>
@@ -639,10 +642,35 @@ export default {
&__attachment-head {
display: flex;
align-items: center;
justify-content: space-between;
justify-content: flex-end;
margin-bottom: 12px;
}
&__attachment-upload {
display: flex;
justify-content: flex-start;
margin-top: 12px;
:deep(.vehicle-attachment-upload) {
display: flex;
align-items: center;
width: auto;
}
:deep(.el-upload) {
display: inline-flex;
}
:deep(.el-upload__tip) {
display: inline-block;
margin: 0 0 0 30px;
color: #909399;
font-size: 13px;
line-height: 1.4;
text-align: left;
}
}
&__flow {
width: 100%;
height: calc(100vh - 150px);
@@ -670,4 +698,8 @@ export default {
.temporary-credit-limit-dialog .business-crud-page__detail-content .el-descriptions__label {
width: 180px !important;
}
.el-form-item--default .el-form-item__label {
min-height: 30px;
height: auto !important;
}
</style>
src/views/payment/bill-ledger-form.vue
+1 -1
View File
@@ -231,7 +231,7 @@
class="bill-ledger-form-page__uploader"
:multiple="true"
:limit="20"
:max-size="10"
:max-size="500"
:file-types="attachmentFileTypes"
:show-file-list="false"
button-text="上传"
src/views/payment/bill-payment-form.vue
+1 -1
View File
@@ -113,7 +113,7 @@
class="bill-payment-form-page__uploader"
:multiple="true"
:limit="20"
:max-size="10"
:max-size="500"
:file-types="attachmentFileTypes"
:show-file-list="false"
button-text="上传"
src/views/payment/invoice-application-form.vue
+24 -11
View File
@@ -366,17 +366,6 @@
</section-card>
<section-card title="附件信息">
<vehicle-attachment-upload
v-model="form.attachments"
:readonly="readonly"
:multiple="true"
:limit="20"
:max-size="50"
:file-types="attachmentFileTypes"
:show-file-list="false"
button-text="上传"
@change="normalizeAttachments"
/>
<el-table :data="form.attachments" border>
<el-table-column type="index" label="序号" width="64" align="center" />
<el-table-column prop="originalName" label="文件名" min-width="220" />
@@ -399,6 +388,19 @@
</template>
</el-table-column>
</el-table>
<div class="invoice-form-page__attachment-upload">
<vehicle-attachment-upload
v-model="form.attachments"
:readonly="readonly"
:multiple="true"
:limit="20"
:max-size="500"
:file-types="attachmentFileTypes"
:show-file-list="false"
button-text="上传"
@change="normalizeAttachments"
/>
</div>
</section-card>
<section-card title="备注">
@@ -970,6 +972,17 @@ export default {
gap: 8px;
padding: 16px 0 8px;
}
.invoice-form-page__attachment-upload {
display: flex;
justify-content: flex-start;
margin-top: 12px;
}
.invoice-form-page__attachment-upload .vehicle-attachment-upload {
width: auto;
}
.invoice-form-page__attachment-upload .el-upload {
display: inline-flex;
}
.invoice-form-page__dialog-search {
display: flex;
justify-content: flex-end;
src/views/payment/payment-application-form.vue
+25 -11
View File
@@ -245,17 +245,7 @@
/></el-table>
</section-card>
<section-card title="附件">
<vehicle-attachment-upload
v-model="form.attachments"
:readonly="readonly"
:multiple="true"
:limit="20"
:max-size="500"
:file-types="attachmentFileTypes"
:show-file-list="false"
button-text="上传附件"
@change="normalizeAttachments"
/><el-table :data="form.attachments" border
<el-table :data="form.attachments" border
><el-table-column type="index" label="序号" width="70" /><el-table-column
label="附件类型"
width="160"
@@ -291,6 +281,19 @@
></el-table-column
></el-table
>
<div class="payment-form-page__attachment-upload">
<vehicle-attachment-upload
v-model="form.attachments"
:readonly="readonly"
:multiple="true"
:limit="20"
:max-size="500"
:file-types="attachmentFileTypes"
:show-file-list="false"
button-text="上传附件"
@change="normalizeAttachments"
/>
</div>
</section-card>
<div class="payment-form-page__actions">
<el-button @click="goBack">返回</el-button
@@ -810,6 +813,17 @@ export default {
justify-content: flex-end;
margin-bottom: 8px;
}
.payment-form-page__attachment-upload {
display: flex;
justify-content: flex-start;
margin-top: 12px;
}
.payment-form-page__attachment-upload .vehicle-attachment-upload {
width: auto;
}
.payment-form-page__attachment-upload .el-upload {
display: inline-flex;
}
.payment-form-page :deep(.el-form-item) {
margin-bottom: 16px;
}
src/views/settlement/components/pre-settlement-editor.vue
+29 -13
View File
@@ -292,19 +292,6 @@
<section-card title="附件">
<div class="pre-settlement-editor__attachment">
<div class="pre-settlement-editor__attachment-actions">
<vehicle-attachment-upload
ref="attachmentUploadRef"
v-model="attachments"
:readonly="!editable"
:multiple="true"
:limit="20"
:max-size="500"
:file-types="attachmentFileTypes"
:show-tip="false"
:show-file-list="false"
button-text="上传附件"
@change="handleAttachmentChange"
/>
<el-button type="primary" :disabled="!attachments.length" @click="downloadAttachments">
批量下载
</el-button>
@@ -341,6 +328,20 @@
</template>
</el-table-column>
</el-table>
<div class="pre-settlement-editor__attachment-upload">
<vehicle-attachment-upload
ref="attachmentUploadRef"
v-model="attachments"
:readonly="!editable"
:multiple="true"
:limit="20"
:max-size="500"
:file-types="attachmentFileTypes"
:show-file-list="false"
button-text="上传附件"
@change="handleAttachmentChange"
/>
</div>
</div>
</section-card>
@@ -1559,10 +1560,25 @@ export default {
&__attachment-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
margin-bottom: 12px;
}
&__attachment-upload {
display: flex;
justify-content: flex-start;
margin-top: 12px;
:deep(.vehicle-attachment-upload) {
width: auto;
}
:deep(.el-upload) {
display: inline-flex;
}
}
&__summary-total {
padding: 12px 16px 0;
text-align: right;
src/views/vehicle/customer-archive.vue
+36 -17
View File
@@ -606,7 +606,6 @@
v-model="ocrQualificationUploadFiles"
:multiple="true"
:limit="20"
accept=".pdf,.bmp,.jpeg,.png,.jpg,.doc,.docx,.ppt,.pptx,.xlsx,.xls,.eml,.msg,.zip"
:max-size="500"
button-text="OCR上传识别"
:show-tip="false"
@@ -689,14 +688,10 @@
accept=".pdf,.bmp,.jpeg,.png,.jpg,.doc,.docx,.ppt,.pptx,.xlsx,.xls,.eml,.msg,.zip"
:max-size="500"
button-text="上传附件"
:show-tip="false"
:show-file-list="false"
:show-uploading="true"
@success="handleQualificationUploadSuccess"
/>
<span class="qualification-upload-bar__tip">
支持pdf、bmp、jpeg、png、jpg、doc、docx、ppt、pptx、xlsx、xls、eml、msg、zip，单个文件不超过500M
</span>
</div>
</section-card>
@@ -859,7 +854,13 @@
</div>
</el-form-item>
<el-form-item label="备注" prop="remark" class="contact-form__compact-field">
<el-input v-model="contactForm.remark" maxlength="200" />
<el-input
v-model="contactForm.remark"
type="textarea"
:rows="2"
maxlength="500"
show-word-limit
/>
</el-form-item>
</el-form>
</section-card>
@@ -951,7 +952,13 @@
<el-input v-model="receiptForm.bankAccount" maxlength="50" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="receiptForm.remark" maxlength="200" />
<el-input
v-model="receiptForm.remark"
type="textarea"
:rows="2"
maxlength="500"
show-word-limit
/>
</el-form-item>
</el-form>
</section-card>
@@ -4537,7 +4544,7 @@ export default {
display: flex;
align-items: center;
gap: 10px;
width: 97%;
width: 100%;
}
.business-term-field {
@@ -4628,21 +4635,33 @@ export default {
}
.qualification-upload-bar {
display: grid;
grid-template-columns: 1fr auto 1fr;
display: flex;
align-items: center;
margin-top: 12px;
margin-bottom: 6px;
:deep(.vehicle-attachment-upload) {
width: auto;
}
flex: 1;
display: flex;
align-items: center;
min-width: 0;
&__tip {
grid-column: 2;
color: #909399;
font-size: 13px;
text-align: center;
:deep(.el-upload) {
flex: 0 0 auto;
display: inline-flex;
align-items: center;
}
:deep(.el-upload__tip) {
margin-left: 30px;
color: #909399;
font-size: 13px;
line-height: 1.4;
text-align: left;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
vite.config.mjs.timestamp-1787653210304-5b6c221708201.mjs
+158
View File
File diff suppressed because one or more lines are too long