canrd-outside / order-erp-front · Files

<template>

  <div class="order-page">

    <BasicTable @register="registerTable" bordered>
      <template #headerCell="{ column }">
        <!-- <template v-if="column.key === 'address1'">
          <span class="flex items-center justify-center"> 自定义字段列11 </span>
        </template> -->

        <template v-if="SELECT_FIELD_COLUMNS.includes(column.key) && role === ROLE.ADMIN">

          <span class="flex items-center justify-center">
            {{ column.customTitle }}
            <FormOutlined class="ml-2 cursor-pointer" @click="handleFieldVisible(column)" />
          </span>
        </template>
        <template v-else>
          <HeaderCell :column="column" />
        </template>
      </template>
      <template #headerTop>
        <a-alert type="info" show-icon>
          <template #message>
            <template v-if="checkedKeys.length > 0">
              <span>已选中{{ checkedKeys.length }}条记录(可跨页)</span>

              <a-button
                :style="{ borderRadius: '5px 5px 5px 5px' }"
                type="link"

                @click="handleClearChoose"

                size="small"
                >清空</a-button
              >

            </template>
            <template v-else>
              <span>未选中任何订单</span>
            </template>
          </template>
        </a-alert>
      </template>
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'action'">
          <TableAction

            :actions="

              role !== ROLE.PRODUCE && role !== ROLE.FINANCE

                ? [
                    {
                      // 数据分析没有编辑权限
                      ...(role !== ROLE.DATA_REPORT_USER && {
                        label: '编辑',
                        // icon: 'ic:outline-delete-outline',
                        onClick: handleEdit.bind(null, record),
                      }),
                    },
                    {
                      ...(role !== ROLE.DATA_REPORT_USER && {
                        label: '申请权限',
                        // icon: 'ic:outline-delete-outline',
                        onClick: handleCheck.bind(null, record),
                      }),
                    },
                    // {
                    //   ...(role !== ROLE.DATA_REPORT_USER && {
                    //     label: '申请',
                    //     // icon: 'ic:outline-delete-outline',
                    //     onClick: handleCheck.bind(null, record),
                    //   }),
                    // },
                  ]
                : []
            "

            :dropDownActions="

              role !== ROLE.DATA_REPORT_USER && role !== ROLE.PRODUCE

                ? [
                    {
                      label: '历史记录',
                      onClick: handleHistory.bind(null, record),
                    },

                    {

                      label: '跟单结果记录',

                      onClick: handleTrackHistory.bind(null, record),

                    },
                    {

                      // 数据分析没有编辑权限

                      ...((role === ROLE.ADMIN ||
                        role === ROLE.TRACKER ||
                        role === ROLE.FINANCE) && {

                        label: '复制',
                        // icon: 'ic:outline-delete-outline',
                        onClick: handleCopy.bind(null, record),
                      }),
                    },
                    {

                      ...(role === ROLE.ADMIN && {
                        label: '删除',
                        popConfirm: {
                          title: '是否确认删除',
                          placement: 'left',
                          confirm: handleDelete.bind(null, record?.id),
                        },
                      }),
                    },

                  ]
                : []
            "

          />
        </template>
        <template v-if="column.key === 'picUrl'">
          <img
            :width="100"
            :height="100"

            :src="record.smallPicUrl"
            :key="record.smallPicUrl"

            @click="handlePreview(record.picUrl)"
          />
        </template>
      </template>

      <template #toolbar>

        <div style="position: relative">
          <div style="padding-left: 50px; right: 123px">
            <!-- <a-space wrap :size="[8, 16]" :style="{ marginBottom: '2px', marginLeft: '10px' }"> -->
            <a-space wrap :style="{ marginBottom: '2px', marginTop: '2px' }">
              <a-button

                :style="{backgroundColor: '#ff69b4',  borderColor: '#ff69b4',  color: 'white',borderRadius: '5px 5px 5px 5px' }"
                shape="default"
                type="primary"
                @click=" handleStatementModal"
                v-if="
                  role === ROLE.ADMIN ||
                  role === ROLE.BUSINESS ||
                  role === ROLE.TRACKER 
                "
                >LOACL对账单</a-button
              >
              <a-button

                :style="{ borderRadius: '5px 5px 5px 5px' }"
                type="primary"
                @click="handleProductInvoiceModal"

                v-if="
                  role === ROLE.ADMIN ||
                  role === ROLE.BUSINESS ||
                  role === ROLE.TRACKER ||
                  role === ROLE.FINANCE
                "

                >生产对账单创建</a-button

              >

              <a-button
                :style="{ borderRadius: '5px 5px 5px 5px' }"
                shape="default"
                type="primary"
                @click="handleInvoiceCreateModal"

                v-if="
                  role === ROLE.ADMIN ||
                  role === ROLE.BUSINESS ||
                  role === ROLE.TRACKER ||
                  role === ROLE.FINANCE
                "

                >Invoice创建</a-button

              >

              <a-select
                ref="select"
                v-model:value="value1"
                @change="handleChange"
                class="passCalculate"
                dropdown-class-name="dropdown-class"
                v-if="role === ROLE.ADMIN || role === ROLE.TRACKER || role === ROLE.BUSINESS"

              >

                <a-select-option value1="一次通过率">一次通过率</a-select-option>
                <a-select-option value="确认样品" @click="handlePassModal('确认意见')"
                  >确认样品</a-select-option
                >
                <a-select-option value="生产样品" @click="handlePassModal('生产样品')"
                  >生产样品</a-select-option
                >
                <a-select-option value="测试样品" @click="handlePassModal('测试样品')"
                  >测试样品</a-select-option
                >
              </a-select>

              <!-- <a-button

                :style="{ borderRadius: '5px 5px 5px 5px' }"
                type="primary"
                @click="handleProductProfitModal"

                v-if="role === ROLE.ADMIN || role === ROLE.FINANCE"

                >内部生产净利润分析</a-button

              > -->
              <!-- <a-button

                :style="{ borderRadius: '5px 5px 5px 5px' }"
                type="primary"
                @click="handleServiceProfitModal"

                v-if="role === ROLE.ADMIN || role === ROLE.FINANCE"

                >业务/研发净利润分析</a-button

              > -->

              <a-button
                :style="{ borderRadius: '5px 5px 5px 5px' }"
                type="primary"
                @click="handleProductModal"
                v-if="role === ROLE.ADMIN || role === ROLE.TRACKER"
                >生产指示书</a-button
              >
              <a-button
                :style="{ borderRadius: '5px 5px 5px 5px' }"
                type="primary"
                @click="handleRateModal"

                v-if="role === ROLE.ADMIN || role === ROLE.FINANCE"

                >比重计算</a-button
              >
              <a-button
                :style="{ borderRadius: '5px 5px 5px 5px' }"
                type="primary"
                @click="handleExportModal"
                v-if="
                  role === ROLE.ADMIN ||
                  role === ROLE.TRACKER ||
                  role === ROLE.BUSINESS ||

                  role === ROLE.FINANCE ||
                  role === ROLE.INSPECT

                "
                >导出</a-button
              >
              <a-button
                :style="{ borderRadius: '5px 5px 5px 5px' }"
                type="primary"
                @click="handleProfitModal"

                v-if="role === ROLE.ADMIN || role === ROLE.BUSINESS || role === ROLE.FINANCE"

                >分析利润</a-button
              >
              <a-button
                :style="{ borderRadius: '5px 5px 5px 5px' }"
                type="primary"
                @click="handleAdd"
                v-if="role === ROLE.ADMIN || role === ROLE.TRACKER"
                >创建订单</a-button
              ></a-space

            >

          </div></div
        >

      </template>
    </BasicTable>
    <FormDetail
      @register="formDetailRegister"
      :onGoCheckDetail="handleGoCheckDetail"
      @success="handleFormSuccess"
    />

    <ProductText
      @register="productModalRegister"
      :role="role"
      :customerCodes="selectedCustomCodes"
    />

    <Statement
      @register="statementModalRegister"
      :role="role"
      :customerCodes="selectedCustomCodes"
    />

    <InvoiceCreate @register="invoiceCreateModalRegister" @success="handleFormSuccess" />

    <ServiceProfit @register="serviceProfitModalRegister" />
    <ProductProfit @register="productProfitModalRegister" />

    <ProductInvoice @register="productInvoiceModalRegister" @success="handleFormSuccess" />

    <ProfitAnalysis @register="profitModalRegister" />

    <RateModal @register="rateModalRegister" />

    <ExportModal @register="exportModalRegister" :role="role" :ids="checkedKeys" />

    <CheckDetail @register="checkModalRegister" :onGoFormDetail="handleGoFormDetail" />
    <HistoryDetail @register="historyDetailRegister" />

    <TrackHistory @register="trackHistoryRegister" />

    <FieldDetail @register="fieldDetailRegister" />

    <PassCalculate @register="passModalRegister" />

  </div>
</template>
<script lang="ts">

  import { defineComponent, onMounted, ref, toRaw, computed } from 'vue';

  import { BasicTable, useTable, TableAction } from '/@/components/Table';
  import { FormOutlined } from '@ant-design/icons-vue';
  import HeaderCell from '/@/components/Table/src/components/HeaderCell.vue';

  import { Alert } from 'ant-design-vue'

  import { useDrawer } from '/@/components/Drawer';
  import ProfitAnalysis from './ProfitAnalysis.vue';

  import ProductText from './ProductText.vue';

  import Statement from './Statement.vue';

  import RateModal from './RateModal.vue';
  import ExportModal from './ExportModal.vue';

  import PassCalculate from './PassCalculate.vue';

  import InvoiceCreate from './InvoiceCreate.vue';

  import ServiceProfit from './ServiceProfit.vue';
  import ProductProfit from './ProductProfit.vue';

  import ProductInvoice from './ProductInvoice.vue';

  import { useModal } from '/@/components/Modal';

  import { getFormConfig, getOrderColumns, SELECT_FIELD_COLUMNS } from './tableData';
  import FormDetail from './FormDetail/index.vue';

  import CheckDetail from './CheckDetail.vue';
  import HistoryDetail from './HistoryDetail.vue';

  import TrackHistory from './TrackHistory.vue';

  import FieldDetail from './FieldDetail.vue';
  import { createImgPreview } from '/@/components/Preview/index';

  import { getOrderList, orderDelete } from '/@/api/project/order';

  import { useOrderStoreWithOut } from '/@/store/modules/order';

  import { useUserStoreWithOut } from '/@/store/modules/user';

  import { ROLE } from './type.d';

  import { getUserList } from '/@/api/project/account';

  import { useMessage } from '/@/hooks/web/useMessage';
  import { getBaseInvoice } from '/@/api/project/invoice';

  const orderStore = useOrderStoreWithOut();

  const userStore = useUserStoreWithOut();

  export default defineComponent({
    components: {
      HeaderCell,
      BasicTable,
      AAlert: Alert,
      TableAction,
      FormDetail,
      ProfitAnalysis,

      ProductText,

      Statement,

      PassCalculate,

      FormOutlined,
      CheckDetail,
      HistoryDetail,

      TrackHistory,

      FieldDetail,

      RateModal,

      InvoiceCreate,

      ServiceProfit,

      ProductInvoice,

      ProductProfit,

      ExportModal,

    },
    setup() {
      const checkedKeys = ref<Array<string | number>>([]);

      // const selectedCustomCodes = ref<Array<string>>([]);

      const [profitModalRegister, { openModal: openProfitModal }] = useModal();

      const [invoiceCreateModalRegister, { openModal: openInvoiceCreateModal }] = useModal();

      const [serviceProfitModalRegister, { openModal: openServiceProfitModal }] = useModal();
      const [productProfitModalRegister, { openModal: openProductProfitModal }] = useModal();

      const [productInvoiceModalRegister, { openModal: openProductInvoiceModal }] = useModal();

      const [rateModalRegister, { openModal: openRateModal }] = useModal();
      const [exportModalRegister, { openModal: openExportModal }] = useModal();

      const [productModalRegister, { openModal: openProductModal }] = useModal();

      const [passModalRegister, { openModal: openPassModal }] = useModal();

      const [statementModalRegister, { openModal: openStatementModal }] = useModal();

      const tooltipVisible = ref(false);
      const [formDetailRegister, { openDrawer: openFormDetailDrawer }] = useDrawer();
      const [historyDetailRegister, { openDrawer: openHistoryDetailDrawer }] = useDrawer();

      const [trackHistoryRegister, { openDrawer: openTrackHistoryDrawer }] = useDrawer();

      const [fieldDetailRegister, { openDrawer: openFieldDetailDrawer }] = useDrawer();

      const user = userStore.getUserInfo;

      const role = computed(() => {
        return user?.roleSmallVO?.code;
      });

      // 业务员列表
      const businessUsers = ref([]);

      const [checkModalRegister, { openDrawer: openCheckDetailDrawer }] = useDrawer();
      onMounted(async () => {
        await orderStore.getDict();
      });

      onMounted(async () => {
        // 获取业务员
        const res = await getUserList({ page: 1, pageSize: 1000 });
        businessUsers.value = res.items
          .filter((item) => item.roleCode === ROLE.BUSINESS)
          .map((item) => ({ value: item.userName, label: item.userName }));
      });

      const formConfig = computed(() => {
        return getFormConfig(businessUsers.value);
      });

      const [registerTable, { getForm, reload, getColumns }] = useTable({

        api: getOrderList,
        title: '订单列表',
        pagination: {
          total: 60,
        },

        clickToRowSelect: false,

        columns: getOrderColumns(user?.roleSmallVO?.code),

        useSearchForm: true,

        formConfig: formConfig,

        showTableSetting: true,
        // tableSetting: { fullScreen: true },
        showIndexColumn: false,
        rowKey: 'id',
        rowSelection: {
          type: 'checkbox',
          selectedRowKeys: checkedKeys,

          onSelect,
          onSelectAll,

        },

        // actionColumn: {
        //   width: 160,
        //   title: 'Action',
        //   dataIndex: 'action',
        //   // slots: { customRender: 'action' },
        // },
        actionColumn:
          role.value !== ROLE.PRODUCE
            ? {
                width: 160,
                title: 'Action',
                dataIndex: 'action',
                // slots: { customRender: 'action' },
              }
            : undefined,

      });
      function getFormValues() {
        console.log(getForm().getFieldsValue());
      }

      type CustomerCodeEntry = [string, number]; // 定义二维数组类型 [customerCode, count]
      type ProductionDepartmentEntry = [string, number]; // 定义二维数组类型 [productionDepartment, count]

      type ProjectNoEntry = [string, number]; // 定义二维数组类型 [innerNo, count]

      type BusinessPersonEntry = [string, number]; // 定义二维数组类型 [businessPerson, count]

      const selectedCustomCodes = ref<CustomerCodeEntry[]>([]); // 创建一个二维数组的 ref
      const selectedProductionDepartment = ref<ProductionDepartmentEntry[]>([]); // 创建一个二维数组的 ref

      const selectedProjectNos = ref<ProjectNoEntry[]>([]); // 创建一个二维数组的 ref

      const selectedBusinessPersons = ref<BusinessPersonEntry[]>([]); // 创建一个二维数组的 ref

      // 单选处理函数
      function onSelect(

        record: {
          customerCode: string;
          productionDepartment: string;
          projectNo: string;

          businessPerson: string; // 添加 businessPerson 属性

          id: string;
        },

        selected: boolean,
      ) {
        const customerCodeIndex = selectedCustomCodes.value.findIndex(
          ([customerCode]) => customerCode === record.customerCode,
        );

        const productionDepartmentIndex = selectedProductionDepartment.value.findIndex(
          ([department]) => department === record.productionDepartment,
        );

        const projectNoIndex = selectedProjectNos.value.findIndex(
          ([projectNo]) => projectNo === record.projectNo,
        );

        const businessPersonIndex = selectedBusinessPersons.value.findIndex(
          ([businessPerson]) => businessPerson === record.businessPerson,
        );

        if (selected) {
          checkedKeys.value = [...checkedKeys.value, record.id];

          // 更新 selectedCustomCodes
          if (customerCodeIndex !== -1) {
            selectedCustomCodes.value[customerCodeIndex][1] += 1;
          } else {
            selectedCustomCodes.value.push([record.customerCode, 1]);
          }

          // 更新 selectedProductionDepartment
          if (productionDepartmentIndex !== -1) {
            selectedProductionDepartment.value[productionDepartmentIndex][1] += 1;
          } else {
            selectedProductionDepartment.value.push([record.productionDepartment, 1]);
          }

          // 更新 selectedProjectNos
          if (projectNoIndex !== -1) {
            selectedProjectNos.value[projectNoIndex][1] += 1;
          } else {
            selectedProjectNos.value.push([record.projectNo, 1]);
          }

          // 更新 selectedBusinessPersons
          if (businessPersonIndex !== -1) {
            selectedBusinessPersons.value[businessPersonIndex][1] += 1;
          } else {
            selectedBusinessPersons.value.push([record.businessPerson, 1]);
          }

        } else {
          checkedKeys.value = checkedKeys.value.filter((id) => id !== record.id);

          // 更新 selectedCustomCodes
          if (customerCodeIndex !== -1) {
            if (selectedCustomCodes.value[customerCodeIndex][1] > 1) {
              selectedCustomCodes.value[customerCodeIndex][1] -= 1;
            } else {
              selectedCustomCodes.value.splice(customerCodeIndex, 1);
            }
          }

          // 更新 selectedProductionDepartment
          if (productionDepartmentIndex !== -1) {
            if (selectedProductionDepartment.value[productionDepartmentIndex][1] > 1) {
              selectedProductionDepartment.value[productionDepartmentIndex][1] -= 1;
            } else {
              selectedProductionDepartment.value.splice(productionDepartmentIndex, 1);
            }
          }

          // 更新 selectedProjectNos
          if (projectNoIndex !== -1) {
            if (selectedProjectNos.value[projectNoIndex][1] > 1) {
              selectedProjectNos.value[projectNoIndex][1] -= 1;
            } else {
              selectedProjectNos.value.splice(projectNoIndex, 1);
            }
          }

          // 更新 selectedBusinessPersons
          if (businessPersonIndex !== -1) {
            if (selectedBusinessPersons.value[businessPersonIndex][1] > 1) {
              selectedBusinessPersons.value[businessPersonIndex][1] -= 1;
            } else {
              selectedBusinessPersons.value.splice(businessPersonIndex, 1);
            }
          }

        }

        // console.log('Checked Keys:', checkedKeys.value);
        // console.log('Selected Customer Codes:', selectedCustomCodes.value);
        // console.log('Selected Production Departments:', selectedProductionDepartment.value);
        // console.log('Selected Project Nos:', selectedProjectNos.value);
        // console.log('Selected Business Persons:', selectedBusinessPersons.value);

      }

      // 全选处理函数
      function onSelectAll(selected: boolean, selectedRows: any[], changeRows: any[]) {

        const changeIds = changeRows.map((item) => item.id);

        const changeCustomerCodes = changeRows.map((item) => item.customerCode);

        const changeProductionDepartments = changeRows.map((item) => item.productionDepartment);

        const changeProjectNos = changeRows.map((item) => item.projectNo);

        const changeBusinessPersons = changeRows.map((item) => item.businessPerson); // 新增处理 businessPerson

        if (selected) {
          checkedKeys.value = [...checkedKeys.value, ...changeIds];

          // 更新 selectedCustomCodes
          changeCustomerCodes.forEach((code) => {
            const index = selectedCustomCodes.value.findIndex(
              ([customerCode]) => customerCode === code,
            );
            if (index !== -1) {
              selectedCustomCodes.value[index][1] += 1;
            } else {
              selectedCustomCodes.value.push([code, 1]);
            }
          });

          // 更新 selectedProductionDepartment
          changeProductionDepartments.forEach((department) => {
            const index = selectedProductionDepartment.value.findIndex(
              ([prodDepartment]) => prodDepartment === department,
            );
            if (index !== -1) {
              selectedProductionDepartment.value[index][1] += 1;
            } else {
              selectedProductionDepartment.value.push([department, 1]);
            }
          });

          // 更新 selectedProjectNos
          changeProjectNos.forEach((projectNo) => {
            const index = selectedProjectNos.value.findIndex(([no]) => no === projectNo);
            if (index !== -1) {
              selectedProjectNos.value[index][1] += 1;
            } else {
              selectedProjectNos.value.push([projectNo, 1]);
            }
          });

          // 更新 selectedBusinessPersons
          changeBusinessPersons.forEach((businessPerson) => {
            const index = selectedBusinessPersons.value.findIndex(([bp]) => bp === businessPerson);
            if (index !== -1) {
              selectedBusinessPersons.value[index][1] += 1;
            } else {
              selectedBusinessPersons.value.push([businessPerson, 1]);
            }
          });

        } else {

          checkedKeys.value = checkedKeys.value.filter((id) => !changeIds.includes(id));

          // 更新 selectedCustomCodes
          changeCustomerCodes.forEach((code) => {
            const index = selectedCustomCodes.value.findIndex(
              ([customerCode]) => customerCode === code,
            );
            if (index !== -1) {
              if (selectedCustomCodes.value[index][1] > 1) {
                selectedCustomCodes.value[index][1] -= 1;
              } else {
                selectedCustomCodes.value.splice(index, 1);
              }
            }

          });

          // 更新 selectedProductionDepartment
          changeProductionDepartments.forEach((department) => {
            const index = selectedProductionDepartment.value.findIndex(
              ([prodDepartment]) => prodDepartment === department,
            );
            if (index !== -1) {
              if (selectedProductionDepartment.value[index][1] > 1) {
                selectedProductionDepartment.value[index][1] -= 1;
              } else {
                selectedProductionDepartment.value.splice(index, 1);
              }
            }

          });

          // 更新 selectedProjectNos

          changeProjectNos.forEach((projectNo) => {

            const index = selectedProjectNos.value.findIndex(([no]) => no === projectNo);
            if (index !== -1) {
              if (selectedProjectNos.value[index][1] > 1) {
                selectedProjectNos.value[index][1] -= 1;
              } else {
                selectedProjectNos.value.splice(index, 1);
              }
            }
          });

          // 更新 selectedBusinessPersons
          changeBusinessPersons.forEach((businessPerson) => {
            const index = selectedBusinessPersons.value.findIndex(([bp]) => bp === businessPerson);
            if (index !== -1) {
              if (selectedBusinessPersons.value[index][1] > 1) {
                selectedBusinessPersons.value[index][1] -= 1;
              } else {
                selectedBusinessPersons.value.splice(index, 1);
              }
            }
          });

        }

        // console.log('Checked Keys:', checkedKeys.value);
        // console.log('Selected Customer Codes:', selectedCustomCodes.value);
        // console.log('Selected Production Departments:', selectedProductionDepartment.value);
        // console.log('Selected Project Nos:', selectedProjectNos.value);
        // console.log('Selected Business Persons:', selectedBusinessPersons.value);

      }

      function handleClearChoose() {
        checkedKeys.value = [];
        selectedCustomCodes.value = [];
        selectedProductionDepartment.value = [];
        selectedProjectNos.value = [];
        selectedBusinessPersons.value = [];

      }

      function handleEdit(record, e) {
        openFormDetailDrawer(true, { ...toRaw(record) });
        e?.stopPropagation();
        return false;
      }

      function handleCopy(record, e) {
        openFormDetailDrawer(true, { ...toRaw(record), id: undefined, isCopy: true });
        e?.stopPropagation();
        return false;
      }

      function handleAdd() {

        openFormDetailDrawer(true, {});

      }

      function handleCheck(record, e) {
        openCheckDetailDrawer(true, record);
        e?.stopPropagation();
        return false;
      }

      function handleHistory(record, e) {
        openHistoryDetailDrawer(true, record);
        e?.stopPropagation();
        return false;
      }

      function handleTrackHistory(record, e) {
        openTrackHistoryDrawer(true, record);
        return false;

      }

      function handleProfitModal() {

        const form = getForm();
        const values = form.getFieldsValue();

        openProfitModal(true, {
          data: checkedKeys.value,

          searchData: values,

        });
      }

      function handleInvoiceCreateModal(record) {

        const form = getForm();
        const values = form.getFieldsValue();

        if (checkedKeys.value.length == 0) {
          error('请选择订单');
          return;
        }
        if (selectedCustomCodes.value.length > 1) {
          error('勾选订单的客户编码需一致');
          return;
        }

        openInvoiceCreateModal(true, {

          record: record,
          customersCodes: selectedCustomCodes.value,

          data: checkedKeys.value,
          searchData: values,
        });
      }

      function handleProductInvoiceModal() {
        const form = getForm();
        const values = form.getFieldsValue();

        if (checkedKeys.value.length == 0) {
          error('请选择订单');
          return;
        }
        if (selectedProductionDepartment.value.length > 1) {
          error('勾选订单的生产科需一致');
          return;
        }

        openProductInvoiceModal(true, {
          data: checkedKeys.value,
          searchData: values,
        });
      }

      //一次通过率
      const value1 = ref('一次通过率');
      function handleChange() {}
      function handlePassModal(title) {
        const form = getForm();
        const values = form.getFieldsValue();

        openPassModal(true, {
          check: checkedKeys.value,
          title: title,
          searchData: values,
        });

      }

      // const form = getForm();
      // const values = form.getFieldsValue();
      //   if (title == '确认样品') {
      //     openPassModal(true, {
      //       check: checkedKeys.value,
      //       title: title,
      //     });
      //     return false;
      //   } else if (title == '生产样品') {
      //     openPassModal(true, {
      //       check: checkedKeys.value,
      //       title: title,
      //     });
      //     return false;
      //   } else if (title == '测试样品') {
      //     openPassModal(true, {
      //       check: checkedKeys.value,
      //       title: title,
      //     });
      //     return false;
      //   }
      // }
      const { createMessage } = useMessage();
      const { error } = createMessage;

      function handleProductModal(record) {

        const form = getForm();
        const values = form.getFieldsValue();

        if (checkedKeys.value.length == 0) {

          error('请选择订单');
          return;
        }

        if (selectedCustomCodes.value.length > 1) {
          error('客户编码需一致');
          return;
        }
        if (selectedBusinessPersons.value.length > 1) {
          error('业务员需一致');
          return;
        }

        openProductModal(true, {

          checkedKeys: checkedKeys.value,

          customers: selectedCustomCodes.value,

          data: values,
        });
      }

      //对账单
      function  handleStatementModal(record) {
        const form = getForm();
        const values = form.getFieldsValue();
        if (checkedKeys.value.length == 0) {
          error('请选择订单');
          return;
        }
        openStatementModal(true, {
          checkedKeys: checkedKeys.value,
          customers: selectedCustomCodes.value,
          data: values,
        });
      }

      function handleRateModal() {
        const form = getForm();
        const values = form.getFieldsValue();

        openRateModal(true, {
          data: values,
        });
      }

      function handleFieldVisible(record) {
        openFieldDetailDrawer(true, record);
      }

      function handleGoCheckDetail() {
        openCheckDetailDrawer(true);
        openFormDetailDrawer(false);
      }

      function handleGoFormDetail() {
        openCheckDetailDrawer(false);
        openFormDetailDrawer(true);
      }

      function handlePreview(url) {

        createImgPreview({ imageList: [url], defaultWidth: 500 });
        // e?.stopPropagation();
        // e?.preventDefault();
        return false;
      }

      async function handleExportModal() {

        const form = getForm();
        const values = form.getFieldsValue();
        openExportModal(true, {
          data: values,
        });

      }

      async function handleServiceProfitModal() {
        if (selectedCustomCodes.value.length > 1) {
          error('勾选订单的客户编码需一致');
          return;
        }

        // if (selectedProjectNos.value.length > 1) {
        //   error('勾选订单的项目号需一致');
        //   return;
        // }

        const form = getForm();
        const values = form.getFieldsValue();

        const resAll = await getOrderList({});
        const filteredItems = resAll.items.filter((item: { id: string }) =>
          checkedKeys.value.includes(item.id),
        );

        openServiceProfitModal(true, {

          res: filteredItems,

          data: checkedKeys.value,

          orderList: resAll,
          customerCode: selectedCustomCodes.value,
          projectNo: selectedProjectNos.value,

          searchData: values,
        });
      }

      async function handleProductProfitModal() {
        if (selectedCustomCodes.value.length > 1) {
          error('勾选订单的客户编码需一致');
          return;
        }

        const form = getForm();
        const values = form.getFieldsValue();

        const resAll = await getOrderList({});
        const filteredItems = resAll.items.filter((item: { id: string }) =>
          checkedKeys.value.includes(item.id),
        );

        openProductProfitModal(true, {

          filteredItems: filteredItems,

          data: checkedKeys.value,
          searchData: values,

          customerCode: selectedCustomCodes.value,
          projectNo: selectedProjectNos.value,

        });
      }

      const handleFormSuccess = () => {
        reload();
      };

      async function handleDelete(id: string) {
        try {
          await orderDelete({ ids: [id] });
          reload();
        } catch (error) {
          console.log(error);
        }
      }

      return {

        user,

        SELECT_FIELD_COLUMNS,

        fieldDetailRegister,
        profitModalRegister,

        invoiceCreateModalRegister,
        productInvoiceModalRegister,

        serviceProfitModalRegister,
        productProfitModalRegister,

        handleChange,

        rateModalRegister,
        exportModalRegister,

        productModalRegister,

        statementModalRegister,

        passModalRegister,

        historyDetailRegister,

        trackHistoryRegister,

        formDetailRegister,
        handleProfitModal,

        handleInvoiceCreateModal,
        handleProductInvoiceModal,

        handleStatementModal,

        registerTable,
        getFormValues,
        checkedKeys,
        onSelect,
        handleEdit,

        handleCopy,

        handleCheck,
        onSelectAll,
        tooltipVisible,
        handleFieldVisible,
        checkModalRegister,
        handleGoCheckDetail,
        handleGoFormDetail,
        handleHistory,

        focus,
        value1,
        handlePassModal,
        handleTrackHistory,

        handleAdd,
        createImgPreview,

        handleExportModal,

        handlePreview,
        handleFormSuccess,

        handleProductModal,

        handleRateModal,
        openExportModal,

        openProductModal,

        openStatementModal,

        openPassModal,

        handleDelete,

        handleServiceProfitModal,
        handleProductProfitModal,

        handleClearChoose,

        selectedCustomCodes,

        role,
        ROLE,

      };
    },
  });
</script>

<style lang="less">

  .ant-table-thead th,
  .ant-table-tbody td {
    padding: 0;
    white-space: pre-wrap;
  }

  .ant-table-cell img {

    width: 40px;
    height: 40px;

  }

  .order-page .vben-basic-table .ant-form-item .ant-picker {
    width: 100%;
  }

  .order-page .ant-table.ant-table-middle .ant-table-tbody > tr > td {
    padding-top: 0;
    padding-bottom: 0;
  }

  .passCalculate .ant-select-selector {
    background-color: #1890ff !important;
    color: white !important;

    border-radius: 5px 5px 5px 5px !important;

  }

  .passCalculate .ant-select-selection-item {
    color: white !important;
  }

  .dropdown-class {
    background-color: #1890ff; /* 选择框背景颜色 */
    color: white;
    border: none; /* 去除选择框边框 */
  }

  .dropdown-class .ant-select-selector {
    background-color: #1890ff; /* 选择框背景颜色 */
    color: white;
    border: none !important; /* 去除选择框边框 */
    box-shadow: none !important; /* 去除选择框阴影 */
  }

  .dropdown-class .ant-select-dropdown {
    background-color: #1890ff; /* 下拉框背景颜色 */
    border: none !important; /* 去除下拉框边框 */
    box-shadow: none !important; /* 去除下拉框阴影 */
  }

  .dropdown-class .ant-select-item {
    background-color: #1890ff; /* 下拉选项背景颜色 */
    color: white !important; /* 下拉选项字体颜色 */
    border: none !important; /* 去除下拉选项边框 */
  }

  .dropdown-class .ant-select-item:hover,
  .dropdown-class .ant-select-item-option-active,
  .dropdown-class .ant-select-item-option-selected {
    background-color: #1967d3 !important; /* 选中和悬停状态下拉选项背景颜色 */
    color: white !important; /* 选中和悬停状态下拉选项字体颜色 */
    border: none !important; /* 去除选中和悬停状态下拉选项边框 */
  }

  .dropdown-class .ant-select-item-option {
    background-color: #1890ff; /* 下拉选项背景颜色 */
    color: white !important; /* 下拉选项字体颜色 */
    border: none !important; /* 去除下拉选项边框 */
  }

</style>

./constant