128 lines
5.7 KiB
Vue
128 lines
5.7 KiB
Vue
|
<template>
|
||
|
|
<div class="app-container">
|
||
|
|
<el-row :gutter="20">
|
||
|
|
<el-col :span="14" :xs="24">
|
||
|
|
<!-- 表单区域-->
|
||
|
|
<el-form :inline="true" :model="queryParams" class="mb8">
|
||
|
|
<el-form-item label="项目类别" prop="userName">
|
||
|
|
<el-input clearable placeholder="项目类别" prefix-icon="Search" style="width: 150px"/>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="细菌标志" prop="bacteriaFlag">
|
||
|
|
<el-input clearable placeholder="细菌标志" prefix-icon="Search" style="width: 150px"/>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="仪器代号" prop="instrumentCode">
|
||
|
|
<el-input clearable placeholder="仪器代号" prefix-icon="Search" style="width: 130px"/>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="快速查找">
|
||
|
|
<el-input clearable placeholder="快速查找" prefix-icon="Search" style="width: 150px"/>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="仪器大类">
|
||
|
|
<el-input clearable placeholder="仪器大类" prefix-icon="Search" style="width: 150px"/>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="项目ID">
|
||
|
|
<el-input clearable placeholder="项目ID" prefix-icon="Search" style="width: 150px"/>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item>
|
||
|
|
<el-radio-group v-model="status" fill="primary" size="large">
|
||
|
|
<el-radio label="1" >在用</el-radio>
|
||
|
|
<el-radio label="2">停用</el-radio>
|
||
|
|
<el-radio label="3">所有</el-radio>
|
||
|
|
</el-radio-group>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item>
|
||
|
|
<el-checkbox v-model="isMIC" label="隐藏微生物项目" size="large" />
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
<el-row :gutter="10" class="mb8">
|
||
|
|
<el-col :span="1.5">
|
||
|
|
<el-button type="primary" plain icon="Plus" @click="handleAdd">新增</el-button>
|
||
|
|
<el-button type="primary" plain icon="Plus" @click="handleDel">删除</el-button>
|
||
|
|
<el-button type="primary" plain icon="Plus" @click="handleDelCorr">删除对应</el-button>
|
||
|
|
<el-button type="primary" plain icon="Plus" @click="handleSave">保存</el-button>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
<!-- 表格区域-->
|
||
|
|
<el-table :data="dataList" height="65vh">
|
||
|
|
<el-table-column label="项目类别" align="center"></el-table-column>
|
||
|
|
<el-table-column label="英文缩写" align="center"></el-table-column>
|
||
|
|
<el-table-column label="名称" align="center"></el-table-column>
|
||
|
|
<el-table-column label="参考值" align="center"></el-table-column>
|
||
|
|
<el-table-column label="单位" align="center"></el-table-column>
|
||
|
|
<el-table-column label="结果类型" align="center"></el-table-column>
|
||
|
|
<el-table-column label="计算项目" align="center"></el-table-column>
|
||
|
|
<el-table-column label="序号" align="center"></el-table-column>
|
||
|
|
<el-table-column label="小数位数" align="center"></el-table-column>
|
||
|
|
<el-table-column label="稀释倍数" align="center"></el-table-column>
|
||
|
|
<el-table-column label="停用" align="center"></el-table-column>
|
||
|
|
<el-table-column label="仪器大类" align="center"></el-table-column>
|
||
|
|
<el-table-column label="项目ID" align="center"></el-table-column>
|
||
|
|
<el-table-column label="项目编码" align="center"></el-table-column>
|
||
|
|
<el-table-column label="外部代码1" align="center"></el-table-column>
|
||
|
|
<el-table-column label="外部代码2" align="center"></el-table-column>
|
||
|
|
<el-table-column label="外部代码3" align="center"></el-table-column>
|
||
|
|
<el-table-column label="英文名称" align="center"></el-table-column>
|
||
|
|
</el-table>
|
||
|
|
</el-col>
|
||
|
|
<!-- 右侧区域-->
|
||
|
|
<el-col :span="10" :xs="24">
|
||
|
|
<div class="flex gap-2 mt-4">
|
||
|
|
<el-check-tag checked type="primary" @click="handleTabClick('1')">基本资料</el-check-tag>
|
||
|
|
<el-check-tag checked type="primary" @click="handleTabClick('2')">常用取值</el-check-tag>
|
||
|
|
<el-check-tag checked type="primary" @click="handleTabClick('3')">使用仪器</el-check-tag>
|
||
|
|
<el-check-tag checked type="primary" @click="handleTabClick('4')">知识库</el-check-tag>
|
||
|
|
<el-check-tag checked type="primary" @click="handleTabClick('5')">整体排序</el-check-tag>
|
||
|
|
<el-check-tag checked type="primary" @click="handleTabClick('6')">常见描述</el-check-tag>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<Basic :visible="tabVisible === '1'"/>
|
||
|
|
<CommmonlyValues :visible="tabVisible === '2'"/>
|
||
|
|
<UseInstr :visible="tabVisible === '3'"/>
|
||
|
|
<Knowledge :visible="tabVisible === '4'"/>
|
||
|
|
<Sort :visible="tabVisible === '5'"/>
|
||
|
|
<CommonDescriptions :visible="tabVisible === '6'"/>
|
||
|
|
</div>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import { ref } from 'vue';
|
||
|
|
import Basic from './tab/basic.vue'
|
||
|
|
import CommmonlyValues from './tab/commmonlyValues.vue'
|
||
|
|
import UseInstr from './tab/useInstr.vue'
|
||
|
|
import Knowledge from './tab/knowledge.vue'
|
||
|
|
import CommonDescriptions from './tab/commonDescriptions.vue'
|
||
|
|
import Sort from './tab/sort.vue'
|
||
|
|
|
||
|
|
const status = ref(1);
|
||
|
|
const isMIC = ref(false);
|
||
|
|
const dataList = ref([])
|
||
|
|
const tabVisible = ref('1')
|
||
|
|
|
||
|
|
//新增
|
||
|
|
const handleAdd = () => {
|
||
|
|
console.log('新增')
|
||
|
|
}
|
||
|
|
|
||
|
|
//删除
|
||
|
|
const handleDel = () => {
|
||
|
|
console.log('删除')
|
||
|
|
}
|
||
|
|
|
||
|
|
//删除对应
|
||
|
|
const handleDelCorr = () => {
|
||
|
|
console.log('删除对应')
|
||
|
|
}
|
||
|
|
|
||
|
|
//保存
|
||
|
|
const handleSave = () => {
|
||
|
|
console.log('保存')
|
||
|
|
}
|
||
|
|
|
||
|
|
//标签切换
|
||
|
|
const handleTabClick = (tab) => {
|
||
|
|
tabVisible.value = tab
|
||
|
|
}
|
||
|
|
|
||
|
|
</script>
|