You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

830 lines
24 KiB

<!--总成模块信息管理页-->
<template>
<div class="cr-body-content">
<div ref="box">
<flexbox class="content-header">
<el-form
:model="listQuery"
ref="queryForm"
v-show="showSearch"
:inline="true"
>
<!-- <el-row> -->
<el-form-item label="生产线:" prop="productType">
<el-select
v-model="listQuery.productType"
clearable
placeholder="请选择"
size="medium"
style="margin-right: 15px"
@change="ptypeselectChange"
>
<el-option
v-for="item in productTypeList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="" prop="productLine">
<el-select
v-model="listQuery.productLine"
clearable
placeholder="请选择"
size="medium"
style="margin-right: 15px"
@change="valueselectChange"
>
<el-option
v-for="item in PLChildList"
:key="item.id"
:label="item.productLineName"
:value="item.productLineCode"
/>
</el-select>
</el-form-item>
<el-form-item label="版本:" prop="Version">
<el-input
v-model="listQuery.Version"
placeholder=""
clearable
size="small"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- </el-row> -->
<!-- <el-row> -->
<el-form-item label="大众顺序号:" prop="HostSNBegin">
<el-input
v-model="listQuery.HostSNBegin"
placeholder=""
clearable
size="small"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="-" prop="HostSNEnd">
<el-input
v-model="listQuery.HostSNEnd"
placeholder=""
clearable
size="small"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="KNR:" prop="KNRBegin">
<el-input
v-model="listQuery.KNRBegin"
placeholder=""
clearable
size="small"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="-" prop="KNREnd">
<el-input
v-model="listQuery.KNREnd"
placeholder=""
clearable
size="small"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<!-- </el-row> -->
<!-- <el-row> -->
<!-- <el-form-item label="底盘号:" prop="VINBegin">
<el-input
v-model="listQuery.VINBegin"
placeholder=""
clearable
size="small"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="-" prop="VINEnd">
<el-input
v-model="listQuery.VINEnd"
placeholder=""
clearable
size="small"
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item> -->
<el-form-item label="上线日期">
<el-date-picker
v-model="listQuery.OnlineTimeValue"
size="small"
style="width: 380px"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetimerange" :default-time="['00:00:00','23:59:59']"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<!-- </el-row> -->
<!-- <el-row> -->
<el-form-item label="接收日期">
<el-date-picker
v-model="listQuery.ReceiveTimeValue"
size="small"
style="width: 380px"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetimerange" :default-time="['00:00:00','23:59:59']"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item label="单据状态" prop="State">
<el-checkbox-group v-model="listQuery.state">
<el-checkbox
v-for="(item, index) in billState"
:key="item.id"
:label="item.id"
@change="checkedListChange(index)"
>
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item style="margin:0">
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleFilter"
>搜索</el-button
>
<el-button
icon="el-icon-refresh"
size="mini"
@click="resetQuery('queryForm')"
>重置</el-button
>
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
style="margin-left: 15px"
@click="handleDownload()"
>导出(Excel)
</el-button>
<el-button
type="primary"
size="mini"
style="margin-left: 15px"
@click="SAPExport()"
>导出Excel(用于SAP导入)
</el-button>
</el-form-item>
<!-- </el-row> -->
</el-form>
</flexbox>
</div>
<div class="l-table" style="margin-top:-30px">
<!--表格渲染-->
<el-table
ref="multipleTable"
v-loading="listLoading"
element-loading-text="拼命加载中..."
element-loading-spinner="el-icon-loading"
class="cr-table"
:data="list"
:height="tableHeight"
:cell-style="cellStyle"
:header-cell-style="headerRowStyle"
size="small"
stripe
border
highlight-current-row
style="width: 100%;margin-top:30px"
@sort-change="sortChange"
@selection-change="handleSelectionChange"
@row-click="handleRowClick"
>
<el-table-column
label="KNR"
prop="knr"
sortable="custom"
align="center"
width="180px"
>
<template slot-scope="scope">
<span class="link-type" @click="handleDrawerOpen(scope.row)">{{
scope.row.knr
}}</span>
</template>
</el-table-column>
<el-table-column
v-for="(item, index) in getDefaultField"
:key="index"
:prop="item.prop"
:label="item.label"
:min-width="item.width"
:formatter="fieldFormatter"
sortable="custom"
show-overflow-tooltip
:gutter="0"
>
<template slot="header" slot-scope="scope">
{{ scope.column.label }}
</template>
</el-table-column>
</el-table>
</div>
<div class="table-footer">
<!-- 分页控件 style="margin-top: -25px;margin-bottom:-25px;float:right;"-->
<pagination
v-show="totalCount > 0"
:total="totalCount"
:page.sync="page"
:limit.sync="listQuery.MaxResultCount"
@pagination="getList"
/>
<!-- 抽屉控件 -->
<el-drawer
title="信息详细页"
size="75%"
direction="rtl"
:visible.sync="drawer"
:before-close="handleDrawerClose"
>
<div>
<Detail
v-bind:customerInfos="customerInfos"
style="margin-top: -35px"
></Detail>
</div>
</el-drawer>
</div>
</div>
</template>
<script>
import Pagination from "@/components/Pagination";
import permission from "@/directive/permission/index.js";
import CRMTableHead from "../../components/CRMTableHead";
import importExcel from "@/components/ImportExcel-vw";
import Lockr from "lockr";
import { mapGetters } from "vuex";
import moment from "moment";
import Detail from "./detail.vue";
import { downloadFile } from "@/utils/crmindex.js";
//组件计量单位
const bomUnit = [
{ key: 0, display_name: "PC" },
{ key: 1, display_name: "TON" },
{ key: 2, display_name: "Other" },
];
const projectTypeKeyValue = bomUnit.reduce((acc, cur) => {
acc[cur.key] = cur.display_name;
return acc;
}, {});
export default {
name: "R100Online",
components: { Pagination, CRMTableHead, importExcel, Detail },
directives: { permission },
filters: {
IsCustomerSignFilter(status) {
//翻译是否签字
const statusMap = {
true: "",
false: "",
};
return statusMap[status];
},
},
data() {
const validVersion = (rule, value, callback) => {
let numberReg = /^\d{6}$/;
if (!numberReg.test(value)) {
callback(new Error("只能为6位数字"));
} else {
callback();
}
};
return {
crmType: "R100Online",
rules: {
erpAssemblyName: [
{ required: true, message: "必须输入", trigger: "blur" },
],
},
billState: [
{ id: 2, name: "未导出" },
{ id: 3, name: "已导出" },
],
valueSelect: "",
customerInfos: [],
dialogOptions: [],
versionValue: "",
searchContent: "", // 输入内容
showExcelImport: false,
form: {},
drawer: false,
list: null,
totalCount: 0,
listLoading: true,
customerInfo: {
bomId: "",
},
// 高级搜索
filterObj: {
type: Object,
default: () => {
return {};
},
},
listQuery: {
SkipCount: 0,
MaxResultCount: 15,
productType: 1,
ProductLine: undefined,
Version: undefined,
HostSNBegin: undefined,
HostSNBegin: undefined,
KNRBegin: undefined,
KNREnd: undefined,
//VINBegin:undefined,
VINEnd: undefined,
OnlineTimeValue: [],
OnlineTimeBegin: undefined,
OnlineTimeEnd: undefined,
ReceiveTimeValue: [],
ReceiveTimeBegin: undefined,
ReceiveTimeEnd: undefined,
billStatus: undefined,
state: [],
},
listExportQuery: {
erpAssemblyCode: undefined,
erpAssemblyName: undefined,
},
listPLQuery: {
BillType: 1,
//UserId: "00000000-0000-0000-0000-000000000000",
},
form: {
details: [],
},
page: 1,
// 显示搜索条件
showSearch: true,
bomUnit,
multipleSelection: [],
drawer: false,
dialogFormVisible: false,
formTitle: "",
isEdit: false,
formLoading: false,
tableHeight: document.documentElement.clientHeight - 335,
detailTableHeight: 250,
details: [], //修改子表数据源
PLChildList: [], //筛选后产线下拉
productTypeList: [
{ id: 1, name: "门板" },
{ id: 2, name: "柱护板" },
],
};
},
mounted() {
this.getList();
this.$nextTick(() => {
var offsetHei = document.documentElement.clientHeight;
//console.log(offsetHei);
let boxH = this.$refs.box.offsetHeight;
this.tableHeight = offsetHei - boxH - 57 - 79; //57为footer高度,79为页面上部标签高度
//console.log(this.$refs.box.offsetHeight);
//console.log(this.tableHeight);
});
},
created() {
this.billState.forEach((element, index) => {
if (index === 0) {
this.listQuery.state.push(element.id);
}
});
this.getProductLine();
},
computed: {
getDefaultField() {
var tempsTabs = [];
tempsTabs.push({ label: "大众顺序号", prop: "hostSN", width: 120});
// tempsTabs.push({
// label: "底盘号",
// prop: "vin",
// width: 130,
// });
// tempsTabs.push({
// label: "KNR",
// prop: "knr",
// width: 150,
// });
tempsTabs.push({
label: "单据状态",
prop: "billStatus",
width: 150,
});
tempsTabs.push({
label: "上线时间",
prop: "onlineTime",
width: 150,
});
tempsTabs.push({
label: "接收时间",
prop: "receiveTime",
width: 180,
});
tempsTabs.push({
label: "车型代码",
prop: "vehicleModelCode",
width: 120,
});
tempsTabs.push({
label: "版本",
prop: "version",
width: 150,
});
tempsTabs.push({
label: "总成编号",
prop: "erpAssemblyCode",
width: 150,
});
tempsTabs.push({
label: "总成名称",
prop: "erpAssemblyName",
width: 400,
});
tempsTabs.push({
label: "产线",
prop: "productLine",
width: 120,
});
// tempsTabs.push({
// label: "状态",
// prop: "billStatus",
// width: 120,
// });
tempsTabs.push({
label: "备注",
prop: "remark",
width: 120,
});
return tempsTabs;
},
...mapGetters(["userInfo"]), //获取当前用户信息
},
methods: {
//抽屉
handleDrawerOpen(param) {
this.drawer = true;
var parentId = param.assemblyID; //主键id
this.customerInfos = [
{
ParentId: parentId,
BillId: param.id
},
];
},
handleDrawerClose(done) {
done();
},
/** 导出功能 */
handleDownload() {
this.listLoading = true;
this.listExportQuery.erpAssemblyCode = this.listQuery.ErpAssemblyCode;
this.listExportQuery.erpAssemblyName = this.listQuery.ErpAssemblyName;
console.log(JSON.stringify(this.listQuery));
this.$axios
.posts("/api/newjit/bill-r100/export-erp-assembly-code", this.listQuery)
.then((res) => {
let filename = res.item;
this.$axios
.BolbGets("/api/newjit/exclude-part-cfg/download/" + filename)
.then((response) => {
if (filename.indexOf("_") != -1) {
let downName =
filename.slice(0, filename.lastIndexOf("_")) +
filename.slice(filename.lastIndexOf("."));
downloadFile(response, downName);
this.$notify({
title: "成功",
message: "数据-导出成功",
type: "success",
duration: 2000,
});
} else {
downloadFile(response, filename);
this.$notify({
title: "成功",
message: "数据-导出成功",
type: "success",
duration: 2000,
});
}
this.listLoading = false;
});
});
this.listLoading = false;
},
/** 重置按钮操作 */
resetQuery(refName) {
this.$refs[refName].resetFields();
this.listQuery.OnlineTimeValue = [];
this.listQuery.ReceiveTimeValue = [];
this.listQuery.state = [];
this.handleQuery();
this.getProductLine();
},
/** 搜索按钮操作 */
handleQuery() {
this.listQuery.SkipCount = 1;
//this.getList();
},
selectValue(params) {
//版本下拉选择
this.versionValue = params.value;
this.getList();
},
selectOptionsChange(item) {
this.getList();
},
importExcelData() {
//关闭导入窗体时调用
this.showExcelImport = false;
//this.getList();
},
/** 刷新列表 */
handleHandle(data) {
if (data.type !== "edit") {
this.getList();
}
},
handleAddDetails() {
if (this.form.details === undefined) {
this.form.details = [];
//console.log(679);
}
let obj = {};
obj.partCode = "";
obj.partName = "";
obj.partNum = "";
obj.isKey = false;
obj.description = "";
//console.log(this.form.details);
this.form.details.push(obj);
//console.log(688);
},
handleDeleteDetails(index) {
this.form.details.splice(index, 1);
//console.log(693);
},
/** 格式化字段 */
fieldFormatter(row, column) {
if (column.property === "billStatus") {
return { 0: "未匹配", 2: "未导出", 3: "已导出" }[row[column.property]];
}
if (column.property == "onlineTime" || column.property == "receiveTime") {
var date = row[column.property];
if (date == undefined) {
return "";
}
return moment(date).format("YYYY-MM-DD HH:mm:ss");
}
return row[column.property] || "--";
},
roleFilter(type) {
return projectTypeKeyValue[type];
},
getList(data) {
this.listLoading = true;
if (data != undefined) {
this.listQuery.SkipCount = (this.page - 1) * data.limit;
} else {
this.listQuery.SkipCount = (this.page - 1) * 15;
}
if (this.listQuery.OnlineTimeValue !== undefined) {
this.listQuery.OnlineTimeBegin = this.listQuery.OnlineTimeValue[0];
this.listQuery.OnlineTimeEnd = this.listQuery.OnlineTimeValue[1];
}
if (this.listQuery.ReceiveTimeValue !== undefined) {
this.listQuery.ReceiveTimeBegin = this.listQuery.ReceiveTimeValue[0];
this.listQuery.ReceiveTimeEnd = this.listQuery.ReceiveTimeValue[1];
}
if (this.listQuery.state !== undefined) {
this.listQuery.billStatus = this.listQuery.state[0];
}
this.$axios
.gets("/api/newjit/bill-r100/list", this.listQuery)
.then((response) => {
this.list = response.items;
this.totalCount = response.totalCount;
setTimeout(() => {
//大数据量加载时
this.listLoading = false;
}, 500);
})
.catch(() => {
this.listLoading = false;
});
},
getDetialList(partCode) {
this.listLoading = true;
console.log("详表条件" + JSON.stringify(this.customerInfo.parentId));
this.$axios
.gets("/api/newjit/assembly-cfg-erp/" + this.customerInfo.parentId)
.then((response) => {
//console.log(partCode)
if (partCode !== "" && partCode !== undefined) {
//console.log(partCode)
this.list = response.item.details.filter(
(u) => u.partCode === partCode
);
} else {
this.list = response.item.details;
}
//alert(JSON.stringify(response.Items))
//this.totalCount = response.totalCount;
setTimeout(() => {
//大数据量加载时
this.listLoading = false;
}, 500);
})
.catch(() => {
this.listLoading = false;
});
},
valueselectChange() {
this.$forceUpdate();
},
handleImportSAP() {},
handleFilter() {
this.page = 1;
this.getList();
},
sortChange(data) {
const { prop, order } = data;
if (!prop || !order) {
this.handleFilter();
return;
}
this.listQuery.Sorting = prop + " " + order;
this.handleFilter();
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
/** 通过回调控制style */
cellStyle({ row, column, rowIndex, columnIndex }) {
if (column.property === "qty") {
return { textAlign: "right" };
} else {
return { textAlign: "left" };
}
},
/** 通过回调控制表头style */
headerRowStyle({ row, column, rowIndex, columnIndex }) {
if (column.property === "qty") {
return { textAlign: "right", background: "#FAFAFA" };
} else {
return { textAlign: "left", background: "#FAFAFA" };
}
},
handleRowClick(row, column, event) {
this.$refs.multipleTable.clearSelection();
this.$refs.multipleTable.toggleRowSelection(row);
},
SAPExport() {
this.listLoading = true;
// this.listExportQuery.erpAssemblyCode = this.listQuery.ErpAssemblyCode;
// this.listExportQuery.erpAssemblyName = this.listQuery.ErpAssemblyName;
console.log(JSON.stringify(this.listQuery));
this.$axios
.posts("/api/newjit/bill-r100/export-erp-assembly-code", this.listQuery)
.then((res) => {
let filename = res.item;
this.$axios
.BolbGets("/api/newjit/exclude-part-cfg/download/" + filename)
.then((response) => {
if (filename.indexOf("_") != -1) {
let downName =
filename.slice(0, filename.lastIndexOf("_")) +
filename.slice(filename.lastIndexOf("."));
downloadFile(response, downName);
this.$notify({
title: "成功",
message: "数据-导出成功",
type: "success",
duration: 2000,
});
} else {
downloadFile(response, filename);
this.$notify({
title: "成功",
message: "数据-导出成功",
type: "success",
duration: 2000,
});
}
this.listLoading = false;
});
});
this.listLoading = false;
},
//获取所有产线
getProductLine() {
this.listPLQuery.UserId = this.userInfo.userId;
this.$axios
.gets("/api/newjit/product-line/list", this.listPLQuery)
.then((response) => {
//console.log(response);
this.PLList = response.item;
this.PLChildList = this.PLList.filter(
(u) => u.productType === parseInt(this.listQuery.productType)
).sort((a, b) => {
return a.productLineCode - b.productLineCode;
});
this.listQuery.productLine = this.PLChildList[0].productLineCode;
this.getList();
//console.log(this.PLList)
})
.catch(() => {});
},
//产线类型变更
ptypeselectChange() {
this.$forceUpdate();
//console.log(this.listQuery.productType);
this.listQuery.productLine = "";
this.PLChildList = this.PLList.filter(
(u) => u.productType === parseInt(this.listQuery.productType)
).sort((a, b) => {
return a.productLineCode - b.productLineCode;
});
//console.log(this.PLList)
},
/*单据状态变更 */
checkedListChange(index) {
if (this.listQuery.state.length <= 1) {
this.listQuery.state.push(this.billState[index].id);
} else {
this.listQuery.state = [];
this.listQuery.state.push(this.billState[index].id);
}
},
},
};
</script>
<style lang="scss" scoped>
@import "../../../pg-fis/styles/crmtable.scss";
// /*表格全选框去除空框*/
// .el-table >>> .DisabledSelection .cell .el-checkbox__inner {
// display: none;
// position: relative;
// }
// /*表格全选框改为:选择*/
// .el-table >>> .DisabledSelection .cell:before {
// content: "是否Key件";
// position: absolute;
// left: 7px;
// }
.divider1 {
margin: 0;
}
.divider2 {
margin: 10px;
margin-bottom: 20px;
width: 95%;
}
</style>