<script setup lang="tsx">
import { PropType, ref } from 'vue'
import { Descriptions, DescriptionsSchema } from '@/components/Descriptions'
// import { Icon } from '@/components/Icon'
import { ElImage, ElButton, ElMessage, ElMessageBox } from 'element-plus'
import { passAddItem } from '@/api/order'

const props = defineProps({
  currentRow: {
    type: Object as PropType<any>,
    default: () => undefined
  },
  isAuth: {
    type: Boolean,
    default: false
  }
})
//
// const ishidden = computed(() => props.currentRow?.type === 1)
// const renderTag = (enable?: boolean) => {
//   return <ElTag type={!enable ? 'danger' : 'success'}>{enable ? '启用' : '禁用'}</ElTag>
// }

const menu = [
  {
    field: 'id',
    label: '编号'
  },
  {
    field: 'add_time',
    label: '创建时间'
  },
  {
    field: 'area',
    label: '面积'
  },
  {
    field: 'status_chs',
    label: '审核状态',
    slots: {
      default: (data) => {
        if (props.isAuth && data.status == 0) {
          return (
            <>
              <ElButton type="primary" link size="small" onClick={() => goPassAddItem(data)}>
                通过
              </ElButton>
              <ElButton type="primary" link size="small">
                拒绝
              </ElButton>
            </>
          )
        } else {
          return <>{data.status_chs}</>
        }
      }
    }
  },
  {
    field: 'cart_infos',
    label: '商品',
    span: 24,
    slots: {
      default: (data) => {
        const arr = data.cart_infos
        return (
          <>
            {arr.map((item) => {
              return (
                <>
                  <div>
                    {'产品：'}
                    <ElButton type="primary" link size="small">
                      {item.productInfo.name}
                    </ElButton>
                    {' 数量：'}
                    <ElButton type="primary" link size="small">
                      {item.num}
                    </ElButton>
                    {' 规格：'}
                    <ElButton type="primary" link size="small">
                      {item.attrInfo.suk}
                    </ElButton>
                  </div>
                </>
              )
            })}
          </>
        )
      }
    }
  },
  {
    field: 'certificate_images',
    label: '封面',
    span: 24,
    slots: {
      default: (data) => {
        return (
          <>
            <ElImage
              src={data.certificate_images}
              preview-src-list={[data.certificate_images]}
              style="width: 100px;height: 100px"
            />
          </>
        )
      }
    }
  },
  {
    field: 'certificate_images_chs',
    label: '详情图',
    span: 24,
    slots: {
      default: (data) => {
        return (
          <>
            {data.certificate_images_chs.map((item) => {
              return (
                <>
                  <ElImage
                    src={item}
                    preview-src-list={data.certificate_images_chs}
                    style="width: 100px;height: 100px"
                  />
                </>
              )
            })}
          </>
        )
      }
    }
  }
]
const emit = defineEmits(['passAddItem']) // 定义事件
const detailSchema = ref<DescriptionsSchema[]>(menu)
const goPassAddItem = async (e) => {
  await passAddItem(e.id)
  ElMessage({
    type: 'success',
    message: `审核完成`
  })
  emit('passAddItem')
}
const open = () => {
  ElMessageBox.confirm('您确定拒绝当前增项?', 'Warning', {
    confirmButtonText: '确认',
    cancelButtonText: '取消',
    type: 'warning'
  })
    .then(() => {
      // ElMessage({
      //   type: 'success',
      //   message: 'Delete completed',
      // })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: 'Delete canceled'
      })
    })
}
</script>

<template>
  <Descriptions v-for="item in currentRow.add_item" :schema="detailSchema" :data="item || {}" />
</template>
