<template>
  <el-dialog v-model="visible" title="清单二维码">
    <div id="printContainer">
      <el-divider content-position="left"> 清单信息 </el-divider>
      <el-descriptions :column="2" border>
        <el-descriptions-item label="清单名称">
          {{ info.NAME }}
        </el-descriptions-item>
        <el-descriptions-item label="排查清单类型">
          {{ info.SCREENTYPENAME }}
        </el-descriptions-item>
        <el-descriptions-item label="所属部门">
          {{ info.DEPARTMENT_NAME }}
        </el-descriptions-item>
        <el-descriptions-item label="所属岗位">
          {{ info.POST_NAME }}
        </el-descriptions-item>
        <el-descriptions-item label="排查周期">
          {{ info.PERIODNAME }}
        </el-descriptions-item>
        <el-descriptions-item label="清单类型">
          {{ info.TYPENAME }}
        </el-descriptions-item>
      </el-descriptions>
      <layout-qr-code :src="info.LISTMANAGER_ID" />
      <el-divider content-position="left">APP-待排查-清单扫描</el-divider>
    </div>
    <template #footer>
      <el-button @click="visible = false">关闭</el-button>
      <el-button v-print="'#printContainer'" type="primary">打 印</el-button>
    </template>
  </el-dialog>
</template>

<script setup>
import { useVModel } from "@vueuse/core";
import LayoutQrCode from "@/components/qr_code/index.vue";

const props = defineProps({
  visible: {
    type: Boolean,
    required: true,
    default: false,
  },
  info: {
    type: Object,
    required: true,
    default: () => ({}),
  },
});
const emits = defineEmits(["update:visible"]);
const visible = useVModel(props, "visible", emits);
</script>

<style scoped lang="scss"></style>
