halseyspicy / geeker-admin Goto Github PK

在您的源码中重构了大量element-plus组件的样式，我想问一下关于element-plus组件对应的html元素类名（以及子元素类名，例如.el-table__header）有没有什么详细的文档。
我找了很久一直没找到，只能用F12看页面元素硬找，很麻烦。

路由跳转偶尔会出现白屏，本地开发也发现过这个问题，以为是vite热更新的问题没在意，但是打包到线上部署后也有这个问题。

检查了前后端路由配置都正常，没有拼写问题或者多余空格。尝试了去掉路由缓存也没有解决问题。

问题描述

同级路由带参数跳转，如下配置，由/location跳转至/node，携带参数id，参数丢失。（query方式跳转瞬间能看到URL栏参数存在，跳转完成后参数丢失）

路由配置

const locationRouter: Array<RouteRecordRaw> = [
	{
		path: "/location",
		component: Layout,
		redirect: "/location/index",
		meta: {
			title: "线路管理"
		},
		children: [
			{
				path: "/location",
				name: "locationList",
				component: () => import("@/views/location/index.vue"),
				meta: {
					keepAlive: true,
					requiresAuth: false,
					title: "线路",
					key: "locationList"
				}
			},
			{
				path: "/node",
				name: "node",
				component: () => import("@/views/location/node/index.vue"),
				meta: {
					keepAlive: true,
					requiresAuth: false,
					title: "节点",
					key: "node"
				}
			}
		]
	}
];

传参方式

多种传参方式都尝试过。

const router = useRouter();
const goNode = async (params: Location) => {
	await router.push({ path: "/node", query: { id: params.id } });
};

取参方式

const route = useRoute();
const id = route.query.id;

var.scss 中配置主题颜色只能修改部分

请问有适配移动端的计划么？

感觉应该把 el-table自带的属性也可以透传过去。否则直接使用pro-table 之后 要对table的属性进行一些配置，得改动 column的接口类型

后端开发不太懂前端，有个功能很符合这个组件，能像UI库一样直接引入吗?

顺便问问有用了那些优化 可以写到readme里面我也想知道 主要感觉这个网页很快 但是我自己写后台的时候没多少东西还会卡卡的

hooks-> useDownload

解决方法
const res = await url.call(this, rest);

用户user角色登录，地址栏输入大屏数据dataScreen页面地址，可以访问

登录页的那个背景图是在css里面设置的background-images:url()引入的svg图片 打包后会被打包在asstes/svg/xxx.svg路径下,但是页面引入的背景图路径是在assets/css/xxx.svg,所以部署后背景图出不来 目前有俩种方法 一种是打包后手动把svg目录图片移动到css目录下,另一种是在vite.congfig.ts文件里去掉打包目录分级 把所有资源都打包到同一个目录下 , 但是感觉这俩方法都不太好 ,我想问下 还有更好的办法吗

如果配置表单项columns，如果columns里的某个select的数据是后台接口返回的， 应该如何操作，通过column[2] 这种索引方式吗 ？

点击左边导航栏或者顶部导航栏切换组件时，会出现内容区组件不渲染问题，如果出现该问题之后，后续不管怎么点击，内容区组件就一直不会渲染，一直处于空白状态

hello 我是cz-git 的作者可以考虑把 commitizen 依赖换成 czg。会更适合成为项目的开发依赖
github： https://github.com/Zhengqbbb/cz-git
website: https://cz-git.qbenben.com/cli/

'

"commit": "git pull && git add -A && czg && git push"

{ headers: { noLoading: true } }会覆盖默认headers

关于引导页面
在一些管理平台 以及一些大型线上平台 引导页面出现率时很高的，
引导页对于第一次进入项目，可以简单介绍基本功能
在业务复杂场景 也可以做步骤引导

可以使用 driver.js 实现效果
driver.js

如果可以的话 我愿意贡献代码😀

在研究的时候，有个小小的问题目前没研究懂。比如我登录成功，已经持久化了权限菜单相关的对象，但在左侧菜单的跳转路径里面，又引用了 route.ts里面的静态文件，我尝试在route.ts里面调用 pinia 缓存的权限菜单动态写入，提示我没有初始化 pinia。暂时没有办法，就只能数据库里面存一套，静态文件写一套。暂时应付着，还不太会这一套。

src/routers/route.ts 本想在这个文件里面引入 Pinia 持久化的 MenuStore 结果提示如下报错。

// routers/route.ts

import { createRouter, createWebHistory, RouteRecordRaw } from "vue-router";
// * 导入所有router
const metaRouters = import.meta.globEager("./modules/*.ts");

// * 处理路由表
export const routerArray: RouteRecordRaw[] = [];
Object.keys(metaRouters).forEach(item => {
	Object.keys(metaRouters[item]).forEach((key: any) => {
		routerArray.push(...metaRouters[item][key]);
	});
});
/**
 * @description 路由配置简介（💢没有使用动态路由，路由全部配置在本地，需要使用动态路由请自行改造）
 * @param path ==> 路由路径
 * @param name ==> 路由名称
 * @param redirect ==> 路由重定向
 * @param component ==> 路由组件
 * @param meta ==> 路由元信息
 * @param meta.requireAuth ==> 是否需要权限验证
 * @param meta.keepAlive ==> 是否需要缓存该路由
 * @param meta.title ==> 路由标题
 * @param meta.key	==> 路由key,用来匹配按钮权限
 * */
const routes: RouteRecordRaw[] = [
	{
		path: "/",
		redirect: { name: "login" }
	},
	{
		path: "/login",
		name: "login",
		component: () => import("@/views/login/index.vue"),
		meta: {
			requiresAuth: false,
			title: "登录页",
			key: "login"
		}
	},
	...routerArray,
	{
		// 找不到路由重定向到404页面
		path: "/:pathMatch(.*)",
		redirect: { name: "404" }
	}
];

const router = createRouter({
	// history: createWebHashHistory(),
	history: createWebHistory(),
	routes,
	strict: false,
	// 切换页面，滚动到最顶部
	scrollBehavior: () => ({ left: 0, top: 0 })
});

export default router;

类似如上问题。我参考了 pinia 官网的解决文案，无赖自己还不太懂，所以在这里插个眼，看有没有好心大佬给出解决方案。万分感谢，如果自己后面研究出来了，也会来解答自己留下的这个疑问。

vuejs/pinia#971

暂时没吊在这棵树上，我现在数据库和接口都弄好了。为了不影响 后面的开发，我还是在 src/routers/modules/ 目录里面加了一次所有接口返回的接口，这样才能让左侧菜单栏点击跳转到对应的组件页面。

// src/routers/modules/system.ts

import { RouteRecordRaw } from "vue-router";
import { Layout } from "@/routers/constant";

// 系统组件模块
const systemRouter: Array<RouteRecordRaw> = [
	{
		path: "/system",
		component: Layout,
		redirect: "/system/admin",
		meta: {
			title: "系统管理",
			icon: "icon"
		},
		children: [
			{
				path: "/system/admin",
				name: "admin",
				component: () => import("@/views/system/admin/index.vue"),
				meta: {
					keepAlive: true,
					requiresAuth: true,
					title: "管理员管理",
					key: "admin"
				}
			},
			{
				path: "/system/role",
				name: "role",
				component: () => import("@/views/system/role/index.vue"),
				meta: {
					keepAlive: true,
					requiresAuth: true,
					title: "角色管理",
					key: "role"
				}
			},
			{
				path: "/system/menu",
				name: "menu",
				component: () => import("@/views/system/menu/index.vue"),
				meta: {
					keepAlive: true,
					requiresAuth: true,
					title: "菜单管理",
					key: "menu"
				}
			},
			{
				path: "/system/config",
				name: "config",
				component: () => import("@/views/system/config/index.vue"),
				meta: {
					keepAlive: true,
					requiresAuth: true,
					title: "系统配置",
					key: "config"
				}
			},
			{
				path: "/system/attach",
				name: "attach",
				component: () => import("@/views/system/attach/index.vue"),
				meta: {
					keepAlive: true,
					requiresAuth: true,
					title: "附件管理",
					key: "attach"
				}
			}
		]
	}
];

export default systemRouter;

点击切换中文或者英文，刷新后还是显示中文

Hi 我是 cz-git 的作者，很高兴看见你们使用 cz-git
我查看你们的配置和当前项目结构以及你们commit的习惯
发现其实配置文件可以参考一下，这个项目，会更好：
https://github.com/buqiyuan/vue3-antd-admin/blob/main/commitlint.config.js
但如果只是提供给用户自己修改的话，可以忽略我这个issue

🥳 如果有好的建议或者想法和我说~ 💡

https://www.fastmock.site/ 的接口方便导出一份吗？公司内网访问不了，想重新部署一份，私发也ok：[email protected]
非常感谢

This admin dashboard look cool, but it's useless in its current state as it cannot be used as a package. So everything should be abstracted.
Also an admin dashboard already exists. See https://marmelab.com/react-admin/

作者您好，在clone最新的项目（commit：c95a1c054ee9eacae470bcaae7574d5c989b86a2）到本地，运行npm I安装依赖后运行npm run build:pro后构建的包有7M大小，请问这个是正常的嘛？还是需要进一步配置？

现在标签栏使用的是el-tabs来实现，在点击之后可以使用左右方向键来切换页面，而且会出现一个难看的框框。就算用@keydown.capture.stop.prevent禁用了键盘切换也还是会出现框框。建议像其他模板一样用其他方式写一个标签栏，感激不尽。

@HalseySpicy

如图, 这是太多数据的问题吗

使用pnpm i 安装依赖的话会报错

这一行代码写错了，改成如下

你好 项目启动后 超级表格 --> 使用Component模块 eslint报错 请问是eslint配置未全 还是我有未安装的插件

我是搞 java的，前端能力渣渣。想开发个后台管理，对比了很多前端框架，发现 Geeker 颜值最高。
但相比 scui ，页面较少
大佬有时间完善下 菜单管理、个人设置、首页报表 等页面吗
或者出个pro版本 🙂

我之前也写过图标选择器，发现其中图标的名称有自动换行的问题，不美观
发现element文档中是用grid布局实现的，自己试了一下，可以比较好的解决

什么时候能把recat的功能补充完整呐？

这几天搭项目 参考了几个开源项目 只有您这个符合我们的技术栈
而且代码注释很多 我这种小白都看的懂
微信请作者喝了个咖啡 希望继续更新下去

错误场景：

在pinia中使用异步的actions时，并在组件外部使用pinia会报错

ERROR 上午9:25:42 [vite] http proxy error:
Error: unable to verify the first certificate
at TLSSocket.onConnectSecure (node:_tls_wrap:1530:34)
at TLSSocket.emit (node:events:390:28)
at TLSSocket._finishInit (node:_tls_wrap:944:8)
at TLSWrap.ssl.onhandshakedone (node:_tls_wrap:725:12) (x3)

You need to spell the full path

这段代码判断
如果 path: '/home/:id', 是这种类型,会跳转到403

https://github.com/tolking/element-pro-components

在组件views/dashboard/dataVisualize中，index.vue中使用

const dataScreen: ChartProps = reactive({
	chart1: null,
	chart2: null
});

来保留初始化后的echarts对象，但是根据echarts issue中的描述，不建议声明为响应式对象(apache/echarts#17619 (comment))
自己在使用过程中也遇到tooltip组件异常的情况，简单的解决办法是将reactive删去。

估摸着插件格式化问题
具体页面: 超级表格使用 component
具体代码：src/components/ProTable/index.vue 85-91

格式化一下即可

首先效果确实很好 很强大
但是 protable 这块
1 有没有感觉配置太繁琐了 对新手使用有点困难，可否再给个详细问博客文章
2 我一个页面 感觉需要引入好多的依赖才可以 有点眼花缭乱的。

可能还是我太菜了

一个稍微懂点前端的后端程序员

兄弟，这问题知道啥原因不，我另外的vite项目好像也这样。

感谢作者提供的 开源admin框架，我有个疑惑
这个项目首次切换未访问过的路由 会有点慢 大概要等1-2秒 再次访问就能秒跳转 是为什么呢？

我看 vue-vben-admin 这个库的 预览地址 好像不会有这个问题。

谢谢答疑，再次感谢！！！