<!--
 * @Author: zhanghaifeng
 * @Date: 2025-01-03 16:46:09
 * @LastEditors: zhanghaifeng
 * @LastEditTime: 2025-01-10 15:42:18
 * @Description:
 * @FilePath: /hospital-project/src/views/indexData/components/logDrawer.vue
-->
<script setup lang="ts">
import { ref } from "vue";
import type { DrawerProps } from "element-plus";
import { getLogInfo } from "@/api/indexData";
import dayjs from "dayjs";
const drawer = ref(false);
const quotaId = ref();
const direction = ref<DrawerProps["direction"]>("rtl");
const logList = ref<any>([]);
const getQuotaLogInfoApi = async () => {
  const { code, data } = await getLogInfo({ sourceDataId: quotaId.value });
  if (code === 200) {
    logList.value = data;
  }
};
function cancelClick() {
  drawer.value = false;
}
const open = row => {
  quotaId.value = row.id;
  getQuotaLogInfoApi();
  drawer.value = true;
};
defineExpose({
  open
});
</script>

<template>
  <div>
    <el-drawer v-model="drawer" :direction="direction">
      <template #header>
        <h4>指标日志</h4>
      </template>
      <template #default>
        <div>
          <div v-for="(item, index) in logList" :key="index" class="w-full">
            <div>
              <el-text class="font-semibold">操作用户</el-text>
              <div
                class="bg-gray-100 pl-3 pb-2 pt-2 rounded text-sm text-gray-500"
              >
                {{ item.createUser }}
              </div>
            </div>
            <div class="mt-4">
              <el-text class="font-semibold">更新时间</el-text>
              <div
                class="bg-gray-100 pl-3 pb-2 pt-2 rounded text-sm text-gray-500"
              >
                {{
                  item.createTime
                    ? dayjs(item.createTime).format("YYYY-MM-DD HH:mm:ss")
                    : ""
                }}
              </div>
            </div>
            <div class="mt-4">
              <el-text class="font-semibold">更新内容</el-text>
              <div
                class="bg-gray-100 pl-3 pr-3 pb-2 pt-2 rounded text-sm text-gray-500"
              >
                {{ item.updateContent }}
              </div>
              <el-divider />
            </div>
          </div>
        </div>
      </template>
      <template #footer>
        <div>
          <el-button @click="cancelClick">关闭</el-button>
        </div>
      </template>
    </el-drawer>
  </div>
</template>
