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.
615 lines
20 KiB
615 lines
20 KiB
<template>
|
|
<div class="mod-config">
|
|
<!-- 条件查询 -->
|
|
<el-form :inline="true" label-position="top" :model="searchData">
|
|
<el-form-item label="BU">
|
|
<el-select v-model="searchData.buDesc" placeholder="请选择" clearable style="width: 80px">
|
|
<el-option
|
|
v-for="i in userBuList"
|
|
:key="i.buNo"
|
|
:label="i.buDesc"
|
|
:value="i.buDesc">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="方法编码">
|
|
<el-input v-model="searchData.methodNo" clearable style="width: 120px"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="方法名称">
|
|
<el-input v-model="searchData.methodName" clearable style="width: 200px"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="检验类型">
|
|
<el-select v-model="searchData.inspectionTypeNo" placeholder="请选择" style="width: 100px">
|
|
<el-option label="全部" value=""></el-option>
|
|
<el-option
|
|
v-for="i in options"
|
|
:key="i.inspectionTypeNo"
|
|
:label="i.inspectionTypeName"
|
|
:value="i.inspectionTypeNo">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label=" ">
|
|
<el-button v-if="!authSearch" type="primary" @click="getDataList()">查询</el-button>
|
|
<el-button v-if="!authSave" type="primary" @click="addModal()">新增</el-button>
|
|
<download-excel
|
|
:fields="fields()"
|
|
:data="exportData"
|
|
type="xls"
|
|
:name="exportName"
|
|
:header="exportHeader"
|
|
:footer="exportFooter"
|
|
:fetch="createExportData"
|
|
:before-generate="startDownload"
|
|
:before-finish="finishDownload"
|
|
worksheet="导出信息"
|
|
class="el-button el-button--primary el-button--medium">
|
|
{{ "导出" }}
|
|
</download-excel>
|
|
</el-form-item>
|
|
</el-form>
|
|
|
|
<!-- 展示列表 -->
|
|
<el-table
|
|
:height="height"
|
|
:data="dataList"
|
|
@header-dragend="handleColumnResize"
|
|
border
|
|
v-loading="dataListLoading"
|
|
style="width: 100%;">
|
|
<el-table-column
|
|
v-for="(item,index) in columnList" :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">
|
|
<span v-if="columnsProp.includes(item.columnProp)">{{ scope.row[`${item.columnProp}Desc`] }}</span>
|
|
<span v-else>
|
|
{{ scope.row[item.columnProp] }}
|
|
</span>
|
|
</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="130"
|
|
label="操作">
|
|
<template slot-scope="scope">
|
|
<a v-if="!authUpdate" type="text" size="small" @click="updateModal(scope.row)">修改</a>
|
|
<a v-if="!authDelete" type="text" size="small" @click="deleteModal(scope.row)">删除</a>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<el-pagination
|
|
@size-change="sizeChangeHandle"
|
|
@current-change="currentChangeHandle"
|
|
:current-page="pageIndex"
|
|
:page-sizes="[20, 50, 100, 200, 500]"
|
|
:page-size="pageSize"
|
|
:total="totalPage"
|
|
layout="total, sizes, prev, pager, next, jumper">
|
|
</el-pagination>
|
|
|
|
<!-- 新增和修改 -->
|
|
<el-dialog title="检验方法" :close-on-click-modal="false" v-drag :visible.sync="modalFlag" width="500px">
|
|
<el-form :inline="true" label-position="top" :model="modalData" :rules="rules" style="margin-left: 7px;margin-top: -5px;">
|
|
<el-form-item label="BU" prop="bu" :rules="rules.bu">
|
|
<el-select v-model="modalData.bu" placeholder="请选择" :disabled="modalDisableFlag" style="width: 456px">
|
|
<el-option
|
|
v-for="i in userBuList"
|
|
:key="i.buNo"
|
|
:label="i.sitename"
|
|
:value="i.buNo">
|
|
<span style="float: left;width: 100px">{{ i.sitename }}</span>
|
|
<span style="float: right; color: #8492a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; font-size: 11px;width: 60px">
|
|
{{ i.buDesc }}
|
|
</span>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form>
|
|
<el-form :inline="true" label-position="top" :model="modalData" :rules="rules" style="margin-left: 7px;margin-top: -5px;">
|
|
<el-form-item label="方法名称:" prop="methodName" :rules="rules.methodNameType">
|
|
<el-input v-model="modalData.methodName" style="width: 221px"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="检验类型:" prop="inspectionTypeNo" :rules="rules.inspectionTypeNoType">
|
|
<el-select v-model="modalData.inspectionTypeNo" placeholder="请选择" style="width: 221px">
|
|
<el-option
|
|
v-for="i in options"
|
|
:key="i.inspectionTypeNo"
|
|
:label="i.inspectionTypeName"
|
|
:value="i.inspectionTypeNo">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form>
|
|
<el-form :inline="true" label-position="top" :model="modalData" style="margin-left: 7px;margin-top: -5px;">
|
|
<el-form-item :label="'检验方法说明:'">
|
|
<el-input v-model="modalData.methodRemark" style="width: 456px"></el-input>
|
|
</el-form-item>
|
|
</el-form>
|
|
<el-footer style="height:40px;margin-top: 20px;text-align:center">
|
|
<el-button type="primary" @click="saveData()">保存</el-button>
|
|
<el-button type="primary" @click="modalFlag = false">关闭</el-button>
|
|
</el-footer>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
// 请求体/响应字段与后端 DmMethodData 一致；删除前服务端检查 dm_method_item（DmMethodItemData）
|
|
import {
|
|
qcMethodSearch,
|
|
dmMethodSave,
|
|
dmMethodUpdate,
|
|
dmMethodDelete,
|
|
inspectionTypeSearch,
|
|
getSiteAndBuByUserName
|
|
} from "@/api/qc/dmBasic.js";
|
|
import { getTableDefaultListLanguage, getTableUserListLanguage, updateColumnSize } from "@/api/table.js";
|
|
import { userFavoriteList, saveUserFavorite, removeUserFavorite } from "@/api/userFavorite.js";
|
|
|
|
export default {
|
|
name: "DMQcMethod",
|
|
data() {
|
|
return {
|
|
columnsProp: ["createBy", "updateBy"],
|
|
favorite: false,
|
|
exportData: [],
|
|
exportName: "刀模检验方法" + this.dayjs().format("YYYYMMDDHHmmss"),
|
|
exportHeader: ["刀模检验方法"],
|
|
exportFooter: [],
|
|
exportList: [],
|
|
searchData: {
|
|
site: "",
|
|
userName: this.$store.state.user.name,
|
|
methodNo: "",
|
|
methodName: "",
|
|
inspectionTypeNo: "",
|
|
buDesc: "RFID",
|
|
page: 1,
|
|
limit: 10
|
|
},
|
|
pageIndex: 1,
|
|
pageSize: 20,
|
|
totalPage: 0,
|
|
height: 200,
|
|
dataList: [],
|
|
dataListLoading: false,
|
|
modalFlag: false,
|
|
modalDisableFlag: false,
|
|
modalData: {
|
|
site: this.$store.state.user.site,
|
|
bu: "2_03-RFID",
|
|
flag: "",
|
|
methodNo: "",
|
|
methodName: "",
|
|
createBy: this.$store.state.user.name,
|
|
updateBy: this.$store.state.user.name,
|
|
methodRemark: "",
|
|
inspectionTypeNo: "823"
|
|
},
|
|
columnList: [
|
|
{
|
|
userId: this.$store.state.user.name,
|
|
functionId: 822001,
|
|
serialNumber: "822001TableBuDesc",
|
|
tableId: "822001Table",
|
|
tableName: "检验方法维护表",
|
|
columnProp: "buDesc",
|
|
headerAlign: "center",
|
|
align: "center",
|
|
columnLabel: "BU",
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: "",
|
|
columnWidth: 100
|
|
},
|
|
{
|
|
userId: this.$store.state.user.name,
|
|
functionId: 822001,
|
|
serialNumber: "822001TableMethodNo",
|
|
tableId: "822001Table",
|
|
tableName: "检验方法维护表",
|
|
columnProp: "methodNo",
|
|
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: 822001,
|
|
serialNumber: "822001TableMethodName",
|
|
tableId: "822001Table",
|
|
tableName: "检验方法维护表",
|
|
columnProp: "methodName",
|
|
headerAlign: "center",
|
|
align: "left",
|
|
columnLabel: "方法名称",
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: "",
|
|
columnWidth: 200
|
|
},
|
|
{
|
|
userId: this.$store.state.user.name,
|
|
functionId: 822001,
|
|
serialNumber: "822001TableMethodRemark",
|
|
tableId: "822001Table",
|
|
tableName: "检验方法维护表",
|
|
columnProp: "methodRemark",
|
|
headerAlign: "center",
|
|
align: "left",
|
|
columnLabel: "方法说明",
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: "",
|
|
columnWidth: 200
|
|
},
|
|
{
|
|
userId: this.$store.state.user.name,
|
|
functionId: 822001,
|
|
serialNumber: "822001TableInspectionTypeName",
|
|
tableId: "822001Table",
|
|
tableName: "检验方法维护表",
|
|
columnProp: "inspectionTypeName",
|
|
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: 822001,
|
|
serialNumber: "822001TableCreateDate",
|
|
tableId: "822001Table",
|
|
tableName: "检验方法维护表",
|
|
columnProp: "createDate",
|
|
headerAlign: "center",
|
|
align: "center",
|
|
columnLabel: "创建时间",
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: "",
|
|
columnWidth: 170
|
|
},
|
|
{
|
|
userId: this.$store.state.user.name,
|
|
functionId: 822001,
|
|
serialNumber: "822001TableCreateBy",
|
|
tableId: "822001Table",
|
|
tableName: "检验方法维护表",
|
|
columnProp: "createBy",
|
|
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: 822001,
|
|
serialNumber: "822001TableUpdateDate",
|
|
tableId: "822001Table",
|
|
tableName: "检验方法维护表",
|
|
columnProp: "updateDate",
|
|
headerAlign: "center",
|
|
align: "center",
|
|
columnLabel: "更新时间",
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: "",
|
|
columnWidth: 170
|
|
},
|
|
{
|
|
userId: this.$store.state.user.name,
|
|
functionId: 822001,
|
|
serialNumber: "822001TableUpdateBy",
|
|
tableId: "822001Table",
|
|
tableName: "检验方法维护表",
|
|
columnProp: "updateBy",
|
|
headerAlign: "center",
|
|
align: "center",
|
|
columnLabel: "更新人",
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: "",
|
|
columnWidth: 120
|
|
}
|
|
],
|
|
rules: {
|
|
methodNameType: [{ required: true, message: " ", trigger: ["blur", "change"] }],
|
|
inspectionTypeNoType: [{ required: true, message: " ", trigger: ["blur", "change"] }],
|
|
bu: [{ required: true, message: " ", trigger: ["blur", "change"] }]
|
|
},
|
|
options: [],
|
|
userBuList: [],
|
|
authSearch: false,
|
|
authSave: false,
|
|
authUpdate: false,
|
|
authDelete: false,
|
|
menuId: this.$route.meta.menuId
|
|
};
|
|
},
|
|
mounted() {
|
|
this.$nextTick(() => {
|
|
this.height = window.innerHeight - 180;
|
|
});
|
|
},
|
|
created() {
|
|
this.getButtonAuthData();
|
|
this.getSiteAndBuByUserName();
|
|
this.favoriteIsOk();
|
|
this.inspectionTypeSearch();
|
|
this.getTableUserColumn(this.$route.meta.menuId + "table", 1);
|
|
if (!this.authSearch) {
|
|
this.getDataList();
|
|
}
|
|
},
|
|
methods: {
|
|
handleColumnResize(newWidth, oldWidth, column) {
|
|
const inData = this.columnList.filter(item => item.columnProp === column.property)[0];
|
|
inData.columnWidth = newWidth;
|
|
updateColumnSize(inData).then(({ data }) => {
|
|
if (data.code === 0) {
|
|
console.log("栏位宽度保存成功！");
|
|
}
|
|
});
|
|
},
|
|
getSiteAndBuByUserName() {
|
|
const tempData = { username: this.$store.state.user.name };
|
|
getSiteAndBuByUserName(tempData).then(({ data }) => {
|
|
if (data.code === 0) {
|
|
this.userBuList = data.rows;
|
|
}
|
|
});
|
|
},
|
|
getDataList() {
|
|
this.searchData.limit = this.pageSize;
|
|
this.searchData.page = this.pageIndex;
|
|
qcMethodSearch(this.searchData).then(({ data }) => {
|
|
if (data.code === 0) {
|
|
this.dataList = data.page.list;
|
|
this.pageIndex = data.page.currPage;
|
|
this.pageSize = data.page.pageSize;
|
|
this.totalPage = data.page.totalCount;
|
|
}
|
|
});
|
|
},
|
|
sizeChangeHandle(val) {
|
|
this.pageSize = val;
|
|
this.pageIndex = 1;
|
|
this.getDataList();
|
|
},
|
|
currentChangeHandle(val) {
|
|
this.pageIndex = val;
|
|
this.getDataList();
|
|
},
|
|
addModal() {
|
|
|
|
this.modalData = {
|
|
flag: "1",
|
|
site: this.$store.state.user.site,
|
|
bu: '2_03-RFID',
|
|
createBy: this.$store.state.user.name,
|
|
updateBy: this.$store.state.user.name,
|
|
methodNo: "",
|
|
methodName: "",
|
|
methodRemark: "",
|
|
inspectionTypeNo: "823"
|
|
};
|
|
this.modalDisableFlag = false;
|
|
this.modalFlag = true;
|
|
},
|
|
updateModal(row) {
|
|
this.modalData = {
|
|
flag: "2",
|
|
bu: row.site + "_" + row.buNo,
|
|
site: row.site,
|
|
createBy: this.$store.state.user.name,
|
|
updateBy: this.$store.state.user.name,
|
|
methodNo: row.methodNo,
|
|
methodName: row.methodName,
|
|
methodRemark: row.methodRemark,
|
|
inspectionTypeNo: row.inspectionTypeNo
|
|
};
|
|
this.modalDisableFlag = true;
|
|
this.modalFlag = true;
|
|
},
|
|
deleteModal(row) {
|
|
this.$confirm(`是否删除这个检验方法?`, "提示", {
|
|
confirmButtonText: "确定",
|
|
cancelButtonText: "取消",
|
|
type: "warning"
|
|
})
|
|
.then(() => {
|
|
dmMethodDelete(row).then(({ data }) => {
|
|
if (data && data.code === 0) {
|
|
this.getDataList();
|
|
this.$message({ message: "操作成功", type: "success", duration: 1500, onClose: () => {} });
|
|
} else {
|
|
this.$alert(data.msg, "错误", { confirmButtonText: "确定" });
|
|
}
|
|
});
|
|
})
|
|
.catch(() => {});
|
|
},
|
|
saveData() {
|
|
if (this.modalData.bu === "" || this.modalData.bu == null) {
|
|
this.$message.warning("请选择BU！");
|
|
return;
|
|
}
|
|
if (this.modalData.methodName === "" || this.modalData.methodName == null) {
|
|
this.$message.warning("请输入检验方法名称！");
|
|
return;
|
|
}
|
|
|
|
if (this.modalData.flag === "1") {
|
|
dmMethodSave(this.modalData).then(({ data }) => {
|
|
if (data && data.code === 0) {
|
|
this.getDataList();
|
|
this.modalFlag = false;
|
|
this.$message({ message: "操作成功", type: "success", duration: 1500, onClose: () => {} });
|
|
} else {
|
|
this.$alert(data.msg, "错误", { confirmButtonText: "确定" });
|
|
}
|
|
});
|
|
} else {
|
|
dmMethodUpdate(this.modalData).then(({ data }) => {
|
|
if (data && data.code === 0) {
|
|
this.getDataList();
|
|
this.modalFlag = false;
|
|
this.$message({ message: "操作成功", type: "success", duration: 1500, onClose: () => {} });
|
|
} else {
|
|
this.$alert(data.msg, "错误", { confirmButtonText: "确定" });
|
|
}
|
|
});
|
|
}
|
|
},
|
|
inspectionTypeSearch() {
|
|
const tempData = { site: this.$store.state.user.site };
|
|
inspectionTypeSearch(tempData).then(({ data }) => {
|
|
if (data.code === 0) {
|
|
this.options = data.rows;
|
|
this.modalData.inspectionTypeNo = "823";
|
|
}
|
|
});
|
|
},
|
|
favoriteIsOk() {
|
|
const userFavorite = { userId: this.$store.state.user.id, languageCode: this.$i18n.locale };
|
|
userFavoriteList(userFavorite).then(({ data }) => {
|
|
for (let i = 0; i < data.list.length; i++) {
|
|
if (this.$route.meta.menuId === data.list[i].menuId) {
|
|
this.favorite = true;
|
|
}
|
|
}
|
|
});
|
|
},
|
|
favoriteFunction() {
|
|
const userFavorite = { userId: this.$store.state.user.id, functionId: this.$route.meta.menuId };
|
|
if (this.favorite) {
|
|
removeUserFavorite(userFavorite).then(({ data }) => {
|
|
this.$message.success(data.msg);
|
|
this.favorite = false;
|
|
});
|
|
} else {
|
|
saveUserFavorite(userFavorite).then(({ data }) => {
|
|
this.$message.success(data.msg);
|
|
this.favorite = true;
|
|
});
|
|
}
|
|
},
|
|
async createExportData() {
|
|
this.searchData.limit = -1;
|
|
this.searchData.page = 1;
|
|
this.searchData.inspectionTypeNo = "823";
|
|
await qcMethodSearch(this.searchData).then(({ data }) => {
|
|
this.exportList = data.page.list;
|
|
});
|
|
return this.exportList;
|
|
},
|
|
startDownload() {},
|
|
finishDownload() {},
|
|
fields() {
|
|
let json = "{";
|
|
this.columnList.forEach((item, index) => {
|
|
if (index === this.columnList.length - 1) {
|
|
json += '"' + item.columnLabel + '":"' + item.columnProp + '"';
|
|
} else {
|
|
json += '"' + item.columnLabel + '":"' + item.columnProp + '",';
|
|
}
|
|
});
|
|
json += "}";
|
|
// eslint-disable-next-line no-eval
|
|
return eval("(" + json + ")");
|
|
},
|
|
async getTableUserColumn(tableId, columnId) {
|
|
const queryTableUser = {
|
|
userId: this.$store.state.user.name,
|
|
functionId: this.$route.meta.menuId,
|
|
tableId,
|
|
status: true,
|
|
languageCode: this.$i18n.locale
|
|
};
|
|
await getTableUserListLanguage(queryTableUser).then(({ data }) => {
|
|
if (data.rows.length > 0) {
|
|
if (columnId === 1) this.columnList = data.rows;
|
|
} else {
|
|
this.getColumnList(tableId, columnId);
|
|
}
|
|
});
|
|
},
|
|
async getColumnList(tableId, columnId) {
|
|
const queryTable = { functionId: this.$route.meta.menuId, tableId, languageCode: this.$i18n.locale };
|
|
await getTableDefaultListLanguage(queryTable).then(({ data }) => {
|
|
if (!data.rows.length === 0) {
|
|
if (columnId === 1) this.columnList = data.rows;
|
|
}
|
|
});
|
|
},
|
|
getButtonAuthData() {
|
|
const searchFlag = this.isAuth(this.menuId + ":search");
|
|
const saveFlag = this.isAuth(this.menuId + ":save");
|
|
const updateFlag = this.isAuth(this.menuId + ":update");
|
|
const deleteFlag = this.isAuth(this.menuId + ":delete");
|
|
this.authSearch = !searchFlag;
|
|
this.authSave = !saveFlag;
|
|
this.authUpdate = !updateFlag;
|
|
this.authDelete = !deleteFlag;
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
.el-table /deep/ .cell{
|
|
height: auto;
|
|
line-height: 1.5;
|
|
}
|
|
</style>
|