<!-- @format --> <template> <span @click="editEnum()" style="color: #37abc4; cursor: pointer"> {{ configValue.expectedValue ? configValue.expectedValue : '-' }} </span> <a-modal v-model:visible="visible" title="选择" @ok="handleOk" :mask="false" style="top: 20px"> <a-table :row-selection="rowSelection" :columns="modalColumns" :data-source="tableData" :pagination="false" rowKey="value" /> </a-modal> </template> <script lang="ts"> import { defineComponent, ref } from 'vue'; export interface EnumData { dataType: string; name: string; value: number | string; } export default defineComponent({ props: { configValue: { type: Object, }, // enumTableConfig: { // type: Object, // }, index: { type: Number, }, listKey: { type: String, }, }, emits: ['changeEnum', 'blur'], setup(props, ctx) { // console.log(props.configValue); const visible = ref<Boolean>(false); let tableData = ref([]); let choseData = ref(); //枚举弹窗表格-列配置 const modalColumns = [ { title: '功能项', dataIndex: 'name', }, { title: '描述', dataIndex: 'value', }, ]; //编辑-选择弹窗 const editEnum = () => { tableData.value = props.configValue.childSpecsDTOList ? props.configValue.childSpecsDTOList : props.configValue.list; rowSelection.value.selectedRowKeys = [Number(props.configValue.expectedValue)]; visible.value = true; }; //关闭选择弹窗 const handleOk = (e: MouseEvent) => { visible.value = false; let value = { configValue: choseData.value, index: props.index, key: props.listKey, }; ctx.emit('changeEnum', value); }; //选择弹窗-单选数据 const rowSelection = ref({ type: 'radio', selectedRowKeys: [], // getCheckboxProps(record) { // return { // defaultChecked: record.value == props.configValue.expectedValue, // 配置默认勾选的列 // }; // }, // selectedRowKeys:getConfig.value[index1.value].getBindValues[index2.value - 1] onChange: (selectedRowKeys, selectedRows: EnumData[]) => { rowSelection.value.selectedRowKeys = selectedRowKeys; choseData.value = selectedRows[0].value; }, }); return { editEnum, handleOk, visible, modalColumns, tableData, rowSelection, }; }, }); </script> <style scoped></style>