<template>
  <view class="result-container">
    <el-button type="primary" @click="handleGetPrice">获取价格</el-button>
    <el-input type="textarea" style="width: 400px; height: 400px" rows="10" resize="none" readonly></el-input>
  </view>
</template>

<script setup>
import { ref, watch } from "vue";
import { ElMessage } from "element-plus";
import { getProductPrice } from "@/api/product/index.js";

const props = defineProps({
  data: {
    type: Object,
    required: true,
  },
});

const emits = defineEmits(["verifyCraftData"]);

const handleGetPrice = () => {
  emits("verifyCraftData", (result) => {
    let { valid, message } = result;
    if (!valid) {
      ElMessage({
        message: message || "报价数据验证失败",
        type: "error",
        grouping: true,
      });
      return;
    }
    getProductPrice(props.data).then((res) => {
      console.log(res);
    });
  });
};
</script>
<style lang="scss" scoped>
.result-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}
</style>
