|
@@ -149,11 +149,102 @@ interface Props {
|
|
|
|
|
|
|
|
// export default TablePro
|
|
// export default TablePro
|
|
|
|
|
|
|
|
-const TablePro = defineComponent({
|
|
|
|
|
|
|
+export default defineComponent({
|
|
|
props: {
|
|
props: {
|
|
|
columns: {
|
|
columns: {
|
|
|
type: Array as PropType<TableColumnProps[]>,
|
|
type: Array as PropType<TableColumnProps[]>,
|
|
|
require: true
|
|
require: true
|
|
|
|
|
+ },
|
|
|
|
|
+ request: {
|
|
|
|
|
+ type: Object as PropType<{get: Function, params: any}>,
|
|
|
|
|
+ default: () => {
|
|
|
|
|
+ return {
|
|
|
|
|
+ get: () => {},
|
|
|
|
|
+ params: {}
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ easy: {
|
|
|
|
|
+ type: Boolean,
|
|
|
|
|
+ default: true
|
|
|
|
|
+ },
|
|
|
|
|
+ pagination: {
|
|
|
|
|
+ type: Object as PropType<{pageSize: number}>,
|
|
|
|
|
+ default: () => ({ pageSize: 10 })
|
|
|
}
|
|
}
|
|
|
|
|
+ },
|
|
|
|
|
+ emits: ['add'],
|
|
|
|
|
+ setup (props, ctx) {
|
|
|
|
|
+ const { columns, request, pagination } = props
|
|
|
|
|
+
|
|
|
|
|
+ const loading = ref<boolean>(false)
|
|
|
|
|
+
|
|
|
|
|
+ const paginationRef = ref({
|
|
|
|
|
+ current: 1,
|
|
|
|
|
+ pageSize: pagination.pageSize ? pagination.pageSize : 10,
|
|
|
|
|
+ total: 0
|
|
|
|
|
+ })
|
|
|
|
|
+
|
|
|
|
|
+ const dataSource = ref([])
|
|
|
|
|
+
|
|
|
|
|
+ const reload = () => dispatchRequest()
|
|
|
|
|
+
|
|
|
|
|
+ const dispatchRequest = async () => {
|
|
|
|
|
+ // loading.value = true
|
|
|
|
|
+ const { data, sum } = await request.get({
|
|
|
|
|
+ ...request.params,
|
|
|
|
|
+ page: paginationRef.value.current,
|
|
|
|
|
+ pageSize: paginationRef.value.pageSize
|
|
|
|
|
+ })
|
|
|
|
|
+ loading.value = false
|
|
|
|
|
+ paginationRef.value.total = sum
|
|
|
|
|
+ dataSource.value = data
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ const onChangePage = (page: number, pageSize: number) => {
|
|
|
|
|
+ paginationRef.value.current = page
|
|
|
|
|
+ paginationRef.value.pageSize = pageSize
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ onMounted(() => {
|
|
|
|
|
+ request.get && dispatchRequest()
|
|
|
|
|
+ })
|
|
|
|
|
+
|
|
|
|
|
+ const opraMeun = (
|
|
|
|
|
+ <Menu>
|
|
|
|
|
+ <Menu.Item key={0} onClick={() => ctx.emit('add')} > 新增 </Menu.Item>
|
|
|
|
|
+ </Menu>
|
|
|
|
|
+ )
|
|
|
|
|
+
|
|
|
|
|
+ return () => (
|
|
|
|
|
+
|
|
|
|
|
+ <Row style={{ width: '100%' }} >
|
|
|
|
|
+ <Col span={24} >
|
|
|
|
|
+ <Row style={{ width: '100%' }} >
|
|
|
|
|
+ <Col span={12} ></Col>
|
|
|
|
|
+ <Col span={12} style={{ display: 'flex', justifyContent: 'end' }} >
|
|
|
|
|
+ <Space>
|
|
|
|
|
+ <Dropdown
|
|
|
|
|
+ trigger={['click', 'hover']}
|
|
|
|
|
+ overlay={opraMeun}
|
|
|
|
|
+ >
|
|
|
|
|
+ <Button onClick={reload} >刷新<DownOutlined /></Button>
|
|
|
|
|
+ </Dropdown>
|
|
|
|
|
+ </Space>
|
|
|
|
|
+ </Col>
|
|
|
|
|
+ </Row>
|
|
|
|
|
+ </Col>
|
|
|
|
|
+ <Col span={24} >
|
|
|
|
|
+ <Table
|
|
|
|
|
+ style={{ marginTop: '20px' }}
|
|
|
|
|
+ columns={columns}
|
|
|
|
|
+ loading={loading.value}
|
|
|
|
|
+ pagination={{ ...paginationRef.value, onChange: onChangePage }}
|
|
|
|
|
+ dataSource={dataSource.value}
|
|
|
|
|
+ ></Table>
|
|
|
|
|
+ </Col>
|
|
|
|
|
+ </Row>
|
|
|
|
|
+
|
|
|
|
|
+ )
|
|
|
}
|
|
}
|
|
|
})
|
|
})
|