133 lines
4.1 KiB
Vue
133 lines
4.1 KiB
Vue
<template>
|
|
<div class='table-box'>
|
|
<ProTable
|
|
ref='proTable'
|
|
:columns='columns'
|
|
:data='errorData'
|
|
type='selection'
|
|
>
|
|
<!-- 表格 header 按钮 -->
|
|
<template #tableHeader>
|
|
<el-button type='primary' :icon='CirclePlus' @click="openAddDialog">新增误差体系</el-button>
|
|
<el-button type='danger' :icon='Delete' plain
|
|
>
|
|
批量删除误差体系
|
|
</el-button>
|
|
</template>
|
|
<!-- 表格操作 -->
|
|
<template #operation='scope'>
|
|
<el-button type='primary' link :icon='View' @click="handleRowClick(scope.row)">查看</el-button>
|
|
<el-button type='primary' link :icon='EditPen' @click="openEditDialog(scope.row)">编辑</el-button>
|
|
<el-button type='primary' link :icon='Delete' >删除</el-button>
|
|
</template>
|
|
</ProTable>
|
|
|
|
<!-- 新增/编辑误差体系对话框 -->
|
|
<ErrorSystemDialog
|
|
:visible="dialogFormVisible"
|
|
:formData="dialogForm"
|
|
:dialogTitle="dialogTitle"
|
|
@update:visible="dialogFormVisible = $event"
|
|
/>
|
|
|
|
<!-- 查看误差体系详细信息 -->
|
|
<ErrorStandardDialog
|
|
:visible="detail_dialogFormVisible"
|
|
:formData="detail_dialogForm"
|
|
:dialogTitle="detail_dialogTitle"
|
|
@update:visible="detail_dialogFormVisible = $event"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts" name='useProTable'>
|
|
import ProTable from '@/components/ProTable/index.vue'
|
|
import type { ColumnProps } from '@/components/ProTable/interface'
|
|
import { CirclePlus, Delete,EditPen,View} from '@element-plus/icons-vue'
|
|
import errorDataList from '@/api/error/errorData'
|
|
import { reactive,ref } from 'vue'
|
|
import type { ErrorSystem } from '@/api/error/interface'
|
|
import ErrorSystemDialog from "@/views/machine/errorSystem/components/ErrorSystemDialog.vue"; // 导入子组件
|
|
import ErrorStandardDialog from "@/views/machine/errorSystem/components/ErrorStandardDialog.vue"; // 导入子组件
|
|
let multipleSelection = ref<string[]>([])
|
|
const errorData = errorDataList.errordata
|
|
const dialogFormVisible = ref(false)
|
|
const dialogTitle = ref('新增误差体系')
|
|
const dialogForm = ref<ErrorSystem.ErrorSystemList>({
|
|
id: '',
|
|
name: '',
|
|
publishTime: '',
|
|
year:'',
|
|
level:'',
|
|
state: '',
|
|
});
|
|
|
|
|
|
|
|
const detail_dialogFormVisible = ref(false)
|
|
const detail_dialogTitle = ref('Q/GDW 10650.2-2021 误差体系')
|
|
const detail_dialogForm = ref<ErrorSystem.ErrorSystemDetail>({
|
|
measured: '',//被测量
|
|
deviceLevel: '',//检测装置级别
|
|
condition: '',//测量条件
|
|
maxErrorValue: '',//最大误差
|
|
});
|
|
|
|
// 表格配置项
|
|
const columns = reactive<ColumnProps<ErrorSystem.ErrorSystemList>[]>([
|
|
{ type: 'selection', fixed: 'left', width: 50 },
|
|
{
|
|
prop: 'id',
|
|
label: '序号',
|
|
width: 100,
|
|
},
|
|
{
|
|
prop: 'name',
|
|
label: '误差体系名称',
|
|
width: 300,
|
|
},
|
|
{
|
|
prop: 'year',
|
|
label: '标准实施年份',
|
|
search: { el: 'input' },
|
|
},
|
|
|
|
{
|
|
prop: 'level',
|
|
label: '适用设备等级',
|
|
search: { el: 'select', props: { filterable: true } },
|
|
},
|
|
{ prop: 'operation', label: '操作', fixed: 'right' },
|
|
])
|
|
|
|
// 打开编辑对话框
|
|
const openEditDialog = (errorSystem: ErrorSystem.ErrorSystemList) => {
|
|
errorSystem.publishTime ='2024'
|
|
errorSystem.state = '启用';
|
|
dialogForm.value = {...errorSystem};
|
|
dialogTitle.value = '编辑误差体系';
|
|
dialogFormVisible.value = true; // 打开对话框
|
|
};
|
|
|
|
const openAddDialog = () => {
|
|
dialogForm.value = {
|
|
id: '',
|
|
name: '',
|
|
publishTime: '',
|
|
year: '',
|
|
level: '',
|
|
state: '',
|
|
};
|
|
dialogTitle.value = '新增误差体系';
|
|
dialogFormVisible.value = true; // 打开对话框
|
|
};
|
|
|
|
const handleRowClick = (errorSystem: ErrorSystem.ErrorSystemList) =>{
|
|
detail_dialogTitle.value = errorSystem.name;
|
|
detail_dialogFormVisible.value = true; // 显示对话框
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style> |