|
@@ -2,25 +2,42 @@
|
|
|
<Dialog v-model="dialogVisible" width="90%" @close="handleClosed" title="护理日志详情" class="form-tag-dialog" scroll>
|
|
<Dialog v-model="dialogVisible" width="90%" @close="handleClosed" title="护理日志详情" class="form-tag-dialog" scroll>
|
|
|
<el-form class="nursing-log-detail" inline>
|
|
<el-form class="nursing-log-detail" inline>
|
|
|
<!-- <template #content> -->
|
|
<!-- <template #content> -->
|
|
|
- <div class="header-flex">
|
|
|
|
|
- <div class="left">
|
|
|
|
|
- <el-tag type="primary" effect="light" round>
|
|
|
|
|
- {{ header.elderName }} / {{ header.nurseLevelName }} / {{ header.bedName }}
|
|
|
|
|
- </el-tag>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ <div class="info-title">长者信息</div>
|
|
|
|
|
+ <div class="info-wrap">
|
|
|
|
|
+ <el-row :gutter="20">
|
|
|
|
|
+ <el-col :span="8" :xs="24" class="header-item">长者名称:{{ header.elderName || '-' }}</el-col>
|
|
|
|
|
+ <el-col :span="8" :xs="24" class="header-item">护理等级:{{ header.nurseLevelName || '-' }}</el-col>
|
|
|
|
|
+ <el-col :span="8" :xs="24" class="header-item">床位号:{{ header.bedName || '-' }}</el-col>
|
|
|
|
|
+ </el-row>
|
|
|
</div>
|
|
</div>
|
|
|
<el-table :data="records" height="60vh" :header-cell-style="(data) => tableHeaderColor(data) || {}">
|
|
<el-table :data="records" height="60vh" :header-cell-style="(data) => tableHeaderColor(data) || {}">
|
|
|
<el-table-column label="护理日期" prop="nurseDate" />
|
|
<el-table-column label="护理日期" prop="nurseDate" />
|
|
|
- <el-table-column label="护理员" prop="creator" />
|
|
|
|
|
- <el-table-column label="护理项目" prop="nursingPlanItemId" />
|
|
|
|
|
|
|
+ <el-table-column label="护理员" prop="nurse" />
|
|
|
|
|
+ <el-table-column label="护理项目" prop="nursingItemName" />
|
|
|
<el-table-column label="图片">
|
|
<el-table-column label="图片">
|
|
|
<template #default="scope">
|
|
<template #default="scope">
|
|
|
- <el-image v-if="scope.row.image" :src="scope.row.image" fit="cover" />
|
|
|
|
|
|
|
+ <div v-if="scope.row.image" class="image-list">
|
|
|
|
|
+ <el-image
|
|
|
|
|
+ v-for="(img, index) in scope.row.image.split(',').filter((item: string) => item)"
|
|
|
|
|
+ :key="index"
|
|
|
|
|
+ :src="img"
|
|
|
|
|
+ :preview-src-list="scope.row.image.split(',').filter((item: string) => item)"
|
|
|
|
|
+ :initial-index="Number(index)"
|
|
|
|
|
+ preview-teleported
|
|
|
|
|
+ fit="cover"
|
|
|
|
|
+ class="image-item"
|
|
|
|
|
+ />
|
|
|
|
|
+ </div>
|
|
|
<span v-else>-</span>
|
|
<span v-else>-</span>
|
|
|
</template>
|
|
</template>
|
|
|
</el-table-column>
|
|
</el-table-column>
|
|
|
<el-table-column label="备注" prop="remark" />
|
|
<el-table-column label="备注" prop="remark" />
|
|
|
<el-table-column label="创建时间" prop="createTime" />
|
|
<el-table-column label="创建时间" prop="createTime" />
|
|
|
|
|
+ <el-table-column label="操作" width="80" v-hasPermi="['nursing-log-list:delete']">
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ <el-button link type="danger" @click="handleDelete(scope.row.id)">删除</el-button>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
</el-table>
|
|
</el-table>
|
|
|
</el-form>
|
|
</el-form>
|
|
|
<template #footer>
|
|
<template #footer>
|
|
@@ -29,10 +46,12 @@
|
|
|
</Dialog>
|
|
</Dialog>
|
|
|
</template>
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
<script setup lang="ts">
|
|
|
-import { getNursingLogDetail } from '@/api/elderly/nursing'
|
|
|
|
|
|
|
+import { getNursingLogDetail, deleteNursingLog } from '@/api/elderly/nursing'
|
|
|
import { tableHeaderColor } from '@/utils/table'
|
|
import { tableHeaderColor } from '@/utils/table'
|
|
|
|
|
+import { ElMessageBox } from 'element-plus'
|
|
|
defineOptions({ name: 'NurseLogDetail' })
|
|
defineOptions({ name: 'NurseLogDetail' })
|
|
|
const dialogVisible = ref(false)
|
|
const dialogVisible = ref(false)
|
|
|
|
|
+const message = useMessage()
|
|
|
|
|
|
|
|
const state = reactive({
|
|
const state = reactive({
|
|
|
header: {
|
|
header: {
|
|
@@ -40,59 +59,62 @@ const state = reactive({
|
|
|
bedName: '',
|
|
bedName: '',
|
|
|
nurseLevelName: ''
|
|
nurseLevelName: ''
|
|
|
},
|
|
},
|
|
|
- records: []
|
|
|
|
|
|
|
+ records: [],
|
|
|
})
|
|
})
|
|
|
const { header, records } = toRefs(state)
|
|
const { header, records } = toRefs(state)
|
|
|
const resetHeader = reactive({ ...header.value })
|
|
const resetHeader = reactive({ ...header.value })
|
|
|
|
|
+const currentElderId = ref<number | null>(null)
|
|
|
|
|
+const dateRange = ref<string[]>([] as string[])
|
|
|
|
|
|
|
|
/** 打开弹窗 */
|
|
/** 打开弹窗 */
|
|
|
-const open = async (row: { elderId: number }) => {
|
|
|
|
|
|
|
+const open = async (row: { elderId: number }, nurseDate: string[]) => {
|
|
|
dialogVisible.value = true
|
|
dialogVisible.value = true
|
|
|
- await getDetail(row.elderId)
|
|
|
|
|
|
|
+ currentElderId.value = row.elderId
|
|
|
|
|
+ dateRange.value = nurseDate as string[]
|
|
|
|
|
+ await getDetail(row.elderId, dateRange.value)
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-const getDetail = async (elderId: number) => {
|
|
|
|
|
- const res = await getNursingLogDetail({ elderId })
|
|
|
|
|
|
|
+const getDetail = async (elderId: number, nurseDate: string[]) => {
|
|
|
|
|
+ const res = await getNursingLogDetail({ elderId, start: nurseDate[0], end: nurseDate[1] })
|
|
|
header.value = res.header || { ...resetHeader }
|
|
header.value = res.header || { ...resetHeader }
|
|
|
records.value = res.records || []
|
|
records.value = res.records || []
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
defineExpose({ open }) // 提供 open 方法,用于打开弹窗
|
|
defineExpose({ open }) // 提供 open 方法,用于打开弹窗
|
|
|
|
|
|
|
|
|
|
+const handleDelete = (id: number) => {
|
|
|
|
|
+ ElMessageBox.confirm('确定删除该护理记录?', '提示', {
|
|
|
|
|
+ confirmButtonText: '确 认',
|
|
|
|
|
+ cancelButtonText: '取 消'
|
|
|
|
|
+ })
|
|
|
|
|
+ .then(async () => {
|
|
|
|
|
+ const res = await deleteNursingLog(id)
|
|
|
|
|
+ if (res) {
|
|
|
|
|
+ message.success('删除成功')
|
|
|
|
|
+ if (currentElderId.value) {
|
|
|
|
|
+ await getDetail(currentElderId.value, dateRange.value)
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ .catch(() => {})
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
const handleClosed = () => {
|
|
const handleClosed = () => {
|
|
|
header.value = { ...resetHeader }
|
|
header.value = { ...resetHeader }
|
|
|
records.value = []
|
|
records.value = []
|
|
|
dialogVisible.value = false
|
|
dialogVisible.value = false
|
|
|
|
|
+ currentElderId.value = null
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
</script>
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
|
-.header-flex{
|
|
|
|
|
- display: flex;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
- justify-content: space-between;
|
|
|
|
|
- padding: 10px;
|
|
|
|
|
- .right{
|
|
|
|
|
- display: flex;
|
|
|
|
|
- .group{
|
|
|
|
|
- display: flex;
|
|
|
|
|
- .column{
|
|
|
|
|
- display: flex;
|
|
|
|
|
- flex-direction: column;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
- cursor: pointer;
|
|
|
|
|
- img{
|
|
|
|
|
- width: 16px;
|
|
|
|
|
- height: 16px;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- .blue{
|
|
|
|
|
- color: var(--el-color-primary);
|
|
|
|
|
- }
|
|
|
|
|
|
|
+.info-title{
|
|
|
|
|
+ font-weight: 600;
|
|
|
|
|
+ color: #303133;
|
|
|
|
|
+ margin: 10px 0 6px;
|
|
|
}
|
|
}
|
|
|
.info-wrap{
|
|
.info-wrap{
|
|
|
|
|
+ margin-bottom: 10px;
|
|
|
.time-round{
|
|
.time-round{
|
|
|
padding: 10px 0;
|
|
padding: 10px 0;
|
|
|
margin: 8px;
|
|
margin: 8px;
|
|
@@ -102,6 +124,20 @@ const handleClosed = () => {
|
|
|
text-align: center;
|
|
text-align: center;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+.header-item{
|
|
|
|
|
+ color: #606266;
|
|
|
|
|
+ padding-bottom: 10px;
|
|
|
|
|
+}
|
|
|
|
|
+.image-list{
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ flex-wrap: wrap;
|
|
|
|
|
+ gap: 6px;
|
|
|
|
|
+}
|
|
|
|
|
+.image-item{
|
|
|
|
|
+ width: 48px;
|
|
|
|
|
+ height: 48px;
|
|
|
|
|
+ border-radius: 4px;
|
|
|
|
|
+}
|
|
|
.el-card{
|
|
.el-card{
|
|
|
position: relative;
|
|
position: relative;
|
|
|
.header{
|
|
.header{
|