<template>
  <view class="order-list">
    <view class="order-item" v-for="(item, index) in orderList" :key="index">
      <view class="order-header">
        <text class="order-name">{{ item.orderName }}</text>
        <text class="order-number">{{ item.orderNumber }}</text>
      </view>
      <view class="product-list">
        <view
          class="product-item"
          v-for="(product, pIndex) in item.products"
          :key="pIndex"
        >
          <view class="product-info">
            <view class="product-img">
              <image :src="product.imageUrl" mode="aspectFit"></image>
              <view class="tag" v-if="product.tag">{{ product.tag }}</view>
            </view>
            <view class="product-details">
              <text class="product-name">{{ product.name }}</text>
              <text class="product-spec">{{ product.spec }}</text>
              <text class="product-unit">{{ product.unit }}</text>
            </view>
          </view>
          <button class="evaluate-btn" @click="evaluateOrder(product)">
            评价
          </button>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import { request, NavgateTo } from "../../../utils";

export default {
  data() {
    return {
      orderList: [
        {
          orderName: "衡水商贸国际公司",
          orderNumber: "4534534255",
          products: [
            {
              imageUrl: "http://localhost:8080/product.png",
              tag: "当日达",
              name: "货品名称",
              spec: "货品规格",
              unit: "货品单位",
            },
            {
              imageUrl: "http://localhost:8080/product.png",
              tag: "当日达",
              name: "货品名称",
              spec: "货品规格",
              unit: "货品单位",
            },
          ],
        },
        {
          orderNumber: "54352342331",
          products: [
            {
              imageUrl: "http://localhost:8080/product.png",
              tag: "",
              name: "货品名称",
              spec: "货品规格",
              unit: "货品单位",
            },
            {
              imageUrl: "http://localhost:8080/product.png",
              tag: "",
              name: "货品名称",
              spec: "货品规格",
              unit: "货品单位",
            },
            {
              imageUrl: "http://localhost:8080/product.png",
              tag: "",
              name: "货品名称",
              spec: "货品规格",
              unit: "货品单位",
            },
          ],
        },
      ],
    };
  },
  methods: {
    evaluateOrder(item) {
      console.log("🚀 ~ evaluateOrder ~ orderNumber:", item);
      NavgateTo(`../evaluate/index?item=${JSON.stringify(item)}`);
    },
  },
};
</script>

<style>
@import url("./awaitRated.css");
</style>