<script setup lang="ts">
import { ref , unref} from "vue";
import { ElMessage } from "element-plus"
import { httpBatchSendOrderList } from "/@/api/postSupplierOrder/sendOrderRecord";
import { useAsync } from "/@/hooks";

const emit = defineEmits(['add']);
const props = defineProps(['companyNo', 'supplierNo']);

const sourceText = ref("");
const selected = ref([]);

const {
  run,
  loading,
  data: tableData
} = useAsync({ isList: true });


const $space = " ";
const $wrap = "\n";
function replaceTextWrapAndSpace(text = "") {
  if (!text) return "";
  let _text = text;
  const hasSpace = _text.includes($space);
  const hasWrap = _text.includes($wrap);
  if (hasSpace) _text = _text.split($space).join("");
  if (hasWrap) _text = _text.split($wrap).join("");
  return _text;
}

function handleEnter() {
  const text = replaceTextWrapAndSpace(sourceText.value);
  /* 统一替换字符 **/
  const parserText = text
    .replace(/[，。；、; .]/g, ",")
    .replace(/(^,*)|(,*$)/g, "");
  const cgdNoArr = parserText.split(",");
  /* 去掉回车和空格 **/
  if (parserText.length === 0 || cgdNoArr.length === 0) {
    ElMessage.warning("不能解析空文本");
    sourceText.value = text;
    return;
  }

  run(httpBatchSendOrderList({ size: 100, orderCode: cgdNoArr, companyNo: props.companyNo, supplierNo: props.supplierNo,status:0 }));
  sourceText.value = "";
}

function confirm() { 
  if (tableData.value.length === 0) {
    ElMessage.warning('请选择至少一个发货运单')
    return
  }

    const zeros = tableData.value.filter(({post_fee}) => Number(post_fee) === 0);
  if (zeros.length !== 0) {
    ElMessage.warning(`发货运单${zeros.map(({TrackCode}) => TrackCode).join('、')}添加失败,物流费用不能为0`)
    return;
   }

  emit('add', unref(tableData))
}
</script>

<template>
  <div v-loading="loading">
    <ElInput :rows="4" v-model="sourceText" style="margin-bottom: 10px"
      placeholder="输入销售单编码(小于100条)，系统支持的分割符为逗号(,)、句号(.)、分号(;)、顿号(、)，回车后开始解析。" type="textarea"
      @keydown.enter="handleEnter" />

    <el-table border size="small" style="width: 100%" :data="tableData" max-height="450px">
      <el-table-column type="index" label="序号" width="55" />
      <el-table-column prop="TrackCode" label="发货运单编号" min-width="150px" show-overflow-tooltip />
      <el-table-column prop="outChildCode" label="发货工单编号" min-width="160px" show-overflow-tooltip />
      <el-table-column prop="orderCode" label="销售订单编号" min-width="150px" show-overflow-tooltip />
      <!-- <el-table-column prop="cgdNo" label="采购单编号" min-width="150px"  /> -->
      <ElTableColumn prop="companyName" label="业务公司" min-width="180px" show-overflow-tooltip />
      <ElTableColumn prop="supplierName" label="物流供应商" min-width="180px" show-overflow-tooltip />
        <el-table-column label="物流费用" min-width="150px" prop="post_fee" show-overflow-tooltip></el-table-column>
        <ElTableColumn label="备注" prop="remark" min-width="140px" show-overflow-tooltip />
      <el-table-column label="创建人" prop="apply_name" min-width="80px" show-overflow-tooltip />
      <el-table-column label="创建时间" prop="create_time" min-width="140px" show-overflow-tooltip />
    </el-table>


    <div class="flex justify-end w-full mt-[10px]">
      <el-button type="primary" size="small" @click="confirm">保存</el-button>
    </div>
  </div>
</template>
