<template>
  <el-dialog v-model="visible" title="模版版本轨迹查询" width="80%" top="5vh" append-to-body destroy-on-close>
    <el-table v-loading="loading" :data="versionLogList" border style="width: 100%">
      <el-table-column prop="templateCode" label="模版ID" align="center" />
      <el-table-column prop="versionNumber" label="版本号" align="center" />
      <el-table-column prop="printType" label="打印类型" align="center" />
      <el-table-column prop="templateType" label="模版格式" align="center" />
      <el-table-column prop="outputType" label="输出格式" align="center" />
      <el-table-column prop="allowSeal" label="是否允许签章" align="center">
        <template #default="scope">
          <dict-tag :options="sys_yes_no" :value="scope.row.allowSeal" />
        </template>
      </el-table-column>
      <el-table-column prop="versionActiveStatus" label="当前启用状态" align="center">
        <template #default="scope">
          <dict-tag :options="sys_yes_no" :value="scope.row.versionActiveStatus" />
        </template>
      </el-table-column>
      <el-table-column prop="createTime" label="创建日期" align="center">
        <template #default="scope">
          <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="enableDate" label="启用起期" align="center">
        <template #default="scope">
          <span>{{ parseTime(scope.row.enableDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="enableBy" label="启用操作人" align="center" />
      <el-table-column prop="disableDate" label="停用日期" align="center">
        <template #default="scope">
          <span>{{ parseTime(scope.row.disableDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="disableBy" label="停用操作人" align="center" />
    </el-table>
  </el-dialog>
</template>

<script setup lang="ts">
import { ref, watch, getCurrentInstance, computed, onMounted } from 'vue';
import { getVersionLogList } from '@/api/print/template';

const { proxy } = getCurrentInstance() as ComponentInternalInstance;

const props = defineProps({
  modelValue: Boolean,
  templateCode: String
});

const emit = defineEmits(['update:modelValue']);

const visible = computed({
  get: () => props.modelValue,
  set: (value) => emit('update:modelValue', value)
});

const { sys_yes_no } = proxy?.useDict('sys_yes_no') || {};

const loading = ref(false);
const versionLogList = ref<any[]>([]);

const getVersionLogData = async () => {
  if (!props.templateCode) {
    versionLogList.value = [];
    return;
  }

  try {
    loading.value = true;
    const res = await getVersionLogList({ templateCode: props.templateCode });

    if (res.code === 200) {
      versionLogList.value = res.data || [];
    } else {
      proxy?.$modal.msgError(res.msg || '获取数据失败');
      versionLogList.value = [];
    }
  } catch (error) {
    proxy?.$modal.msgError('请求异常，请稍后重试');
    versionLogList.value = [];
  } finally {
    loading.value = false;
  }
};

// 监听模板编码变化
watch(
  () => props.templateCode,
  (newVal, oldVal) => {
    if (newVal && newVal !== oldVal) {
      getVersionLogData();
    }
  },
  { immediate: true }
);

// 初始加载
onMounted(() => {
  if (props.templateCode) {
    getVersionLogData();
  }
});
</script>
