提交 98d1d4a2 authored 作者: hejie's avatar hejie

feat(路由模块): 🚀 删除无用代码,优化路由逻辑

上级 43bb413e
// @ts-check
/** @type {import("@commitlint/types").UserConfig} */
export default {
ignores: [commit => commit.includes("init")],
extends: ["@commitlint/config-conventional"],
rules: {
"body-leading-blank": [2, "always"],
"footer-leading-blank": [1, "always"],
"header-max-length": [2, "always", 108],
"subject-empty": [2, "never"],
"type-empty": [2, "never"],
"type-enum": [
2,
"always",
[
"feat",
"fix",
"perf",
"style",
"docs",
"test",
"refactor",
"build",
"ci",
"chore",
"revert",
"wip",
"workflow",
"types",
"release"
]
]
}
};
import { http } from "@/utils/http";
type Result = {
success: boolean;
data?: Array<any>;
code?: string;
msg?: string;
status?: number;
};
type ResultTable = {
success: boolean;
records?: {
/** 列表数据 */
list: Array<any>;
/** 总条目数 */
total?: number;
/** 每页显示条目个数 */
pageSize?: number;
/** 当前页数 */
currentPage?: number;
};
// [propName: string]: any;
data?: any;
};
/** 获取系统管理-角色管理列表 */
export const getRoleList = (data?: object) => {
// return http.request<ResultTable>("post", "/role", { data });
return http.request<ResultTable>("post", "/api/role/find-role-list-by-page", {
data
});
};
/** 获取系统管理-不分页查询角色管理列表 */
export const getRoleListNoPage = () => {
// return http.request<ResultTable>("post", "/role", { data });
return http.request<ResultTable>("post", "/api/role/get-role-list");
};
// 系统管理-删除角色
export const deleteRole = (id: string) => {
return http.request<Result>("post", `/api/role/delete-role/${id}`);
};
// 系统管理-添加角色
export const addRole = (data?: object) => {
return http.request<Result>("post", "/api/role/add-role", { data });
};
// 系统管理-修改角色
export const updateRole = (data?: object) => {
return http.request<Result>("post", "/api/role/modify-role", { data });
};
// 系统管理-根据用户id查询角色列表
export const getRoleListByUserId = (id: string | number) => {
return http.request<Result>("post", `/api/role/get-role-by-user/${id}`);
};
// 系统管理 - 根据用户id绑定角色
export const bindRoleByUserId = (data?: object) => {
return http.request<Result>("post", "/api/role/bind-role-by-user", { data });
};
export default {
path: "/fighting",
redirect: "/fighting/index",
meta: {
icon: "ri/file-info-line",
title: "加油"
},
children: [
{
path: "/fighting/index",
name: "Fighting",
component: () => import("@/views/fighting/index.vue"),
meta: {
title: "加油"
}
}
]
} satisfies RouteConfigsTable;
export default {
path: "/testlist",
redirect: "/testlist/index",
meta: {
icon: "ri/file-info-line",
title: "测试列表"
},
children: [
{
path: "/testlist/index",
name: "TestList",
component: () => import("@/views/testlist/index.vue"),
meta: {
title: "测试列表"
}
}
]
} satisfies RouteConfigsTable;
......@@ -218,8 +218,7 @@ function initRouter() {
} else {
return new Promise(resolve => {
getMine().then(({ data }) => {
console.log("路由数据---:", data);
data.menuList.shift();
// console.log("路由数据---:", data);
const treeData = transformRoutes(data.menuList);
handleAsyncRoutes(cloneDeep(treeData));
......
<template>
<div class="fighting">
<h2>Fighting</h2>
<slot />
</div>
</template>
<script setup lang="ts">
// 组件逻辑部分
import { ref } from "vue";
const count = ref(0);
const increment = () => {
count.value++;
};
</script>
<style scoped lang="scss">
.fighting {
padding: 20px;
border: 1px solid #ccc;
}
</style>
import type {
LoadingConfig,
AdaptiveConfig,
PaginationProps
} from "@pureadmin/table";
import { tableData } from "./data";
import { ref, onMounted, reactive } from "vue";
import { clone, delay } from "@pureadmin/utils";
export function useColumns() {
const dataList = ref([]);
const loading = ref(true);
const columns: TableColumnList = [
{
label: "日期",
prop: "date"
},
{
label: "姓名",
prop: "name"
},
{
label: "地址",
prop: "address"
}
];
/** 分页配置 */
const pagination = reactive<PaginationProps>({
pageSize: 20,
currentPage: 1,
pageSizes: [20, 40, 60],
total: 0,
align: "right",
background: true,
size: "default"
});
/** 加载动画配置 */
const loadingConfig = reactive<LoadingConfig>({
text: "正在加载第一页...",
viewBox: "-10, -10, 50, 50",
spinner: `
<path class="path" d="
M 30 15
L 28 17
M 25.61 25.61
A 15 15, 0, 0, 1, 15 30
A 15 15, 0, 1, 1, 27.99 7.5
L 15 15
" style="stroke-width: 4px; fill: rgba(0, 0, 0, 0)"/>
`
// svg: "",
// background: rgba()
});
/** 撑满内容区自适应高度相关配置 */
const adaptiveConfig: AdaptiveConfig = {
/** 表格距离页面底部的偏移量,默认值为 `96` */
offsetBottom: 110
/** 是否固定表头,默认值为 `true`(如果不想固定表头,fixHeader设置为false并且表格要设置table-layout="auto") */
// fixHeader: true
/** 页面 `resize` 时的防抖时间,默认值为 `60` ms */
// timeout: 60
/** 表头的 `z-index`,默认值为 `100` */
// zIndex: 100
};
function onSizeChange(val) {
console.log("onSizeChange", val);
}
function onCurrentChange(val) {
loadingConfig.text = `正在加载第${val}页...`;
loading.value = true;
delay(600).then(() => {
loading.value = false;
});
}
onMounted(() => {
delay(600).then(() => {
const newList = [];
Array.from({ length: 6 }).forEach(() => {
newList.push(clone(tableData, true));
});
newList.flat(Infinity).forEach((item, index) => {
dataList.value.push({ id: index, ...item });
});
pagination.total = dataList.value.length;
loading.value = false;
});
});
return {
loading,
columns,
dataList,
pagination,
loadingConfig,
adaptiveConfig,
onSizeChange,
onCurrentChange
};
}
import dayjs from "dayjs";
import { clone } from "@pureadmin/utils";
const date = dayjs(new Date()).format("YYYY-MM-DD");
const tableData = [
{
date,
name: "Tom",
address: "No. 189, Grove St, Los Angeles"
},
{
date,
name: "Jack",
address: "No. 189, Grove St, Los Angeles"
},
{
date,
name: "Dick",
address: "No. 189, Grove St, Los Angeles"
},
{
date,
name: "Harry",
address: "No. 189, Grove St, Los Angeles"
},
{
date,
name: "Sam",
address: "No. 189, Grove St, Los Angeles"
},
{
date,
name: "Lucy",
address: "No. 189, Grove St, Los Angeles"
},
{
date,
name: "Mary",
address: "No. 189, Grove St, Los Angeles"
},
{
date,
name: "Mike",
address: "No. 189, Grove St, Los Angeles"
},
{
date,
name: "Mike1",
address: "No. 189, Grove St, Los Angeles"
},
{
date,
name: "Mike2",
address: "No. 189, Grove St, Los Angeles"
}
];
const tableDataMore = clone(tableData, true).map(item =>
Object.assign(item, {
state: "California",
city: "Los Angeles",
"post-code": "CA 90036"
})
);
const tableDataImage = clone(tableData, true).map((item, index) =>
Object.assign(item, {
image: `https://pure-admin.github.io/pure-admin-table/imgs/${index + 1}.jpg`
})
);
const tableDataSortable = clone(tableData, true).map((item, index) => {
delete item.date;
Object.assign(item, {
date: `${dayjs(new Date()).format("YYYY-MM")}-${index + 1}`
});
});
const tableDataDrag = clone(tableData, true).map((item, index) => {
delete item.address;
delete item.date;
return Object.assign(item, {
id: index + 1,
date: `${dayjs(new Date()).format("YYYY-MM")}-${index + 1}`
});
});
const tableDataEdit = clone(tableData, true).map((item, index) => {
delete item.date;
return Object.assign(item, {
id: index + 1,
date: `${dayjs(new Date()).format("YYYY-MM")}-${index + 1}`,
address: "China",
sex: index % 2 === 0 ? "男" : "女"
});
});
export {
tableData,
tableDataDrag,
tableDataMore,
tableDataEdit,
tableDataImage,
tableDataSortable
};
<template>
<div class="test-list bg-white">
<el-form
ref="formRef"
:inline="true"
:model="form"
class="search-form bg-bg_color w-full pl-8 pt-[12px] overflow-auto"
>
<el-form-item label="角色名称:" prop="name">
<el-input
v-model="form.name"
placeholder="请输入角色名称"
clearable
class="w-[180px]!"
/>
</el-form-item>
<el-form-item label="角色标识:" prop="code">
<el-input
v-model="form.code"
placeholder="请输入角色标识"
clearable
class="w-[180px]!"
/>
</el-form-item>
<el-form-item label="状态:" prop="status">
<el-select
v-model="form.status"
placeholder="请选择状态"
clearable
class="w-[180px]!"
>
<el-option label="已启用" value="1" />
<el-option label="已停用" value="0" />
</el-select>
</el-form-item>
<el-form-item>
<el-button
type="primary"
:icon="useRenderIcon('ri/search-line')"
:loading="loading"
@click="onSearch"
>
搜索
</el-button>
<el-button :icon="useRenderIcon(Refresh)" @click="resetForm(formRef)">
重置
</el-button>
</el-form-item>
</el-form>
<div>
<pure-table
ref="tableRef"
border
adaptive
:adaptiveConfig="adaptiveConfig"
row-key="id"
alignWhole="center"
showOverflowTooltip
:loading="loading"
:loading-config="loadingConfig"
:data="
dataList.slice(
(pagination.currentPage - 1) * pagination.pageSize,
pagination.currentPage * pagination.pageSize
)
"
:columns="columns"
:pagination="pagination"
@page-size-change="onSizeChange"
@page-current-change="onCurrentChange"
/>
</div>
</div>
</template>
<script setup lang="ts">
// 组件逻辑部分
import { ref, onMounted } from "vue";
import { useColumns } from "./columns";
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
import Refresh from "~icons/ep/refresh";
import { useI18n } from "vue-i18n";
const { locale } = useI18n();
const tableRef = ref();
const formRef = ref();
const count = ref(0);
const increment = () => {
count.value++;
};
const form = reactive({
name: "",
code: "",
status: ""
});
const {
loading,
columns,
dataList,
pagination,
loadingConfig,
adaptiveConfig,
onSizeChange,
onCurrentChange
} = useColumns();
async function onSearch() {
loading.value = true;
// let data = {};
// const { data } = await getRoleList(toRaw(form));
// dataList.value = data.list;
// pagination.total = data.total;
// pagination.pageSize = data.pageSize;
// pagination.currentPage = data.currentPage;
setTimeout(() => {
loading.value = false;
}, 500);
}
const resetForm = formEl => {
if (!formEl) return;
formEl.resetFields();
onSearch();
};
onMounted(() => {
// console.log("locale", locale);
nextTick(() => {
locale.value = "zh-CN"; // 设置默认语言为中文
});
// console.log(`当前系统采用的语言是:${locale.value}`);
});
</script>
<style scoped lang="scss">
.test-list {
padding: 20px;
border: 1px solid #ccc;
}
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论