<template>
  <el-dialog v-model="show" :title="title" width="60%" @close="handleClose">
    <el-scrollbar height="600px" style="background-color: black; color: #ffffff; padding: 12px">
      <p v-for="(item, index) in logsText" :key="index" style="margin-bottom: 3px">{{ item }}</p>
    </el-scrollbar>
  </el-dialog>
</template>

<script setup lang="ts">
import { getLogs } from '@/api'
const show = ref(false)
const logsText = ref()
const title = ref()

const init = async (row: any, logsMinutes: number) => {
  title.value = row.name + '日志'
  const res: any = await getLogs({
    containerId: row.containerId,
    timeInMinutes: logsMinutes
  })
  if (res.code === 200) {
    logsText.value = res.data
    console.log(logsText.value)
  }
}

const handleClose = () => {
  show.value = false
  logsText.value = null
}

defineExpose({
  show,
  init
})
</script>

<style scoped></style>
