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.
513 lines
14 KiB
513 lines
14 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-form-item label="源零件编码" prop="sourcePartCode" class="forimitem">
|
|
<el-input v-model="listQuery.sourcePartCode" placeholder="请输入源零件编码" clearable size="small" style="width: 240px"
|
|
@keyup.enter.native="handleQuery" />
|
|
</el-form-item>
|
|
|
|
<el-form-item label="源零件名称" prop="sourcePartName" class="forimitem">
|
|
<el-input v-model="listQuery.sourcePartName" placeholder="请输入源零件名称" clearable size="small" style="width: 240px"
|
|
@keyup.enter.native="handleQuery" />
|
|
</el-form-item>
|
|
|
|
<el-form-item label="目标零件编码" prop="targetPartCode" class="forimitem">
|
|
<el-input v-model="listQuery.targetPartCode" placeholder="请输入目标零件编码" clearable size="small" style="width: 240px"
|
|
@keyup.enter.native="handleQuery" />
|
|
</el-form-item>
|
|
|
|
<el-form-item label="目标零件名称" prop="targetPartName" class="forimitem">
|
|
<el-input v-model="listQuery.targetPartName" placeholder="请输入目标零件名称" clearable size="small" style="width: 240px"
|
|
@keyup.enter.native="handleQuery" />
|
|
</el-form-item>
|
|
|
|
<el-form-item class="formitem">
|
|
<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-form-item>
|
|
|
|
<el-form-item style="margin-bottom: 0px; ">
|
|
<el-button class="filter-item" size="mini" type="primary" icon="el-icon-plus" @click="handleCreate">新增
|
|
</el-button>
|
|
<el-button class="filter-item" size="mini" type="primary" icon="el-icon-edit" @click="handleUpdate">修改
|
|
</el-button>
|
|
<el-button class="filter-item" size="mini" type="primary" icon="el-icon-delete" @click="handleDelete">删除
|
|
</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</flexbox>
|
|
</div>
|
|
<div class="l-table">
|
|
<!--表格渲染-->
|
|
<el-table ref="multipleTable" v-loading="listLoading" element-loading-text="拼命加载中..." element-loading-spinner="el-icon-loading"
|
|
class="cr-table" :data="tableData" :height="tableHeight" :cell-style="cellStyle" :header-cell-style="headerRowStyle"
|
|
size="small" stripe border highlight-current-row style="width: 100%" @sort-change="sortChange" @selection-change="handleSelectionChange"
|
|
@row-click="handleRowClick">
|
|
<el-table-column type="selection" width="44px"></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>
|
|
|
|
<!--表单渲染-->
|
|
<el-dialog :visible.sync="dialogFormVisible" :close-on-click-modal="false" :title="formTitle" width="700px" @close="closeDialog">
|
|
<el-form ref="form" :inline="true" :model="childFormModel" :rules="rules" size="small" label-width="120px">
|
|
<el-row>
|
|
<el-col :span="4">
|
|
<el-form-item label="源零件编码：" required />
|
|
</el-col>
|
|
<el-col :span="20">
|
|
<el-form-item prop="sourcePartCode">
|
|
<el-input style="width: 400px" v-model="childFormModel.sourcePartCode" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row>
|
|
<el-col :span="4">
|
|
<el-form-item label="目标零件编码：" required />
|
|
</el-col>
|
|
<el-col :span="20">
|
|
<el-form-item prop="targetPartCode">
|
|
<el-input style="width: 400px" v-model="childFormModel.targetPartCode" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
<!--表格渲染-->
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button type="text" @click="dialogFormVisible = false">取消</el-button>
|
|
<el-button v-loading="formLoading" type="primary" @click="save()">确认</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
</div>
|
|
|
|
<div class="table-footer">
|
|
<!-- 分页控件 -->
|
|
<pagination v-show="totalCount > 0" :total="totalCount" :page.sync="pageIndex" :limit.sync="listQuery.maxResultCount"
|
|
@pagination="getList" />
|
|
</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/ImportTxt";
|
|
import Lockr from "lockr";
|
|
import moment from "moment";
|
|
//import Detail from "./detail.vue";
|
|
import {
|
|
downloadFile
|
|
} from "@/utils/crmindex.js";
|
|
|
|
export default {
|
|
name: "PartSwitch",
|
|
components: {
|
|
Pagination,
|
|
CRMTableHead,
|
|
importExcel,
|
|
//Detail
|
|
},
|
|
directives: {
|
|
permission
|
|
},
|
|
// filters: {
|
|
// IsCustomerSignFilter(status) {
|
|
// //翻译是否签字
|
|
// const statusMap = {
|
|
// true: "是",
|
|
// false: "否",
|
|
// };
|
|
// return statusMap[status];
|
|
// },
|
|
// },
|
|
data() {
|
|
|
|
return {
|
|
rules: {
|
|
sourcePartCode: [{
|
|
required: true,
|
|
message: "必须输入！",
|
|
trigger: "blur"
|
|
}],
|
|
targetPartCode: [{
|
|
required: true,
|
|
message: "必须输入！",
|
|
trigger: "blur"
|
|
}],
|
|
},
|
|
|
|
tableData: null,
|
|
totalCount: 0,
|
|
listLoading: true,
|
|
|
|
listQuery: {
|
|
sourcePartCode: undefined,
|
|
sourcePartName: undefined,
|
|
targetPartCode: undefined,
|
|
targetPartName: undefined,
|
|
maxResultCount: 15,
|
|
skipCount: 0
|
|
},
|
|
|
|
childFormModel: {
|
|
},
|
|
//当前页索引
|
|
pageIndex: 1,
|
|
// 显示搜索条件
|
|
showSearch: true,
|
|
|
|
multipleSelection: [],
|
|
dialogFormVisible: false,
|
|
formTitle: "",
|
|
isEdit: false,
|
|
formLoading: false,
|
|
tableHeight: document.documentElement.clientHeight - 280,
|
|
};
|
|
},
|
|
mounted() {
|
|
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为页面上部标签高度
|
|
|
|
});
|
|
},
|
|
created() {
|
|
debugger
|
|
this.getList();
|
|
|
|
},
|
|
computed: {
|
|
getDefaultField() {
|
|
var tempsTabs = [];
|
|
tempsTabs.push({
|
|
label: "源零件编码",
|
|
prop: "sourcePartCode",
|
|
width: 150,
|
|
});
|
|
tempsTabs.push({
|
|
label: "源零件名称",
|
|
prop: "sourcePartName",
|
|
width: 200,
|
|
});
|
|
tempsTabs.push({
|
|
label: "目标零件编码",
|
|
prop: "targetPartCode",
|
|
width: 150,
|
|
});
|
|
tempsTabs.push({
|
|
label: "目标零件名称",
|
|
prop: "targetPartName",
|
|
width: 200,
|
|
});
|
|
tempsTabs.push({
|
|
label: "创建时间",
|
|
prop: "creationTime",
|
|
width: 180,
|
|
});
|
|
console.log("字段列表：" + JSON.stringify(tempsTabs));
|
|
return tempsTabs;
|
|
},
|
|
},
|
|
methods: {
|
|
/**
|
|
* 子窗口保存按钮事件
|
|
*/
|
|
save() {
|
|
|
|
let _this = this;
|
|
this.$refs.form.validate((valid) => {
|
|
if (valid) {
|
|
console.log("保存参数:" + JSON.stringify(_this.childFormModel));
|
|
_this.formLoading = true;
|
|
if (_this.isEdit) {
|
|
//修改
|
|
_this.$axios
|
|
.puts("/api/newjit/part-switch/" + _this.childFormModel.id, _this.childFormModel)
|
|
.then((response) => {
|
|
_this.formLoading = false;
|
|
_this.$notify({
|
|
title: "成功",
|
|
message: "更新成功",
|
|
type: "success",
|
|
duration: 2000,
|
|
});
|
|
_this.dialogFormVisible = false;
|
|
_this.getList();
|
|
})
|
|
.catch(() => {
|
|
_this.formLoading = false;
|
|
});
|
|
} else {
|
|
//insert添加
|
|
console.log(JSON.stringify(_this.childFormModel));
|
|
_this.$axios
|
|
.posts("/api/newjit/part-switch", _this.childFormModel)
|
|
.then((response) => {
|
|
_this.formLoading = false;
|
|
_this.$notify({
|
|
title: "成功",
|
|
message: "新增成功",
|
|
type: "success",
|
|
duration: 2000,
|
|
});
|
|
_this.dialogFormVisible = false;
|
|
_this.getList();
|
|
})
|
|
.catch(() => {
|
|
_this.formLoading = false;
|
|
});
|
|
}
|
|
}
|
|
});
|
|
},
|
|
|
|
/** 新增 */
|
|
handleCreate() {
|
|
if (this.$refs["form"] !== undefined) {
|
|
this.$nextTick(() => {
|
|
|
|
this.$refs["form"].resetFields();
|
|
});
|
|
}
|
|
this.formTitle = "新增";
|
|
this.isEdit = false;
|
|
this.childFormModel = {};
|
|
this.dialogFormVisible = true;
|
|
},
|
|
/** 修改 */
|
|
handleUpdate(row) {
|
|
this.formTitle = "修改";
|
|
this.isEdit = true;
|
|
if (this.multipleSelection.length != 1) {
|
|
this.$message({
|
|
message: "编辑必须选择单行",
|
|
type: "warning",
|
|
});
|
|
return;
|
|
} else {
|
|
this.fetchData(this.multipleSelection[0].id);
|
|
this.dialogFormVisible = true;
|
|
}
|
|
},
|
|
/** 删除 */
|
|
handleDelete(row) {
|
|
if (this.multipleSelection.length != 1) {
|
|
this.$message({
|
|
message: "编辑必须选择单行",
|
|
type: "warning",
|
|
});
|
|
return;
|
|
}
|
|
this.$confirm(
|
|
"是否删除记录" + this.multipleSelection[0].sourcePartCode + "?",
|
|
"提示", {
|
|
confirmButtonText: "确定",
|
|
cancelButtonText: "取消",
|
|
type: "warning",
|
|
}
|
|
)
|
|
.then(() => {
|
|
this.$axios
|
|
.deletes(
|
|
"/api/newjit/part-switch/" + this.multipleSelection[0].id
|
|
)
|
|
.then((response) => {
|
|
|
|
this.$notify({
|
|
title: "成功",
|
|
message: "删除成功",
|
|
type: "success",
|
|
duration: 2000,
|
|
});
|
|
this.getList();
|
|
});
|
|
})
|
|
.catch(() => {
|
|
this.$message({
|
|
type: "info",
|
|
message: "已取消删除",
|
|
});
|
|
});
|
|
},
|
|
fetchData(id) {
|
|
//循环动态
|
|
this.$axios
|
|
.gets("/api/newjit/part-switch/" + id)
|
|
.then((response) => {
|
|
this.childFormModel = response.item;
|
|
});
|
|
},
|
|
/** 导出功能 */
|
|
handleDownload() {
|
|
this.listLoading = true;
|
|
console.log(JSON.stringify(this.listQuery));
|
|
this.$axios
|
|
.posts("/api/newjit/part-switch/export", 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.handleQuery();
|
|
this.listQuery.TargetPartName = [];
|
|
},
|
|
/** 搜索按钮操作 */
|
|
handleQuery() {
|
|
this.listQuery.skipCount = 0;
|
|
this.getList();
|
|
},
|
|
|
|
/** 格式化字段 */
|
|
fieldFormatter(row, column) {
|
|
return row[column.property];
|
|
},
|
|
|
|
getList() {
|
|
let _this = this;
|
|
this.listLoading = true;
|
|
console.log("getList方法参数：" + JSON.stringify(this.listQuery));
|
|
this.listQuery.skipCount = (this.pageIndex - 1) * this.listQuery.maxResultCount;
|
|
|
|
this.$axios
|
|
.gets("/api/newjit/part-switch/list", this.listQuery)
|
|
.then((response) => {
|
|
|
|
_this.tableData = response.items;
|
|
console.log("getList方法结果：" + JSON.stringify(_this.tableData));
|
|
_this.totalCount = response.totalCount;
|
|
setTimeout(() => {
|
|
//大数据量加载时
|
|
_this.listLoading = false;
|
|
}, 500);
|
|
})
|
|
.catch(() => {
|
|
_this.listLoading = false;
|
|
});
|
|
|
|
},
|
|
|
|
handleFilter() {
|
|
this.pageIndex = 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);
|
|
},
|
|
|
|
closeDialog() {
|
|
//this.multipleSelection = [];//清空数据
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
@import "../../../pg-fis/styles/crmtable.scss";
|
|
|
|
.divider1 {
|
|
margin: 0;
|
|
//width: 100%;
|
|
}
|
|
|
|
.formitem {
|
|
margin-bottom: 0;
|
|
}
|
|
</style>
|
|
|