| | |
| | | <template> |
| | | <div>工作考核指标</div> |
| | | <Page :auto-content-height="true"> |
| | | <BasicTable table-title="工作考核指标列表"> |
| | | <template #toolbar-tools> |
| | | <Space> |
| | | <a-button |
| | | v-access:code="['system:role:export']" |
| | | @click="handleDownloadExcel" |
| | | style="margin-right: 10px" |
| | | > |
| | | {{ $t('pages.common.export') }} |
| | | </a-button> |
| | | <a-button |
| | | type="primary" |
| | | v-access:code="['system:role:add']" |
| | | @click="handleAdd" |
| | | > |
| | | {{ $t('pages.common.add') }} |
| | | </a-button> |
| | | </Space> |
| | | </template> |
| | | </BasicTable> |
| | | </Page> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: "index" |
| | | <script setup lang="ts"> |
| | | import type { VxeGridProps } from "#/adapter/vxe-table"; |
| | | import { useVbenVxeGrid, vxeCheckboxChecked } from '#/adapter/vxe-table'; |
| | | import type { VbenFormProps } from '@vben/common-ui'; |
| | | import type { roleList} from "#/api/system/role"; |
| | | import { columns, querySchema } from './data'; |
| | | import { Page, useVbenDrawer, useVbenModal } from '@vben/common-ui'; |
| | | const formOptions: VbenFormProps = { |
| | | commonConfig: { |
| | | labelWidth: 80, |
| | | componentProps: { |
| | | allowClear: true, |
| | | }, |
| | | }, |
| | | schema: querySchema(), |
| | | wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4', |
| | | // 日期选择格式化 |
| | | fieldMappingTime: [ |
| | | [ |
| | | 'createTime', |
| | | ['params[beginTime]', 'params[endTime]'], |
| | | ['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59'], |
| | | ], |
| | | ], |
| | | }; |
| | | const gridOptions: VxeGridProps = { |
| | | checkboxConfig: { |
| | | // 高亮 |
| | | highlight: true, |
| | | // 翻页时保留选中状态 |
| | | reserve: true, |
| | | // 点击行选中 |
| | | // trigger: 'row', |
| | | checkMethod: ({ row }) => row.roleId !== 1, |
| | | }, |
| | | columns, |
| | | height: 'auto', |
| | | keepSource: true, |
| | | pagerConfig: {}, |
| | | proxyConfig: { |
| | | ajax: { |
| | | query: async ({ page }, formValues = {}) => { |
| | | return await roleList({ |
| | | pageNum: page.currentPage, |
| | | pageSize: page.pageSize, |
| | | ...formValues, |
| | | }); |
| | | }, |
| | | }, |
| | | }, |
| | | rowConfig: { |
| | | keyField: 'roleId', |
| | | }, |
| | | id: 'system-role-index', |
| | | }; |
| | | const [BasicTable,tableApi] = useVbenVxeGrid({ |
| | | formOptions, |
| | | gridOptions, |
| | | }); |
| | | const handleAdd = () => { |
| | | console.log('新增') |
| | | } |
| | | const handleDownloadExcel = () => { |
| | | console.log('导出') |
| | | } |
| | | </script> |
| | | |