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

fix bug

Browse Source
This commit is contained in:
b2894lxlx
2026-07-27 17:19:36 +08:00
parent e50d1b8fda
commit 1c7532e0de
132 changed files with 7066 additions and 1241 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/vehicle/insurance-record.vue
+235 -51
View File
@@ -64,19 +64,27 @@
v-model="form.vehicleNo"
:fetch-suggestions="fetchVehicleOptions"
clearable
placeholder="输入车牌号/船号模糊查询选择"
:placeholder="vehicleNoPlaceholder"
value-key="value"
class="insurance-record-page__vehicle-input"
/>
</template>
<template #policyFileForm>
<div class="insurance-record-page__upload">
<div class="insurance-record-page__upload-icon">OCR</div>
<div class="insurance-record-page__upload-text">
<strong>上传图片,自动识别填写</strong>
<span>支持JPG、PNG、PDF上传</span>
<div class="insurance-record-page__upload-info">
<div class="insurance-record-page__upload-icon" aria-hidden="true">
<span class="insurance-record-page__upload-card">
<span></span>
</span>
</div>
<div class="insurance-record-page__upload-text">
<strong>上传图片,自动识别填写</strong>
<span>支持JPG、PNG、PDF上传</span>
</div>
</div>
<el-upload
v-if="hasPermission('insurance_record_ocr')"
class="insurance-record-page__upload-action"
:action="recognizeUrl"
:data="recognizeData"
:headers="uploadHeaders"
@@ -84,9 +92,40 @@
:on-success="handleRecognizeSuccess"
:on-error="handleRecognizeError"
accept=".jpg,.jpeg,.png,.pdf"
v-if="hasPermission('insurance_record_ocr')"
>
<el-button type="primary" plain>上传文件</el-button>
<el-button class="insurance-record-page__upload-button" type="primary" plain>
上传文件
</el-button>
</el-upload>
</div>
</template>
<template #policyFile-form>
<div class="insurance-record-page__upload">
<div class="insurance-record-page__upload-info">
<div class="insurance-record-page__upload-icon" aria-hidden="true">
<span class="insurance-record-page__upload-card">
<span></span>
</span>
</div>
<div class="insurance-record-page__upload-text">
<strong>上传图片,自动识别填写</strong>
<span>支持JPG、PNG、PDF上传</span>
</div>
</div>
<el-upload
v-if="hasPermission('insurance_record_ocr')"
class="insurance-record-page__upload-action"
:action="recognizeUrl"
:data="recognizeData"
:headers="uploadHeaders"
:show-file-list="false"
:on-success="handleRecognizeSuccess"
:on-error="handleRecognizeError"
accept=".jpg,.jpeg,.png,.pdf"
>
<el-button class="insurance-record-page__upload-button" type="primary" plain>
上传文件
</el-button>
</el-upload>
</div>
</template>
@@ -98,7 +137,7 @@
@load="onLoad(page, query)"
/>
<el-dialog title="保险记录数据导入" append-to-body v-model="excelBox" width="555px">
<avue-form :option="excelOption" v-model="excelForm" :upload-after="uploadAfter">
<avue-form :option="excelOption" v-model="excelForm">
<template #excelTemplate>
<el-button type="primary" @click="handleTemplate">
点击下载<i class="el-icon-download el-icon--right"></i>
@@ -116,6 +155,7 @@ import { getList as getShipList } from '@/api/transportCapacity/transport-ship';
import { getDeptTree } from '@/api/system/dept';
import { exportBlob } from '@/api/common';
import { downloadXls } from '@/utils/util';
import { openImportDialog } from '@/utils/import-excel';
import { getToken } from '@/utils/auth';
import { mapGetters } from 'vuex';
import { excelOption, option } from '@/option/vehicle/insurance-record';
@@ -130,6 +170,7 @@ export default {
loading: true,
excelBox: false,
excelForm: {},
isDetailLoading: false,
option,
excelOption,
page: {
@@ -159,6 +200,9 @@ export default {
editBtn: this.hasPermission('insurance_record_edit'),
};
},
vehicleNoPlaceholder() {
return this.form.vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
},
ids() {
const ids = [];
this.selectionList.forEach(ele => {
@@ -181,10 +225,26 @@ export default {
};
},
},
watch: {
'form.vehicleType': {
handler(value, oldValue) {
this.updateVehicleTypeDisplays(value || '车辆', oldValue);
},
immediate: true,
},
},
methods: {
hasPermission(code) {
return this.isAdmin || this.validData(this.permission[code], false);
},
updateVehicleTypeDisplays(vehicleType, oldValue) {
const vehicleNoColumn = this.findColumn(this.option.column, 'vehicleNo');
vehicleNoColumn.placeholder =
vehicleType === '船舶' ? '输入船号模糊查询选择' : '输入车牌号模糊查询选择';
if (!this.isDetailLoading && oldValue && vehicleType !== oldValue && this.form.vehicleNo) {
this.form.vehicleNo = '';
}
},
initDeptTree() {
getDeptTree(this.userInfo.tenantId).then(res => {
const column = this.findColumn(this.option.column, 'createDept');
@@ -195,9 +255,7 @@ export default {
const vehicleType = this.form.vehicleType || '车辆';
const request = vehicleType === '船舶' ? getShipList : getVehicleList;
const params =
vehicleType === '船舶'
? { shipIdentifierNo: queryString }
: { plateNo: queryString };
vehicleType === '船舶' ? { shipIdentifierNo: queryString } : { plateNo: queryString };
request(1, 20, params)
.then(res => {
const records = res.data.data.records || [];
@@ -211,8 +269,12 @@ export default {
},
normalizeRow(row) {
const values = { ...row };
values.vehicleType = values.vehicleType || '车辆';
if (values.vehicleNo) {
values.vehicleNo = values.vehicleNo.trim().toUpperCase();
values.vehicleNo =
values.vehicleType === '船舶'
? values.vehicleNo.trim()
: values.vehicleNo.trim().toUpperCase();
}
if (values.policyNo) {
values.policyNo = values.policyNo.trim();
@@ -305,9 +367,17 @@ export default {
this.form.ocrTemplate = '紫金-机动车交强险';
}
if (['edit', 'view'].includes(type)) {
getDetail(this.form.id).then(res => {
this.form = res.data.data;
});
this.isDetailLoading = true;
getDetail(this.form.id)
.then(res => {
this.form = {
...res.data.data,
vehicleType: res.data.data.vehicleType || '车辆',
};
})
.finally(() => {
this.isDetailLoading = false;
});
}
done();
},
@@ -351,12 +421,7 @@ export default {
});
},
handleImport() {
this.excelBox = true;
},
uploadAfter(res, done) {
this.excelBox = false;
this.onLoad(this.page);
done();
openImportDialog(this, '保险记录');
},
handleExport() {
this.$confirm('是否导出保险记录数据?', '提示', {
@@ -365,7 +430,10 @@ export default {
type: 'warning',
}).then(() => {
NProgress.start();
exportBlob('/blade-transport/insurance-record/export-insurance-record', this.buildExportParams())
exportBlob(
'/blade-transport/insurance-record/export-insurance-record',
this.buildExportParams()
)
.then(res => {
downloadXls(res.data, `保险记录${this.$dayjs().format('YYYY-MM-DD HH:mm:ss')}.xlsx`);
})
@@ -383,7 +451,9 @@ export default {
},
handleTemplate() {
exportBlob(
`/blade-transport/insurance-record/export-template?${this.website.tokenHeader}=${getToken()}`
`/blade-transport/insurance-record/export-template?${
this.website.tokenHeader
}=${getToken()}`
).then(res => {
downloadXls(res.data, '保险记录模板.xlsx');
});
@@ -417,39 +487,153 @@ export default {
&__vehicle-input {
width: 100%;
}
}
&__upload {
display: flex;
align-items: center;
gap: 18px;
min-height: 88px;
padding: 18px 24px;
border: 1px dashed #8c8c8c;
border-radius: 6px;
}
:global(.insurance-record-page__upload) {
display: flex;
align-items: center;
justify-content: space-between;
min-height: 116px;
padding: 26px 46px 26px 32px;
border: 2px dashed #8b8b8b;
border-radius: 12px;
background: #fff;
}
&__upload-icon {
display: flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
color: #606266;
border: 2px solid #8c8c8c;
border-radius: 6px;
font-weight: 600;
}
:global(.insurance-record-page__upload-info) {
display: flex;
align-items: center;
min-width: 0;
}
&__upload-text {
display: flex;
flex: 1;
:global(.insurance-record-page__upload-icon) {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 56px;
height: 56px;
margin-right: 30px;
color: #707070;
}
:global(.insurance-record-page__upload-icon::before),
:global(.insurance-record-page__upload-icon::after) {
position: absolute;
width: 14px;
height: 14px;
content: '';
}
:global(.insurance-record-page__upload-icon::before) {
top: 0;
left: 0;
border-top: 4px solid currentColor;
border-left: 4px solid currentColor;
border-radius: 4px 0 0;
}
:global(.insurance-record-page__upload-icon::after) {
right: 0;
bottom: 0;
border-right: 4px solid currentColor;
border-bottom: 4px solid currentColor;
border-radius: 0 0 4px;
}
:global(.insurance-record-page__upload-card) {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 36px;
height: 28px;
border: 4px solid currentColor;
border-radius: 4px;
}
:global(.insurance-record-page__upload-card::before),
:global(.insurance-record-page__upload-card::after) {
position: absolute;
content: '';
}
:global(.insurance-record-page__upload-card::before) {
top: 7px;
left: 9px;
width: 8px;
height: 8px;
border: 3px solid currentColor;
border-radius: 2px;
}
:global(.insurance-record-page__upload-card::after) {
top: 8px;
right: 7px;
width: 8px;
height: 3px;
background: currentColor;
box-shadow: 0 8px 0 currentColor;
}
:global(.insurance-record-page__upload-card span) {
position: absolute;
right: 7px;
bottom: 5px;
width: 10px;
height: 3px;
background: currentColor;
}
:global(.insurance-record-page__upload-text) {
display: flex;
flex-direction: column;
gap: 8px;
color: #303133;
font-size: 20px;
line-height: 1.25;
}
:global(.insurance-record-page__upload-text strong) {
font-weight: 700;
}
:global(.insurance-record-page__upload-text span) {
color: #303133;
font-weight: 500;
}
:global(.insurance-record-page__upload-action) {
flex: 0 0 auto;
margin-left: 24px;
}
:global(.insurance-record-page__upload-action .el-upload) {
display: block;
}
:global(.insurance-record-page__upload-button) {
min-width: 156px;
height: 58px;
border-radius: 8px;
font-size: 20px;
font-weight: 500;
}
@media (max-width: 768px) {
:global(.insurance-record-page__upload) {
align-items: stretch;
flex-direction: column;
gap: 6px;
color: #303133;
gap: 18px;
padding: 22px;
}
span {
color: #606266;
}
:global(.insurance-record-page__upload-action) {
margin-left: 0;
}
:global(.insurance-record-page__upload-button) {
width: 100%;
}
}
</style>