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

Merge remote-tracking branch 'websoft/master'

Browse Source 
# Conflicts:
#	src/views/business/contract-manage-change.vue
This commit is contained in:
b2894lxlx
2026-08-25 20:47:06 +08:00
parent 335e45c3f1 325e708ef1
commit cb98355715
27 changed files with 816 additions and 971 deletions
Download Patch File Download Diff File Expand all files Collapse all files
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/page/index/sidebar/index.vue
+22
View File
@@ -44,6 +44,19 @@ export default {
collect(this.menu);
return indexes;
},
// 全站菜单路径集合，用于子路由（如 /vehicle/customer-archive/form）回退高亮父菜单
menuPaths() {
const props = website.menu;
const set = new Set();
const collect = list => {
(list || []).forEach(item => {
if (item[props.path]) set.add(item[props.path]);
collect(item[props.children]);
});
};
collect(this.menu);
return set;
},
activeMenu() {
const route = this.$route;
const { meta, path } = route;
@@ -55,6 +68,15 @@ export default {
if (fullPath !== path && this.menuIndexes.has(fullPath)) {
return fullPath;
}
// 子路由（如 /vehicle/customer-archive/form）自动回退高亮最长前缀匹配的父菜单
if (!this.menuPaths.has(path)) {
const matched = [...this.menuPaths]
.filter(p => path.startsWith(p + '/'))
.sort((a, b) => b.length - a.length);
if (matched.length) {
return matched[0];
}
}
return path;
},
},
src/views/business/components/business-crud-page.vue
+145 -57
View File
@@ -321,8 +321,9 @@
</el-input>
<el-tooltip v-if="!isShippingTemplatePage" content="选择常用地址" placement="top">
<el-button
class="business-crud-page__address-pick-btn"
type="primary"
:icon="List"
:icon="OfficeBuilding"
link
:disabled="transportAddressSelectDisabled"
@click="openTransportAddressPicker('departure')"
@@ -336,14 +337,16 @@
/>
<span class="business-crud-page__route-label">联系方式</span>
<el-input v-model="form.departurePhone" placeholder="请输入" :disabled="dialogReadonly" />
<el-link
v-if="isShippingTemplatePage"
type="primary"
:disabled="transportAddressSelectDisabled"
@click="openTransportAddressPicker('departure')"
>
选择
</el-link>
<el-tooltip v-if="isShippingTemplatePage" content="选择常用地址" placement="top">
<el-button
class="business-crud-page__address-pick-btn"
type="primary"
:icon="OfficeBuilding"
link
:disabled="transportAddressSelectDisabled"
@click="openTransportAddressPicker('departure')"
/>
</el-tooltip>
</div>
</template>
@@ -389,8 +392,9 @@
</el-input>
<el-tooltip v-if="!isShippingTemplatePage" content="选择常用地址" placement="top">
<el-button
class="business-crud-page__address-pick-btn"
type="primary"
:icon="List"
:icon="OfficeBuilding"
link
:disabled="transportAddressSelectDisabled"
@click="openTransportAddressPicker('arrival')"
@@ -400,14 +404,16 @@
<el-input v-model="form.arrivalContact" placeholder="请输入" :disabled="dialogReadonly" />
<span class="business-crud-page__route-label">联系方式</span>
<el-input v-model="form.arrivalPhone" placeholder="请输入" :disabled="dialogReadonly" />
<el-link
v-if="isShippingTemplatePage"
type="primary"
:disabled="transportAddressSelectDisabled"
@click="openTransportAddressPicker('arrival')"
>
选择
</el-link>
<el-tooltip v-if="isShippingTemplatePage" content="选择常用地址" placement="top">
<el-button
class="business-crud-page__address-pick-btn"
type="primary"
:icon="OfficeBuilding"
link
:disabled="transportAddressSelectDisabled"
@click="openTransportAddressPicker('arrival')"
/>
</el-tooltip>
</div>
</template>
@@ -869,11 +875,12 @@
>
<el-input
v-model="form.taskRemark"
placeholder="请输入，200字以内"
clearable
type="textarea"
:rows="2"
maxlength="200"
show-word-limit
:disabled="dialogReadonly"
placeholder="请输入，200字以内"
/>
</el-form-item>
</div>
@@ -990,11 +997,12 @@
>
<el-input
v-model="form.taskRemark"
placeholder="请输入，200字以内"
clearable
type="textarea"
:rows="2"
maxlength="200"
show-word-limit
:disabled="dialogReadonly"
placeholder="请输入，200字以内"
/>
</el-form-item>
</div>
@@ -1058,12 +1066,13 @@
class="business-crud-page__task-note business-crud-page__task-span-4"
>
<el-input
v-model="form.taskRemark"
placeholder="请输入，200字以内"
clearable
v-model="form.remark"
type="textarea"
:rows="2"
maxlength="200"
show-word-limit
:disabled="dialogReadonly"
placeholder="请输入，200字以内"
/>
</el-form-item>
</div>
@@ -1981,16 +1990,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 +2042,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>
@@ -2856,7 +2866,7 @@
<el-input
v-model="waybillRouteChangeRemark"
type="textarea"
:rows="1"
:rows="2"
maxlength="200"
show-word-limit
placeholder="请输入"
@@ -3517,8 +3527,16 @@
<el-input
v-model="dispatchItemForm.departureAddress"
:placeholder="dispatchAddressDetailPlaceholder"
:suffix-icon="dispatchStationMode ? undefined : Location"
/>
>
<template v-if="!dispatchStationMode" #suffix>
<el-link
type="primary"
:underline="false"
class="business-crud-page__address-choose-link"
>选择</el-link
>
</template>
</el-input>
<span class="business-crud-page__route-label">联系人</span>
<el-input v-model="dispatchItemForm.departureContact" placeholder="请输入" />
<span class="business-crud-page__route-label">联系方式</span>
@@ -3535,8 +3553,16 @@
<el-input
v-model="dispatchItemForm.arrivalAddress"
:placeholder="dispatchAddressDetailPlaceholder"
:suffix-icon="dispatchStationMode ? undefined : Location"
/>
>
<template v-if="!dispatchStationMode" #suffix>
<el-link
type="primary"
:underline="false"
class="business-crud-page__address-choose-link"
>选择</el-link
>
</template>
</el-input>
<span class="business-crud-page__route-label">联系人</span>
<el-input v-model="dispatchItemForm.arrivalContact" placeholder="请输入" />
<span class="business-crud-page__route-label">联系方式</span>
@@ -3973,8 +3999,11 @@
<el-form-item label="备注" class="business-crud-page__dispatch-item-span-3">
<el-input
v-model="dispatchItemForm.remark"
type="textarea"
:rows="2"
maxlength="200"
show-word-limit
:disabled="dialogReadonly"
placeholder="请输入，200字以内"
/>
</el-form-item>
@@ -4116,6 +4145,7 @@
:rows="2"
maxlength="200"
show-word-limit
:disabled="dialogReadonly"
placeholder="请输入，200字以内"
/>
</el-form-item>
@@ -4124,15 +4154,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 +4199,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>
@@ -5130,7 +5161,7 @@ import { openImportDialog } from '@/utils/import-excel';
import { applyTableMenuWidth } from '@/utils/table-menu';
import { downloadFileByUrl, downloadXls } from '@/utils/util';
import { isMobile } from '@/utils/validate';
import { List, Location, Rank, Search } from '@element-plus/icons-vue';
import { Location, OfficeBuilding, Rank, Search } from '@element-plus/icons-vue';
import { ElImageViewer } from 'element-plus';
import { OpenFileViewer } from '@open-file-viewer/vue';
import {
@@ -5424,8 +5455,8 @@ export default {
},
data() {
return {
List,
Location,
OfficeBuilding,
Search,
form: {},
suppressTransportTypeClear: false,
@@ -13043,7 +13074,16 @@ export default {
}
&__task-remark {
grid-column: span 3;
grid-column: 1 / -1;
:deep(.el-form-item__content) {
width: 100%;
}
:deep(.el-input),
:deep(.el-textarea) {
width: 100%;
}
}
&__task-note {
@@ -13113,8 +13153,16 @@ export default {
}
&__append-select--wide {
width: 108px;
min-width: 108px;
width: 96px;
min-width: 96px;
// 仅这两个窄 append 内的 placeholder 文字水平居中
:deep(.el-select__placeholder) {
left: 50% !important;
transform: translateY(-50%) translateX(-50%) !important;
text-align: center;
width: auto;
}
}
:deep(.business-crud-page__goods-info-cell .cell) {
@@ -13168,13 +13216,25 @@ export default {
padding: 0;
}
.business-crud-page__map-suffix {
color: #409eff;
font-size: 18px;
}
:deep(.el-input .el-input__icon) {
color: #409eff;
font-size: 18px;
}
&--shipping-template {
grid-template-columns:
220px minmax(220px, 1fr) 58px minmax(220px, 280px) 72px minmax(220px, 280px)
40px;
}
.business-crud-page__map-suffix {
color: #409eff;
.business-crud-page__address-pick-btn {
:deep(.el-icon) {
font-size: 22px;
}
}
}
@@ -13185,6 +13245,16 @@ export default {
}
}
&__address-choose-link {
display: inline-flex;
align-items: center;
height: 100%;
padding: 0 4px;
font-size: 13px;
line-height: 1;
cursor: pointer;
}
&__dispatch-shipping-form &__route-address-row {
grid-template-columns: 260px minmax(280px, 1fr) 58px minmax(160px, 220px) 72px minmax(
160px,
@@ -13222,6 +13292,7 @@ export default {
&__map-suffix {
cursor: pointer;
color: #909399;
font-size: 18px;
&:hover {
color: #409eff;
@@ -14258,10 +14329,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;
@@ -15277,4 +15362,7 @@ export default {
top: 92px !important;
left: 0 !important;
}
.el-input__icon {
color: #1e90ff !important;
}
</style>
src/views/business/components/master-order-dispatch.vue
+2 -2
View File
@@ -697,12 +697,12 @@ export default {
.route-overview__line { flex: 0 1 56px; min-width: 24px; height: 32px; margin-top: 0; border-bottom: 6px solid #e4e7ed; }
.segment-header { min-height: 46px; padding: 0 20px; border-bottom: 1px solid #eff1f7; font-weight: 600; em { color: #409eff; font-style: normal; } }
.segment-content { padding: 16px 24px; }
.dispatch-form { :deep(.el-form-item) { margin-bottom: 16px; } :deep(.el-input), :deep(.el-select), :deep(.el-date-editor), :deep(.el-input-number) { width: 100%; } }
.dispatch-form { :deep(.el-form-item) { margin-bottom: 16px; } :deep(.el-input), :deep(.el-select), :deep(.el-date-editor), :deep(.el-input-number) { width: 100%; } :deep(.el-input-group__append .el-select) { width: auto; } }
.transport-type-field :deep(.el-input) { width: 240px; }
.goods-heading { display: flex; align-items: center; justify-content: space-between; margin: 0 -24px 12px; padding: 14px 24px; border-top: 1px solid #eff1f7; border-bottom: 1px solid #eff1f7; h3 { margin: 0; padding-left: 12px; border-left: 4px solid #409eff; font-size: 16px; } span { color: #909399; font-size: 13px; } }
.freight-heading { margin: 16px 0 12px; h3 { margin: 0; padding-left: 12px; border-left: 4px solid #409eff; font-size: 16px; } }
.goods-table { :deep(th.el-table__cell), :deep(td.el-table__cell) { border-color: #eff1f7; } :deep(.el-table__row--striped td.el-table__cell) { background: #fafafa; } :deep(.goods-table__remaining .cell) { white-space: nowrap; } :deep(.goods-table__dispatch .el-input) { width: 100%; min-width: 0; } :deep(.goods-table__cargo-type .el-input__inner), :deep(.goods-table__cargo-name .el-select__selected-item) { color: #303133; } }
.freight-form { :deep(.freight-unit-select) { width: 92px; } }
.freight-form { :deep(.freight-unit-select) { width: 92px; flex: 0 0 92px; min-width: 0; } }
.carrier-type-form { margin-top: 16px; }
.carrier-form { padding-top: 8px; }
.segment-actions { display: flex; justify-content: flex-end; gap: 12px; padding-top: 4px; }
src/views/business/components/master-order-editor.vue
+44 -15
View File
@@ -63,7 +63,7 @@
<div class="route-node-form">
<el-form-item label="发货地址" required class="route-address-form-item"
><div class="route-address-inputs"
><el-cascader v-model="addressRegionPaths.departure" class="route-address-name" :options="regionOptions" :props="regionCascaderProps" :loading="regionLoading" placeholder="请选择省市区" clearable filterable @visible-change="visible => visible && loadRegionOptions()" @change="value => handleAddressRegionChange('departure', value)" /><el-input v-model="form.departureAddress" class="route-address-detail" readonly placeholder="请输入详细地址" @click="openAddressMap('departure')" /><el-tooltip content="选择常用地址" placement="top"><el-button class="address-picker-button" type="primary" link :icon="List" @click="openCommonAddress('departure')" /></el-tooltip></div
><el-cascader v-model="addressRegionPaths.departure" class="route-address-name" :options="regionOptions" :props="regionCascaderProps" :loading="regionLoading" placeholder="请选择省市区" clearable filterable @visible-change="visible => visible && loadRegionOptions()" @change="value => handleAddressRegionChange('departure', value)" /><el-input v-model="form.departureAddress" class="route-address-detail" readonly placeholder="请输入详细地址" @click="openAddressMap('departure')" /><el-tooltip content="选择常用地址" placement="top"><el-button class="address-picker-button" type="primary" link :icon="OfficeBuilding" @click="openCommonAddress('departure')" /></el-tooltip></div
></el-form-item>
<el-form-item label="联系人"
><el-input v-model="form.departureContact" placeholder="请输入"
@@ -90,7 +90,7 @@
<div class="route-node-form">
<el-form-item label="途经地" required class="route-address-form-item"
><div class="route-address-inputs"
><el-cascader v-model="addressRegionPaths[`route-${index}`]" class="route-address-name" :options="regionOptions" :props="regionCascaderProps" :loading="regionLoading" :disabled="!route.transportType" placeholder="请选择省市区" clearable filterable @visible-change="visible => visible && loadRegionOptions()" @change="value => handleAddressRegionChange(`route-${index}`, value)" /><el-input v-model="route.departureAddress" class="route-address-detail" readonly :disabled="!route.transportType || !isRoadTransportType(route.transportType)" placeholder="请先选择运输方式" @click="openAddressMap(`route-${index}`)" /><el-tooltip content="选择常用地址" placement="top"><el-button class="address-picker-button" type="primary" link :icon="List" :disabled="!route.transportType" @click="openCommonAddress(`route-${index}`)" /></el-tooltip></div
><el-cascader v-model="addressRegionPaths[`route-${index}`]" class="route-address-name" :options="regionOptions" :props="regionCascaderProps" :loading="regionLoading" :disabled="!route.transportType" placeholder="请选择省市区" clearable filterable @visible-change="visible => visible && loadRegionOptions()" @change="value => handleAddressRegionChange(`route-${index}`, value)" /><el-input v-model="route.departureAddress" class="route-address-detail" readonly :disabled="!route.transportType || !isRoadTransportType(route.transportType)" placeholder="请先选择运输方式" @click="openAddressMap(`route-${index}`)" /><el-tooltip content="选择常用地址" placement="top"><el-button class="address-picker-button" type="primary" link :icon="OfficeBuilding" :disabled="!route.transportType" @click="openCommonAddress(`route-${index}`)" /></el-tooltip></div
></el-form-item>
<el-form-item label="联系人"><el-input v-model="route.departureContact" placeholder="请输入" /></el-form-item>
<el-form-item label="联系方式"><div class="route-contact-actions"><el-input v-model="route.departurePhone" placeholder="请输入" /><el-tooltip v-if="index === form.routes.length - 1" content="新增途经点" placement="top"><el-button class="route-action-button" type="primary" link @click="addRoute"><el-icon><CirclePlus /></el-icon></el-button></el-tooltip><el-tooltip content="删除途经点" placement="top"><el-button class="route-action-button" type="danger" link @click="removeRoute(index)"><el-icon><Remove /></el-icon></el-button></el-tooltip></div></el-form-item>
@@ -104,7 +104,7 @@
<div class="route-node-form">
<el-form-item label="收货地址" required class="route-address-form-item"
><div class="route-address-inputs"
><el-cascader v-model="addressRegionPaths.arrival" class="route-address-name" :options="regionOptions" :props="regionCascaderProps" :loading="regionLoading" :disabled="!form.finalTransportType" placeholder="请选择省市区" clearable filterable @visible-change="visible => visible && loadRegionOptions()" @change="value => handleAddressRegionChange('arrival', value)" /><el-input v-model="form.arrivalAddress" class="route-address-detail" readonly :disabled="!form.finalTransportType || !isRoadTransportType(form.finalTransportType)" placeholder="请选择省市区" @click="openAddressMap('arrival')" /><el-tooltip content="选择常用地址" placement="top"><el-button class="address-picker-button" type="primary" link :icon="List" :disabled="!form.finalTransportType" @click="openCommonAddress('arrival')" /></el-tooltip></div
><el-cascader v-model="addressRegionPaths.arrival" class="route-address-name" :options="regionOptions" :props="regionCascaderProps" :loading="regionLoading" :disabled="!form.finalTransportType" placeholder="请选择省市区" clearable filterable @visible-change="visible => visible && loadRegionOptions()" @change="value => handleAddressRegionChange('arrival', value)" /><el-input v-model="form.arrivalAddress" class="route-address-detail" readonly :disabled="!form.finalTransportType || !isRoadTransportType(form.finalTransportType)" placeholder="请选择省市区" @click="openAddressMap('arrival')" /><el-tooltip content="选择常用地址" placement="top"><el-button class="address-picker-button" type="primary" link :icon="OfficeBuilding" :disabled="!form.finalTransportType" @click="openCommonAddress('arrival')" /></el-tooltip></div
></el-form-item>
<el-form-item label="联系人"
><el-input v-model="form.arrivalContact" placeholder="请输入" /></el-form-item>
@@ -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
@@ -548,7 +549,7 @@ import { getLazyTree as getRegionLazyTree } from '@/api/base/region';
import { getList as getCommonCargoList } from '@/api/business/common-cargo';
import { exportBlob, importBlob } from '@/api/common';
import { downloadFileByUrl, downloadXls } from '@/utils/util';
import { List, Search } from '@element-plus/icons-vue';
import { OfficeBuilding, Search } from '@element-plus/icons-vue';
import { ElImageViewer } from 'element-plus';
import { OpenFileViewer } from '@open-file-viewer/vue';
import { fallbackPlugin, imagePlugin, officePlugin, pdfPlugin, textPlugin } from '@open-file-viewer/core';
@@ -580,7 +581,7 @@ export default {
emits: ['back', 'dispatch'],
data() {
return {
List,
OfficeBuilding,
Search,
loading: false,
projects: [],
@@ -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) {
@@ -1940,6 +1965,10 @@ export default {
}
.address-picker-button {
flex: 0 0 auto;
:deep(.el-icon) {
font-size: 22px;
}
}
}
.route-step-title {
src/views/business/contract-manage-change.vue
+89 -731
View File
@@ -4,176 +4,40 @@
<section class="change-section">
<div class="dialog-section-title">基本信息</div>
<el-row :gutter="28">
<el-col :span="24"
><el-form-item label="变更类型"
><el-radio-group v-model="form.changeType"
><el-radio label="合同信息变更" /><el-radio
label="终止合同" /></el-radio-group></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="合同编号"
><el-input v-model="form.contractNo" disabled /></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="合同名称" prop="contractName"
><el-input v-model="form.contractName" /></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="合同类型"
><el-select v-model="form.contractCategory" disabled
><el-option label="客户合同" value="客户合同" /><el-option
label="承运商合同"
value="承运商合同" /></el-select></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="甲方"><el-input v-model="form.partyA" disabled /></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="乙方"><el-input v-model="form.partyB" disabled /></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="所属项目"
><el-input v-model="form.projectName" disabled /></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="合同期限"
><el-date-picker
v-model="period"
type="daterange"
value-format="YYYY-MM-DD"
range-separator="至" /></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="所属组织"
><el-input v-model="form.organizationName" disabled /></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="签订日期"
><el-date-picker
v-model="form.signDate"
type="date"
value-format="YYYY-MM-DD"
disabled /></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="合同格式"
><el-select v-model="form.contractFormat"
><el-option label="电子合同" value="电子合同" /><el-option
label="纸质合同"
value="纸质合同" /></el-select></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="结算方式"><el-input v-model="form.settlementMode" /></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="是否需要加盖法人章"
><el-select v-model="form.legalSealFlag"
><el-option label="是" :value="1" /><el-option
label="否"
:value="0" /></el-select></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="一式（份）"
><div class="inline-field">
<el-input-number
v-model="form.copyCount"
:min="1"
controls-position="right"
/></div></el-form-item
></el-col>
<el-col :span="6"
><el-form-item label="回款账期（天）"
><el-input-number
v-model="form.paymentDays"
:min="0"
controls-position="right" /></el-form-item
></el-col>
<el-col :span="24"
><el-form-item label="备注"
><el-input
v-model="form.remark"
type="textarea"
maxlength="2000"
show-word-limit /></el-form-item
></el-col>
<el-col :span="24"><el-form-item label="变更类型"><el-radio-group v-model="form.changeType"><el-radio label="合同信息变更" /><el-radio label="终止合同" /></el-radio-group></el-form-item></el-col>
<el-col :span="6"><el-form-item label="合同编号"><el-input v-model="form.contractNo" disabled /></el-form-item></el-col>
<el-col :span="6"><el-form-item label="合同名称" prop="contractName"><el-input v-model="form.contractName" /></el-form-item></el-col>
<el-col :span="6"><el-form-item label="合同类型"><el-select v-model="form.contractCategory" disabled><el-option label="客户合同" value="客户合同" /><el-option label="承运商合同" value="承运商合同" /></el-select></el-form-item></el-col>
<el-col :span="6"><el-form-item label="甲方"><el-input v-model="form.partyA" disabled /></el-form-item></el-col>
<el-col :span="6"><el-form-item label="乙方"><el-input v-model="form.partyB" disabled /></el-form-item></el-col>
<el-col :span="6"><el-form-item label="所属项目"><el-input v-model="form.projectName" disabled /></el-form-item></el-col>
<el-col :span="6"><el-form-item label="合同期限"><el-date-picker v-model="period" type="daterange" value-format="YYYY-MM-DD" range-separator="至" /></el-form-item></el-col>
<el-col :span="6"><el-form-item label="所属组织"><el-input v-model="form.organizationName" disabled /></el-form-item></el-col>
<el-col :span="6"><el-form-item label="签订日期"><el-date-picker v-model="form.signDate" type="date" value-format="YYYY-MM-DD" disabled /></el-form-item></el-col>
<el-col :span="6"><el-form-item label="合同格式"><el-select v-model="form.contractFormat"><el-option label="电子合同" value="电子合同" /><el-option label="纸质合同" value="纸质合同" /></el-select></el-form-item></el-col>
<el-col :span="6"><el-form-item label="结算方式"><el-input v-model="form.settlementMode" /></el-form-item></el-col>
<el-col :span="6"><el-form-item label="是否需要加盖法人章"><el-select v-model="form.legalSealFlag"><el-option label="是" :value="1" /><el-option label="否" :value="0" /></el-select></el-form-item></el-col>
<el-col :span="6"><el-form-item label="一式（份）"><div class="inline-field"><el-input-number v-model="form.copyCount" :min="1" controls-position="right" /></div></el-form-item></el-col>
<el-col :span="6"><el-form-item label="回款账期（天）"><el-input-number v-model="form.paymentDays" :min="0" controls-position="right" /></el-form-item></el-col>
<el-col :span="24"><el-form-item label="备注"><el-input v-model="form.remark" type="textarea" maxlength="2000" show-word-limit /></el-form-item></el-col>
</el-row>
</section>
<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
>
<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>
<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
>
</section>
<section class="change-section">
<div class="section-head">
<div class="dialog-section-title">计费信息</div>
<el-button type="primary" plain @click="addPlan">添加</el-button>
</div>
<el-radio-group v-model="feeGenerationMode"
><el-radio label="system">系统生成</el-radio
><el-radio label="manual">手动生成</el-radio></el-radio-group
>
<el-table :data="plans" border class="change-table"
><el-table-column type="index" label="序号" width="70" /><el-table-column
prop="planName"
label="方案名称"
min-width="220"
/><el-table-column label="默认方案" min-width="120"
><template #default="{ row }">{{
row.defaultPlan ? '是' : '否'
}}</template></el-table-column
><el-table-column prop="remark" label="备注" min-width="260" /><el-table-column
label="操作"
width="180"
><template #default="{ row, $index }"
><el-link type="primary" @click="editPlan(row, $index)">编辑</el-link
><el-link type="danger" @click="plans.splice($index, 1)">删除</el-link></template
></el-table-column
></el-table
>
<div class="section-head"><div class="dialog-section-title">计费信息</div><el-button type="primary" plain @click="addPlan">添加</el-button></div>
<el-radio-group v-model="feeGenerationMode"><el-radio label="system">系统生成</el-radio><el-radio label="manual">手动生成</el-radio></el-radio-group>
<el-table :data="plans" border class="change-table"><el-table-column type="index" label="序号" width="70" /><el-table-column prop="planName" label="方案名称" min-width="220" /><el-table-column label="默认方案" min-width="120"><template #default="{ row }">{{ row.defaultPlan ? '是' : '否' }}</template></el-table-column><el-table-column prop="remark" label="备注" min-width="260" /><el-table-column label="操作" width="180"><template #default="{ row, $index }"><el-link type="primary" @click="editPlan(row, $index)">编辑</el-link><el-link type="danger" @click="plans.splice($index, 1)">删除</el-link></template></el-table-column></el-table>
</section>
<section class="change-section">
@@ -182,66 +46,13 @@
<el-tab-pane label="预结算配置" name="pre" />
<el-tab-pane label="正式结算配置" name="formal" />
</el-tabs>
<div class="settlement-switch">
<span>自动生成结算单</span
><el-radio-group v-model="settlementRule.autoGenerate"
><el-radio :label="1">开启</el-radio
><el-radio :label="0">关闭</el-radio></el-radio-group
>
</div>
<el-form
v-if="settlementRule.autoGenerate === 1"
:model="settlementRule"
label-position="right"
label-width="auto"
class="settlement-form"
>
<el-form-item label="账单起始日期" required
><el-date-picker
v-model="settlementRule.billStartDate"
type="date"
placeholder="请选择账单起始日期"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
/></el-form-item>
<el-form-item label="结算类型" required
><el-select
v-model="settlementRule.settlementType"
placeholder="请选择结算类型"
@change="handleSettlementTypeChange"
><el-option
v-for="item in settlementTypeOptions"
:key="item"
:label="item"
:value="item" /></el-select
></el-form-item>
<el-form-item v-if="showSettlementBillCycleType" label="账单周期类型" required
><el-select
v-model="settlementRule.billCycleType"
placeholder="请选择账单周期类型"
@change="handleCycleTypeChange"
><el-option
v-for="item in billCycleTypeOptions"
:key="item"
:label="item"
:value="item" /></el-select
></el-form-item>
<el-form-item v-if="showSettlementBillCutoffDay" label="账单截单日" required
><el-select v-model="settlementRule.billCutoffDay" placeholder="请选择账单截单日"
><el-option
v-for="item in billCutoffDayOptions"
:key="item.value"
:label="item.label"
:value="item.value" /></el-select
></el-form-item>
<el-form-item v-if="showSettlementCycleDays" label="周期天数" required
><el-select v-model="settlementRule.cycleDays" placeholder="请选择周期天数"
><el-option
v-for="item in cycleDayOptions"
:key="item.value"
:label="item.label"
:value="item.value" /></el-select
></el-form-item>
<div class="settlement-switch"><span>自动生成结算单</span><el-radio-group v-model="settlementRule.autoGenerate"><el-radio :label="1">开启</el-radio><el-radio :label="0">关闭</el-radio></el-radio-group></div>
<el-form v-if="settlementRule.autoGenerate === 1" :model="settlementRule" label-position="right" label-width="auto" class="settlement-form">
<el-form-item label="账单起始日期" required><el-date-picker v-model="settlementRule.billStartDate" type="date" placeholder="请选择账单起始日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD" /></el-form-item>
<el-form-item label="结算类型" required><el-select v-model="settlementRule.settlementType" placeholder="请选择结算类型" @change="handleSettlementTypeChange"><el-option v-for="item in settlementTypeOptions" :key="item" :label="item" :value="item" /></el-select></el-form-item>
<el-form-item v-if="showSettlementBillCycleType" label="账单周期类型" required><el-select v-model="settlementRule.billCycleType" placeholder="请选择账单周期类型" @change="handleCycleTypeChange"><el-option v-for="item in billCycleTypeOptions" :key="item" :label="item" :value="item" /></el-select></el-form-item>
<el-form-item v-if="showSettlementBillCutoffDay" label="账单截单日" required><el-select v-model="settlementRule.billCutoffDay" placeholder="请选择账单截单日"><el-option v-for="item in billCutoffDayOptions" :key="item.value" :label="item.label" :value="item.value" /></el-select></el-form-item>
<el-form-item v-if="showSettlementCycleDays" label="周期天数" required><el-select v-model="settlementRule.cycleDays" placeholder="请选择周期天数"><el-option v-for="item in cycleDayOptions" :key="item.value" :label="item.label" :value="item.value" /></el-select></el-form-item>
</el-form>
</section>
@@ -250,135 +61,29 @@
<el-table :data="paymentRatioRows" border class="change-table">
<el-table-column type="index" label="序号" width="70" />
<el-table-column prop="paymentTerm" label="付款笔数" min-width="180" />
<el-table-column label="付款比例上限" min-width="220"
><template #default="{ row }"
><el-input
v-model="row.ratioLimit"
placeholder="请输入"
@input="value => ratioInput(row, value)"
><template #append>%</template></el-input
></template
></el-table-column
>
<el-table-column label="备注" min-width="220"
><template #default="{ row }"
><el-input v-model="row.remark" maxlength="200" /></template
></el-table-column>
<el-table-column label="操作" width="100"
><template #default="{ $index }"
><el-link type="danger" @click="paymentRatioRows.splice($index, 1)"
>删除</el-link
></template
></el-table-column
>
<el-table-column label="付款比例上限（%）" min-width="220"><template #default="{ row }"><el-input-number v-model="row.ratioLimit" :min="0" :max="100" :precision="2" controls-position="right" /></template></el-table-column>
<el-table-column label="备注" min-width="220"><template #default="{ row }"><el-input v-model="row.remark" maxlength="200" /></template></el-table-column>
<el-table-column label="操作" width="100"><template #default="{ $index }"><el-link type="danger" @click="paymentRatioRows.splice($index, 1)">删除</el-link></template></el-table-column>
</el-table>
<el-button type="primary" plain @click="addPaymentRatioRow">添加</el-button>
</section>
<billing-plan-editor
v-model="planDialogVisible"
:value="planEditor"
:index="planEditorIndex"
@save="savePlan"
/>
<billing-plan-editor v-model="planDialogVisible" :value="planEditor" :index="planEditorIndex" @save="savePlan" />
<section class="change-section attachment-section">
<div class="section-head">
<div class="dialog-section-title">其它附件</div>
<el-button type="primary" plain>批量下载</el-button>
</div>
<el-table :data="attachments" border class="change-table"
><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, attachments)">{{
row.originalName || row.name
}}</el-link></template
></el-table-column
><el-table-column prop="description" label="附件描述" min-width="240" /><el-table-column
prop="size"
label="文件大小"
width="120"
/><el-table-column prop="userName" label="上传人" width="140" /><el-table-column
prop="uploadTime"
label="上传时间"
width="180"
/><el-table-column label="操作" width="100"
><template #default="{ $index }"
><el-link type="danger" @click="attachments.splice($index, 1)"
>删除</el-link
></template
></el-table-column
></el-table
>
<el-upload
action="#"
:auto-upload="false"
multiple
:show-file-list="false"
@change="handleAttachment"
><el-button plain>上传附件</el-button></el-upload
>
<div class="section-head"><div class="dialog-section-title">其它附件</div><el-button type="primary" plain>批量下载</el-button></div>
<el-table :data="attachments" border class="change-table"><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, attachments)">{{ row.originalName || row.name }}</el-link></template></el-table-column><el-table-column prop="description" label="附件描述" min-width="240" /><el-table-column prop="size" label="文件大小" width="120" /><el-table-column prop="userName" label="上传人" width="140" /><el-table-column prop="uploadTime" label="上传时间" width="180" /><el-table-column label="操作" width="100"><template #default="{ $index }"><el-link type="danger" @click="attachments.splice($index, 1)">删除</el-link></template></el-table-column></el-table>
<el-upload action="#" :auto-upload="false" multiple :show-file-list="false" @change="handleAttachment"><el-button plain>上传附件</el-button></el-upload>
</section>
<section class="change-section change-reason-section">
<div class="dialog-section-title">变更原因</div>
<el-form-item prop="changeReason"
><el-input
v-model="form.changeReason"
type="textarea"
:rows="4"
maxlength="2000"
show-word-limit
placeholder="请输入变更原因"
/></el-form-item>
<div class="dialog-section-title">变更材料</div>
<el-upload
action="#"
:auto-upload="false"
multiple
:show-file-list="false"
@change="handleChangeMaterial"
><el-button plain>上传变更材料</el-button></el-upload
>
</section>
<div class="page-footer">
<el-button type="primary" @click="submit">提交</el-button
><el-button @click="$router.back()">关闭</el-button>
</div>
<section class="change-section change-reason-section"><div class="dialog-section-title">变更原因</div><el-form-item prop="changeReason"><el-input v-model="form.changeReason" type="textarea" :rows="2" maxlength="2000" show-word-limit placeholder="请输入变更原因" /></el-form-item><div class="dialog-section-title">变更材料</div><el-upload action="#" :auto-upload="false" multiple :show-file-list="false" @change="handleChangeMaterial"><el-button plain>上传变更材料</el-button></el-upload></section>
<div class="page-footer"><el-button type="primary" @click="submit">提交</el-button><el-button @click="$router.back()">关闭</el-button></div>
</el-form>
<el-dialog
v-model="documentPreviewVisible"
:title="previewFile.name || '附件预览'"
append-to-body
destroy-on-close
width="90%"
top="4vh"
>
<open-file-viewer
v-if="documentPreviewVisible && previewFile.url"
:file="previewFile.url"
:file-name="previewFile.name"
:mime-type="previewFile.mimeType"
width="100%"
height="72vh"
fit="contain"
theme="auto"
locale="zh-CN"
:toolbar="viewerToolbar"
:plugins="viewerPlugins"
@unsupported="handlePreviewUnsupported"
@error="handlePreviewError"
/>
<el-dialog v-model="documentPreviewVisible" :title="previewFile.name || '附件预览'" append-to-body destroy-on-close width="90%" top="4vh">
<open-file-viewer v-if="documentPreviewVisible && previewFile.url" :file="previewFile.url" :file-name="previewFile.name" :mime-type="previewFile.mimeType" width="100%" height="72vh" fit="contain" theme="auto" locale="zh-CN" :toolbar="viewerToolbar" :plugins="viewerPlugins" @unsupported="handlePreviewUnsupported" @error="handlePreviewError" />
</el-dialog>
<el-image-viewer
v-if="imagePreviewVisible"
:url-list="imagePreviewUrls"
:initial-index="imagePreviewIndex"
@close="imagePreviewVisible = false"
/>
<el-image-viewer v-if="imagePreviewVisible" :url-list="imagePreviewUrls" :initial-index="imagePreviewIndex" @close="imagePreviewVisible = false" />
</basic-container>
</template>
@@ -387,13 +92,7 @@ import * as api from '@/api/business/contract-manage';
import BillingPlanEditor from './components/billing-plan-editor.vue';
import { ElImageViewer } from 'element-plus';
import { OpenFileViewer } from '@open-file-viewer/vue';
import {
fallbackPlugin,
imagePlugin,
officePlugin,
pdfPlugin,
textPlugin,
} from '@open-file-viewer/core';
import { fallbackPlugin, imagePlugin, officePlugin, pdfPlugin, textPlugin } from '@open-file-viewer/core';
import '@open-file-viewer/core/style.css';
import pdfWorkerSrc from 'pdfjs-dist/build/pdf.worker.mjs?url';
@@ -407,396 +106,55 @@ const viewerPlugins = [
export default {
components: { BillingPlanEditor, ElImageViewer, OpenFileViewer },
data() {
return {
form: {},
period: [],
plans: [],
attachments: [],
contractFiles: [],
contractFileRows: [],
selectedContractFiles: [],
paymentRatioRows: [],
settlementConfigTab: 'pre',
changeMaterials: [],
imagePreviewVisible: false,
imagePreviewUrls: [],
imagePreviewIndex: 0,
documentPreviewVisible: false,
previewFile: {},
viewerPlugins,
viewerToolbar: { zoom: true, rotate: true, download: true, fullscreen: true },
feeGenerationMode: 'system',
settlementRule: {
autoGenerate: 1,
settlementType: '月结',
billCycleType: '固定截单日',
billCutoffDay: 25,
cycleDays: '',
},
preSettlementConfig: {},
formalSettlementConfig: {},
settlementTypeOptions: ['月结', '日结', '周结', '半月结', '固定天数周期结算'],
billCycleTypeOptions: ['固定截单日', '自然月'],
billCutoffDayOptions: Array.from({ length: 31 }, (_, index) => ({
label: `${index + 1}日`,
value: index + 1,
})),
cycleDayOptions: [7, 15, 30, 60].map(value => ({ label: `${value}天`, value })),
planDialogVisible: false,
planEditor: { planName: '', defaultPlan: false, remark: '', rules: [] },
planEditorIndex: -1,
billingElements: [
'按重量',
'按体积',
'按车辆',
'按里程',
'按吨·公里',
'固定金额（整单一口价）',
'按数量',
],
attachmentFileTypes: [
'pdf',
'bmp',
'jpeg',
'png',
'jpg',
'doc',
'docx',
'ppt',
'pptx',
'xlsx',
'xls',
'eml',
'msg',
'zip',
],
rules: {
contractName: [{ required: true, message: '请输入合同名称', trigger: 'blur' }],
changeReason: [{ required: true, message: '请输入变更原因', trigger: 'blur' }],
},
};
},
computed: {
showSettlementBillCycleType() {
return this.settlementRule.settlementType === '月结';
},
showSettlementBillCutoffDay() {
return this.showSettlementBillCycleType && this.settlementRule.billCycleType === '固定截单日';
},
showSettlementCycleDays() {
return this.settlementRule.settlementType === '固定天数周期结算';
},
},
mounted() {
this.load();
},
watch: {
settlementConfigTab(tab, oldTab) {
if (tab === oldTab) return;
if (oldTab === 'pre') this.preSettlementConfig = { ...this.settlementRule };
else this.formalSettlementConfig = { ...this.settlementRule };
this.settlementRule = {
...(tab === 'pre' ? this.preSettlementConfig : this.formalSettlementConfig),
};
},
},
data() { return { form: {}, period: [], plans: [], attachments: [], contractFiles: [], contractFileRows: [], selectedContractFiles: [], paymentRatioRows: [], settlementConfigTab: 'pre', changeMaterials: [], imagePreviewVisible: false, imagePreviewUrls: [], imagePreviewIndex: 0, documentPreviewVisible: false, previewFile: {}, viewerPlugins, viewerToolbar: { zoom: true, rotate: true, download: true, fullscreen: true }, feeGenerationMode: 'system', settlementRule: { autoGenerate: 1, settlementType: '月结', billCycleType: '固定截单日', billCutoffDay: 25, cycleDays: '' }, preSettlementConfig: {}, formalSettlementConfig: {}, settlementTypeOptions: ['月结','日结','周结','半月结','固定天数周期结算'], billCycleTypeOptions: ['固定截单日','自然月'], billCutoffDayOptions: Array.from({ length: 31 }, (_, index) => ({ label: `${index + 1}日`, value: index + 1 })), cycleDayOptions: [7,15,30,60].map(value => ({ label: `${value}天`, value })), planDialogVisible: false, planEditor: { planName: '', defaultPlan: false, remark: '', rules: [] }, planEditorIndex: -1, billingElements: ['按重量','按体积','按车辆','按里程','按吨·公里','固定金额（整单一口价）','按数量'], attachmentFileTypes: ['pdf','bmp','jpeg','png','jpg','doc','docx','ppt','pptx','xlsx','xls','eml','msg','zip'], rules: { contractName: [{ required: true, message: '请输入合同名称', trigger: 'blur' }], changeReason: [{ required: true, message: '请输入变更原因', trigger: 'blur' }] } }; },
computed: { showSettlementBillCycleType() { return this.settlementRule.settlementType === '月结'; }, showSettlementBillCutoffDay() { return this.showSettlementBillCycleType && this.settlementRule.billCycleType === '固定截单日'; }, showSettlementCycleDays() { return this.settlementRule.settlementType === '固定天数周期结算'; } },
mounted() { this.load(); },
watch: { settlementConfigTab(tab, oldTab) { if (tab === oldTab) return; if (oldTab === 'pre') this.preSettlementConfig = { ...this.settlementRule }; else this.formalSettlementConfig = { ...this.settlementRule }; this.settlementRule = { ...(tab === 'pre' ? this.preSettlementConfig : this.formalSettlementConfig) }; } },
methods: {
async load() {
const id = this.$route.query.id;
if (!id) return;
const res = await api.getDetail(id);
const data = res.data?.data || res.data || {};
this.form = { ...data, changeType: '合同信息变更' };
this.period = data.startDate && data.endDate ? [data.startDate, data.endDate] : [];
this.plans = this.parse(data.billingPlanJson);
this.attachments = this.parse(data.attachmentsJson);
this.contractFileRows = this.parse(data.contractFileJson);
const rules = this.parseObject(data.settlementRuleJson);
const pre = this.parseObject(data.preSettlementConfigJson);
const formal = this.parseObject(data.formalSettlementConfigJson);
const legacy = Object.keys(rules).some(
key => !['preSettlementConfig', 'formalSettlementConfig'].includes(key)
)
? rules
: {};
this.preSettlementConfig =
rules.preSettlementConfig || (Object.keys(pre).length ? pre : legacy);
this.formalSettlementConfig =
rules.formalSettlementConfig || (Object.keys(formal).length ? formal : legacy);
this.settlementRule = { ...this.preSettlementConfig };
this.feeGenerationMode =
data.feeGenerationMode || (Number(data.billingEnabled) === 0 ? 'manual' : 'system');
this.paymentRatioRows = this.parse(data.paymentRatioJson);
},
parse(value) {
try {
const result = JSON.parse(value || '[]');
return Array.isArray(result) ? result : [];
} catch {
return [];
}
},
parseObject(value) {
try {
return {
autoGenerate: 1,
settlementType: '月结',
billCycleType: '固定截单日',
billCutoffDay: 25,
cycleDays: 15,
...(JSON.parse(value || '{}') || {}),
};
} catch {
return {
autoGenerate: 1,
settlementType: '月结',
billCycleType: '固定截单日',
billCutoffDay: 25,
cycleDays: 15,
};
}
},
addPlan() {
this.planEditorIndex = -1;
this.planEditor = {
planName: `计费方案${this.plans.length + 1}`,
defaultPlan: !this.plans.length,
remark: '',
rules: [{}],
};
this.planDialogVisible = true;
},
editPlan(row, index) {
this.planEditorIndex = index;
this.planEditor = JSON.parse(JSON.stringify(row));
this.planDialogVisible = true;
},
toggleDefaultPlan(value) {
if (value)
this.plans.forEach(item => {
item.defaultPlan = false;
});
},
savePlan(value, index) {
if (index < 0) this.plans.push(value);
else this.plans.splice(index, 1, value);
if (value.defaultPlan)
this.plans.forEach((item, current) => {
if (current !== (index < 0 ? this.plans.length - 1 : index)) item.defaultPlan = false;
});
},
handleSettlementTypeChange(value) {
if (value !== '月结') {
this.settlementRule.billCycleType = '';
this.settlementRule.billCutoffDay = '';
} else if (!this.settlementRule.billCycleType)
this.settlementRule.billCycleType = '固定截单日';
if (value !== '固定天数周期结算') this.settlementRule.cycleDays = '';
},
handleCycleTypeChange(value) {
if (value === '固定截单日' && !this.settlementRule.billCutoffDay)
this.settlementRule.billCutoffDay = 25;
if (value !== '固定截单日') this.settlementRule.billCutoffDay = '';
},
handleAttachment(event) {
const raw = event.raw;
if (raw)
this.attachments.push({
name: raw.name,
size: `${Math.ceil(raw.size / 1024)}KB`,
uploadTime: this.$dayjs().format('YYYY-MM-DD HH:mm:ss'),
});
},
handleContractFileChange(list) {
this.contractFileRows = (list || []).map(item => ({
...item,
uploadTime: item.uploadTime || this.$dayjs().format('YYYY-MM-DD HH:mm:ss'),
}));
},
attachmentUrl(row = {}) {
return row.url || row.link || row.fileUrl || row.downloadUrl || row.domain || '';
},
attachmentName(row = {}) {
return row.originalName || row.name || row.fileName || '附件';
},
attachmentExtension(row = {}) {
const source = String(this.attachmentName(row) || this.attachmentUrl(row)).split('?')[0];
const index = source.lastIndexOf('.');
return index > -1 ? source.slice(index + 1).toLowerCase() : '';
},
isAttachmentImage(row) {
return ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].includes(this.attachmentExtension(row));
},
previewAttachment(row, rows = this.attachments) {
const url = this.attachmentUrl(row);
if (!url) {
this.$message.warning('附件地址为空，无法预览');
return;
}
if (this.isAttachmentImage(row)) {
this.imagePreviewUrls = (rows || [])
.filter(item => this.isAttachmentImage(item) && this.attachmentUrl(item))
.map(item => this.attachmentUrl(item));
this.imagePreviewIndex = Math.max(this.imagePreviewUrls.indexOf(url), 0);
this.imagePreviewVisible = true;
return;
}
this.previewFile = {
name: this.attachmentName(row),
url,
mimeType: row.mimeType || row.contentType || '',
};
this.documentPreviewVisible = true;
},
handlePreviewUnsupported() {
this.$message.warning('当前文件暂不支持在线预览');
},
handlePreviewError() {
this.$message.error('附件预览失败');
},
removeContractFile(index) {
this.contractFileRows.splice(index, 1);
},
handleContractFileBatchDownload() {
(this.selectedContractFiles.length
? this.selectedContractFiles
: this.contractFileRows
).forEach(row => {
if (row.url) window.open(row.url, '_blank');
});
},
formatFileSize(value) {
const size = Number(value || 0);
return size > 1024 * 1024
? `${(size / 1024 / 1024).toFixed(2)}MB`
: `${Math.max(1, Math.ceil(size / 1024))}KB`;
},
handleChangeMaterial(event) {
if (event.raw) this.changeMaterials.push(event.raw);
},
addPaymentRatioRow() {
this.paymentRatioRows.push({
paymentTerm: `第${this.paymentRatioRows.length + 1}笔`,
ratioLimit: '',
remark: '',
});
},
ratioInput(row, value) {
let nextValue = String(value ?? '').replace(/[^\d.]/g, '');
const parts = nextValue.split('.');
if (parts.length > 2) nextValue = `${parts.shift()}.${parts.join('')}`;
const [integerPart, decimalPart] = nextValue.split('.');
nextValue =
decimalPart === undefined ? integerPart : `${integerPart}.${decimalPart.slice(0, 2)}`;
if (Number(nextValue) > 100) nextValue = '100';
row.ratioLimit = nextValue;
},
async submit() {
await this.$refs.formRef.validate();
const total = this.paymentRatioRows.reduce(
(sum, row) => sum + Number(row.ratioLimit || 0),
0
);
if (this.paymentRatioRows.length && Math.abs(total - 100) > 0.0001) {
this.$message.warning('付款比例上限合计必须等于100%');
return;
}
const settlementRule = {
preSettlementConfig: this.preSettlementConfig,
formalSettlementConfig: this.formalSettlementConfig,
};
await api.submitChange({
...this.form,
startDate: this.period[0],
endDate: this.period[1],
feeGenerationMode: this.feeGenerationMode,
billingEnabled: this.feeGenerationMode === 'system' ? 1 : 0,
billingPlanJson: JSON.stringify(this.plans),
settlementRuleJson: JSON.stringify(settlementRule),
preSettlementConfigJson: JSON.stringify(this.preSettlementConfig),
formalSettlementConfigJson: JSON.stringify(this.formalSettlementConfig),
paymentRatioJson: JSON.stringify(this.paymentRatioRows),
contractFileJson: JSON.stringify(this.contractFileRows),
attachmentsJson: JSON.stringify(this.attachments),
changeContent: this.form.changeReason,
changeReason: this.form.changeReason,
});
this.$message.success('变更已提交');
this.$router.back();
},
async load() { const id = this.$route.query.id; if (!id) return; const res = await api.getDetail(id); const data = res.data?.data || res.data || {}; this.form = { ...data, changeType: '合同信息变更' }; this.period = data.startDate && data.endDate ? [data.startDate, data.endDate] : []; this.plans = this.parse(data.billingPlanJson); this.attachments = this.parse(data.attachmentsJson); this.contractFileRows = this.parse(data.contractFileJson); const rules = this.parseObject(data.settlementRuleJson); const pre = this.parseObject(data.preSettlementConfigJson); const formal = this.parseObject(data.formalSettlementConfigJson); const legacy = Object.keys(rules).some(key => !['preSettlementConfig', 'formalSettlementConfig'].includes(key)) ? rules : {}; this.preSettlementConfig = rules.preSettlementConfig || (Object.keys(pre).length ? pre : legacy); this.formalSettlementConfig = rules.formalSettlementConfig || (Object.keys(formal).length ? formal : legacy); this.settlementRule = { ...this.preSettlementConfig }; this.feeGenerationMode = data.feeGenerationMode || (Number(data.billingEnabled) === 0 ? 'manual' : 'system'); this.paymentRatioRows = this.parse(data.paymentRatioJson); },
parse(value) { try { const result = JSON.parse(value || '[]'); return Array.isArray(result) ? result : []; } catch { return []; } },
parseObject(value) { try { return { autoGenerate: 1, settlementType: '月结', billCycleType: '固定截单日', billCutoffDay: 25, cycleDays: 15, ...(JSON.parse(value || '{}') || {}) }; } catch { return { autoGenerate: 1, settlementType: '月结', billCycleType: '固定截单日', billCutoffDay: 25, cycleDays: 15 }; } },
addPlan() { this.planEditorIndex = -1; this.planEditor = { planName: `计费方案${this.plans.length + 1}`, defaultPlan: !this.plans.length, remark: '', rules: [{}] }; this.planDialogVisible = true; },
editPlan(row, index) { this.planEditorIndex = index; this.planEditor = JSON.parse(JSON.stringify(row)); this.planDialogVisible = true; },
toggleDefaultPlan(value) { if (value) this.plans.forEach(item => { item.defaultPlan = false; }); },
savePlan(value, index) { if (index < 0) this.plans.push(value); else this.plans.splice(index, 1, value); if (value.defaultPlan) this.plans.forEach((item, current) => { if (current !== (index < 0 ? this.plans.length - 1 : index)) item.defaultPlan = false; }); },
handleSettlementTypeChange(value) { if (value !== '月结') { this.settlementRule.billCycleType = ''; this.settlementRule.billCutoffDay = ''; } else if (!this.settlementRule.billCycleType) this.settlementRule.billCycleType = '固定截单日'; if (value !== '固定天数周期结算') this.settlementRule.cycleDays = ''; },
handleCycleTypeChange(value) { if (value === '固定截单日' && !this.settlementRule.billCutoffDay) this.settlementRule.billCutoffDay = 25; if (value !== '固定截单日') this.settlementRule.billCutoffDay = ''; },
handleAttachment(event) { const raw = event.raw; if (raw) this.attachments.push({ name: raw.name, size: `${Math.ceil(raw.size / 1024)}KB`, uploadTime: this.$dayjs().format('YYYY-MM-DD HH:mm:ss') }); },
handleContractFileChange(list) { this.contractFileRows = (list || []).map(item => ({ ...item, uploadTime: item.uploadTime || this.$dayjs().format('YYYY-MM-DD HH:mm:ss') })); },
attachmentUrl(row = {}) { return row.url || row.link || row.fileUrl || row.downloadUrl || row.domain || ''; },
attachmentName(row = {}) { return row.originalName || row.name || row.fileName || '附件'; },
attachmentExtension(row = {}) { const source = String(this.attachmentName(row) || this.attachmentUrl(row)).split('?')[0]; const index = source.lastIndexOf('.'); return index > -1 ? source.slice(index + 1).toLowerCase() : ''; },
isAttachmentImage(row) { return ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].includes(this.attachmentExtension(row)); },
previewAttachment(row, rows = this.attachments) { const url = this.attachmentUrl(row); if (!url) { this.$message.warning('附件地址为空，无法预览'); return; } if (this.isAttachmentImage(row)) { this.imagePreviewUrls = (rows || []).filter(item => this.isAttachmentImage(item) && this.attachmentUrl(item)).map(item => this.attachmentUrl(item)); this.imagePreviewIndex = Math.max(this.imagePreviewUrls.indexOf(url), 0); this.imagePreviewVisible = true; return; } this.previewFile = { name: this.attachmentName(row), url, mimeType: row.mimeType || row.contentType || '' }; this.documentPreviewVisible = true; },
handlePreviewUnsupported() { this.$message.warning('当前文件暂不支持在线预览'); },
handlePreviewError() { this.$message.error('附件预览失败'); },
removeContractFile(index) { this.contractFileRows.splice(index, 1); },
handleContractFileBatchDownload() { (this.selectedContractFiles.length ? this.selectedContractFiles : this.contractFileRows).forEach(row => { if (row.url) window.open(row.url, '_blank'); }); },
formatFileSize(value) { const size = Number(value || 0); return size > 1024 * 1024 ? `${(size / 1024 / 1024).toFixed(2)}MB` : `${Math.max(1, Math.ceil(size / 1024))}KB`; },
handleChangeMaterial(event) { if (event.raw) this.changeMaterials.push(event.raw); },
addPaymentRatioRow() { this.paymentRatioRows.push({ paymentTerm: `第${this.paymentRatioRows.length + 1}笔`, ratioLimit: '', remark: '' }); },
async submit() { await this.$refs.formRef.validate(); const total = this.paymentRatioRows.reduce((sum, row) => sum + Number(row.ratioLimit || 0), 0); if (this.paymentRatioRows.length && Math.abs(total - 100) > 0.0001) { this.$message.warning('付款比例上限合计必须等于100%'); return; } const settlementRule = { preSettlementConfig: this.preSettlementConfig, formalSettlementConfig: this.formalSettlementConfig }; await api.submitChange({ ...this.form, startDate: this.period[0], endDate: this.period[1], feeGenerationMode: this.feeGenerationMode, billingEnabled: this.feeGenerationMode === 'system' ? 1 : 0, billingPlanJson: JSON.stringify(this.plans), settlementRuleJson: JSON.stringify(settlementRule), preSettlementConfigJson: JSON.stringify(this.preSettlementConfig), formalSettlementConfigJson: JSON.stringify(this.formalSettlementConfig), paymentRatioJson: JSON.stringify(this.paymentRatioRows), contractFileJson: JSON.stringify(this.contractFileRows), attachmentsJson: JSON.stringify(this.attachments), changeContent: this.form.changeReason, changeReason: this.form.changeReason }); this.$message.success('变更已提交'); this.$router.back(); },
},
};
</script>
<style scoped>
.contract-change-page {
min-height: 100%;
background: #fff;
}
.change-section {
padding: 20px 24px;
border-bottom: 1px solid #eff1f7;
}
.dialog-section-title {
margin-bottom: 18px;
font-size: 16px;
font-weight: 600;
}
.dialog-section-title::before {
display: inline-block;
width: 4px;
height: 16px;
margin-right: 8px;
vertical-align: -2px;
background: #409eff;
content: '';
}
.section-head {
display: flex;
align-items: center;
justify-content: space-between;
}
.change-table {
margin: 16px 0;
}
.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;
}
.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;
}
.page-footer {
display: flex;
gap: 16px;
padding: 20px 40px;
border-top: 1px solid #eff1f7;
}
.contract-change-page { min-height: 100%; background: #fff; }
.change-section { padding: 20px 24px; border-bottom: 1px solid #eff1f7; }
.dialog-section-title { margin-bottom: 18px; font-size: 16px; font-weight: 600; }
.dialog-section-title::before { display: inline-block; width: 4px; height: 16px; margin-right: 8px; vertical-align: -2px; background: #409eff; content: ''; }
.section-head { display: flex; align-items: center; justify-content: space-between; }
.change-table { margin: 16px 0; }
.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: 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; }
.page-footer { display: flex; gap: 16px; padding: 20px 40px; border-top: 1px solid #eff1f7; }
</style>
src/views/business/contract-manage.vue
+60 -73
View File
@@ -275,32 +275,26 @@
<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">
<el-input
v-model="form.remark"
type="textarea"
:rows="3"
:rows="2"
maxlength="200"
show-word-limit
placeholder="请输入备注"
@@ -1047,27 +1041,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,
@@ -1081,6 +1059,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,
}),
]),
]
: []),
]
);
},
@@ -2197,25 +2192,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;
@@ -2318,22 +2294,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 {
@@ -2383,4 +2366,8 @@ export default {
white-space: normal;
line-height: 1.2;
}
.contract-manage-form__tip {
color: #ff0000 !important;
font-size: 12px;
}
</style>
src/views/business/loading-manage.vue
+5 -2
View File
@@ -901,7 +901,7 @@
<el-input
v-model="dialogForm.taskRemark"
type="textarea"
:rows="3"
:rows="2"
maxlength="500"
show-word-limit
placeholder="请输入，500字以内"
@@ -957,7 +957,7 @@
</el-table>
</section-card>
<section-card title="路线编辑"><template #extra><span class="loading-route-change-dialog__hint">拖拽调整顺序</span></template><div v-if="routeChangeNodes.length" class="loading-route-change-dialog__route-list"><div v-for="(node, index) in routeChangeNodes" :key="node.key || index" class="loading-route-change-dialog__route-item" draggable="true" @dragstart="handleRouteChangeDragStart(index)" @dragover.prevent @drop="handleRouteChangeDrop(index)"><span :class="['loading-route-change-dialog__route-type', `loading-route-change-dialog__route-type--${routeChangeTypeClass(index)}`]">{{ routeChangeTypeText(index) }}</span><span>{{ node.address }}</span><span class="loading-route-change-dialog__tags"><el-tag v-for="tag in node.tags || []" :key="tag" size="small">{{ tag }}</el-tag></span><el-icon><Rank /></el-icon></div></div><el-empty v-else description="暂无路线" :image-size="60" /></section-card>
<el-form label-width="auto"><el-form-item label="变更备注"><el-input v-model="routeChangeRemark" type="textarea" :rows="1" maxlength="200" show-word-limit placeholder="请输入" /></el-form-item></el-form>
<el-form label-width="auto"><el-form-item label="变更备注"><el-input v-model="routeChangeRemark" type="textarea" :rows="2" maxlength="200" show-word-limit placeholder="请输入" /></el-form-item></el-form>
</el-tab-pane>
<el-tab-pane label="变更记录" name="records"><el-table :data="routeChangeRecords" border><el-table-column prop="changeTime" label="变更时间" min-width="170"/><el-table-column prop="changeUser" label="变更人" min-width="120"/><el-table-column prop="content" label="变更内容" min-width="360"><template #default="{ row }"><div class="loading-route-change-dialog__record-content">{{ row.content || '-' }}</div></template></el-table-column><el-table-column prop="remark" label="备注" min-width="200" show-overflow-tooltip/></el-table><el-empty v-if="!routeChangeRecords.length" description="暂无变更记录" :image-size="60"/></el-tab-pane>
</el-tabs>
@@ -2631,6 +2631,9 @@ export default {
gap: 16px;
align-items: start;
//margin-bottom: 12px;
.section-card {
min-height: 257px;
}
}
.loading-manage-dialog__candidate-actions,
src/views/business/process-config.vue
+2 -2
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"
@@ -170,7 +170,7 @@
<el-input
v-model="form.remark"
type="textarea"
:rows="4"
:rows="2"
maxlength="500"
show-word-limit
placeholder="请输入"
src/views/business/project-apply.vue
+25 -8
View File
@@ -428,7 +428,7 @@
<el-input
v-model="form.projectIntro"
type="textarea"
:rows="4"
:rows="2"
placeholder="请填写备注信息"
maxlength="200"
show-word-limit
@@ -438,7 +438,7 @@
<el-input
v-model="form.profitRemark"
type="textarea"
:rows="4"
:rows="2"
placeholder="请填写备注信息"
maxlength="200"
show-word-limit
@@ -448,7 +448,7 @@
<el-input
v-model="form.riskPoint"
type="textarea"
:rows="4"
:rows="2"
placeholder="请填写备注信息"
maxlength="200"
show-word-limit
@@ -458,7 +458,7 @@
<el-input
v-model="form.emergencyPlan"
type="textarea"
:rows="4"
:rows="2"
placeholder="请填写备注信息"
maxlength="200"
show-word-limit
@@ -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>
@@ -585,7 +585,7 @@
<el-input
v-model="form.changeContent"
type="textarea"
:rows="5"
:rows="2"
placeholder="2000字以内"
maxlength="2000"
show-word-limit
@@ -596,7 +596,7 @@
<el-input
v-model="form.changeReason"
type="textarea"
:rows="5"
:rows="2"
placeholder="2000字以内"
maxlength="2000"
show-word-limit
@@ -2075,6 +2075,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
+2 -2
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="上传"
@@ -244,7 +244,7 @@
<el-input
v-model="form.remark"
type="textarea"
:rows="4"
:rows="2"
maxlength="200"
show-word-limit
placeholder="请输入"
src/views/payment/bill-payment-form.vue
+2 -2
View File
@@ -63,7 +63,7 @@
v-model="form.remark"
:disabled="readonly"
type="textarea"
:rows="3"
:rows="2"
maxlength="200"
show-word-limit
placeholder="请输入"
@@ -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
+25 -12
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="备注">
@@ -407,7 +409,7 @@
v-model="form.remark"
:disabled="readonly"
type="textarea"
:rows="3"
:rows="2"
maxlength="200"
show-word-limit
/>
@@ -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/invoice-receipt-form.vue
+1 -1
View File
@@ -232,7 +232,7 @@
v-model="form.remark"
:disabled="readonly"
type="textarea"
:rows="3"
:rows="2"
maxlength="200"
show-word-limit
/>
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/payment/receipt-claim-record-form.vue
+1 -1
View File
@@ -145,7 +145,7 @@
</section-card>
<section-card title="备注">
<el-input v-model="form.remark" type="textarea" :rows="3" maxlength="200" disabled />
<el-input v-model="form.remark" type="textarea" :rows="2" maxlength="200" disabled />
</section-card>
<div class="claim-record-form-page__actions">
src/views/payment/receipt-flow-form.vue
+1 -1
View File
@@ -159,7 +159,7 @@
><el-input
v-model="form.remark"
type="textarea"
:rows="3"
:rows="2"
maxlength="200"
show-word-limit
/></el-form-item>
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/system/authlock.vue
+2 -2
View File
@@ -88,7 +88,7 @@
<el-input
v-model="lockUserForm.lockReason"
type="textarea"
:rows="3"
:rows="2"
placeholder="请输入锁定原因"
/>
</el-form-item>
@@ -144,7 +144,7 @@
<el-input
v-model="unlockReasonForm.unlockReason"
type="textarea"
:rows="3"
:rows="2"
placeholder="请输入解锁原因（可选）"
/>
</el-form-item>
src/views/system/user.vue
+1 -1
View File
@@ -200,7 +200,7 @@
<el-col :span="6"><el-form-item label="人员类别"><el-select v-model="form.personCategory"><el-option label="内部员工" :value="1" /><el-option label="承运商" :value="2" /></el-select></el-form-item></el-col>
<el-col :span="18"><el-form-item label="数据权限范围"><el-radio-group v-model="form.dataScopeRange"><el-radio :value="1">仅所属组织</el-radio><el-radio :value="2">全部组织</el-radio><el-radio :value="3">自定义</el-radio></el-radio-group></el-form-item></el-col>
<el-col :span="18" :offset="6"><el-form-item label="数据层级范围"><el-radio-group v-model="form.dataLevelRange"><el-radio :value="1">包含下级</el-radio><el-radio :value="2">仅本级</el-radio></el-radio-group></el-form-item></el-col>
<el-col :span="24"><el-form-item label="备注"><el-input v-model="form.remark" type="textarea" :rows="3" maxlength="200" show-word-limit /></el-form-item></el-col>
<el-col :span="24"><el-form-item label="备注"><el-input v-model="form.remark" type="textarea" :rows="2" maxlength="200" show-word-limit /></el-form-item></el-col>
</el-row>
</el-form>
</section-card>
src/views/transit/exception-disposal.vue
+1 -1
View File
@@ -200,7 +200,7 @@
type="textarea"
maxlength="500"
show-word-limit
:rows="4"
:rows="2"
placeholder="请输入"
/>
</el-form-item>
src/views/transit/risk-disposal.vue
+1 -1
View File
@@ -158,7 +158,7 @@
v-model="disposeForm.disposalRemark"
type="textarea"
maxlength="500"
:rows="4"
:rows="2"
:disabled="dialog.readonly"
/>
</el-form-item>
src/views/vehicle/credit-score-quantification.vue
+1 -1
View File
@@ -105,7 +105,7 @@
<el-input
v-model="configForm.remark"
type="textarea"
:rows="1"
:rows="2"
maxlength="500"
show-word-limit
/>
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>
@@ -4559,7 +4566,7 @@ export default {
display: flex;
align-items: center;
gap: 10px;
width: 97%;
width: 100%;
}
.business-term-field {
@@ -4650,21 +4657,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;
}
}
}