|  |  | 
 |  |  | import { logout } from '@/config.js'; | 
 |  |  | import EditView from './edit.vue' | 
 |  |  | import { formatMessage } from '@/utils/localeUtils.js'; | 
 |  |  | import useTableSearch from '@/utils/tableUtils.jsx'; | 
 |  |  | const context = getCurrentInstance()?.appContext.config.globalProperties; | 
 |  |  |  | 
 |  |  | const router = useRouter(); | 
 |  |  | 
 |  |  | const searchInput = ref("") | 
 |  |  | const editChild = ref(null) | 
 |  |  |  | 
 |  |  | const state = reactive({ | 
 |  |  |   selectedRowKeys: [], | 
 |  |  |   loading: false, | 
 |  |  | }); | 
 |  |  |  | 
 |  |  | let tableData = ref([]); | 
 |  |  | getPage(); | 
 |  |  |  | 
 |  |  | const { | 
 |  |  |   getColumnSearchProps, | 
 |  |  | } = useTableSearch(); | 
 |  |  |  | 
 |  |  | const columns = [ | 
 |  |  |   { | 
 |  |  |     title: formatMessage('db.sys_host.name', '名称'), | 
 |  |  |     dataIndex: 'name', | 
 |  |  |     width: 140, | 
 |  |  |     ...getColumnSearchProps('name'), | 
 |  |  |   }, | 
 |  |  |   { | 
 |  |  |     title: formatMessage('db.sys_host.status', '状态'), | 
 |  |  |     dataIndex: 'status$', | 
 |  |  |     width: 140, | 
 |  |  |     ...getColumnSearchProps('status$'), | 
 |  |  |   }, | 
 |  |  |   { | 
 |  |  |     title: formatMessage('db.sys_host.create_time', '添加时间'), | 
 |  |  |     dataIndex: 'createTime$', | 
 |  |  |     width: 140, | 
 |  |  |     ...getColumnSearchProps('createTime$'), | 
 |  |  |   }, | 
 |  |  |   { | 
 |  |  |     title: formatMessage('db.sys_host.update_time', '修改时间'), | 
 |  |  |     dataIndex: 'updateTime$', | 
 |  |  |     width: 140, | 
 |  |  |     ...getColumnSearchProps('updateTime$'), | 
 |  |  |   }, | 
 |  |  |   { | 
 |  |  |     title: formatMessage('db.sys_host.memo', '备注'), | 
 |  |  |     dataIndex: 'memo', | 
 |  |  |     width: 140, | 
 |  |  |     ...getColumnSearchProps('memo'), | 
 |  |  |   }, | 
 |  |  |  | 
 |  |  |   { | 
 |  |  | 
 |  |  |   }, | 
 |  |  | ]; | 
 |  |  |  | 
 |  |  | const state = reactive({ | 
 |  |  |   selectedRowKeys: [], | 
 |  |  |   loading: false, | 
 |  |  | }); | 
 |  |  | const hasSelected = computed(() => state.selectedRowKeys.length > 0); | 
 |  |  | const start = () => { | 
 |  |  |   state.loading = true; | 
 |  |  | 
 |  |  | }; | 
 |  |  |  | 
 |  |  | function getPage() { | 
 |  |  |   state.loading = true; | 
 |  |  |  | 
 |  |  |   post('/api/host/page', { | 
 |  |  |     current: currentPage, | 
 |  |  |     pageSize: pageSize, | 
 |  |  | 
 |  |  |     if (result.code == 200) { | 
 |  |  |       let data = result.data; | 
 |  |  |       tableData.value = data; | 
 |  |  |  | 
 |  |  |       state.loading = false; | 
 |  |  |     } else if (result.code === 401) { | 
 |  |  |       message.error(result.msg); | 
 |  |  |       logout() | 
 |  |  | 
 |  |  |  | 
 |  |  | function handleTableReload(value) { | 
 |  |  |   getPage() | 
 |  |  |   window.location.reload(); | 
 |  |  | } | 
 |  |  |  | 
 |  |  | </script> | 
 |  |  | 
 |  |  |     <a-table :row-selection="{ selectedRowKeys: state.selectedRowKeys, onChange: onSelectChange }" | 
 |  |  |       :data-source="tableData.records" :defaultExpandAllRows="false" :key="TABLE_KEY" rowKey="id" | 
 |  |  |       :pagination="{ total: tableData.total, onChange: onPageChange }" | 
 |  |  |       :scroll="{ y: 768, scrollToFirstRowOnChange: true }" :columns="columns"> | 
 |  |  |       :scroll="{ y: 768, scrollToFirstRowOnChange: true }" :columns="columns" :loading="state.loading"> | 
 |  |  |       <template #bodyCell="{ column, text, record }"> | 
 |  |  |         <template v-if="column.dataIndex === 'oper'"> | 
 |  |  |           <div style="display: flex;justify-content: space-evenly;"> |