<template>
  <Dialog title="操作记录" v-model="dialogVisible" style="max-height: 75%;min-height: 650px;min-width: 350px" >
    <el-scrollbar height="65vh">
      <el-col :offset="3" :span="17">
        <div class="block">
          <el-timeline>
            <el-timeline-item
              v-for="(item, index) in recordList"
              :key="index"
              type='primary'
            >
              <div style="margin-top: 10px;">
              <p style="font-weight: 750;margin-bottom: 4px">
                操作：{{ item.subType }}
              </p>
              <el-card :body-style="{ padding: '10px'}">
                <label style="margin-right: 30px; font-weight: normal">
                  操作人：{{ item.nickname }}
                  <el-tag size="small" type="info">{{ item.deptName }}</el-tag>
                </label>
                <label v-if="item.createTime" style="font-weight: normal">操作时间：</label>
                <label style="font-weight: normal; color: #8a909c">
                  {{ formatDate(item?.createTime) }}
                </label>

                <p v-if="item.action"> 操作内容：{{ item.action }} </p>
              </el-card>
              </div>
            </el-timeline-item>
          </el-timeline>
        </div>
      </el-col>
    </el-scrollbar>
  </Dialog>
</template>
<script lang="ts" setup>
// import { formatDate } from '@/utils/formatTime'
// import { propTypes } from '@/utils/propTypes'
// import { DICT_TYPE } from '@/utils/dict'
// import {DisbursementApi} from "@/api/bpm/disbursement";
import { ref } from 'vue'
import * as LayerLogApi from '@/api/system/layerLog'
import {formatDate} from "../../../utils/formatTime";
let recordList = ref([])
let dialogVisible = ref(false);
const queryParams = reactive({
  pageNo: 1,
  pageSize: 10,
  projectId: undefined
})
/** 打开弹窗 */
const open = async (id?: number) => {
    dialogVisible.value = true
    if(id){
        queryParams.projectId = id
        let res =  await LayerLogApi.pageProjectLayerLog(queryParams)
        recordList.value = res.list
    }
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗

defineOptions({ name: 'RecordForm' })

// defineProps({
//   loading: propTypes.bool, // 是否加载中
// })

//
// const handleFormDetail = async (row) => {
//     fApi.value.fapi.btn.show(false)
//     fApi.value?.fapi?.resetBtn.show(false)
//     fApi.value?.fapi?.disabled(true)
// }
//
/** 刷新数据 */
const emit = defineEmits(['refresh']) // 定义 success 事件，用于操作成功后的回调
const refresh = () => {
  emit('refresh')
}

/** 操作类型对应的颜色 */

</script>

<style scoped>

</style>
