新增安全检查日志

src/views/elderly/nursing/safety-check-log/index.vue

@@ -0,0 +1,466 @@
+<template>
+  <ContentWrap>
+    <el-form
+      class="-mb-15px"
+      :model="queryParams"
+      ref="queryFormRef"
+      :inline="true"
+      label-width="80px"
+    >
+      <el-form-item prop="tenantIds">
+        <TenantSelect v-model="queryParams.tenantIds" placeholder="请选择机构名称" prop="tenantIds" />
+      </el-form-item>
+      <el-form-item label="长者名称" prop="elderName">
+        <TgInput @keyup.enter="handleQuery" v-model="queryParams.elderName" class="!w-160px" />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+      </el-form-item>
+    </el-form>
+  </ContentWrap>
+
+  <ContentWrap>
+    <Table2 v-loading="loading" :list="list" :columns="columns" :queryParams="queryParams">
+      <template #pre="{ scope }">
+        <el-button link type="primary" @click="openDetail(scope)">查看</el-button>
+      </template>
+      <template #lastCheckTime="{ scope }">
+        {{ formatBackendDateTime(scope.row.lastCheckTime, 'YYYY-MM-DD HH:mm') || '-' }}
+      </template>
+    </Table2>
+
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <Dialog
+      v-model="detailVisible"
+      width="90%"
+      title="安全检查日志详情"
+      class="form-tag-dialog"
+      scroll
+      @close="closeDetail"
+    >
+      <div v-loading="detailLoading">
+        <div class="info-title">长者信息</div>
+        <div class="info-wrap mb-15px">
+          <el-row :gutter="20">
+            <el-col :span="8" :xs="24" class="header-item">长者姓名：{{ detailHeader.elderName || '-' }}</el-col>
+            <el-col :span="8" :xs="24" class="header-item">房间号：{{ detailHeader.roomName || '-' }}</el-col>
+            <el-col :span="8" :xs="24" class="header-item">床位号：{{ detailHeader.bedName || '-' }}</el-col>
+          </el-row>
+        </div>
+
+        <div class="info-title">历史记录查询</div>
+        <el-form class="detail-query-form mb-15px" :inline="true" @submit.prevent>
+          <el-form-item label="检查日期">
+            <el-date-picker
+              v-model="detailCheckDateRange"
+              type="daterange"
+              range-separator="至"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+              value-format="YYYY-MM-DD"
+              clearable
+              class="!w-280px"
+            />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" :loading="detailLoading" @click="handleDetailQuery">查询</el-button>
+          </el-form-item>
+        </el-form>
+
+        <el-table :data="detailRecords" max-height="58vh">
+          <el-table-column type="expand">
+            <template #default="scope">
+              <div class="expand-wrap">
+                <div class="expand-title">安全检查明细</div>
+                <el-descriptions :column="2" border size="small" class="mb-10px">
+                  <el-descriptions-item label="检查时间">
+                    {{ formatBackendDateTime(scope.row.checkTime, 'YYYY-MM-DD HH:mm') || '-' }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="提交时间">
+                    {{ formatBackendDateTime(scope.row.submitAt, 'YYYY-MM-DD HH:mm') || '-' }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="长者自带电器设备">
+                    {{ scope.row.elderDevices || '-' }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="被检查人签字">
+                    {{ scope.row.checkedSign || '-' }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="存在问题及整改要求" :span="2">
+                    {{ scope.row.rectification || '-' }}
+                  </el-descriptions-item>
+                  <el-descriptions-item label="其他" :span="2">
+                    {{ scope.row.other || '-' }}
+                  </el-descriptions-item>
+                </el-descriptions>
+
+                <el-table :data="scope.row.checklist || []" size="small" class="inner-table">
+                  <el-table-column label="检查项" prop="label" min-width="220" show-overflow-tooltip />
+                  <el-table-column label="结果" prop="status" width="96" align="center">
+                    <template #default="s">
+                      <el-tag v-if="Number(s.row.status) === 1" type="success" size="small">无问题</el-tag>
+                      <el-tag v-else-if="Number(s.row.status) === 0" type="danger" size="small">有问题</el-tag>
+                      <span v-else>-</span>
+                    </template>
+                  </el-table-column>
+                  <el-table-column label="问题说明/整改要求" prop="remark" min-width="220" show-overflow-tooltip />
+                </el-table>
+              </div>
+            </template>
+          </el-table-column>
+
+          <el-table-column label="检查时间" prop="checkTime" min-width="160" show-overflow-tooltip>
+            <template #default="scope">
+              {{ formatBackendDateTime(scope.row.checkTime, 'YYYY-MM-DD HH:mm') || '-' }}
+            </template>
+          </el-table-column>
+
+          <el-table-column label="状态" prop="overallStatus" width="96" align="center">
+            <template #default="scope">
+              <el-tag v-if="Number(scope.row.overallStatus) === 1" type="success" size="small">正常</el-tag>
+              <el-tag v-else-if="Number(scope.row.overallStatus) === 0" type="danger" size="small">异常</el-tag>
+              <span v-else>-</span>
+            </template>
+          </el-table-column>
+
+          <el-table-column label="异常项数" prop="abnormalCount" width="100" align="center" />
+          <el-table-column label="整改要求" prop="rectification" min-width="180" show-overflow-tooltip />
+          <el-table-column label="被检查人签字" prop="checkedSign" width="120" show-overflow-tooltip />
+          <el-table-column label="提交时间" prop="submitAt" min-width="160" show-overflow-tooltip>
+            <template #default="scope">
+              {{ formatBackendDateTime(scope.row.submitAt, 'YYYY-MM-DD HH:mm') || '-' }}
+            </template>
+          </el-table-column>
+        </el-table>
+
+        <div v-if="detailTotal > 0" class="flex justify-end">
+          <Pagination
+            :total="detailTotal"
+            v-model:page="detailPageNo"
+            v-model:limit="detailPageSize"
+            @pagination="onDetailPagination"
+          />
+        </div>
+      </div>
+
+      <template #footer>
+        <el-button @click="closeDetail">关闭</el-button>
+      </template>
+    </Dialog>
+  </ContentWrap>
+</template>
+<script setup lang="ts">
+import { formatBackendDateTime } from '@/utils/formatTime'
+import dayjs from 'dayjs'
+import { useUserStore } from '@/store/modules/user'
+
+defineOptions({ name: 'SafetyCheckLog' })
+
+type SafetyChecklistItem = {
+  key?: string
+  label?: string
+  status?: number | string
+  remark?: string
+}
+
+type SafetyCheckRecord = {
+  batchId?: string
+  elderId?: number | string
+  elderName?: string
+  bedName?: string
+  roomName?: string
+  checkTime?: number | string
+  other?: string
+  elderDevices?: string
+  rectification?: string
+  checkedSign?: string
+  checklist?: SafetyChecklistItem[]
+  submitBy?: string
+  submitAt?: number | string
+}
+
+type SafetyCheckElderRow = {
+  elderId: number | string
+  elderName: string
+  roomName: string
+  bedName: string
+  recordCount: number
+  lastCheckTime: number | string
+}
+
+type SafetyCheckDetailRow = SafetyCheckRecord & {
+  overallStatus: 0 | 1
+  abnormalCount: number
+}
+
+const userStore = useUserStore()
+const message = useMessage()
+
+const columns = reactive([
+  { label: '长者姓名', field: 'elderName' },
+  { label: '房间号', field: 'roomName' },
+  { label: '床位号', field: 'bedName' },
+  { label: '记录数', field: 'recordCount', width: 96 },
+  { label: '最近检查时间', field: 'lastCheckTime', type: 4 }
+])
+
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  elderName: '',
+  tenantIds: userStore.orgTenantId
+})
+
+const loading = ref(true)
+const total = ref(0)
+const list = ref<SafetyCheckElderRow[]>([])
+const queryFormRef = ref()
+
+function safeParseJsonArray(raw: string | null): any[] {
+  if (!raw) return []
+  try {
+    const v = JSON.parse(raw)
+    return Array.isArray(v) ? v : []
+  } catch {
+    return []
+  }
+}
+
+function readAllRecords(): SafetyCheckRecord[] {
+  const fromLocal = safeParseJsonArray(localStorage.getItem('safetyCheckRecords'))
+  if (fromLocal.length) return fromLocal as SafetyCheckRecord[]
+  const fromSession = safeParseJsonArray(sessionStorage.getItem('safetyCheckRecords'))
+  return fromSession as SafetyCheckRecord[]
+}
+
+function normalizeText(v: unknown) {
+  return String(v ?? '').trim()
+}
+
+function toComparableTime(v: unknown): number {
+  if (v == null || v === '') return 0
+  if (typeof v === 'number' && Number.isFinite(v)) return v < 1e12 ? v * 1000 : v
+  const s = String(v).trim()
+  if (!s) return 0
+  if (/^\d+$/.test(s)) {
+    const n = Number(s)
+    return n < 1e12 ? n * 1000 : n
+  }
+  const d = dayjs(s)
+  return d.isValid() ? d.valueOf() : 0
+}
+
+function groupByElder(records: SafetyCheckRecord[]): SafetyCheckElderRow[] {
+  const map = new Map<number | string, SafetyCheckElderRow>()
+  for (const r of records) {
+    const elderId = (r as any)?.elderId
+    if (elderId == null || elderId === '') continue
+    const curr = map.get(elderId)
+    const elderName = normalizeText((r as any)?.elderName)
+    const roomName = normalizeText((r as any)?.roomName)
+    const bedName = normalizeText((r as any)?.bedName)
+    const checkTime = (r as any)?.checkTime ?? (r as any)?.submitAt
+    if (!curr) {
+      map.set(elderId, {
+        elderId,
+        elderName,
+        roomName,
+        bedName,
+        recordCount: 1,
+        lastCheckTime: checkTime
+      })
+      continue
+    }
+    curr.recordCount += 1
+    const prevMs = toComparableTime(curr.lastCheckTime)
+    const nextMs = toComparableTime(checkTime)
+    if (nextMs >= prevMs) curr.lastCheckTime = checkTime
+    if (!curr.elderName && elderName) curr.elderName = elderName
+    if (!curr.roomName && roomName) curr.roomName = roomName
+    if (!curr.bedName && bedName) curr.bedName = bedName
+  }
+  return Array.from(map.values()).sort((a, b) => toComparableTime(b.lastCheckTime) - toComparableTime(a.lastCheckTime))
+}
+
+function buildPageParams() {
+  const p = { ...queryParams } as Recordable
+  if (!p.elderName) delete p.elderName
+  return p
+}
+
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+const resetQuery = () => {
+  queryFormRef.value?.resetFields?.()
+  handleQuery()
+}
+
+const getList = async () => {
+  loading.value = true
+  try {
+    const p = buildPageParams()
+    const all = groupByElder(readAllRecords())
+    const keyword = normalizeText(p.elderName)
+    const filtered = keyword
+      ? all.filter((x) => normalizeText(x.elderName).includes(keyword))
+      : all
+    total.value = filtered.length
+    const start = (queryParams.pageNo - 1) * queryParams.pageSize
+    list.value = filtered.slice(start, start + queryParams.pageSize)
+  } finally {
+    loading.value = false
+  }
+}
+
+const detailVisible = ref(false)
+const detailLoading = ref(false)
+const detailHeader = reactive({
+  elderId: undefined as number | string | undefined,
+  elderName: '',
+  roomName: '',
+  bedName: ''
+})
+
+const detailCheckDateRange = ref<string[] | undefined>(undefined)
+const detailRecords = ref<SafetyCheckDetailRow[]>([])
+const detailPageNo = ref(1)
+const detailPageSize = ref(10)
+const detailTotal = ref(0)
+const detailAll = ref<SafetyCheckDetailRow[]>([])
+
+function createDetailDefaultDateRange(): string[] {
+  const start = dayjs().startOf('month')
+  const end = dayjs().endOf('month')
+  return [start.format('YYYY-MM-DD'), end.format('YYYY-MM-DD')]
+}
+
+function computeOverallStatus(checklist: SafetyChecklistItem[] | undefined): { overallStatus: 0 | 1; abnormalCount: number } {
+  const list = Array.isArray(checklist) ? checklist : []
+  const abnormalCount = list.filter((x) => Number((x as any)?.status) === 0).length
+  return { overallStatus: abnormalCount > 0 ? 0 : 1, abnormalCount }
+}
+
+function matchesDateRange(checkTime: unknown, range: string[] | undefined): boolean {
+  if (!Array.isArray(range) || range.length < 2 || !range[0] || !range[1]) return true
+  const ms = toComparableTime(checkTime)
+  if (!ms) return false
+  const start = dayjs(range[0]).startOf('day').valueOf()
+  const end = dayjs(range[1]).endOf('day').valueOf()
+  return ms >= start && ms <= end
+}
+
+function syncDetailPagedSlice() {
+  const all = detailAll.value
+  detailTotal.value = all.length
+  const start = (detailPageNo.value - 1) * detailPageSize.value
+  detailRecords.value = all.slice(start, start + detailPageSize.value)
+}
+
+async function fetchDetailList() {
+  if (detailHeader.elderId == null) return
+  detailLoading.value = true
+  try {
+    const all = readAllRecords()
+      .filter((r) => String((r as any)?.elderId) === String(detailHeader.elderId))
+      .filter((r) => matchesDateRange((r as any)?.checkTime ?? (r as any)?.submitAt, detailCheckDateRange.value))
+      .map((r) => {
+        const computed = computeOverallStatus((r as any)?.checklist)
+        return {
+          ...(r as any),
+          overallStatus: computed.overallStatus,
+          abnormalCount: computed.abnormalCount
+        } as SafetyCheckDetailRow
+      })
+      .sort((a, b) => toComparableTime((b as any)?.checkTime ?? (b as any)?.submitAt) - toComparableTime((a as any)?.checkTime ?? (a as any)?.submitAt))
+
+    detailAll.value = all
+    syncDetailPagedSlice()
+  } finally {
+    detailLoading.value = false
+  }
+}
+
+function onDetailPagination() {
+  syncDetailPagedSlice()
+}
+
+function handleDetailQuery() {
+  detailPageNo.value = 1
+  fetchDetailList()
+}
+
+function resetDetailHeader() {
+  detailHeader.elderId = undefined
+  detailHeader.elderName = ''
+  detailHeader.roomName = ''
+  detailHeader.bedName = ''
+}
+
+function openDetail(row: SafetyCheckElderRow) {
+  if (!row?.elderId && row?.elderId !== 0) {
+    message.warning('该行缺少长者 id，无法查询详情')
+    return
+  }
+  detailVisible.value = true
+  detailPageNo.value = 1
+  detailPageSize.value = 10
+  detailCheckDateRange.value = createDetailDefaultDateRange()
+  detailAll.value = []
+  detailRecords.value = []
+
+  detailHeader.elderId = row.elderId
+  detailHeader.elderName = row.elderName || ''
+  detailHeader.roomName = row.roomName || ''
+  detailHeader.bedName = row.bedName || ''
+
+  fetchDetailList()
+}
+
+function closeDetail() {
+  detailVisible.value = false
+  resetDetailHeader()
+  detailCheckDateRange.value = undefined
+  detailAll.value = []
+  detailRecords.value = []
+  detailTotal.value = 0
+  detailPageNo.value = 1
+  detailPageSize.value = 10
+}
+
+onMounted(() => {
+  getList()
+})
+</script>
+
+<style lang="scss" scoped>
+.info-title {
+  margin-bottom: 8px;
+  font-weight: 600;
+  color: var(--el-text-color-primary);
+}
+.header-item {
+  margin-bottom: 6px;
+  font-size: 14px;
+  color: var(--el-text-color-regular);
+}
+.expand-wrap {
+  padding: 10px 10px 6px;
+}
+.expand-title {
+  margin-bottom: 8px;
+  font-weight: 600;
+  color: var(--el-text-color-primary);
+}
+.inner-table {
+  width: 100%;
+}
+</style>