<template>
  <div class="max-w-1/2">
    <dl v-for="item in list" :key="item.typeId" class="flex mb-1 items-center">
      <dt>
        <el-button type="primary" plain size="small" class="mr-2">{{ item.name }}</el-button>
      </dt>
      <dd class="flex">
        <img :src="item.img" alt="" />
        <p>
          <span class="text-xs text-[#666]">数量：</span
          ><el-input v-model="item.num" size="small" class="w-20 mr-2"></el-input>
        </p>
        <p>
          <span class="text-xs text-[#666]">原价：</span
          ><el-input v-model="item.sale" size="small" class="w-20 mr-2"></el-input>
        </p>
        <p>
          <span class="text-xs text-[#666]">售价：</span
          ><el-input v-model="item.amount" size="small" class="w-20 mr-2"></el-input>
        </p>
      </dd>
    </dl>
  </div>
</template>

<script setup lang="ts">
const props = defineProps<{ list: any[] }>()
</script>
