global-web/src/views/saleCode/saleInquiryForm/components/SelectProjectModal.vue

<template>
    <a-modal
      title="选择项目(select project)"
      width="95%"
      :visible="visible"
      :maskClosable="false"
      switchFullscreen
      @ok = "handleOk"
      @cancel="handleCancel">
        <div>
            <!--引用表格-->
          <BasicTable @register="registerTable" :rowSelection="rowSelection">
            <template #tableTitle>
                <a-button type="primary" v-auth="'saleCode:sale_inquiry_form:add'"  @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增(add)</a-button>
            </template>
          </BasicTable>
          <AddProjectModal ref="addProjectModalRef" @success="reload"></AddProjectModal>
        </div>
      </a-modal>
</template>
<script lang="ts" name="baseCode-baseShipArchive" setup>
  import {ref, reactive } from 'vue';
  import {BasicTable} from '/@/components/Table';
  import { useListPage } from '/@/hooks/system/useListPage'
  import {columns, searchFormSchema} from './BaseProjectArchive.data';
  import AddProjectModal from './AddProjectModal.vue';
  import {list} from './BaseProjectArchive.api';
  import { message } from 'ant-design-vue';

  const queryParam = reactive<any>({});
  var visible = ref(false);
  const emit = defineEmits([ 'selectProject']); //定义emit
  var addProjectModalRef = ref();
  //注册table数据
  const { tableContext} = useListPage({
      tableProps:{
           api:list,
           columns,
           canResize:false,
           formConfig: {
              schemas: searchFormSchema,
              autoSubmitOnEnter:true,
              showAdvancedButton:true,
              fieldMapToNumber: [
              ],
              fieldMapToTime: [
                 ['shipDate', ['shipDate_begin', 'shipDate_end'], 'YYYY-MM-DD HH:mm:ss'],
              ],
            },
           showTableSetting:false,
           showActionColumn:false,
           actionColumn: {
               width: 200,
               fixed:'right'
            },
            beforeFetch: (params) => {
              return Object.assign(params, queryParam);
            },
      }
  })

  const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext
  
  function handleCancel() {
    visible.value = false;
    selectedRowKeys.value = []
  }
  function handleOk() {
        if(selectedRowKeys.value.length!==1){
          message.warning('请选择一条数据数据')
        }else{
            emit('selectProject',rowSelection.selectedRows)
            handleCancel()
        }  
    }
  function getTable(){
    visible.value = true
   }
   function handleAdd(){
     addProjectModalRef.value.getTable()
   }
   defineExpose({
    getTable
  });


</script>

<style lang="less" scoped>
  :deep(.ant-picker),:deep(.ant-input-number){
    width: 100%;
  }
</style>