vben table

label/index.vue

` .wrapper { width: 100%; height: 100%; padding: 10px; & > :nth-child(2) { margin-top: 15px; } }

`

search/index.vue

` .w-search { // border: 1px solid blue; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); padding: 7px; display: flex; align-items: center; justify-content: space-between; } .front { display: flex; align-items: center; span { white-space: nowrap; } } .back { display: flex; align-items: center; }

`

tables/index.vue

` .w-table { height: calc(100vh - 150px); box-shadow: 0 0 5px rgb(0, 0, 0, 0.1); // background-color: aqua; padding: 7px; } .header { display: flex; height: 45px; width: 100%; border: 1px solid rgb(0, 0, 0, 0.4); margin-bottom: 15px; } .main { flex: 1; .table { height: 500px; width: 100%; } } //表格斑马纹 // .ant-table-striped :deep(.table-striped) td { // // background-color: #fafafa; // } ::v-deep .table-striped { background-color: #fafafa; }

`

api/label

` import { defHttp } from '/@/utils/http/axios';

enum Api { getMenu = '/user/getMenu', }

export function getMenuApi(params: any): any { return defHttp.request({ url: Api.getMenu, method: 'GET', params, }); }

//获取列表,分页 export const goodsListApi = (data:any) => { return http.get(/goods/goodsList, { params: {page: data} }); };

`

范例：api/system.ts

` import { AccountParams, DeptListItem, MenuParams, RoleParams, RolePageParams, MenuListGetResultModel, DeptListGetResultModel, AccountListGetResultModel, RolePageListGetResultModel, RoleListGetResultModel, } from './model/systemModel'; import { defHttp } from '/@/utils/http/axios';

enum Api { AccountList = '/system/getAccountList', IsAccountExist = '/system/accountExist', DeptList = '/system/getDeptList', setRoleStatus = '/system/setRoleStatus', MenuList = '/system/getMenuList', RolePageList = '/system/getRoleListByPage', GetAllRoleList = '/system/getAllRoleList', }

export const getAccountList = (params: AccountParams) => defHttp.get({ url: Api.AccountList, params });

export const getDeptList = (params?: DeptListItem) => defHttp.get({ url: Api.DeptList, params });

export const getMenuList = (params?: MenuParams) => defHttp.get({ url: Api.MenuList, params });

export const getRoleListByPage = (params?: RolePageParams) => defHttp.get({ url: Api.RolePageList, params });

export const getAllRoleList = (params?: RoleParams) => defHttp.get({ url: Api.GetAllRoleList, params });

export const setRoleStatus = (id: number, status: string) => defHttp.post({ url: Api.setRoleStatus, params: { id, status } });

export const isAccountExist = (account: string) => defHttp.post({ url: Api.IsAccountExist, params: { account } }, { errorMessageMode: 'none' }); `