Billion-Mes.git

admin

2024-11-20 92837a8a6b2bf8badb0f43bc6a39957a0375b721

提交 \| 用户 \| 时间
4d458e	1	<template>
A	2	<div class="app-container">
	3	<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
92837a	4	<el-form-item label-width="120" label="总成序列号" prop="sfcCode">
4d458e	5	<el-input
A	6	v-model="queryParams.sfcCode"
	7	placeholder="请输入总成序列号"
	8	clearable
	9	@keyup.enter.native="handleQuery"
	10	/>
	11	</el-form-item>
92837a	12	<el-form-item style="float: right">
A	13	<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
	14	<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
	15	<el-button icon="el-icon-setting" size="mini" @click="toggleAdvancedSearch">高级查询</el-button>
	16	</el-form-item>
	17	<transition name="fade">
	18	<div v-if="advancedSearchVisible" class="advanced-search">
	19	<el-form-item label="工位编码" prop="locationCode">
4d458e	20	<el-input
A	21	v-model="queryParams.locationCode"
	22	placeholder="请输入工位编码"
	23	clearable
	24	@keyup.enter.native="handleQuery"
	25	/>
	26	</el-form-item>
	27	<el-form-item label="参数编码" prop="paramCode">
	28	<el-input
	29	v-model="queryParams.paramCode"
	30	placeholder="请输入参数编码"
	31	clearable
	32	@keyup.enter.native="handleQuery"
	33	/>
	34	</el-form-item>
92837a	35	<el-form-item label="参数名称" prop="paramName">
A	36	<el-input
	37	v-model="queryParams.paramName"
	38	placeholder="请输入参数名称"
	39	clearable
	40	@keyup.enter.native="handleQuery"
	41	/>
	42	</el-form-item>
	43	<el-form-item label="采集时间" prop="collectTime">
	44	<el-date-picker
	45	v-model="queryParams.collectTime"
	46	type="datetime"
	47	placeholder="请选择采集时间"
	48	value-format="yyyy-MM-dd HH:mm:ss"
	49	/>
	50	</el-form-item>
	51	<!-- 可以继续添加其他高级查询条件 -->
	52	<el-row>
	53	<el-col :span="24" style="text-align: right;">
	54	<el-button type="primary" icon="el-icon-close" size="mini" @click="toggleAdvancedSearch">关闭</el-button>
	55	</el-col>
	56	</el-row>
	57	</div>
	58	</transition>
4d458e	59	</el-form>
A	60
	61	<el-row :gutter="10" class="mb8">
	62	<el-col :span="1.5">
	63	<el-button
	64	type="primary"
	65	plain
	66	icon="el-icon-plus"
	67	size="mini"
	68	@click="handleAdd"
	69	v-hasPermi="['da:paramCollection:add']"
	70	>新增</el-button>
	71	</el-col>
	72	<el-col :span="1.5">
	73	<el-button
	74	type="success"
	75	plain
	76	icon="el-icon-edit"
	77	size="mini"
	78	:disabled="single"
	79	@click="handleUpdate"
	80	v-hasPermi="['da:paramCollection:edit']"
	81	>修改</el-button>
	82	</el-col>
	83	<el-col :span="1.5">
	84	<el-button
	85	type="danger"
	86	plain
	87	icon="el-icon-delete"
	88	size="mini"
	89	:disabled="multiple"
	90	@click="handleDelete"
	91	v-hasPermi="['da:paramCollection:remove']"
	92	>删除</el-button>
	93	</el-col>
	94	<el-col :span="1.5">
	95	<el-button
	96	type="warning"
	97	plain
	98	icon="el-icon-download"
	99	size="mini"
	100	@click="handleExport"
	101	v-hasPermi="['da:paramCollection:export']"
	102	>导出</el-button>
	103	</el-col>
	104	<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
	105	</el-row>
	106
92837a	107	<el-table v-loading="loading" border :data="paramCollectionList" @selection-change="handleSelectionChange">
4d458e	108	<el-table-column type="selection" width="55" align="center" />
92837a	109	<!-- <el-table-column label="主键id" align="center" prop="id" />-->
4d458e	110	<el-table-column label="总成序列号" align="center" prop="sfcCode" />
A	111	<el-table-column label="工位编码" align="center" prop="locationCode" />
	112	<el-table-column label="参数编码" align="center" prop="paramCode" />
	113	<el-table-column label="参数名称" align="center" prop="paramName" />
	114	<el-table-column label="参数值" align="center" prop="paramValue" />
	115	<el-table-column label="采集时间" align="center" prop="collectTime" width="180">
	116	</el-table-column>
	117	<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
	118	<template slot-scope="scope">
	119	<el-button
	120	size="mini"
	121	type="text"
	122	icon="el-icon-edit"
	123	@click="handleUpdate(scope.row)"
	124	v-hasPermi="['da:paramCollection:edit']"
	125	>修改</el-button>
	126	<el-button
	127	size="mini"
	128	type="text"
	129	icon="el-icon-delete"
	130	@click="handleDelete(scope.row)"
	131	v-hasPermi="['da:paramCollection:remove']"
	132	>删除</el-button>
	133	</template>
	134	</el-table-column>
	135	</el-table>
	136
	137	<pagination
	138	v-show="total>0"
	139	:total="total"
	140	:page.sync="queryParams.pageNum"
	141	:limit.sync="queryParams.pageSize"
	142	@pagination="getList"
	143	/>
	144
	145	<!-- 添加或修改参数采集对话框 -->
	146	<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
92837a	147	<el-form ref="form" :model="form" :rules="rules" label-width="95px">
4d458e	148	<el-form-item label="总成序列号" prop="sfcCode">
A	149	<el-input v-model="form.sfcCode" placeholder="请输入总成序列号" />
	150	</el-form-item>
	151	<el-form-item label="工位编码" prop="locationCode">
	152	<el-input v-model="form.locationCode" placeholder="请输入工位编码" />
	153	</el-form-item>
	154	<el-form-item label="参数编码" prop="paramCode">
	155	<el-input v-model="form.paramCode" placeholder="请输入参数编码" />
	156	</el-form-item>
	157	<el-form-item label="参数名称" prop="paramName">
	158	<el-input v-model="form.paramName" placeholder="请输入参数名称" />
	159	</el-form-item>
	160	<el-form-item label="参数值" prop="paramValue">
	161	<el-input v-model="form.paramValue" placeholder="请输入参数值" />
	162	</el-form-item>
	163	</el-form>
	164	<div slot="footer" class="dialog-footer">
	165	<el-button type="primary" @click="submitForm">确定</el-button>
	166	<el-button @click="cancel">取消</el-button>
	167	</div>
	168	</el-dialog>
	169	</div>
	170	</template>
	171
	172	<script>
	173	import { listParamCollection, getParamCollection, delParamCollection, addParamCollection, updateParamCollection } from "@/api/main/da/paramCollection";
	174
	175	export default {
	176	name: "ParamCollection",
	177	data() {
	178	return {
92837a	179	advancedSearchVisible: false,
4d458e	180	// 遮罩层
A	181	loading: true,
	182	// 选中数组
	183	ids: [],
	184	// 非单个禁用
	185	single: true,
	186	// 非多个禁用
	187	multiple: true,
	188	// 显示搜索条件
	189	showSearch: true,
	190	// 总条数
	191	total: 0,
	192	// 参数采集表格数据
	193	paramCollectionList: [],
	194	// 弹出层标题
	195	title: "",
	196	// 是否显示弹出层
	197	open: false,
	198	// 查询参数
	199	queryParams: {
	200	pageNum: 1,
	201	pageSize: 10,
	202	sfcCode: null,
	203	locationCode: null,
	204	paramCode: null,
	205	paramName: null,
	206	},
	207	// 表单参数
	208	form: {},
	209	// 表单校验
	210	rules: {
	211	sfcCode: [
92837a	212	{ required: true, message: "总成序列号不能为空", trigger: "blur" },
A	213	{ pattern: /^[a-zA-Z0-9]*$/, message: "总成序列号不能包含中文字符", trigger: "blur" }
4d458e	214	],
A	215	locationCode: [
92837a	216	{ required: true, message: "工位编码不能为空", trigger: "blur" },
A	217	{ pattern: /^[a-zA-Z0-9]*$/, message: "总成序列号不能包含中文字符", trigger: "blur" }
4d458e	218	],
A	219	paramCode: [
92837a	220	{ required: true, message: "参数编码不能为空", trigger: "blur" },
A	221	{ pattern: /^[a-zA-Z0-9]*$/, message: "总成序列号不能包含中文字符", trigger: "blur" }
4d458e	222	],
A	223	paramValue: [
92837a	224	{ required: true, message: "参数值不能为空", trigger: "blur" },
A	225	{ pattern: /^[a-zA-Z0-9]*$/, message: "总成序列号不能包含中文字符", trigger: "blur" }
4d458e	226	],
A	227	}
	228	};
	229	},
	230	created() {
	231	this.getList();
	232	},
	233	methods: {
92837a	234	toggleAdvancedSearch() {
A	235	this.advancedSearchVisible = !this.advancedSearchVisible;
	236
	237	},
4d458e	238	/** 查询参数采集列表 */
A	239	getList() {
	240	this.loading = true;
	241	listParamCollection(this.queryParams).then(response => {
	242	this.paramCollectionList = response.rows;
	243	this.total = response.total;
	244	this.loading = false;
	245	});
	246	},
	247	// 取消按钮
	248	cancel() {
	249	this.open = false;
	250	this.reset();
	251	},
	252	// 表单重置
	253	reset() {
	254	this.form = {
	255	id: null,
	256	sfcCode: null,
	257	locationCode: null,
	258	paramCode: null,
	259	paramName: null,
	260	paramValue: null,
	261	collectTime: null
	262	};
92837a	263
A	264
4d458e	265	this.resetForm("form");
A	266	},
	267	/** 搜索按钮操作 */
	268	handleQuery() {
	269	this.queryParams.pageNum = 1;
	270	this.getList();
92837a	271	this.advancedSearchVisible = false
4d458e	272	},
A	273	/** 重置按钮操作 */
	274	resetQuery() {
92837a	275	this.clearQueryParams()
4d458e	276	this.resetForm("queryForm");
A	277	this.handleQuery();
92837a	278	},
A	279	clearQueryParams(){
	280	this.queryParams.paramName = null
	281	this.queryParams.locationCode = null
	282	this.queryParams.paramCode = null
4d458e	283	},
A	284	// 多选框选中数据
	285	handleSelectionChange(selection) {
	286	this.ids = selection.map(item => item.id)
	287	this.single = selection.length!==1
	288	this.multiple = !selection.length
	289	},
	290	/** 新增按钮操作 */
	291	handleAdd() {
	292	this.reset();
	293	this.open = true;
	294	this.title = "添加参数采集";
	295	},
	296	/** 修改按钮操作 */
	297	handleUpdate(row) {
	298	this.reset();
	299	const id = row.id \|\| this.ids
	300	getParamCollection(id).then(response => {
	301	this.form = response.data;
	302	this.open = true;
	303	this.title = "修改参数采集";
	304	});
	305	},
	306	/** 提交按钮 */
	307	submitForm() {
	308	this.$refs["form"].validate(valid => {
	309	if (valid) {
	310	if (this.form.id != null) {
	311	updateParamCollection(this.form).then(response => {
	312	this.$modal.msgSuccess("修改成功");
	313	this.open = false;
	314	this.getList();
	315	});
	316	} else {
	317	addParamCollection(this.form).then(response => {
	318	this.$modal.msgSuccess("新增成功");
	319	this.open = false;
	320	this.getList();
	321	});
	322	}
	323	}
	324	});
	325	},
	326	/** 删除按钮操作 */
	327	handleDelete(row) {
	328	const ids = row.id \|\| this.ids;
	329	this.$modal.confirm('是否确认删除参数采集编号为"' + ids + '"的数据项？').then(function() {
	330	return delParamCollection(ids);
	331	}).then(() => {
	332	this.getList();
	333	this.$modal.msgSuccess("删除成功");
	334	}).catch(() => {});
	335	},
	336	/** 导出按钮操作 */
	337	handleExport() {
	338	this.download('da/paramCollection/export', {
	339	...this.queryParams
	340	}, `paramCollection_${new Date().getTime()}.xlsx`)
	341	}
	342	}
	343	};
	344	</script>
92837a	345	<style scoped>.fade-enter-active, .fade-leave-active {
A	346	transition: opacity 0.3s;
	347	}
	348	.fade-enter, .fade-leave-to /* .fade-leave-active in <2.1.8 */ {
	349	opacity: 0;
	350	}
	351
	352	.advanced-search {
	353	position: absolute;
	354	background: #FFFFFF; /* 设置为与页面背景色相同或相近的颜色 */
	355	border-left: 1px solid #dcdfe6;
	356	border-right: 1px solid #dcdfe6;
	357	border-bottom: 1px solid #dcdfe6;
	358	/border: none;/
	359	box-shadow: none; /* 移除阴影 */
	360	padding: 10px;
	361	z-index: 1000; /* 确保浮动在其他元素之上 */
	362	top: 70px; /* 调整顶部位置，使其与页面其他元素更协调 */
	363	left: 20px; /* 调整左侧位置 */
	364	width: 97%; /* 调整宽度 */
	365	/max-width: 1296px; ! 最大宽度 !/
	366	/max-width: 1296px; ! 最大宽度 !/
	367	margin: 0 auto; /* 居中对齐 */
	368	}
	369	</style>