Jcdm041-MesCVT.git

yyt

2024-06-26 0cceb649e1dc443c2a91d26d81eacb0867c96db3

提交 \| 用户 \| 时间
0cceb6	1	<template>
Y	2	<div class="app-container">
	3	<el-card class="box-card">
	4	<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
	5	<el-form-item label="车间" prop="workshopCode">
	6	<el-input
	7	v-model="queryParams.workshopCode"
	8	placeholder="请输入车间"
	9	clearable
	10	@keyup.enter.native="handleQuery"
	11	/>
	12	</el-form-item>
	13	<el-form-item label="产线" prop="lineCode">
	14	<el-input
	15	v-model="queryParams.lineCode"
	16	placeholder="请输入产线"
	17	clearable
	18	@keyup.enter.native="handleQuery"
	19	/>
	20	</el-form-item>
	21	<el-form-item label="工序" prop="processesCode">
	22	<el-input
	23	v-model="queryParams.processesCode"
	24	placeholder="请输入工序"
	25	clearable
	26	@keyup.enter.native="handleQuery"
	27	/>
	28	</el-form-item>
	29	<el-form-item label="产品编号" prop="productCode">
	30	<el-input
	31	v-model="queryParams.productCode"
	32	placeholder="请输入产品编号"
	33	clearable
	34	@keyup.enter.native="handleQuery"
	35	/>
	36	</el-form-item>
	37	<!-- <el-form-item label="类型" prop="operationType">-->
	38	<!-- <el-select v-model="queryParams.operationType" placeholder="请选择类型" clearable>-->
	39	<!-- <el-option-->
	40	<!-- v-for="dict in dict.type.${dictType}"-->
	41	<!-- :key="dict.value"-->
	42	<!-- :label="dict.label"-->
	43	<!-- :value="dict.value"-->
	44	<!-- />-->
	45	<!-- </el-select>-->
	46	<!-- </el-form-item>-->
	47	<el-form-item style="float: right">
	48	<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
	49	<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
	50	</el-form-item>
	51	</el-form>
	52	</el-card>
	53
	54	<el-card style="margin-top: 10px" class="box-card">
	55	<el-row :gutter="10" class="mb8">
	56	<el-col :span="1.5">
	57	<el-button
	58	type="primary"
	59	plain
	60	icon="el-icon-plus"
	61	size="mini"
	62	@click="handleAdd"
	63	v-hasPermi="['bs:formulaChild:add']"
	64	>新增</el-button>
	65	</el-col>
	66	<el-col :span="1.5">
	67	<el-button
	68	type="success"
	69	plain
	70	icon="el-icon-edit"
	71	size="mini"
	72	:disabled="single"
	73	@click="handleUpdate"
	74	v-hasPermi="['bs:formulaChild:edit']"
	75	>修改</el-button>
	76	</el-col>
	77	<el-col :span="1.5">
	78	<el-button
	79	type="danger"
	80	plain
	81	icon="el-icon-delete"
	82	size="mini"
	83	:disabled="multiple"
	84	@click="handleDelete"
	85	v-hasPermi="['bs:formulaChild:remove']"
	86	>删除</el-button>
	87	</el-col>
	88	<el-col :span="1.5">
	89	<el-button
	90	type="warning"
	91	plain
	92	icon="el-icon-download"
	93	size="mini"
	94	@click="handleExport"
	95	v-hasPermi="['bs:formulaChild:export']"
	96	>导出</el-button>
	97	</el-col>
	98	<el-col :span="1.5">
	99	<el-button
	100	type="warning"
	101	plain
	102	icon="el-icon-close"
	103	size="mini"
	104	@click="handleClose"
	105	>关闭</el-button>
	106	</el-col>
	107	<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
	108	</el-row>
	109
	110	<el-descriptions class="margin-top" :column="4" border>
	111	<el-descriptions-item :span="1">
	112	<template slot="label">
	113	<i class="el-icon-user"></i>
	114	配方编码
	115	</template>
	116	{{headerInformationData.formulaCode}}
	117	</el-descriptions-item>
	118	<el-descriptions-item :span="1">
	119	<template slot="label">
	120	<i class="el-icon-mobile-phone"></i>
	121	配方名称
	122	</template>
	123	{{headerInformationData.formulaName}}
	124	</el-descriptions-item>
	125	<el-descriptions-item :span="1">
	126	<template slot="label">
	127	<i class="el-icon-location-outline"></i>
	128	产品编码
	129	</template>
	130	{{headerInformationData.productCode}}
	131	</el-descriptions-item>
	132	<el-descriptions-item :span="1">
	133	<template slot="label">
	134	<i class="el-icon-tickets"></i>
	135	产品名称
	136	</template>
	137	<!-- {{headerInformationData.productName}}-->
	138	</el-descriptions-item>
	139	</el-descriptions>
	140
	141	<el-table border v-loading="loading" :data="formulaChildList" @selection-change="handleSelectionChange">
	142	<el-table-column type="selection" width="55" align="center" />
	143	<!-- <el-table-column label="车间" align="center" prop="workshopCode">-->
	144	<!-- </el-table-column>-->
	145	<!-- <el-table-column label="产线" align="center" prop="lineCode">-->
	146	<!-- </el-table-column>-->
	147	<el-table-column label="工序" width="90" align="center" prop="processesCode">
	148	</el-table-column>
	149	<el-table-column label="产品编号" width="150" align="center" prop="productCode">
	150	</el-table-column>
	151	<!-- <el-table-column label="操作内容" :show-overflow-tooltip='true' width="150" align="center" prop="operationSteps">
	152	</el-table-column>-->
	153	<el-table-column label="排序" width="90" align="center" prop="stepSort">
	154	</el-table-column>
	155	<el-table-column label="技术要求" width="380" :show-overflow-tooltip='true' align="center" prop="techRequirement">
	156	</el-table-column>
	157	<el-table-column label="图片" :show-overflow-tooltip='true' width="130" align="center" prop="picture">
	158	<!-- <template slot-scope="scope">-->
	159	<!-- <el-image-->
	160	<!-- style="width: 100px; height: 100px"-->
	161	<!-- :src="pjtUrl+scope.row.picture"-->
	162	<!-- :fit="fit">-->
	163	<!-- </el-image>-->
	164	<!-- </template>-->
	165	</el-table-column>
	166	<el-table-column label="类型" width="90" align="center" prop="operationType">
	167	</el-table-column>
	168
	169	<el-table-column label="参数编码" width="130" align="center" prop="paramCode">
	170	</el-table-column>
	171	<el-table-column label="物料编码" width="130" align="center" prop="materialCode">
	172	</el-table-column>
	173	<el-table-column label="配方编码" width="130" align="center" prop="formulaCode">
	174	</el-table-column>
	175
	176	<el-table-column label="备注" width="130" align="center" prop="remarks">
	177	</el-table-column>
	178	<el-table-column label="创建用户" width="130" align="center" prop="createUser">
	179	</el-table-column>
	180	<el-table-column label="创建时间" width="160" align="center" prop="createTime">
	181	</el-table-column>
	182	<el-table-column label="更改用户" width="130" align="center" prop="updateUser">
	183	</el-table-column>
	184	<el-table-column label="更改时间" width="160" align="center" prop="updateTime">
	185	</el-table-column>
	186	<el-table-column fixed="right" width="200" label="操作" align="center" class-name="small-padding fixed-width">
	187	<template slot-scope="scope">
	188	<el-button
	189	size="mini"
	190	type="success"
	191	plain
	192	style="width: 72px"
	193	icon="el-icon-edit"
	194	@click="handleUpdate(scope.row)"
	195	v-hasPermi="['bs:formulaChild:edit']"
	196	>修改</el-button>
	197	<el-button
	198	size="mini"
	199	type="danger"
	200	plain
	201	style="width: 72px"
	202	icon="el-icon-delete"
	203	@click="handleDelete(scope.row)"
	204	v-hasPermi="['bs:formulaChild:remove']"
	205	>删除</el-button>
	206	</template>
	207	</el-table-column>
	208	</el-table>
	209	</el-card>
	210
	211	<pagination
	212	v-show="total>0"
	213	:total="total"
	214	:page.sync="queryParams.pageNum"
	215	:limit.sync="queryParams.pageSize"
	216	@pagination="getList"
	217	/>
	218
	219	<!-- 添加或修改配方配置子信息对话框 -->
	220	<el-dialog v-dialogpop-up :title="title" :visible.sync="open" width="500px" append-to-body>
	221	<span slot="title">
	222	<i class="el-icon-s-order"></i>
	223	{{titleName}}
	224	</span>
	225	<el-form ref="form" :model="form" :rules="rules" label-width="80px">
	226	<!-- <el-form-item label="车间" prop="workshopCode">-->
	227	<!-- <el-input v-model="form.workshopCode" placeholder="请输入车间" />-->
	228	<!-- </el-form-item>-->
	229	<!-- <el-form-item label="产线" prop="lineCode">-->
	230	<!-- <el-input v-model="form.lineCode" placeholder="请输入产线" />-->
	231	<!-- </el-form-item>-->
	232	<el-form-item label="配方编码">
	233	<el-input v-model="formulaCode" :disabled="true" />
	234	</el-form-item>
	235	<el-form-item label="工序" prop="processesCode">
	236	<el-input v-model="form.processesCode" placeholder="请输入工序" />
	237	</el-form-item>
	238	<el-form-item label="产品编号" prop="productCode">
	239	<el-input v-model="headerInformationData.productCode" :disabled="true" placeholder="请输入产品编号" />
	240	</el-form-item>
	241	<el-form-item label="操作内容" prop="operationSteps">
	242	<el-input v-model="form.operationSteps" placeholder="请输入操作内容" />
	243	</el-form-item>
	244	<el-form-item label="技术要求" prop="techRequirement">
	245	<el-input v-model="form.techRequirement" placeholder="请输入技术要求" />
	246	</el-form-item>
	247	<!-- <el-form-item label="类型" prop="operationType">-->
	248	<!-- <el-select v-model="form.operationType" placeholder="请选择类型">-->
	249	<!-- <el-option-->
	250	<!-- v-for="dict in dict.type.${dictType}"-->
	251	<!-- :key="dict.value"-->
	252	<!-- :label="dict.label"-->
	253	<!-- :value="dict.value"-->
	254	<!-- ></el-option>-->
	255	<!-- </el-select>-->
	256	<!-- </el-form-item>-->
	257	<el-form-item label="排序" prop="stepSort">
	258	<el-input v-model="form.stepSort" placeholder="请输入排序" />
	259	</el-form-item>
	260	<el-form-item label="参数编码" prop="paramCode">
	261	<el-input v-model="form.paramCode" placeholder="请输入参数编码" />
	262	</el-form-item>
	263	<el-form-item label="物料编码" prop="materialCode">
	264	<el-input v-model="form.materialCode" placeholder="请输入物料编码" />
	265	</el-form-item>
	266	<!-- <el-form-item label="配方编码" prop="formulaCode">-->
	267	<!-- <el-input v-model="form.formulaCode" placeholder="请输入配方编码" />-->
	268	<!-- </el-form-item>-->
	269	<el-form-item label="图片" prop="picture">
	270	<!-- <el-input v-model="form.picture" placeholder="请输入图片" />-->
	271	<el-upload
	272	ref="upload"
	273	:limit="1"
	274	accept=".jpg, .png"
	275	:action="upload.url"
	276	:headers="upload.headers"
	277	:on-remove="removes"
	278	:file-list="upload.fileList"
	279	:on-progress="handleFileUploadProgress"
	280	:on-success="handleFileSuccess"
	281	:auto-upload="false">
	282	<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
	283	<el-button style="margin-left: 10px;" size="small" type="success" :loading="upload.isUploading" @click="submitUpload">上传到服务器</el-button>
	284	<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
	285	</el-upload>
	286	</el-form-item>
	287	<el-form-item label="备注" prop="remarks">
	288	<el-input v-model="form.remarks" placeholder="请输入备注" />
	289	</el-form-item>
	290	</el-form>
	291	<div slot="footer" class="dialog-footer">
	292	<el-button type="primary" @click="submitForm">确定</el-button>
	293	<el-button @click="cancel">取消</el-button>
	294	</div>
	295	</el-dialog>
	296	</div>
	297	</template>
	298
	299	<script>
	300	import { getToken } from "@/utils/auth";
	301	import { listFormula} from "@/api/main/bs/formula/formula";
	302	import { listFormulaChild, getFormulaChild, delFormulaChild, addFormulaChild, updateFormulaChild } from "@/api/main/bs/formulaChild/formulaChild";
	303
	304	export default {
	305	name: "FormulaChild",
	306	data() {
	307	return {
	308	// 上传参数
	309	upload: {
	310	// 是否禁用上传
	311	isUploading: false,
	312	// 设置上传的请求头部
	313	headers: { Authorization: "Bearer " + getToken() },
	314	// 上传的地址
	315	url: process.env.VUE_APP_BASE_API + "/common/upload",
	316	// 上传的文件列表
	317	fileList: []
	318	},
	319	pjtUrl: process.env.VUE_APP_BASE_API,
	320	headerInformationData:{
	321	formulaCode: "",
	322	formulaName: "",
	323	productCode: "",
	324	productName: ""
	325	},
	326	// 遮罩层
	327	loading: true,
	328	titleName: "",
	329	// 选中数组
	330	ids: [],
	331	// 非单个禁用
	332	single: true,
	333	// 非多个禁用
	334	multiple: true,
	335	// 显示搜索条件
	336	showSearch: true,
	337	// 总条数
	338	total: 0,
	339	formulaCode: "",
	340	productCode: "",
	341	// 配方配置子信息表格数据
	342	formulaChildList: [],
	343	// 弹出层标题
	344	title: "",
	345	// 是否显示弹出层
	346	open: false,
	347	// 查询参数
	348	queryParams: {
	349	pageNum: 1,
	350	pageSize: 10,
	351	workshopCode: null,
	352	lineCode: null,
	353	processesCode: null,
	354	productCode: null,
	355	operationType: null,
	356	formulaCode: null,
	357	},
	358	// 表单参数
	359	form: {},
	360	// 表单校验
	361	rules: {
	362	id: [
	363	{ required: true, message: "id不能为空", trigger: "blur" }
	364	],
	365	}
	366	};
	367	},
	368	created() {
	369	let formulaCode = this.$route.query.formulaCode;
	370	this.queryParams.formulaCode = formulaCode;
	371	this.formulaCode = formulaCode;
	372	this.form.formulaCode = formulaCode;
	373
	374	this.headerInformation();
	375	this.getList();
	376	},
	377	methods: {
	378
	379	/** 工艺流程表头信息 */
	380	headerInformation() {
	381	listFormula(this.queryParams).then(response => {
	382	this.headerInformationData = response.rows[0];
	383	});
	384	},
	385	/** 返回按钮操作 */
	386	handleClose() {
	387	const obj = { path: "/main/pm/formula" };
	388	this.$tab.closeOpenPage(obj);
	389	},
	390	/** 查询配方配置子信息列表 */
	391	getList() {
	392	this.loading = true;
	393	listFormulaChild(this.queryParams).then(response => {
	394	this.formulaChildList = response.rows;
	395	this.total = response.total;
	396	this.loading = false;
	397	});
	398	},
	399	// 取消按钮
	400	cancel() {
	401	this.open = false;
	402	this.reset();
	403	},
	404	// 表单重置
	405	reset() {
	406	this.form = {
	407	id: null,
	408	workshopCode: null,
	409	lineCode: null,
	410	processesCode: null,
	411	productCode: null,
	412	operationSteps: null,
	413	techRequirement: null,
	414	operationType: null,
	415	stepSort: null,
	416	paramCode: null,
	417	materialCode: null,
	418	formulaCode: null,
	419	picture: null,
	420	remarks: null,
	421	createUser: null,
	422	createTime: null,
	423	updateUser: null,
	424	updateTime: null,
	425	spareField1: null,
	426	spareField2: null,
	427	spareField3: null,
	428	spareField4: null
	429	};
	430	this.resetForm("form");
	431	},
	432	/** 搜索按钮操作 */
	433	handleQuery() {
	434	this.queryParams.pageNum = 1;
	435	this.getList();
	436	},
	437	/** 重置按钮操作 */
	438	resetQuery() {
	439	this.resetForm("queryForm");
	440	this.handleQuery();
	441	},
	442	// 多选框选中数据
	443	handleSelectionChange(selection) {
	444	this.ids = selection.map(item => item.id)
	445	this.single = selection.length!==1
	446	this.multiple = !selection.length
	447	},
	448	/** 新增按钮操作 */
	449	handleAdd() {
	450	this.reset();
	451	this.open = true;
	452	this.upload.fileList = [];
	453	this.titleName = "添加配方配置子信息";
	454	},
	455	/** 修改按钮操作 */
	456	handleUpdate(row) {
	457	this.upload.fileList = []
	458	console.log(row)
	459	if(row.picture!==null && row.picture!==""){
	460	this.upload.fileList = [{ name: row.spareField1, url: row.picture }];
	461	}
	462	this.reset();
	463	const id = row.id \|\| this.ids
	464	getFormulaChild(id).then(response => {
	465	console.log(response.data)
	466	this.form = response.data;
	467	this.open = true;
	468	this.titleName = "修改配方配置子信息";
	469	});
	470	},
	471	// 文件提交处理
	472	submitUpload() {
	473	this.$refs.upload.submit();
	474	},
	475	// 文件上传中处理
	476	handleFileUploadProgress(event, file, fileList) {
	477	this.upload.isUploading = true;
	478	},
	479	// 文件上传成功处理
	480	handleFileSuccess(response, file, fileList) {
	481	console.log(response)
	482	this.upload.isUploading = false;
	483	this.form.picture = response.url;
	484	this.form.spareField1 = response.originalFilename;
	485	this.msgSuccess(response.msg);
	486	},
	487	removes(){
	488	this.form.spareField1 = '';
	489	this.form.picture = '';
	490	},
	491	/** 提交按钮 */
	492	submitForm() {
	493	this.form.formulaCode = this.formulaCode;
	494	this.$refs["form"].validate(valid => {
	495	if (valid) {
	496	if (this.form.id != null) {
	497	updateFormulaChild(this.form).then(response => {
	498	this.$modal.msgSuccess("修改成功");
	499	this.open = false;
	500	this.getList();
	501	});
	502	} else {
	503	addFormulaChild(this.form).then(response => {
	504	this.$modal.msgSuccess("新增成功");
	505	this.open = false;
	506	this.getList();
	507	});
	508	}
	509	}
	510	});
	511	},
	512	/** 删除按钮操作 */
	513	handleDelete(row) {
	514	const ids = row.id \|\| this.ids;
	515	this.$modal.confirm('是否确认删除配方配置子信息编号为"' + ids + '"的数据项？').then(function() {
	516	return delFormulaChild(ids);
	517	}).then(() => {
	518	this.getList();
	519	this.$modal.msgSuccess("删除成功");
	520	}).catch(() => {});
	521	},
	522	/** 导出按钮操作 */
	523	handleExport() {
	524	this.download('bs/formulaChild/export', {
	525	...this.queryParams
	526	}, `formulaChild_${new Date().getTime()}.xlsx`)
	527	}
	528	}
	529	};
	530	</script>