<template>
|
<div class="app-container seal-usage-ledger">
|
<el-form ref="queryForm" :inline="true" :model="queryParams" size="small">
|
<el-form-item label="报告编号" prop="reportCode">
|
<el-input v-model="queryParams.reportCode" clearable placeholder="请输入" @keyup.enter="refreshTable" />
|
</el-form-item>
|
<el-form-item label="印章名称" prop="sealName">
|
<el-input v-model="queryParams.sealName" clearable placeholder="请输入" @keyup.enter="refreshTable" />
|
</el-form-item>
|
<el-form-item label="检测项目名称" prop="projectName">
|
<el-input v-model="queryParams.projectName" clearable placeholder="请输入" @keyup.enter="refreshTable" />
|
</el-form-item>
|
<el-form-item label="用印人" prop="useUserName">
|
<el-input v-model="queryParams.useUserName" clearable placeholder="请输入" @keyup.enter="refreshTable" />
|
</el-form-item>
|
<el-form-item label="用印日期">
|
<el-date-picker
|
v-model="dateRange"
|
type="daterange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
value-format="YYYY-MM-DD"
|
clearable
|
/>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" size="small" @click="refreshTable">查询</el-button>
|
<el-button size="small" @click="resetQuery">重置</el-button>
|
</el-form-item>
|
</el-form>
|
|
<div class="toolbar">
|
<el-button
|
v-hasPermi="['structural:sealUsageLedger:export']"
|
type="primary"
|
size="small"
|
:disabled="selection.length === 0 || exportLoading || submitLoading"
|
:loading="selectedExportLoading"
|
@click="exportSelected"
|
>勾选导出</el-button>
|
<el-button
|
v-hasPermi="['structural:sealUsageLedger:export']"
|
type="primary"
|
size="small"
|
:disabled="exportLoading || submitLoading"
|
:loading="filteredExportLoading"
|
@click="exportFiltered"
|
>按条件导出</el-button>
|
</div>
|
|
<lims-table
|
ref="ledgerTable"
|
:table-data="tableData"
|
:column="columns"
|
:page="page"
|
:table-loading="tableLoading"
|
:is-selection="true"
|
:handle-selection-change="handleSelectionChange"
|
row-key="id"
|
height="calc(100vh - 315px)"
|
@pagination="pagination"
|
>
|
<template #sealNames="{ row }">
|
<div class="multiline">{{ formatSealNames(row.sealNames) }}</div>
|
</template>
|
<template #projectName="{ row }">
|
<div class="multiline">{{ row.projectName }}</div>
|
</template>
|
<template #copies="{ row }">
|
<span>{{ row.copies }}</span>
|
<el-button
|
v-hasPermi="['structural:sealUsageLedger:edit']"
|
link
|
type="primary"
|
size="small"
|
class="edit-button"
|
@click.stop="openCopiesDialog(row)"
|
>修改</el-button>
|
</template>
|
</lims-table>
|
|
<el-dialog v-model="copiesDialogVisible" title="修改用印份数" width="420px" :close-on-click-modal="false">
|
<el-form ref="copiesForm" :model="copiesForm" :rules="copiesRules" label-width="90px">
|
<el-form-item label="报告编号">
|
<span>{{ copiesForm.reportCode }}</span>
|
</el-form-item>
|
<el-form-item label="份数" prop="copies">
|
<el-input-number v-model="copiesForm.copies" :min="1" :max="2147483647" :precision="0" controls-position="right" />
|
</el-form-item>
|
</el-form>
|
<template #footer>
|
<el-button @click="copiesDialogVisible = false">取消</el-button>
|
<el-button type="primary" :loading="submitLoading" @click="saveCopies">保存</el-button>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import limsTable from '@/components/Table/lims-table.vue'
|
import {
|
exportSealUsageLedger,
|
pageSealUsageLedger,
|
updateSealUsageCopies
|
} from '@/api/structural/sealUsageLedger'
|
|
function emptyQuery() {
|
return {
|
reportCode: '',
|
sealName: '',
|
projectName: '',
|
useUserName: ''
|
}
|
}
|
|
export default {
|
name: 'SealUsageLedger',
|
components: { limsTable },
|
data() {
|
return {
|
queryParams: emptyQuery(),
|
dateRange: [],
|
page: { total: 0, size: 20, current: 1 },
|
tableData: [],
|
selection: [],
|
tableLoading: false,
|
selectedExportLoading: false,
|
filteredExportLoading: false,
|
copiesDialogVisible: false,
|
submitLoading: false,
|
copiesForm: { id: null, reportCode: '', copies: 1, version: 0 },
|
copiesRules: {
|
copies: [
|
{ required: true, message: '请输入份数', trigger: 'change' },
|
{ type: 'integer', min: 1, message: '份数必须为正整数', trigger: 'change' }
|
]
|
},
|
columns: [
|
{ label: '日期', prop: 'useTime', width: '120px', formatData: value => value ? value.substring(0, 10) : '' },
|
{ label: '印章名称', prop: 'sealNames', dataType: 'slot', slot: 'sealNames', minWidth: '210px' },
|
{ label: '检测项目名称', prop: 'projectName', dataType: 'slot', slot: 'projectName', minWidth: '180px' },
|
{ label: '报告编号', prop: 'reportCode', minWidth: '180px' },
|
{ label: '份数', prop: 'copies', dataType: 'slot', slot: 'copies', width: '120px' },
|
{ label: '用印人签字', prop: 'useUserName', width: '140px' }
|
]
|
}
|
},
|
computed: {
|
exportLoading() {
|
return this.selectedExportLoading || this.filteredExportLoading
|
}
|
},
|
mounted() {
|
this.getList()
|
},
|
methods: {
|
buildQuery() {
|
return {
|
...this.queryParams,
|
startDate: this.dateRange && this.dateRange.length === 2 ? this.dateRange[0] : undefined,
|
endDate: this.dateRange && this.dateRange.length === 2 ? this.dateRange[1] : undefined
|
}
|
},
|
getList() {
|
this.tableLoading = true
|
this.selection = []
|
pageSealUsageLedger({ ...this.buildQuery(), current: this.page.current, size: this.page.size }).then(res => {
|
const data = res.data || {}
|
this.tableData = data.records || []
|
this.page.total = data.total || 0
|
}).finally(() => {
|
this.tableLoading = false
|
})
|
},
|
refreshTable() {
|
this.page.current = 1
|
this.getList()
|
},
|
resetQuery() {
|
this.queryParams = emptyQuery()
|
this.dateRange = []
|
this.page.current = 1
|
this.getList()
|
},
|
pagination({ page, limit }) {
|
this.page.current = page
|
this.page.size = limit
|
this.getList()
|
},
|
handleSelectionChange(rows) {
|
this.selection = rows || []
|
},
|
formatSealNames(names) {
|
return (names || '').replace(/[,,]/g, '\n')
|
},
|
openCopiesDialog(row) {
|
this.copiesForm = {
|
id: row.id,
|
reportCode: row.reportCode,
|
copies: row.copies,
|
version: row.version
|
}
|
this.copiesDialogVisible = true
|
this.$nextTick(() => this.$refs.copiesForm && this.$refs.copiesForm.clearValidate())
|
},
|
saveCopies() {
|
this.$refs.copiesForm.validate(valid => {
|
if (!valid) return
|
this.submitLoading = true
|
updateSealUsageCopies({
|
id: this.copiesForm.id,
|
copies: this.copiesForm.copies,
|
version: this.copiesForm.version
|
}).then(() => {
|
this.$message.success('份数修改成功')
|
this.copiesDialogVisible = false
|
this.getList()
|
}).finally(() => {
|
this.submitLoading = false
|
})
|
})
|
},
|
exportSelected() {
|
if (!this.selection.length) {
|
this.$message.warning('请选择要导出的记录')
|
return
|
}
|
this.selectedExportLoading = true
|
this.downloadWord({ mode: 'selected', ids: this.selection.map(item => item.id) })
|
.finally(() => { this.selectedExportLoading = false })
|
},
|
exportFiltered() {
|
this.filteredExportLoading = true
|
this.downloadWord({ mode: 'filtered', query: this.buildQuery() })
|
.finally(() => { this.filteredExportLoading = false })
|
},
|
downloadWord(payload) {
|
return exportSealUsageLedger(payload).then(async data => {
|
const blob = data instanceof Blob ? data : new Blob([data])
|
if (blob.type && blob.type.includes('json')) {
|
const result = JSON.parse(await blob.text())
|
throw new Error(result.msg || '导出失败')
|
}
|
const stamp = new Date().toISOString().replace(/[-:T]/g, '').slice(0, 14)
|
this.$download.saveAs(blob, `印章使用登记表_${stamp}.docx`)
|
}).catch(error => {
|
this.$message.error(error.message || '用印台账导出失败')
|
throw error
|
})
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.toolbar {
|
display: flex;
|
justify-content: flex-end;
|
margin-bottom: 10px;
|
}
|
|
.multiline {
|
width: 100%;
|
white-space: pre-line;
|
word-break: break-all;
|
}
|
|
.edit-button {
|
margin-left: 8px;
|
}
|
</style>
|