|
@@ -48,7 +48,8 @@
|
|
|
</el-menu-item>
|
|
|
</el-menu>
|
|
|
<div class="search-bar">
|
|
|
- <el-input v-model="searchValue" placeholder="姓名/床号/门诊号" size="small" class="search-input" @keyup.enter="handleSearch" />
|
|
|
+ <el-input v-model="searchValue" placeholder="姓名/床号/门诊号" size="small" class="search-input"
|
|
|
+ @keyup.enter="handleSearch" />
|
|
|
<el-button size="small" type="primary" class="search-btn" @click="handleSearch">搜索</el-button>
|
|
|
</div>
|
|
|
<div class="patient-tabs">
|
|
@@ -59,16 +60,8 @@
|
|
|
</el-tabs>
|
|
|
</div>
|
|
|
<div class="patient-table">
|
|
|
- <el-table
|
|
|
- :data="patientList"
|
|
|
- border
|
|
|
- size="small"
|
|
|
- height="80%"
|
|
|
- :show-header="true"
|
|
|
- class="table-patients"
|
|
|
- :row-class-name="tableRowClassName"
|
|
|
- @row-click="handleRowClick"
|
|
|
- >
|
|
|
+ <el-table :data="patientList" border size="small" height="80%" :show-header="true" class="table-patients"
|
|
|
+ :row-class-name="tableRowClassName" @row-click="handleRowClick">
|
|
|
<el-table-column prop="name" label="姓名" width="60" />
|
|
|
<el-table-column prop="gender" label="性别" width="50" />
|
|
|
<el-table-column prop="age" label="年龄" width="80" />
|
|
@@ -108,25 +101,27 @@
|
|
|
<component :is="currentComponent" v-if="currentComponent" :patient-info="patientInfo" @change="handleSelect" />
|
|
|
</div>
|
|
|
|
|
|
- <!-- 患者详情弹窗 -->
|
|
|
- <DetailDialog v-model:visible="showDetailDialog" :detail-data="detailData" :physical-activity-dict="physicalActivityDict" @close="handleDetailClose" />
|
|
|
- <!-- 新增:编辑弹窗 -->
|
|
|
- <EditDialog v-model:visible="showEditDialog" :edit-data="editData" @close="handleEditClose" @save="handleEditSave" />
|
|
|
- </div>
|
|
|
+ <!-- 患者详情弹窗 -->
|
|
|
+ <DetailDialog v-model:visible="showDetailDialog" :detail-data="detailData"
|
|
|
+ :physical-activity-dict="physicalActivityDict" @close="handleDetailClose" />
|
|
|
+ <!-- 新增:编辑弹窗 -->
|
|
|
+ <EditDialog v-model:visible="showEditDialog" :edit-data="editData" @close="handleEditClose"
|
|
|
+ @save="handleEditSave" />
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script setup name="MedicalRecord" lang="ts">
|
|
|
- import { listDiagnosis } from '@/api/patients/diagnosis';
|
|
|
- import { DiagnosisVO, } from '@/api/patients/diagnosis/types';
|
|
|
- import { ref, onMounted, getCurrentInstance, toRefs, defineAsyncComponent } from 'vue';
|
|
|
- import { useRoute, useRouter } from 'vue-router';
|
|
|
- import { ArrowLeft } from '@element-plus/icons-vue';
|
|
|
- import { listTreatmentUser, getTreatmentUser } from '@/api/workbench/treatmentUser';
|
|
|
- import DetailDialog from './detailDialog.vue';
|
|
|
- import EditDialog from './editDialog.vue';
|
|
|
- const diagnosisList = ref < DiagnosisVO[] > ([]);
|
|
|
- import { useNutritionDiagnosisStore } from '@/store/modules/diagnosis';
|
|
|
- const useStore = useNutritionDiagnosisStore();
|
|
|
+import { listDiagnosis } from '@/api/patients/diagnosis';
|
|
|
+import { DiagnosisVO, } from '@/api/patients/diagnosis/types';
|
|
|
+import { ref, onMounted, getCurrentInstance, toRefs, defineAsyncComponent } from 'vue';
|
|
|
+import { useRoute, useRouter } from 'vue-router';
|
|
|
+import { ArrowLeft } from '@element-plus/icons-vue';
|
|
|
+import { listTreatmentUser, getTreatmentUser } from '@/api/workbench/treatmentUser';
|
|
|
+import DetailDialog from './detailDialog.vue';
|
|
|
+import EditDialog from './editDialog.vue';
|
|
|
+const diagnosisList = ref<DiagnosisVO[]>([]);
|
|
|
+import { useNutritionDiagnosisStore } from '@/store/modules/diagnosis';
|
|
|
+const useStore = useNutritionDiagnosisStore();
|
|
|
|
|
|
// 动态导入组件
|
|
|
const MedicalRecord = defineAsyncComponent(() => import('./levelMenu.vue'));
|
|
@@ -141,7 +136,7 @@ const NutritionSetting = defineAsyncComponent(() => import('@/views/patients/nut
|
|
|
const DietTherapy = defineAsyncComponent(() => import('@/views/patients/dietTherapy/index.vue'));
|
|
|
const ParenteralNutrition = defineAsyncComponent(() => import('@/views/patients/parenteralNutrition/index.vue'));
|
|
|
const EnteralNutrition = defineAsyncComponent(() => import('@/views/patients/enteralNutrition/index.vue'));
|
|
|
-const EnteralNutritionHistory = defineAsyncComponent(() => import('@/views/patients/enteralNutrition/history.vue'));
|
|
|
+const EnteralNutritionHistory = defineAsyncComponent(() => import('@/views/patients/enteralNutrition/history.vue'));
|
|
|
|
|
|
const componentMap = {
|
|
|
medicalRecord: MedicalRecord,
|
|
@@ -161,9 +156,9 @@ const componentMap = {
|
|
|
const currentComponent = ref(componentMap['medicalRecord']);
|
|
|
const route = useRoute();
|
|
|
const router = useRouter();
|
|
|
-const {proxy} = getCurrentInstance() as any;
|
|
|
+const { proxy } = getCurrentInstance() as any;
|
|
|
|
|
|
- const activeMenu = ref('medicalRecord');
|
|
|
+const activeMenu = ref('medicalRecord');
|
|
|
|
|
|
const patientInfo = ref({
|
|
|
id: '',
|
|
@@ -179,23 +174,23 @@ const patientInfo = ref({
|
|
|
bmi: '',
|
|
|
activity: '',
|
|
|
|
|
|
-
|
|
|
+
|
|
|
});
|
|
|
|
|
|
- // 弹窗控制
|
|
|
- const showDetailDialog = ref(false);
|
|
|
- const detailData = ref({});
|
|
|
- const physicalActivityDict = ref([]);
|
|
|
+// 弹窗控制
|
|
|
+const showDetailDialog = ref(false);
|
|
|
+const detailData = ref({});
|
|
|
+const physicalActivityDict = ref([]);
|
|
|
|
|
|
- const showEditDialog = ref(false);
|
|
|
- const editData = ref({} as any);
|
|
|
+const showEditDialog = ref(false);
|
|
|
+const editData = ref({} as any);
|
|
|
|
|
|
const handleSelect = (key: string, other?: string[]) => {
|
|
|
if (key == 'nutritionScreeningAdd' || key == 'nutritionEvaluationAdd') {
|
|
|
activeMenu.value = key.replace('Add', '');
|
|
|
- } if(key=='enteralNutritionHistory'){
|
|
|
- activeMenu.value = key.replace('History','');
|
|
|
- }else {
|
|
|
+ } if (key == 'enteralNutritionHistory') {
|
|
|
+ activeMenu.value = key.replace('History', '');
|
|
|
+ } else {
|
|
|
activeMenu.value = key;
|
|
|
}
|
|
|
currentComponent.value = componentMap[key] || null;
|
|
@@ -204,156 +199,156 @@ const handleSelect = (key: string, other?: string[]) => {
|
|
|
patientInfo.value.outpatientNo = route.query.outpatientNo;
|
|
|
};
|
|
|
|
|
|
- const goBack = () => {
|
|
|
- router.back();
|
|
|
- };
|
|
|
+const goBack = () => {
|
|
|
+ router.back();
|
|
|
+};
|
|
|
|
|
|
- const searchValue = ref('');
|
|
|
- const patientTab = ref('wait');
|
|
|
- const patientList = ref([]);
|
|
|
- const loading = ref(false);
|
|
|
-
|
|
|
- const currentPatientIndex = ref(0);
|
|
|
- // 添加tooltip相关的状态和方法
|
|
|
- const tooltipVisible = ref(false);
|
|
|
- const tooltipContent = ref('');
|
|
|
- const tooltipStyle = ref({
|
|
|
- left: '0px',
|
|
|
- top: '0px'
|
|
|
- });
|
|
|
-
|
|
|
- function stripHtml(html) {
|
|
|
- if (typeof html === 'undefined' || html === null) {
|
|
|
- return '--';
|
|
|
- }
|
|
|
- const div = document.createElement('div');
|
|
|
- div.innerHTML = html;
|
|
|
- return div.textContent || div.innerText || '';
|
|
|
+const searchValue = ref('');
|
|
|
+const patientTab = ref('wait');
|
|
|
+const patientList = ref([]);
|
|
|
+const loading = ref(false);
|
|
|
+
|
|
|
+const currentPatientIndex = ref(0);
|
|
|
+// 添加tooltip相关的状态和方法
|
|
|
+const tooltipVisible = ref(false);
|
|
|
+const tooltipContent = ref('');
|
|
|
+const tooltipStyle = ref({
|
|
|
+ left: '0px',
|
|
|
+ top: '0px'
|
|
|
+});
|
|
|
|
|
|
- }
|
|
|
- const tableRowClassName = ({ row, rowIndex }) => {
|
|
|
- return rowIndex === currentPatientIndex.value ? 'current-row' : '';
|
|
|
- };
|
|
|
+function stripHtml(html) {
|
|
|
+ if (typeof html === 'undefined' || html === null) {
|
|
|
+ return '--';
|
|
|
+ }
|
|
|
+ const div = document.createElement('div');
|
|
|
+ div.innerHTML = html;
|
|
|
+ return div.textContent || div.innerText || '';
|
|
|
|
|
|
- const handleRowClick = (row, column, event) => {
|
|
|
- activeMenu.value = 'medicalRecord';
|
|
|
- currentComponent.value = componentMap['medicalRecord'];
|
|
|
- const idx = patientList.value.findIndex((item) => item === row);
|
|
|
- patientInfo.value = row;
|
|
|
- patientInfo.value.type = route.query.type;
|
|
|
- patientInfo.value.outpatientNo = route.query.outpatientNo;
|
|
|
- if (idx !== -1) {
|
|
|
- currentPatientIndex.value = idx;
|
|
|
- }
|
|
|
- getDiagnosisList();
|
|
|
- };
|
|
|
+}
|
|
|
+const tableRowClassName = ({ row, rowIndex }) => {
|
|
|
+ return rowIndex === currentPatientIndex.value ? 'current-row' : '';
|
|
|
+};
|
|
|
|
|
|
- const handlePrev = () => {
|
|
|
- activeMenu.value = 'medicalRecord';
|
|
|
- currentComponent.value = componentMap['medicalRecord'];
|
|
|
- if (currentPatientIndex.value > 0) {
|
|
|
- patientInfo.value = patientList.value[currentPatientIndex.value - 1];
|
|
|
- patientInfo.value.type = route.query.type;
|
|
|
- patientInfo.value.outpatientNo = route.query.outpatientNo;
|
|
|
- currentPatientIndex.value--;
|
|
|
- }
|
|
|
- getDiagnosisList();
|
|
|
- };
|
|
|
+const handleRowClick = (row, column, event) => {
|
|
|
+ activeMenu.value = 'medicalRecord';
|
|
|
+ currentComponent.value = componentMap['medicalRecord'];
|
|
|
+ const idx = patientList.value.findIndex((item) => item === row);
|
|
|
+ patientInfo.value = row;
|
|
|
+ patientInfo.value.type = route.query.type;
|
|
|
+ patientInfo.value.outpatientNo = route.query.outpatientNo;
|
|
|
+ if (idx !== -1) {
|
|
|
+ currentPatientIndex.value = idx;
|
|
|
+ }
|
|
|
+ getDiagnosisList();
|
|
|
+};
|
|
|
|
|
|
- const handleNext = () => {
|
|
|
- activeMenu.value = 'medicalRecord';
|
|
|
- currentComponent.value = componentMap['medicalRecord'];
|
|
|
- patientInfo.value = patientList.value[currentPatientIndex.value + 1];
|
|
|
- patientInfo.value.type = route.query.type;
|
|
|
- patientInfo.value.outpatientNo = route.query.outpatientNo;
|
|
|
- if (currentPatientIndex.value < patientList.value.length - 1) {
|
|
|
- currentPatientIndex.value++;
|
|
|
- }
|
|
|
- getDiagnosisList();
|
|
|
- };
|
|
|
+const handlePrev = () => {
|
|
|
+ activeMenu.value = 'medicalRecord';
|
|
|
+ currentComponent.value = componentMap['medicalRecord'];
|
|
|
+ if (currentPatientIndex.value > 0) {
|
|
|
+ patientInfo.value = patientList.value[currentPatientIndex.value - 1];
|
|
|
+ patientInfo.value.type = route.query.type;
|
|
|
+ patientInfo.value.outpatientNo = route.query.outpatientNo;
|
|
|
+ currentPatientIndex.value--;
|
|
|
+ }
|
|
|
+ getDiagnosisList();
|
|
|
+};
|
|
|
|
|
|
- const handleTabChange = (tab: string) => {
|
|
|
- if (tab == 'wait') {
|
|
|
- getList();
|
|
|
- } else {
|
|
|
- patientList.value = [];
|
|
|
- }
|
|
|
- };
|
|
|
+const handleNext = () => {
|
|
|
+ activeMenu.value = 'medicalRecord';
|
|
|
+ currentComponent.value = componentMap['medicalRecord'];
|
|
|
+ patientInfo.value = patientList.value[currentPatientIndex.value + 1];
|
|
|
+ patientInfo.value.type = route.query.type;
|
|
|
+ patientInfo.value.outpatientNo = route.query.outpatientNo;
|
|
|
+ if (currentPatientIndex.value < patientList.value.length - 1) {
|
|
|
+ currentPatientIndex.value++;
|
|
|
+ }
|
|
|
+ getDiagnosisList();
|
|
|
+};
|
|
|
|
|
|
- const getDiagnosisList = async () => {
|
|
|
- const params: any = {
|
|
|
- pageNum: null,
|
|
|
- pageSize: null,
|
|
|
- treatmentUserId: patientInfo.value.id
|
|
|
- };
|
|
|
- try {
|
|
|
- const res = await listDiagnosis(params);
|
|
|
- diagnosisList.value = res.rows || [];
|
|
|
- useStore.setDiagnosisList(res.rows || [])
|
|
|
- if (diagnosisList.value.length > 0) {
|
|
|
- // 默认选中第一个
|
|
|
- useStore.setDiagnosisInfo(diagnosisList.value[0])
|
|
|
- } else {
|
|
|
- useStore.setDiagnosisInfo({} as DiagnosisVO)
|
|
|
- }
|
|
|
- } catch (error) {
|
|
|
- proxy ?.$modal.msgError('获取列表失败');
|
|
|
- useStore.setDiagnosisList([])
|
|
|
- }
|
|
|
+const handleTabChange = (tab: string) => {
|
|
|
+ if (tab == 'wait') {
|
|
|
+ getList();
|
|
|
+ } else {
|
|
|
+ patientList.value = [];
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+const getDiagnosisList = async () => {
|
|
|
+ const params: any = {
|
|
|
+ pageNum: null,
|
|
|
+ pageSize: null,
|
|
|
+ treatmentUserId: patientInfo.value.id
|
|
|
+ };
|
|
|
+ try {
|
|
|
+ const res = await listDiagnosis(params);
|
|
|
+ diagnosisList.value = res.rows || [];
|
|
|
+ useStore.setDiagnosisList(res.rows || [])
|
|
|
+ if (diagnosisList.value.length > 0) {
|
|
|
+ // 默认选中第一个
|
|
|
+ useStore.setDiagnosisInfo(diagnosisList.value[0])
|
|
|
+ } else {
|
|
|
+ useStore.setDiagnosisInfo({} as DiagnosisVO)
|
|
|
}
|
|
|
+ } catch (error) {
|
|
|
+ proxy?.$modal.msgError('获取列表失败');
|
|
|
+ useStore.setDiagnosisList([])
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- // 编辑按钮处理
|
|
|
- const handleEdit = async () => {
|
|
|
- if (!patientInfo.value.id) {
|
|
|
- proxy ?.$modal.msgError('请先选择患者');
|
|
|
- return;
|
|
|
- }
|
|
|
- try {
|
|
|
- const res = await getTreatmentUser(patientInfo.value.id);
|
|
|
- editData.value = res.data;
|
|
|
- showEditDialog.value = true;
|
|
|
- } catch (error) {
|
|
|
- console.error('获取患者详情失败:', error);
|
|
|
- proxy ?.$modal.msgError('获取患者详情失败');
|
|
|
- }
|
|
|
- };
|
|
|
+// 编辑按钮处理
|
|
|
+const handleEdit = async () => {
|
|
|
+ if (!patientInfo.value.id) {
|
|
|
+ proxy?.$modal.msgError('请先选择患者');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ try {
|
|
|
+ const res = await getTreatmentUser(patientInfo.value.id);
|
|
|
+ editData.value = res.data;
|
|
|
+ showEditDialog.value = true;
|
|
|
+ } catch (error) {
|
|
|
+ console.error('获取患者详情失败:', error);
|
|
|
+ proxy?.$modal.msgError('获取患者详情失败');
|
|
|
+ }
|
|
|
+};
|
|
|
|
|
|
- // 详情按钮处理
|
|
|
- const handleDetail = async () => {
|
|
|
- if (!patientInfo.value.id) {
|
|
|
- proxy ?.$modal.msgError('请先选择患者');
|
|
|
- return;
|
|
|
- }
|
|
|
- try {
|
|
|
- const res = await getTreatmentUser(patientInfo.value.id);
|
|
|
- detailData.value = res.data;
|
|
|
- showDetailDialog.value = true;
|
|
|
- } catch (error) {
|
|
|
- console.error('获取患者详情失败:', error);
|
|
|
- proxy ?.$modal.msgError('获取患者详情失败');
|
|
|
- }
|
|
|
- };
|
|
|
+// 详情按钮处理
|
|
|
+const handleDetail = async () => {
|
|
|
+ if (!patientInfo.value.id) {
|
|
|
+ proxy?.$modal.msgError('请先选择患者');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ try {
|
|
|
+ const res = await getTreatmentUser(patientInfo.value.id);
|
|
|
+ detailData.value = res.data;
|
|
|
+ showDetailDialog.value = true;
|
|
|
+ } catch (error) {
|
|
|
+ console.error('获取患者详情失败:', error);
|
|
|
+ proxy?.$modal.msgError('获取患者详情失败');
|
|
|
+ }
|
|
|
+};
|
|
|
|
|
|
- // 详情弹窗关闭处理
|
|
|
- const handleDetailClose = () => {
|
|
|
- showDetailDialog.value = false;
|
|
|
- detailData.value = {};
|
|
|
- };
|
|
|
+// 详情弹窗关闭处理
|
|
|
+const handleDetailClose = () => {
|
|
|
+ showDetailDialog.value = false;
|
|
|
+ detailData.value = {};
|
|
|
+};
|
|
|
|
|
|
- const handleEditClose = () => {
|
|
|
- showEditDialog.value = false;
|
|
|
- editData.value = {};
|
|
|
- };
|
|
|
+const handleEditClose = () => {
|
|
|
+ showEditDialog.value = false;
|
|
|
+ editData.value = {};
|
|
|
+};
|
|
|
|
|
|
- const handleEditSave = (data) => {
|
|
|
- showEditDialog.value = false;
|
|
|
- proxy ?.$modal.msgSuccess('保存成功');
|
|
|
- getList();
|
|
|
- };
|
|
|
+const handleEditSave = (data) => {
|
|
|
+ showEditDialog.value = false;
|
|
|
+ proxy?.$modal.msgSuccess('保存成功');
|
|
|
+ getList();
|
|
|
+};
|
|
|
|
|
|
- const waitingCount = ref(0);
|
|
|
- const treatingCount = ref(0);
|
|
|
- const treatedCount = ref(0);
|
|
|
+const waitingCount = ref(0);
|
|
|
+const treatingCount = ref(0);
|
|
|
+const treatedCount = ref(0);
|
|
|
|
|
|
const getList = async () => {
|
|
|
loading.value = true;
|
|
@@ -411,9 +406,9 @@ const getList = async () => {
|
|
|
}
|
|
|
};
|
|
|
|
|
|
- const handleSearch = () => {
|
|
|
- getList();
|
|
|
- };
|
|
|
+const handleSearch = () => {
|
|
|
+ getList();
|
|
|
+};
|
|
|
|
|
|
onMounted(() => {
|
|
|
// 获取体力活动字典
|
|
@@ -426,79 +421,79 @@ onMounted(() => {
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .app-container {
|
|
|
- display: flex;
|
|
|
- height: calc(100vh - 50px);
|
|
|
- background-color: #f5f7fa;
|
|
|
- margin: -10px;
|
|
|
- }
|
|
|
+.app-container {
|
|
|
+ display: flex;
|
|
|
+ height: calc(100vh - 50px);
|
|
|
+ background-color: #f5f7fa;
|
|
|
+ margin: -10px;
|
|
|
+}
|
|
|
|
|
|
- .left-menu {
|
|
|
- width: 220px;
|
|
|
- background-color: #fff;
|
|
|
- border-right: 1px solid #e6e6e6;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- padding-bottom: 60px;
|
|
|
- /* 增加底部padding,为按钮留出空间 */
|
|
|
- position: relative;
|
|
|
- overflow: hidden;
|
|
|
- /* 防止内容溢出 */
|
|
|
- }
|
|
|
+.left-menu {
|
|
|
+ width: 220px;
|
|
|
+ background-color: #fff;
|
|
|
+ border-right: 1px solid #e6e6e6;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ padding-bottom: 60px;
|
|
|
+ /* 增加底部padding,为按钮留出空间 */
|
|
|
+ position: relative;
|
|
|
+ overflow: hidden;
|
|
|
+ /* 防止内容溢出 */
|
|
|
+}
|
|
|
|
|
|
- .back-button {
|
|
|
- padding: 16px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 8px;
|
|
|
- cursor: pointer;
|
|
|
- color: #409eff;
|
|
|
- border-bottom: 1px solid #e6e6e6;
|
|
|
- font-size: 14px;
|
|
|
-
|
|
|
- .el-icon {
|
|
|
- font-size: 16px;
|
|
|
- }
|
|
|
+.back-button {
|
|
|
+ padding: 16px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 8px;
|
|
|
+ cursor: pointer;
|
|
|
+ color: #409eff;
|
|
|
+ border-bottom: 1px solid #e6e6e6;
|
|
|
+ font-size: 14px;
|
|
|
+
|
|
|
+ .el-icon {
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
|
|
|
- &:hover {
|
|
|
- background-color: #f5f7fa;
|
|
|
- }
|
|
|
- }
|
|
|
+ &:hover {
|
|
|
+ background-color: #f5f7fa;
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- .medical-menu {
|
|
|
- border-right: none;
|
|
|
+.medical-menu {
|
|
|
+ border-right: none;
|
|
|
|
|
|
- :deep(.el-menu-item) {
|
|
|
- font-size: 14px;
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
- }
|
|
|
- }
|
|
|
+ :deep(.el-menu-item) {
|
|
|
+ font-size: 14px;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- .search-bar {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- padding: 8px 12px 0 12px;
|
|
|
- gap: 6px;
|
|
|
- }
|
|
|
+.search-bar {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 8px 12px 0 12px;
|
|
|
+ gap: 6px;
|
|
|
+}
|
|
|
|
|
|
- .search-input {
|
|
|
- flex: 1;
|
|
|
- }
|
|
|
+.search-input {
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
|
|
|
- .search-btn {
|
|
|
- margin-left: 0;
|
|
|
- }
|
|
|
+.search-btn {
|
|
|
+ margin-left: 0;
|
|
|
+}
|
|
|
|
|
|
- .patient-tabs {
|
|
|
- padding: 0 12px;
|
|
|
- margin-top: 8px;
|
|
|
- }
|
|
|
+.patient-tabs {
|
|
|
+ padding: 0 12px;
|
|
|
+ margin-top: 8px;
|
|
|
+}
|
|
|
|
|
|
- .patient-table {
|
|
|
- min-width: 220px;
|
|
|
- overflow-x: auto;
|
|
|
- }
|
|
|
+.patient-table {
|
|
|
+ min-width: 220px;
|
|
|
+ overflow-x: auto;
|
|
|
+}
|
|
|
|
|
|
.table-patients {
|
|
|
table-layout: fixed;
|
|
@@ -523,46 +518,48 @@ onMounted(() => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .nav-btns {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- gap: 8px;
|
|
|
- position: absolute;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- bottom: 12px;
|
|
|
- padding: 0 12px;
|
|
|
- background: #fff;
|
|
|
- z-index: 1;
|
|
|
- width: calc(100% - 24px);
|
|
|
- margin: 0 auto;
|
|
|
- }
|
|
|
+.nav-btns {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ gap: 8px;
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 12px;
|
|
|
+ padding: 0 12px;
|
|
|
+ background: #fff;
|
|
|
+ z-index: 1;
|
|
|
+ width: calc(100% - 24px);
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
|
|
|
- .main-content {
|
|
|
- flex: 1;
|
|
|
- padding: 20px;
|
|
|
- overflow-y: auto;
|
|
|
- }
|
|
|
+.main-content {
|
|
|
+ flex: 1;
|
|
|
+ padding: 20px;
|
|
|
+ overflow-y: auto;
|
|
|
+}
|
|
|
|
|
|
- .patient-left-info {
|
|
|
- background-color: #fff;
|
|
|
- height: 100px;
|
|
|
- padding: 10px;
|
|
|
- border-radius: 4px;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
+.patient-left-info {
|
|
|
+ background-color: #fff;
|
|
|
+ height: 100px;
|
|
|
+ padding: 10px;
|
|
|
+ width: 20%;
|
|
|
+ border-radius: 4px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
|
|
|
- .patient-right-info {
|
|
|
- background-color: #fff;
|
|
|
- height: 100px;
|
|
|
- padding: 20px;
|
|
|
- border-radius: 4px;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
+.patient-right-info {
|
|
|
+ background-color: #fff;
|
|
|
+ height: 100px;
|
|
|
+ width: 80%;
|
|
|
+ padding: 20px;
|
|
|
+ border-radius: 4px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+}
|
|
|
|
|
|
- .patient-right {
|
|
|
- background: #fff;
|
|
|
- }
|
|
|
+.patient-right {
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
|
|
|
.info-row {
|
|
|
display: flex;
|
|
@@ -591,7 +588,7 @@ onMounted(() => {
|
|
|
color: #ff4949;
|
|
|
}
|
|
|
|
|
|
- .gender-icon.male {
|
|
|
- color: #409eff;
|
|
|
- }
|
|
|
+.gender-icon.male {
|
|
|
+ color: #409eff;
|
|
|
+}
|
|
|
</style>
|