iailab-plat-ui-vue3.git

潘志宝

16 小时以前 0cae456a355877d1e89494b3b436bda3afde48c9

提交 \| 用户 \| 时间
7462da	1	<template>
L	2	<!-- 搜索 -->
	3	<ContentWrap>
	4	<el-form
	5	class="-mb-15px"
	6	:model="queryParams"
	7	ref="queryFormRef"
	8	:inline="true"
	9	label-width="68px"
ec54c9	10	@submit.prevent
7462da	11	>
6e7f22	12	<el-form-item label="编号" prop="itemno">
7462da	13	<el-input
6e7f22	14	v-model="queryParams.itemno"
潘	15	placeholder="请输入编号"
	16	clearable
	17	@keyup.enter="handleQuery"
	18	class="!w-240px"
	19	/>
	20	</el-form-item>
	21	<el-form-item label="预测项名" prop="itemname">
	22	<el-input
	23	v-model="queryParams.itemname"
	24	placeholder="请输入预测项名"
7462da	25	clearable
L	26	@keyup.enter="handleQuery"
	27	class="!w-240px"
	28	/>
	29	</el-form-item>
6dbd81	30	<el-form-item label="类型" prop="itemtypeid">
潘	31	<el-select
	32	v-model="queryParams.itemtypeid"
1f15dd	33	placeholder="请选择"
潘	34	clearable
	35	class="!w-240px">
6dbd81	36	<el-option
潘	37	v-for="item in itemTypeList"
	38	:key="item.id"
	39	:label="item.itemtypename"
	40	:value="item.id"/>
	41	</el-select>
	42	</el-form-item>
379650	43	<el-form-item label="管网名称" prop="modulename">
潘	44	<el-input
	45	v-model="queryParams.modulename"
	46	placeholder="请输入管网名称"
	47	clearable
	48	@keyup.enter="handleQuery"
	49	class="!w-240px"
	50	/>
	51	</el-form-item>
0cae45	52	<el-form-item label="运行状态" prop="runStatus">
潘	53	<el-select
	54	v-model="queryParams.runStatus"
	55	placeholder="请选择"
	56	clearable
	57	class="!w-240px">
	58	<el-option
	59	v-for="dict in getIntDictOptions(DICT_TYPE.ITEM_RUN_STATUS)"
	60	:key="dict.value"
	61	:label="dict.label"
	62	:value="dict.value"
	63	/>
	64	</el-select>
	65	</el-form-item>
7462da	66	<el-form-item>
L	67	<el-button @click="handleQuery">
6e7f22	68	<Icon icon="ep:search" class="mr-5px"/>
7462da	69	搜索
L	70	</el-button>
	71	<el-button @click="resetQuery">
6e7f22	72	<Icon icon="ep:refresh" class="mr-5px"/>
7462da	73	重置
L	74	</el-button>
	75	<el-button
	76	type="primary"
	77	plain
	78	@click="openForm('create')"
cd9f11	79	v-hasPermi="['model:pre-item:create']"
7462da	80	>
6e7f22	81	<Icon icon="ep:plus" class="mr-5px"/>
7462da	82	新增
L	83	</el-button>
	84	</el-form-item>
	85	</el-form>
	86	</ContentWrap>
	87
	88	<!-- 列表 -->
	89	<ContentWrap>
	90	<el-table v-loading="loading" :data="list">
e7b6da	91	<el-table-column label="编号" align="center" min-width="150" prop="itemno"/>
d3ee81	92	<el-table-column label="预测项名" header-align="center" align="left" min-width="200" prop="itemname"/>
d8e4be	93	<el-table-column label="类型名称" align="center" min-width="120" prop="itemtypename">
d3ee81	94	<template #default="scope">
潘	95	<el-tag v-if="scope.row.itemtypename === 'NormalItem'" size="small" type="success">{{scope.row.itemtypename}}</el-tag>
	96	<el-tag v-else size="small" type="primary">{{scope.row.itemtypename}}</el-tag>
	97	</template>
	98	</el-table-column>
64317c	99	<el-table-column label="预测长度(min)" align="center" prop="predictlength"/>
d3ee81	100	<el-table-column label="粒度" align="center" prop="granularity">
潘	101	<template #default="scope">
e7b6da	102	<dict-tag :type="DICT_TYPE.PRED_GRANULARITY" :value="scope.row.granularity" />
d3ee81	103	</template>
潘	104	</el-table-column>
379650	105	<el-table-column label="管网名称" align="center" prop="modulename" />
d3ee81	106	<el-table-column label="是否启用" align="center" prop="status">
潘	107	<template #default="scope">
	108	<dict-tag :type="DICT_TYPE.COM_IS_INT" :value="scope.row.status" />
	109	</template>
	110	</el-table-column>
d8e4be	111	<el-table-column label="运行时间" min-width="150" align="center" prop="lastTime"/>
7b1ce6	112	<el-table-column label="运行状态" align="center" prop="runStatus">
潘	113	<template #default="scope">
932c3a	114	<dict-tag :type="DICT_TYPE.ITEM_RUN_STATUS" :value="scope.row.runStatus \|\| 200" />
7b1ce6	115	</template>
潘	116	</el-table-column>
f2de70	117	<el-table-column label="运行耗时(ms)" align="center" prop="duration"/>
e7b6da	118	<el-table-column label="操作" align="center" min-width="120" fixed="right">
7462da	119	<template #default="scope">
L	120	<el-button
	121	link
	122	type="primary"
6e7f22	123	@click="openForm('update', scope.row.id, scope.row.itemtypename)"
cd9f11	124	v-hasPermi="['model:pre-item:update']"
7462da	125	>
L	126	编辑
	127	</el-button>
932c3a	128	<el-button link type="primary" @click="chartHandle(scope.row)">数据</el-button>
7462da	129	<el-button
L	130	link
	131	type="danger"
	132	@click="handleDelete(scope.row.id)"
cd9f11	133	v-hasPermi="['model:pre-item:delete']"
7462da	134	>
L	135	删除
	136	</el-button>
	137	</template>
	138	</el-table-column>
	139	</el-table>
	140	<!-- 分页 -->
	141	<Pagination
	142	:total="total"
	143	v-model:page="queryParams.pageNo"
	144	v-model:limit="queryParams.pageSize"
	145	@pagination="getList"
	146	/>
	147	</ContentWrap>
	148
	149	<!-- 表单弹窗：添加/修改 -->
6e7f22	150	<MmPredictItemForm ref="formRef" @success="getList"/>
7462da	151
e7b6da	152	<!-- 表单弹窗：数据 -->
潘	153	<MmPredictItemChart ref="chartView" @success="getList"/>
	154
7462da	155	</template>
L	156	<script lang="ts" setup>
6e7f22	157	import MmPredictItemForm from './MmPredictItemForm.vue'
e7b6da	158	import MmPredictItemChart from './MmPredictItemChart.vue'
6dbd81	159	import * as MmItemType from '@/api/model/pre/type'
7b1ce6	160	import * as MmPredictItem from '@/api/model/pre/item'
0cae45	161	import {DICT_TYPE, getIntDictOptions} from "@/utils/dict";
7462da	162
6e7f22	163	defineOptions({name: 'DataMmPredictItem'})
7462da	164
6e7f22	165	const message = useMessage() // 消息弹窗
潘	166	const {t} = useI18n() // 国际化
7462da	167
6dbd81	168	const itemTypeList = ref([])
6e7f22	169	const loading = ref(true) // 列表的加载中
潘	170	const total = ref(0) // 列表的总页数
	171	const list = ref([]) // 列表的数据
	172	const queryParams = reactive({
	173	pageNo: 1,
	174	pageSize: 10,
	175	itemno: undefined,
	176	itemname: undefined,
6dbd81	177	itemtypeid: undefined,
379650	178	modulename: undefined,
6e7f22	179	})
潘	180	const isList = ref([
	181	{
	182	code: 0,
	183	name: '否'
	184	},
	185	{
	186	code: 1,
	187	name: '是'
	188	}])
	189	const queryFormRef = ref() // 搜索的表单
	190	const exportLoading = ref(false) // 导出的加载中
7462da	191
6e7f22	192	/** 查询列表 */
潘	193	const getList = async () => {
	194	loading.value = true
	195	try {
	196	const page = await MmPredictItem.getMmPredictItemPage(queryParams)
	197	list.value = page.list
	198	total.value = page.total
	199	} finally {
	200	loading.value = false
7462da	201	}
6e7f22	202	}
7462da	203
6e7f22	204	/** 搜索按钮操作 */
潘	205	const handleQuery = () => {
	206	queryParams.pageNo = 1
	207	getList()
	208	}
7462da	209
6e7f22	210	/** 重置按钮操作 */
潘	211	const resetQuery = () => {
	212	queryFormRef.value.resetFields()
	213	handleQuery()
	214	}
7462da	215
e7b6da	216	/** 查看数据操作 */
潘	217	const chartView = ref()
	218	const chartHandle = (raw: object) => {
	219	chartView.value.open(raw)
	220	}
	221
6e7f22	222	/** 添加/修改操作 */
潘	223	const formRef = ref()
	224	const openForm = (type: string, id?: number, itemtypename?: string) => {
	225	formRef.value.open(type, id, itemtypename)
	226	}
7462da	227
6e7f22	228	/** 删除按钮操作 */
潘	229	const handleDelete = async (id: number) => {
	230	try {
	231	// 删除的二次确认
	232	await message.delConfirm()
	233	// 发起删除
	234	await MmPredictItem.deleteMmPredictItem(id)
	235	message.success(t('common.delSuccess'))
	236	// 刷新列表
7462da	237	await getList()
6e7f22	238	} catch {
潘	239	}
	240	}
	241
	242	/ 初始化 /
	243	onMounted(async () => {
	244	await getList()
6dbd81	245	// 获取预测项类型列表
潘	246	itemTypeList.value = await MmItemType.getItemTypeList()
6e7f22	247	})
7462da	248	</script>