|
|
@@ -89,6 +89,7 @@
|
|
|
</template>
|
|
|
</zm-table-column>
|
|
|
<zm-table-column label="计量器具编码" align="center" prop="measureCode" />
|
|
|
+ <zm-table-column label="序列号" align="center" prop="serialNo" />
|
|
|
<zm-table-column label="计量器具名称" align="center" prop="measureName" />
|
|
|
<zm-table-column label="证书编码" align="center" prop="measureCertNo" />
|
|
|
<zm-table-column label="检测/校准日期" align="center" prop="detectDate" width="140">
|
|
|
@@ -98,9 +99,19 @@
|
|
|
</zm-table-column>
|
|
|
<zm-table-column label="检测/校准机构" align="center" prop="detectOrg" />
|
|
|
<zm-table-column label="检测/校准标准" align="center" prop="detectStandard" />
|
|
|
- <zm-table-column label="检测/校准内容" align="center" prop="detectContent">
|
|
|
+ <zm-table-column
|
|
|
+ label="检测/校准内容"
|
|
|
+ align="center"
|
|
|
+ prop="detectContent"
|
|
|
+ width="140">
|
|
|
<template #default="scope">
|
|
|
- <div class="detect-content" v-html="scope.row.detectContent"></div>
|
|
|
+ <el-button
|
|
|
+ v-if="getDetectContentText(scope.row.detectContent) !== '-'"
|
|
|
+ link
|
|
|
+ type="primary"
|
|
|
+ @click="openDetectContentDialog(scope.row.detectContent)">
|
|
|
+ 查看详情
|
|
|
+ </el-button>
|
|
|
</template>
|
|
|
</zm-table-column>
|
|
|
<zm-table-column
|
|
|
@@ -175,6 +186,14 @@
|
|
|
</Dialog>
|
|
|
|
|
|
<!-- 表单弹窗：添加/修改 -->
|
|
|
+ <Dialog v-model="detectContentDialogVisible" title="检测/校准内容" width="720">
|
|
|
+ <div
|
|
|
+ v-if="detectContentDialogHtml"
|
|
|
+ class="detect-content-rich"
|
|
|
+ v-html="detectContentDialogHtml"></div>
|
|
|
+ <el-empty v-else description="暂无内容" />
|
|
|
+ </Dialog>
|
|
|
+
|
|
|
<IotMeasureDetectForm ref="formRef" @success="getList" />
|
|
|
</template>
|
|
|
|
|
|
@@ -269,6 +288,33 @@ const formatDateCorrectly = (timestamp) => {
|
|
|
return formatDate(time).substring(0, 10)
|
|
|
}
|
|
|
/** 重置按钮操作 */
|
|
|
+const stripHtml = (html?: string) => {
|
|
|
+ if (!html) return ''
|
|
|
+ if (typeof window === 'undefined') {
|
|
|
+ return html
|
|
|
+ .replace(/<[^>]+>/g, ' ')
|
|
|
+ .replace(/\s+/g, ' ')
|
|
|
+ .trim()
|
|
|
+ }
|
|
|
+
|
|
|
+ const div = document.createElement('div')
|
|
|
+ div.innerHTML = html
|
|
|
+ return (div.textContent || div.innerText || '')
|
|
|
+ .replace(/\u00a0/g, ' ')
|
|
|
+ .replace(/\s+/g, ' ')
|
|
|
+ .trim()
|
|
|
+}
|
|
|
+
|
|
|
+const getDetectContentText = (html?: string) => {
|
|
|
+ return stripHtml(html) || '-'
|
|
|
+}
|
|
|
+
|
|
|
+const getDetectContentSummary = (html?: string, maxLength = 36) => {
|
|
|
+ const text = getDetectContentText(html)
|
|
|
+ if (text === '-' || text.length <= maxLength) return text
|
|
|
+ return `${text.slice(0, maxLength)}...`
|
|
|
+}
|
|
|
+
|
|
|
const resetQuery = () => {
|
|
|
queryFormRef.value.resetFields()
|
|
|
handleQuery()
|
|
|
@@ -310,6 +356,14 @@ const handleExport = async () => {
|
|
|
|
|
|
let dialogFileView = ref(false)
|
|
|
let fileList = ref([])
|
|
|
+const detectContentDialogVisible = ref(false)
|
|
|
+const detectContentDialogHtml = ref('')
|
|
|
+
|
|
|
+const openDetectContentDialog = (html?: string) => {
|
|
|
+ detectContentDialogHtml.value = html || ''
|
|
|
+ detectContentDialogVisible.value = true
|
|
|
+}
|
|
|
+
|
|
|
const viewFile = (file) => {
|
|
|
fileList.value = file.split(',')
|
|
|
dialogFileView.value = true
|
|
|
@@ -368,4 +422,61 @@ onMounted(() => {
|
|
|
margin-right: 12px;
|
|
|
color: var(--el-text-color-primary);
|
|
|
}
|
|
|
+
|
|
|
+.detect-content-text {
|
|
|
+ display: block;
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ color: var(--el-text-color-primary);
|
|
|
+ cursor: default;
|
|
|
+}
|
|
|
+
|
|
|
+.detect-content-cell {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ gap: 8px;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.detect-content-rich {
|
|
|
+ max-height: 60vh;
|
|
|
+ overflow-y: auto;
|
|
|
+ padding: 4px 2px;
|
|
|
+ line-height: 1.75;
|
|
|
+ color: var(--el-text-color-primary);
|
|
|
+ word-break: break-word;
|
|
|
+}
|
|
|
+
|
|
|
+.detect-content-rich :deep(p) {
|
|
|
+ margin: 0 0 12px;
|
|
|
+}
|
|
|
+
|
|
|
+.detect-content-rich :deep(ul),
|
|
|
+.detect-content-rich :deep(ol) {
|
|
|
+ margin: 0 0 12px;
|
|
|
+ padding-left: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.detect-content-rich :deep(li) {
|
|
|
+ margin-bottom: 6px;
|
|
|
+}
|
|
|
+
|
|
|
+.detect-content-rich :deep(img) {
|
|
|
+ max-width: 100%;
|
|
|
+ height: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.detect-content-rich :deep(table) {
|
|
|
+ width: 100%;
|
|
|
+ border-collapse: collapse;
|
|
|
+}
|
|
|
+
|
|
|
+.detect-content-rich :deep(td),
|
|
|
+.detect-content-rich :deep(th) {
|
|
|
+ border: 1px solid var(--el-border-color-lighter);
|
|
|
+ padding: 8px;
|
|
|
+}
|
|
|
</style>
|
