iailab-plat-ui-vue3.git

潘志宝

2024-10-31 13c97d76348b5451381320aa54efa0706f38ecb6

提交 \| 用户 \| 时间
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"
	17	class="!w-240px"
	18	/>
	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"
	26	class="!w-240px"
	27	/>
	28	</el-form-item>
e9d8f9	29	<el-form-item label="测点Tag" prop="tagNo">
潘	30	<el-input
	31	v-model="queryParams.tagNo"
	32	placeholder="请输入测点Tag"
	33	clearable
	34	@keyup.enter="handleQuery"
	35	class="!w-240px"
	36	/>
	37	</el-form-item>
1c14d6	38	<el-form-item>
L	39	<el-button @click="handleQuery">
	40	<Icon icon="ep:search" class="mr-5px" />
	41	搜索
	42	</el-button>
	43	<el-button @click="resetQuery">
	44	<Icon icon="ep:refresh" class="mr-5px" />
	45	重置
	46	</el-button>
	47	<el-button
	48	type="primary"
	49	plain
	50	@click="openForm('create')"
85c27f	51	v-hasPermi="['data:point:create']"
1c14d6	52	>
L	53	<Icon icon="ep:plus" class="mr-5px" />
	54	新增
	55	</el-button>
031c25	56	<el-button
D	57	type="warning"
	58	plain
	59	@click="handleImport"
	60	v-hasPermi="['data:point:import']"
	61	>
	62	<Icon icon="ep:upload" /> 导入
	63	</el-button>
	64	<el-button
	65	type="success"
	66	plain
	67	@click="handleExport"
	68	:loading="exportLoading"
	69	v-hasPermi="['data:point:export']"
	70	>
	71	<Icon icon="ep:download" />导出
	72	</el-button>
1c14d6	73	</el-form-item>
L	74	</el-form>
	75	</ContentWrap>
	76
	77	<!-- 列表 -->
	78	<ContentWrap>
660c92	79	<el-table border stripe v-loading="loading" :data="list">
c4b4d2	80	<el-table-column fixed label="测点编码" header-align="center" align="left" min-width="120" prop="pointNo" />
e9d8f9	81	<el-table-column label="测点名称" header-align="center" align="left" min-width="200" prop="pointName" />
潘	82	<el-table-column label="测点类型" align="center" prop="pointType" width="100">
	83	<template #default="scope">
	84	<dict-tag :type="DICT_TYPE.DATA_POINT_TYPE" :value="scope.row.pointType" />
	85	</template>
	86	</el-table-column>
	87	<el-table-column label="数据类型" align="center" prop="dataType" width="100">
	88	<template #default="scope">
	89	<dict-tag :type="DICT_TYPE.POINT_DATA_TYPE" :value="scope.row.dataType" />
15a226	90	</template>
L	91	</el-table-column>
	92	<el-table-column label="值类型" align="center" prop="valueType" width="120">
	93	<template #default="scope">
	94	<dict-tag :type="DICT_TYPE.VALUETYPE" :value="scope.row.valueType" />
e9d8f9	95	</template>
潘	96	</el-table-column>
c4b4d2	97	<el-table-column label="测量单位" align="center" prop="unit" width="80"/>
1c14d6	98	<el-table-column label="单位转换" align="center" prop="unittransfactor" />
c4b4d2	99	<el-table-column label="默认值" align="center" prop="defaultValue" width="100"/>
e9d8f9	100	<el-table-column label="采集频率" align="center" prop="minfreqid" width="100"/>
c4b4d2	101	<el-table-column label="数据源类型" align="center" prop="sourceType" min-width="100"/>
潘	102	<el-table-column label="数据源名称" align="center" prop="sourceName" min-width="100"/>
e9d8f9	103	<el-table-column label="测点Tag" header-align="center" align="left" prop="tagNo" min-width="150"/>
潘	104	<el-table-column label="是否启用" align="center" prop="isEnable" width="100">
85c27f	105	<template #default="scope">
潘	106	<el-tag v-if="scope.row.isEnable === 1" size="small">是</el-tag>
	107	<el-tag v-else size="small" type="danger">否</el-tag>
	108	</template>
	109	</el-table-column>
1c14d6	110
c4b4d2	111	<el-table-column label="操作" align="center" min-width="130" fixed="right" width="160">
1c14d6	112	<template #default="scope">
L	113	<el-button
	114	link
c4b4d2	115	size="mini"
1c14d6	116	type="primary"
L	117	@click="openForm('update', scope.row.id)"
85c27f	118	v-hasPermi="['data:point:update']"
1c14d6	119	>
L	120	编辑
	121	</el-button>
c4b4d2	122	<el-button link size="mini" type="primary" @click="chartHandle(scope.row)">数据</el-button>
1c14d6	123	<el-button
L	124	link
c4b4d2	125	size="mini"
1c14d6	126	type="danger"
L	127	@click="handleDelete(scope.row.id)"
85c27f	128	v-hasPermi="['data:point:delete']"
1c14d6	129	>
L	130	删除
	131	</el-button>
	132	</template>
	133	</el-table-column>
	134	</el-table>
	135	<!-- 分页 -->
	136	<Pagination
	137	:total="total"
	138	v-model:page="queryParams.pageNo"
	139	v-model:limit="queryParams.pageSize"
	140	@pagination="getList"
	141	/>
	142	</ContentWrap>
	143
	144	<!-- 表单弹窗：添加/修改 -->
	145	<DaPointForm ref="formRef" @success="getList" />
	146
031c25	147	<DaPointChart ref="chartView" />
D	148
	149	<!-- 用户导入对话框 -->
	150	<PointImportForm ref="importFormRef" @success="getList" />
1c14d6	151	</template>
L	152	<script lang="ts" setup>
	153	import * as DaPoint from '@/api/data/da/point'
031c25	154	import {ref} from "vue";
D	155	import download from "@/utils/download";
	156	import {DICT_TYPE, getDictOptions} from "@/utils/dict";
	157	import DaPointForm from './DaPointForm.vue'
	158	import DaPointChart from './DaPointChart.vue'
	159	import * as UserApi from "@/api/system/user";
1c14d6	160
85c27f	161	defineOptions({name: 'DataPoint'})
1c14d6	162
L	163	const message = useMessage() // 消息弹窗
	164	const {t} = useI18n() // 国际化
	165
	166	const loading = ref(true) // 列表的加载中
	167	const total = ref(0) // 列表的总页数
	168	const list = ref([]) // 列表的数据
	169	const queryParams = reactive({
	170	pageNo: 1,
	171	pageSize: 10,
	172	pointNo: undefined,
	173	pointName: undefined,
e9d8f9	174	tagNo: undefined,
1c14d6	175	})
L	176	const queryFormRef = ref() // 搜索的表单
	177
	178	/** 查询列表 */
	179	const getList = async () => {
	180	loading.value = true
	181	try {
	182	const page = await DaPoint.getDaPointPage(queryParams)
	183	list.value = page.list
	184	total.value = page.total
	185	} finally {
	186	loading.value = false
	187	}
	188	}
	189
	190	/** 搜索按钮操作 */
	191	const handleQuery = () => {
	192	queryParams.pageNo = 1
	193	getList()
031c25	194	}
D	195
	196	/** 查看数据操作 */
	197	const chartView = ref()
	198	const chartHandle = (raw: object) => {
	199	chartView.value.open(raw)
1c14d6	200	}
L	201
	202	/** 重置按钮操作 */
	203	const resetQuery = () => {
	204	queryFormRef.value.resetFields()
	205	handleQuery()
	206	}
	207
	208	/** 添加/修改操作 */
	209	const formRef = ref()
	210	const openForm = (type: string, id?: number) => {
	211	formRef.value.open(type, id)
	212	}
	213
	214	/** 删除按钮操作 */
	215	const handleDelete = async (id: number) => {
	216	try {
	217	// 删除的二次确认
	218	await message.delConfirm()
	219	// 发起删除
	220	await DaPoint.deleteDaPoint(id)
	221	message.success(t('common.delSuccess'))
	222	// 刷新列表
	223	await getList()
	224	} catch {
	225	}
	226	}
031c25	227	/** 测点导入 */
D	228	const importFormRef = ref()
	229	const handleImport = () => {
	230	importFormRef.value.open()
	231	}
1c14d6	232
031c25	233	/** 导出按钮操作 */
D	234	const exportLoading = ref(false)
	235	const handleExport = async () => {
	236	try {
	237	// 导出的二次确认
	238	await message.exportConfirm()
	239	// 发起导出
	240	exportLoading.value = true
	241	const data = await DaPoint.exportDaPoint(queryParams)
813ce2	242	download.excel(data, '测点列表.xlsx')
031c25	243	} catch {
D	244	} finally {
	245	exportLoading.value = false
	246	}
	247	}
1c14d6	248	/ 初始化 /
L	249	onMounted(async () => {
	250	await getList()
	251	})
	252	</script>