49 lines
1.4 KiB
Vue
49 lines
1.4 KiB
Vue
<!--通道号-->
|
||
<template>
|
||
<div>
|
||
<el-row>
|
||
<span>说明:“通道号”又称“接口代号”,是指仪器向电脑传送结果时项目的标识符,接口代号对于一个仪器不可重复。</span>
|
||
</el-row>
|
||
<div class="modifyClass">
|
||
<el-button type="primary" @click="">增加</el-button>
|
||
<el-button type="primary" @click="">删除</el-button>
|
||
</div>
|
||
<CustomTable ref="tableRef" :data="dataList" :columns="columns" :enable-column-drag="true" @column-drag-end="handleColumnDragEnd"
|
||
:config="tableConfig"/>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { ref } from 'vue';
|
||
import CustomTable from '@/components/elTable/index.vue'
|
||
|
||
const props = defineProps({
|
||
// 是否显示
|
||
visible: {
|
||
type: Boolean,
|
||
required: true,
|
||
default: false
|
||
}
|
||
});
|
||
|
||
const tableRef = ref<any>(null);
|
||
const dataList = ref();
|
||
const columns = ref([
|
||
{ prop: 'tdh', label: '通道号', visible: true, align: 'center', width: 100 },
|
||
{ prop: 'yq', label: '仪器', visible: true, align: 'center', width: 200 },
|
||
{ prop: 'xmdh', label: '英文缩写', visible: true, align: 'center', width: 200 }
|
||
]);
|
||
const tableConfig = ref({
|
||
border: true, // 边框
|
||
height: '76vh', // 高度
|
||
highlightCurrentRow: true, // 高亮当前行
|
||
// cellStyle: cellStyleHd
|
||
})
|
||
|
||
|
||
//退拽属性
|
||
const handleColumnDragEnd = (data: any) => {
|
||
// 更新列配置
|
||
columns.value = data.columns;
|
||
}
|
||
</script> |