Jcdm042-Mes.git

懒羊羊

2024-01-31 e57a8990ae56f657a59c435a0613c5f7a8728003

提交 \| 用户 \| 时间
e57a89	1	<template>
懒	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-width="120" label="BOM编码" prop="bomCode">
	6	<el-input
	7	v-model="queryParams.bomCode"
	8	placeholder="请输入BOM编码"
	9	clearable
	10	@keyup.enter.native="handleQuery"
	11	/>
	12	</el-form-item>
	13	<el-form-item label-width="120" label="BOM名称" prop="bomName">
	14	<el-input
	15	v-model="queryParams.bomName"
	16	placeholder="请输入BOM名称"
	17	clearable
	18	@keyup.enter.native="handleQuery"
	19	/>
	20	</el-form-item>
	21	<el-form-item label="产品编码" prop="productCode">
	22	<el-input
	23	v-model="queryParams.productCode"
	24	placeholder="请输入产品编码"
	25	clearable
	26	@keyup.enter.native="handleQuery"
	27	/>
	28	</el-form-item>
	29	<el-form-item label="产品名称" prop="productName">
	30	<el-input
	31	v-model="queryParams.productName"
	32	placeholder="请输入产品名称"
	33	clearable
	34	@keyup.enter.native="handleQuery"
	35	/>
	36	</el-form-item>
	37	<el-form-item style="float: right">
	38	<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
	39	<el-button type="warning" icon="el-icon-copy-document" size="mini" @click="advancedQuery">高级查询</el-button>
	40	<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
	41	</el-form-item>
	42	</el-form>
	43	<el-form :model="queryParams" ref="queryParams" size="small" :inline="true" v-show="advancedShowSearch" label-width="68px">
	44	<el-form-item label="数据来源" prop="dataSource">
	45	<el-input
	46	v-model="queryParams.dataSource"
	47	placeholder="请输入数据来源"
	48	clearable
	49	@keyup.enter.native="handleQuery"
	50	/>
	51	</el-form-item>
	52	</el-form>
	53	</el-card>
	54
	55	<el-card style="margin-top: 10px" class="box-card">
	56	<el-row :gutter="10" class="mb8">
	57	<el-col :span="1.5">
	58	<el-button
	59	type="primary"
	60	plain
	61	icon="el-icon-plus"
	62	size="mini"
	63	@click="handleAdd"
	64	v-hasPermi="['bs:ProductBom:add']"
	65	>新增</el-button>
	66	</el-col>
	67	<el-col :span="1.5">
	68	<el-button
	69	type="success"
	70	plain
	71	icon="el-icon-edit"
	72	size="mini"
	73	:disabled="single"
	74	@click="handleUpdate"
	75	v-hasPermi="['bs:ProductBom:edit']"
	76	>修改</el-button>
	77	</el-col>
	78	<el-col :span="1.5">
	79	<el-button
	80	type="danger"
	81	plain
	82	icon="el-icon-delete"
	83	size="mini"
	84	:disabled="multiple"
	85	@click="handleDelete"
	86	v-hasPermi="['bs:ProductBom:remove']"
	87	>删除</el-button>
	88	</el-col>
	89	<el-col :span="1.5">
	90	<el-button
	91	type="warning"
	92	plain
	93	icon="el-icon-download"
	94	size="mini"
	95	@click="handleExport"
	96	v-hasPermi="['bs:ProductBom:export']"
	97	>导出</el-button>
	98	</el-col>
	99	<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
	100	</el-row>
	101
	102	<el-table v-loading="loading" border :data="ProductBomList" @selection-change="handleSelectionChange" v-if="ProductBomList.length > 0">
	103	<el-table-column type="selection" width="55" align="center" />
	104	<el-table-column label="BOM编码" align="center" prop="bomCode">
	105	<template slot-scope="scope">
	106	<router-link :to="{path: '/main/bom-data/index/', query: {bomCode: scope.row.bomCode} }" class="link-type">
	107	<span>{{ scope.row.bomCode }}</span>
	108	</router-link>
	109	</template>
	110	</el-table-column>
	111	<el-table-column label="BOM名称" align="center" prop="bomName">
	112	</el-table-column>
	113	<el-table-column label="产品编码" align="center" prop="productCode">
	114	</el-table-column>
	115	<el-table-column label="产品名称" align="center" prop="productName">
	116	</el-table-column>
	117	<el-table-column label="版本" align="center" prop="version">
	118	</el-table-column>
	119	<el-table-column label="状态" align="center" prop="status">
	120	<template slot-scope="scope">
	121	<dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
	122	</template>
	123	</el-table-column>
	124	<el-table-column label="备注" align="center" prop="remark">
	125	</el-table-column>
	126	<el-table-column label="创建用户" align="center" prop="createUser">
	127	</el-table-column>
	128	<el-table-column label="更改用户" align="center" prop="updateUser">
	129	</el-table-column>
	130	<el-table-column label="数据来源" align="center" prop="dataSource">
	131	</el-table-column>
	132	<el-table-column fixed="right" label="操作" width="200" align="center" class-name="small-padding fixed-width">
	133	<template slot-scope="scope">
	134	<el-button
	135	size="mini"
	136	type="success"
	137	plain
	138	style="width: 72px"
	139	icon="el-icon-edit"
	140	@click="handleUpdate(scope.row)"
	141	v-hasPermi="['bs:ProductBom:edit']"
	142	>修改</el-button>
	143	<el-button
	144	size="mini"
	145	plain
	146	style="width: 72px"
	147	type="danger"
	148	icon="el-icon-delete"
	149	@click="handleDelete(scope.row)"
	150	v-hasPermi="['bs:ProductBom:remove']"
	151	>删除</el-button>
	152	</template>
	153	</el-table-column>
	154	</el-table>
	155	<el-empty v-else>
	156	<span slot="description">暂无数据</span>
	157	</el-empty>
	158	</el-card>
	159
	160	<pagination
	161	v-show="total>0"
	162	:total="total"
	163	:page.sync="queryParams.pageNum"
	164	:limit.sync="queryParams.pageSize"
	165	@pagination="getList"
	166	/>
	167
	168	<!-- 添加或修改基础BOM对话框 -->
	169	<el-dialog v-dialogpop-up :title="title" :visible.sync="open" width="500px" append-to-body>
	170	<span slot="title">
	171	<i class="el-icon-s-order"></i>
	172	{{titleName}}
	173	</span>
	174	<el-form ref="form" :model="form" :rules="rules" label-width="100px">
	175	<el-form-item label="BOM编码" prop="bomCode">
	176	<el-input v-model="form.bomCode" placeholder="请输入BOM编码" />
	177	</el-form-item>
	178	<el-form-item label="BOM名称" prop="bomName">
	179	<el-input v-model="form.bomName" placeholder="请输入BOM名称" />
	180	</el-form-item>
	181	<el-form-item label="产品编码" prop="productCode">
	182	<el-input v-model="form.productCode" placeholder="请输入产品编码" />
	183	</el-form-item>
	184	<el-form-item label="产品名称" prop="productName">
	185	<el-input v-model="form.productName" placeholder="请输入产品名称" />
	186	</el-form-item>
	187	<!-- <el-form-item label="版本" prop="version">-->
	188	<!-- <el-input v-model="form.version" placeholder="请输入版本" />-->
	189	<!-- </el-form-item>-->
	190	<el-form-item label="状态" prop="status">
	191	<el-radio-group v-model="form.status">
	192	<el-radio
	193	v-for="dict in dict.type.sys_normal_disable"
	194	:key="dict.value"
	195	:label="dict.value"
	196	>{{dict.label}}</el-radio>
	197	</el-radio-group>
	198	</el-form-item>
	199	<!-- <el-form-item label="预留字段1" prop="spareField1">-->
	200	<!-- <el-input v-model="form.spareField1" placeholder="请输入预留字段1" />-->
	201	<!-- </el-form-item>-->
	202	<!-- <el-form-item label="预留字段2" prop="spareField2">-->
	203	<!-- <el-input v-model="form.spareField2" placeholder="请输入预留字段2" />-->
	204	<!-- </el-form-item>-->
	205
	206	<!-- <el-form-item label="数据来源" prop="dataSource">-->
	207	<!-- <el-input v-model="form.dataSource" placeholder="请输入数据来源" />-->
	208	<!-- </el-form-item>-->
	209	<el-form-item label="备注" prop="remark">
	210	<el-input v-model="form.remark" placeholder="请输入备注" />
	211	</el-form-item>
	212	</el-form>
	213	<div slot="footer" class="dialog-footer">
	214	<el-button type="primary" @click="submitForm">确定</el-button>
	215	<el-button @click="cancel">取消</el-button>
	216	</div>
	217	</el-dialog>
	218	</div>
	219	</template>
	220
	221	<script>
	222	import { listProductBom, getProductBom, delProductBom, addProductBom, updateProductBom } from "@/api/main/bs/ProductBom/ProductBom";
	223
	224	export default {
	225	name: "ProductBom",
	226	dicts: ['sys_normal_disable'],
	227	data() {
	228	return {
	229	// 遮罩层
	230	loading: true,
	231	titleName: 'test',
	232	// 选中数组
	233	ids: [],
	234	// 非单个禁用
	235	single: true,
	236	// 非多个禁用
	237	multiple: true,
	238	// 显示搜索条件
	239	showSearch: true,
	240	// 总条数
	241	total: 0,
	242	// 基础BOM表格数据
	243	ProductBomList: [],
	244	// 弹出层标题
	245	title: "",
	246	// 是否显示弹出层
	247	open: false,
	248	advancedShowSearch: false,
	249	// 查询参数
	250	queryParams: {
	251	pageNum: 1,
	252	pageSize: 10,
	253	bomCode: null,
	254	bomName: null,
	255	productCode: null,
	256	productName: null,
	257	dataSource: null
	258	},
	259	// 表单参数
	260	form: {},
	261	// 表单校验
	262	rules: {
	263	id: [
	264	{ required: true, message: "主键id不能为空", trigger: "blur" }
	265	],
	266	bomCode: [
	267	{ required: true, message: "BOM编码不能为空", trigger: "blur" }
	268	],
	269	productCode: [
	270	{ required: true, message: "产品编码不能为空", trigger: "blur" }
	271	],
	272	status: [
	273	{ required: true, message: "状态(字典)不能为空", trigger: "change" }
	274	],
	275	}
	276	};
	277	},
	278	created() {
	279	this.getList();
	280	},
	281	methods: {
	282	advancedQuery(){
	283	this.advancedShowSearch = (this.advancedShowSearch) ? this.advancedShowSearch = false : this.advancedShowSearch = true;
	284	},
	285	/** 查询基础BOM列表 */
	286	getList() {
	287	this.loading = true;
	288	listProductBom(this.queryParams).then(response => {
	289	this.ProductBomList = response.rows;
	290	console.log(this.ProductBomList)
	291	this.total = response.total;
	292	this.loading = false;
	293	});
	294	},
	295	// 取消按钮
	296	cancel() {
	297	this.open = false;
	298	this.reset();
	299	},
	300	// 表单重置
	301	reset() {
	302	this.form = {
	303	id: null,
	304	bomCode: null,
	305	bomName: null,
	306	productCode: null,
	307	productName: null,
	308	version: null,
	309	status: null,
	310	spareField1: null,
	311	spareField2: null,
	312	remark: null,
	313	createUser: null,
	314	createTime: null,
	315	updateUser: null,
	316	updateTime: null,
	317	dataSource: null
	318	};
	319	this.resetForm("form");
	320	},
	321	/** 搜索按钮操作 */
	322	handleQuery() {
	323	this.queryParams.pageNum = 1;
	324	this.getList();
	325	},
	326	/** 重置按钮操作 */
	327	resetQuery() {
	328	this.resetForm("queryForm");
	329	this.handleQuery();
	330	},
	331	// 多选框选中数据
	332	handleSelectionChange(selection) {
	333	this.ids = selection.map(item => item.id)
	334	this.single = selection.length!==1
	335	this.multiple = !selection.length
	336	},
	337	/** 新增按钮操作 */
	338	handleAdd() {
	339	this.reset();
	340	this.open = true;
	341	this.titleName = "添加基础BOM";
	342	},
	343	/** 修改按钮操作 */
	344	handleUpdate(row) {
	345	this.reset();
	346	const id = row.id \|\| this.ids
	347	getProductBom(id).then(response => {
	348	this.form = response.data;
	349	this.open = true;
	350	this.titleName = "修改基础BOM";
	351	});
	352	},
	353	/** 提交按钮 */
	354	submitForm() {
	355	this.$refs["form"].validate(valid => {
	356	if (valid) {
	357	if (this.form.id != null) {
	358	updateProductBom(this.form).then(response => {
	359	this.$modal.msgSuccess("修改成功");
	360	this.open = false;
	361	this.getList();
	362	});
	363	} else {
	364	addProductBom(this.form).then(response => {
	365	this.$modal.msgSuccess("新增成功");
	366	this.open = false;
	367	this.getList();
	368	});
	369	}
	370	}
	371	});
	372	},
	373	/** 删除按钮操作 */
	374	handleDelete(row) {
	375	const ids = row.id \|\| this.ids;
	376	this.$modal.confirm('是否确认删除基础BOM编号为"' + ids + '"的数据项？').then(function() {
	377	return delProductBom(ids);
	378	}).then(() => {
	379	this.getList();
	380	this.$modal.msgSuccess("删除成功");
	381	}).catch(() => {});
	382	},
	383	/** 导出按钮操作 */
	384	handleExport() {
	385	this.download('bs/ProductBom/export', {
	386	...this.queryParams
	387	}, `ProductBom_${new Date().getTime()}.xlsx`)
	388	}
	389	}
	390	};
	391	</script>