web_dist/src/components/inpatient/frontsheet-printpage/AuditHistory.vue

<template>
  <div class="layout_container layout-horizontal" style="height: 550px;">
    <aside style="width: 800px">
      <div
          v-if="histories.length === 0"
          style="font-size: 36px;
          height: 86%;
          color: #777777;
          display: flex;
          align-items: center;
          justify-content: center"
      >
        没有有效的质控记录
      </div>
      <div v-else style="overflow-y: auto; height: 500px">
        <el-timeline style="max-width: 800px">
          <el-timeline-item v-for="item in histories" :timestamp="item.applicationTime" placement="top">
            <el-card>
              <h4>
                患者：{{ item.patName }} / {{ item.patNo }} / {{ item.times }}
              </h4>
              <p v-if="item.majorError" class="major-error">主要错误：{{item.majorError}}</p>
              <p class="audit-remark">审核结果：{{ item.auditRemark }}</p>
              <p v-if="item.coderNote" class="coder-note">编码员备注：{{ item.coderNote }}</p>
              <p style="font-size: 12px; color: dimgray">
                <span>审核人：{{ item.auditStaffName }}</span>
                <span style="margin-left: 32px">审核时间：{{ item.auditTime }}</span>
              </p>
              <img :src="item.auditState === 'APPROVED' ? approveImg : rejectImg" alt="" class="img-state">
            </el-card>
          </el-timeline-item>
        </el-timeline>
      </div>
    </aside>
    <div v-if="showLeaderAudit" style="margin-left: 12px;border-left: 1px solid #dadada">
      <GroupLeaderAudit :data="props.patinfo" :close-modal="closeDialog" />
    </div>
    <div style="position: absolute; bottom: 20px; right: 20px">
      <el-button
          v-if="leaderAuditVisible"
          @click="openGroupLeaderAudit"
          size="default"
      >
        {{leaderAuditText}}
      </el-button>
      <el-button @click="closeDialog" size="default" color="black">关闭</el-button>
    </div>
  </div>
</template>

<script setup>
import {useUserStore} from "@/pinia/user-store";
import {fetchAuditHistories} from "@/api/case-front-sheet";
import rejectImg from "@/assets/reject.png"
import approveImg from "@/assets/approved.png"
import GroupLeaderAudit from "@/components/inpatient/frontsheet-printpage/GroupLeaderAudit.vue";

const props = defineProps({
  patinfo: {
    type: Object,
    required: true,
  }
})

const emits = defineEmits(["cyDialogConfirm"]);

const histories = ref([])
const userStore = useUserStore()
const isGroupLeader = userStore.isFSCGroupLeader

const leaderAuditVisible = computed(() => {
  return histories.value.length > 0 && isGroupLeader
})

const showLeaderAudit = ref(false)
const leaderAuditText = computed(() => {
  return showLeaderAudit.value ? '还原' : '组长审核'
})

function openGroupLeaderAudit() {
  if (showLeaderAudit.value) {
    showLeaderAudit.value = false
    return
  }
  let coderName = '';
  histories.value.forEach(item => {
    if (coderName.indexOf(item.auditStaffName) === -1) {
      coderName += ("，" + item.auditStaffName)
    }
  })
  props.patinfo.coderName = coderName.substring(1)

  if (histories.value.length > 0 && isGroupLeader) {
    showLeaderAudit.value = true
  }
}

function closeDialog() {
  emits("cyDialogConfirm")
}

onMounted(() => {
  fetchAuditHistories(props.patinfo).then(res => {
    histories.value = res
  })
})

</script>

<style scoped>
:deep(.el-card) {
  position: relative;
}

.img-state {
  width: 64px;
  position: absolute;
  top: 0;
  right: 0;
}
.major-error {
  color: darkred;
}
.audit-remark {
  color: #0000fa;
}
.coder-note {
  color: #016669;
}
</style>