<template>
<a-modal
title="选择客户询价单(select customer inquiry)"
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)">
<a-range-picker value-format="YYYY-MM-DD" v-model:value="queryParams.billDate" class="query-group-cust"/>
</a-form-item>
</a-col>
<a-col :md="6" :sm="8">
<a-form-item label="询价项目(inquiry project)">
<a-input placeholder="请输入" v-model:value="queryParams.inquiryProject" :disabled="fatherProjectName!==''"></a-input>
</a-form-item>
</a-col>
<template v-if="toggleSearchStatus">
<a-col :md="6" :sm="8">
<a-form-item label="业务类型(busyness type)">
<JDictSelectTag v-model:value="queryParams.busynessType" placeholder="请选择" dictCode="busyness_type"/>
</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>
</a-col>
<a-col :md="6" :sm="8">
<a-form-item label="产品分类(production class)" >
<JSelectInput v-model:value="queryParams.productionClass" placeholder="请选择" :options="classOption" ></JSelectInput>
</a-form-item>
</a-col>
<a-col :md="6" :sm="8">
<a-form-item label="机型(model)">
<JDictSelectTag v-model:value="queryParams.model" placeholder="请选择" dictCode="model_typer"/>
</a-form-item>
</a-col>
<a-col :md="6" :sm="8">
<a-form-item label="产品编号(product code)">
<a-input placeholder="请输入" v-model:value="queryParams.productCode"></a-input>
</a-form-item>
</a-col>
<a-col :md="8" :sm="8">
<a-form-item label="采购询价组(procurement inquiry team)" :label-col="labelCol1" :wrapper-col="wrapperCol1">
<JSelectDept v-model:value="queryParams.inquiryTeam" :multiple="false"/>
</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.childId"
:data-source="dataSource"
bordered
size="small"
@change="handleTableChange"
:pagination="pagination"
:scroll="{ x: 4500, 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 JSelectInput from '/@/components/Form/src/jeecg/components/JSelectInput.vue';
import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue';
const emit = defineEmits([ 'selectCustomerInquiry']); //定义emit
let classOption = ref([])
var visible = ref(false)
const columns = [
{
title: '询价单号(bill code)',
dataIndex: 'billCode',
key: 'billCode',
align:"center"
},
{
title: '单据日期(bill date)',
dataIndex: 'billDate',
key: 'billDate',
align:"center"
},
{
title: '询价项目(inquiry project)',
dataIndex: 'inquiryProject_dictText',
key: 'inquiryProjec',
align:"center",
width:200
},
{
title: '询价客户(inquiry customer)',
key: 'inquiryCustomer',
dataIndex: 'inquiryCustomer_dictText',
align:"center"
},
{
title: '询价有效期(inquiry period)',
align:"center",
dataIndex: 'time',
width:250,
customRender:({text,record}) =>{
if(record.inquiryPeriodBegin&&record.inquiryPeriodEnd){
text = record.inquiryPeriodBegin+'~'+record.inquiryPeriodEnd
}else if(!record.inquiryPeriodBegin){
text = record.inquiryPeriodEnd
}else if(!record.inquiryPeriodEnd){
text = record.inquiryPeriodBegin
}else{
text=''
}
return text;
},
},
{
title: '优先级(priority)',
align:"center",
dataIndex: 'priority_dictText'
},
{
title: '产品分类(production class)',
align:"center",
dataIndex: 'productionClass_dictText'
},
{
title: '机型(model)',
align:"center",
dataIndex: 'model'
},
{
title: '采购询价组(procurenment inquiry team)',
key: 'inquiryTeam',
dataIndex: 'inquiryTeam',
align:"center"
},
{
title: '产品编码(product code)',
key: 'productCode',
dataIndex: 'productCode',
align:"center"
},
{
title: '产品英文名(product english name)',
key: 'englishName',
dataIndex: 'englishName',
align:"center",
width:250
},
{
title: '型号(child model)',
key: 'childModel;',
dataIndex: 'childModel;',
align:"center",
width:250
},
{
title: '厂家(factory)',
key: 'factory;',
dataIndex: 'factory;',
align:"center",
width:250
},
{
title: '质量等级(quality grade)',
key: 'qualityGrade;',
dataIndex: 'qualityGrade;',
align:"center",
width:250
},
{
title: '数量(quality)',
key: 'quantity;',
dataIndex: 'quantity;',
align:"center",
width:250
},
{
title: '单位(unit)',
key: 'unit;',
dataIndex: 'unit;',
align:"center",
width:250
},
{
title: '备注(notes)',
key: 'notes;',
dataIndex: 'notes;',
align:"center",
width:250
},
];
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: 11 },
});
const wrapperCol1 = ref({
xs: { span: 24 },
sm: { span: 13 },
});
const dataSource =ref([]);
let selectedRowKeys = ref([]);
let selectedRows = ref([]);
var fatherProjectName = ref('');
var fatherSourceCode = ref('');
const toggleSearchStatus = ref(false);
const queryParams = ref({
billCode:'',
billDate:'',
inquiryProject:'',
busynessType:'',
priority:'',
productionClass:'',
model:'',
productCode:'',
inquiryTeam:'',
projectName:''
});
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/saleInquiryForm/alertSaleInquiryList',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;
if(fatherProjectName.value&&fatherProjectName.value!==''){
params.projectName = fatherProjectName.value
}else{
params.projectName = ''
}
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(){
queryParams.value = {
billCode:'',
billDate:'',
inquiryProject:'',
busynessType:'',
priority:'',
productionClass:'',
model:'',
productCode:'',
inquiryTeam:'',
}
pagination.value.current =1;
pagination.value.pageSize = 10;
if(fatherProjectName.value&&fatherProjectName.value!==''){
queryParams.value.projectName = fatherProjectName.value
}else{
queryParams.value.projectName = ''
}
loadData();
}
function handleToggleSearch(){
toggleSearchStatus.value = !toggleSearchStatus.value;
}
function onSelectChange(keys,rows){
selectedRowKeys.value = keys
selectedRows.value = rows
}
function handleOk(){
var arr = []
selectedRows.value.map(item=>arr.push(item.billCode))
if(fatherSourceCode.value&&fatherSourceCode.value!==''){
arr.push(fatherSourceCode.value)
}
if(selectedRowKeys.value.length==0){
message.error('请勾选数据');
}else if(new Set(arr).size!==1){
message.error('请勾选询价单号相同的数据');
}else{
emit('selectCustomerInquiry', selectedRows.value)
handleCancel()
}
}
function handleCancel(){
visible.value = false
selectedRowKeys.value = []
selectedRows.value=[]
}
function getTable(formData){
visible.value = true
if(formData.projectName&&formData.projectName!==''){
fatherProjectName.value = formData.projectName
}else{
fatherProjectName.value = ''
}
if(formData.sourceCode&&formData.sourceCode!==''){
fatherSourceCode.value = formData.sourceCode
}else{
fatherSourceCode.value = ''
}
loadData()
getOptiom()
}
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>