<!-- 商品查看 - 客服 -->
<template>
  <div v-if="formData != null" style="text-align: center;margin-top: 50px;font-size: 14px;">
    该商品暂无客服记录
  </div>
  <div v-else class="service-container" v-for="item in formData.list" :key="item">
    <h3 class="rating-title">202401220411-01</h3>
    <div class="content">
        <div class="service-image">
            <!-- 请将此处替换为实际评价图片链接 -->
            <img src="https://mall-ffkj.oss-cn-guangzhou.aliyuncs.com/745d5acbbda2928b6982c6d05812f2c68c6f3c487899d6bc55b0c6cc05775f64.png" alt="评价图片" />
        </div>
        <div class="details">
            <p class="first-service">评价：五星</p>
            <p class="service-comment" title="正确处理了问题">摘要：正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题正确处理了问题</p>
        </div>
    </div>
  </div>

</template>
<script lang="ts" setup>
	import { propTypes } from '@/utils/propTypes'
  import * as TradeOrderApi from '@/api/mall/trade/order'
	const props = defineProps({
    id: propTypes.number.def(undefined), // 商品ID
    showPickUp: propTypes.bool.def(true) // 显示核销按钮
  })
  const formData = ref<TradeOrderApi.OrderVO>({
    logs: []
  })
  const id = props.id
  const getDetail = async () => {
    console.log(id)
    if (id) {
      const res = (await TradeOrderApi.getOrder(id)) as TradeOrderApi.OrderVO
      // 没有表单信息则关闭页面返回
      if (!res) {
        message.error('交易商品不存在')
        close()
      }
      formData.value = res
    }
  }

	const message = useMessage() // 消息弹窗


	onMounted(async () => {
    getDetail()
	})
</script>
<style src="./Components.css"  lang="scss" scoped> </style>