<template>
  <a-row v-if="isTime && show" style="width:100%;margin-bottom:10px;">
    <a-col flex="100px" style="display: flex;align-items: center;justify-content: right;padding-right: 7px;">{{ props.data.label }}</a-col>
    <a-col flex="auto">
      <a-input  v-model:value="nowTime" readOnly :disabled="disabled">
        <template #suffix>
          <FieldTimeOutlined />
        </template>
      </a-input>
    </a-col>
  </a-row>
  <a-row  v-else-if="!isTime && show"  style="width:100%;margin-bottom:10px;" >
    <a-col flex="100px" style="display: flex;align-items: center;justify-content: right;padding-right: 7px;">{{ props.data.label }}</a-col>
    <a-col flex="auto">
      <a-input v-model:value="userName" readOnly :disabled="disabled">
        <template #suffix>
          <UserOutlined />
        </template>
      </a-input>
    </a-col>
  </a-row>
  

</template>

<script setup lang="ts">
import { ref, defineProps, onMounted } from 'vue'
import { UserOutlined, FieldTimeOutlined } from '@ant-design/icons-vue';
import dayjs from 'dayjs';
const props = defineProps(['data', 'createOrModifyData', 'isUpdate', 'isDetail'])
const show = props.data.display && (Object.keys(props.data).includes('ifShow')? props.data.ifShow: true)
const disabled = Object.keys(props.data.componentProps).includes('disabled')? props.data.componentProps.disabled: false
const isTime = ['createtime', 'modifytime'].includes(props.data.type)
const nowTime = ref(dayjs().format('YYYY-MM-DD HH:mm:ss'))
const userName = ref(localStorage.getItem('fireUserLoginName'))
onMounted(() => {
  if(props.isUpdate || props.isDetail){
    nowTime.value = props.createOrModifyData[props.data.field]
    userName.value = props.createOrModifyData[props.data.field]
  }
})
</script>

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