销售发票-页面

src/views/saleCode/salesInvoice/components/SelectCommissionOrderModal.vue

@@ -0,0 +1,353 @@
+<template>
+    <a-modal
+      title="选择佣金订单(Select commission order)"
+      width="95%"
+      :visible="visible"
+      :maskClosable="false"
+      switchFullscreen
+      @ok = "handleOk"
+      @cancel="handleCancel">
+        <div>
+          <a-card  :body-style="{ padding: '10px' }" :bordered="false" style="margin: 10px;">
+            <div class="table-page-search-wrapper">
+                <a-form :model="queryParams" :label-col="labelCol" :wrapper-col="wrapperCol" @keyup.enter.native="searchQuery">
+                <a-row :gutter="24">
+                    <a-col :md="6" :sm="8">
+                        <a-form-item label="订单编号(bill code)">
+                            <a-input placeholder="请输入" v-model:value="queryParams.billCode"></a-input>
+                        </a-form-item>
+                    </a-col>
+                    <a-col :md="6" :sm="8">
+                        <a-form-item label="单据日期(bill date)" :label-col="labelCol1" :wrapper-col="wrapperCol1">
+                            <a-range-picker value-format="YYYY-MM-DD"  v-model:value="billDate"  @change="changeBillDate" class="query-group-cust"/>
+                        </a-form-item>
+                    </a-col> 
+                    <template v-if="toggleSearchStatus">
+                        <a-col :md="6" :sm="8">
+                            <a-form-item label="供应商(supplier)">
+                                <ApiSelect
+                                    :api="listSupplier"
+                                    showSearch
+                                    v-model:value="queryParams.supplier"
+                                    optionFilterProp="label"
+                                    resultField="records"
+                                    labelField="name"
+                                    valueField="id"
+                                    />
+                            </a-form-item>
+                        </a-col>
+                        <a-col :md="6" :sm="8">
+                            <a-form-item label="客户(customer)">
+                                 <ApiSelect
+                                    :api="customerListList"
+                                    showSearch
+                                    v-model:value="queryParams.customer"
+                                    optionFilterProp="label"
+                                    resultField="records"
+                                    labelField="name"
+                                    valueField="id"
+                                    />
+                            </a-form-item>
+                        </a-col>                     
+                        <a-col :md="6" :sm="8">
+                            <a-form-item label="业务员(salesman)">
+                                <a-input placeholder="请输入" v-model:value="queryParams.salesman"></a-input>
+                            </a-form-item>
+                        </a-col>   
+                        <a-col :md="6" :sm="8">
+                            <a-form-item label="销售部门(sale department)" :label-col="labelCol1" :wrapper-col="wrapperCol1"> 
+                                <a-input placeholder="请输入" v-model:value="queryParams.saleDepartment"></a-input>
+                            </a-form-item>
+                        </a-col>                      
+                    </template>
+                    <a-col :md="6" :sm="8">
+                        <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+                            <a-button type="primary" @click="searchQuery" >查询(search)</a-button>
+                            <a-button type="primary" @click="searchReset"  style="margin-left: 8px">重置(reset)</a-button>
+                            <a @click="handleToggleSearch" style="margin-left: 8px">
+                            {{ toggleSearchStatus ? '收起' : '展开' }}
+                            <a-icon :type="toggleSearchStatus ? 'up' : 'down'" />
+                            </a>
+                        </span>
+                    </a-col>
+                </a-row>
+            </a-form>
+           </div>
+        </a-card>
+
+        <a-card  :body-style="{ padding: '10px' }" :bordered="false" style="margin: 10px;">
+            <a-alert type="info" show-icon class="alert" style="margin-bottom: 8px">
+            <template #message>
+                <template v-if="selectedRowKeys.length > 0">
+                <span>已选中 {{ selectedRowKeys.length }} 条记录</span>
+                <a-divider type="vertical" />
+                <a @click="selectedRowKeys = []">清空</a>
+                </template>
+                <template v-else>
+                <span>未选中任何数据</span>
+                </template>
+            </template>
+            </a-alert>
+            <a-table
+                :columns="columns"
+                :row-key="record => record.id"
+                :data-source="dataSource"
+                bordered
+                size="small"
+                @change="handleTableChange"
+                :pagination="pagination"
+                :scroll="{ x: 2000, y: 300 }"
+                :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
+            >
+            </a-table>
+        </a-card>
+      </div>
+    </a-modal>
+</template>
+<script lang="ts" setup>
+    import {ref, reactive } from 'vue';
+    import { defHttp} from '/@/utils/http/axios';
+    import { message } from 'ant-design-vue';
+    import { filterObj, getFileAccessHttpUrl } from '/@/utils/common/compUtils';
+    import { JDictSelectTag} from '/@/components/Form';
+    import {  ApiSelect, } from '/@/components/Form/index';
+    import {listSupplier} from '../salesInvoiceForm.api'
+    import JSelectInput from '/@/components/Form/src/jeecg/components/JSelectInput.vue';
+    const emit = defineEmits([ 'addDelivery']); //定义emit
+    let classOption = ref([])
+    var visible = ref(false)
+    const columns = [
+        {
+            title: '订单编号(bill code)',
+            dataIndex: 'billCode',
+            key: 'billCode',
+            align:"center",
+            width:250,
+            ellipsis: true,
+        },
+        {
+            title: '单据日期(delivery date)',
+            dataIndex: 'billDate',
+            key: 'billDate',
+            align:"center",
+            ellipsis: true,
+        },
+        {
+            title: '客户(customer)',
+            dataIndex: 'customerName',
+            key: 'customerName',
+            align:"center",
+            width:250,
+            ellipsis: true,
+        },
+        {
+            title: '供应商(supplier)',
+            dataIndex: 'supplierName',
+            key: 'supplierName',
+            align:"center",
+            ellipsis: true,
+        },
+        {
+            title: '销售部门(sale department)',
+            dataIndex: 'saleDepartment',
+            key: 'saleDepartment',
+            align:"center",
+            width:250,
+            ellipsis: true,
+        },
+        {
+            title: '业务员(salesman)',
+            dataIndex: 'salesman',
+            key: 'salesman',
+            align:"center"
+        },
+        {
+            title: '产品编码(product code)',
+            dataIndex: 'productCode',
+            key: 'productCode',
+            align:"center"
+        },
+        {
+            title: '产品名(name)',
+            dataIndex: 'chineseName',
+            key: 'chineseName',
+            align:"center"
+        },
+        {
+            title: '佣金(commission)',
+            dataIndex: 'commission',
+            key: 'commission',
+            align:"center"
+        },
+    ];
+    const labelCol = ref({
+    xs: { span: 24 },
+    sm: { span: 9 },
+    });
+    const wrapperCol = ref({
+        xs: { span: 24 },
+        sm: { span: 15 },
+    });
+    const labelCol1 = ref({
+    xs: { span: 24 },
+    sm: { span: 12 },
+    });
+    const wrapperCol1 = ref({
+        xs: { span: 24 },
+        sm: { span: 12 },
+    });
+    const dataSource =ref([]);
+    let selectedRowKeys = ref([]);
+    let selectedRows = ref([]);
+    const toggleSearchStatus = ref(false);
+    var billDate = ref([])
+    const queryParams = ref({
+        billCode:'',
+        supplier:'',
+        supplierName:'',
+        salesman:'',
+        saleDepartment:'',
+        customerName:'',
+        customer:'',
+    });
+    let pagination = ref({
+      current: 1,
+      pageSize: 10,
+      total: '', // 假设总共有100条数据
+      showSizeChanger: true,
+      showQuickJumper: true,
+      showTotal: (total, range) => {
+          return range[0] + "-" + range[1] + " 共" + total + "条"
+      },
+      size:'small'
+    });
+    function loadData(){
+        let params = getQueryParams();
+        defHttp.get({ url: '/saleCode/saleDelivery/list',params}, { isTransformResponse: false })
+        .then((res) => {
+            if (res.success) {
+                dataSource.value = res.result.records;
+                pagination.value.total = res.result.total;
+                pagination.value.current = res.result.current;
+                pagination.value.pageSize = res.result.size;                
+            } else {
+                message.error(res.message);
+            }
+        })
+        .finally(() => {
+            // loading.value = false;
+        });
+    }
+    function getQueryParams(){
+        let params = Object.assign(queryParams.value);
+        params.pageNo = pagination.value.current;
+        params.pageSize = pagination.value.pageSize;
+        return filterObj(params);
+    }
+    function handleTableChange(paginations, filters, sorter){
+        pagination.value.total = paginations.total;
+        pagination.value.current = paginations.current;
+        pagination.value.pageSize = paginations.pageSize;
+        loadData()
+    };
+    function getOptiom(){
+    defHttp
+        .get({ url: 'baseCode/baseProductClass/list'}, { isTransformResponse: false })
+        .then((res) => {
+            if (res.success) {
+              classOption.value = []
+              res.result.records.forEach(element => {
+                  var obj = {
+                    label: element.name?element.name:'无名称请维护',
+                    value: element.id?element.id:''
+                  };
+                  classOption.value.push( obj)
+              });    
+            }
+        })
+        .finally(() => {
+            // loading.value = false;
+        });
+  }
+    function searchQuery(){
+        loadData();
+    }
+    function searchReset(){
+        billDate.value = []
+        queryParams.value = {
+            billCode:'',
+        supplier:'',
+        supplierName:'',
+        salesman:'',
+        saleDepartment:'',
+        customerName:'',
+        customer:'',
+        }
+        pagination.value.current =1;
+        pagination.value.pageSize = 10; 
+        loadData();
+    }
+    function handleToggleSearch(){
+        toggleSearchStatus.value = !toggleSearchStatus.value;
+    }
+    function onSelectChange(keys,rows){
+        selectedRowKeys.value = keys
+        selectedRows.value = rows
+    }
+    function handleOk(){
+        if(selectedRowKeys.value.length==0){
+            message.error('请勾选数据');
+        }else{
+            emit('addDelivery', selectedRows.value)
+            handleCancel()
+        }
+    }
+    function handleCancel(){
+        visible.value = false
+        selectedRowKeys.value = []
+        selectedRows.value=[]
+        billDate.value = []
+        queryParams.value = {
+            billCode:'',
+            supplier:'',
+            supplierName:'',
+            salesman:'',
+            saleDepartment:'',
+            customerName:'',
+            customer:'',
+            }
+    }
+    function getTable(){
+        visible.value = true 
+        loadData()
+        getOptiom()
+    }
+    function changeBillDate(prop){
+       if(prop){
+            billDate.value = prop
+            queryParams.value.billDate_begin = prop[0]
+            queryParams.value.billDate_end = prop[1]
+       }else{
+            billDate.value = []
+            queryParams.value.billDate_begin = ''
+            queryParams.value.billDate_end = ''
+       }
+       
+    }
+    function customerListList(){
+        let params = {pageSize:-1}
+        return defHttp.get({url:'/cuspCode/cuspCustomerProfile/list',params});
+    }
+    defineExpose({
+      getTable
+    });
+</script>
+<style scoped lang="less">
+/deep/.ant-form-item{
+    margin-bottom: 8px !important;
+}
+// /deep/.ant-table-wrapper .ant-table-thead > tr > th, .ant-table-wrapper .ant-table-thead > tr > td{
+//     padding: 8px !important;
+// }
+
+</style>

src/views/saleCode/salesInvoice/components/SelectDeliveryNoticeModal.vue

@@ -18,7 +18,7 @@
                         </a-form-item>
                     </a-col>
                     <a-col :md="6" :sm="8">
-                        <a-form-item label="发货日期(delivery date)">
+                        <a-form-item label="发货日期(delivery date)" :label-col="labelCol1" :wrapper-col="wrapperCol1">
                             <a-range-picker value-format="YYYY-MM-DD"  v-model:value="deliveryDate"  @change="changeBillDate" class="query-group-cust"/>
                         </a-form-item>
                     </a-col> 
@@ -36,21 +36,21 @@
                                     />
                             </a-form-item>
                         </a-col>
-                        <a-col :lg="8">
-                            <a-form-item name="customer">
-                            <template #label><span title="客户(customer)">客户(customer)</span></template>
+                        <a-col :md="6" :sm="8">
+                            <a-form-item label="客户(customer)">
                             <a-input placeholder="请输入客户(customer)" v-model:value="queryParams.customerName" allow-clear ></a-input>
                             </a-form-item>
                         </a-col>
+                        
                         <a-col :md="6" :sm="8">
-                            <a-form-item label="产品分类(production class)" :label-col="labelCol1" :wrapper-col="wrapperCol1">
-                                <!-- <a-input placeholder="请输入" v-model:value="queryParams.classId"></a-input> -->
-                                <JSelectInput   v-model:value="queryParams.productionClass"  placeholder="请选择" :options="classOption" ></JSelectInput>
+                            <a-form-item label="优先级(priority)" >
+                                <JDictSelectTag v-model:value="queryParams.priority" placeholder="请选择" dictCode="priority"/>
                             </a-form-item>
                         </a-col>
                         <a-col :md="6" :sm="8">
-                            <a-form-item label="优先级(priority)" >
-                                <JDictSelectTag v-model:value="queryParams.priority" placeholder="请选择" dictCode="priority"/>
+                            <a-form-item label="产品分类(production class)" :label-col="labelCol1" :wrapper-col="wrapperCol1">
+                                <!-- <a-input placeholder="请输入" v-model:value="queryParams.classId"></a-input> -->
+                                <JSelectInput   v-model:value="queryParams.productionClass"  placeholder="请选择" :options="classOption" ></JSelectInput>
                             </a-form-item>
                         </a-col>
                         <a-col :md="6" :sm="8">
@@ -60,7 +60,7 @@
                         </a-col>
                         
                         <a-col :md="6" :sm="8">
-                            <a-form-item label="厂家(maker)" :label-col="labelCol1" :wrapper-col="wrapperCol1">
+                            <a-form-item label="厂家(maker)" >
                                 <a-input placeholder="请输入" v-model:value="queryParams.maker"></a-input>
                             </a-form-item>
                         </a-col>                        
@@ -111,7 +111,7 @@
                 size="small"
                 @change="handleTableChange"
                 :pagination="pagination"
-                :scroll="{ x: 2000, y: 300 }"
+                :scroll="{ x: 3500, y: 300 }"
                 :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
             >
             </a-table>

src/views/saleCode/salesInvoice/components/saleInvoiceForm.vue

@@ -108,8 +108,8 @@
 		<!-- 子表单区域 -->
     <a-tabs v-model:activeKey="activeKey" animated  style=" padding: 24px;padding-top: 0px;">
       <a-tab-pane tab="销售发票 - 发票明细(invoice details)" key="saleInvoiceDetails" :forceRender="true">
-        <a-button type="primary"  style="margin-right: 1%;margin-bottom: 1%;"> 选择发货通知单(select delevery notice)</a-button>
-        <a-button type="primary" > 选择佣金订单(selete commission order)</a-button>
+        <a-button type="primary"  style="margin-right: 1%;margin-bottom: 1%;" @click="selectDeliveryList"> 选择发货通知单(select delevery notice)</a-button>
+        <a-button type="primary" @click="selectCommissionList"> 选择佣金订单(selete commission order)</a-button>
         <j-vxe-table
           :keep-source="true"
           resizable
@@ -151,7 +151,9 @@
       </a-tab-pane>
       
     </a-tabs>
+    <SelectDeliveryNoticeModal ref="SelectDeliveryNoticeModalRef"></SelectDeliveryNoticeModal>
     <BaseShipArchiveAccessoriesModal ref="BaseShipArchiveAccessoriesListRef"></BaseShipArchiveAccessoriesModal>
+    <SelectCommissionOrderModal ref="SelectCommissionOrderModalRef"></SelectCommissionOrderModal>
     <SelectProjectModal ref="SelectProjectModalRef" @selectProject="addProject"></SelectProjectModal>
   </a-spin>
 </template>
@@ -165,6 +167,8 @@
   import {saleInvoiceShipColumns, saleInvoiceDetailColumns} from '../salesInvoiceForm.data';
   import BaseShipArchiveAccessoriesModal from '../../../publicComponents/BaseShipArchiveAccessoriesModal.vue';
   import SelectProjectModal from '../../../publicComponents/SelectProjectModal.vue';
+  import SelectDeliveryNoticeModal from './SelectDeliveryNoticeModal.vue';
+  import SelectCommissionOrderModal from './SelectCommissionOrderModal.vue';
   import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
   import JUpload from '/@/components/Form/src/jeecg/components/JUpload/JUpload.vue';
   import { JDictSelectTag,JSelectMultiple} from '/@/components/Form';
@@ -184,7 +188,9 @@
       SelectProjectModal,
       JDictSelectTag,
       JSelectInput,
-      JSelectMultiple
+      JSelectMultiple,
+      SelectDeliveryNoticeModal,
+      SelectCommissionOrderModal
     },
     props:{
       formDisabled:{
@@ -198,6 +204,8 @@
     setup(props, {emit}) {
       const loading = ref(false);
       const formRef = ref();
+      const SelectDeliveryNoticeModalRef = ref();
+      const SelectCommissionOrderModalRef = ref();
       var SelectProjectModalRef = ref()
       const saleInvoiceFormShipTableRef = ref();
       const saleInvoiceFormShipTable = reactive<Record<string, any>>({
@@ -451,6 +459,12 @@
           prop.row.taxAmount =  (prop.row.salePrice*prop.row.quantity).toFixed(2)
         }
       }
+      function selectDeliveryList(){
+        SelectDeliveryNoticeModalRef.value.getTable()
+      }
+      function selectCommissionList(){
+        SelectCommissionOrderModalRef.value.getTable()
+      }
       return {
         saleInvoiceFormShipTableRef,
         saleInvoiceFormShipTable,
@@ -481,7 +495,11 @@
         getCustomerOptions,
         customerOption,
         notAllowEdit,
-        changeValues
+        changeValues,
+        SelectDeliveryNoticeModalRef,
+        selectDeliveryList,
+        SelectCommissionOrderModalRef,
+        selectCommissionList
       }
     }
   });

src/views/saleCode/salesInvoice/salesInvoiceForm.api.ts

@@ -48,6 +48,10 @@ export const querySaleInvoiceDetailListByMainId = (id) => defHttp.get({url: Api.
 export const list = (params) =>
   defHttp.get({url: Api.list, params});
 
+// 供应商列表接口
+export const listSupplier = (params) =>
+  defHttp.get({url: Api.supplierList, params});
+
 /**
  * 删除单个
  */

src/views/saleCode/salesInvoice/salesInvoiceList.vue

@@ -88,6 +88,7 @@
         </template>
       </BasicTable>
       <!-- 表单区域 -->
+      <saleInvoiceFormModal  @register="registerModal" @success="handleSuccess"></saleInvoiceFormModal>
     </div>
   </template>
   
@@ -97,10 +98,11 @@
     import { useListPage } from '/@/hooks/system/useListPage'
     import {useModal} from '/@/components/Modal';
     import {columns,} from './salesInvoiceForm.data';
-    import {list, deleteOne, batchDelete, getImportUrl,getExportUrl,batchSubmit,cancelBatchSubmit} from './SaleOrderyForm.api';
+    import {list, deleteOne, batchDelete, getImportUrl,getExportUrl,batchSubmit,cancelBatchSubmit} from './salesInvoiceForm.api';
     import { cloneDeep } from "lodash-es";
     import { defHttp } from '/@/utils/http/axios';
     import { JDictSelectTag} from '/@/components/Form';
+    import saleInvoiceFormModal from './components/saleInvoiceFormModal.vue';
     import JSelectInput from '/@/components/Form/src/jeecg/components/JSelectInput.vue';
     import JSelectUser from '/@/components/Form/src/jeecg/components/JSelectUser.vue';
     import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue';
@@ -143,16 +145,6 @@
   
     const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext
 
-  
-    /**
-     * 高级查询事件
-     */
-    function handleSuperQuery(params) {
-      Object.keys(params).map((k) => {
-        queryParam[k] = params[k];
-      });
-      reload();
-    }
      // 自动请求并暴露内部方法
      onMounted(() => {
       getOptiom()