jiangs/lis8.0-vue3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

界面优化

Browse Source
This commit is contained in:
wyuu 2026-05-12 18:01:47 +08:00
parent 287a7a1f57
commit a756eafd19
21 changed files with 1943 additions and 2115 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/assets/styles/index.scss
View File

@ -383,4 +383,13 @@ aside {
/* IE/Edge */
cursor: pointer;
}
.query-form {
margin-bottom: 5px;
border-bottom: 1px solid #ebeef5;
.el-form-item {
margin-bottom: 10px;
}
}

10
src/assets/styles/ruoyi.scss
View File

@ -197,6 +197,16 @@
border: 1px solid #1F6DD3 !important;
}
.el-scrollbar__bar.is-vertical {
right: 0;
width: 9px !important;
}
.el-scrollbar__bar.is-horizontal {
height: 8px !important;
bottom: 0;
}
.el-scrollbar__thumb {
background-color: #817e7e !important;
opacity: 1;

1
src/components/vxeTable/index.vue
View File

@ -40,7 +40,6 @@
<script setup lang="ts">
import { ref, nextTick, watch, onMounted } from 'vue'
// @ts-ignore
import Sortable from 'sortablejs'; // 引入sortablejs
import type { VxeComponentSizeType, VxeColumnPropTypes } from 'vxe-table'

149
src/views/liswork/batchAdjustment/index.vue Normal file
View File

@ -0,0 +1,149 @@
/**
* @file index.vue
* @description: 批量调整
* @author: w
* @since: 2026-05-06
*/
<template>
<div class="app-container">
<!-- 顶部工具栏 -->
<div class="toolbar">
<el-button icon="EditPen" type="primary">调整</el-button>
<el-button icon="Document" type="primary">保存</el-button>
<el-button icon="CirclePlus" type="primary">读取</el-button>
<el-button icon="Delete" type="danger">删除</el-button>
<el-button type="danger">删除全部</el-button>
</div>
<!-- 核心左右布局容器 -->
<div class="main-layout">
<!-- 左侧查询条件区域 -->
<div class="form-section">
<el-form label-width="80px">
<el-form-item label="标本日期">
<el-date-picker v-model="queryForm.jyrq" type="date" format="YYYY/MM/DD" value-format="YYYY/MM/DD"
style="width: 100%" />
</el-form-item>
<el-form-item label="检验仪器">
<YQSelectTable v-model:data="queryForm.yq" width="100%" clearable />
</el-form-item>
<el-form-item label="调整项目">
<el-select v-model="queryForm.testItem" placeholder="" style="width: 100%">
</el-select>
</el-form-item>
<el-form-item label="标本号">
<div class="sample-no-inputs">
<el-input v-model="queryForm.sampleNoStart" style="width: 10rem" />
<span style="margin: 0 8px;">—</span>
<el-input v-model="queryForm.sampleNoEnd" style="width: 10rem" />
</div>
</el-form-item>
<el-form-item label="调整公式">
<el-input v-model="queryForm.formula" style="width: 100%" placeholder="" />
</el-form-item>
<!-- 公式说明文字 -->
<div class="formula-tip">
注：请输入包含R（检验结果）的表达式, 如：R*1.1为结果调整原来的1.1倍
</div>
</el-form>
</div>
<!-- 右侧表格区域 -->
<div class="table-section">
<el-table :data="tableData" border style="width: 100%" height="50vh">
<el-table-column label="标本号" prop="sampleNo" width="300" />
<el-table-column label="检验结果" prop="result" />
</el-table>
<!-- 表格底部统计信息 -->
<div class="table-footer">
<span>共 {{ tableData.length }} 笔</span>
<span>均值：{{ averageResult }}</span>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import YQSelectTable from '@/components/SelectTable/YQSelectTable/index.vue'
import dayjs from 'dayjs'
// 查询表单数据
const queryForm = reactive({
jyrq: dayjs().format('YYYY/MM/DD'),
yq: '1贝克曼流水线',
testItem: '',
sampleNoStart: '',
sampleNoEnd: '',
formula: ''
})
// 表格数据
const tableData = ref<any[]>([])
// 计算均值
const averageResult = computed(() => {
if (tableData.value.length === 0) return ''
const sum = tableData.value.reduce((acc, item) => acc + Number(item.result || 0), 0)
return (sum / tableData.value.length).toFixed(2)
})
</script>
<style scoped lang="scss">
.toolbar {
display: flex;
gap: 8px;
padding: 8px 0;
margin-bottom: 10px;
}
.main-layout {
display: flex;
gap: 20px;
height: calc(100vh - 200px);
}
.form-section {
width: 450px;
background-color: #eaf0f9;
padding: 10px;
border: 1px solid #88aadd;
border-radius: 4px;
height: 100%;
box-sizing: border-box;
}
.table-section {
flex: 1;
display: flex;
flex-direction: column;
height: 100%;
}
.formula-tip {
color: #0000cc;
margin-top: 8px;
font-size: 14px;
}
.sample-no-inputs {
display: flex;
align-items: center;
}
.table-footer {
display: flex;
gap: 300px;
padding: 8px 10px;
color: #0000cc;
font-weight: bold;
margin-top: 8px;
}
.el-table {
flex: 1;
}
</style>

4
src/views/liswork/batchCheck/LabResult.vue
View File

@ -1,6 +1,6 @@
<!-- 检验明细 -->
<template>
<div>
<div style="height: 100%;">
<CustomTable ref="tableRef" :data="tableData" :columns="columns" :config="tableConfig">
</CustomTable>
</div>
@ -22,7 +22,7 @@ const columns = ref([
const tableConfig = ref({
border: true, // 边框
height: 'calc(100vh - 220px)', // 高度，
height: '100%', // 高度，
highlightCurrentRow: true, // 高亮当前行
})

4
src/views/liswork/batchCheck/LabResultMed.vue
View File

@ -1,6 +1,6 @@
<!-- 药敏结果界面 -->
<template>
<div>
<div style="height: 100%;">
<CustomTable ref="tableRefUp" :data="tableDataUp" :columns="columnsUp" :config="tableConfig" />
<CustomTable ref="tableRefDown" :data="tableDataDown" :columns="columnsDown" :config="tableConfig">
<template #jgbz="{ row }">
@ -35,7 +35,7 @@ const columnsDown = ref([
])
const tableConfig = ref({
border: true, // 边框
height: 'calc((100vh - 220px)/2)', // 高度，
height: '50%', // 高度，
highlightCurrentRow: true, // 高亮当前行
})

181
src/views/liswork/batchCheck/index.vue
View File

@ -1,34 +1,36 @@
<!-- 批量审核 -->
<template>
<div class="app-container">
<el-form ref="form" :model="formData" class="form" label-width="80px" :rules="rules" inline size="small">
<el-form-item label="仪器分组" prop="lisgroup">
<SelectTable v-model:data="formData.lisgroup" size="small" :fields="fields" width="150px" dict-type="GROUP" />
<el-form ref="form" :model="formData" class="query-form" label-width="6.25rem" inline>
<el-form-item label="医疗机构：" prop="yljg">
<SelectTable v-model:data="formData.yljg" :fields="fields" width="150px" dict-type="HOS" />
</el-form-item>
<el-form-item label="医疗机构" prop="yljg">
<SelectTable v-model:data="formData.yljg" size="small" :fields="fields" width="150px" dict-type="HOS" />
<el-form-item label="仪器分组：" prop="lisgroup">
<SelectTable v-model:data="formData.lisgroup" :fields="fields" width="150px" dict-type="GROUP"
@get-data-value="getYqConfig()" />
</el-form-item>
<el-form-item label="申请科室" prop="ksdh">
<SelectTable v-model:data="formData.ksdh" size="small" :fields="fields" width="150px" dict-type="DP" />
<el-form-item label="检验仪器：" prop="yq">
<SelectTable v-model:data="formData.yq" :tableData="instrOptions" width="150px" placeholder="请选择仪器"
@getDataValue="getYQList" />
</el-form-item>
<el-form-item label="检验仪器" prop="yq">
<YQSelectTable v-model:data="formData.yq" size="small" width="150px" clearable @get-data-value="getYQList" />
<el-form-item label="申请科室：" prop="ksdh">
<SelectTable v-model:data="formData.ksdh" :fields="fields" width="150px" dict-type="DP" />
</el-form-item>
<el-form-item label="检验医师" prop="yhdh">
<el-input placeholder="请填写检验医师" v-model="formData.yhdh" width="150px"></el-input>
<el-form-item label="检验医师：" prop="yhdh">
<el-input placeholder="请填写检验医师" v-model="formData.yhdh" style="width: 150px;" />
</el-form-item>
<el-form-item label="病人来源" prop="brly">
<SelectTable v-model:data="formData.brly" size="small" :fields="fields" width="150px" dict-type="PT" />
<el-form-item label="病人来源：" prop="brly">
<SelectTable v-model:data="formData.brly" :fields="fields" width="150px" dict-type="PT" />
</el-form-item>
<el-form-item label="标本日期" prop="jyrq">
<el-date-picker v-model="formData.jyrq1" type="date" style="width: 150px;" /> - <el-date-picker
v-model="formData.jyrq2" type="date" style="width: 150px;" />
<el-form-item label="标本日期：" prop="jyrq">
<el-date-picker v-model="formData.jyrq1" type="date" style="width: 150px;" />&nbsp;-&nbsp;
<el-date-picker v-model="formData.jyrq2" type="date" style="width: 150px;" />
</el-form-item>
<el-form-item label="标本号" prop="ybh">
<el-input placeholder="请输入开始标本号" v-model="formData.ybh1" style="width: 120px;"></el-input> - <el-input
placeholder="请输入结束标本号" v-model="formData.ybh2" style="width: 120px;"></el-input>
<el-form-item label="标本号：" prop="ybh">
<el-input placeholder="开始标本号" v-model="formData.ybh1" style="width: 120px;" /> &nbsp;-&nbsp;
<el-input placeholder="结束标本号" v-model="formData.ybh2" style="width: 120px;" />
</el-form-item>
<el-form-item label="审核标志">
<el-form-item label="审核标志：">
<el-select v-model="formData.jgbz" style="width: 150px" clearable>
<el-option v-for="item in jgbzOption" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
@ -36,18 +38,17 @@
<el-form-item>
<el-checkbox v-model="formData.jzbz" label="急诊报告" true-value="1" false-value="0"></el-checkbox>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getList">查询</el-button>
<el-button type="primary" @click="checkData">批量审核</el-button>
<el-button type="primary" @click="cancelCheck">取消审核</el-button>
</el-form-item>
</el-form>
<h3>{{ msg }}</h3>
<div class="mb5">
<el-button type="primary" @click="getList">查询</el-button>
<el-button type="primary" :disabled="!multiple" @click="checkData">批量审核</el-button>
<el-button type="primary" :disabled="!multiple" @click="cancelCheck">取消审核</el-button>
</div>
<div class="table-container">
<el-row :gutter="0">
<el-row :gutter="10">
<el-col :span="18">
<CustomTable ref="tableRef" :data="tableData" :columns="columns" :config="tableConfig" :loading="loading"
v-on:row-click="tableRowClick">
@selection-change="selectionChange" @row-click="tableRowClick">
<template #jgbz="{ row }">
<span>{{ displayJGBZ(row.jgbz) }}</span>
</template>
@ -92,19 +93,27 @@ import { batchCheckService, queryBatchCheckListService, cancelBatchCheckService
import dayjs from 'dayjs';
import { formatDict, getDictData } from '@/hooks'
import { displayBRNL, displayBRXB } from '@/utils/czUtil/lisUtil'
//@ts-ignore
import useUserStore from '@/store/modules/user';
import LabResult from './LabResult.vue';
import LabResultMed from './LabResultMed.vue';
import { getGroupInstrdList } from '@/api/liswork/work/LisWork';
import { useCommonStore } from '@/store/modules/commonStore';
const tableRef = ref();
const msg = ref('') //审核后结果显示
const tableData = ref([])
const userStore = useUserStore()
const commonStore = useCommonStore()
const paramObj = ref<any>(null) // 用于传递给 LabResult 组件的参数对象
const isXJY = ref(false)
const loading = ref(false)
const formData = ref({
lisgroup: '', //仪器分组
yljg: '', //医疗机构
lisgroup: commonStore.defaultConfig.lisgroupid, //仪器分组
yljg: userStore.sysLoginParam.loginYLJG,
ksdh: '', //申请科室
yq: '', //检验仪器
jyrq1: '', //标本日期开始
jyrq2: '', //标本日期结束
yq: commonStore.defaultConfig.defaultinstr,
jyrq1: dayjs().format('YYYY-MM-DD'), //标本日期开始
jyrq2: dayjs().format('YYYY-MM-DD'), //标本日期结束
yhdh: '', //检验医师
brly: '', //病人来源
ybh1: '', //标本号开始
@ -112,14 +121,6 @@ const formData = ref({
jgbz: '0', //审核标志
jzbz: 0 //急诊标志
})
const tableRef = ref();
const form = ref();
const msg = ref('') //审核后结果显示
const tableData = ref()
const userStore = useUserStore()
const paramObj = ref<any>(null) // 用于传递给 LabResult 组件的参数对象
const isXJY = ref(false)
const loading = ref(false)
const columns = ref([
{ type: 'selection', title: '选择', visible: true, align: 'center', width: 40 },
{ prop: 'jgbz', label: '审核标志', visible: true, align: 'center', slot: 'jgbz' },
@ -156,7 +157,7 @@ const jgbzOption = ref([
const tableConfig = ref({
border: true, // 边框
height: 'calc(100vh - 220px)', // 高度，
height: '100%', // 高度，
highlightCurrentRow: true, // 高亮当前行
// cellStyle: cellStyleHd
})
@ -173,54 +174,9 @@ const displayJGBZ = (jgbz: string) => {
return option ? option.label : jgbz
}
const validateYbhRange = (rule: any, value: any, callback: any) => {
const { ybh1, ybh2 } = formData.value // 同时获取两个输入框的值
// 场景1：两个都必填
if (!ybh1 && !ybh2) {
callback(new Error('开始和结束标本号不能为空'))
return
}
if (!ybh1) {
callback(new Error('请输入开始标本号'))
return
}
if (!ybh2) {
callback(new Error('请输入结束标本号'))
return
}
// 校验通过：必须调用空的callback()
callback()
}
const validateJYRQRange = (rule: any, value: any, callback: any) => {
const { jyrq1, jyrq2 } = formData.value
if (!jyrq1 || !jyrq2) {
callback(new Error('标本日期范围不能为空'))
return false
}
if (new Date(jyrq1) > new Date(jyrq2)) {
callback(new Error('标本日期范围不正确，开始日期不能大于结束日期'))
return false
}
return true
}
const rules = ref({
yljg: [{ required: true, message: '请选择医疗机构', trigger: 'blur' }],
ybh: [{ validator: validateYbhRange, trigger: 'blur' }],
yq: [{ required: true, message: '请选择检验仪器', trigger: 'blur' }],
jyrq: [{ validator: validateJYRQRange, trigger: 'blur' }],
})
const getList = async () => {
await form.value.validate()
formData.value.jyrq1 = dayjs(formData.value.jyrq1).format('YYYY-MM-DD HH:mm:ss')
formData.value.jyrq2 = dayjs(formData.value.jyrq2).format('YYYY-MM-DD HH:mm:ss')
formData.value.jyrq1 = formData.value.jyrq1 + ' 00:00:00'
formData.value.jyrq2 = formData.value.jyrq2 + ' 23:59:59'
const res = await queryBatchCheckListService(formData.value)
tableData.value = res.data
}
@ -262,10 +218,6 @@ const cancelCheck = async () => {
ybh: item.ybh,
}))
if (!paramList.length) {
msg.value = '请先选择要审核的行'
return
}
loading.value = true
const ret = await cancelBatchCheckService(paramList)
if (ret.code === 200) {
@ -276,7 +228,19 @@ const cancelCheck = async () => {
getList()
loading.value = false
}
const instrOptions = ref([])
// 仪器
const getYqConfig = () => {
getGroupInstrdList({ lisgroup: formData.value.lisgroup })
.then((res) => {
if (res.code == 0) {
instrOptions.value = res.data.map((item: any) => ({
value: item.yq.trim(),
label: item.yqmc
}))
}
})
}
const tableRowClick = (row: any) => {
paramObj.value = {
@ -286,6 +250,15 @@ const tableRowClick = (row: any) => {
}
}
const multiple = ref(false)
const selectionList = ref([])
const selectionChange = (selection) => {
// 这里可以处理选中行变化的逻辑，例如更新批量审核按钮的状态
multiple.value = selection.length > 0
selectionList.value = selection
}
const getYQList = (val: { yq: string; yqmc: string; yqdl: string } | null) => {
isXJY.value = String(val?.yqdl ?? '').trim() === '细菌仪';
@ -293,6 +266,7 @@ const getYQList = (val: { yq: string; yqmc: string; yqdl: string } | null) => {
}
onMounted(() => {
getYqConfig()
getDictData('DP', 'SRD', 'BT', 'PT')
})
@ -300,11 +274,14 @@ onMounted(() => {
<style scoped lang="scss">
.table-container {
height: calc(100vh - 220px);
overflow: auto;
/* 如果表格高度超出，显示滚动条 */
padding-bottom: 12px;
/* 给底部留出空间，避免被遮挡 */
box-sizing: border-box;
height: calc(100% - 140px);
.el-row {
height: 100%;
.el-col {
height: 100%;
}
}
}
</style>

187
src/views/liswork/batchEntry/index.vue Normal file
View File

@ -0,0 +1,187 @@
/**
* @file index.vue
* @description: 批量录入
* @author: w
* @since: 2026-05-08
*/
<template>
<div class="app-container">
<!-- 顶部标题与工具栏 -->
<div class="header-toolbar">
<div class="button-group">
<el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
<el-button type="success" icon="Document" @click="handleSave">保存</el-button>
</div>
</div>
<div class="main-content">
<!-- 左侧表单区域 -->
<div class="left-panel">
<el-form label-width="80px" :model="formData">
<el-form-item label="检验仪器">
<YQSelectTable v-model:data="formData.yq" width="100%" clearable />
</el-form-item>
<el-form-item label="输入模板">
<el-select v-model="formData.template" style="width: 100%" placeholder="" />
</el-form-item>
<el-form-item label="标本日期">
<el-date-picker v-model="formData.jyrq" type="date" format="YYYY/MM/DD" value-format="YYYY/MM/DD"
style="width: 100%" />
</el-form-item>
<el-form-item label="样本类型">
<SelectTable v-model:data="formData.yblx" dictType="BT" placeholder="请选择" />
</el-form-item>
<el-form-item label="标本号">
<el-input v-model="formData.ybh" />
</el-form-item>
</el-form>
<!-- 检验项目表格 -->
<el-table :data="testItems" border height="50vh" class="test-item-table">
<el-table-column label="检验项目" prop="testItem" width="300">
<template #default="{ row, $index }">
<el-input v-model="row.testItem" class="full-width-input" @dblclick="dbHandle($index)" />
</template>
</el-table-column>
<el-table-column label="检验结果" prop="result">
<template #default="{ row }">
<el-input v-model="row.result" class="full-width-input" @keydown="nextResult" />
</template>
</el-table-column>
<el-table-column label="操作" width="80px">
<template #default="{ row, $index }">
<el-button type="danger" text @click="handleDelete($index)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- 右侧说明与文本区域 -->
<div class="right-panel">
<!-- 说明文字 -->
<div class="description-box">
<p class="desc-title">说明：</p>
<p>标本号可以输入如：1,2,5-6等格式，结果区域最后一行回车可直接新增检验项目不输入直接回车能够存盘， 存盘后标本号自动递增，存盘后检验结果自动清除</p>
</div>
<div class="text-area-box">
<el-input v-model="textresult" type="textarea" :rows="20" placeholder="" />
</div>
</div>
</div>
<!-- 新增明细项目 主键yq参数获取-->
<ProjectDetails ref="itemDictRef" :dialog-title="'选择检验项目'" :tableKey="{ yq: formData.yq }"
@select="handleItemSelect" />
</div>
</template>
<script setup lang="ts">
import YQSelectTable from '@/components/SelectTable/YQSelectTable/index.vue'
import dayjs from 'dayjs'
import ProjectDetails from "@/components/projectDetails/index.vue";
import { useCommonStore } from '@/store/modules/commonStore';
const mbStore = useCommonStore();
const textresult = ref('')
// 表单数据
const formData = reactive({
yq: mbStore.defaultConfig.defaultinstr || '1',
template: '',
jyrq: dayjs().format('YYYY/MM/DD'),
yblx: '',
ybh: '1'
})
// 检验项目表格数据
const testItems = ref<Array<{ testItem: string; result: string }>>([])
const handleAdd = () => {
testItems.value.push({ testItem: '', result: '' })
}
const handleSave = () => {
}
const handleDelete = (index: number) => {
testItems.value.splice(index, 1)
}
const itemDictRef = useTemplateRef('itemDictRef')
const rowIndex = ref(-1)
const dbHandle = (index: number) => {
//当前点击的行索引
rowIndex.value = index
itemDictRef.value?.openDictSelector();
}
const nextResult = (e: KeyboardEvent) => {
if (e.key === 'Enter') {
handleAdd()
}
}
const handleItemSelect = (selectedItem) => {
console.log("selectedItem:", selectedItem)
testItems.value[rowIndex.value].testItem = selectedItem.label
};
</script>
<style scoped lang="scss">
.header-toolbar {
display: flex;
align-items: center;
padding: 8px 12px;
.button-group {
display: flex;
gap: 12px;
}
}
.main-content {
display: flex;
gap: 20px;
}
.left-panel {
// background-color: #cce0ff;
padding: 10px;
border: 1px solid #6699cc;
border-radius: 4px;
width: 48%;
.el-form-item {
margin-bottom: .625rem;
}
}
.right-panel {
flex: 1;
display: flex;
flex-direction: column;
gap: 16px;
}
.description-box {
background-color: #cce0ff;
border: 1px solid #6699cc;
padding: 10px;
border-radius: 4px;
color: #003399;
.desc-title {
font-weight: bold;
margin: 0 0 6px 0;
}
p {
margin: 2px 0;
line-height: 1.4;
}
}
</style>

2
src/views/liswork/qualityControl/qcgraph/index.vue
View File

@ -410,7 +410,7 @@ const handleLevelChange = () => {
getBatchList();
const getDataValue = (value) => {
yqmc.value = value.yqmc;
yqmc.value = value.label;
};
const instrOptions = ref([]);

366
src/views/liswork/qualityControl/summary/index.vue Normal file
View File

@ -0,0 +1,366 @@
<template>
<div class="app-container">
<div class="search-section">
<el-form inline :model="searchForm" class="search-form">
<el-form-item label="医疗机构">
<SelectTable v-model:data="searchForm.yljg" dictType="HOS" placeholder="请选择" width="200px" />
</el-form-item>
<el-form-item label="年度">
<el-date-picker v-model="searchForm.year" type="year" placeholder="选择年份" format="YYYY" value-format="YYYY"
style="width: 200px" />
</el-form-item>
<el-form-item label="季度">
<el-select v-model="searchForm.quarter" style="width: 120px" clearable>
<el-option label="第一季度" value="Q1" />
<el-option label="第二季度" value="Q2" />
<el-option label="第三季度" value="Q3" />
<el-option label="第四季度" value="Q4" />
</el-select>
</el-form-item>
<el-form-item label="月度">
<el-select v-model="searchForm.month" style="width: 120px" clearable>
<el-option label="1月" value="01" />
<el-option label="2月" value="02" />
<el-option label="3月" value="03" />
<el-option label="4月" value="04" />
<el-option label="5月" value="05" />
<el-option label="6月" value="06" />
<el-option label="7月" value="07" />
<el-option label="8月" value="08" />
<el-option label="9月" value="09" />
<el-option label="10月" value="10" />
<el-option label="11月" value="11" />
<el-option label="12月" value="12" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleSearch">查询</el-button>
<el-button type="warning">打印</el-button>
</el-form-item>
</el-form>
</div>
<!-- 顶部标题 -->
<div class="header">
<div class="header-right">
<span>日期：{{ pageDate }}</span>
</div>
<div class="title">武汉市第五医院</div>
<div class="title">2026年度检验全过程质量指标</div>
</div>
<div class="table-main">
<!-- 说明文字 -->
<div class="note-section">
<div class="note-line">
您实验室LIS是否纳入质量指标相关数据采集与统计（*）：
<el-radio-group v-model="lisIncluded">
<el-radio label="Y">是</el-radio>
<el-radio label="N">否</el-radio>
</el-radio-group>
</div>
<div class="note-red">
注意：如果条目您实验室确无可统计的数据，请填写“未统计”；若数据为0，请填写数字“0”；填写每个表格前请先勾选此表数据来源：LIS统计、手工计算或估算。
</div>
<div class="note-red">
非本单位实验室开展的检验项目均不纳入统计
</div>
</div>
<!-- 表格1 -->
<div class="table-section">
<el-table :data="table1Data" border style="width:100%" :row-class-name="setSourceRowClass"
:span-method="spanSourceMethod">
<el-table-column prop="itemName" label="（一）标本可接受性(*)" width="300" />
<el-table-column label="专业" align="center">
<el-table-column label="生化" prop="biochemistry" align="center">
<!-- 数据来源列：渲染单选框 -->
<template #default="{ row }">
<div v-if="row.isSourceRow" :style="{ textAlign: row.isSourceRow ? 'left' : 'center' }">
<el-radio-group :model-value="row.dataSource">
<el-radio label="LIS">LIS</el-radio>
<el-radio label="MANUAL">手工</el-radio>
<el-radio label="ESTIMATE">估算</el-radio>
</el-radio-group>
</div>
</template>
</el-table-column>
<el-table-column label="免疫" prop="immunity" align="center" />
<el-table-column label="临检" prop="clinical" align="center" />
<el-table-column label="微生物" prop="microbiology" align="center" />
</el-table-column>
</el-table>
</div>
<!-- 表格2 -->
<div class="table-section">
<el-table :data="table2Data" border style="width:100%">
<el-table-column prop="itemName" label="（二）检验报告(*)" width="300" />
<el-table-column label="专业" align="center">
<el-table-column label="生化" prop="biochemistry" align="center" />
<el-table-column label="免疫" prop="immunity" align="center" />
<el-table-column label="临检" prop="clinical" align="center" />
<el-table-column label="微生物" prop="microbiology" align="center" />
</el-table-column>
</el-table>
</div>
<!-- 表格3 -->
<div class="table-section">
<el-table :data="table3Data" border style="width:100%">
<el-table-column prop="itemName" label="（三）周转时间(*)" width="300" />
<el-table-column label="专业" align="center">
<el-table-column label="生化" prop="biochemistry" align="center" />
<el-table-column label="自动化免疫" prop="immunoAuto" align="center" />
<el-table-column label="三大常规" prop="routine" align="center" />
<el-table-column label="凝血" prop="coagulation" align="center" />
</el-table-column>
</el-table>
</div>
<!-- 表格4 -->
<div class="table-section">
<el-table :data="table4Data" border style="width:100%" :span-method="objectSpanMethod"
:row-class-name="tableRowClassName">
<el-table-column label="（三）周转时间(具体项目)(*)" width="300">
<el-table-column label="项目(时间单位：min)" prop="itemName" width="300" />
</el-table-column>
<el-table-column label="检验前周转时间" align="center">
<el-table-column label="本实验室规定时间" prop="preSpecTime" align="center">
<template #default="{ row }">
<div v-if="row.isSourceRow" :style="{ textAlign: row.isSourceRow ? 'left' : 'center' }">
<el-radio-group :model-value="row.dataSource">
<el-radio label="LIS">LIS</el-radio>
<el-radio label="MANUAL">手工</el-radio>
<el-radio label="ESTIMATE">估算</el-radio>
</el-radio-group>
</div>
</template>
</el-table-column>
<el-table-column label="年中位数" prop="preMedian" align="center" />
<el-table-column label="年第90百分位数" prop="preP90" align="center" />
</el-table-column>
<el-table-column label="实验室内周转时间" align="center">
<el-table-column label="本实验室规定时间" prop="inSpecTime" align="center" />
<el-table-column label="年中位数" prop="inMedian" align="center" />
<el-table-column label="年第90百分位数" prop="inP90" align="center" />
</el-table-column>
<el-table-column label="总周转时间" align="center">
<el-table-column label="本实验室规定时间" prop="totalSpecTime" align="center" />
<el-table-column label="年中位数" prop="totalMedian" align="center" />
<el-table-column label="年第90百分位数" prop="totalP90" align="center" />
</el-table-column>
<el-table-column label="年标本量" prop="totalSample" align="center" />
</el-table>
</div>
<!-- 表格5 -->
<div class="table-section">
<el-table :data="table5Data" border style="width:100%">
<el-table-column prop="itemName" label="（四）血培养污染(*)" width="300" />
<el-table-column label="专业" align="center">
<el-table-column label="微生物" prop="microbiology" align="center" />
</el-table-column>
</el-table>
</div>
<!-- 表格6 -->
<div class="table-section">
<el-table :data="table6Data" border style="width:100%" :row-class-name="setSourceRowClass">
<!-- 第一列：项目名称 -->
<el-table-column prop="itemName" label="（五）IQC、EQA(*)（微生物检测的EQA算1项，项目计数为小项，如钾、钠、氯各计1项）" width="700" />
<!-- 第二列：数值/数据来源勾选 -->
<el-table-column prop="value">
<template #default="{ row }">
<div v-if="row.isSourceRow" :style="{ textAlign: row.isSourceRow ? 'left' : 'center' }">
<el-radio-group :model-value="row.dataSource">
<el-radio label="LIS">LIS</el-radio>
<el-radio label="MANUAL">手工</el-radio>
<el-radio label="ESTIMATE">估算</el-radio>
</el-radio-group>
</div>
</template>
</el-table-column>
</el-table>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import dayjs from 'dayjs'
const searchForm = ref({
yljg: '',
year: '',
quarter: '',
month: ''
})
const pageDate = ref(dayjs().format('YYYY/MM/DD'))
const lisIncluded = ref('Y')
const table1Data = ref([
{ itemName: '数据来源', isSourceRow: true, dataSource: 'LIS' },
{ itemName: '本年标本总数', biochemistry: 0, immunity: 0, clinical: 0, microbiology: 0, }
])
// 样式标记
const setSourceRowClass = ({ row }) => row.isSourceRow ? 'source-row' : ''
const spanSourceMethod = ({ row, columnIndex }) => {
if (row.isSourceRow) {
// 数据来源行：第0列占1列1行，第1列跨4列（生化/免疫/临检/微生物），其余列隐藏
if (columnIndex === 0) {
return { rowspan: 1, colspan: 1 }; // 项目名称列
} else if (columnIndex >= 1 && columnIndex <= 4) {
// 专业列（生化/免疫/临检/微生物）合并为1列
if (columnIndex === 1) {
return { rowspan: 1, colspan: 4 }; // 仅第一列（生化）跨4列，其余列隐藏
} else {
return { rowspan: 0, colspan: 0 }; // 免疫/临检/微生物列隐藏
}
}
}
// 非数据来源行：正常显示
return { rowspan: 1, colspan: 1 };
}
const table2Data = ref([])
const table3Data = ref([])
const table4Data = ref([
{ itemName: '数据来源', isSourceRow: true, dataSource: 'LIS' },
{ itemName: '门诊项目', isMerge: true, },
{ itemName: '尿常规', preSpecTime: 60, preMedian: 13, preP90: 38, inSpecTime: 60, inMedian: 8, totalSpecTime: 120, totalSample: 9572 },
{ itemName: '住院项目', isMerge: true },
{ itemName: '血钾', preSpecTime: 60, preMedian: 52, preP90: 127, inSpecTime: 120, inMedian: 48, totalSpecTime: 180, totalSample: 14345 },
])
const table5Data = ref([])
const table6Data = ref([
{ itemName: '数据来源', isSourceRow: true, dataSource: 'LIS' },
{ itemName: '该年开展检验项目总数', value: 690 },
{ itemName: '开展室内质控项目总数', value: 155 },
{ itemName: '恋室室内质控CV有要求的项目数（定量项目）', value: 285 },
{ itemName: '室内质控CV高于规定要求的项目数（定量项目）', value: 0 }
])
const handleSearch = () => {
console.log('查询条件：', searchForm.value)
}
// 合并单元格逻辑
const objectSpanMethod = ({ row, columnIndex }: any) => {
if (row.isMerge || row.isSourceRow) {
// 第0列（项目名称）不合并，其余列全部合并（跨10列）
if (columnIndex === 0) {
return { rowspan: 1, colspan: 1 }
} else {
return { rowspan: 1, colspan: 10 }
}
}
}
const tableRowClassName = ({ row }) => {
if (row.isMerge) return 'source-row'
if (row.isSourceRow) return 'source-row'
return ''
}
onMounted(() => {
})
</script>
<style scoped lang="scss">
// 新增查询区域样式
.search-section {
margin-bottom: 16px;
padding: 10px;
background: #e4f0fc;
border-radius: 4px;
.search-form {
.el-form-item {
margin-bottom: 0;
margin-right: 16px;
}
}
}
.header {
position: relative;
text-align: center;
margin-bottom: 8px;
.header-right {
position: absolute;
right: 0;
top: 0;
text-align: right;
font-size: 14px;
span {
display: block;
}
}
.title {
font-size: 18px;
font-weight: bold;
line-height: 1.6;
}
}
.table-main {
height: 70vh;
overflow-y: auto;
}
.note-section {
margin-bottom: 16px;
.note-line {
margin-bottom: 6px;
}
.note-red {
color: red;
font-size: 13px;
line-height: 1.4;
}
}
.table-section {
margin-bottom: 20px;
}
.data-source-row {
display: flex;
align-items: center;
padding: 6px 10px;
background: #f5f7fa;
border: 1px solid #ebeef5;
border-top: none;
.el-radio-group {
margin-left: 12px;
}
}
:deep(.el-table--border th.el-table__cell) {
border-right: 1px solid #fff !important;
}
:deep(.el-table__row) {
&.source-row {
font-weight: bold;
font-size: 16px !important;
color: #000;
}
}
</style>

1
src/views/liswork/qualityControl/westGard/index.vue
View File

@ -165,7 +165,6 @@ import dayjs from 'dayjs';
import { ElMessage } from 'element-plus'
import { queryBatch, queryBatchXm, } from '@/api/liswork/qualityControl'
import * as echarts from 'echarts';
import { use } from "vxe-pc-ui";
const mbStore = useCommonStore();

15
src/views/liswork/specimenMonitoring/index.vue
View File

@ -6,7 +6,7 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryRef" label-width="90px" inline>
<el-form :model="queryParams" ref="queryRef" label-width="90px" inline class="query-form">
<el-form-item label="病人来源：" prop="brly">
<SelectTable v-model:data="queryParams.brly" dictType='PT' placeholder="请选择病人来源" style="width: 12rem;" />
</el-form-item>
@ -38,13 +38,12 @@
<el-form-item>
<el-button @click="isExpand = !isExpand" type="text">展开更多查询</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">查询</el-button>
<el-button type="default" icon="Refresh" @click="refresh">重置</el-button>
<el-button type="warning" @click="printHandle">导出</el-button>
</el-form-item>
</el-form>
<div class="mb5">
<el-button type="primary" icon="Search" @click="handleQuery">查询</el-button>
<el-button type="default" icon="Refresh" @click="refresh">重置</el-button>
<el-button type="warning" icon="Printer" plain @click="printHandle">导出</el-button>
</div>
<!--更多查询条件 -->
<el-drawer title="查询条件" v-model="isExpand" direction="rtl" size="28%" :with-header="true">
<el-form :model="queryParams" label-width="120px">
@ -342,7 +341,7 @@ onMounted(() => {
}
.table-container {
height: calc(100% - 150px);
height: calc(100% - 200px);
}
.el-form-item {

145
src/views/liswork/xtwh/mzcxconfig/index.vue
View File

@ -1,53 +1,44 @@
<!-- 系统全局选项 -->
<template>
<div class="sys_box">
<el-row :gutter="10" class="table-toolbar">
<el-col :span="1.5">
<el-button type="primary" plain icon="Check" @click="handleSave">保存</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Edit" @click="handleCancelEdit">取消修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="RefreshRight" @click="handleRestoreDefault">还原默认</el-button>
</el-col>
</el-row>
<div class="app-container">
<div class="mb5">
<el-button type="primary" plain icon="Check" @click="handleSave">保存</el-button>
<el-button type="info" plain icon="Edit" @click="handleCancelEdit">取消修改</el-button>
<el-button type="danger" plain icon="RefreshRight" @click="handleRestoreDefault">还原默认</el-button>
</div>
<!-- 两列表格容器（修改点1：容器名称调整） -->
<div class="double-table-wrapper">
<!-- 第一列表格 -->
<div class="table-panel table-1">
<el-table v-loading="loading" :data="tableData1" @selection-change="handleSelectionChange" class="config-table"
fit border height="100%" :cell-spacing="0">
<el-table v-loading="loading" :data="tableData1" @selection-change="handleSelectionChange" border height="100%">
<el-table-column label="序号" align="center" prop="configSort" width="50" />
<el-table-column :label="`${menuname}名称`" align="left" prop="configName" show-overflow-tooltip
min-width="150" />
min-width="150" />
<el-table-column label="参数值" align="center" prop="configDefvalue" show-overflow-tooltip min-width="100">
<template #default="scope">
<DynamicInput :type="scope.row.configOptiontype" v-model="scope.row.configDefvalue"
:dict-data="scope.row.remark" :placeholder="`请输入${scope.row.configName}值`" class="edit-input" />
:dict-data="scope.row.remark" :placeholder="`请输入${scope.row.configName}值`" class="edit-input" />
</template>
</el-table-column>
<el-table-column label="值码" align="center" prop="configDefvalue" v-if="false" show-overflow-tooltip
min-width="100" />
min-width="100" />
</el-table>
</div>
<!-- 第二列表格（修改点2：保留第二列，删除第三列） -->
<div class="table-panel table-2">
<el-table v-loading="loading" :data="tableData2" @selection-change="handleSelectionChange" class="config-table"
fit border height="100%" :cell-spacing="0">
<el-table v-loading="loading" :data="tableData2" @selection-change="handleSelectionChange" border height="100%">
<el-table-column label="序号" align="center" prop="configSort" width="50" />
<el-table-column :label="`${menuname}名称`" align="left" prop="configName" show-overflow-tooltip
min-width="150" />
min-width="150" />
<el-table-column label="参数值" align="center" prop="configDefvalue" show-overflow-tooltip min-width="100">
<template #default="scope">
<DynamicInput :type="scope.row.configOptiontype" v-model="scope.row.configDefvalue"
:dict-data="scope.row.remark" :placeholder="`请输入${scope.row.configName}值`" class="edit-input" />
:dict-data="scope.row.remark" :placeholder="`请输入${scope.row.configName}值`" class="edit-input" />
</template>
</el-table-column>
<el-table-column label="值码" align="center" prop="configDefvalue" v-if="false" show-overflow-tooltip
min-width="100" />
min-width="100" />
</el-table>
</div>
</div>
@ -61,7 +52,7 @@ import { getFirstLetter } from '@/utils/pinyin'
// @ts-ignore
import DynamicInput from "@/views/liswork/xtwh/localconfig/components/DynamicInput.vue"
const yq = ref<string>("_MZCX_")
const yq = ref<string>("_MZCX_")
interface RegDictItem {
configId: string | number
@ -137,13 +128,13 @@ const handleSave = async (): Promise<void> => {
const handleCancelEdit = (): void => {
ElMessageBox.confirm(
"是否确认取消所有修改，恢复原始数据？",
"提示",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}
"是否确认取消所有修改，恢复原始数据？",
"提示",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}
).then(() => {
regdictList.value = JSON.parse(JSON.stringify(originRegdictList.value))
ElMessage.success("已恢复原始数据！")
@ -152,13 +143,13 @@ const handleCancelEdit = (): void => {
const handleRestoreDefault = async (): Promise<void> => {
ElMessageBox.confirm(
"是否确认还原所有默认值？此操作会覆盖当前修改！",
"警告",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "error"
}
"是否确认还原所有默认值？此操作会覆盖当前修改！",
"警告",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "error"
}
).then(async () => {
loading.value = true
try {
@ -193,7 +184,7 @@ getList()
flex: 1;
height: calc(100% - 45px); // 减去标题行+工具栏高度
display: flex;
gap: 0px; // 表格间间距
gap: 10px; // 表格间间距
overflow: hidden;
// 单个表格面板
@ -202,7 +193,6 @@ getList()
height: 100%;
overflow: hidden;
background: #fff;
border: 1px solid #e6e6e6;
border-radius: 4px;
// 细微间距优化（修改点7：调整两列的间距样式）
@ -215,79 +205,4 @@ getList()
}
}
}
// 核心：清除表格内上下间隙
:deep(.config-table) {
// 清除表格整体的边框间距
border-collapse: collapse !important;
border-spacing: 0 !important;
// 清除表格头部间距
.el-table__header {
padding: 0 !important;
th {
padding: 0 !important;
border-bottom: 1px solid #e6e6e6 !important;
line-height: 25px !important;
height: 25px !important;
}
}
// 清除表格内容区间距
.el-table__body {
padding: 0 !important;
// 清除行间距
.el-table__row {
height: 25px !important;
line-height: 25px !important;
margin: 0 !important;
padding: 0 !important;
}
// 清除单元格内边距和间距
.el-table__cell {
padding: 0 4px !important; // 仅保留左右内边距，上下清零
height: 25px !important;
line-height: 25px !important;
vertical-align: middle !important;
font-size: 12px;
border-bottom: 1px solid #e6e6e6 !important;
border-right: 1px solid #e6e6e6 !important;
}
// 最后一列清除右侧边框
.el-table__cell:last-child {
border-right: none !important;
}
}
// 清除表格底部间距
.el-table__footer {
padding: 0 !important;
}
// 编辑输入框适配紧凑布局
.edit-input {
width: 95%;
margin: 0 !important;
padding: 0 !important;
:deep(.el-input__inner) {
padding: 0 5px;
height: 25px !important; // 缩小输入框高度适配紧凑行高
line-height: 25px !important;
font-size: 12px;
border: 1px solid #dcdfe6;
margin: 0 !important;
&:focus {
border-color: #409eff;
outline: none;
}
}
}
}
</style>

2
src/views/login.vue
View File

@ -163,7 +163,7 @@ const handleLogin = async () => {
loading.value = true;
Cookies.set("czlis_username", loginForm.value.username, { expires: 30 });
Cookies.set("czlis_loginYLJG", loginForm.value.loginParam.loginYLJG, { expires: 30 });
Cookies.set("czlis_loginYLJGName", loginForm.value.loginParam.loginYLJGName, { expires: 30 });
// Cookies.set("czlis_loginYLJGName", loginForm.value.loginParam.loginYLJGName, { expires: 30 });
// loginForm.value.password = encrypt(loginForm.value.password); // 密码加密
userStore.login(loginForm.value).then(() => {

821
src/views/mzcx/blood/index.vue
View File

@ -1,239 +1,180 @@
<template>
<div class="app-container">
<div class="table-header">
<el-button type="primary" @click="handleQuery" class="add-btn"> 查询 </el-button>
<el-button type="primary" @click="addNewItem" class="add-btn"> 新增 </el-button>
<el-button type="success" @click="save" class="add-btn"> 保存 </el-button>
<el-button type="primary" icon="Refresh" @click="handleQuery"> 刷新 </el-button>
<el-button type="primary" plain icon="Plus" @click="openAddDialog"> 新增 </el-button>
</div>
<el-table :data="tableData" border style="width: 100%" @cell-click="handleCellClick"
:cell-class-name="cellClassName" :row-key="(row: any) => row.id" height="calc(100vh - 260px)"
highlight-current-row ref="tableRef">
<!-- 分单类别代号 -->
<el-table-column prop="sflbdh" label="分单类别代号" width="110">
<!-- 表格展示 -->
<el-table :data="tableData" border style="width: 100%" :row-key="(row) => row.id" height="calc(100% - 120px)"
highlight-current-row ref="tableRef" show-overflow-tooltip>
<el-table-column prop="sflbdh" label="分单类别代号" width="110" align="center" />
<el-table-column prop="sflbmc" label="类别名称" width="150" align="center" />
<el-table-column prop="sflbjc" label="类别简称" width="120" align="center" />
<el-table-column prop="txmlb" label="条码类别" width="110" align="center" />
<el-table-column prop="yblx" label="标本类型" width="80" align="center" />
<el-table-column prop="sampletips" label="标本采集说明" width="100" align="center">
<template #default="scope">
<template v-if="isEditing(scope.row, 'sflbdh')">
<el-input v-model="scope.row.sflbdh" size="small" class="full-width-input"
@blur="handleSave(scope.row, 'sflbdh')" @keyup.enter="handleSave(scope.row, 'sflbdh')" auto-focus
:ref="getInputRef(scope.row.id, 'sflbdh')" />
</template>
<template v-else>
<span @click.stop="handleCellClick(scope.row, { property: 'sflbdh' })">
{{ scope.row.sflbdh }}
</span>
</template>
<div class="multi-line-text">{{ scope.row.sampletips }}</div>
</template>
</el-table-column>
<!-- 类别名称 -->
<el-table-column prop="sflbmc" label="类别名称" width="150">
<el-table-column prop="bglqdh" label="报告领取规则" align="center">
<template #default="scope">
<template v-if="isEditing(scope.row, 'sflbmc')">
<el-input v-model="scope.row.sflbmc" size="small" class="full-width-input"
@blur="handleSave(scope.row, 'sflbmc')" @keyup.enter="handleSave(scope.row, 'sflbmc')" auto-focus
:ref="getInputRef(scope.row.id, 'sflbmc')" />
</template>
<template v-else>
<span @click.stop="handleCellClick(scope.row, { property: 'sflbmc' })">
{{ scope.row.sflbmc }}
</span>
</template>
{{ getOptionLabel(reportRuleOptions, scope.row.bglqdh) }}
</template>
</el-table-column>
<!-- 类别简称 -->
<el-table-column prop="sflbjc" label="类别简称" width="120">
<el-table-column prop="printcnt" label="打印份数" width="80" align="center" />
<el-table-column prop="lisgroup1" label="专业组(样本数)" width="140" align="center" />
<el-table-column prop="lisgroup2" label="专业组(周转时间)" width="160" align="center" />
<el-table-column prop="kn" label="抗凝" width="60" align="center">
<template #default="scope">
<template v-if="isEditing(scope.row, 'sflbjc')">
<el-input v-model="scope.row.sflbjc" size="small" class="full-width-input"
@blur="handleSave(scope.row, 'sflbjc')" @keyup.enter="handleSave(scope.row, 'sflbjc')" auto-focus
:ref="getInputRef(scope.row.id, 'sflbjc')" />
</template>
<template v-else>
<span @click.stop="handleCellClick(scope.row, { property: 'sflbjc' })">
{{ scope.row.sflbjc }}
</span>
</template>
<el-checkbox :model-value="scope.row.kn" true-label="1" false-label="0" />
</template>
</el-table-column>
<!-- 条码类别 -->
<el-table-column prop="txmlb" label="条码类别" width="110">
<el-table-column prop="xpy" label="血培" width="60" align="center">
<template #default="scope">
<template v-if="isEditing(scope.row, 'txmlb')">
<el-input v-model="scope.row.txmlb" size="small" class="full-width-input"
@blur="handleSave(scope.row, 'txmlb')" @keyup.enter="handleSave(scope.row, 'txmlb')" auto-focus
:ref="getInputRef(scope.row.id, 'txmlb')" />
</template>
<template v-else>
<span @click.stop="handleCellClick(scope.row, { property: 'txmlb' })">
{{ scope.row.txmlb }}
</span>
</template>
<el-checkbox :model-value="scope.row.xpy" true-label="1" false-label="0" />
</template>
</el-table-column>
<!-- 标本类型 -->
<el-table-column prop="yblx" label="标本类型" width="140">
<template #default="scope">
<template v-if="isEditing(scope.row, 'yblx')">
<el-select v-model="scope.row.yblx" size="small" class="full-width-input"
@change="handleSave(scope.row, 'yblx')" @blur="handleSave(scope.row, 'yblx')" auto-focus filterable>
<el-option v-for="item in dictData.BT" :key="item.label" :label="item.label" :value="item.label" />
</el-select>
</template>
<template v-else>
<span @click.stop="handleCellClick(scope.row, { property: 'yblx' })">
{{ scope.row.yblx }}
</span>
</template>
</template>
</el-table-column>
<!-- 标本采集说明 -->
<el-table-column prop="sampletips" label="标本采集说明" width="220">
<template #default="scope">
<template v-if="isEditing(scope.row, 'sampletips')">
<el-input v-model="scope.row.sampletips" size="small" class="full-width-input"
@blur="handleSave(scope.row, 'sampletips')" @keyup.enter.ctrl="handleSave(scope.row, 'sampletips')"
auto-focus :ref="getInputRef(scope.row.id, 'sampletips')" />
</template>
<template v-else>
<div class="multi-line-text" @click.stop="handleCellClick(scope.row, { property: 'sampletips' })">
{{ scope.row.sampletips }}
</div>
</template>
</template>
</el-table-column>
<!-- 报告领取规则 -->
<el-table-column prop="bglqdh" label="报告领取规则" width="160">
<template #default="scope">
<template v-if="isEditing(scope.row, 'bglqdh')">
<el-select v-model="scope.row.bglqdh" size="small" class="full-width-input"
@change="handleSave(scope.row, 'bglqdh')" filterable @blur="handleSave(scope.row, 'bglqdh')" auto-focus>
<el-option v-for="item in reportRuleOptions" :key="item.bglqdh" :label="item.bglqmc"
:value="item.bglqdh" />
</el-select>
</template>
<template v-else>
<span @click.stop="handleCellClick(scope.row, { property: 'bglqdh' })">
{{ getOptionLabel(reportRuleOptions, scope.row.bglqdh) }}
</span>
</template>
</template>
</el-table-column>
<!-- 打印份数 -->
<el-table-column prop="printcnt" label="打印份数" width="120" align="center">
<template #default="scope">
<template v-if="isEditing(scope.row, 'printcnt')">
<el-input-number v-model="scope.row.printcnt" class="full-width-input" :min="1" :max="9" size="small"
@blur="handleSave(scope.row, 'printcnt')" @keyup.enter="handleSave(scope.row, 'printcnt')" auto-focus
:ref="getInputRef(scope.row.id, 'printcnt')" />
</template>
<template v-else>
<span @click.stop="handleCellClick(scope.row, { property: 'printcnt' })">
{{ scope.row.printcnt }}
</span>
</template>
</template>
</el-table-column>
<!-- 专业组(样本数) -->
<el-table-column prop="lisgroup1" label="专业组(样本数)" width="140" align="center">
<template #default="scope">
<template v-if="isEditing(scope.row, 'lisgroup1')">
<el-select v-model="scope.row.lisgroup1" size="small" class="full-width-input"
@change="handleSave(scope.row, 'lisgroup1')" @blur="handleSave(scope.row, 'lisgroup1')" auto-focus
filterable>
<el-option v-for="item in dictData.LISGROUP1" :key="item.label" :label="item.label" :value="item.label" />
</el-select>
</template>
<template v-else>
<span @click.stop="handleCellClick(scope.row, { property: 'lisgroup1' })">
{{ scope.row.lisgroup1 }}
</span>
</template>
</template>
</el-table-column>
<!-- 专业组(周转时间) -->
<el-table-column prop="lisgroup2" label="专业组(周转时间)" width="160" align="center">
<template #default="scope">
<template v-if="isEditing(scope.row, 'lisgroup2')">
<el-select v-model="scope.row.lisgroup2" size="small" class="full-width-input"
@change="handleSave(scope.row, 'lisgroup2')" @blur="handleSave(scope.row, 'lisgroup2')" auto-focus
filterable>
<el-option v-for="item in dictData.LISGROUP2" :key="item.label" :label="item.label" :value="item.label" />
</el-select>
</template>
<template v-else>
<span @click.stop="handleCellClick(scope.row, { property: 'lisgroup2' })">
{{ scope.row.lisgroup2 }}
</span>
</template>
</template>
</el-table-column>
<!-- 抗凝 -->
<el-table-column prop="kn" label="抗凝" width="100" align="center">
<template #default="scope">
<el-checkbox v-model="scope.row.kn" :true-value="'1'" :false-value="'0'"
@change="handleSave(scope.row, 'kn')" />
</template>
</el-table-column>
<!-- 血培 -->
<el-table-column prop="xpy" label="血培" width="100" align="center">
<template #default="scope">
<el-checkbox v-model="scope.row.xpy" :true-value="'1'" :false-value="'0'"
@change="handleSave(scope.row, 'xpy')" />
</template>
</el-table-column>
<!-- 标识颜色 -->
<el-table-column prop="bkcolor" label="标识颜色" width="140" align="center">
<template #default="scope">
<template v-if="isEditing(scope.row, 'bkcolor')">
<el-color-picker v-model="scope.row.bkcolor" size="small" @change="handleSave(scope.row, 'bkcolor')"
@blur="handleSave(scope.row, 'bkcolor')" auto-focus />
</template>
<template v-else>
<div class="color-display" @click.stop="handleCellClick(scope.row, { property: 'bkcolor' })">
<span class="color-block" :style="{ backgroundColor: scope.row.bkcolor }" />
<span class="color-code">{{ scope.row.bkcolor }}</span>
</div>
</template>
<div class="color-display">
<span class="color-block" :style="{ backgroundColor: scope.row.bkcolor }" />
<span class="color-code">{{ scope.row.bkcolor }}</span>
</div>
</template>
</el-table-column>
<!-- 操作列 -->
<el-table-column label="操作" align="center" fixed="right" width="100">
<el-table-column label="操作" align="center" fixed="right" width="150" class-name="small-padding fixed-width">
<template #default="scope">
<el-button text type="danger" @click="handleDelete(scope.row)">删除</el-button>
<el-button link type="primary" icon="Edit" @click="openEditDialog(scope.row)">编辑</el-button>
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination :total="total" v-model:page="pageNum" v-model:limit="pageSize" @pagination="getList" />
<!-- 新增/编辑弹窗 -->
<el-dialog v-model="dialogVisible" :title="dialogTitle" width="700px" destroy-on-close @close="resetForm"
:close-on-click-modal="false" :draggable="true">
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" label-position="right">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="分单类别代号" prop="sflbdh">
<el-input v-model="formData.sflbdh" placeholder="请输入分单类别代号" :disabled="!isAdd" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="类别名称" prop="sflbmc">
<el-input v-model="formData.sflbmc" placeholder="请输入类别名称" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="类别简称" prop="sflbjc">
<el-input v-model="formData.sflbjc" placeholder="请输入类别简称" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="条码类别" prop="txmlb">
<el-input v-model="formData.txmlb" placeholder="请输入条码类别" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="标本类型" prop="yblx">
<el-select v-model="formData.yblx" placeholder="请选择标本类型" filterable>
<el-option v-for="item in dictData.BT" :key="item.label" :label="item.label" :value="item.label" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="报告领取规则" prop="bglqdh">
<el-select v-model="formData.bglqdh" placeholder="请选择报告领取规则" filterable>
<el-option v-for="item in reportRuleOptions" :key="item.bglqdh" :label="item.bglqmc"
:value="item.bglqdh" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="打印份数" prop="printcnt">
<el-input-number v-model="formData.printcnt" :min="1" :max="9" placeholder="请输入打印份数" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="专业组(样本数)" prop="lisgroup1">
<el-select v-model="formData.lisgroup1" placeholder="请选择专业组" filterable>
<el-option v-for="item in dictData.LISGROUP1" :key="item.label" :label="item.label"
:value="item.label" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="专业组(周转时间)" prop="lisgroup2">
<el-select v-model="formData.lisgroup2" placeholder="请选择专业组" filterable>
<el-option v-for="item in dictData.LISGROUP2" :key="item.label" :label="item.label"
:value="item.label" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="标识颜色" prop="bkcolor">
<el-color-picker v-model="formData.bkcolor" />
{{ formData.bkcolor }}
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="抗凝">
<el-checkbox v-model="formData.kn" true-value="1" false-value="0">是否抗凝</el-checkbox>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="血培">
<el-checkbox v-model="formData.xpy" true-value="1" false-value="0">是否血培</el-checkbox>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="标本采集说明" prop="sampletips">
<el-input v-model="formData.sampletips" type="textarea" :rows="3" placeholder="请输入标本采集说明" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="submitForm">保存</el-button>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { ref, reactive, nextTick, onMounted, toRaw, computed } from 'vue';
import { ref, reactive, nextTick, onMounted, toRaw } from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus';
import { feeitemclassList, rptgetrules, feeitemclassAdd, feeitemclassUpdate, feeitemclassDel } from '@/api/mzcx/index';
import { classCom } from '@/utils/classCom';
// @ts-ignore
import { comDict } from '@/utils/dict'
// 分页相关
const pageNum = ref(1);
const pageSize = ref(10);
const pageSize = ref(20);
const total = ref(0);
// 下拉选项数据
const reportRuleOptions = ref<{ bglqdh: string, bglqmc: string, bz: string }[]>([]);
// 表格数据接口
interface tableDataItem {
id: string,
sflbdh: string,
@ -248,207 +189,128 @@ interface tableDataItem {
lisgroup2: string,
kn: string,
xpy: string,
bkcolor: string,
originalData: object,
flag: boolean,
status: boolean
bkcolor: string
}
// 表单数据接口
interface FormData extends tableDataItem {
originalData?: object
}
// 表格数据
const tableData = ref<tableDataItem[]>([]);
const inputRefs = ref<Record<string, any>>({});
// 表格引用
const tableRef = ref(null);
const editingState = ref({ rowId: '', field: '' });
// 弹窗相关
const dialogVisible = ref(false);
const dialogTitle = ref('');
const isAdd = ref(true); // 是否为新增操作
// 设置输入框引用
const getInputRef = (rowId: string, field: string) => {
return (el: any) => {
if (el) {
inputRefs.value[`${rowId}-${field}`] = el;
// 表单相关
const formRef = ref<any>(null);
const formData = ref<FormData>({
id: '',
sflbdh: '',
sflbmc: '',
sflbjc: '',
txmlb: '',
yblx: '',
sampletips: '',
bglqdh: 1,
printcnt: 1,
lisgroup1: '',
lisgroup2: '',
kn: '0',
xpy: '0',
bkcolor: '#FFFFFF'
});
// 表单校验规则
const formRules = ref({
sflbdh: [
{ required: true, message: '分单类别代号不能为空', trigger: 'blur' },
{
validator: (rule: any, value: string, callback: any) => {
// 新增时校验重复
if (isAdd.value && value) {
const isDuplicate = tableData.value.some((item) => item.sflbdh === value);
if (isDuplicate) {
callback(new Error('分单类别代号已存在'));
} else {
callback();
}
} else {
callback();
}
},
trigger: 'blur'
}
};
};
],
sflbmc: [
{ required: true, message: '类别名称不能为空', trigger: 'blur' }
],
sflbjc: [
{ required: true, message: '类别简称不能为空', trigger: 'blur' }
],
printcnt: [
{ required: true, message: '打印份数不能为空', trigger: 'blur' },
{ type: 'number', min: 1, message: '打印份数必须大于0', trigger: 'blur' }
],
yblx: [
{ required: true, message: '标本类型不能为空', trigger: 'change' }
],
bglqdh: [
{ required: true, message: '报告领取规则不能为空', trigger: 'change' }
]
});
// 判断是否处于编辑状态
const isEditing = (row: any, field: string) => {
return editingState.value && editingState.value.rowId === row.id && editingState.value.field === field;
};
// 字典数据
interface DictData {
BT?: Array<any>;
LISGROUP1?: Array<any>;
LISGROUP2?: Array<any>;
[key: string]: any[] | undefined;
}
const dictData = ref<DictData>({});
// 获取选项标签
const getOptionLabel = (options: any, value: string) => {
const getOptionLabel = (options: any, value: string | number) => {
const option = options.find((item: any) => item.bglqdh === value);
return option ? option.bglqmc : '';
};
// 处理单元格点击 - 核心修复部分
const handleCellClick = (row: any, column: any) => {
// 忽略操作列
if (column.label === '操作') return;
// 打开新增弹窗
const openAddDialog = () => {
isAdd.value = true;
dialogTitle.value = '新增类别';
resetForm(); // 重置表单
dialogVisible.value = true;
const field = column.property;
// 如果点击的是当前编辑的单元格，不重复处理
if (isEditing(row, field)) {
return;
}
// 保存之前编辑的内容
if (editingState.value) {
const prevRow = tableData.value.find((r: any) => r.id === editingState.value.rowId);
if (prevRow) {
handleSave(prevRow, editingState.value.field);
}
}
// 保存原始值用于恢复
row.originalData[field] = JSON.parse(JSON.stringify(row[field]));
// 设置当前编辑状态
editingState.value = {
rowId: row.id,
field: field
};
// 强制刷新UI后聚焦
nextTick(() => {
const inputKey = `${row.id}-${field}`;
const inputComponent = inputRefs.value[inputKey];
if (!inputComponent) return;
// 不同组件的聚焦方式不同，做适配处理
if (inputComponent.focus) {
// 基础输入组件直接调用focus方法
inputComponent.focus();
} else if (inputComponent.$el) {
// 查找内部输入元素
const inputEl = inputComponent.$el.querySelector('input, textarea') ||
inputComponent.$el.querySelector('.el-select__input') ||
inputComponent.$el;
inputEl?.focus?.();
}
});
};
// 保存编辑
const handleSave = (row: any, field: string) => {
// 非编辑状态不处理
if (!isEditing(row, field)) return;
let isValid = true;
let errorMessage = '';
// 字段验证
switch (field) {
case 'sflbdh':
if (!row[field]?.trim()) {
isValid = false;
errorMessage = '分单类别代号不能为空';
} else {
// 验证重复（排除当前行自身）
const isDuplicate = tableData.value.some((item: any) => {
return item.sflbdh === row.sflbdh && item.id !== row.id;
});
if (isDuplicate) {
isValid = false;
errorMessage = '分单类别代号已存在';
}
}
break;
// case 'sflbmc':
// if (!row[field]?.trim()) {
// isValid = false;
// errorMessage = '类别名称不能为空';
// }
// break;
// case 'sflbjc':
// if (!row[field]?.trim()) {
// isValid = false;
// errorMessage = '类别简称不能为空';
// }
// break;
case 'printcnt':
if (row[field] < 1) {
isValid = false;
errorMessage = '数值必须大于0';
}
break;
case 'bkcolor':
break;
}
// 验证失败处理
if (!isValid) {
row[field] = row.originalData[field];
ElMessage.error(errorMessage);
// 保持编辑状态以便修正
return;
}
// 对比原始数据判断是否有变化
if (!row.status) {
row.status = JSON.stringify(row[field]) !== JSON.stringify(row.originalData[field]);
}
// 清除编辑状态
editingState.value = { rowId: '', field: '' };
console.log('originalData==>', row);
};
interface OperateLists {
addList: any[];
updateList: any[];
}
// 保存
const save = () => {
const { addList, updateList } = tableData.value.reduce<OperateLists>((acc, item) => {
const { originalData, id, status, flag, bkcolor, ...restData } = item;
const submitData = { ...restData, bkcolor: classCom.convertHexToNumber(bkcolor) };
if (status) {
flag ? acc.addList.push(submitData) : acc.updateList.push(submitData);
}
return acc;
}, { addList: [], updateList: [] });
console.log('新增列表:', addList);
console.log('更新列表:', updateList);
if (addList.length > 0) {
feeitemclassAdd(addList).then((res: any) => {
if (res.code == 0) {
ElMessage.success(res.msg);
getList()
}
})
}
if (updateList.length > 0) {
feeitemclassUpdate(updateList).then((res: any) => {
if (res.code == 0) {
ElMessage.success(res.msg);
getList()
}
})
}
}
// 单元格样式
const cellClassName = ({ row, column }: { row: any, column: any }) => {
return isEditing(row, column.property)
? 'cell-editing'
: 'cell-editable';
};
// 新增项
const addNewItem = () => {
// 生成临时ID
const newId = Array.from({ length: 4 }, () => Math.floor(Math.random() * 10)).join('');
tableData.value.unshift({
id: newId,
sflbdh: `NEW${newId}`,
sflbmc: 'test',
formData.value.sflbdh = `NEW${newId}`;
};
// 打开编辑弹窗
const openEditDialog = (row: tableDataItem) => {
isAdd.value = false;
dialogTitle.value = '编辑类别';
resetForm(); // 重置表单
// 复制行数据到表单
formData.value = { ...row };
dialogVisible.value = true;
};
// 重置表单
const resetForm = () => {
if (formRef.value) {
formRef.value.resetFields();
}
formData.value = {
id: '',
sflbdh: '',
sflbmc: '',
sflbjc: '',
txmlb: '',
yblx: '',
@ -459,15 +321,45 @@ const addNewItem = () => {
lisgroup2: '',
kn: '0',
xpy: '0',
bkcolor: '#FFFFFF',
originalData: {},
flag: true,
status: true
});
// ElMessage.info('已添加新类别，请完善信息');
bkcolor: '#FFFFFF'
};
};
// 提交表单
const submitForm = () => {
formRef.value.validate((valid: boolean) => {
if (!valid) return;
// 处理颜色格式转换
const submitData = {
...formData.value,
bkcolor: classCom.convertHexToNumber(formData.value.bkcolor)
};
if (isAdd.value) {
// 新增逻辑
feeitemclassAdd([submitData]).then((res: any) => {
if (res.code == 0) {
ElMessage.success(res.msg);
dialogVisible.value = false;
getList();
}
});
} else {
// 编辑逻辑
feeitemclassUpdate([submitData]).then((res: any) => {
if (res.code == 0) {
ElMessage.success(res.msg);
dialogVisible.value = false;
getList();
}
});
}
});
};
// 删除项
const handleDelete = (row: any) => {
const handleDelete = (row: tableDataItem) => {
ElMessageBox.confirm(
`确定删除该${row.sflbdh}吗？`, "提示",
{
@ -475,147 +367,62 @@ const handleDelete = (row: any) => {
cancelButtonText: '取消',
type: 'warning',
}
)
.then(() => {
feeitemclassDel({ sflbdh: row.sflbdh }).then((res: any) => {
if (res.code == 0) {
getList()
ElMessage.success('删除成功');
}
})
})
.catch(() => {
})
).then(() => {
feeitemclassDel({ sflbdh: row.sflbdh }).then((res: any) => {
if (res.code == 0) {
getList();
ElMessage.success('删除成功');
}
});
}).catch(() => { });
};
// 刷新列表
const handleQuery = () => {
pageNum.value = 1
getList()
}
pageNum.value = 1;
getList();
};
// 获取列表数据
const getList = () => {
feeitemclassList({ pageSize: pageSize.value, pageNum: pageNum.value }).then((res: any) => {
if (res.code == 200) {
tableData.value = res.rows
total.value = res.total
tableData.value.forEach((item: any) => {
item.originalData = {}
item.id = item.sflbdh
item.status = false
item.bkcolor = classCom.decimalToHexColor(item.bkcolor)
})
tableData.value = res.rows;
total.value = res.total;
tableData.value.forEach((item) => {
item.id = item.sflbdh;
item.bkcolor = classCom.decimalToHexColor(item.bkcolor);
});
}
})
}
});
};
// 获取报告规则
const getRules = () => {
rptgetrules().then((res: any) => {
reportRuleOptions.value = res.data
})
}
getList()
getRules()
reportRuleOptions.value = res.data;
});
};
interface DictData {
BT?: Array<any>;
LISGROUP1?: Array<any>;
LISGROUP2?: Array<any>;
[key: string]: any[] | undefined; // 添加索引签名以支持动态访问
}
// 字典数据存储
const dictData = ref<DictData>({});
// 初始化
onMounted(async () => {
// 加载病人来源字典
const dictRefs = await comDict('BT', 'LISGROUP1', 'LISGROUP2');
getList();
getRules();
// 从 ref 中获取实际数据
// 加载字典数据
const dictRefs = await comDict('BT', 'LISGROUP1', 'LISGROUP2');
dictData.value = {
BT: toRaw(dictRefs.BT.value) || [],
LISGROUP1: toRaw(dictRefs.LISGROUP1.value) || [],
LISGROUP2: toRaw(dictRefs.LISGROUP2.value) || [],
};
})
// 字典格式化方法
const formatDict = (v: string, dictType: string) => {
return dictData.value[dictType]?.find((item: any) => item.value == v)?.label || v;
};
});
</script>
<style scoped>
/* 保持与之前相同的样式 */
.editable-table-wrapper {
padding: 20px;
max-width: 1800px;
margin: 0 auto;
}
.table-header {
/* display: flex;
justify-content: space-between;
align-items: center; */
margin-bottom: 15px;
padding-bottom: 10px;
border-bottom: 1px solid #eee;
}
.table-header h3 {
margin: 0;
color: #333;
font-size: 18px;
}
.add-btn {
margin-bottom: 5px;
}
.table-desc {
margin-top: 15px;
padding: 10px 15px;
background-color: #f5f7fa;
border-radius: 4px;
font-size: 14px;
color: #666;
}
/* 单元格样式优化 */
::v-deep .cell-editable {
cursor: pointer;
transition: background-color 0.2s;
}
::v-deep .cell-editable:hover {
background-color: #f0f7ff !important;
}
::v-deep .cell-editing {
background-color: #e6f7ff !important;
}
::v-deep .el-table .el-table__cell {
padding: 6px 0;
}
/* 输入控件样式 */
::v-deep .el-input,
::v-deep .el-input-number,
::v-deep .el-select,
::v-deep .el-color-picker,
::v-deep .el-textarea {
width: 90%;
margin: 0 auto;
}
::v-deep .el-textarea__inner {
min-height: 60px;
resize: vertical;
padding-bottom: 5px;
}
/* 多行文本和颜色显示样式 */
@ -649,4 +456,4 @@ const formatDict = (v: string, dictType: string) => {
overflow: hidden;
text-overflow: ellipsis;
}
</style>
</style>

35
src/views/mzcx/category/index.vue
View File

@ -4,7 +4,7 @@
<div class="left_box">
<el-input v-model="leftSearchValue" placeholder="请输入类别名称或代号" class="mb10" />
<el-table :data="filteredLeftTableData" @row-click="handleLeftRowClick" highlight-current-row border
:row-style="cellStyle" height="80vh" style="width: 100%;">
:cell-style="cellStyle" height="95%" style="width: 100%;">
<el-table-column prop="sflbdh" label="分单类别代号" width="110" />
<el-table-column prop="sflbmc" label="类别名称" />
</el-table>
@ -12,7 +12,8 @@
<!-- 中间表格 -->
<div class="m_box">
<el-input v-model="middleSearchValue" placeholder="请输入项目名称或代号" class="mb10" />
<el-input v-model="middleSearchValue" placeholder="请输入项目名称或代号" />
<div class="tips">* 双击行可将项目移入右侧表格</div>
<el-table :data="filteredMiddleTableData" @row-dblclick="handleMiddleRowDblClick" highlight-current-row
style="width: 100%;" height="80vh" border>
<el-table-column prop="sfxmdh" label="项目代号" />
@ -22,7 +23,8 @@
<!-- 右侧表格 -->
<div class="right_box">
<el-input v-model="rightSearchValue" placeholder="请输入项目名称、代号或助记符" class="mb10" />
<el-input v-model="rightSearchValue" placeholder="请输入项目名称、代号或助记符" />
<div class="tips">* 双击行可将项目移入中间表格</div>
<el-table :data="filteredRightTableData" @row-dblclick="handleRightRowDblClick" highlight-current-row
height="80vh" border style="width: 100%;">
<el-table-column prop="sfxmdh" label="门诊项目代号" />
@ -151,12 +153,15 @@ const cellStyle = ({ row, column, rowIndex, columnIndex }: {
rowIndex: number;
columnIndex: number;
}) => {
const bgColor = classCom.decimalToHexColor(row.bkcolor);
const textColor = classCom.getContrastTextColor(bgColor);
return {
backgroundColor: `${bgColor} !important`,
color: '#000',
};
if (column.label == "类别名称") {
const bgColor = classCom.decimalToHexColor(row.bkcolor);
const textColor = classCom.getContrastTextColor(bgColor);
return {
backgroundColor: `${bgColor} !important`,
color: textColor,
};
}
}
</script>
@ -171,18 +176,24 @@ const cellStyle = ({ row, column, rowIndex, columnIndex }: {
.left_box {
width: 20%;
padding: 10px;
background-color: rgb(214, 240, 252);
background-color: #e8f1f5;
}
.m_box {
width: 30%;
padding: 10px;
background-color: rgb(214, 240, 252);
background-color: #e8f1f5;
}
.right_box {
width: 49%;
padding: 10px;
background-color: rgb(214, 240, 252);
background-color: #e8f1f5;
}
.tips {
font-size: 14px;
color: #1f6dd3;
margin: 5px 0;
}
</style>

902
src/views/mzcx/charge/index.vue
View File

File diff suppressed because it is too large Load Diff

21
src/views/mzcx/cydj/components/OutPatList.vue
View File

@ -3,25 +3,24 @@
<el-button @click="handleClick">查询病人</el-button>
<!-- 病人选择弹窗 -->
<el-dialog v-model="dialogVisible" :title="props.dialogTitle" width="500px" @close="handleDialogClose">
<el-input v-model="searchKey" placeholder="搜索（支持姓名、病人ID、简拼）..." class="mb-4" clearable @clear="filteredPatData"
<el-dialog v-model="dialogVisible" :title="props.dialogTitle" width="40vw" @close="handleDialogClose">
<el-input v-model="searchKey" placeholder="搜索（支持姓名、病人ID、简拼）..." class="mb10" clearable @clear="filteredPatData"
@input="filteredPatData" @keyup.down="navigateTable('down')" @keyup.up="navigateTable('up')"
@keyup.enter="selectActiveItem" />
<el-table :data="filteredPatData" height="300px" border @row-click="selectItem" @row-dblclick="selectItem"
class="compact-form my-table">
<el-table :data="filteredPatData" height="300px" border @row-click="selectItem" @row-dblclick="selectItem">
<template #empty>
<div v-if="isPatLoading">加载中...</div>
<div v-else>没有匹配的病人数据</div>
</template>
<el-table-column prop="pid" label="病人ID" width="100" show-overflow-tooltip />
<el-table-column prop="name" label="姓名" width="100" show-overflow-tooltip />
<el-table-column prop="xb" label="性别" width="80" show-overflow-tooltip />
<el-table-column prop="nl" label="年龄" width="80" show-overflow-tooltip />
<el-table-column prop="ks" label="科室" width="100" show-overflow-tooltip />
<el-table-column prop="ch" label="床号" width="80" show-overflow-tooltip />
<el-table-column prop="pinyin" label="简拼" width="150" show-overflow-tooltip />
<el-table-column prop="pid" label="病人ID" show-overflow-tooltip />
<el-table-column prop="name" label="姓名" show-overflow-tooltip />
<el-table-column prop="xb" label="性别" show-overflow-tooltip />
<el-table-column prop="nl" label="年龄" show-overflow-tooltip />
<el-table-column prop="ks" label="科室" show-overflow-tooltip />
<el-table-column prop="ch" label="床号" show-overflow-tooltip />
<el-table-column prop="pinyin" label="简拼" show-overflow-tooltip />
</el-table>
</el-dialog>
</div>

346
src/views/mzcx/cydj/index.vue
View File

@ -1,72 +1,66 @@
<template>
<div class="app-container">
<!-- <el-row :gutter="5" class="compact-form"> -->
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-position="left">
<el-col :span="24" :xs="24">
<el-form-item label="" label-width="0px" prop="brdh">
<!-- 搜索区域 -->
<div class="query-form">
<el-form :model="queryParams" ref="queryRef" inline>
<el-col :span="6">
<div> 就诊卡号/病历号/磁卡号: </div>
<el-input v-model="queryParams.brdh" placeholder="就诊卡号/病历号/磁卡号" clearable @keyup.enter="handleQuery" />
</el-col>
<el-col :span="2">
<el-radio-group v-model="queryParams.zt" size="default">
<el-radio v-for="(item, index) in showconfirmOptions" :key="index" :label="item.value"
:disabled="item.disabled">{{ item.label }}</el-radio>
</el-radio-group>
</el-col>
<el-col :span="1">
<div> 申请获取期限: </div>
</el-col>
<el-col :span="6">
<el-radio-group v-model="queryParams.subday" size="default">
<el-radio v-for="(item, index) in subdayOptions" :key="index" :label="item.value"
:disabled="item.disabled">{{ item.label }}</el-radio>
</el-radio-group>
</el-col>
<el-col :span="2">
<el-select v-model="queryParams.cardtype" placeholder="卡类型" clearable :style="{ width: '100%' }">
<el-option v-for="(item, index) in cardtypeOptions" :key="index" :label="item.label" :value="item.value"
:disabled="item.disabled"></el-option>
</el-select>
</el-col>
<el-col :span="1.5">
<el-button type="primary" icon="Search" @click="readCard">读卡</el-button>
</el-col>
<el-col :span="1.5">
<PatSearchDialog @select="handlePatientSelect" />
</el-col>
<el-form-item label="就诊卡/病历/磁卡：" prop="brdh">
<el-input v-model="queryParams.brdh" placeholder="" clearable @keyup.enter="handleQuery"
style="width: 180px;" />
</el-form-item>
</el-col>
</el-form>
<!-- </el-row> -->
<el-row :gutter="5" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="Search" @click="handleQuery"
v-hasPermi="['system:reqmain:Search']">查询</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Printer" :disabled="single" @click="printAll"
v-hasPermi="['system:reqmain:add']">打印</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Printer" :disabled="single" @click="printSigne"
v-hasPermi="['system:reqmain:edit']">单打条码</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Printer" :disabled="freesingle" @click="printBack"
v-hasPermi="['system:reqmain:edit']">单打回单</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="Delete" @click="cancel"
v-hasPermi="['system:reqmain:export']">取消采样</el-button>
</el-col>
</el-row>
<el-row :gutter="5" class="table-container">
<el-table ref="tableRef" class="compact-form my-table" :data="reqmainList"
@selection-change="handleSelectionChange" @select="handleSelect" height="100%" :cell-style="tableCellStyle">
<!-- 状态选择 -->
<el-form-item label="状态：">
<el-select v-model="queryParams.zt" placeholder="请选择状态" clearable style="width: 120px">
<el-option v-for="(item, index) in showconfirmOptions" :key="index" :label="item.label" :value="item.value"
:disabled="item.disabled"></el-option>
</el-select>
</el-form-item>
<!-- 申请获取期限 -->
<el-form-item label="申请获取期限：" class="subday-form-item">
<div class="radiosud">
<el-radio-group v-model="queryParams.subday">
<el-radio v-for="(item, index) in subdayOptions" :key="index" :label="item.value"
:disabled="item.disabled">
{{ item.label }}
</el-radio>
</el-radio-group>
</div>
</el-form-item>
<!-- 卡类型选择 -->
<el-form-item label="">
<el-select v-model="queryParams.cardtype" placeholder="卡类型" clearable style="width: 120px">
<el-option v-for="(item, index) in cardtypeOptions" :key="index" :label="item.label" :value="item.value"
:disabled="item.disabled"></el-option>
</el-select>
<el-button type="primary" icon="Search" @click="readCard" style="margin:0 8px;">读卡</el-button>
<PatSearchDialog @select="handlePatientSelect" />
</el-form-item>
</el-form>
</div>
<!-- 功能按钮区域 - 单独一行 -->
<div class="operation-btns">
<el-button type="primary" icon="Search" @click="handleQuery">查询</el-button>
<el-button type="warning" plain icon="Printer" :disabled="single" @click="printAll">打印</el-button>
<el-button type="warning" plain icon="Printer" :disabled="single" @click="printSigne">单打条码</el-button>
<el-button type="warning" plain icon="Printer" :disabled="freesingle" @click="printBack">单打回单</el-button>
<el-button type="danger" plain :disabled="single" @click="cancel">取消采样</el-button>
</div>
<!-- 表格区域 -->
<div class="table-main">
<el-table ref="tableRef" :data="reqmainList" border @selection-change="handleSelectionChange"
@select="handleSelect" height="100%" :cell-style="tableCellStyle">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="项目名称" align="center" prop="sqxmmc" width="200" show-overflow-tooltip />
<el-table-column label="项目代码" align="center" prop="sqxmdh" width="100" show-overflow-tooltip />
@ -86,8 +80,7 @@
<el-table-column label="状态" align="center" prop="zt" show-overflow-tooltip />
<el-table-column label="计价" align="center" prop="jjzt">
<template #default="scope">
<el-checkbox :model-value="scope.row.jjzt === '1'" disabled>
</el-checkbox>
<el-checkbox :model-value="scope.row.jjzt === '1'" disabled></el-checkbox>
</template>
</el-table-column>
<el-table-column label="病人代号" align="center" prop="brdh" show-overflow-tooltip />
@ -114,7 +107,8 @@
</template>
</el-table-column>
</el-table>
</el-row>
</div>
<!-- 汇总行 -->
<div class="table-summary">
<div class="summary-item">
@ -130,7 +124,6 @@
<span class="summary-value">{{ totalPrice.toFixed(2) }}</span>
</div>
</div>
</div>
</template>
@ -143,6 +136,7 @@ import {
} from "@/api/mzcx/cydj.js";
import PatSearchDialog from './components/OutPatList.vue'
import { classCom } from '@/utils/classCom';
import { ElMessage } from "element-plus";
const comDict = inject('comDict');
// 字典数据存储
const dictData = ref({});
@ -208,7 +202,6 @@ const handleSelect = (selection, row, selected) => {
// 如果有需要自动勾选的行，才开启标志位
if (rowsToSelect.length > 0) {
rowsToSelect.forEach(item => {
tableRef.value.toggleRowSelection(item, selected);
isAutoSelect.value = true;
@ -216,6 +209,7 @@ const handleSelect = (selection, row, selected) => {
setTimeout(() => isAutoSelect.value = false, 0);
}
};
// 字典格式化方法
const formatDict = (dictType) => {
return (row, column, value) => {
@ -223,6 +217,7 @@ const formatDict = (dictType) => {
return dictData.value[dictType].find(item => String(item.value) === String(value).trim())?.label || value;
};
};
// 定义“空数据”的判断函数
const isEmptyData = (data) => {
// 处理 null/undefined
@ -235,6 +230,7 @@ const isEmptyData = (data) => {
if (typeof data === 'string' && data.trim() === '') return true;
return false;
};
/**
* 获取指定天数偏移后的日期时间字符串
* @param {number} days 偏移天数（正数表示未来，负数表示过去）
@ -248,34 +244,30 @@ function getDateOffset(days) {
const year = targetDate.getFullYear();
const month = String(targetDate.getMonth() + 1).padStart(2, '0');
const day = String(targetDate.getDate()).padStart(2, '0');
// const hours = String(targetDate.getHours()).padStart(2, '0');
// const minutes = String(targetDate.getMinutes()).padStart(2, '0');
//const seconds = String(targetDate.getSeconds()).padStart(2, '0');
// return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
return `${year}-${month}-${day} 00:00:00`;
}
function getSubday() {
const days = 0 - queryParams.value.subday;
queryParams.value.stime = getDateOffset(days);
queryParams.value.etime = getDateOffset(1);
}
/** 查询采样登记列表 */
function getList() {
freesingle.value = true;
if (isEmptyData(queryParams.value.brdh)) proxy.$modal.alert("请刷卡或输入门诊号!");
if (isEmptyData(queryParams.value.brdh)) ElMessage.warning("请刷卡或输入门诊号!");
else {
loading.value = true;
getSubday();
querySQD(queryParams.value).then(response => {
if (isEmptyData(response.data)) proxy.$modal.alert("没有检索的数据!");
reqmainList.value = response.data;
// console.log('response:', response.data);
loading.value = false;
single.value = false;
// 新增：数据加载完成后触发全选
// 延迟执行（确保DOM已更新）
setTimeout(() => {
if (tableRef.value) {
if (tableRef.value && reqmainList.value.length > 0) {
single.value = false;
tableRef.value.toggleAllSelection(); // 调用全选方法
}
}, 0);
@ -289,65 +281,17 @@ function cancel() {
// reset();
}
// 表单重置
function reset() {
form.value = {
sqh: null,
xh: null,
sqxmdh: null,
sqxmmc: null,
sl: null,
dj: null,
detailZT: null,
detailJJZT: null,
ksdh: null,
sqys: null,
sqsj: null,
jsys: null,
jssj: null,
brly: null,
brdh: null,
brxm: null,
zt: null,
jjzt: null,
brxb: null,
brsr: null,
jzbz: null,
cp_xmlb: null,
cp_color: null,
cp_cflag: null,
detailBZ1: null,
ch: null,
detailBZ2: null,
bz1: null,
bz2: null,
bz3: null,
yblx: null,
zxys: null,
zxsj: null,
bgddh: null,
nl: null,
nldw: null,
zd: null,
cysj: null
};
freesingle.value = false;
single.value = false;
proxy.resetForm("reqmainRef");
}
/** 搜索按钮操作 */
function handleQuery() {
getList();
}
function readCard() {
//getList();
}
// 处理病人选择事件
const handlePatientSelect = (patient) => {
// console.log('选中的病人:', patient);
queryParams.value.brdh = patient
// 处理选中的病人数据
handleQuery();
@ -360,13 +304,12 @@ function handleSelectionChange(selection) {
ids.value = selection.map(item => item.sqh);
}
/** 打印选择 */
function printAll(row) {
printSigne();
printBack();
}
/** 单打条码*/
function printSigne(row) {
if (idsnew.value.length === 0) {
@ -380,13 +323,11 @@ function printSigne(row) {
});
}
/** 打印回单 */
function printBack(row) {
if (idsnew.value.length === 0) {
return;
}
//console.log('idsnew:', idsnew.value)
printBackpaper(idsnew.value).then(response => {
proxy.$modal.msgSuccess("打印成功");
open.value = false;
@ -394,7 +335,6 @@ function printBack(row) {
});
}
const totalRows = computed(() => {
return reqmainList.value.length || 0;
});
@ -406,7 +346,6 @@ const totalPrice = computed(() => {
}, 0);
});
// 组件挂载时加载字典
onMounted(async () => {
// 加载病人来源字典
@ -422,8 +361,6 @@ onMounted(async () => {
};
});
// 表格单元格样式（仅作用于“项目类别”列）
const tableCellStyle = ({ row, column }) => {
// 只对“项目类别”列生效
@ -442,8 +379,6 @@ const tableCellStyle = ({ row, column }) => {
}
return {}; // 其他列保持默认样式
};
</script>
<style scoped lang="scss">
@ -451,110 +386,61 @@ const tableCellStyle = ({ row, column }) => {
display: flex;
flex-direction: column;
height: 90vh;
/* 容器高度等于窗口高度 */
overflow: hidden;
padding: 16px;
box-sizing: border-box;
}
.compact-form {
height: 75px;
/* 固定高度 */
.el-form-item {
margin-bottom: 8px;
}
.mb8 {
height: 30px;
/* 固定高度 */
.subday-form-item {
display: inline-flex;
align-items: center;
justify-content: center; // 整体水平居中
.radiosud {
width: 300px;
}
}
.table-summary {
height: 10px;
/* 固定高度 */
// 操作按钮区域样式
.operation-btns {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 12px;
background: #fff;
border-radius: 4px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.04);
margin-bottom: 10px;
}
.table-container {
// 表格容器样式
.table-main {
flex: 1;
/* 占满剩余高度 */
overflow: hidden;
/* 避免表格超出容器 */
}
.compact-form .el-form-item {
padding: 5px;
margin-bottom: 5px;
}
.compact-form .el-form-item__label {
padding-bottom: 0px;
}
::v-deep .my-table .el-table__row td {
padding: 1px 0;
/* 减小行高 */
}
::v-deep .my-table .el-table__header-wrapper th {
padding: 6px 0;
/* 表头内边距 */
background-color: #b3d8ff !important;
/* 表头背景色（保留之前的设置） */
color: #333;
/* 文字颜色加深，提升可读性 */
font-weight: 500;
/* 文字加粗 */
}
::v-deep .my-table .el-table__cell {
padding: 0 2px;
/* 减小列间距 */
}
/* 可选：调整表格整体样式 */
::v-deep .my-table {
font-size: 13px;
/* 适当减小字体 */
}
::v-deep .my-table .el-table__cell,
::v-deep .my-table .el-table__header-wrapper th {
border-width: 1px;
border-color: #ebeef5;
}
.card-content {
max-height: 450px;
/* 设置最大高度 */
overflow-y: auto;
/* 超出高度时显示垂直滚动条 */
padding: 5px;
/* 保持与卡片默认一致的内边距 */
}
.clickable:hover {
cursor: pointer;
/* 鼠标悬停时显示手型 */
transition: all 0.3s;
/* 平滑过渡效果 */
color: blue;
}
/* 汇总行样式 */
// 汇总行样式
.table-summary {
display: flex;
align-items: center;
justify-content: flex-start;
padding: 6px 16px;
margin-top: 8px;
padding: 5px;
margin-top: 10px;
background-color: #f5f7fa;
border: 1px solid #ebeef5;
border-radius: 4px;
font-weight: 500;
line-height: 24px;
/* 汇总行文字行高 */
.summary-item {
display: flex;
align-items: center;
margin-left: 24px;
margin-right: 32px;
.summary-label {
color: #606266;
@ -568,13 +454,33 @@ const tableCellStyle = ({ row, column }) => {
/* 核心：数值左对齐 */
}
/* 单独设置"单价合计"的值为红色 */
// 单独设置"合计金额"的值为红色
&:nth-child(3) .summary-value {
color: #f56c6c;
/* Element UI 红色主题色 */
// Element UI 红色主题色
font-weight: 600;
/* 可选：加粗字体 */
// 可选：加粗字体
}
}
}
</style>
// 响应式适配
@media (max-width: 768px) {
.operation-btns {
flex-wrap: wrap;
.el-button {
margin-bottom: 8px;
}
}
.table-summary {
flex-wrap: wrap;
.summary-item {
margin-bottom: 8px;
margin-right: 16px;
}
}
}
</style>

731
src/views/mzcx/reportRules/index.vue
View File

@ -1,110 +1,104 @@
<template>
<div class="rule-management-container">
<!-- 顶部操作栏 -->
<div class="mb20">
<el-button type="primary" icon="Search" @click="handleQuery"> 查询</el-button>
<el-button type="success" icon="Plus" @click="addgz">新增</el-button>
<el-button type="primary" icon="Select" @click="saveHandle">保存</el-button>
<!-- :disabled="flag" -->
<el-button icon="Plus" @click="addDetail">新增明细</el-button>
<div class="mb5">
<el-button type="primary" icon="Refresh" @click="handleQuery">刷新</el-button>
<el-button type="primary" plain icon="Plus" @click="openAddRuleDialog">新增</el-button>
</div>
<!-- 左右分栏区域 -->
<div class="content-wrapper">
<!-- 左侧表格 -->
<div class="left-table-area">
<el-table :data="ruleList" @row-click="handleRowClick" border style="width: 100%" highlight-current-row
class="custom-table">
<el-table-column prop="bglqdh" label="规则代号" width="100" />
<el-table-column prop="bglqmc" label="规则名称" width="200" />
<el-table-column prop="bz" label="备注" />
<el-table-column label="操作" align="center" fixed="right" width="100">
<template #default="scope">
<el-button text type="danger" @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- 右侧表单与明细表格 -->
<div class="right-form-area">
<el-form :model="currentRule" label-width="80px" class="rule-form">
<el-form-item label="规则代号">
<el-input v-model="currentRule.bglqdh" disabled />
</el-form-item>
<el-form-item label="规则名称">
<el-input v-model="currentRule.bglqmc" @blur="editHandle(currentRule, 'bglqmc')"
@keyup.enter="editHandle(currentRule, 'bglqmc')" />
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="currentRule.bz" :rows="2" @blur="editHandle(currentRule, 'bz')"
@keyup.enter="editHandle(currentRule, 'bz')" />
</el-form-item>
</el-form>
<div class="detail-table-header">
<span>规则明细</span>
</div>
<el-table :data="detailList" border style="width: 100%;" class="detail-table" :cell-class-name="cellClassName"
height="48vh">
<el-table-column prop="weekday" label="起始日期" width="100">
<template #default="scope">
<el-select v-model="scope.row.weekday" class="full-width-input" placeholder="选择星期" size="small"
@change="handleDetailChange(scope.row)">
<el-option v-for="day in weekDays" :key="day.value" :label="day.label" :value="day.value" />
</el-select>
</template>
</el-table-column>
<el-table-column prop="weekday1" label="截止日期" width="100">
<template #default="scope">
<el-select v-model="scope.row.weekday1" placeholder="选择星期" size="small" class="full-width-input"
@change="handleDetailChange(scope.row)">
<el-option v-for="day in weekDays" :key="day.value" :label="day.label" :value="day.value" />
</el-select>
</template>
</el-table-column>
<el-table-column prop="kssj" label="起始时间" width="100">
<template #default="scope">
<el-input v-model="scope.row.kssj" placeholder="HH:mm" size="small"
@input="handleTimeInput(scope.row, 'kssj')" maxlength="5" class="full-width-input"
@focus="handleInputFocus" @blur="handleInputBlur(scope.row, 'kssj')" />
</template>
</el-table-column>
<el-table-column prop="jssj" label="截止时间" width="100">
<template #default="scope">
<el-input v-model="scope.row.jssj" placeholder="HH:mm" size="small"
@input="handleTimeInput(scope.row, 'jssj')" maxlength="5" class="full-width-input"
@focus="handleInputFocus" @blur="handleInputBlur(scope.row, 'jssj')" />
</template>
</el-table-column>
<el-table-column prop="bglqsm" label="报告领取声明">
<template #default="scope">
<el-input v-model="scope.row.bglqsm" size="small" class="full-width-input" @focus="handleInputFocus" />
</template>
</el-table-column>
<el-table-column prop="bgxss" label="所需小时数" width="100">
<template #default="scope">
<el-input v-model="scope.row.bgxss" placeholder="0" size="small"
@input="handleNumberInput(scope.row, 'bgxss')" class="full-width-input" @focus="handleInputFocus" />
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="100">
<template #default="scope">
<el-button type="danger" text @click="delDetail(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="left-table-area">
<el-table :data="ruleList" border style="width: 100%" highlight-current-row show-overflow-tooltip height="100%">
<el-table-column prop="bglqdh" label="规则代号" width="100" align="center" />
<el-table-column prop="bglqmc" label="规则名称" width="300" />
<el-table-column prop="bz" label="备注" />
<el-table-column label="操作" align="center" fixed="right" width="160">
<template #default="scope">
<el-button link type="primary" icon="Edit" @click="openEditRuleDialog(scope.row)">编辑</el-button>
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<!-- 新增/编辑规则弹窗 -->
<el-dialog v-model="ruleDialogVisible" :title="isAddRule ? '新增规则' : '编辑规则'" width="800px" @close="resetRuleForm"
:close-on-click-modal="false" :draggable="true">
<el-form :model="ruleForm" label-width="80px" class="rule-form" ref="ruleFormRef">
<el-form-item label="规则代号" prop="bglqdh" :rules="[{ required: true, message: '请输入规则代号', trigger: 'blur' }]">
<el-input v-model="ruleForm.bglqdh" :disabled="!isAddRule" />
</el-form-item>
<el-form-item label="规则名称" prop="bglqmc" :rules="[{ required: true, message: '请输入规则名称', trigger: 'blur' }]">
<el-input v-model="ruleForm.bglqmc" />
</el-form-item>
<el-form-item label="备注" prop="bz">
<el-input type="textarea" v-model="ruleForm.bz" :rows="3" />
</el-form-item>
</el-form>
<div class="detail-table-header">
<span>规则明细</span>
<el-button type="primary" icon="Plus" @click="addDetailToForm">新增明细</el-button>
</div>
<el-table :data="detailFormList" border style="width: 100%;" class="detail-table" height="300px">
<el-table-column prop="weekday" label="起始日期" width="100">
<template #default="scope">
<el-select v-model="scope.row.weekday" class="full-width-input" placeholder="选择星期" size="small">
<el-option v-for="day in weekDays" :key="day.value" :label="day.label" :value="day.value" />
</el-select>
</template>
</el-table-column>
<el-table-column prop="weekday1" label="截止日期" width="100">
<template #default="scope">
<el-select v-model="scope.row.weekday1" placeholder="选择星期" size="small" class="full-width-input">
<el-option v-for="day in weekDays" :key="day.value" :label="day.label" :value="day.value" />
</el-select>
</template>
</el-table-column>
<el-table-column prop="kssj" label="起始时间" width="100">
<template #default="scope">
<el-input v-model="scope.row.kssj" placeholder="HH:mm" size="small"
@input="handleTimeInput(scope.row, 'kssj')" maxlength="5" class="full-width-input"
@blur="handleInputBlur(scope.row, 'kssj')" />
</template>
</el-table-column>
<el-table-column prop="jssj" label="截止时间" width="100">
<template #default="scope">
<el-input v-model="scope.row.jssj" placeholder="HH:mm" size="small"
@input="handleTimeInput(scope.row, 'jssj')" maxlength="5" class="full-width-input"
@blur="handleInputBlur(scope.row, 'jssj')" />
</template>
</el-table-column>
<el-table-column prop="bglqsm" label="报告领取声明">
<template #default="scope">
<el-input v-model="scope.row.bglqsm" size="small" class="full-width-input" />
</template>
</el-table-column>
<el-table-column prop="bgxss" label="所需小时数" width="100">
<template #default="scope">
<el-input v-model="scope.row.bgxss" placeholder="0" size="small"
@input="handleNumberInput(scope.row, 'bgxss')" class="full-width-input" />
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="80">
<template #default="scope">
<el-button type="primary" link icon="delete" @click="delDetailFromForm(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<template #footer>
<el-button @click="ruleDialogVisible = false">取消</el-button>
<el-button type="primary" @click="saveRule">保存</el-button>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted, computed } from 'vue'
import { ElMessageBox, ElMessage, FormInstance, FormRules } from 'element-plus'
import { rptgetruleList, rptgetruleadd, rptgetruleUpdate, rptgetruleDel, rptgetruleDetail, rptgetruleDelDetail } from '@/api/mzcx/index';
import { ElMessageBox, ElMessage } from 'element-plus'
// 星期选项数据
const weekDays = [
{ label: '周一', value: '1' },
@ -115,6 +109,8 @@ const weekDays = [
{ label: '周六', value: '6' },
{ label: '周日', value: '7' }
]
// 规则列表数据
interface Rule {
bglqdh: number,
bglqmc: string,
@ -123,15 +119,21 @@ interface Rule {
originalData: object,
addFlag: boolean
}
// 模拟规则列表数据
const ruleList = ref<Rule[]>([])
// 当前选中的规则数据
const currentRule = ref({
bglqdh: 1,
// 弹窗相关
const ruleDialogVisible = ref(false)
const isAddRule = ref(true) // 区分新增/编辑规则
const ruleFormRef = ref<FormInstance>()
// 规则表单
const ruleForm = ref({
bglqdh: 0,
bglqmc: '',
bz: '',
bz: ''
})
// 明细表单列表
interface Detail {
weekday: string,
weekday1: string,
@ -141,39 +143,198 @@ interface Detail {
bgxss: number,
bglqdh: number,
xh: number,
detaiFlag: boolean
status: boolean // 新增：标识明细是否被修改
detaiFlag: boolean,
status: boolean
}
const detailList = ref<Detail[]>([])
const rptgetruledetail = ref<Detail[]>([])
// 是否正在编辑输入框
const isEditing = ref(false)
const detailFormList = ref<Detail[]>([])
// 查询规则列表
const handleQuery = () => {
getList()
}
// 获取规则列表
const getList = () => {
rptgetruleList().then((res: any) => {
if (res.code == 0) {
ruleList.value = res.data
ruleList.value.forEach((item: any) => {
item.originalData = {}
item.status = false
})
}
})
}
// 打开新增规则弹窗
const openAddRuleDialog = () => {
isAddRule.value = true
ruleDialogVisible.value = true
// 重置表单
resetRuleForm()
// 生成新的规则代号
const maxDh = Math.max(...ruleList.value.map(item => item.bglqdh), 0) + 1
ruleForm.value.bglqdh = maxDh
// 清空明细列表
detailFormList.value = []
}
// 打开编辑规则弹窗
const openEditRuleDialog = (row: Rule) => {
isAddRule.value = false
ruleDialogVisible.value = true
// 填充规则表单
ruleForm.value = { ...row }
// 获取该规则的明细数据
getDetailList(row.bglqdh)
}
// 获取明细列表
const getDetailList = (bglqdh: number) => {
rptgetruleDetail({ bglqdh }).then((res: any) => {
if (res.code == 0) {
detailFormList.value = res.data.map((item: Detail, index: number) => ({
...item,
xh: index + 1
}))
}
})
}
// 重置规则表单
const resetRuleForm = () => {
if (ruleFormRef.value) {
ruleFormRef.value.resetFields()
}
detailFormList.value = []
}
// 新增明细到表单
const addDetailToForm = () => {
const newDetail: Detail = {
bglqdh: ruleForm.value.bglqdh,
weekday: '1',
weekday1: '2',
kssj: '09:00',
jssj: '18:00',
bglqsm: '领取声明',
bgxss: 1,
xh: detailFormList.value.length + 1,
detaiFlag: true,
status: false
}
detailFormList.value.push(newDetail)
}
// 从表单删除明细
const delDetailFromForm = (row: Detail) => {
ElMessageBox.confirm(
'确定删除该项明细吗？', "提示",
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
).then(() => {
// 如果是已存在的明细，调用删除接口
if (!row.detaiFlag) {
rptgetruleDelDetail({ bglqdh: row.bglqdh, xh: row.xh }).then((res: any) => {
if (res.code == 0) {
ElMessage.success('明细删除成功');
}
})
}
// 从列表移除
detailFormList.value = detailFormList.value.filter(item => item.xh !== row.xh)
// 重新排序序号
detailFormList.value.forEach((item, index) => {
item.xh = index + 1
})
})
}
// 保存规则
const saveRule = () => {
if (!ruleFormRef.value) return
ruleFormRef.value.validate((valid) => {
if (!valid) return
// 构造提交数据
const ruleData = {
ruleList: [{ ...ruleForm.value, addFlag: isAddRule.value, status: true }],
ruleDetailList: detailFormList.value
}
// 新增规则
if (isAddRule.value) {
rptgetruleadd(ruleData).then((res: any) => {
if (res.code == 0) {
ElMessage.success('规则新增成功');
ruleDialogVisible.value = false
getList()
}
})
}
// 编辑规则
else {
rptgetruleUpdate(ruleData).then((res: any) => {
if (res.code == 0) {
ElMessage.success('规则修改成功');
ruleDialogVisible.value = false
getList()
}
})
}
})
}
// 删除规则
const handleDelete = (row: Rule) => {
ElMessageBox.confirm(
`确定删除规则【${row.bglqdh} - ${row.bglqmc}】吗？`,
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
).then(() => {
// 新增未保存的规则直接删除
if (row.addFlag) {
ruleList.value = ruleList.value.filter(item => item.bglqdh !== row.bglqdh)
ElMessage.success('删除成功');
return
}
// 调用删除接口
rptgetruleDel({ bglqdh: row.bglqdh }).then((res: any) => {
if (res.code == 0) {
ElMessage.success('删除成功');
ruleList.value = ruleList.value.filter(item => item.bglqdh !== row.bglqdh)
}
})
})
}
// 处理时间输入，限制为HH:mm格式
const handleTimeInput = (row: any, field: string) => {
// 移除非数字和非冒号字符
let value = row[field].replace(/[^0-9:]/g, '')
// 自动添加冒号
if (value.length === 2 && !value.includes(':')) {
value += ':'
}
row[field] = value
}
// 处理时间输入失去焦点时的格式化
const handleInputBlur = (row: any, field: string) => {
isEditing.value = false
let value = row[field]
// 补全时间格式
if (field === 'kssj' || field === 'jssj') {
if (value.length === 1) {
value = `0${value}:00`
@ -183,7 +344,6 @@ const handleInputBlur = (row: any, field: string) => {
value += '0'
}
// 验证小时和分钟范围
if (value.includes(':')) {
const [hours, minutes] = value.split(':')
const validHours = Math.min(Math.max(parseInt(hours) || 0, 0), 23).toString().padStart(2, '0')
@ -193,361 +353,76 @@ const handleInputBlur = (row: any, field: string) => {
value = '00:00'
}
row[field] = value
row.status = true;
row.status = true
}
czList()
}
// 处理数字输入，限制为数字
const handleNumberInput = (row: any, field: string) => {
// 只保留数字和小数点
row[field] = row[field].replace(/[^0-9.]/g, '')
// 确保只有一个小数点
const dotIndex = row[field].indexOf('.')
if (dotIndex !== -1 && row[field].lastIndexOf('.') !== dotIndex) {
row[field] = row[field].slice(0, row[field].lastIndexOf('.'))
row.status = true;
}
czList()
row.status = true
}
// 处理明细变化
const handleDetailChange = (row: any) => {
row.status = true;
czList()
}
// 输入框获得焦点
const handleInputFocus = () => {
isEditing.value = true
}
// 单元格样式类
const cellClassName = () => {
return 'no-edit-cell'
}
// 行点击事件，实现右侧联动
const handleRowClick = (row: any) => {
const { bglqdh, bglqmc, bz } = row
currentRule.value = row
row.originalData = JSON.parse(JSON.stringify(row));
getgzList(row)
}
// 新增规则
const addgz = () => {
ruleList.value.unshift(
{
bglqdh: Math.max(...ruleList.value.map((item: any) => item.bglqdh), 0) + 1,
bglqmc: 'test',
bz: '',
status: true,
originalData: {},
addFlag: true
}
)
currentRule.value = ruleList.value[0]
detailList.value = [
{
bglqdh: Math.max(...ruleList.value.map((item: any) => item.bglqdh), 0),
weekday: '1',
weekday1: '2',
kssj: '09:00',
jssj: '18:00',
bglqsm: '领取声明',
bgxss: 1,
xh: detailList.value.length,
detaiFlag: true,
status: false
}
]
rptgetruledetail.value.push(...detailList.value)
}
// 新增规则明细
const addDetail = () => {
detailList.value.push({
bglqdh: currentRule.value.bglqdh,
weekday: '1',
weekday1: '2',
kssj: '09:00',
jssj: '18:00',
bglqsm: '领取声明',
bgxss: 1,
xh: detailList.value.length + 1,
detaiFlag: false,
status: false
})
ruleList.value.forEach((item: any) => {
if (item.bglqdh == currentRule.value.bglqdh) {
item.status = true
}
});
rptgetruledetail.value.push(...detailList.value)
}
const editHandle = (row: any, field: string) => {
ruleList.value.forEach((item: any) => {
if (item.bglqdh == row.bglqdh) {
item[field] = row[field]
item.status = JSON.stringify(row[field]) !== JSON.stringify(item.originalData[field]);
}
});
czList()
}
const czList = () => {
ruleList.value.forEach((item: any) => {
if (item.bglqdh == currentRule.value.bglqdh) {
item.status = true
}
});
rptgetruledetail.value = rptgetruledetail.value.filter((item: any) => item.bglqdh !== currentRule.value.bglqdh)
rptgetruledetail.value.push(...detailList.value)
}
// 保存
const saveHandle = () => {
const addList = ruleList.value.filter((item: any) => item.addFlag)
const updateList = ruleList.value.filter((item: any) => item.status && !item.addFlag)
const addDetailList = rptgetruledetail.value.filter((item: any) => item.detaiFlag)
const upadteDetailList = rptgetruledetail.value.filter((item: any) => !item.detaiFlag)
// 保存成功后的回调处理
const handleSuccess = () => {
// 重置规则的新增/修改状态
ruleList.value.forEach(item => {
item.addFlag = false;
item.status = false;
});
// 重置明细的新增/修改状态
detailList.value.forEach(item => {
item.detaiFlag = false;
item.status = false;
});
ElMessage.success('保存成功');
};
if (updateList.length > 0) {
rptgetruleUpdate({ ruleList: updateList, ruleDetailList: upadteDetailList }).then((res: any) => {
if (res.code == 0) {
handleSuccess()
}
})
} if (addList.length > 0) {
rptgetruleadd({ ruleList: addList, ruleDetailList: addDetailList }).then((res: any) => {
if (res.code == 0) {
handleSuccess()
}
})
}
}
// 删除规则
const handleDelete = (row: any) => {
ElMessageBox.confirm(
`确定删除${row.bglqdh}数据吗？`,
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
)
.then(() => {
const handleSueess = () => {
ruleList.value = ruleList.value.filter((item: any) => item.bglqdh !== row.bglqdh)
handleRowClick(ruleList.value[0])
};
if (row.addFlag) {
handleSueess()
} else {
rptgetruleDel({ bglqdh: row.bglqdh }).then((res: any) => {
if (res.code == 0) {
ElMessage.success('删除成功');
handleSueess()
}
})
}
})
.catch(() => {
})
};
// 删除规则明细
const delDetail = (row: any) => {
ElMessageBox.confirm(
`确定删除该项数据吗？`, "提示",
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
)
.then(() => {
const handleSueess = () => {
detailList.value = detailList.value.filter((item: any) => item.xh !== row.xh)
};
if (row.detaiFlag) {
handleSueess()
} else {
rptgetruleDelDetail({ bglqdh: row.bglqdh, xh: row.xh }).then((res: any) => {
if (res.code == 0) {
ElMessage.success('删除成功');
handleSueess()
}
})
}
})
.catch(() => {
})
};
const getList = () => {
rptgetruleList().then((res: any) => {
if (res.code == 0) {
ruleList.value = res.data
ruleList.value.forEach((item: any) => {
item.originalData = {}
item.status = false
})
handleRowClick(ruleList.value[0])
getgzList(res.data[0])
}
})
}
const getgzList = (info: any) => {
if (info.status) {
detailList.value = rptgetruledetail.value.filter((item: any) => item.bglqdh == info.bglqdh)
} else {
rptgetruleDetail({ bglqdh: info.bglqdh }).then((res: any) => {
if (res.code == 0) {
detailList.value = res.data
}
})
}
}
getList()
// 初始化默认选中第一行
// 初始化
onMounted(() => {
getList()
})
// 替换原flag的定义，改为计算属性
const flag = computed(() => {
// 检查是否有新增规则
const hasNewRule = ruleList.value.some(item => item.addFlag);
// 检查是否有修改的规则
const hasUpdatedRule = ruleList.value.some(item => item.status);
// 检查是否有新增明细
const hasNewDetail = detailList.value.some(item => item.detaiFlag);
// 检查是否有修改的明细
const hasUpdatedDetail = detailList.value.some(item => item.status);
// 当存在任何新增或修改时，按钮可点击（返回false），否则禁用（返回true）
return !(hasNewRule || hasUpdatedRule || hasNewDetail || hasUpdatedDetail);
});
</script>
<style scoped>
.rule-management-container {
height: 90vh;
/* display: flex;
flex-direction: column; */
padding: 10px;
box-sizing: border-box;
/* background-color: #f0f2f5; */
}
.top-toolbar {
padding: 8px 15px;
background-color: #FFF;
border-radius: 4px;
margin-bottom: 10px;
}
/* ::v-deep .top-toolbar .el-button {
margin-right: 8px;
} */
.content-wrapper {
flex: 1;
display: flex;
gap: 10px;
height: calc(100% - 3.75rem);
.mb20 {
margin-bottom: 20px;
}
.left-table-area {
width: 50%;
background-color: #fff;
border: 1px solid #e6e6e6;
border-radius: 4px;
padding: 5px;
display: flex;
flex-direction: column;
}
.right-form-area {
width: 50%;
background-color: #e6f7ff;
border: 1px solid #91d5ff;
border-radius: 4px;
padding: 10px;
display: flex;
flex-direction: column;
height: calc(100% - 40px);
}
.rule-form {
background-color: #fff;
padding: 15px;
border-radius: 4px;
border: 1px solid #d9d9d9;
margin-bottom: 15px;
}
.detail-table-header {
padding: 8px 0;
font-weight: 500;
font-weight: 700;
font-size: 16px;
color: #1890ff;
border-bottom: 1px solid #91d5ff;
border-bottom: 1px solid #e8e8e8;
margin-bottom: 10px;
display: flex;
justify-content: space-between;
align-items: center;
}
::v-deep .custom-table th {
background-color: #f5f7fa;
}
::v-deep .detail-table th {
background-color: #f0faff;
}
::v-deep .week-select {
.full-width-input {
width: 100%;
}
::v-deep .el-table .el-table__cell {
/* 替换::v-deep为:deep() */
:deep(.custom-table th) {
background-color: #f5f7fa;
}
:deep(.detail-table th) {
background-color: #f0faff;
}
:deep(.el-table .el-table__cell) {
padding: 5px 0;
}
::v-deep .el-input__inner {
:deep(.el-input__inner) {
padding: 5px 10px;
height: 32px;
}
/* 禁用单元格点击效果 */
/* ::v-deep .no-edit-cell {
pointer-events: none;
} */
/* 让输入框可以被点击 */
::v-deep .no-edit-cell .el-input,
::v-deep .no-edit-cell .el-select {
pointer-events: auto;
}
</style>
</style>

126
src/views/mzcx/sqcx/index.vue
View File

@ -1,59 +1,44 @@
<template>
<div class="app-container">
<!-- <el-row :gutter="5" class="compact-form" :span="24"> -->
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-position="left">
<el-col :span="24" :xs="24">
<el-form-item label="执行时间:" label-width="75px" prop="stime">
<div class="query-form">
<el-form :model="queryParams" ref="queryRef" inline v-show="showSearch">
<el-form-item label="执行时间:" prop="stime">
<el-date-picker style="width: 130px;" v-model="queryParams.st" type="date" placeholder="起始"
value-format="YYYY-MM-DD" :clearable="false"></el-date-picker>
</el-form-item>
<el-form-item label="--" label-width="30px" prop="etime">
<el-form-item label="-" prop="etime">
<el-date-picker style="width: 130px;" v-model="queryParams.et" type="date" placeholder="结束"
value-format="YYYY-MM-DD" :clearable="false"></el-date-picker>
</el-form-item>
<el-form-item label="病人代号:" label-width="75px" prop="brdh">
<el-form-item label="病人代号:" prop="brdh">
<el-input style="width: 150px;" v-model="queryParams.brdh" placeholder="病人代号" />
</el-form-item>
<el-form-item label="病人姓名:" label-width="75px" prop="brxm">
<el-form-item label="病人姓名:" prop="brxm">
<el-input style="width: 150px;" v-model="queryParams.brxm" placeholder="病人姓名" />
</el-form-item>
<el-form-item label="状态:" label-width="50px" prop="zt">
<el-select v-model="queryParams.zt" placeholder="状态" clearable style="width: 100px;">
<el-form-item label="状态:" prop="zt">
<el-select v-model="queryParams.zt" placeholder="状态" clearable style="width: 120px;">
<el-option v-for="(item, index) in ztOptions" :key="index" :label="item.label" :value="item.value"
:disabled="item.disabled"></el-option>
</el-select>
</el-form-item>
<el-form-item label="病人类型:" label-width="75px" prop="brly">
<el-select v-model="queryParams.brly" placeholder="病人类型" clearable style="width: 100px;">
<el-form-item label="病人类型:" prop="brly">
<el-select v-model="queryParams.brly" placeholder="病人类型" clearable style="width: 120px;">
<el-option v-for="(item, index) in pattypeOptions" :key="index" :label="item.label" :value="item.value"
:disabled="item.disabled"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-form>
<!-- </el-row> -->
<el-row :gutter="5" class="mb8 mt10">
<el-col :span="1.5">
<el-button type="primary" plain icon="Search" @click="handleQuery"
v-hasPermi="['system:reqmain:Search']">查询</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Printer" :disabled="single" @click="printAll"
v-hasPermi="['system:reqmain:add']">打印</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Printer" :disabled="freesingle" @click="printSigne"
v-hasPermi="['system:reqmain:edit']">单打条码</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Printer" :disabled="freesingle" @click="printBackpaper"
v-hasPermi="['system:reqmain:edit']">单打回单</el-button>
</el-col>
</el-row>
</el-form>
</div>
<div class="mb10">
<el-button type="primary" icon="Search" @click="handleQuery">查询</el-button>
<el-button type="warning" plain icon="Printer" :disabled="single" @click="printAll">打印</el-button>
<el-button type="warning" plain icon="Printer" :disabled="freesingle" @click="printSigne">单打条码</el-button>
<el-button type="warning" plain icon="Printer" :disabled="freesingle" @click="printBackpaper">单打回单</el-button>
</div>
<el-row :gutter="5" class="table-container">
<el-table ref="tableRef" class="compact-form my-table" :data="reqmainList"
@selection-change="handleSelectionChange" @select="handleSelect" height="100%" :cell-style="tableCellStyle">
<el-table ref="tableRef" :data="reqmainList" border @selection-change="handleSelectionChange"
@select="handleSelect" height="100%" :cell-style="tableCellStyle">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="项目名称" align="center" prop="sqxmmc" width="200" show-overflow-tooltip />
<el-table-column label="项目代码" align="center" prop="sqxmdh" width="100" show-overflow-tooltip />
@ -118,6 +103,7 @@ import {
printBarcode,
printBarcodeall
} from "@/api/mzcx/cydj.js";
import { ElMessage } from "element-plus";
const comDict = inject('comDict');
// 字典数据存储
const dictData = ref({});
@ -232,15 +218,12 @@ function getList() {
loading.value = true;
getSubday();
querySQD(queryParams.value).then(response => {
if (isEmptyData(response.data)) proxy.$modal.alert("没有检索的数据!");
reqmainList.value = response.data;
// console.log('response:', response.data);
loading.value = false;
single.value = false;
// 新增：数据加载完成后触发全选
// 延迟执行（确保DOM已更新）
setTimeout(() => {
if (tableRef.value) {
single.value = false;
if (tableRef.value && reqmainList.value.length > 0) {
tableRef.value.toggleAllSelection(); // 调用全选方法
}
}, 0);
@ -463,15 +446,7 @@ const getContrastTextColor = (bgColor) => {
overflow: hidden;
}
.compact-form {
height: 40px;
/* 固定高度 */
}
.mb8 {
height: 30px;
/* 固定高度 */
}
.table-container {
flex: 1;
@ -480,47 +455,12 @@ const getContrastTextColor = (bgColor) => {
/* 避免表格超出容器 */
}
.compact-form .el-form-item {
padding: 5px;
margin-bottom: 5px;
.el-form-item {
margin-bottom: 10px;
}
.compact-form .el-form-item__label {
padding-bottom: 0px;
}
:deep(.my-table .el-table__row td) {
padding: 1px 0;
/* 减小行高 */
}
:deep(.my-table .el-table__header-wrapper th) {
padding: 6px 0;
/* 表头内边距 */
background-color: #b3d8ff !important;
/* 表头背景色（保留之前的设置） */
color: #333;
/* 文字颜色加深，提升可读性 */
font-weight: 500;
/* 文字加粗 */
}
:deep(.my-table .el-table__cell) {
padding: 0 2px;
/* 减小列间距 */
}
/* 可选：调整表格整体样式 */
:deep(.my-table) {
font-size: 13px;
/* 适当减小字体 */
}
:deep(.my-table .el-table__cell),
:deep(.my-table .el-table__header-wrapper th) {
border-width: 1px;
border-color: #ebeef5;
}
.card-content {
max-height: 450px;
@ -540,22 +480,6 @@ const getContrastTextColor = (bgColor) => {
}
/* 消除inline表单中表单项的右侧间距（主要间距来源） */
/* 消除表单项之间的间距 */
:deep(.el-form--inline .el-form-item) {
margin-right: 0 !important;
margin-bottom: 0 !important;
}
/* 缩小标签与输入框的间距 */
:deep(.el-form-item__label) {
padding-right: 8px !important;
}
/* 表单项之间添加微小间隙（避免完全贴靠） */
:deep(.el-form-item) {
margin-left: 5px !important;
}
/* 汇总行样式 */
.table-summary {