|
|
<template> <div class="mode-config"> <el-form label-position="top" :model="searchData"> <el-row :gutter="18"> <el-col :span="2"> <el-form-item label="客户编码"> <el-input v-model="searchData.customerNo" clearable /> </el-form-item> </el-col> <el-col :span="2"> <el-form-item label="客户名称"> <el-input v-model="searchData.customerName" clearable /> </el-form-item> </el-col> <el-col :span="2"> <el-form-item label="跟单员"> <el-input v-model="searchData.trackerName" clearable/> </el-form-item> </el-col> <el-col :span="2"> <el-form-item label="报价单号"> <el-input v-model="searchData.quotationNo" clearable /> </el-form-item> </el-col> <el-col :span="2"> <el-form-item label="客户询价单号"> <el-input v-model="searchData.customerInquiryNo" clearable /> </el-form-item> </el-col> <el-col :span="2"> <el-form-item label="内部询价单号"> <el-input v-model="searchData.internalInquiryNo" clearable/> </el-form-item> </el-col> <el-col :span="2"> <el-form-item label="状态"> <el-select v-model="searchData.quotationStatus"> <el-option label="全部" value=""></el-option> <el-option label="草稿" value="草稿"></el-option> <el-option label="下达" value="下达"></el-option> </el-select> </el-form-item> </el-col> </el-row> <el-row :gutter="18"> <el-col :span="2"> <el-form-item label="项目编码"> <el-input v-model="searchData.projectId" clearable /> </el-form-item> </el-col> <el-col :span="2"> <el-form-item label="项目名称"> <el-input v-model="searchData.projectName" clearable/> </el-form-item> </el-col> <el-col :span="2"> <el-form-item label="销售员"> <el-input v-model="searchData.quoterName" size="large" clearable/> </el-form-item> </el-col> <el-col :span="4"> <el-row> <el-col :span="11"> <el-form-item label="开始日期"> <el-date-picker value-format="yyyy-MM-dd" style="width: 100%" v-model="searchData.startDate" type="date" placeholder="开始日期"> </el-date-picker> </el-form-item> </el-col> <el-col :span="2"> <el-form-item label=" "> <svg t="1701739447362" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8471" id="mx_n_1701739447363" width="20" height="20"><path d="M524.288 804.864l444.416-294.912-444.416-294.912v143.36H81.92V655.36h442.368v149.504z m0 0" p-id="8472"></path></svg> </el-form-item> </el-col> <el-col :span="11"> <el-form-item label="结束日期"> <el-date-picker value-format="yyyy-MM-dd" style="width: 100%" v-model="searchData.endDate" type="date" placeholder="结束日期"> </el-date-picker> </el-form-item> </el-col> </el-row> </el-col> <el-col :span="4"> <el-form-item label=" "> <el-button plain type="primary" @click="initDataBtn" @keyup.enter.native="initDataBtn">查 询</el-button> <el-button type="primary" @click="insertDiaLogFlag = true">新 增</el-button> </el-form-item> </el-col> </el-row> </el-form>
<!-- 表格 和上述搜索框对应 --> <el-table :data="tableData" v-loading="initQuotationHeaderLoading" element-loading-text = "数据正在加载中" element-loading-spinner = "el-icon-loading" @row-click="rowClickQuotation" stripe border style="width: 100%;margin-top: 12px" :height="height"> <el-table-column label="操作" align="center" fixed width="120"> <template slot-scope="scope"> <el-link style="cursor: pointer">下达</el-link> <el-link style="cursor: pointer" @click="editQuotationHeader(scope.row)">编辑</el-link> <el-link style="cursor: pointer" @click="deleteQuotationHeader(scope.row)">删除</el-link> </template> </el-table-column> <el-table-column align="center" prop="quotationNo" label="报价单号" show-overflow-tooltip> </el-table-column> <el-table-column align="center" prop="quotationDate" label="报价日期" show-overflow-tooltip> </el-table-column> <el-table-column align="center" prop="customerNo" show-overflow-tooltip label="客户编码"> </el-table-column> <el-table-column align="left" prop="customerName" show-overflow-tooltip label="客户名称"> </el-table-column> <el-table-column align="center" prop="versionCode" show-overflow-tooltip label="版本号"> </el-table-column> <el-table-column align="center" prop="projectId" show-overflow-tooltip label="项目编码"> </el-table-column> <el-table-column align="left" prop="projectName" show-overflow-tooltip label="项目名称"> </el-table-column> <el-table-column align="left" prop="quoterName" show-overflow-tooltip label="销售员"> </el-table-column> <el-table-column align="left" prop="trackerName" show-overflow-tooltip label="跟单员"> </el-table-column> <el-table-column align="left" prop="currency" show-overflow-tooltip label="货币"> </el-table-column> <el-table-column align="center" prop="quotationStatus" show-overflow-tooltip label="状态"> </el-table-column> <el-table-column align="left" prop="remark" show-overflow-tooltip label="备注"> </el-table-column> <el-table-column align="center" prop="customerInquiryNo" show-overflow-tooltip label="客户询价单号"> </el-table-column> <el-table-column align="center" prop="internalInquiryNo" show-overflow-tooltip label="内部询价单号"> </el-table-column> </el-table> <!-- 分页插件 --> <el-pagination style="margin-top: 0px" @size-change="quotationHeaderSizeChange" @current-change="quotationHeaderCurrentChange" :current-page="no" :page-sizes="[20, 50, 100, 200, 500]" :page-size="size" :total="total" layout="total,sizes, prev, pager, next, jumper"> </el-pagination> <!-- 标签页 --> <el-tabs v-model="activeTabName" @tab-click="handleClickTab" style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);border: 2px;min-height: 440px;margin-top: 5px;padding: 5px"> <el-tab-pane label="报价明细" name="quotation_detail"> <quotation-detail :quotation-header="quotationHeader"></quotation-detail> </el-tab-pane> <el-tab-pane label="报价审批" name="quotation_examine_and_approve"> <quotation-examine-and-approve></quotation-examine-and-approve> </el-tab-pane> <el-tab-pane label="项目信息" name="quotation_project_information"> <quotation-project-information :quotation-header="quotationHeader"></quotation-project-information> </el-tab-pane> <el-tab-pane label="客户信息" name="quotation_customer_information"> <quotation-customer-information :quotation-header="quotationHeader"></quotation-customer-information> </el-tab-pane> <el-tab-pane label="客户联系人" name="quotation_customer_contact"> <quotation-customer-contact :quotation-header="quotationHeader"></quotation-customer-contact> </el-tab-pane> </el-tabs>
<!-- 新增弹框 --> <el-dialog title="新增报价" @close="closeInsertDialog" :close-on-click-modal="false" v-drag :visible.sync="insertDiaLogFlag" width="40%"> <el-form :rules="rules" label-position="top" ref="insertQuotationForm" :model="insertData" label-width="120px"> <el-row> <el-col :span="8"> <el-form-item prop="internalInquiryNo"> <span slot="label" style="" @click="quotationNoDialogFlag = true"><a herf="#">内部询价单号</a></span> <el-input v-model="insertData.internalInquiryNo" placeholder="请输入内容" clearable/> </el-form-item> </el-col> <el-col :span="12" :offset="2"> <el-form-item label="客户询价单号" prop="customerInquiryNo"> <el-input v-model="insertData.customerInquiryNo" placeholder="请输入内容" clearable/> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="8"> <el-form-item prop="customerNo" label="客户编码"> <span slot="label" style="" v-if="insertData.internalInquiryNo ==''" @click="getBaseList(102,1)"><a herf="#">客户编码</a></span> <el-input v-model="insertData.customerNo" :disabled="insertData.internalInquiryNo !=''" placeholder="请输入内容" clearable /> </el-form-item> </el-col> <el-col :span="12" :offset="2"> <el-form-item prop="customerName" label="客户名称"> <span slot="label" style="" v-if="insertData.internalInquiryNo ==''" @click="getBaseList(102,1)"><a herf="#">客户名称</a></span> <el-input v-model="insertData.customerName" :disabled="insertData.internalInquiryNo !=''" placeholder="请输入内容" clearable/> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="8"> <el-form-item prop="projectId" label="项目编码"> <span slot="label" style="" v-if="insertData.internalInquiryNo ==''" @click="getBaseList(104,1)"><a herf="#">项目编码</a></span> <el-input v-model="insertData.projectId" :disabled="insertData.internalInquiryNo !=''" placeholder="请输入内容" clearable /> </el-form-item> </el-col> <el-col :span="12" :offset="2"> <el-form-item prop="projectName" label="项目名称"> <span slot="label" style="" v-if="insertData.internalInquiryNo ==''" @click="getBaseList(104,1)"><a herf="#">项目名称</a></span> <el-input v-model="insertData.projectName" :disabled="insertData.internalInquiryNo !=''" placeholder="请输入内容" clearable /> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="8"> <el-form-item label="货币" prop="currency"> <el-input v-model="insertData.currency" :disabled="insertData.internalInquiryNo !=''" placeholder="请输入内容" clearable /> </el-form-item> </el-col> <el-col :span="12" :offset="2"> <el-form-item label="报价日期" prop="quotationDate"> <el-date-picker style="width: 100%" v-model="insertData.quotationDate" type="date" size="mini" format="yyyy/MM/dd" value-format="yyyy-MM-dd" placeholder="选择日期"> </el-date-picker> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="8"><!-- <el-form-item prop="quoter" label="销售员">--> <el-form-item label="销售员"> <span slot="label" style="" @click="getBaseList(103,2)"><a herf="#">销售员</a></span> <el-input v-model="insertData.quoterName" @clear="clearQuoter" placeholder="请输入内容" clearable /> </el-form-item> </el-col> <el-col :span="12" :offset="2"> <el-form-item label="跟单员"><!-- <el-form-item prop="tracker" label="跟单员">--> <span slot="label" style="" v-if="insertData.internalInquiryNo ==''" @click="getBaseList(103,1)"><a herf="#">跟单员</a></span> <el-input v-model="insertData.trackerName" :disabled="insertData.internalInquiryNo !=''" @clear="clearTracker" placeholder="请输入内容" clearable /> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="24"> <el-form-item label="备注" style="width: 100%;min-height: 90px"> <el-input type="textarea" style="width: 100%" resize="none" :autosize="{minRows: 3, maxRows: 3}" v-model="insertData.remark"/> </el-form-item> </el-col> </el-row> </el-form> <el-footer style="height:30px;margin-top: 20px;text-align:center"> <el-button type="primary" :loading="insertQuotationHeaderBtn" @click="saveQuotationHeader">确定</el-button> <el-button @click="insertDiaLogFlag = false">关闭</el-button> </el-footer> </el-dialog>
<!--询价单号选择弹框--> <el-dialog title="内部询价单号" @close="closeQuotationNoDialog" @open="openQuotationNoDialog" :visible.sync="quotationNoDialogFlag" width="685px" v-drag> <el-form label-position="top" inline="inline" :model="quotationNoSearchData" size="mini" label-width="120px"> <el-form-item label="询价单号"> <el-input v-model="quotationNoSearchData.quotationNo" clearable/> </el-form-item> <el-form-item label=" "> <el-button type="primary" style="padding: 3px 12px" @click="searchQuotationData">查询</el-button> </el-form-item> </el-form> <el-table :data="quotationNoData" stripe border @cell-dblclick="dblclickQuotationNo"> <el-table-column prop="quotationNo" label="询价单号">
</el-table-column> <el-table-column prop="projectName" label="项目名称">
</el-table-column> </el-table> <el-footer style="height:30px;margin-top: 20px;text-align:center"> <el-button type="primary" @click="quotationNoDialogFlag = false">关闭</el-button> </el-footer> </el-dialog>
<!-- chooseList模态框 --> <Chooselist ref="baseList" @getBaseData="getBaseData"></Chooselist> </div></template>
<script>import quotationDetail from "./sellForQuotation/quotationDetail.vue";import quotationExamineAndApprove from "./sellForQuotation/quotationExamineAndApprove.vue";import quotationProjectInformation from "./sellForQuotation/quotationProjectInformation.vue";import quotationCustomerInformation from "./sellForQuotation/quotationCustomerInformation.vue";import quotationCustomerContact from "./sellForQuotation/quotationCustomerContact.vue";import Chooselist from '@/views/modules/common/Chooselist';import { getQuotationHeaderByPage, saveQuotationHeader, deleteByQuotationHeaderId,} from '@/api/quotation/quotationHeader.js';import { searchQuotationByQuotationNo,} from '@/api/quotation/quotationInformation.js';export default { components:{ Chooselist, quotationDetail, quotationExamineAndApprove, quotationProjectInformation, quotationCustomerInformation, quotationCustomerContact, }, data () { return { searchFlag:false, // 搜索条件对象
searchData:{ site:this.$store.state.user.site,// 工厂编号
customerNo:"", // 客户编码
customer:"", // 客户名称
tracker:"", // 跟单员
quotationStatus:"", //状态
projectId:"", // 项目编码
projectName:"", // 项目名称
quoterName:"", // 销售员
startDate:"", // 开始日期
endDate:"", // 结束日期
dateValue:[],// 开始时间结束时间数组
}, tableData: [],// 查询的数据
initQuotationHeaderLoading:false,//表格加载状态
// 分页信息
no:1,//页码
size:20,//每页条数
total:0,//总页数
// 表格高度
height:400, // 标签页
activeTabName:"quotation_detail", //dialog 控制开关
insertDiaLogFlag:false, quotationNoDialogFlag:false, // 新增对象
insertData:{ site:this.$store.state.user.site, quotationNo:"",//客户报价单号
quotationDate:new Date(),//报价日期
customerNo:"", // 客户编号
customerName:"",//客户名称
versionCode:"001", projectId:"",//项目编码
projectName:"",//项目名称
tracker:"",//跟单员
quoter:"",//销售编号
quoterName:"",//销售员
trackerName:"",//跟单员
currency:"",//货币
quotationStatus:"草稿",//状态
remark:"",//备注
customerInquiryNo:"",//客户询价单号
internalInquiryNo:"",//内部询价单号
requireApproval:"",//需要审批
approvalStatus:"",//审批状态
createBy:this.$store.state.user.id,//当前登录账号
createTime:new Date(),//当前时间
}, quotationHeaderColumns:[ {label:"quotationNo",value:"客户报价单号"}, {label:"quotationDate",value:"报价日期"}, {label:"customerNo",value:"客户编码"}, {label:"customerName",value:"客户名称"}, {label:"versionCode",value:"版本号"}, {label:"projectId",value:"项目编码"}, {label:"projectName",value:"项目名称"}, {label:"quoterName",value:"销售员"}, {label:"trackerName",value:"跟单员"}, {label:"currency",value:"货币"}, {label:"quotationStatus",value:"状态"}, {label:"remark",value:"备注"}, {label:"customerInquiryNo",value:"客户询价单号"}, {label:"internalInquiryNo",value:"内部询价单号"}, {label:"requireApproval",value:"需要审批"}, {label:"approvalStatus",value:"审批状态"}, {label:"createBy",value:"创建人"}, {label:"createDate",value:"创建时间"}, {label:"updateBy",value:"更新人"}, {label:"updateDate",value:"更新时间"}, ], // 规则
rules: { customerNo: [ { required: true,message:' '}, ], customerName: [ { required: true,message:' '}, ], projectId:[ { required: true,message:' '} ], projectName:[ { required: true,message:' '} ], tracker:[ { required: true,message:' '} ], trackerName:[ { required: true,message:' '} ], currency:[ { required: true,message:' '} ], quoter:[ { required: true,message:' '} ], quoterName:[ { required: true,message:' '} ], quotationStatus:[ { required: true,message:' '} ], quotationDate:[ { required: true,message:' '} ], }, // 参数 选择框
tagNo1:"", tagNo:"", // 内部报价单搜索表单对象
quotationNoSearchData:{ quotationNo:"",//单号
site:this.$store.state.user.site,//工厂编号
}, //内部报价单搜索表格数据对象
quotationNoData:[], // 行对象
quotationHeader:{}, // 按钮防重复
insertQuotationHeaderBtn:false, } }, methods: { // 点击quotation行事件
rowClickQuotation(row,column,event){ if (column.label != '操作'){ this.quotationHeader = row; } }, // 搜索条件中的时间输入框 change事件
changeDateRange(){ if (this.searchData.dateValue){ this.searchData.startDate = this.searchData.dateValue[0]; this.searchData.endDate = this.searchData.dateValue[1]; }else { this.searchData.startDate=""; this.searchData.endDate=""; } }, // 查询
initDataBtn(){ this.$route.params.ids = null; this.initData(); }, // 初始化数据
initData(){ let ids = "" if (this.$route.params.ids){ ids = "?" for (let i = 0; i < this.$route.params.ids.length; i++) { ids+='ids='+this.$route.params.ids[i]+'&' } ids = ids.substring(0,ids.length-1); } let params = { no:this.no, size:this.size, site:this.$store.state.user.site, customerNo:this.searchData.customerNo, customerName:this.searchData.customerName, trackerName:this.searchData.trackerName, quotationNo:this.searchData.quotationNo, customerInquiryNo:this.searchData.customerInquiryNo, internalInquiryNo:this.searchData.internalInquiryNo, quotationStatus:this.searchData.quotationStatus, projectId:this.searchData.projectId, projectName:this.searchData.projectName, quoterName:this.searchData.quoterName, startDate:this.searchData.startDate, endDate: this.searchData.endDate, } this.init(params,ids) }, init(params,ids){ this.initQuotationHeaderLoading = true; getQuotationHeaderByPage(params,ids).then(({data})=>{ this.tableData = data.data.records; this.total = data.data.total; if (this.tableData.length > 0){ this.quotationHeader = this.tableData[0]; }else { this.quotationHeader = null; } this.initQuotationHeaderLoading = false; }).catch((error)=>{ this.initQuotationHeaderLoading = false; }) }, // 删除方法
deleteQuotationHeader(row){ this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { deleteByQuotationHeaderId(row).then(({data})=>{ if (data.code == 200){ this.$message.success(data.msg); this.initData(); }else { this.$message.error(data.msg); } }) }) }, // 修改方法
editQuotationHeader(row){ this.insertData = JSON.parse(JSON.stringify(row)); this.insertDiaLogFlag = true; }, // size 发送改变
quotationHeaderSizeChange(val){ this.size = val; this.initData(); }, // no发生改变
quotationHeaderCurrentChange(val){ this.no = val; this.initData(); }, // 新增QuotationHeader
saveQuotationHeader(){ // 校验
this.$refs['insertQuotationForm'].validate((valid,objects)=>{ if (valid){ this.insertQuotationHeaderBtn = true; // 请求
saveQuotationHeader(this.insertData).then(({data})=>{ // 返回提示
if (data.code === 200){ this.initData(); this.insertQuotationHeaderBtn = false; this.insertDiaLogFlag = false; } this.$message.success(data.msg); }) }else { this.rulesValidateLabel(objects,this.quotationHeaderColumns); } }) }, // 校验处理
rulesValidateLabel(objects, labels) { for (let filed in objects) { for (let i = 0; i < labels.length; i++) { let quotationToolColumn = labels[i]; if (quotationToolColumn.label === filed) { this.$message.warning(quotationToolColumn.value+"填写不正确"); return } } } }, // resetInsertData 重置新增对象
resetInsertData(){ this.insertData = { site:this.$store.state.user.site, quotationNo:"",//客户报价单号
quotationDate:new Date(),//报价日期
customerNo:"", // 客户编号
customerName:"",//客户名称
versionCode:"001", projectId:"",//项目编码
projectName:"",//项目名称
tracker:"",//跟单员
quoter:"",//销售编号
quoterName:"",//销售员
trackerName:"",//跟单员
currency:"",//货币
quotationStatus:"草稿",//状态
remark:"",//备注
customerInquiryNo:"",//客户询价单号
internalInquiryNo:"",//内部询价单号
requireApproval:"",//需要审批
approvalStatus:"",//审批状态
createBy:this.$store.state.user.id,//当前登录账号
createDate:new Date(),//当前时间
} }, // 销售员输入框清除事件
clearQuoter(){ this.insertData.quoter = ""; this.insertData.quoterName = ""; }, // 跟单员输入框清除事件
clearTracker(){ this.insertData.tracker = ""; this.insertData.trackerName = ""; }, // 新增弹框关闭事件
closeInsertDialog(){ this.resetInsertData(); this.$refs['insertQuotationForm'].resetFields(); }, // 点击标签页
handleClickTab(tab, event){
},
// ======== chooseList相关方法 ========
/** * 获取基础数据列表S * @param val * @param type */ getBaseList (val, type) { this.tagNo = val this.tagNo1 = type this.$nextTick(() => { let strVal = '' if (val === 102) { if(type === 1) { strVal = this.insertData.customerNo } } if (val === 103) { if(type === 1) { strVal = this.insertData.tracker } if(type === 2) { strVal = this.insertData.quoter } } if (val === 104) { if(type === 1) { strVal = this.insertData.projectId } } this.$refs.baseList.init(val, strVal) }) }, /** * 列表方法的回调 * @param val */ getBaseData (val) { if (this.tagNo === 102) { if(this.tagNo1 === 1) { this.insertData.customerNo = val.Customer_no this.insertData.customerName = val.Customer_desc } } if (this.tagNo === 103) { if(this.tagNo1 === 1) { this.insertData.tracker = val.username this.insertData.trackerName = val.user_display } if(this.tagNo1 === 2) { this.insertData.quoter = val.username this.insertData.quoterName = val.user_display } } if (this.tagNo === 104) { if(this.tagNo1 === 1) { this.insertData.projectId = val.project_id this.insertData.projectName = val.project_name } } }, // 查询 内部报价单编号
searchQuotationData(){ searchQuotationByQuotationNo(this.quotationNoSearchData).then(({data})=>{ this.quotationNoData = data.data; }) }, // 打开 内部报价单拟态框
openQuotationNoDialog(){ // 请求
this.searchQuotationData(); }, // 关闭
closeQuotationNoDialog(){ this.quotationNoSearchData = { quotationNo:"",//单号
site:this.$store.state.user.site,//工厂编号
} }, // 询价表双击事件
dblclickQuotationNo(row){ this.insertData.customerNo = row.customerNo; this.insertData.customerName=row.customerDesc;//客户名称
this.insertData.projectId=row.projectId;//项目编码
this.insertData.projectName=row.projectName;//项目名称
this.insertData.tracker=row.tracker;//跟单员
this.insertData.trackerName=row.trackerName; this.insertData.quoter=row.quoter;//销售编号
this.insertData.internalInquiryNo=row.quotationNo;//内部询价单号
this.insertData.currency=row.customerCurrency;//内部询价单号
// 关闭弹框
this.quotationNoDialogFlag = false; } }, computed:{
}, mounted () { this.$nextTick(() => { this.height = window.innerHeight / 2 - 240; }) }, activated () { this.initData();//初始化数据
},}</script>
<style scoped> /deep/ .el-range-editor--mini.el-input__inner { height: 20px; } /deep/ .el-range-editor.el-input__inner{ padding: 0px 10px; } /deep/ .el-input--mini .el-input__icon{ line-height: 20px; }</style>
|