<template>
|
<BasicModal
|
width="1200px"
|
:height="700"
|
v-bind="$attrs"
|
@register="register"
|
:title="title"
|
@ok="handleSubmit"
|
>
|
<!-- <div class="pt-3px pr-3px">
|
<BasicForm @register="registerForm" :model="model" />
|
</div> -->
|
<div>
|
<BasicTable @register="registerTable" @row-dbClick="rowDbClick">
|
<!-- <template #toolbar>
|
<a-button type="primary" @click="handleCreate"> 新增盘点 </a-button>
|
</template> -->
|
</BasicTable>
|
</div>
|
</BasicModal>
|
</template>
|
<script lang="ts" setup>
|
import { ref, unref } from 'vue';
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
|
import { BasicTable, BasicColumn, TableAction, useTable } from '/@/components/Table';
|
import { useI18n } from '/@/hooks/web/useI18n';
|
import { getListByPage } from '/@/api/tigerapi/system';
|
|
const { t } = useI18n();
|
const title = ref('');
|
const tableName = ref('');
|
const rowKey = ref('');
|
const returnFieldName = ref('');
|
const schemas = ref([] as FormSchema[]);
|
const which = ref('');
|
|
//列表
|
const ItemColumns = ref([] as BasicColumn[]);
|
const searchInfo = ref({});
|
|
const emit = defineEmits(['success', 'register']);
|
const checkedKeys = ref<Array<string | number>>([]);
|
const checkedIds = ref<Array<string | number>>([]);
|
const [registerTable, { reload, getForm, setProps }] = useTable({
|
title: '列表信息',
|
api: getListByPage,
|
searchInfo: searchInfo,
|
columns: ItemColumns,
|
formConfig: {
|
labelWidth: 120,
|
schemas: schemas,
|
},
|
size: 'small',
|
useSearchForm: true,
|
showTableSetting: false,
|
scroll: { y: 550 },
|
canResize: false,
|
rowKey: rowKey,
|
rowSelection: {
|
selectedRowKeys: checkedKeys.value,
|
type: 'checkbox',
|
// getCheckboxProps(record: Recordable) {
|
// // Demo: 第一行（id为0）的选择框禁用
|
// if (record.id === '0') {
|
// return { disabled: true };
|
// } else {
|
// return { disabled: false };
|
// }
|
// },
|
onSelect: onSelect,
|
onSelectAll: onSelectAll,
|
},
|
bordered: true,
|
showIndexColumn: false,
|
});
|
const [register, { setModalProps, closeModal }] = useModalInner((data) => {
|
setModalProps({ confirmLoading: false });
|
setProps({
|
dataSource: [],
|
});
|
data && onDataReceive(data);
|
});
|
|
async function onDataReceive(data) {
|
console.log('Data Received', data);
|
// 方式1;
|
// setFieldsValue({
|
// field2: data.data,
|
// field1: data.info,
|
// });
|
searchInfo.value = data?.searchInfo;
|
title.value = data?.title;
|
schemas.value = data?.schemas;
|
ItemColumns.value = data?.ItemColumns;
|
tableName.value = data?.tableName;
|
rowKey.value = data?.rowKey;
|
returnFieldName.value = data?.returnFieldName;
|
checkedKeys.value = [];
|
which.value = data?.which;
|
getForm().resetFields();
|
// reload();
|
}
|
|
// function handleVisibleChange(v) {
|
// v && props.userData && nextTick(() => onDataReceive(props.userData));
|
// }
|
|
function rowDbClick(record, index, event) {
|
try {
|
closeModal();
|
emit('success', {
|
isUpdate: unref(false),
|
values: { val: record[rowKey.value], id: record['ID'] },
|
returnFieldName: returnFieldName.value,
|
which: which.value,
|
});
|
} finally {
|
setModalProps({ confirmLoading: false });
|
}
|
}
|
|
async function handleSubmit() {
|
try {
|
var values = '';
|
var ids = '';
|
// checkedKeys.value.forEach(element => {
|
// values+=element;
|
// });
|
values = checkedKeys.value.join(',');
|
ids = checkedIds.value.join(',');
|
closeModal();
|
emit('success', {
|
isUpdate: unref(false),
|
values: { val: values, id: ids },
|
returnFieldName: returnFieldName.value,
|
which: which.value,
|
});
|
} finally {
|
setModalProps({ confirmLoading: false });
|
}
|
}
|
function onSelect(record, selected) {
|
if (selected) {
|
checkedKeys.value = [...checkedKeys.value, record[rowKey.value]];
|
checkedIds.value = [...checkedIds.value, record['ID']];
|
} else {
|
checkedKeys.value = checkedKeys.value.filter((code) => code !== record[rowKey.value]);
|
checkedIds.value = checkedIds.value.filter((code) => code !== record['ID']);
|
}
|
}
|
function onSelectAll(selected, selectedRows, changeRows) {
|
const changeVals = changeRows.map((item) => item[rowKey.value]);
|
const changeIds = changeRows.map((item) => item['ID']);
|
if (selected) {
|
checkedKeys.value = [...checkedKeys.value, ...changeVals];
|
checkedIds.value = [...checkedIds.value, ...changeIds];
|
} else {
|
checkedKeys.value = checkedKeys.value.filter((code) => {
|
return !changeVals.includes(code);
|
});
|
checkedIds.value = checkedIds.value.filter((code) => {
|
return !changeIds.includes(code);
|
});
|
}
|
}
|
</script>
|
