ClientApps/pqs-9100_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

检测源

Browse Source
This commit is contained in:
sjl
2024-11-28 14:30:49 +08:00
parent 3c56eb2ba0
commit 6d34bcfde7
8 changed files with 395 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/api/device/interface/testScript.ts
View File

@@ -5,7 +5,7 @@ export namespace TestScript {
/**
* 电能质量指标字典数据表格分页查询参数
* 检测脚本表格分页查询参数
*/
export interface ReqTestScriptParams extends ReqPage{
id: string; // 装置序号id 必填
@@ -30,9 +30,9 @@ export namespace TestScript {
}
/**
* 被检设备表格查询分页返回的对象；
* 检测脚本查询分页返回的对象；
*/
export interface ResPqDevPage extends ResPage<ResTestScript> {
export interface ResTestScriptPage extends ResPage<ResTestScript> {
}
}

29
frontend/src/api/device/interface/testSource.ts
View File

@@ -1,20 +1,35 @@
import type { ReqPage } from '@/api/interface'
import type { ReqPage, ResPage } from '@/api/interface'
// 检测源模块
export namespace TestSource {
/**
* 检测脚本表格分页查询参数
*/
export interface ReqTestSourceParams extends ReqPage{
id: string; // 装置序号id 必填
name: string;
pattern: string;
}
// 检测源接口
export interface TestSourceBO {
id?: string; //检测源ID
name: string; //检测源名称
export interface ResTestSource {
id: string; //检测源ID
name: string; //检测源名称（检测源类型 + 设备类型 + 数字自动生成）
pattern: string;//检测源模式(字典表Code字段，数字、模拟、比对)
type: string; //检测源类型(字典表Code字段，标准源、高精度设备)
devType: string;//检测源设备类型(字典表Code字段)
parameters: string;//源参数（JSON字符串）
parameter?: string;//源参数（JSON字符串）
state:number;//
createBy?: string;
createTime?: string;
updateBy?: string;
updateTime?: string;
}
// 检测源+分页
export interface ReqTestSourceParams extends ReqPage,TestSourceBO {
/* 检测脚本查询分页返回的对象；
*/
export interface ResTestSourcePage extends ResPage<ResTestSource> {
}
}

25
frontend/src/api/device/testSource/index.ts
View File

@@ -5,8 +5,27 @@ import http from '@/api'
/**
* @name 检测源管理模块
*/
// 获取检测脚本列表
// 获取检测源列表
export const getTestSourceList = (params: TestSource.ReqTestSourceParams) => {
return http.post<ResPage<TestSource.TestSourceBO>>(`/testSource/list`, params)
// return http.post<ResPage<Role.ResRoleList>>(`${rePrefix}/testSource/list`, params)
return http.post(`/pqSource/list`, params)
}
//根据id查询检测源
export const getTestSourceById = (params: TestSource.ResTestSource) => {
return http.get(`/pqSource/getById?id=${params.id}`)
}
//添加检测源
export const addTestSource = (params: TestSource.ResTestSource) => {
return http.post(`/pqSource/add`, params)
}
//编辑检测源
export const updateTestSource = (params: TestSource.ResTestSource) => {
return http.post(`/pqSource/update`, params)
}
//删除检测源
export const deleteTestSource = (params: string[]) => {
return http.post(`/pqSource/delete`, params)
}

9
frontend/src/views/authority/resource/index.vue
View File

@@ -124,19 +124,20 @@
// 打开 drawer(新增、编辑)
const openDialog = (titleType: string, row: Partial<Function.ResFunction> = {}) => {
resourcePopup.value?.open(titleType, row)
}
// 删除用户信息
// 删除菜单信息
const handleDelete = async (params: Function.ResFunction) => {
await useHandleData(deleteFunction, params , `删除【${params.name}】用户`)
await useHandleData(deleteFunction, params , `删除【${params.name}】菜单`)
proTable.value?.getTableList()
}
// 批量删除用户信息
// 批量删除菜单信息
const batchDelete = async (id: string[]) => {
await useHandleData(deleteFunction, { id }, '删除所选用户信息')
await useHandleData(deleteFunction, { id }, '删除所选菜单信息')
proTable.value?.clearSelection()
proTable.value?.getTableList()
}

13
frontend/src/views/machine/testSource/components/parameterPopup.vue Normal file
View File

@@ -0,0 +1,13 @@
<template>
<div>
</div>
</template>
<script setup lang="ts">
</script>
<style scoped>
</style>

116
frontend/src/views/machine/testSource/components/parameterTable.vue Normal file
View File

@@ -0,0 +1,116 @@
<template>
<div class='table-box'>
<ProTable
ref='proTable'
:columns='columns'
:pagination="false"
:toolButton="false"
:data="tableData"
:row-key="id"
>
<!-- 表格 header 按钮 -->
<template #tableHeader='scope'>
<el-button v-auth.testSource="'add'" type='primary' :icon='CirclePlus' @click="openDialog('add')">新增</el-button>
<el-button v-auth.testSource="'batchDelete'" type='danger' :icon='Delete'
plain :disabled='!scope.isSelected' @click='batchDelete(scope.selectedListIds)'>
批量删除
</el-button>
</template>
<!-- 表格操作 -->
<template #operation='scope'>
<el-button type="primary" link :icon='CopyDocument' @click="copyRow(row)">复制</el-button>
<el-button type='primary' link :icon='EditPen' @click="openDialog('edit', scope.row)">编辑</el-button>
<el-button type='primary' link :icon='Delete' @click='handleDelete(scope.row)'>删除</el-button>
</template>
</ProTable>
</div>
<ParameterPopup :refresh-table='getTableList' ref='parameterPopup' />
</template>
<script setup lang='tsx' name='useRole'>
import { type TestSource } from '@/api/device/interface/testSource'
import { useHandleData } from '@/hooks/useHandleData'
import ProTable from '@/components/ProTable/index.vue'
import type{ ProTableInstance, ColumnProps } from '@/components/ProTable/interface'
import { CirclePlus, Delete, EditPen, Share, Download, Upload, View, Refresh,CopyDocument } from '@element-plus/icons-vue'
import { useDictStore } from '@/stores/modules/dict'
import ParameterPopup from '@/views/machine/testSource/components/parameterPopup.vue';
import { onMounted, reactive, ref, watch } from 'vue'
const parameterPopup = ref()
const dictStore = useDictStore()
// ProTable 实例
const proTable = ref<ProTableInstance>()
const tableData = ref<any[]>([])
const props = defineProps<{
data: TestSource.ResTestSource | null;
}>();
onMounted(() => {
getTableList();
})
watch(() => props.data, (newData) => {
if (newData) {
getTableList();
}
})
const getTableList = () => {
if (props.data) {
// 处理传递过来的数据
let newParams = props.data.parameter ? JSON.parse(props.data.parameter) : {};
// 确保 newParams 是一个数组
if (!Array.isArray(newParams)) {
newParams = [newParams];
}
const apiData = newParams;
tableData.value = apiData;
}
};
const columns = reactive<ColumnProps<any>[]>([
{ type: 'selection', fixed: 'left', width: 70 },
{ type: 'index', fixed: 'left', width: 70, label: '序号' },
{
prop: 'sourceParamType',
label: '参数类型',
minWidth: 180,
},
{
prop: 'sourceParamDesc',
label: '参数描述',
minWidth: 220,
},
{
prop: 'value',
label: '值',
minWidth: 150,
},
{ prop: 'operation', label: '操作', fixed: 'right', width: 250 },
])
// 打开 drawer(新增、编辑)
const openDialog = (titleType: string, row: Partial<TestSource.ResTestSource> = {}) => {
parameterPopup.value?.open(titleType)
}
// 批量删除设备
const batchDelete = async (id: string[]) => {
proTable.value?.clearSelection()
proTable.value?.getTableList()
}
// 删除设备
const handleDelete = async (params: TestSource.ResTestSource) => {
console.log(tableData.value )
tableData.value = tableData.value.filter(item => item.id !== params.id);
console.log(tableData.value )
}
</script>

167
frontend/src/views/machine/testSource/components/testSourcePopup.vue Normal file
View File

@@ -0,0 +1,167 @@
<template>
<el-dialog :title="dialogTitle" v-model='dialogVisible' @close="close" v-bind="dialogBig">
<div class="form-grid">
<el-form :model="formContent" ref='dialogFormRef' :rules='rules'>
<el-row :gutter="24" >
<el-col :span="8">
<el-form-item label="检测源名称" prop="name" :label-width="100">
<el-input v-model='formContent.name' placeholder="检测源类型+设备类型简称+数字"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="设备类型" prop="devType" :label-width="100">
<el-select v-model='formContent.devType' placeholder="请选择设备类型">
<el-option
v-for="item in dictStore.getDictData('PqSource_Dev_Type')"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="标准源" prop="type" :label-width="100">
<el-select v-model='formContent.type' placeholder="请选择检测源类型">
<el-option
v-for="item in dictStore.getDictData('Pq_Source_Type')"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<ParameterTable :data="formContent"/>
<template #footer>
<div >
<el-button @click='close()'>取 消</el-button>
<el-button type="primary" @click='save()'>保存</el-button>
</div>
</template>
</el-dialog>
</template>
<script lang="ts" setup name="ErrorSystemDialog">
import{ElMessage, type FormInstance,type FormItemRule}from'element-plus'
import { defineProps, defineEmits, reactive,watch,ref, Ref, computed } from 'vue';
import { dialogBig} from '@/utils/elementBind'
import { addTestSource,updateTestSource,getTestSourceById} from '@/api/device/testSource/index'
import {CirclePlus, Delete, EditPen,FolderOpened,CopyDocument} from '@element-plus/icons-vue'
import { useDictStore } from '@/stores/modules/dict'
import { type TestSource } from '@/api/device/interface/testSource';
import ParameterTable from '@/views/machine/testSource/components/parameterTable.vue';
// 定义弹出组件元信息
const dialogFormRef = ref()
const dictStore = useDictStore()
const mode = ref()
const modeId = ref()
function useMetaInfo() {
const dialogVisible = ref(false)
const titleType = ref('add')
const formContent = ref<TestSource.ResTestSource>({
id: '',
name: '',
pattern: modeId.value,
parameter:'',
type: '',
devType: '',
state:1,
})
return { dialogVisible, titleType, formContent }
}
const { dialogVisible, titleType, formContent } = useMetaInfo()
// 清空formContent
const resetFormContent = () => {
formContent.value = {
id: '',
name: '',
pattern: modeId.value,
parameter:'',
type: '',
devType: '',
state:1,
}
}
let dialogTitle = computed(() => {
return titleType.value === 'add' ? '新增检测源' : '编辑检测源'
})
// 定义规则
const rules: Ref<Record<string, Array<FormItemRule>>> = ref({
name: [{ required: true, message: '检测源名称必填！', trigger: 'blur' }],
devType:[{ required: true, message: '请选择一项设备类型', trigger: 'change' },],
type:[{ required: true, message: '请选择一项检测源类型', trigger: 'change '},]
});
// 关闭弹窗
const close = () => {
dialogVisible.value = false
// 清空dialogForm中的值
resetFormContent()
// 重置表单
dialogFormRef.value?.resetFields()
}
// 保存数据
const save = () => {
try {
dialogFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
if (formContent.value.id) {
await updateTestSource(formContent.value);
ElMessage.success({ message: `${dialogTitle.value}成功！` })
} else {
await addTestSource(formContent.value);
ElMessage.success({ message: `${dialogTitle.value}成功！` })
}
close()
// 刷新表格
await props.refreshTable!()
}
})
} catch (err) {
console.error('验证过程中出现错误', err)
}
}
// 打开弹窗，可能是新增，也可能是编辑
const open = async (sign: string, data: TestSource.ResTestSource,currentMode: string) => {
titleType.value = sign
dialogVisible.value = true
mode.value = currentMode
modeId.value = dictStore.getDictData('Pattern').find(item => item.name === currentMode)?.id;
if (data.id) {
const result = await getTestSourceById(data);
if (result && result.data) {
formContent.value = result.data as TestSource.ResTestSource;
}
} else {
resetFormContent()
}
// 重置表单
dialogFormRef.value?.resetFields()
}
// 对外映射
defineExpose({ open })
const props = defineProps<{
refreshTable: (() => Promise<void>) | undefined;
}>()
</script>
<style>
</style>

58
frontend/src/views/machine/testSource/index.vue
View File

@@ -8,21 +8,21 @@
<!-- :data='testSourceData' 如果要显示静态数据，就切换该配置-->
<!-- 表格 header 按钮 -->
<template #tableHeader='scope'>
<el-button type='primary' :icon='CirclePlus' >新增</el-button>
<el-button type='primary' :icon='Download' plain >导出数据</el-button>
<el-button type='danger' :icon='Delete' plain :disabled='!scope.isSelected'>
<el-button v-auth.testSource="'add'" type='primary' :icon='CirclePlus' @click="openDialog('add')">新增</el-button>
<el-button v-auth.testSource="'batchDelete'" type='danger' :icon='Delete'
plain :disabled='!scope.isSelected' @click='batchDelete(scope.selectedListIds)'>
批量删除
</el-button>
</template>
<!-- 表格操作 -->
<template #operation='scope'>
<el-button type='primary' link :icon='View' >查看</el-button>
<el-button type='primary' link :icon='EditPen' >编辑</el-button>
<el-button type='primary' link :icon='Delete' >删除</el-button>
<el-button v-auth.testSource="'edit'" type='primary' link :icon='EditPen' @click="openDialog('edit', scope.row)">编辑</el-button>
<el-button v-auth.testSource="'delete'" type='primary' link :icon='Delete' @click='handleDelete(scope.row)'>删除</el-button>
</template>
</ProTable>
</div>
<TestSourcePopup :refresh-table='proTable?.getTableList' ref='testSourcePopup' />
</template>
@@ -33,23 +33,30 @@
import { useAuthButtons } from '@/hooks/useAuthButtons'
import ProTable from '@/components/ProTable/index.vue'
import ImportExcel from '@/components/ImportExcel/index.vue'
import { ProTableInstance, ColumnProps } from '@/components/ProTable/interface'
import type{ ProTableInstance, ColumnProps } from '@/components/ProTable/interface'
import { CirclePlus, Delete, EditPen, Share, Download, Upload, View, Refresh } from '@element-plus/icons-vue'
import { useDictStore } from '@/stores/modules/dict'
import TestSourcePopup from './components/testSourcePopup.vue'
import {
getTestSourceList,
getTestSourceList,deleteTestSource,
} from '@/api/device/testSource/index'
import { reactive, ref } from 'vue'
import { useModeStore } from '@/stores/modules/mode'; // 引入模式 store
const testSourcePopup = ref()
const dictStore = useDictStore()
// const testSourceData = testSourceDataList
const modeStore = useModeStore();
// ProTable 实例
const proTable = ref<ProTableInstance>()
const getTableList = (params: any) => {
let newParams = JSON.parse(JSON.stringify(params))
const patternId = dictStore.getDictData('Pattern').find(item=>item.name=== modeStore.currentMode)?.id//获取数据字典中对应的id
newParams.pattern = patternId
return getTestSourceList(newParams)
}
// 表格配置项
const columns = reactive<ColumnProps<TestSource.TestSourceBO>[]>([
const columns = reactive<ColumnProps<TestSource.ResTestSource>[]>([
{ type: 'selection', fixed: 'left', width: 70 },
{ type: 'index', fixed: 'left', width: 70, label: '序号' },
{
@@ -61,16 +68,16 @@ import { reactive, ref } from 'vue'
{
prop: 'devType',
label: '设备类型',
enum: dictStore.getDictData('testSourceDevType'),
fieldNames: { label: 'label', value: 'id' },
enum: dictStore.getDictData('PqSource_Dev_Type'),
fieldNames: { label: 'name', value: 'id' },
search: { el: 'select' },
minWidth: 220,
},
{
prop: 'type',
label: '源类型',
enum: dictStore.getDictData('testSourceType'),
fieldNames: { label: 'label', value: 'id' },
enum: dictStore.getDictData('Pq_Source_Type'),
fieldNames: { label: 'name', value: 'id' },
search: { el: 'select' },
minWidth: 150,
},
@@ -78,5 +85,24 @@ import { reactive, ref } from 'vue'
])
// 打开 drawer(新增、编辑)
const openDialog = (titleType: string, row: Partial<TestSource.ResTestSource> = {}) => {
testSourcePopup.value?.open(titleType, row,modeStore.currentMode)
}
// 批量删除设备
const batchDelete = async (id: string[]) => {
await useHandleData(deleteTestSource, id, '删除所选检测源')
proTable.value?.clearSelection()
proTable.value?.getTableList()
}
// 删除设备
const handleDelete = async (params: TestSource.ResTestSource) => {
await useHandleData(deleteTestSource, [params.id], `删除【${params.name}】检测源`)
proTable.value?.getTableList()
}
</script>