web/src/components/charge/RecordsLog.vue

77 lines
1.9 KiB
Vue

<template>
<Panel :title="'缴费记录'">
<div class="list">
<el-scrollbar>
<el-collapse accordion>
<el-collapse-item :name="index" v-for="(item, index) in list" :key="index">
<template #title>
<div class="list-item-content">
<span class="disease-name">{{ item.diagnosisMedicalRecord?.diagnosisSummary }}</span>
<span class="doctor">{{ item.doctorName }}</span>
<span class="time">{{ formatListTime(item.createTime) }}</span>
</div>
</template>
<div>
<Detail :detail="item"></Detail>
</div>
</el-collapse-item>
</el-collapse>
</el-scrollbar>
</div>
</Panel>
</template>
<script setup lang="ts">
import Panel from '@/components/common/Panel.vue';
import Detail from './RecordsLog/Detail.vue';
import {post} from "@/utils/request.ts";
import {ref} from "vue";
import {formatListTime} from "@/utils/dateUtils.ts";
const list = ref<any>([])
const init = (patientId: any) => {
const query = {
patientId: patientId,
pageSize:10
}
post('charge/listDetail', {query}).then((res: any) => {
list.value = res.list
console.log(list,'list')
})
}
const clearList = () => {
list.value = []
}
defineExpose({init,clearList})
</script>
<style scoped lang="scss">
.list {
display: flex;
flex-direction: column;
height: 100%;
.list-item-content {
padding: 0 21px 0 24px;
display: flex;
justify-content: space-between;
.disease-name {
width: 90px;
overflow: hidden; /* 隐藏溢出的内容 */
white-space: nowrap; /* 防止文本换行 */
text-overflow: ellipsis; /* 显示省略号 */
text-align: left;
}
.doctor {
width: 80px;
}
.time{
display: inline-block;
overflow: hidden;
}
}
}
:deep .el-collapse-item__content {
padding: 0;
}
</style>