iailab-plat-ui-vue3.git

Jay

2025-02-07 c889d896c6bfedcf6c7eb62807d0309192ca4d8d

提交 \| 用户 \| 时间
c62768	1	<template>
c889d8	2	<el-row :gutter="20">
J	3	<el-col :span="3" :xs="24">
	4	<ContentWrap class="h-1/1">
	5	<el-tree
	6	style="max-width: 600px"
	7	:data="dataCategoryList"
	8	:props="treeProps"
	9	default-expand-all
	10	highlight-current
	11	@node-click="handleNodeClick"
	12	/>
	13	</ContentWrap>
	14	</el-col>
	15	<el-col :span="21" :xs="24">
	16	<!-- 搜索工作栏 -->
	17	<ContentWrap>
	18	<el-form ref="queryFormRef" :inline="true" :model="queryParams" class="-mb-15px"
	19	label-width="68px">
	20	<el-form-item label="指标编码" prop="itemNo">
	21	<el-input v-model="queryParams.itemNo" class="!w-200px" clearable placeholder="请输入指标编码"
	22	@keyup.enter="handleQuery"/>
	23	</el-form-item>
	24	<el-form-item label="指标名称" prop="itemName">
	25	<el-input v-model="queryParams.itemName" class="!w-200px" clearable placeholder="请输入指标名称"
	26	@keyup.enter="handleQuery"/>
	27	</el-form-item>
	28	<el-form-item label="指标类型" prop="itemType">
	29	<el-select v-model="queryParams.itemType" class="!w-200px" clearable placeholder="请选择指标类型">
	30	<el-option
	31	v-for="dict in getStrDictOptions(DICT_TYPE.IND_ITEM_TYPE)"
	32	:key="dict.value"
	33	:label="dict.label"
	34	:value="dict.value"
	35	/>
	36	</el-select>
	37	</el-form-item>
	38	<el-form-item>
	39	<el-button @click="handleQuery">
	40	<Icon class="mr-5px" icon="ep:search"/>
	41	搜索
	42	</el-button>
	43	<el-button @click="resetQuery">
	44	<Icon class="mr-5px" icon="ep:refresh"/>
	45	重置
	46	</el-button>
	47	<el-button
	48	v-hasPermi="['data:ind-item:create']"
	49	plain
	50	type="primary"
	51	@click="openForm('create')"
	52	>
	53	<Icon class="mr-5px" icon="ep:plus"/>
	54	新增
	55	</el-button>
	56	</el-form-item>
	57	</el-form>
	58	</ContentWrap>
c62768	59
c889d8	60	<!-- 列表 -->
J	61	<ContentWrap>
	62	<el-table v-loading="loading" :data="list">
	63	<el-table-column prop="itemNo" label="指标编码" header-align="center" align="center" min-width="70"/>
	64	<el-table-column prop="itemName" label="指标名称" header-align="center" align="center" min-width="150"/>
	65	<el-table-column prop="itemCategoryName" label="指标分类" header-align="center" align="center" min-width="80"/>
	66	<el-table-column prop="itemType" label="指标类型" header-align="center" align="center" min-width="60">
	67	<template #default="scope">
	68	<dict-tag :type="DICT_TYPE.IND_ITEM_TYPE" :value="scope.row.itemType" />
	69	</template>
	70	</el-table-column>
	71	<el-table-column prop="coefficient" label="系数" header-align="center" align="center" min-width="50"/>
	72	<el-table-column prop="precision" label="指标精度" header-align="center" align="center" min-width="50"/>
	73	<el-table-column prop="timeGranularity" label="时间粒度" header-align="center" align="center" min-width="50">
	74	<template #default="scope">
	75	<dict-tag :type="DICT_TYPE.TIME_GRANULARITY" :value="scope.row.timeGranularity" />
	76	</template>
	77	</el-table-column>
	78	<el-table-column
	79	:formatter="dateFormatter"
	80	align="center"
	81	label="创建时间"
	82	prop="createTime"
	83	width="200"/>
	84	<el-table-column align="center" label="操作">
	85	<template #default="scope">
	86	<el-button
	87	v-hasPermi="['data:ind-item:update']"
	88	link
	89	type="primary"
	90	@click="openForm('update', scope.row)">
	91	修改
	92	</el-button>
	93	<el-button
	94	v-hasPermi="['data:ind-item:update']"
	95	link
	96	type="primary"
	97	@click="getCurrentData(scope.row.itemNo)">
	98	当前值
	99	</el-button>
	100	<el-button
	101	v-hasPermi="['data:ind-item:delete']"
	102	link
	103	type="danger"
	104	@click="handleDelete(scope.row.id)">
	105	删除
	106	</el-button>
	107	</template>
	108	</el-table-column>
	109	</el-table>
	110	<!-- 分页 -->
	111	<Pagination
	112	v-model:limit="queryParams.pageSize"
	113	v-model:page="queryParams.pageNo"
	114	:total="total"
	115	@pagination="getList"
	116	/>
	117	</ContentWrap>
	118	</el-col>
	119	</el-row>
	120
c62768	121
J	122	<!-- 表单弹窗：添加/修改 -->
	123	<AtomIndDefineForm ref="atomFormRef" @success="getList" />
	124	<DerIndDefineForm ref="derFormRef" @success="getList" />
	125	<CalIndDefineForm ref="calFormRef" @success="getList" />
	126	<SelectItemType ref="itemTypeSel"/>
c889d8	127	<IndCurrentData ref="indCurrentData" />
c62768	128	</template>
J	129
	130	<script lang="ts" setup>
2e092f	131	import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
c62768	132	import { dateFormatter } from '@/utils/formatTime'
J	133	import * as DataSetApi from '@/api/data/ind/data/data.set'
	134	import AtomIndDefineForm from './AtomIndDefineForm.vue'
	135	import DerIndDefineForm from './DerIndDefineForm.vue'
	136	import CalIndDefineForm from './CalIndDefineForm.vue'
	137	import SelectItemType from './selectItemType.vue'
	138	import download from '@/utils/download'
	139	import * as ItemApi from '@/api/data/ind/item/item'
	140	import * as CategoryApi from "@/api/data/ind/category";
c889d8	141	import IndCurrentData from './IndCurrentData.vue'
J	142	import {handleTree} from "@/utils/tree";
	143
c62768	144
9e6ba7	145	defineOptions({ name: 'IndItem' })
c62768	146
J	147	const message = useMessage() // 消息弹窗
	148	const { t } = useI18n() // 国际化
	149	const dataCategoryList = ref([] as CategoryApi.IndItemCategoryVO[])
	150	const loading = ref(true) // 列表的加载中
	151	const total = ref(0) // 列表的总页数
	152	const list = ref([]) // 字典表格数据
	153	const queryParams = reactive({
	154	pageNo: 1,
	155	pageSize: 10,
	156	itemNo: '',
	157	itemName: '',
	158	itemType: '',
	159	itemCategory: ''
	160	})
	161	const queryFormRef = ref() // 搜索的表单
	162	const exportLoading = ref(false) // 导出的加载中
	163
	164	/** 查询字典类型列表 */
	165	const getList = async () => {
	166	loading.value = true
	167	try {
	168	const data = await ItemApi.getItemPage(queryParams)
	169	list.value = data.list
	170	total.value = data.total
	171	} finally {
	172	loading.value = false
	173	}
c889d8	174	}
J	175
	176	const getCategoryTree = async () => {
	177	dataCategoryList.value = []
	178	const res = await CategoryApi.getCategoryListAllSimple()
	179	let category: Tree = {id: 0, label: '主类目', children: []}
	180	category.children = handleTree(res, 'id', 'pid')
	181	dataCategoryList.value.push(category)
c62768	182	}
J	183
	184	/** 搜索按钮操作 */
	185	const handleQuery = () => {
	186	queryParams.pageNo = 1
	187	getList()
	188	}
	189
	190	/** 重置按钮操作 */
	191	const resetQuery = () => {
	192	queryFormRef.value.resetFields()
	193	handleQuery()
	194	}
	195
	196	/** 添加/修改操作 */
	197	const atomFormRef = ref()
	198	const derFormRef = ref()
	199	const calFormRef = ref()
	200	const itemTypeSel = ref()
	201
	202	const openForm = (type: string, row) => {
	203	if(row !== null && row !==undefined){
	204	if(row.itemType === 'ATOM'){
	205	if (row.id){
	206	atomFormRef.value.open(type,row.id)
	207	}
	208	}else if(row.itemType === 'CAL'){
	209	if (row.id){
	210	calFormRef.value.open(type,row.id)
	211	}
	212	}else if(row.itemType === 'DER'){
	213	if (row.id){
	214	derFormRef.value.open(type,row.id)
	215	}
	216	}
	217	}else {
	218	itemTypeSel.value.open(type)
	219	}
c889d8	220	}
J	221	const indCurrentData = ref()
c62768	222
c889d8	223	const getCurrentData = (itemNo: string) => {
J	224	indCurrentData.value.open(itemNo)
c62768	225	}
J	226
	227	/** 删除按钮操作 */
	228	const handleDelete = async (id: number) => {
	229	try {
	230	// 删除的二次确认
	231	await message.delConfirm()
	232	// 发起删除
	233	await ItemApi.deleteItem(id)
	234	message.success(t('common.delSuccess'))
	235	// 刷新列表
	236	await getList()
	237	} catch {}
	238	}
	239
c889d8	240	const handleNodeClick = (data: Tree) => {
J	241	if( data.id !== 0 ){
	242	queryParams.itemCategory = String(data.id)
	243	}else {
	244	queryParams.itemCategory = ''
	245	}
	246	getList()
	247	}
	248
c62768	249	/ 初始化 /
J	250	onMounted(() => {
	251	getList()
c889d8	252	getCategoryTree()
c62768	253	})
J	254	</script>