Jcdm042-Mes.git

懒羊羊

2024-01-31 e57a8990ae56f657a59c435a0613c5f7a8728003

提交 \| 用户 \| 时间
e57a89	1	<template>
懒	2	<div class="app-container">
	3	<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
	4	#foreach($column in $columns)
	5	#if($column.query)
	6	#set($dictType=$column.dictType)
	7	#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
	8	#set($parentheseIndex=$column.columnComment.indexOf("（"))
	9	#if($parentheseIndex != -1)
	10	#set($comment=$column.columnComment.substring(0, $parentheseIndex))
	11	#else
	12	#set($comment=$column.columnComment)
	13	#end
	14	#if($column.htmlType == "input")
	15	<el-form-item label="${comment}" prop="${column.javaField}">
	16	<el-input
	17	v-model="queryParams.${column.javaField}"
	18	placeholder="请输入${comment}"
	19	clearable
	20	@keyup.enter.native="handleQuery"
	21	/>
	22	</el-form-item>
	23	#elseif(($column.htmlType == "select" \|\| $column.htmlType == "radio") && "" != $dictType)
	24	<el-form-item label="${comment}" prop="${column.javaField}">
	25	<el-select v-model="queryParams.${column.javaField}" placeholder="请选择${comment}" clearable>
	26	<el-option
	27	v-for="dict in dict.type.${dictType}"
	28	:key="dict.value"
	29	:label="dict.label"
	30	:value="dict.value"
	31	/>
	32	</el-select>
	33	</el-form-item>
	34	#elseif(($column.htmlType == "select" \|\| $column.htmlType == "radio") && $dictType)
	35	<el-form-item label="${comment}" prop="${column.javaField}">
	36	<el-select v-model="queryParams.${column.javaField}" placeholder="请选择${comment}" clearable>
	37	<el-option label="请选择字典生成" value="" />
	38	</el-select>
	39	</el-form-item>
	40	#elseif($column.htmlType == "datetime" && $column.queryType != "BETWEEN")
	41	<el-form-item label="${comment}" prop="${column.javaField}">
	42	<el-date-picker clearable
	43	v-model="queryParams.${column.javaField}"
	44	type="date"
	45	value-format="yyyy-MM-dd"
	46	placeholder="选择${comment}">
	47	</el-date-picker>
	48	</el-form-item>
	49	#elseif($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
	50	<el-form-item label="${comment}">
	51	<el-date-picker
	52	v-model="daterange${AttrName}"
	53	style="width: 240px"
	54	value-format="yyyy-MM-dd"
	55	type="daterange"
	56	range-separator="-"
	57	start-placeholder="开始日期"
	58	end-placeholder="结束日期"
	59	></el-date-picker>
	60	</el-form-item>
	61	#end
	62	#end
	63	#end
	64	<el-form-item>
	65	<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
	66	<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
	67	</el-form-item>
	68	</el-form>
	69
	70	<el-row :gutter="10" class="mb8">
	71	<el-col :span="1.5">
	72	<el-button
	73	type="primary"
	74	plain
	75	icon="el-icon-plus"
	76	size="mini"
	77	@click="handleAdd"
	78	v-hasPermi="['${moduleName}:${businessName}:add']"
	79	>新增</el-button>
	80	</el-col>
	81	<el-col :span="1.5">
	82	<el-button
	83	type="info"
	84	plain
	85	icon="el-icon-sort"
	86	size="mini"
	87	@click="toggleExpandAll"
	88	>展开/折叠</el-button>
	89	</el-col>
	90	<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
	91	</el-row>
	92
	93	<el-table
	94	v-if="refreshTable"
	95	v-loading="loading"
	96	:data="${businessName}List"
	97	row-key="${treeCode}"
	98	:default-expand-all="isExpandAll"
	99	:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
	100	>
	101	#foreach($column in $columns)
	102	#set($javaField=$column.javaField)
	103	#set($parentheseIndex=$column.columnComment.indexOf("（"))
	104	#if($parentheseIndex != -1)
	105	#set($comment=$column.columnComment.substring(0, $parentheseIndex))
	106	#else
	107	#set($comment=$column.columnComment)
	108	#end
	109	#if($column.pk)
	110	#elseif($column.list && $column.htmlType == "datetime")
	111	<el-table-column label="${comment}" align="center" prop="${javaField}" width="180">
	112	<template slot-scope="scope">
	113	<span>{{ parseTime(scope.row.${javaField}, '{y}-{m}-{d}') }}</span>
	114	</template>
	115	</el-table-column>
	116	#elseif($column.list && $column.htmlType == "imageUpload")
	117	<el-table-column label="${comment}" align="center" prop="${javaField}" width="100">
	118	<template slot-scope="scope">
	119	<image-preview :src="scope.row.${javaField}" :width="50" :height="50"/>
	120	</template>
	121	</el-table-column>
	122	#elseif($column.list && "" != $column.dictType)
	123	<el-table-column label="${comment}" align="center" prop="${javaField}">
	124	<template slot-scope="scope">
	125	#if($column.htmlType == "checkbox")
	126	<dict-tag :options="dict.type.${column.dictType}" :value="scope.row.${javaField} ? scope.row.${javaField}.split(',') : []"/>
	127	#else
	128	<dict-tag :options="dict.type.${column.dictType}" :value="scope.row.${javaField}"/>
	129	#end
	130	</template>
	131	</el-table-column>
	132	#elseif($column.list && "" != $javaField)
	133	#if(${foreach.index} == 1)
	134	<el-table-column label="${comment}" prop="${javaField}" />
	135	#else
	136	<el-table-column label="${comment}" align="center" prop="${javaField}" />
	137	#end
	138	#end
	139	#end
	140	<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
	141	<template slot-scope="scope">
	142	<el-button
	143	size="mini"
	144	type="text"
	145	icon="el-icon-edit"
	146	@click="handleUpdate(scope.row)"
	147	v-hasPermi="['${moduleName}:${businessName}:edit']"
	148	>修改</el-button>
	149	<el-button
	150	size="mini"
	151	type="text"
	152	icon="el-icon-plus"
	153	@click="handleAdd(scope.row)"
	154	v-hasPermi="['${moduleName}:${businessName}:add']"
	155	>新增</el-button>
	156	<el-button
	157	size="mini"
	158	type="text"
	159	icon="el-icon-delete"
	160	@click="handleDelete(scope.row)"
	161	v-hasPermi="['${moduleName}:${businessName}:remove']"
	162	>删除</el-button>
	163	</template>
	164	</el-table-column>
	165	</el-table>
	166
	167	<!-- 添加或修改${functionName}对话框 -->
	168	<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
	169	<el-form ref="form" :model="form" :rules="rules" label-width="80px">
	170	#foreach($column in $columns)
	171	#set($field=$column.javaField)
	172	#if($column.insert && !$column.pk)
	173	#if(($column.usableColumn) \|\| (!$column.superColumn))
	174	#set($parentheseIndex=$column.columnComment.indexOf("（"))
	175	#if($parentheseIndex != -1)
	176	#set($comment=$column.columnComment.substring(0, $parentheseIndex))
	177	#else
	178	#set($comment=$column.columnComment)
	179	#end
	180	#set($dictType=$column.dictType)
	181	#if("" != $treeParentCode && $column.javaField == $treeParentCode)
	182	<el-form-item label="${comment}" prop="${treeParentCode}">
	183	<treeselect v-model="form.${treeParentCode}" :options="${businessName}Options" :normalizer="normalizer" placeholder="请选择${comment}" />
	184	</el-form-item>
	185	#elseif($column.htmlType == "input")
	186	<el-form-item label="${comment}" prop="${field}">
	187	<el-input v-model="form.${field}" placeholder="请输入${comment}" />
	188	</el-form-item>
	189	#elseif($column.htmlType == "imageUpload")
	190	<el-form-item label="${comment}" prop="${field}">
	191	<image-upload v-model="form.${field}"/>
	192	</el-form-item>
	193	#elseif($column.htmlType == "fileUpload")
	194	<el-form-item label="${comment}" prop="${field}">
	195	<file-upload v-model="form.${field}"/>
	196	</el-form-item>
	197	#elseif($column.htmlType == "editor")
	198	<el-form-item label="${comment}">
	199	<editor v-model="form.${field}" :min-height="192"/>
	200	</el-form-item>
	201	#elseif($column.htmlType == "select" && "" != $dictType)
	202	<el-form-item label="${comment}" prop="${field}">
	203	<el-select v-model="form.${field}" placeholder="请选择${comment}">
	204	<el-option
	205	v-for="dict in dict.type.${dictType}"
	206	:key="dict.value"
	207	:label="dict.label"
	208	#if($column.javaType == "Integer" \|\| $column.javaType == "Long")
	209	:value="parseInt(dict.value)"
	210	#else
	211	:value="dict.value"
	212	#end
	213	></el-option>
	214	</el-select>
	215	</el-form-item>
	216	#elseif($column.htmlType == "select" && $dictType)
	217	<el-form-item label="${comment}" prop="${field}">
	218	<el-select v-model="form.${field}" placeholder="请选择${comment}">
	219	<el-option label="请选择字典生成" value="" />
	220	</el-select>
	221	</el-form-item>
	222	#elseif($column.htmlType == "checkbox" && "" != $dictType)
	223	<el-form-item label="${comment}" prop="${field}">
	224	<el-checkbox-group v-model="form.${field}">
	225	<el-checkbox
	226	v-for="dict in dict.type.${dictType}"
	227	:key="dict.value"
	228	:label="dict.value">
	229	{{dict.label}}
	230	</el-checkbox>
	231	</el-checkbox-group>
	232	</el-form-item>
	233	#elseif($column.htmlType == "checkbox" && $dictType)
	234	<el-form-item label="${comment}" prop="${field}">
	235	<el-checkbox-group v-model="form.${field}">
	236	<el-checkbox>请选择字典生成</el-checkbox>
	237	</el-checkbox-group>
	238	</el-form-item>
	239	#elseif($column.htmlType == "radio" && "" != $dictType)
	240	<el-form-item label="${comment}" prop="${field}">
	241	<el-radio-group v-model="form.${field}">
	242	<el-radio
	243	v-for="dict in dict.type.${dictType}"
	244	:key="dict.value"
	245	#if($column.javaType == "Integer" \|\| $column.javaType == "Long")
	246	:label="parseInt(dict.value)"
	247	#else
	248	:label="dict.value"
	249	#end
	250	>{{dict.label}}</el-radio>
	251	</el-radio-group>
	252	</el-form-item>
	253	#elseif($column.htmlType == "radio" && $dictType)
	254	<el-form-item label="${comment}" prop="${field}">
	255	<el-radio-group v-model="form.${field}">
	256	<el-radio label="1">请选择字典生成</el-radio>
	257	</el-radio-group>
	258	</el-form-item>
	259	#elseif($column.htmlType == "datetime")
	260	<el-form-item label="${comment}" prop="${field}">
	261	<el-date-picker clearable
	262	v-model="form.${field}"
	263	type="date"
	264	value-format="yyyy-MM-dd"
	265	placeholder="选择${comment}">
	266	</el-date-picker>
	267	</el-form-item>
	268	#elseif($column.htmlType == "textarea")
	269	<el-form-item label="${comment}" prop="${field}">
	270	<el-input v-model="form.${field}" type="textarea" placeholder="请输入内容" />
	271	</el-form-item>
	272	#end
	273	#end
	274	#end
	275	#end
	276	</el-form>
	277	<div slot="footer" class="dialog-footer">
	278	<el-button type="primary" @click="submitForm">确定</el-button>
	279	<el-button @click="cancel">取消</el-button>
	280	</div>
	281	</el-dialog>
	282	</div>
	283	</template>
	284
	285	<script>
	286	import { list${BusinessName}, get${BusinessName}, del${BusinessName}, add${BusinessName}, update${BusinessName} } from "@/api/${moduleName}/${businessName}";
	287	import Treeselect from "@riophae/vue-treeselect";
	288	import "@riophae/vue-treeselect/dist/vue-treeselect.css";
	289
	290	export default {
	291	name: "${BusinessName}",
	292	#if(${dicts} != '')
	293	dicts: [${dicts}],
	294	#end
	295	components: {
	296	Treeselect
	297	},
	298	data() {
	299	return {
	300	// 遮罩层
	301	loading: true,
	302	// 显示搜索条件
	303	showSearch: true,
	304	// ${functionName}表格数据
	305	${businessName}List: [],
	306	// ${functionName}树选项
	307	${businessName}Options: [],
	308	// 弹出层标题
	309	title: "",
	310	// 是否显示弹出层
	311	open: false,
	312	// 是否展开，默认全部展开
	313	isExpandAll: true,
	314	// 重新渲染表格状态
	315	refreshTable: true,
	316	#foreach ($column in $columns)
	317	#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
	318	#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
	319	// $comment时间范围
	320	daterange${AttrName}: [],
	321	#end
	322	#end
	323	// 查询参数
	324	queryParams: {
	325	#foreach ($column in $columns)
	326	#if($column.query)
	327	$column.javaField: null#if($foreach.count != $columns.size()),#end
	328	#end
	329	#end
	330	},
	331	// 表单参数
	332	form: {},
	333	// 表单校验
	334	rules: {
	335	#foreach ($column in $columns)
	336	#if($column.required)
	337	#set($parentheseIndex=$column.columnComment.indexOf("（"))
	338	#if($parentheseIndex != -1)
	339	#set($comment=$column.columnComment.substring(0, $parentheseIndex))
	340	#else
	341	#set($comment=$column.columnComment)
	342	#end
	343	$column.javaField: [
	344	{ required: true, message: "$comment不能为空", trigger: #if($column.htmlType == "select" \|\| $column.htmlType == "radio")"change"#else"blur"#end }
	345	]#if($foreach.count != $columns.size()),#end
	346	#end
	347	#end
	348	}
	349	};
	350	},
	351	created() {
	352	this.getList();
	353	},
	354	methods: {
	355	/** 查询${functionName}列表 */
	356	getList() {
	357	this.loading = true;
	358	#foreach ($column in $columns)
	359	#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
	360	this.queryParams.params = {};
	361	#break
	362	#end
	363	#end
	364	#foreach ($column in $columns)
	365	#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
	366	#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
	367	if (null != this.daterange${AttrName} && '' != this.daterange${AttrName}) {
	368	this.queryParams.params["begin${AttrName}"] = this.daterange${AttrName}[0];
	369	this.queryParams.params["end${AttrName}"] = this.daterange${AttrName}[1];
	370	}
	371	#end
	372	#end
	373	list${BusinessName}(this.queryParams).then(response => {
	374	this.${businessName}List = this.handleTree(response.data, "${treeCode}", "${treeParentCode}");
	375	this.loading = false;
	376	});
	377	},
	378	/** 转换${functionName}数据结构 */
	379	normalizer(node) {
	380	if (node.children && !node.children.length) {
	381	delete node.children;
	382	}
	383	return {
	384	id: node.${treeCode},
	385	label: node.${treeName},
	386	children: node.children
	387	};
	388	},
	389	/** 查询${functionName}下拉树结构 */
	390	getTreeselect() {
	391	list${BusinessName}().then(response => {
	392	this.${businessName}Options = [];
	393	const data = { ${treeCode}: 0, ${treeName}: '顶级节点', children: [] };
	394	data.children = this.handleTree(response.data, "${treeCode}", "${treeParentCode}");
	395	this.${businessName}Options.push(data);
	396	});
	397	},
	398	// 取消按钮
	399	cancel() {
	400	this.open = false;
	401	this.reset();
	402	},
	403	// 表单重置
	404	reset() {
	405	this.form = {
	406	#foreach ($column in $columns)
	407	#if($column.htmlType == "checkbox")
	408	$column.javaField: []#if($foreach.count != $columns.size()),#end
	409	#else
	410	$column.javaField: null#if($foreach.count != $columns.size()),#end
	411	#end
	412	#end
	413	};
	414	this.resetForm("form");
	415	},
	416	/** 搜索按钮操作 */
	417	handleQuery() {
	418	this.getList();
	419	},
	420	/** 重置按钮操作 */
	421	resetQuery() {
	422	#foreach ($column in $columns)
	423	#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
	424	#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
	425	this.daterange${AttrName} = [];
	426	#end
	427	#end
	428	this.resetForm("queryForm");
	429	this.handleQuery();
	430	},
	431	/** 新增按钮操作 */
	432	handleAdd(row) {
	433	this.reset();
	434	this.getTreeselect();
	435	if (row != null && row.${treeCode}) {
	436	this.form.${treeParentCode} = row.${treeCode};
	437	} else {
	438	this.form.${treeParentCode} = 0;
	439	}
	440	this.open = true;
	441	this.title = "添加${functionName}";
	442	},
	443	/** 展开/折叠操作 */
	444	toggleExpandAll() {
	445	this.refreshTable = false;
	446	this.isExpandAll = !this.isExpandAll;
	447	this.$nextTick(() => {
	448	this.refreshTable = true;
	449	});
	450	},
	451	/** 修改按钮操作 */
	452	handleUpdate(row) {
	453	this.reset();
	454	this.getTreeselect();
	455	if (row != null) {
	456	this.form.${treeParentCode} = row.${treeParentCode};
	457	}
	458	get${BusinessName}(row.${pkColumn.javaField}).then(response => {
	459	this.form = response.data;
	460	#foreach ($column in $columns)
	461	#if($column.htmlType == "checkbox")
	462	this.form.$column.javaField = this.form.${column.javaField}.split(",");
	463	#end
	464	#end
	465	this.open = true;
	466	this.title = "修改${functionName}";
	467	});
	468	},
	469	/** 提交按钮 */
	470	submitForm() {
	471	this.#[[$]]#refs["form"].validate(valid => {
	472	if (valid) {
	473	#foreach ($column in $columns)
	474	#if($column.htmlType == "checkbox")
	475	this.form.$column.javaField = this.form.${column.javaField}.join(",");
	476	#end
	477	#end
	478	if (this.form.${pkColumn.javaField} != null) {
	479	update${BusinessName}(this.form).then(response => {
	480	this.#[[$modal]]#.msgSuccess("修改成功");
	481	this.open = false;
	482	this.getList();
	483	});
	484	} else {
	485	add${BusinessName}(this.form).then(response => {
	486	this.#[[$modal]]#.msgSuccess("新增成功");
	487	this.open = false;
	488	this.getList();
	489	});
	490	}
	491	}
	492	});
	493	},
	494	/** 删除按钮操作 */
	495	handleDelete(row) {
	496	this.#[[$modal]]#.confirm('是否确认删除${functionName}编号为"' + row.${pkColumn.javaField} + '"的数据项？').then(function() {
	497	return del${BusinessName}(row.${pkColumn.javaField});
	498	}).then(() => {
	499	this.getList();
	500	this.#[[$modal]]#.msgSuccess("删除成功");
	501	}).catch(() => {});
	502	}
	503	}
	504	};
	505	</script>