Compare commits

...

2 Commits

Author SHA1 Message Date
dk
b1cbc3d304 Merge remote-tracking branch 'origin/main'
# Conflicts:
#	frontend/src/api/aireport/testReport/index.ts
#	frontend/src/api/aireport/testReport/interface/index.ts
#	frontend/src/views/aireport/testReport/components/ReportTaskFormDialog.vue
#	frontend/src/views/aireport/testReport/components/ReportTaskLedgerImportPanel.vue
#	frontend/src/views/aireport/testReport/contracts/check-test-report-page-contract.mjs
#	frontend/src/views/aireport/testReport/index.vue
2026-07-13 22:04:52 +08:00
dk
08fd57ada1 refactor(testReport): 重构台账导入功能为校验模式,优化布局。
feat(user): 增加用户签名管理功能。
2026-07-13 22:04:10 +08:00
9 changed files with 1377 additions and 700 deletions

View File

@@ -37,15 +37,11 @@ export const downloadReportTaskLedgerTemplateApi = (): Promise<AxiosResponse<Blo
}) as unknown as Promise<AxiosResponse<Blob>> }) as unknown as Promise<AxiosResponse<Blob>>
export const validateReportTaskLedgerApi = (id: string, formData: FormData) => { export const validateReportTaskLedgerApi = (id: string, formData: FormData) => {
return http.post<ReportTask.ReportTaskLedgerValidateResult>(`${REPORT_TASK_BASE_URL}/${id}/ledger/validate`, formData, { return http.post<ReportTask.ReportTaskLedgerImportResult>(`${REPORT_TASK_BASE_URL}/${id}/ledger/validate`, formData, {
headers: { 'Content-Type': 'multipart/form-data' } headers: { 'Content-Type': 'multipart/form-data' }
}) })
} }
export const importReportTaskLedgerApi = (id: string, params: ReportTask.ReportTaskLedgerImportRequest) => {
return http.post<ReportTask.ReportTaskLedgerImportResult>(`${REPORT_TASK_BASE_URL}/${id}/ledger/import`, params)
}
export const listReportTaskGroupReportsApi = (id: string) => { export const listReportTaskGroupReportsApi = (id: string) => {
return http.get<ReportTask.ReportTaskGroupReportRecord[]>(`${REPORT_TASK_BASE_URL}/${id}/group-report/list`) return http.get<ReportTask.ReportTaskGroupReportRecord[]>(`${REPORT_TASK_BASE_URL}/${id}/group-report/list`)
} }

View File

@@ -1,11 +1,9 @@
export namespace ReportTask { export namespace ReportTask {
export type ReportTaskState = '01' | '02' | '03' | '04' | '05'
export type ReportTaskGenerateState = 0 | 1 | 2
export type ReportTaskGroupReportGenerateState = 0 | 1 | 2 | 3 export type ReportTaskGroupReportGenerateState = 0 | 1 | 2 | 3
export type ReportTaskLedgerImportStage = export type ReportTaskLedgerImportStage =
| '选择文件' | '选择文件'
| '校验文件' | '校验文件'
| '文件导入' | '文件上传'
| '基础资料维护' | '基础资料维护'
| '完成' | '完成'
@@ -25,11 +23,10 @@ export namespace ReportTask {
checkerName?: string | null checkerName?: string | null
checkTime?: string | null checkTime?: string | null
checkResult?: string | null checkResult?: string | null
state?: ReportTaskState | null
status?: number status?: number
pointCount?: number | null pointCount?: number | null
groupCount?: number | null groupCount?: number | null
reportGenerateState?: ReportTaskGenerateState | null reportGenerateState?: number | null
createBy?: string | null createBy?: string | null
createByName?: string | null createByName?: string | null
createTime?: string | null createTime?: string | null
@@ -43,7 +40,6 @@ export namespace ReportTask {
keyword?: string keyword?: string
searchBeginTime?: string searchBeginTime?: string
searchEndTime?: string searchEndTime?: string
state?: ReportTaskState | ''
timeRange?: string[] timeRange?: string[]
pageNum?: number pageNum?: number
pageSize?: number pageSize?: number
@@ -58,6 +54,7 @@ export namespace ReportTask {
contractNumber: string contractNumber: string
standard: string[] standard: string[]
data: string data: string
batchId?: string
phonenumber?: string phonenumber?: string
} }
@@ -98,57 +95,12 @@ export namespace ReportTask {
} | null } | null
} }
export interface ReportTaskLedgerValidateAttachment {
attachmentName?: string | null
attachmentType?: string | null
referenced?: boolean | null
uploaded?: boolean | null
missing?: boolean | null
reuploadAllowed?: boolean | null
message?: string | null
}
export interface ReportTaskLedgerValidatePoint {
rowNo?: number | null
pointKey?: string | null
substationName?: string | null
pointName?: string | null
complete?: boolean | null
missingAttachmentCount?: number | null
testDeviceNoValid?: boolean | null
testDeviceNoMessage?: string | null
clientUnitNameValid?: boolean | null
clientUnitNameMessage?: string | null
attachments?: ReportTaskLedgerValidateAttachment[] | null
}
export interface ReportTaskLedgerValidateResult {
sessionId?: string | null
batchId?: string | null
success?: boolean | null
summaryFileName?: string | null
summaryFilePresent?: boolean | null
tempStoragePath?: string | null
uploadedFileCount?: number | null
pointCount?: number | null
missingAttachmentCount?: number | null
canContinueUpload?: boolean | null
requiredSheets?: string[] | null
existingSheets?: string[] | null
missingSheets?: string[] | null
orphanAttachmentNames?: string[] | null
failReasons?: string[] | null
points?: ReportTaskLedgerValidatePoint[] | null
}
export interface ReportTaskLedgerImportResult { export interface ReportTaskLedgerImportResult {
batchId?: string | null batchId?: string | null
currentStage?: ReportTaskLedgerImportStage | string | null currentStage?: ReportTaskLedgerImportStage | string | null
success?: boolean | null success?: boolean | null
summaryFileName?: string | null summaryFileName?: string | null
tempStoragePath?: string | null
totalFileCount?: number totalFileCount?: number
uploadedFileCount?: number
pointCount?: number pointCount?: number
excelAttachmentCount?: number excelAttachmentCount?: number
wordAttachmentCount?: number wordAttachmentCount?: number
@@ -161,10 +113,6 @@ export namespace ReportTask {
stages?: ReportTaskLedgerImportStageRecord[] | null stages?: ReportTaskLedgerImportStageRecord[] | null
} }
export interface ReportTaskLedgerImportRequest {
batchId: string
}
export interface ReportTaskPointRecord { export interface ReportTaskPointRecord {
id?: string id?: string
groupNo?: number | null groupNo?: number | null
@@ -204,12 +152,10 @@ export namespace ReportTask {
export interface ReportTaskLedgerPreparedState { export interface ReportTaskLedgerPreparedState {
draftId: string draftId: string
validateSessionId: string batchId: string
validateResult: ReportTaskLedgerValidateResult | null
latestImportResult: ReportTaskLedgerImportResult | null latestImportResult: ReportTaskLedgerImportResult | null
snapshot: ReportTaskLedgerImportSnapshot | null snapshot: ReportTaskLedgerImportSnapshot | null
hasImported: boolean hasImported: boolean
validatedBatchId: string pendingReimport: boolean
pendingRevalidate: boolean
} }
} }

View File

@@ -20,60 +20,67 @@ export namespace Login {
} }
} }
// 用户管理模块 // 用户管理模块
export namespace User { export namespace User {
/**
* 用户数据表格分页查询参数
*/
export interface ReqUserParams extends ReqPage {
id: string // 装置序号用户ID 必填
name?: string //用户名(别名)
loginTime?: string //最后一次登录时间
}
/** // 用户接口
* 用户数据表格分页查询参数 export interface ResUser {
*/ id: string //用户ID作为唯一标识
export interface ReqUserParams extends ReqPage{ name: string //用户名(别名)
id: string; // 装置序号用户ID 必填 loginName: string //登录名
name?: string; //用户名(别名) deptId?: number //部门ID
loginTime?: string;//最后一次登录时间 password: string //密码
} phone?: string //手机号
email?: string //邮箱
loginTime?: string //最后一次登录时间
loginErrorTimes: number //登录错误次数
lockTime?: string //用户密码错误锁定时间
state: number //0-删除;1-正常;2-锁定;3-待审核;4-休眠;5-密码过期
createBy?: string //创建用户
createTime?: string //创建时间
updateBy?: string //更新用户
updateTime?: string //更新时间
roleIds?: string[]
roleNames?: string[]
roleCodes?: string[]
signatureFileId?: string
signatureFileName?: string
disabled?: boolean
}
// 用户接口 export interface UserSaveRequest {
export interface ResUser { id?: string
id: string; //用户ID作为唯一标识 name: string
name: string; //用户名(别名) loginName?: string
loginName: string;//登录名 password?: string
deptId?: number;//部门ID deptId?: string | number
password: string; //密码 phone?: string
phone?: string; //手机号 email?: string
email?: string; //邮箱 roleIds?: string[]
loginTime?: string;//最后一次登录时间 }
loginErrorTimes: number;//登录错误次数
lockTime?: string; //用户密码错误锁定时间
state:number;//0-删除;1-正常;2-锁定;3-待审核;4-休眠;5-密码过期
createBy?: string;//创建用户
createTime?: string;//创建时间
updateBy?: string;//更新用户
updateTime?: string;//更新时间
roleIds?: string[]; //
roleNames?:string[]; //
roleCodes?:string[]; //
disabled?: boolean;
}
// 用户接口 // 用户接口
export interface ResPassWordUser { export interface ResPassWordUser {
id: string; //用户ID作为唯一标识 id: string //用户ID作为唯一标识
oldPassword: string; //密码 oldPassword: string //密码
newPassword: string; //新密码 newPassword: string //新密码
surePassword:string; surePassword: string
} }
/**
* 用户表格查询分页返回的对象;
*/
export interface ResUserPage extends ResPage<ResUser> {}
// // 用户+分页
// export interface ReqUserParams extends ReqPage,UserBO {
/** // }
* 用户表格查询分页返回的对象;
*/
export interface ResUserPage extends ResPage<ResUser> {
}
// // 用户+分页
// export interface ReqUserParams extends ReqPage,UserBO {
// }
} }

View File

@@ -1,43 +1,65 @@
import type { AxiosResponse } from 'axios'
import http from '@/api'
import type { Role } from '@/api/user/interface/role' import type { Role } from '@/api/user/interface/role'
import type { User } from '@/api/user/interface/user' import type { User } from '@/api/user/interface/user'
import http from '@/api'
const buildUserFormData = (request: User.UserSaveRequest, signatureFile?: File | null) => {
const formData = new FormData()
// 关键业务节点:新增和编辑用户都按 request JSON Part + signatureFile 文件分段提交,字段名必须与后端 @RequestPart 保持一致。
formData.append('request', new Blob([JSON.stringify(request)], { type: 'application/json' }))
if (signatureFile) {
formData.append('signatureFile', signatureFile)
}
return formData
}
/** /**
* @name 用户管理模块 * @name 用户管理模块
*/ */
// 获取用户列表 // 获取用户列表
export const getUserList = (params: User.ReqUserParams) => { export const getUserList = (params: User.ReqUserParams) => {
return http.post(`/sysUser/list`, params) return http.post(`/sysUser/list`, params)
} }
// 新增用户 // 新增用户
export const addUser = (params: User.ResUser) => { export const addUser = (request: User.UserSaveRequest, signatureFile?: File | null) => {
return http.post(`/sysUser/add`, params) return http.post(`/sysUser/add`, buildUserFormData(request, signatureFile), {
headers: { 'Content-Type': 'multipart/form-data' }
})
} }
// 编辑用户 // 编辑用户
export const updateUser = (params: User.ResUser) => { export const updateUser = (request: User.UserSaveRequest, signatureFile?: File | null) => {
return http.post(`/sysUser/update`, params) return http.post(`/sysUser/update`, buildUserFormData(request, signatureFile), {
headers: { 'Content-Type': 'multipart/form-data' }
})
} }
// 删除用户 // 删除用户
export const deleteUser = (params: string[] ) => { export const deleteUser = (params: string[]) => {
return http.post(`/sysUser/delete`, params) return http.post(`/sysUser/delete`, params)
} }
// 获取角色列表 // 获取角色列表
export const getRoleList = () => { export const getRoleList = () => {
return http.get<Role.RoleBO>(`/sysRole/simpleList`) return http.get<Role.RoleBO>(`/sysRole/simpleList`)
} }
//修改密码 // 修改密码
export const updatePassWord = (params: User.ResPassWordUser) => { export const updatePassWord = (params: User.ResPassWordUser) => {
return http.post(`/sysUser/updatePassword`,params) return http.post(`/sysUser/updatePassword`, params)
} }
// 获取所有用户 // 获取所有用户
export const getAllUser= () => { export const getAllUser = () => {
return http.get(`/sysUser/getAll`) return http.get(`/sysUser/getAll`)
}
export const previewUserSignature = (id: string): Promise<AxiosResponse<Blob>> => {
return http.get(`/sysUser/${id}/signature`, undefined, { responseType: 'blob' }) as unknown as Promise<
AxiosResponse<Blob>
>
} }

View File

@@ -0,0 +1,434 @@
<template>
<div class="ledger-import-panel">
<div class="panel-block">
<div class="section-header">
<div class="section-title">数据导入</div>
</div>
<el-alert
v-if="preparedState.pendingReimport"
title="已重新选择文件,当前校验结果已失效,请重新执行台账校验。"
type="warning"
:closable="false"
show-icon
class="section-alert"
/>
<div class="toolbar">
<div class="toolbar-actions">
<el-upload
:auto-upload="false"
:show-file-list="false"
multiple
accept=".xls,.xlsx,.doc,.docx"
:disabled="disabled || importing"
@change="handleFileChange"
@remove="handleFileRemove"
>
<template #trigger>
<el-button type="primary" plain :icon="FolderOpened" :disabled="disabled || importing">选择文件</el-button>
</template>
</el-upload>
<el-button type="primary" :icon="UploadFilled" :loading="importing" :disabled="disabled" @click="handleImportFiles">
执行校验
</el-button>
</div>
<el-button class="toolbar-download" type="primary" plain :icon="Download" :disabled="disabled || importing" @click="handleDownloadTemplate">
下载模板
</el-button>
</div>
<el-table v-if="selectedFiles.length" :data="selectedFiles" border size="small" max-height="260" class="file-table">
<el-table-column type="index" label="序号" width="68" />
<el-table-column prop="name" label="文件名称" min-width="280" show-overflow-tooltip />
<el-table-column label="文件大小" width="140">
<template #default="{ row }">{{ formatFileSize(row.size) }}</template>
</el-table-column>
<el-table-column label="文件类型" width="120">
<template #default="{ row }">{{ resolveFileTypeText(row.name) }}</template>
</el-table-column>
<el-table-column label="操作" width="100" fixed="right">
<template #default="{ $index }">
<el-button link type="danger" :disabled="disabled || importing" @click="removeSelectedFile($index)">
删除
</el-button>
</template>
</el-table-column>
</el-table>
<el-empty v-else description="尚未选择待导入文件" :image-size="88" />
</div>
<div v-if="latestImportResult" class="panel-block">
<div class="section-header">
<div class="section-title">导入结果</div>
<div class="section-desc">以后端返回的阶段结果和汇总统计为准</div>
</div>
<el-descriptions :column="3" border>
<el-descriptions-item label="当前阶段">{{ resolveReportTaskText(latestImportResult.currentStage) }}</el-descriptions-item>
<el-descriptions-item label="导入状态">
<el-tag :type="latestImportResult.success ? 'success' : 'warning'">
{{ latestImportResult.success ? '成功' : '未完成' }}
</el-tag>
</el-descriptions-item>
<el-descriptions-item label="汇总文件">{{ resolveReportTaskText(latestImportResult.summaryFileName) }}</el-descriptions-item>
<el-descriptions-item label="总文件数">{{ resolveReportTaskText(latestImportResult.totalFileCount) }}</el-descriptions-item>
<el-descriptions-item label="监测点数">{{ resolveReportTaskText(latestImportResult.pointCount) }}</el-descriptions-item>
<el-descriptions-item label="分组数">{{ resolveReportTaskText(latestImportResult.groupCount) }}</el-descriptions-item>
<el-descriptions-item label="Excel 附件数">
{{ resolveReportTaskText(latestImportResult.excelAttachmentCount) }}
</el-descriptions-item>
<el-descriptions-item label="Word 附件数">
{{ resolveReportTaskText(latestImportResult.wordAttachmentCount) }}
</el-descriptions-item>
<el-descriptions-item label="设备新增 / 复用">
{{ `${latestImportResult.deviceAddedCount || 0} / ${latestImportResult.deviceReuseCount || 0}` }}
</el-descriptions-item>
<el-descriptions-item label="委托单位新增 / 复用" :span="2">
{{ `${latestImportResult.clientAddedCount || 0} / ${latestImportResult.clientReuseCount || 0}` }}
</el-descriptions-item>
</el-descriptions>
<el-alert
v-if="latestImportResult.failReasons?.length"
:title="`存在 ${latestImportResult.failReasons.length} 条失败提示`"
type="warning"
:closable="false"
show-icon
class="section-alert"
>
<template #default>
<div v-for="reason in latestImportResult.failReasons" :key="reason" class="fail-reason">{{ reason }}</div>
</template>
</el-alert>
<el-table
v-if="orderedStages.length"
:data="orderedStages"
border
size="small"
max-height="240"
class="stage-table"
>
<el-table-column prop="stage" label="阶段" width="150" />
<el-table-column label="结果" width="120">
<template #default="{ row }">
<el-tag :type="row.success ? 'success' : 'warning'">{{ row.success ? '成功' : '未通过' }}</el-tag>
</template>
</el-table-column>
<el-table-column prop="message" label="说明" min-width="280" show-overflow-tooltip />
</el-table>
</div>
<div v-if="snapshot" class="panel-block">
<div class="section-header">
<div class="section-title">已保存快照</div>
<div class="section-desc">编辑场景下展示当前任务最近一次已保存的台账处理摘要</div>
</div>
<el-descriptions :column="2" border>
<el-descriptions-item label="汇总文件">{{ resolveReportTaskText(snapshot.summaryFileName) }}</el-descriptions-item>
<el-descriptions-item label="导入模式">{{ resolveReportTaskText(snapshot.importMode) }}</el-descriptions-item>
<el-descriptions-item label="监测点 Sheet">
{{ resolveReportTaskText(snapshot.sheetSummary?.pointSheet) }}
</el-descriptions-item>
<el-descriptions-item label="监测点行数">{{ resolveReportTaskText(snapshot.rowCount) }}</el-descriptions-item>
<el-descriptions-item label="设备 Sheet">
{{ snapshot.sheetSummary?.deviceSheetPresent ? '存在' : '不存在' }}
</el-descriptions-item>
<el-descriptions-item label="委托单位 Sheet">
{{ snapshot.sheetSummary?.clientSheetPresent ? '存在' : '不存在' }}
</el-descriptions-item>
</el-descriptions>
</div>
</div>
</template>
<script setup lang="ts">
import { Download, FolderOpened, UploadFilled } from '@element-plus/icons-vue'
import { ElMessage, type UploadFile, type UploadFiles } from 'element-plus'
import { computed, ref, watch } from 'vue'
import { downloadReportTaskLedgerTemplateApi, validateReportTaskLedgerApi } from '@/api/aireport/testReport'
import type { ReportTask } from '@/api/aireport/testReport/interface'
import { useDownloadWithServerFileName } from '@/hooks/useDownload'
import {
TEST_REPORT_LEDGER_IMPORT_STAGE_ORDER,
checkReportTaskLedgerPrepared,
getReportTaskErrorMessage,
isReportTaskLedgerAttachmentFileName,
normalizeReportTaskLedgerImportResult,
resolveReportTaskText
} from '../utils/testReport'
defineOptions({
name: 'ReportTaskLedgerImportPanel'
})
type ReportTaskLogType = 'info' | 'success' | 'warning' | 'error'
const props = defineProps<{
draftId: string
disabled?: boolean
preparedState: ReportTask.ReportTaskLedgerPreparedState
snapshot: ReportTask.ReportTaskLedgerImportSnapshot | null
}>()
const emit = defineEmits<{
(event: 'change', value: ReportTask.ReportTaskLedgerPreparedState): void
(event: 'log', payload: { type: ReportTaskLogType; message: string }): void
}>()
const importing = ref(false)
const selectedFiles = ref<UploadFile[]>([])
const latestImportResult = ref<ReportTask.ReportTaskLedgerImportResult | null>(null)
const orderedStages = computed(() => {
const stageMap = new Map((latestImportResult.value?.stages || []).map(stage => [stage.stage, stage]))
return TEST_REPORT_LEDGER_IMPORT_STAGE_ORDER.map(stage => {
const currentStage = stageMap.get(stage)
return {
stage,
success: currentStage?.success ?? false,
message: currentStage?.message || ''
}
}).filter(stage => stage.message || latestImportResult.value?.currentStage === stage.stage || stage.success)
})
const pushLog = (type: ReportTaskLogType, message: string) => {
emit('log', {
type,
message
})
}
const updatePreparedState = (patch: Partial<ReportTask.ReportTaskLedgerPreparedState>) => {
emit('change', {
...props.preparedState,
...patch
})
}
watch(
() => props.preparedState,
value => {
latestImportResult.value = value.latestImportResult
},
{ immediate: true, deep: true }
)
const formatFileSize = (size?: number) => {
if (!size) return '0 B'
if (size < 1024) return `${size} B`
if (size < 1024 * 1024) return `${(size / 1024).toFixed(1)} KB`
return `${(size / (1024 * 1024)).toFixed(1)} MB`
}
const resolveFileTypeText = (fileName: string) => {
const normalizedName = String(fileName || '').trim().toLowerCase()
if (normalizedName === '台账信息汇总.xlsx') return '汇总台账'
if (normalizedName.endsWith('.doc') || normalizedName.endsWith('.docx')) return 'Word 附件'
if (normalizedName.endsWith('.xls') || normalizedName.endsWith('.xlsx')) return 'Excel 附件'
return '未知'
}
const handleFileChange = (_file: UploadFile, files: UploadFiles) => {
selectedFiles.value = [...files]
pushLog('info', `已选择 ${selectedFiles.value.length} 个待导入文件`)
if (props.preparedState.hasImported) {
updatePreparedState({
batchId: '',
pendingReimport: true
})
pushLog('warning', '已更换导入文件,需重新执行台账校验后才能继续保存')
}
}
const handleFileRemove = (_file: UploadFile, files: UploadFiles) => {
selectedFiles.value = [...files]
pushLog('info', `已更新待导入文件列表,当前剩余 ${selectedFiles.value.length} 个文件`)
if (props.preparedState.hasImported) {
updatePreparedState({
batchId: '',
pendingReimport: true
})
pushLog('warning', '导入文件已发生变化,之前的导入结果已标记为失效')
}
}
const removeSelectedFile = (index: number) => {
selectedFiles.value.splice(index, 1)
pushLog('info', `已删除第 ${index + 1} 个待导入文件`)
if (props.preparedState.hasImported) {
updatePreparedState({
batchId: '',
pendingReimport: true
})
pushLog('warning', '导入文件已发生变化,之前的导入结果已标记为失效')
}
}
const handleDownloadTemplate = async () => {
try {
await useDownloadWithServerFileName(downloadReportTaskLedgerTemplateApi, '台账信息汇总', undefined, false, '.xlsx')
pushLog('success', '台账导入模板下载成功')
} catch (error) {
const message = getReportTaskErrorMessage(error, '台账模板下载失败')
ElMessage.error(message)
pushLog('error', message)
}
}
const handleImportFiles = async () => {
if (importing.value) return
if (!props.draftId) {
const message = '报告任务 ID 缺失,无法执行台账校验'
ElMessage.error(message)
pushLog('error', message)
return
}
if (!selectedFiles.value.length) {
const message = '请先选择待校验的台账汇总与附件文件'
ElMessage.warning(message)
pushLog('warning', message)
return
}
const invalidFile = selectedFiles.value.find(file => !isReportTaskLedgerAttachmentFileName(file.name))
if (invalidFile) {
const message = '仅支持导入 .xls、.xlsx、.doc、.docx 文件'
ElMessage.warning(message)
pushLog('warning', `${message},异常文件:${invalidFile.name}`)
return
}
const formData = new FormData()
selectedFiles.value.forEach(file => {
if (file.raw) {
formData.append('files', file.raw)
}
})
if (!formData.getAll('files').length) {
const message = '未检测到可上传的文件内容'
ElMessage.warning(message)
pushLog('warning', message)
return
}
importing.value = true
pushLog('info', `开始校验台账和附件文件,本次共上传 ${selectedFiles.value.length} 个文件`)
try {
const response = await validateReportTaskLedgerApi(props.draftId, formData)
const normalizedResult = normalizeReportTaskLedgerImportResult(response)
latestImportResult.value = normalizedResult
updatePreparedState({
batchId: normalizedResult.batchId || '',
latestImportResult: normalizedResult,
hasImported: Boolean(normalizedResult.success),
pendingReimport: false
})
if (
!checkReportTaskLedgerPrepared({
...props.preparedState,
batchId: normalizedResult.batchId || '',
latestImportResult: normalizedResult,
hasImported: Boolean(normalizedResult.success),
pendingReimport: false
})
) {
const message = '台账校验未通过,请根据阶段结果修正后重新校验'
ElMessage.warning(message)
pushLog('warning', message)
normalizedResult.failReasons?.forEach(reason => pushLog('warning', reason))
return
}
ElMessage.success('台账校验通过')
pushLog('success', '台账校验通过,可以继续填写基础信息')
} catch (error) {
updatePreparedState({
batchId: '',
hasImported: false
})
const message = getReportTaskErrorMessage(error, '台账校验失败')
ElMessage.error(message)
pushLog('error', message)
} finally {
importing.value = false
}
}
</script>
<style scoped lang="scss">
.ledger-import-panel {
display: flex;
flex-direction: column;
gap: 16px;
min-height: 0;
}
.panel-block {
border: 1px solid var(--el-border-color-light);
border-radius: 12px;
padding: 16px;
background: var(--el-fill-color-blank);
}
.panel-block:first-child {
flex: 1;
display: flex;
flex-direction: column;
}
.section-header {
margin-bottom: 14px;
}
.section-title {
font-size: 15px;
font-weight: 600;
color: var(--el-text-color-primary);
}
.section-alert,
.file-table,
.stage-table,
.fail-reason + .fail-reason {
margin-top: 12px;
}
.toolbar {
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
justify-content: space-between;
}
.toolbar-actions {
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
}
.toolbar-download {
margin-left: auto;
}
:deep(.el-empty) {
flex: 1;
}
</style>

View File

@@ -21,97 +21,104 @@ assertFileIncludes(path.join(srcDir, 'constants/dictCodes.ts'), ['TEST_REPORT_CO
assertFileIncludes(path.join(apiDir, 'index.ts'), [ assertFileIncludes(path.join(apiDir, 'index.ts'), [
"const REPORT_TASK_BASE_URL = '/api/test-report'", "const REPORT_TASK_BASE_URL = '/api/test-report'",
'validateReportTaskLedgerApi', 'listReportTasksApi',
'createReportTaskApi',
'updateReportTaskApi',
'deleteReportTasksApi',
'getReportTaskDetailApi',
'exportReportTasksApi',
'submitReportTaskAuditApi',
'downloadReportTaskLedgerTemplateApi',
'importReportTaskLedgerApi', 'importReportTaskLedgerApi',
'downloadReportTaskLedgerTemplateApi' 'listReportTaskGroupReportsApi'
]) ])
assertFileIncludes(path.join(apiDir, 'interface/index.ts'), [ assertFileIncludes(path.join(apiDir, 'interface/index.ts'), [
'ReportTaskLedgerValidateResult', 'export namespace ReportTask',
'ReportTaskLedgerImportRequest', 'ReportTaskRecord',
'validateSessionId', 'ReportTaskListParams',
'validateResult', 'ReportTaskAddParam',
'validatedBatchId', 'ReportTaskSaveRequest',
'pendingRevalidate' 'ReportTaskAuditRequest',
'ReportTaskLedgerImportResult',
'ReportTaskLedgerImportStageRecord',
'ReportTaskLedgerImportSnapshot',
'ReportTaskGroupReportRecord',
'ReportTaskLedgerPreparedState'
]) ])
assertFileIncludes(path.join(pageDir, 'utils/reportTaskFlow.ts'), [ assertFileIncludes(path.join(pageDir, 'utils/testReport.ts'), [
'REPORT_TASK_FLOW_STEPS', 'TEST_REPORT_EXCEL_EXTENSIONS',
'createEmptyLedgerPreparedState', 'REPORT_TASK_GROUP_REPORT_GENERATE_STATUS_TEXT_MAP',
'hasValidatedLedgerBatch', 'isReportTaskExcelFileName',
'resolveInitialFlowStep', 'TEST_REPORT_LEDGER_IMPORT_STAGE_ORDER',
'canReachFlowStep', 'normalizeReportTaskLedgerImportResult',
'resolveFlowStepStatus' 'normalizeReportTaskLedgerSnapshot',
'checkReportTaskLedgerPrepared',
'resolveReportTaskGroupReportGenerateStateText',
'resolveReportTaskGroupReportGenerateStateTagType'
]) ])
assertFileIncludes(path.join(pageDir, 'utils/testReportForm.ts'), [ assertFileIncludes(path.join(pageDir, 'components/ReportTaskLedgerImportPanel.vue'), [
'createDefaultReportTaskFormModel', "name: 'ReportTaskLedgerImportPanel'",
'buildReportTaskFormContext',
'buildReportTaskSavePayload'
])
assertFileIncludes(path.join(pageDir, 'components/ReportTaskPrepareStep.vue'), [
"name: 'ReportTaskPrepareStep'",
'validateReportTaskLedgerApi',
'downloadReportTaskLedgerTemplateApi', 'downloadReportTaskLedgerTemplateApi',
'selectedFiles',
'validateResult',
'sessionId',
'canContinueUpload',
'points',
'attachments',
'执行校验'
])
assertFileIncludes(path.join(pageDir, 'components/ReportTaskImportStep.vue'), [
"name: 'ReportTaskImportStep'",
'importReportTaskLedgerApi', 'importReportTaskLedgerApi',
'validatedBatchId', 'selectedFiles',
'执行导入', 'latestImportResult',
'ledger/validate -> ledger/import' 'handleImportFiles',
]) 'toolbar-actions',
'toolbar-download'
assertFileIncludes(path.join(pageDir, 'components/ReportTaskBaseInfoStep.vue'), [
"name: 'ReportTaskBaseInfoStep'",
'register-form',
'formRules',
'summary-strip'
])
assertFileIncludes(path.join(pageDir, 'components/ReportTaskCompleteStep.vue'), [
"name: 'ReportTaskCompleteStep'",
'报告任务新增完成',
'报告任务编辑完成'
]) ])
assertFileIncludes(path.join(pageDir, 'components/ReportTaskFormDialog.vue'), [ assertFileIncludes(path.join(pageDir, 'components/ReportTaskFormDialog.vue'), [
"name: 'ReportTaskFormDialog'", "name: 'ReportTaskFormDialog'",
'ReportTaskPrepareStep', 'ReportTaskLedgerImportPanel',
'ReportTaskImportStep', 'REPORT_TASK_FORM_STEPS',
'ReportTaskBaseInfoStep', 'currentStep',
'ReportTaskCompleteStep', 'logEntries',
'REPORT_TASK_FLOW_STEPS', 'logPanelExpanded',
'createEmptyLedgerPreparedState', 'goToImportStep',
'buildReportTaskFormContext', 'handleLedgerPreparedChange',
'buildReportTaskSavePayload', 'ledgerPreparedState',
'ledger/validate -> ledger/import', 'activeDraftId',
'log-floating-panel', 'checkReportTaskLedgerPrepared',
'el-tooltip', 'log-panel-header',
'log-panel-body',
'log-panel-toggle',
'white-space: nowrap',
'text-overflow: ellipsis', 'text-overflow: ellipsis',
'height: 560px', 'log-empty'
'max-height: calc(100vh - 40px)', ])
'display: flex',
'padding: 16px 18px 12px', assertFileIncludes(path.join(pageDir, 'components/ReportTaskDetailDialog.vue'), [
'gap: 6px', "name: 'ReportTaskDetailDialog'",
'padding: 0 12px 10px', 'groupReports',
'.flow-main {\n display: flex;\n flex: 1;\n min-width: 0;\n min-height: 0;\n overflow: auto;\n}' 'generateState',
'group-report-title',
'resolveReportTaskGroupReportGenerateStateText'
])
assertFileIncludes(path.join(pageDir, 'components/ReportTaskAuditDialog.vue'), [
"name: 'ReportTaskAuditDialog'",
'checkResult'
]) ])
assertFileIncludes(path.join(pageDir, 'index.vue'), [ assertFileIncludes(path.join(pageDir, 'index.vue'), [
"name: 'ReportTaskPage'", "name: 'ReportTaskPage'",
'<ProTable',
'ReportTaskFormDialog', 'ReportTaskFormDialog',
'@refresh-options', 'ReportTaskDetailDialog',
'ledger/validate -> ledger/import -> add/update' 'ReportTaskAuditDialog',
'listReportTaskGroupReportsApi',
'detailGroupReports',
'ledger/import -> add/update'
])
assertFileIncludes(path.join(pageDir, 'components/ReportTaskLedgerImportPanel.vue'), [
'min-height: 0',
'flex: 1',
'display: flex',
'flex-direction: column'
]) ])
console.log('testReport page contract passed') console.log('testReport page contract passed')

View File

@@ -40,7 +40,6 @@
:report-model-options="reportModelOptions" :report-model-options="reportModelOptions"
:company-options="companyOptions" :company-options="companyOptions"
:standard-options="standardOptions" :standard-options="standardOptions"
@refresh-options="refreshFormOptions"
@submit="handleSaveReportTask" @submit="handleSaveReportTask"
/> />
@@ -93,11 +92,6 @@ import {
buildDictSelectOptions, buildDictSelectOptions,
buildOptionLabelMap, buildOptionLabelMap,
getReportTaskErrorMessage, getReportTaskErrorMessage,
getReportTaskGenerateStateTagType,
getReportTaskGenerateStateText,
getReportTaskStateTagType,
getReportTaskStateText,
REPORT_TASK_STATE_OPTIONS,
normalizeReportTaskGroupReportList, normalizeReportTaskGroupReportList,
normalizeReportTaskListParams, normalizeReportTaskListParams,
normalizeReportTaskPage, normalizeReportTaskPage,
@@ -130,7 +124,6 @@ const reportModelOptions = ref<Array<{ label: string; value: string }>>([])
const companyOptions = computed(() => buildDictSelectOptions(dictStore.getDictData(DICT_CODES.TEST_REPORT_COMPANY))) const companyOptions = computed(() => buildDictSelectOptions(dictStore.getDictData(DICT_CODES.TEST_REPORT_COMPANY)))
const standardOptions = computed(() => buildDictSelectOptions(dictStore.getDictData(DICT_CODES.TEST_REPORT_STANDARD))) const standardOptions = computed(() => buildDictSelectOptions(dictStore.getDictData(DICT_CODES.TEST_REPORT_STANDARD)))
const stateOptions = REPORT_TASK_STATE_OPTIONS
const companyLabelMap = computed(() => buildOptionLabelMap(companyOptions.value)) const companyLabelMap = computed(() => buildOptionLabelMap(companyOptions.value))
const standardLabelMap = computed(() => buildOptionLabelMap(standardOptions.value)) const standardLabelMap = computed(() => buildOptionLabelMap(standardOptions.value))
const requiredDictCodes = [DICT_CODES.TEST_REPORT_COMPANY, DICT_CODES.TEST_REPORT_STANDARD] const requiredDictCodes = [DICT_CODES.TEST_REPORT_COMPANY, DICT_CODES.TEST_REPORT_STANDARD]
@@ -171,25 +164,6 @@ const columns = reactive<ColumnProps<ReportTask.ReportTaskRecord>[]>([
} }
} }
}, },
{
prop: 'state',
label: '报告状态',
minWidth: 120,
enum: stateOptions,
search: {
el: 'select',
order: 3,
props: {
clearable: true,
placeholder: '请选择报告状态'
}
},
render: ({ row }) => (
<el-tag type={getReportTaskStateTagType(row.state)} effect="light">
{getReportTaskStateText(row.state)}
</el-tag>
)
},
{ prop: 'no', label: '报告编号', minWidth: 180, fixed: 'left', render: ({ row }) => resolveReportTaskText(row.no) }, { prop: 'no', label: '报告编号', minWidth: 180, fixed: 'left', render: ({ row }) => resolveReportTaskText(row.no) },
{ prop: 'clientUnitName', label: '委托单位', minWidth: 160, render: ({ row }) => resolveReportTaskText(row.clientUnitName) }, { prop: 'clientUnitName', label: '委托单位', minWidth: 160, render: ({ row }) => resolveReportTaskText(row.clientUnitName) },
{ prop: 'reportModelName', label: '报告模板', minWidth: 160, render: ({ row }) => resolveReportTaskText(row.reportModelName) }, { prop: 'reportModelName', label: '报告模板', minWidth: 160, render: ({ row }) => resolveReportTaskText(row.reportModelName) },
@@ -207,16 +181,6 @@ const columns = reactive<ColumnProps<ReportTask.ReportTaskRecord>[]>([
showOverflowTooltip: true, showOverflowTooltip: true,
render: ({ row }) => resolveReportTaskStandardText(row.standard, standardLabelMap.value) render: ({ row }) => resolveReportTaskStandardText(row.standard, standardLabelMap.value)
}, },
{
prop: 'reportGenerateState',
label: '生成状态',
minWidth: 120,
render: ({ row }) => (
<el-tag type={getReportTaskGenerateStateTagType(row.reportGenerateState)} effect="light">
{getReportTaskGenerateStateText(row.reportGenerateState)}
</el-tag>
)
},
{ prop: 'pointCount', label: '监测点数', minWidth: 100, render: ({ row }) => resolveReportTaskText(row.pointCount) }, { prop: 'pointCount', label: '监测点数', minWidth: 100, render: ({ row }) => resolveReportTaskText(row.pointCount) },
{ prop: 'groupCount', label: '分组数', minWidth: 100, render: ({ row }) => resolveReportTaskText(row.groupCount) }, { prop: 'groupCount', label: '分组数', minWidth: 100, render: ({ row }) => resolveReportTaskText(row.groupCount) },
{ prop: 'phonenumber', label: '联系电话', minWidth: 140, render: ({ row }) => resolveReportTaskText(row.phonenumber) }, { prop: 'phonenumber', label: '联系电话', minWidth: 140, render: ({ row }) => resolveReportTaskText(row.phonenumber) },
@@ -287,10 +251,6 @@ const ensureFormOptionsReady = async () => {
} }
} }
const refreshFormOptions = async () => {
await ensureFormOptionsReady()
}
const getTableList = async (params: ReportTask.ReportTaskListParams = {}) => { const getTableList = async (params: ReportTask.ReportTaskListParams = {}) => {
const response = await listReportTasksApi(normalizeReportTaskListParams(params)) const response = await listReportTasksApi(normalizeReportTaskListParams(params))
const pageData = normalizeReportTaskPage<ReportTask.ReportTaskRecord>( const pageData = normalizeReportTaskPage<ReportTask.ReportTaskRecord>(
@@ -377,15 +337,13 @@ const handleSaveReportTask = async (params: ReportTask.ReportTaskSaveRequest) =>
formSaving.value = true formSaving.value = true
try { try {
// 关键业务节点:文件校验与正式导入已在弹窗内完成,页面层这里只执行最终 add/update整体顺序为 ledger/validate -> ledger/import -> add/update。
if (formMode.value === 'create') { if (formMode.value === 'create') {
await createReportTaskApi(params) await createReportTaskApi(params)
ElMessage.success('报告任务新增成功')
} else { } else {
await updateReportTaskApi(params) await updateReportTaskApi(params)
ElMessage.success('报告任务编辑成功')
} }
ElMessage.success(formMode.value === 'create' ? '报告任务新增成功' : '报告任务编辑成功')
formSaveSuccessVersion.value += 1 formSaveSuccessVersion.value += 1
refreshReportTasks() refreshReportTasks()
} catch (error) { } catch (error) {

View File

@@ -1,180 +1,328 @@
<template> <template>
<!-- 基础信息弹出框 --> <el-dialog v-model="dialogVisible" :title="dialogTitle" v-bind="dialogSmall" @close="close" align-center>
<el-dialog v-model='dialogVisible' :title="dialogTitle" v-bind="dialogSmall" @close="close" align-center> <el-form ref="dialogFormRef" :model="formContent" :rules="rules">
<div> <el-form-item label="用户名" prop="name" :label-width="100">
<el-form :model="formContent" <el-input
ref='dialogFormRef' v-model="formContent.name"
:rules='rules' placeholder="请输入用户名"
> autocomplete="off"
<el-form-item label="用户名" prop='name' :label-width="100"> maxlength="32"
<el-input v-model="formContent.name" placeholder="请输入用户名" autocomplete="off" maxlength="32" show-word-limit/> show-word-limit
</el-form-item> />
<el-form-item label="登录名" prop='loginName' :label-width="100" > </el-form-item>
<el-input v-model="formContent.loginName" placeholder="请输入登录名" autocomplete="off" :disabled="LoginNameIsShow" maxlength="32" show-word-limit/> <el-form-item label="登录名" prop="loginName" :label-width="100">
</el-form-item> <el-input
<el-form-item label="密码" prop='password' :label-width="100" v-if="IsPasswordShow"> v-model="formContent.loginName"
<el-input type="password" v-model="formContent.password" show-password placeholder="请输入密码" autocomplete="off" maxlength="32" show-word-limit/> placeholder="请输入登录名"
</el-form-item> autocomplete="off"
<el-form-item label='角色' :label-width='100' prop='roles'> :disabled="loginNameDisabled"
<el-select v-model="formContent.roleIds" multiple placeholder="请选择角色"> maxlength="32"
<el-option show-word-limit
v-for="item in roleList" />
:key="item.id" </el-form-item>
:label="item.name" <el-form-item v-if="isPasswordShow" label="密码" prop="password" :label-width="100">
:value="item.id" <el-input
/> v-model="formContent.password"
</el-select> type="password"
</el-form-item> show-password
<el-form-item label="手机号码" prop='phone' :label-width="100"> placeholder="请输入密码"
<el-input v-model="formContent.phone" placeholder="请输入手机号码" autocomplete="off" /> autocomplete="off"
</el-form-item> maxlength="32"
<el-form-item label="邮箱地址" prop='email' :label-width="100"> show-word-limit
<el-input v-model="formContent.email" placeholder="请输入邮箱地址" autocomplete="off" /> />
</el-form-item> </el-form-item>
<el-form-item label="角色" prop="roleIds" :label-width="100">
</el-form> <el-select v-model="formContent.roleIds" multiple placeholder="请选择角色">
</div> <el-option v-for="item in roleList" :key="item.id" :label="item.name" :value="item.id" />
<template #footer> </el-select>
<div class="dialog-footer"> </el-form-item>
<el-button @click="close()">取消</el-button> <el-form-item label="手机号码" prop="phone" :label-width="100">
<el-button type="primary" @click="save()"> <el-input v-model="formContent.phone" placeholder="请输入手机号码" autocomplete="off" />
保存 </el-form-item>
</el-button> <el-form-item label="邮箱地址" prop="email" :label-width="100">
</div> <el-input v-model="formContent.email" placeholder="请输入邮箱地址" autocomplete="off" />
</template> </el-form-item>
</el-dialog> <el-form-item label="用户签名" :label-width="100">
<div class="signature-upload">
<el-input :model-value="signatureDisplayName" readonly placeholder="请选择签名文件" />
<div class="signature-upload__actions">
<el-button type="primary" plain @click="openFilePicker">选择文件</el-button>
<el-button
type="primary"
plain
:disabled="!canPreviewSignature"
@click="handlePreviewSignature"
>
预览签名
</el-button>
</div>
<div class="signature-upload__tip">支持 png/jpg/jpeg/bmp/webp</div>
<input
ref="fileInputRef"
class="hidden-file-input"
type="file"
accept=".png,.jpg,.jpeg,.bmp,.webp"
@change="handleSignatureFileChange"
/>
</div>
</el-form-item>
</el-form>
</template> <template #footer>
<div class="dialog-footer">
<script lang="ts" setup> <el-button @click="close()">取消</el-button>
import { ref,computed, type Ref } from 'vue' <el-button type="primary" @click="save()">保存</el-button>
import {dialogSmall} from '@/utils/elementBind' </div>
import { ElMessage, type FormInstance,type FormItemRule } from 'element-plus' </template>
import { </el-dialog>
addUser, </template>
updateUser,
} from '@/api/user/user'
// 使用 dayjs 库格式化
import dayjs from 'dayjs';
import { type User } from '@/api/user/interface/user';
import { useDictStore } from '@/stores/modules/dict'
import { type Role } from '@/api/user/interface/role';
const dictStore = useDictStore()
// 定义弹出组件元信息
const dialogFormRef = ref()
const IsPasswordShow = ref(false)
const roleList = ref<Role.RoleBO[]>([])
const LoginNameIsShow = ref(false)
function useMetaInfo() {
const dialogVisible = ref(false)
const titleType = ref('add')
const formContent = ref<User.ResUser>({
id: '', //用户ID作为唯一标识
name: '', //用户名(别名)
loginName: '',//登录名
password: '',//密码
phone: '', //手机号
email: '', //邮箱
loginTime: '',//最后一次登录时间
loginErrorTimes: 0,//登录错误次数
lockTime: '', //用户密码错误锁定时间
state: 1, //
})
return { dialogVisible, titleType, formContent }
}
const { dialogVisible, titleType, formContent } = useMetaInfo()
// 清空formContent
const resetFormContent = () => {
formContent.value = {
id: '', //用户ID作为唯一标识
name: '', //用户名(别名)
loginName: '',//登录名
password: '',//密码
phone: '', //手机号
email: '', //邮箱
loginTime: '',//最后一次登录时间
loginErrorTimes: 0,//登录错误次数
lockTime: '', //用户密码错误锁定时间
state: 1, //
}
}
let dialogTitle = computed(() => {
return titleType.value === 'add' ? '新增用户' : '编辑用户'
})
<script lang="ts" setup>
import { computed, reactive, ref, type Ref } from 'vue'
import { ElMessage, type FormInstance, type FormItemRule } from 'element-plus'
import { dialogSmall } from '@/utils/elementBind'
import { addUser, previewUserSignature, updateUser } from '@/api/user/user'
import type { Role } from '@/api/user/interface/role'
import type { User } from '@/api/user/interface/user'
//定义规则 defineOptions({
const formRuleRef = ref<FormInstance>() name: 'UserPopup'
//定义校验规则 })
const rules: Ref<Record<string, Array<FormItemRule>>> = ref({
name: [{ required: true, message: '名称必填!', trigger: 'blur' }, const SIGNATURE_EXTENSIONS = ['png', 'jpg', 'jpeg', 'bmp', 'webp']
// 指定正则,此处是数字正则
{ pattern: /^[A-Za-z\u4e00-\u9fa5]{1,16}$/, message: '名称需1~16位的英文或汉字', trigger: 'blur' }], type UserPopupMode = 'add' | 'edit'
loginName: [{ required: true, message: '登录名必填!', trigger: 'blur' },
{ pattern: /^[a-zA-Z]{1}[a-zA-Z0-9]{2,15}$/, message: '格式错误需以字母开头长度为3-16位的字母或数字', trigger: 'blur' }], interface UserFormModel {
password: [{ required: true, message: '密码必填!', trigger: 'blur' }, id: string
{ pattern: /^(?=.*[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]).{8,16}$/, message: '密码长度为8-16需包含特殊字符', trigger: 'blur' }], name: string
}) loginName: string
password: string
phone: string
// 关闭弹窗 email: string
const close = () => { roleIds: string[]
dialogVisible.value = false signatureFileId: string
// 清空dialogForm中的值 signatureFileName: string
resetFormContent() }
// 重置表单
dialogFormRef.value?.resetFields() const props = defineProps<{
} refreshTable: (() => Promise<void>) | undefined
}>()
// 保存数据
const save = () => { const dialogFormRef = ref<FormInstance>()
try { const fileInputRef = ref<HTMLInputElement | null>(null)
dialogFormRef.value?.validate(async (valid: boolean) => { const dialogVisible = ref(false)
if (valid) { const titleType = ref<UserPopupMode>('add')
if (formContent.value.id) { const roleList = ref<Role.RoleBO[]>([])
await updateUser(formContent.value); const selectedSignatureFile = ref<File | null>(null)
} else { const existingSignatureFileName = ref('')
await addUser(formContent.value); const formContent = reactive<UserFormModel>({
} id: '',
ElMessage.success({ message: `${dialogTitle.value}成功!` }) name: '',
close() loginName: '',
// 刷新表格 password: '',
await props.refreshTable!() phone: '',
email: '',
roleIds: [],
signatureFileId: '',
signatureFileName: ''
})
const dialogTitle = computed(() => (titleType.value === 'add' ? '新增用户' : '编辑用户'))
const isPasswordShow = computed(() => titleType.value === 'add')
const loginNameDisabled = computed(() => titleType.value === 'edit')
const signatureDisplayName = computed(() => selectedSignatureFile.value?.name || existingSignatureFileName.value || '')
const canPreviewSignature = computed(() =>
Boolean(selectedSignatureFile.value || (formContent.id && existingSignatureFileName.value))
)
const rules: Ref<Record<string, Array<FormItemRule>>> = ref({
name: [
{ required: true, message: '名称必填', trigger: 'blur' },
{ pattern: /^[A-Za-z\u4e00-\u9fa5]{1,16}$/, message: '名称需1~16位的英文或汉字', trigger: 'blur' }
],
loginName: [
{ required: true, message: '登录名必填', trigger: 'blur' },
{ pattern: /^[a-zA-Z]{1}[a-zA-Z0-9]{2,15}$/, message: '需以字母开头长度为3-16位字母或数字', trigger: 'blur' }
],
password: [
{ required: true, message: '密码必填', trigger: 'blur' },
{
pattern: /^(?=.*[!@#$%^&*()_+\-=[\]{};':"\\|,.<>/?]).{8,16}$/,
message: '密码长度为8-16需包含特殊字符',
trigger: 'blur'
} }
}) ]
} catch (err) { })
console.error('验证过程中出现错误', err)
const resetFormContent = () => {
formContent.id = ''
formContent.name = ''
formContent.loginName = ''
formContent.password = ''
formContent.phone = ''
formContent.email = ''
formContent.roleIds = []
formContent.signatureFileId = ''
formContent.signatureFileName = ''
}
const resetSignatureState = () => {
selectedSignatureFile.value = null
existingSignatureFileName.value = ''
if (fileInputRef.value) {
fileInputRef.value.value = ''
} }
} }
// 打开弹窗,可能是新增,也可能是编辑 const resetPopupState = () => {
const open = async (sign: string, data: User.ResUser,roleParams: Role.RoleBO[]) => { resetFormContent()
// 重置表单 resetSignatureState()
dialogFormRef.value?.resetFields() dialogFormRef.value?.clearValidate()
// 获取角色列表 }
const validateSignatureFile = (file: File) => {
const fileName = file.name || ''
const extension = fileName.includes('.') ? fileName.split('.').pop()?.toLowerCase() : ''
if (!extension || !SIGNATURE_EXTENSIONS.includes(extension)) {
return '签名文件仅支持 png、jpg、jpeg、bmp、webp'
}
return ''
}
const buildSaveRequest = (): User.UserSaveRequest => ({
id: formContent.id || undefined,
name: formContent.name.trim(),
loginName: titleType.value === 'add' ? formContent.loginName.trim() : undefined,
password: titleType.value === 'add' ? formContent.password : undefined,
phone: formContent.phone.trim() || undefined,
email: formContent.email.trim() || undefined,
roleIds: formContent.roleIds
})
const openBlobPreview = (blob: Blob) => {
const previewUrl = URL.createObjectURL(blob)
window.open(previewUrl, '_blank')
window.setTimeout(() => URL.revokeObjectURL(previewUrl), 60 * 1000)
}
const openFilePicker = () => {
fileInputRef.value?.click()
}
const handleSignatureFileChange = (event: Event) => {
const input = event.target as HTMLInputElement
const file = input.files?.[0] || null
input.value = ''
if (!file) return
const validationMessage = validateSignatureFile(file)
if (validationMessage) {
ElMessage.warning(validationMessage)
return
}
selectedSignatureFile.value = file
}
const handlePreviewSignature = async () => {
try {
if (selectedSignatureFile.value) {
openBlobPreview(selectedSignatureFile.value)
return
}
if (!formContent.id || !existingSignatureFileName.value) {
ElMessage.warning('当前用户暂无可预览的签名')
return
}
const response = await previewUserSignature(formContent.id)
openBlobPreview(response.data)
} catch {
ElMessage.error('用户签名预览失败')
}
}
const close = () => {
dialogVisible.value = false
resetPopupState()
}
const save = async () => {
try {
await dialogFormRef.value?.validate()
// 关键业务节点:编辑用户时如果未重新选择签名文件,则只提交 request后端会保留原签名选了新文件才会触发替换。
if (formContent.id) {
await updateUser(buildSaveRequest(), selectedSignatureFile.value)
} else {
await addUser(buildSaveRequest(), selectedSignatureFile.value)
}
ElMessage.success({ message: `${dialogTitle.value}成功` })
close()
await props.refreshTable?.()
} catch (error) {
if (error instanceof Error) {
return
}
}
}
const open = async (sign: string, data: Partial<User.ResUser> = {}, roleParams: Role.RoleBO[]) => {
resetPopupState()
roleList.value = roleParams roleList.value = roleParams
titleType.value = sign titleType.value = sign === 'edit' ? 'edit' : 'add'
dialogVisible.value = true dialogVisible.value = true
if (data.id) { if (data.id) {
IsPasswordShow.value = false formContent.id = data.id
LoginNameIsShow.value = true formContent.name = data.name || ''
formContent.value = { ...data } formContent.loginName = data.loginName || ''
formContent.password = ''
formContent.phone = data.phone || ''
} else { formContent.email = data.email || ''
IsPasswordShow.value = true formContent.roleIds = Array.isArray(data.roleIds) ? [...data.roleIds] : []
LoginNameIsShow.value = false formContent.signatureFileId = data.signatureFileId || ''
resetFormContent() formContent.signatureFileName = data.signatureFileName || ''
existingSignatureFileName.value = data.signatureFileName || ''
} }
} }
// 对外映射
defineExpose({ open })
const props = defineProps<{
refreshTable: (() => Promise<void>) | undefined;
}>()
</script> defineExpose({ open })
</script>
<style scoped lang="scss">
.signature-upload {
display: flex;
flex-direction: column;
width: 100%;
gap: 8px;
}
.signature-upload__actions {
display: flex;
gap: 12px;
flex-wrap: wrap;
}
.signature-upload__tip {
color: #909399;
font-size: 12px;
line-height: 1.4;
}
.hidden-file-input {
display: none;
}
:deep(.el-select),
:deep(.el-input) {
width: 100%;
}
</style>