iailab-plat-ui-vue3.git

潘志宝

3 天以前 afd12bd4683489925575346214080faf05394a73

提交 \| 用户 \| 时间
1c14d6	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"
	10	>
	11	<el-form-item label="测点编码" prop="pointNo">
	12	<el-input
	13	v-model="queryParams.pointNo"
	14	placeholder="请输入测点编码"
	15	clearable
	16	@keyup.enter="handleQuery"
aba8b4	17	class="!w-200px"
1c14d6	18	/>
L	19	</el-form-item>
	20	<el-form-item label="测点名称" prop="pointName">
	21	<el-input
	22	v-model="queryParams.pointName"
	23	placeholder="请输入测点名称"
	24	clearable
	25	@keyup.enter="handleQuery"
aba8b4	26	class="!w-200px"
1c14d6	27	/>
L	28	</el-form-item>
f33c52	29	<el-form-item label="测点类型" prop="pointType">
潘	30	<el-select
	31	v-model="queryParams.pointType"
	32	placeholder="请选择"
	33	clearable
	34	class="!w-240px"
	35	>
	36	<el-option
	37	v-for="dict in getStrDictOptions(DICT_TYPE.DATA_POINT_TYPE)"
	38	:key="dict.value"
	39	:label="dict.label"
	40	:value="dict.value"
	41	/>
	42	</el-select>
	43	</el-form-item>
e9d8f9	44	<el-form-item label="测点Tag" prop="tagNo">
潘	45	<el-input
	46	v-model="queryParams.tagNo"
	47	placeholder="请输入测点Tag"
	48	clearable
	49	@keyup.enter="handleQuery"
aba8b4	50	class="!w-200px"
e9d8f9	51	/>
潘	52	</el-form-item>
d97202	53	<el-form-item label="采集质量" prop="collectQuality">
潘	54	<el-select
	55	v-model="queryParams.collectQuality"
	56	placeholder="请选择"
	57	clearable
	58	class="!w-240px"
	59	>
	60	<el-option
	61	v-for="dict in getStrDictOptions(DICT_TYPE.DATA_QUALITY)"
	62	:key="dict.value"
	63	:label="dict.label"
	64	:value="dict.value"
	65	/>
	66	</el-select>
	67	</el-form-item>
1c14d6	68	<el-form-item>
L	69	<el-button @click="handleQuery">
	70	<Icon icon="ep:search" class="mr-5px" />
	71	搜索
	72	</el-button>
	73	<el-button @click="resetQuery">
	74	<Icon icon="ep:refresh" class="mr-5px" />
	75	重置
	76	</el-button>
	77	<el-button
	78	type="primary"
	79	plain
	80	@click="openForm('create')"
85c27f	81	v-hasPermi="['data:point:create']"
1c14d6	82	>
L	83	<Icon icon="ep:plus" class="mr-5px" />
	84	新增
	85	</el-button>
031c25	86	<el-button
D	87	type="warning"
	88	plain
	89	@click="handleImport"
	90	v-hasPermi="['data:point:import']"
	91	>
	92	<Icon icon="ep:upload" /> 导入
	93	</el-button>
	94	<el-button
	95	type="success"
	96	plain
	97	@click="handleExport"
	98	:loading="exportLoading"
	99	v-hasPermi="['data:point:export']"
	100	>
	101	<Icon icon="ep:download" />导出
	102	</el-button>
5d8c73	103	<el-button
J	104	type="success"
	105	plain
	106	@click="enable"
	107	v-hasPermi="['data:point:update']"
	108	>启用
	109	</el-button>
	110	<el-button
	111	type="danger"
	112	plain
	113	@click="disable"
	114	v-hasPermi="['data:point:update']"
	115	>禁用
	116	</el-button>
1c14d6	117	</el-form-item>
L	118	</el-form>
	119	</ContentWrap>
	120
	121	<!-- 列表 -->
	122	<ContentWrap>
5d8c73	123	<el-table border stripe v-loading="loading" :data="list" @selection-change="selectionChangeHandle">
de0f62	124	<el-table-column type="selection" header-align="center" align="center" fixed="left" width="50"/>
5d8c73	125	<el-table-column fixed label="测点编码" header-align="center" align="left" min-width="130" prop="pointNo" />
de0f62	126	<el-table-column fixed label="测点名称" header-align="center" align="left" min-width="240" prop="pointName" />
e9d8f9	127	<el-table-column label="测点类型" align="center" prop="pointType" width="100">
潘	128	<template #default="scope">
	129	<dict-tag :type="DICT_TYPE.DATA_POINT_TYPE" :value="scope.row.pointType" />
	130	</template>
	131	</el-table-column>
	132	<el-table-column label="数据类型" align="center" prop="dataType" width="100">
	133	<template #default="scope">
	134	<dict-tag :type="DICT_TYPE.POINT_DATA_TYPE" :value="scope.row.dataType" />
15a226	135	</template>
L	136	</el-table-column>
	137	<el-table-column label="值类型" align="center" prop="valueType" width="120">
	138	<template #default="scope">
df90c0	139	<dict-tag :type="DICT_TYPE.MEASURE_VALUE_TYPE" :value="scope.row.valueType" />
e9d8f9	140	</template>
潘	141	</el-table-column>
c4b4d2	142	<el-table-column label="测量单位" align="center" prop="unit" width="80"/>
1c14d6	143	<el-table-column label="单位转换" align="center" prop="unittransfactor" />
c4b4d2	144	<el-table-column label="默认值" align="center" prop="defaultValue" width="100"/>
e9d8f9	145	<el-table-column label="采集频率" align="center" prop="minfreqid" width="100"/>
c4b4d2	146	<el-table-column label="数据源类型" align="center" prop="sourceType" min-width="100"/>
潘	147	<el-table-column label="数据源名称" align="center" prop="sourceName" min-width="100"/>
e9d8f9	148	<el-table-column label="测点Tag" header-align="center" align="left" prop="tagNo" min-width="150"/>
d97202	149	<el-table-column label="采集质量" header-align="center" align="center" prop="collectQuality" width="100">
de0f62	150	<template #default="scope">
潘	151	<el-tag v-if="scope.row.collectQuality === 'Good'" size="small" type="success">{{scope.row.collectQuality}}</el-tag>
	152	<el-tag v-if="scope.row.collectQuality === 'Bad'" size="small" type="danger">{{scope.row.collectQuality}}</el-tag>
	153	</template>
	154	</el-table-column>
	155	<el-table-column label="采集时间" header-align="center" align="center" prop="collectTime" min-width="150"/>
5d8c73	156	<el-table-column label="是否启用" align="center" prop="isEnable" width="85">
85c27f	157	<template #default="scope">
潘	158	<el-tag v-if="scope.row.isEnable === 1" size="small">是</el-tag>
	159	<el-tag v-else size="small" type="danger">否</el-tag>
	160	</template>
	161	</el-table-column>
1c14d6	162
5d8c73	163	<el-table-column label="操作" align="center" min-width="130" fixed="right" width="120">
1c14d6	164	<template #default="scope">
L	165	<el-button
	166	link
c4b4d2	167	size="mini"
1c14d6	168	type="primary"
L	169	@click="openForm('update', scope.row.id)"
85c27f	170	v-hasPermi="['data:point:update']"
1c14d6	171	>
L	172	编辑
	173	</el-button>
c4b4d2	174	<el-button link size="mini" type="primary" @click="chartHandle(scope.row)">数据</el-button>
1c14d6	175	<el-button
L	176	link
c4b4d2	177	size="mini"
1c14d6	178	type="danger"
L	179	@click="handleDelete(scope.row.id)"
85c27f	180	v-hasPermi="['data:point:delete']"
1c14d6	181	>
L	182	删除
	183	</el-button>
	184	</template>
	185	</el-table-column>
	186	</el-table>
	187	<!-- 分页 -->
	188	<Pagination
	189	:total="total"
	190	v-model:page="queryParams.pageNo"
	191	v-model:limit="queryParams.pageSize"
	192	@pagination="getList"
	193	/>
	194	</ContentWrap>
	195
	196	<!-- 表单弹窗：添加/修改 -->
	197	<DaPointForm ref="formRef" @success="getList" />
	198
031c25	199	<DaPointChart ref="chartView" />
D	200
	201	<!-- 用户导入对话框 -->
	202	<PointImportForm ref="importFormRef" @success="getList" />
1c14d6	203	</template>
L	204	<script lang="ts" setup>
	205	import * as DaPoint from '@/api/data/da/point'
5d8c73	206	import {ref, reactive} from "vue";
031c25	207	import download from "@/utils/download";
d97202	208	import {DICT_TYPE, getDictOptions, getIntDictOptions, getStrDictOptions} from "@/utils/dict";
031c25	209	import DaPointForm from './DaPointForm.vue'
D	210	import DaPointChart from './DaPointChart.vue'
	211	import * as UserApi from "@/api/system/user";
c52be7	212	import PointImportForm from './PointImportForm.vue'
1c14d6	213
85c27f	214	defineOptions({name: 'DataPoint'})
1c14d6	215
L	216	const message = useMessage() // 消息弹窗
	217	const {t} = useI18n() // 国际化
	218
	219	const loading = ref(true) // 列表的加载中
	220	const total = ref(0) // 列表的总页数
	221	const list = ref([]) // 列表的数据
	222	const queryParams = reactive({
	223	pageNo: 1,
	224	pageSize: 10,
	225	pointNo: undefined,
	226	pointName: undefined,
f33c52	227	pointType: undefined,
e9d8f9	228	tagNo: undefined,
d97202	229	collectQuality: undefined,
1c14d6	230	})
L	231	const queryFormRef = ref() // 搜索的表单
	232
	233	/** 查询列表 */
	234	const getList = async () => {
	235	loading.value = true
	236	try {
	237	const page = await DaPoint.getDaPointPage(queryParams)
	238	list.value = page.list
	239	total.value = page.total
	240	} finally {
	241	loading.value = false
	242	}
	243	}
	244
	245	/** 搜索按钮操作 */
	246	const handleQuery = () => {
	247	queryParams.pageNo = 1
	248	getList()
031c25	249	}
D	250
	251	/** 查看数据操作 */
	252	const chartView = ref()
	253	const chartHandle = (raw: object) => {
	254	chartView.value.open(raw)
1c14d6	255	}
L	256
	257	/** 重置按钮操作 */
	258	const resetQuery = () => {
	259	queryFormRef.value.resetFields()
	260	handleQuery()
	261	}
	262
	263	/** 添加/修改操作 */
	264	const formRef = ref()
	265	const openForm = (type: string, id?: number) => {
	266	formRef.value.open(type, id)
	267	}
	268
	269	/** 删除按钮操作 */
	270	const handleDelete = async (id: number) => {
	271	try {
	272	// 删除的二次确认
	273	await message.delConfirm()
	274	// 发起删除
	275	await DaPoint.deleteDaPoint(id)
	276	message.success(t('common.delSuccess'))
	277	// 刷新列表
	278	await getList()
	279	} catch {
	280	}
	281	}
031c25	282	/** 测点导入 */
D	283	const importFormRef = ref()
	284	const handleImport = () => {
	285	importFormRef.value.open()
	286	}
1c14d6	287
031c25	288	/** 导出按钮操作 */
D	289	const exportLoading = ref(false)
	290	const handleExport = async () => {
	291	try {
	292	// 导出的二次确认
	293	await message.exportConfirm()
	294	// 发起导出
	295	exportLoading.value = true
	296	const data = await DaPoint.exportDaPoint(queryParams)
813ce2	297	download.excel(data, '测点列表.xlsx')
031c25	298	} catch {
D	299	} finally {
	300	exportLoading.value = false
	301	}
	302	}
5d8c73	303
J	304	let dataListSelections = reactive([])
	305	// 多选
	306	function selectionChangeHandle (val) {
	307	dataListSelections = val
	308	}
	309	// 启用
	310	async function enable() {
	311	let ids = dataListSelections.map(item => {
	312	return item.id
	313	})
4d3aa7	314	// 二次确认
D	315	await message.confirm('确认要开启所选测点？')
5d8c73	316	await DaPoint.enable(ids)
J	317	message.success(t('common.enableSuccess'))
	318	await getList()
	319	}
	320	// 禁用
	321	async function disable(){
	322	let ids = dataListSelections.map(item => {
	323	return item.id
	324	})
4d3aa7	325	// 二次确认
D	326	await message.confirm('确认要禁用所选测点？')
5d8c73	327	await DaPoint.disable(ids)
J	328	message.success(t('common.disableSuccess'))
	329	await getList()
	330	}
	331
1c14d6	332	/ 初始化 /
L	333	onMounted(async () => {
	334	await getList()
	335	})
	336	</script>