Browse Source

20241012

java8
qiezi 1 year ago
parent
commit
e436386042
  1. 591
      src/views/modules/quote/quoteDetailReport.vue

591
src/views/modules/quote/quoteDetailReport.vue

@ -1,15 +1,602 @@
<script> <script>
import {getSiteAndBuByUserName} from "../../../api/qc/qc";
import {queryQuoteDetailReport} from "../../../api/quote/quoteDetail";
import {getItemListByInquiryPartAndCodeNo} from "../../../api/inquiry/inquiryDetail";
export default { export default {
name: "quoteDetailReport"
name: "quoteDetailReport",
props:{
height:{
type:[String,Number],
default: "40vh"
}
},
data(){
return{
queryForm:{
buId:undefined,
customerNo:'',
customerDesc:''
},
no:1,
size:20,
total:0,
dataList:[],
queryLoading:false,
userBuList:[],
columns:[
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1BuDesc',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'buDesc',
headerAlign: 'center',
align: 'center',
columnLabel: 'BU',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 80
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1QuoteVersionNo',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'quoteVersionNo',
headerAlign: 'center',
align: 'left',
columnLabel: '报价单',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 140
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1CustomerNo',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'customerNo',
headerAlign: 'center',
align: 'left',
columnLabel: '客户编码',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 80
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1CustomerDesc',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'customerDesc',
headerAlign: 'center',
align: 'left',
columnLabel: '客户名称',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 140
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1QuoteDate',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'quoteDate',
headerAlign: 'center',
align: 'center',
columnLabel: '报价日期',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 120
},{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1CustomerInquiryNo',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'customerInquiryNo',
headerAlign: 'center',
align: 'left',
columnLabel: '客户询价单号',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 100
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1PartNo',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'partNo',
headerAlign: 'center',
align: 'left',
columnLabel: '产品编码',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 100
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1PartDesc',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'partDesc',
headerAlign: 'center',
align: 'left',
columnLabel: '产品描述',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 140
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1Status',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'status',
headerAlign: 'center',
align: 'center',
columnLabel: '状态',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 80
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1CreateDate',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'createDate',
headerAlign: 'center',
align: 'center',
columnLabel: '创建日期',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 130
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1CreateBy',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'createBy',
headerAlign: 'center',
align: 'left',
columnLabel: '创建人',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 100
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1UpdateDate',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'updateDate',
headerAlign: 'center',
align: 'center',
columnLabel: '最近更新日期',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 130
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1UpdateBy',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'updateBy',
headerAlign: 'center',
align: 'left',
columnLabel: '最近更新人',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 100
},
{
userId: this.$store.state.user.name,
functionId: 5013,
serialNumber: '5011Table1Site',
tableId: '5013Table1',
tableName: '报价信息表',
columnProp: 'site',
headerAlign: 'center',
align: 'left',
columnLabel: '工厂编码',
columnHidden: false,
columnImage: false,
columnSortable: false,
sortLv: 0,
status: true,
fixed: '',
columnWidth: 80
},
],
currentRow: {},
activeName:'detail',
inquiryDataList:[],
queryPropertyLoading:false
}
},
methods:{
getSiteAndBuByUserName() {
let tempData = {
username: this.$store.state.user.name,
}
getSiteAndBuByUserName(tempData).then(({data}) => {
if (data.code === 0) {
this.userBuList = data.rows
}
})
},
handleQuery(){
let params = {
...this.queryForm,
no: this.no,
size: this.size
}
this.queryLoading = true
queryQuoteDetailReport(params).then(({data})=>{
if (data && data.code === 0){
this.dataList = data.rows
this.total = data.total
if (this.total === 0){
this.currentRow = {}
}else if (this.currentRow.id !== undefined){
// this.currentRow = {}
}else {
this.currentRow = this.dataList[0]
}
}else {
this.$message.warning(data.msg)
}
this.queryLoading = false
}).catch((error)=>{
this.$message.error(error)
this.queryLoading = false
})
},
handleRowClick(row){
this.currentRow = {...row}
},
rowStyle({row}){
if(this.currentRow && this.currentRow.id === row.id){
return { 'background-color': '#E8F7F6' };
}else {
return {}
}
},
handleSizeChange(val){
this.size = val
this.handleQuery()
},
handlePageChange(val){
this.no = val
this.handleQuery()
},
handleQueryInquiryProperties(){
if (this.currentRow.id === undefined){
return
}
let params = {
inquiryPartId:this.currentRow.rfqDetailId,
buNo:this.currentRow.buNo,
site:this.currentRow.site,
recordType:'PRICECHECK',
}
this.queryPropertyLoading = true
getItemListByInquiryPartAndCodeNo(params).then(({data})=>{
if (data && data.code === 0){
this.inquiryDataList = data.rows
}else {
this.$message.warning(data.msg)
}
this.queryPropertyLoading = false
}).catch((error)=>{
this.$message.error(error)
this.queryPropertyLoading = false
})
}
},
created() {
this.getSiteAndBuByUserName();
this.handleQuery();
},
watch:{
currentRow(newVal,oldVal){
if (newVal){
this.handleQueryInquiryProperties()
}
}
}
} }
</script> </script>
<template> <template>
<div> <div>
<h1>Quote Detail Report</h1>
<div style="width: 1000px">
<el-form :model="queryForm" label-position="top">
<el-row :gutter="20">
<el-col :span="4">
<el-form-item label="BU">
<el-select v-model="queryForm.buId" placeholder="请选择" clearable style="width: 100%">
<el-option
v-for = "i in userBuList"
:key = "i.id"
:label = "i.buDesc"
:value = "i.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="客户编码">
<el-input v-model="queryForm.customerNo"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="客户名称">
<el-input v-model="queryForm.customerDesc"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="报价单号">
<el-input v-model="queryForm.quoteVersionNo"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label=" ">
<el-button type="primary" @click="handleQuery">查询</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<el-table v-loading="queryLoading" :data="dataList" border :height="height" :row-style="rowStyle" @row-click="handleRowClick">
<el-table-column
v-for="(item,index) in columns" :key="index"
:sortable="item.columnSortable"
:prop="item.columnProp"
:header-align="item.headerAlign"
:show-overflow-tooltip="item.showOverflowTooltip"
:align="item.align"
:fixed="item.fixed===''?false:item.fixed"
:min-width="item.columnWidth"
:label="item.columnLabel">
<template slot-scope="scope">
<span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
<span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
</template>
</el-table-column>
<!-- <el-table-column-->
<!-- fixed="right"-->
<!-- header-align="center"-->
<!-- align="center"-->
<!-- width="100"-->
<!-- label="操作">-->
<!-- <template slot-scope="{row,$index}">-->
<!-- </template>-->
<!-- </el-table-column>-->
</el-table>
<el-pagination @size-change="handleSizeChange"
@current-change="handlePageChange"
: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="activeName">
<el-tab-pane label="详情" name="detail">
<el-form :model="currentRow" label-position="top" style="width: 1000px">
<el-row :gutter="20">
<el-col :span="4">
<el-form-item label="报价单号">
<el-input v-model="currentRow.quoteVersionNo" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="BU">
<el-input v-model="currentRow.buDesc" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="工厂编码">
<el-input v-model="currentRow.site" readonly></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="4">
<el-form-item label="客户编码">
<el-input v-model="currentRow.customerNo" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="客户名称">
<el-input v-model="currentRow.customerDesc" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="4" :offset="2">
<el-form-item label="状态">
<el-input v-model="currentRow.status" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="20">
<el-form-item label="报价备注" class="auto" :show-message="false">
<el-input type="textarea" v-model="currentRow.quoteRemark" resize="none" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="20">
<el-form-item label="报价详情备注" class="auto" :show-message="false">
<el-input type="textarea" v-model="currentRow.remark" resize="none" readonly></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="4">
<el-form-item label="创建人">
<el-input v-model="currentRow.createBy" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="创建日期">
<el-input v-model="currentRow.createDate" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="最近更新人">
<el-input v-model="currentRow.updateBy" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="最近更新日期">
<el-input v-model="currentRow.updateDate" readonly></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-tab-pane>
<el-tab-pane name="inquiry" label="询价单信息">
<el-form :model="currentRow" label-position="top" style="width: 1000px">
<el-row :gutter="20">
<el-col :span="5">
<el-form-item label="询价单号">
<el-input v-model="currentRow.internalInquiryNo" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="询价日期">
<el-input v-model="currentRow.requestDate" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="PJM">
<el-input v-model="currentRow.requesterName" readonly></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="5">
<el-form-item label="客户询价单号">
<el-input v-model="currentRow.customerInquiryNo" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="要求报价日期">
<el-input v-model="currentRow.requiredCompletionDate" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="优先等级">
<el-input v-model="currentRow.priorityLevel" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="状态">
<el-input v-model="currentRow.rfqStatus" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="20">
<el-form-item label="备注" class="auto" :show-message="false">
<el-input type="textarea" v-model="currentRow.rfqRemark" resize="none" readonly></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-table :data="inquiryDataList" v-loading="queryPropertyLoading" height="19vh" style="margin-top: 10px;width: 1000px" border>
<el-table-column label="属性编码" header-align="center" min-width="100" prop="itemNo"></el-table-column>
<el-table-column label="属性名称" header-align="center" min-width="160" prop="itemDesc"></el-table-column>
<el-table-column label="属性类型" header-align="center" min-width="80" prop="valueType"></el-table-column>
<el-table-column label="属性值" header-align="center" min-width="100">
<template slot-scope="scope">
<span v-if="scope.row.valueType === '文本'">{{ scope.row.textValue }}</span>
<span v-if="scope.row.valueType === '数字'">{{ scope.row.numValue }}</span>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<!-- <el-tab-pane name="breakdown" label="Cost Breakdown">-->
<!-- </el-tab-pane>-->
</el-tabs>
</div> </div>
</template> </template>
<style scoped> <style scoped>
.el-table /deep/ .cell{
height: auto;
line-height: 1.5;
}
.auto /deep/ .el-form-item__content{
height: auto;
line-height: 1.5;
}
</style> </style>
Loading…
Cancel
Save