<script setup lang="ts">
import { ref, onMounted } from "vue"
import { httpList } from "/@/api/InvoiceSales/currentcyAssOrderRecord";
import { tyStatusOptions } from "/@/utils/status";
import { useAsync } from "/@/hooks/core"
import { ElMessage, ElTable } from "element-plus"

const emit = defineEmits(['list'])

const props = defineProps<{
  platformType: string,
  customerNo: String,
  companyNo: string
}>();

const tableRef = ref<InstanceType<typeof ElTable> | null>(null);


  const sendStatusOptions = [
  { value: "0", label: "待与供应商确认" },
  { value: "1", label: "待入库" },
  { value: "2", label: "部分入库" },
  { value: "3", label: "入库完成" },
  { value: "4", label: "已取消订单" }
];

const { run, data, loading } = useAsync({
  isList: true,
  success: (data) =>
    params.value.total = data.count
});

const initialParams = {
  page: 1,
  size: 15,
  total: 0,
  good_status: 2,
  status: [0],
}

const state = ref(1)

const list = ref<any[]>([]);
const params = ref({ ...initialParams });


function handleList() {
  if (list.value.length === 0) {
    ElMessage.warning("请选择通用订单");
    return;
  }

  // const isHasWaitSupplierConfirm = list.value.some(({cgd}) => cgd.cgd_status === '0')

  // if (isHasWaitSupplierConfirm) {
  //   ElMessage.warning("不能选择采购单状态为`待与供应商确认`的通用订单");
  //   return;
  // }

  emit('list', list.value)
  tableRef.value?.clearSelection();
}

const requestList = () => {

  run(httpList({
   ...params.value,
   platform_type: props.platformType,
   customerNo: props.customerNo,
   companyNo: props.companyNo,
   status: Number(state.value) === -1 ?  [-1, ...params.value.status] :  params.value.status
  })
);
}
const retrun_status = [
  {
    value: 1,
    label: "已回款"
  },
  {
    value: -1,
    label: "无回款限制"
  },
];


onMounted(() => requestList());


defineExpose({
  search: () => requestList()
})
</script>

<template>
  <ElRow class="mb-[10px]">
    <!-- <ElCol :span="4" style="margin-right: 10px">
      <ElSelect style="width:100%" :modelValue="String(params.status[0])" size="small" disabled>
        <ElOption v-for="{ label, value } in tyStatusOptions" :label="label" :value="value" :key="value" />
      </ElSelect>
    </ElCol> -->

    <ElCol :span="4" style="width:100%">
      <ElSelect v-model="state" size="small" placeholder="关联已回款状态">
        <ElOption v-for="{ label, value } in retrun_status" :label="label" :value="value" :key="value" />
      </ElSelect>
    </ElCol>

    <ElCol :span="19" class="fr">
      <el-button style="float:right" size="small" type="primary" @click="() => {requestList()}">搜索</el-button>
      <el-button style="float:right;margin-right:10px" size="small" @click="() =>{ params = initialParams;state = 1;requestList()}">重置</el-button>
    </ElCol>
  </ElRow>

  <ElTable ref="tableRef" border size="small" :data="data" class="mt-[10px]" @selection-change="val => list = val"
    v-loading="loading">
    <ElTableColumn type="selection" fixed="left" />
    <ElTableColumn label="通用订单编号" min-width="160" prop="tyCode" show-overflow-tooltip />
    <ElTableColumn label="确认单编号" min-width="160" prop="orderCode" show-overflow-tooltip />
    <ElTableColumn label="销售订单主编号" min-width="160" prop="cxCode" show-overflow-tooltip />
    <ElTableColumn label="商品编号" min-width="160" prop="goodNo" show-overflow-tooltip />
    <ElTableColumn label="商品名称" min-width="160" prop="goodName" show-overflow-tooltip />


    <ElTableColumn label="采购单状态" min-width="130" show-overflow-tooltip>
      <template #default="scope">
        <el-tag>
          {{ sendStatusOptions.find(({value}) => value === scope.row.cgd.cgd_status)?.label || '--' }}
        </el-tag>
      </template>
    </ElTableColumn>

    <ElTableColumn label="类目编码" min-width="130" show-overflow-tooltip>
      <template #default="scope">
        {{ scope.row.good ? scope.row.good.inv_cat_code : '' }}
      </template>
    </ElTableColumn>
    <ElTableColumn label="货物和劳务名称" min-width="130" show-overflow-tooltip>
      <template #default="scope">
        {{ scope.row.good ? scope.row.good.inv_cat_name : '' }}
      </template>
    </ElTableColumn>
    <ElTableColumn label="开票商品名称" min-width="160" show-overflow-tooltip>
      <template #default="scope">
        {{ scope.row.good ? scope.row.good.inv_good_name : '' }}
      </template>
    </ElTableColumn>
    <ElTableColumn label="开票税率" min-width="80" show-overflow-tooltip>
      <template #default="scope">
        {{ scope.row.good ? scope.row.good.inv_tax : '' }}
      </template>
    </ElTableColumn>

    <ElTableColumn label="申请人" prop="apply_name" width="100px" show-overflow-tooltip />
    <ElTableColumn label="买入方公司" min-width="160" prop="customerName" show-overflow-tooltip />
    <ElTableColumn label="卖出方公司" min-width="160" prop="companyName" show-overflow-tooltip />
    <ElTableColumn label="下单数量" width="80" prop="goodNum" show-overflow-tooltip>
      <template #default="scope"> {{ scope.row.qrd ? scope.row.qrd.goodNum : "" }}</template>
    </ElTableColumn>
    <ElTableColumn label="销售单价" width="80" prop="goodPrice" show-overflow-tooltip>

      <template #default="scope">{{ scope.row.qrd ? scope.row.qrd.goodPrice : "" }}</template>
    </ElTableColumn>

 <ElTableColumn label="关联已回款状态" width="110" prop="pay_status" show-overflow-tooltip>
  <template #default="scope">
        <ElTag>
          {{String(scope.row.status) === '-1' ? '未回款' : '已回款' }}
        </ElTag>
      </template>
 </ElTableColumn>


    <!-- <ElTableColumn label="对账状态" width="80" prop="status" show-overflow-tooltip>

      <template #default="scope">
        <ElTag>
          {{ tyStatusOptions.find(c => c.value == scope.row.status)?.label || '--' }}
        </ElTag>
      </template>
    </ElTableColumn> -->

    <ElTableColumn label="税率" width="80" prop="goodPrice" show-overflow-tooltip>
          <template #default="scope">{{ scope.row.qrd ? `${scope.row.qrd.tax}%` : "" }}</template>
     </ElTableColumn>

    <ElTableColumn label="下单时间" width="100" prop="addtime" show-overflow-tooltip />
  </ElTable>

  <div class="flex justify-between w-full mt-[10px]">
    <ElPagination v-model:currentPage="params.page" v-model:pageSize="params.size"
      layout="total,prev, pager, next, jumper" :total="params.total" :background="true" :small="true"
      @size-change="requestList" @current-change="requestList" />
    <ElButton type="primary" size="small" @click="handleList">添加</ElButton>
  </div>
</template>
