115 lines
4.3 KiB
Vue
115 lines
4.3 KiB
Vue
<template>
|
||
<div class='table-box'>
|
||
<ProTable
|
||
ref='proTable'
|
||
:columns='columns'
|
||
:request-api="getTableList"
|
||
>
|
||
<!-- :data='testSourceData' 如果要显示静态数据，就切换该配置-->
|
||
<!-- 表格 header 按钮 -->
|
||
<template #tableHeader='scope'>
|
||
<el-button v-auth.testSource="'add'" type='primary' :icon='CirclePlus' @click="openDialog('add')">新增</el-button>
|
||
<el-button v-auth.testSource="'delete'" type='danger' :icon='Delete'
|
||
plain :disabled='!scope.isSelected' @click='batchDelete(scope.selectedListIds)'>
|
||
删除
|
||
</el-button>
|
||
</template>
|
||
<!-- 表格操作 -->
|
||
<template #operation='scope'>
|
||
<el-button v-auth.testSource="'view'" type='primary' link :icon='View' @click="openDialog('view', scope.row)">查看</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>
|
||
|
||
<script setup lang='tsx' name='useRole'>
|
||
import { type TestSource } from '@/api/device/interface/testSource'
|
||
import { useHandleData } from '@/hooks/useHandleData'
|
||
import { useDownload } from '@/hooks/useDownload'
|
||
import { useAuthButtons } from '@/hooks/useAuthButtons'
|
||
import ProTable from '@/components/ProTable/index.vue'
|
||
import ImportExcel from '@/components/ImportExcel/index.vue'
|
||
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,deleteTestSource,
|
||
} from '@/api/device/testSource/index'
|
||
import { reactive, ref } from 'vue'
|
||
import { useModeStore } from '@/stores/modules/mode'; // 引入模式 store
|
||
defineOptions({
|
||
name: 'testSource'
|
||
})
|
||
const testSourcePopup = ref()
|
||
const dictStore = useDictStore()
|
||
const modeStore = useModeStore();
|
||
// ProTable 实例
|
||
const proTable = ref<ProTableInstance>()
|
||
|
||
const getTableList = (params: any) => {
|
||
console.log("getTableList",params)
|
||
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.ResTestSource>[]>([
|
||
{ type: 'selection', fixed: 'left', width: 70 ,
|
||
},
|
||
{ type: 'index', fixed: 'left', width: 70, label: '序号' },
|
||
{
|
||
prop: 'name',
|
||
label: '名称',
|
||
search: { el: 'input' },
|
||
minWidth: 300,
|
||
},
|
||
{
|
||
prop: 'devType',
|
||
label: '设备类型',
|
||
enum: dictStore.getDictData('S_Dev_Type_'+dictStore.getDictData('Pattern').find(item=>item.name=== modeStore.currentMode)?.code),
|
||
fieldNames: { label: 'name', value: 'id' },
|
||
search: { el: 'select' },
|
||
minWidth: 250,
|
||
},
|
||
{
|
||
prop: 'type',
|
||
label: '检测源类型',
|
||
enum: dictStore.getDictData('Pq_Source_Type'),
|
||
fieldNames: { label: 'name', value: 'id' },
|
||
search: { el: 'select' },
|
||
minWidth: 150,
|
||
},
|
||
{ prop: 'operation', label: '操作', fixed: 'right', width: 250 },
|
||
])
|
||
|
||
|
||
// 打开 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>
|
||
|