<script setup lang="ts">
import { shallowRef, shallowReactive, ref } from "vue";
import SearchBatchMain from "./search-batch-main.vue";
import SearchBatch from "./search-batch.vue";

import { useCompany } from "/@/hooks/core/useCompany";
import { useTask } from "/@/hooks/core";
import { httpList, httpBatchTag } from "/@/api/parameter/tagManage";
import RemoteSelect from "/@/components/RemoteSelect";
import { ElMessage } from "element-plus";


const emit = defineEmits(["reload", "save-btn-click"]);

const { currentCompany } = useCompany()
const currentSearchMode = shallowRef(3);

const showModel = shallowRef(false);


const batchTagTask = useTask({
  success(){
    ElMessage.success('添加成功')
    showModel.value = false
    emit('reload')
  }
})
const searchBatchMainRef = ref<InstanceType<typeof SearchBatchMain> | null>(null);
const searchBatchRef = ref<InstanceType<typeof SearchBatch> | null>(null)

const tag_id = ref('')

const payload = shallowReactive({ companyNo: "", platform_type: "" });

async function show(_companyNo, _platform_type) {
  showModel.value = true;
  payload.companyNo = currentCompany.value.companyNo;
  payload.platform_type = "";
}

async function handleConfirm(options: any) {
  if (!tag_id.value) {
    ElMessage.warning('请选择开票标签')
    return
  }

  let sourceSequenceNos = []
  let selected = []

  if(options){
    sourceSequenceNos = options.sourceSequenceNos
    selected = options.selected
  } else {
    const current = currentSearchMode.value === 2 ? searchBatchRef : searchBatchMainRef
    const response = await current.value!.getResponse()
    sourceSequenceNos = response.sourceSequenceNos
    selected = response.selected
  }


  if(sourceSequenceNos.length !== selected.length){
    const isMain = currentSearchMode.value === 3
    const codes = selected.map((item) => isMain ? item.cxCode : item.sequenceNo)
    const notFindOrders = sourceSequenceNos.filter(_v => !codes.includes(_v))
    ElMessage.warning('未找到订单:"' + notFindOrders.join('、'))
    return
  }

  const idArr = selected.map(({ id }) => id)
  const parameter = { idArr, tag_id: tag_id.value }
  batchTagTask.run(httpBatchTag(parameter))
  // emit("save-btn-click", selected);
  // showModel.value = false;
}

function handleClose(){
  showModel.value = false
  tag_id.value = ''
}

defineExpose({ show });
</script>

<template>
  <el-dialog top="5vh" center v-model="showModel" :close-on-click-modal="false" :close-on-press-escape="false"
    append-to-body destroy-on-close title="C端订单批量添加开票标签" :width="'1040px'" @close="handleClose">
    <div v-loading="batchTagTask.loading">
      <ElRadioGroup v-model="currentSearchMode">
        <ElRadio :label="3">批量查找(销售订单主编号)</ElRadio>
        <ElRadio :label="2">批量查找(销售订单编号)</ElRadio>
      </ElRadioGroup>

      <div class="flex my-[10px]">
        <p>
          <span style="color:red">*</span>
          开票标签:

          <RemoteSelect v-model="tag_id" :api="httpList" request-prop="tag_name" response-label-prop="tag_name"
            response-val-prop="id" :pro-data="() => ({ type: '4' })" placeholder="开票标签" />
        </p>
      </div>

      <template v-if="currentSearchMode === 2">
        <SearchBatch :noTag="tag_id == ''" ref="searchBatchRef" :payload="payload" @confirm="handleConfirm" />
      </template>

      <template v-if="currentSearchMode === 3">
        <SearchBatchMain :noTag="tag_id == ''" ref="searchBatchMainRef" :payload="payload" @confirm="handleConfirm" />
      </template>

      <div class="w-full mt-[10px] flex justify-end">
        <ElButton type="primary" @click="handleConfirm">保存</ElButton>
      </div>
    </div>
  </el-dialog>
</template>

<style lang="scss" scoped>
:deep(.el-pagination) {
  justify-content: flex-start !important;
}

.search {
  padding: 0px !important;
}
</style>
