Jcdm041-Mes.git

2024-01-16 b7ce0c733c97fab56004f38e8fc597d89e883a09

提交 \| 用户 \| 时间
fd2207	1	<template>
懒	2	<el-card>
	3	<el-tabs v-model="activeName">
	4	<el-tab-pane label="基本信息" name="basic">
	5	<basic-info-form ref="basicInfo" :info="info" />
	6	</el-tab-pane>
	7	<el-tab-pane label="字段信息" name="columnInfo">
	8	<el-table ref="dragTable" :data="columns" row-key="columnId" :max-height="tableHeight">
	9	<el-table-column label="序号" type="index" min-width="5%" class-name="allowDrag" />
	10	<el-table-column
	11	label="字段列名"
	12	prop="columnName"
	13	min-width="10%"
	14	:show-overflow-tooltip="true"
	15	/>
	16	<el-table-column label="字段描述" min-width="10%">
	17	<template slot-scope="scope">
	18	<el-input v-model="scope.row.columnComment"></el-input>
	19	</template>
	20	</el-table-column>
	21	<el-table-column
	22	label="物理类型"
	23	prop="columnType"
	24	min-width="10%"
	25	:show-overflow-tooltip="true"
	26	/>
	27	<el-table-column label="Java类型" min-width="11%">
	28	<template slot-scope="scope">
	29	<el-select v-model="scope.row.javaType">
	30	<el-option label="Long" value="Long" />
	31	<el-option label="String" value="String" />
	32	<el-option label="Integer" value="Integer" />
	33	<el-option label="Double" value="Double" />
	34	<el-option label="BigDecimal" value="BigDecimal" />
	35	<el-option label="Date" value="Date" />
	36	<el-option label="Boolean" value="Boolean" />
	37	</el-select>
	38	</template>
	39	</el-table-column>
	40	<el-table-column label="java属性" min-width="10%">
	41	<template slot-scope="scope">
	42	<el-input v-model="scope.row.javaField"></el-input>
	43	</template>
	44	</el-table-column>
	45
	46	<el-table-column label="插入" min-width="5%">
	47	<template slot-scope="scope">
	48	<el-checkbox true-label="1" false-label="0" v-model="scope.row.isInsert"></el-checkbox>
	49	</template>
	50	</el-table-column>
	51	<el-table-column label="编辑" min-width="5%">
	52	<template slot-scope="scope">
	53	<el-checkbox true-label="1" false-label="0" v-model="scope.row.isEdit"></el-checkbox>
	54	</template>
	55	</el-table-column>
	56	<el-table-column label="列表" min-width="5%">
	57	<template slot-scope="scope">
	58	<el-checkbox true-label="1" false-label="0" v-model="scope.row.isList"></el-checkbox>
	59	</template>
	60	</el-table-column>
	61	<el-table-column label="查询" min-width="5%">
	62	<template slot-scope="scope">
	63	<el-checkbox true-label="1" false-label="0" v-model="scope.row.isQuery"></el-checkbox>
	64	</template>
	65	</el-table-column>
	66	<el-table-column label="查询方式" min-width="10%">
	67	<template slot-scope="scope">
	68	<el-select v-model="scope.row.queryType">
	69	<el-option label="=" value="EQ" />
	70	<el-option label="!=" value="NE" />
	71	<el-option label=">" value="GT" />
	72	<el-option label=">=" value="GTE" />
	73	<el-option label="<" value="LT" />
	74	<el-option label="<=" value="LTE" />
	75	<el-option label="LIKE" value="LIKE" />
	76	<el-option label="BETWEEN" value="BETWEEN" />
	77	</el-select>
	78	</template>
	79	</el-table-column>
	80	<el-table-column label="必填" min-width="5%">
	81	<template slot-scope="scope">
	82	<el-checkbox true-label="1" false-label="0" v-model="scope.row.isRequired"></el-checkbox>
	83	</template>
	84	</el-table-column>
	85	<el-table-column label="显示类型" min-width="12%">
	86	<template slot-scope="scope">
	87	<el-select v-model="scope.row.htmlType">
	88	<el-option label="文本框" value="input" />
	89	<el-option label="文本域" value="textarea" />
	90	<el-option label="下拉框" value="select" />
	91	<el-option label="单选框" value="radio" />
	92	<el-option label="复选框" value="checkbox" />
	93	<el-option label="日期控件" value="datetime" />
	94	<el-option label="图片上传" value="imageUpload" />
	95	<el-option label="文件上传" value="fileUpload" />
	96	<el-option label="富文本控件" value="editor" />
	97	</el-select>
	98	</template>
	99	</el-table-column>
	100	<el-table-column label="字典类型" min-width="12%">
	101	<template slot-scope="scope">
	102	<el-select v-model="scope.row.dictType" clearable filterable placeholder="请选择">
	103	<el-option
	104	v-for="dict in dictOptions"
	105	:key="dict.dictType"
	106	:label="dict.dictName"
	107	:value="dict.dictType">
	108	<span style="float: left">{{ dict.dictName }}</span>
	109	<span style="float: right; color: #8492a6; font-size: 13px">{{ dict.dictType }}</span>
	110	</el-option>
	111	</el-select>
	112	</template>
	113	</el-table-column>
	114	</el-table>
	115	</el-tab-pane>
	116	<el-tab-pane label="生成信息" name="genInfo">
	117	<gen-info-form ref="genInfo" :info="info" :tables="tables" :menus="menus"/>
	118	</el-tab-pane>
	119	</el-tabs>
	120	<el-form label-width="100px">
	121	<el-form-item style="text-align: center;margin-left:-100px;margin-top:10px;">
	122	<el-button type="primary" @click="submitForm()">提交</el-button>
	123	<el-button @click="close()">返回</el-button>
	124	</el-form-item>
	125	</el-form>
	126	</el-card>
	127	</template>
	128
	129	<script>
	130	import { getGenTable, updateGenTable } from "@/api/tool/gen";
	131	import { optionselect as getDictOptionselect } from "@/api/system/dict/type";
	132	import { listMenu as getMenuTreeselect } from "@/api/system/menu";
	133	import basicInfoForm from "./basicInfoForm";
	134	import genInfoForm from "./genInfoForm";
	135	import Sortable from 'sortablejs'
	136
	137	export default {
	138	name: "GenEdit",
	139	components: {
	140	basicInfoForm,
	141	genInfoForm
	142	},
	143	data() {
	144	return {
	145	// 选中选项卡的 name
	146	activeName: "columnInfo",
	147	// 表格的高度
	148	tableHeight: document.documentElement.scrollHeight - 245 + "px",
	149	// 表信息
	150	tables: [],
	151	// 表列信息
	152	columns: [],
	153	// 字典信息
	154	dictOptions: [],
	155	// 菜单信息
	156	menus: [],
	157	// 表详细信息
	158	info: {}
	159	};
	160	},
	161	created() {
	162	const tableId = this.$route.params && this.$route.params.tableId;
	163	if (tableId) {
	164	// 获取表详细信息
	165	getGenTable(tableId).then(res => {
	166	this.columns = res.data.rows;
	167	this.info = res.data.info;
	168	this.tables = res.data.tables;
	169	});
	170	/** 查询字典下拉列表 */
	171	getDictOptionselect().then(response => {
	172	this.dictOptions = response.data;
	173	});
	174	/** 查询菜单下拉列表 */
	175	getMenuTreeselect().then(response => {
	176	this.menus = this.handleTree(response.data, "menuId");
	177	});
	178	}
	179	},
	180	methods: {
	181	/** 提交按钮 */
	182	submitForm() {
	183	const basicForm = this.$refs.basicInfo.$refs.basicInfoForm;
	184	const genForm = this.$refs.genInfo.$refs.genInfoForm;
	185	Promise.all([basicForm, genForm].map(this.getFormPromise)).then(res => {
	186	const validateResult = res.every(item => !!item);
	187	if (validateResult) {
	188	const genTable = Object.assign({}, basicForm.model, genForm.model);
	189	genTable.columns = this.columns;
	190	genTable.params = {
	191	treeCode: genTable.treeCode,
	192	treeName: genTable.treeName,
	193	treeParentCode: genTable.treeParentCode,
	194	parentMenuId: genTable.parentMenuId
	195	};
	196	updateGenTable(genTable).then(res => {
	197	this.$modal.msgSuccess(res.msg);
	198	if (res.code === 200) {
	199	this.close();
	200	}
	201	});
	202	} else {
	203	this.$modal.msgError("表单校验未通过，请重新检查提交内容");
	204	}
	205	});
	206	},
	207	getFormPromise(form) {
	208	return new Promise(resolve => {
	209	form.validate(res => {
	210	resolve(res);
	211	});
	212	});
	213	},
	214	/** 关闭按钮 */
	215	close() {
	216	const obj = { path: "/tool/gen", query: { t: Date.now(), pageNum: this.$route.query.pageNum } };
	217	this.$tab.closeOpenPage(obj);
	218	}
	219	},
	220	mounted() {
	221	const el = this.$refs.dragTable.$el.querySelectorAll(".el-table__body-wrapper > table > tbody")[0];
	222	const sortable = Sortable.create(el, {
	223	handle: ".allowDrag",
	224	onEnd: evt => {
	225	const targetRow = this.columns.splice(evt.oldIndex, 1)[0];
	226	this.columns.splice(evt.newIndex, 0, targetRow);
	227	for (let index in this.columns) {
	228	this.columns[index].sort = parseInt(index) + 1;
	229	}
	230	}
	231	});
	232	}
	233	};
	234	</script>