105 lines
3.6 KiB
Vue
105 lines
3.6 KiB
Vue
<template>
|
|
<BasicModal v-bind="$attrs" @register="registerModal" width="60%" :title="getTitle" @ok="handleSubmit" @cancel="handleCancel"
|
|
@visible-change="handleVisibleChange" >
|
|
<BasicTable @register="registerTable" class="downloadPointModal"></BasicTable>
|
|
</BasicModal>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
import { ref, computed, unref, nextTick } from 'vue';
|
|
import { BasicModal, useModalInner, useModal } from '/@/components/Modal';
|
|
import { BasicForm, useForm } from '/@/components/Form/index';
|
|
import { BasicTable, useTable, FormSchema, BasicColumn, TableAction } from '/@/components/Table';
|
|
import { addCodeRule, getCodeRuleInfo, editCodeRule } from '/@/api/system/code';
|
|
import { useMessage } from '/@/hooks/web/useMessage';
|
|
import { useI18n } from '/@/hooks/web/useI18n';
|
|
import { getLngBStationPngPage } from '/@/api/mdm/PipeGasDownloadPoint';
|
|
|
|
const { t } = useI18n();
|
|
const codeFormSchema: FormSchema[] = [
|
|
{ field: 'fullName', label: '名称', component: 'Input'},
|
|
];
|
|
|
|
const columns: BasicColumn[] = [
|
|
{ dataIndex: 'code', title: '编码', componentType: 'input', align: 'left', sorter: true},
|
|
{ dataIndex: 'fullName', title: '名称', componentType: 'input', align: 'left', sorter: true},
|
|
{ dataIndex: 'contact', title: '联系人', componentType: 'input', align: 'left', sorter: true},
|
|
{ dataIndex: 'tel', title: '电话', componentType: 'input', align: 'left', sorter: true },
|
|
{ dataIndex: 'email', title: '邮箱', componentType: 'input', align: 'left', sorter: true}
|
|
];
|
|
|
|
const emit = defineEmits(['success', 'register', 'cancel']);
|
|
|
|
const { notification } = useMessage();
|
|
const isUpdate = ref(true);
|
|
const rowId = ref('');
|
|
const selectedKeys = ref<string[]>([]);
|
|
const selectedValues = ref([]);
|
|
const props = defineProps({
|
|
selectType: { type: String, default: 'radio' },
|
|
});
|
|
const type = ref('')
|
|
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
|
|
|
setModalProps({ confirmLoading: false });
|
|
|
|
isUpdate.value = !!data?.isUpdate;
|
|
type.value = data.type
|
|
});
|
|
|
|
const [registerTable, { getDataSource, setTableData, updateTableDataRecord, reload }] = useTable({
|
|
title: t('列表'),
|
|
api: getLngBStationPngPage,
|
|
columns,
|
|
|
|
bordered: true,
|
|
pagination: true,
|
|
canResize: false,
|
|
formConfig: {
|
|
labelCol:{span: 9},
|
|
schemas: codeFormSchema,
|
|
showResetButton: true,
|
|
},
|
|
immediate: false, // 设置为不立即调用
|
|
beforeFetch: (params) => {
|
|
return { ...params, valid: 'Y'};
|
|
},
|
|
rowSelection: {
|
|
type: props.selectType,
|
|
onChange: onSelectChange
|
|
},
|
|
});
|
|
const handleVisibleChange = (visible: boolean) => {
|
|
if (visible) {
|
|
nextTick(() => {
|
|
reload();
|
|
});
|
|
}
|
|
};
|
|
function onSelectChange(rowKeys: string[], e) {
|
|
selectedKeys.value = rowKeys;
|
|
selectedValues.value = e
|
|
}
|
|
const getTitle = computed(() => (!unref(isUpdate) ? t('列表') : t('')));
|
|
function handleCancel () {
|
|
emit('cancel',);
|
|
}
|
|
async function handleSubmit() {
|
|
if (!selectedValues.value.length) {
|
|
notification.warning({
|
|
message: t('提示'),
|
|
description: t('请选择数据')
|
|
});
|
|
return
|
|
}
|
|
closeModal();
|
|
emit('success', selectedValues.value, type.value);
|
|
}
|
|
|
|
</script>
|
|
<style >
|
|
.downloadPointModal .basicCol{
|
|
position: inherit !important;
|
|
top: 0;
|
|
}
|
|
</style>
|