<!-- 
    TODO 成本管理 / 提单费用
 -->
<template>
  <el-main class="lading-bill-money">
    <el-form
      ref="ladingBillMoneyFormRef"
      :model="ladingBillMoneyParams"
      inline
    >
      <el-form-item
        prop="feeSetType"
        class="item-search"
      >
        <BaseSelect
          v-model:modelValue="ladingBillMoneyParams.feeSetType"
          clearable
          :filterable="false"
          :options="selectfeeSetTypeList"
          placeholder="结算类型"
        />
      </el-form-item>
      <el-form-item
        prop="feeItemCategory"
        class="item-search"
      >
        <BaseSelect
          v-model:modelValue="ladingBillMoneyParams.feeItemCategory"
          clearable
          :filterable="false"
          :options="storeFeesetList.getFeeItemCategoryList"
          placeholder="费项类型"
        />
      </el-form-item>
      <el-form-item
        prop="billCodeType"
        class="item-search"
      >
        <BaseSelect
          v-model:modelValue="ladingBillMoneyParams.billCodeType"
          :filterable="false"
          clearable
          :options="storeFinancialType.getBillCodeTypeList"
          placeholder="单号类型"
        />
      </el-form-item>
      <el-form-item
        prop="waybillNumber"
        class="item-search"
      >
        <el-input
          v-model="ladingBillMoneyParams.waybillNumber"
          clearable
          placeholder="单号"
        />
      </el-form-item>
      <el-form-item>
        <el-button
          :icon="Search"
          :loading="ladingBillMoneyListState.loading"
          @click="searchBtn"
        >
          搜索
        </el-button>
        <el-button
          class="reset-btn"
          :icon="RefreshRight"
          :loading="ladingBillMoneyListState.loading"
          @click="resetBtn"
        >
          重置
        </el-button>
        <el-button
          :icon="Refresh"
          :loading="ladingBillMoneyListState.loading"
          type="success"
          plain
          @click="hanleTailRecalculation"
        >
          尾程重算
        </el-button>
      </el-form-item>
    </el-form>
    <!-- 列表 -->
    <VxeBasicTable
      v-bind="ladingBillMoneyListOptions"
      ref="ladingBillMoneyListTableRef"
      @checkbox-all="handleSelectionChange"
      @checkbox-change="handleSelectionChange"
    >
      <!-- 操作 -->
      <template #actions="{ row }">
        <DropDownButtons
          :model-value="row"
          :action-options="getActionOptions"
          @click-change="handleClickChange"
          @visible-change="changeVisibleChange($event, row)"
        />
      </template>
    </VxeBasicTable>
    <!-- 分页 -->
    <el-pagination
      v-model:current-page="ladingBillMoneyParams.pageNum"
      :page-sizes="[10, 20, 40, 80, 100]"
      :page-size="ladingBillMoneyParams.pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="ladingBillMoneyParams.total"
      background
      @size-change="sizeChange"
      @current-change="currentChange"
    />
  </el-main>
  <!-- 提单费用明细列表 -->
  <LadingBillMoneyDetailList ref="ladingBillMoneyDetailListRef" />
  <!-- 尾程重算 -->
  <CourseReturn
    ref="courseReturnRef"
    @save-return="hanleSaveReturn"
  />
</template>
<script lang="ts" setup name="ladingBillMoney">
import { useLadingBillMoney, useFinancialBillListModel } from "@/composables/lading/useLadingBillMoney";
import { Search, RefreshRight, Refresh } from "@element-plus/icons-vue";
import BaseSelect from "@/components/QuerySelect/BaseSelect.vue";
import DropDownButtons from "@/components/DropDownButtons/index.vue";
import { VxeBasicTable } from "@/components/VxeTable";
import { useInitTableHeight } from "@/hooks/useInitTableHeight";
import LadingBillMoneyDetailList from './ladingBillMoneyDetailList.vue';
import CourseReturn from './components/CourseReturn.vue';

const { ladingBillMoneyListOptions, ladingBillMoneyListActionOptions } =
    useFinancialBillListModel();
 // 初始化表格高度
 useInitTableHeight(ladingBillMoneyListOptions);
const {
  ladingBillMoneyParams,
  ladingBillMoneyListState,
  ladingBillMoneyFormRef,
  ladingBillMoneyDetailListRef,
  courseReturnRef,
  sizeChange,
  currentChange,
  searchBtn,
  resetBtn,
  handleClickChange,
  hanleSaveReturn,
  changeVisibleChange,
  handleSelectionChange,
  hanleTailRecalculation,
  selectfeeSetTypeList,
  storeFeesetList,
  storeFinancialType,
  getActionOptions
} = useLadingBillMoney(ladingBillMoneyListOptions, ladingBillMoneyListActionOptions);
</script>
<style lang="scss" scoped>
.lading-bill-money {
}
</style>
