Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
00c2211271 | ||
|
|
2ce6fd6d2f |
@@ -20,7 +20,7 @@ shrimp-admin 是**源码 ship**(.ts + .vue 直接发),不带构建产物,由消
|
|||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": { "dev": "vite", "build": "vite build" },
|
"scripts": { "dev": "vite", "build": "vite build" },
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"shrimp-admin": "git+http://git.zeromvc.com/wc24/shrimp-admin.git#v0.7.10",
|
"shrimp-admin": "git+http://git.zeromvc.com/wc24/shrimp-admin.git#v0.8.2",
|
||||||
|
|
||||||
// ⚠️ 不能删 —— 下面 6 个是 shrimp-admin 的 peerDependencies,
|
// ⚠️ 不能删 —— 下面 6 个是 shrimp-admin 的 peerDependencies,
|
||||||
// 必须由消费侧显式装进自己的 dependencies,不能指望 npm 提升碰巧能 import 到
|
// 必须由消费侧显式装进自己的 dependencies,不能指望 npm 提升碰巧能 import 到
|
||||||
@@ -168,17 +168,18 @@ Vite dev 默认用 **esbuild** 把 node_modules 里的裸导入预打包成 `nod
|
|||||||
└── orders.vue 子模块,parent=user
|
└── orders.vue 子模块,parent=user
|
||||||
```
|
```
|
||||||
|
|
||||||
### 覆盖颗粒度只在 3 个入口
|
### 覆盖颗粒度只在这几个入口
|
||||||
|
|
||||||
框架内 .vue 之间的 peer 引用是**硬编码静态 import**,override 颗粒度就停在下面这 3 类入口,不会一路传递下去:
|
框架内 .vue 之间的 peer 引用是**硬编码静态 import**,override 颗粒度就停在下面这几类入口,不会一路传递下去:
|
||||||
|
|
||||||
| 入口 | 后缀 | 说明 |
|
| 入口 | 后缀 | 说明 |
|
||||||
| --- | --- | --- |
|
| --- | --- | --- |
|
||||||
| **router targets** | `components/login.vue`、`components/layout.vue`、`components/404.vue` | vue-router 三个根级路由组件 |
|
| **router targets** | `components/login.vue`、`components/layout.vue`、`components/404.vue` | vue-router 三个根级路由组件 |
|
||||||
| **module routes** | `module/<key>.vue`、`module/<parent>/<sub>.vue` | 走 `registerRoute` 的业务模块/子模块 |
|
| **module routes** | `module/<key>.vue`、`module/<parent>/<sub>.vue` | 走 `registerRoute` 的业务模块/子模块 |
|
||||||
| **field registry** | `components/fields/Field<X>.vue` | 字段类型注册表(文件名首字母小写 = type 键) |
|
| **field registry** | `components/fields/Field<X>.vue` | 字段类型注册表(文件名首字母小写 = type 键) |
|
||||||
|
| **顶栏** | `components/userbar.vue` | 右上角那一条(语言、全屏、用户菜单),整体替换 |
|
||||||
|
|
||||||
想换更细的部件(比如 layout 里的 topbar)就在消费侧的 `layout.vue` 自己组装 — 框架不再代理任何 peer 切换。
|
**表里没有的路径不会被覆盖,而且不报错**——写了个 `components/topbar.vue` 放进 sources,框架照样用内置那份,页面正常打开、你的文件被静默忽略。想换更细的部件就在消费侧的 `layout.vue` 里自己组装,框架不代理 peer 切换。
|
||||||
|
|
||||||
### 字段类型注册
|
### 字段类型注册
|
||||||
|
|
||||||
|
|||||||
Generated
+2
-2
@@ -1,12 +1,12 @@
|
|||||||
{
|
{
|
||||||
"name": "shrimp-admin",
|
"name": "shrimp-admin",
|
||||||
"version": "0.1.0",
|
"version": "0.8.2",
|
||||||
"lockfileVersion": 3,
|
"lockfileVersion": 3,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"packages": {
|
"packages": {
|
||||||
"": {
|
"": {
|
||||||
"name": "shrimp-admin",
|
"name": "shrimp-admin",
|
||||||
"version": "0.1.0",
|
"version": "0.8.2",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"shrimp-server": "git+http://git.zeromvc.com/wc24/shrimp-server.git#v0.5.0"
|
"shrimp-server": "git+http://git.zeromvc.com/wc24/shrimp-server.git#v0.5.0"
|
||||||
},
|
},
|
||||||
|
|||||||
+1
-1
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "shrimp-admin",
|
"name": "shrimp-admin",
|
||||||
"version": "0.8.0",
|
"version": "0.8.2",
|
||||||
"private": true,
|
"private": true,
|
||||||
"description": "Shrimp 框架前端 — 消费 ShrimpServer + ShrimpTable 契约的经典 Vue3 + Element Plus 实现",
|
"description": "Shrimp 框架前端 — 消费 ShrimpServer + ShrimpTable 契约的经典 Vue3 + Element Plus 实现",
|
||||||
"main": "src/index.ts",
|
"main": "src/index.ts",
|
||||||
|
|||||||
@@ -53,8 +53,6 @@ export interface ShrimpAdminOptions {
|
|||||||
locales?: Record<string, any>
|
locales?: Record<string, any>
|
||||||
/** 语言列表,默认 [{ lang: 'zh-cn', name: '简体中文' }] */
|
/** 语言列表,默认 [{ lang: 'zh-cn', name: '简体中文' }] */
|
||||||
langList?: { lang: string; name: string }[]
|
langList?: { lang: string; name: string }[]
|
||||||
/** 顶栏(userbar)自定义组件,按序渲染在语言切换左侧。业务侧注入全局头部小部件(如终端商户选择器) */
|
|
||||||
headerWidgets?: Component[]
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// ============== 源注册表 ==============
|
// ============== 源注册表 ==============
|
||||||
@@ -167,9 +165,6 @@ export class VueAdmin extends ShrimpClient {
|
|||||||
|
|
||||||
state = reactive({ isMobile: false })
|
state = reactive({ isMobile: false })
|
||||||
|
|
||||||
/** 顶栏自定义组件(由 createShrimpAdmin 的 headerWidgets 注入),userbar 按序渲染 */
|
|
||||||
headerWidgets: Component[] = []
|
|
||||||
|
|
||||||
private _token: string | null = null
|
private _token: string | null = null
|
||||||
get token() { return this._token }
|
get token() { return this._token }
|
||||||
set token(value: string | null) {
|
set token(value: string | null) {
|
||||||
@@ -202,7 +197,6 @@ export class VueAdmin extends ShrimpClient {
|
|||||||
super()
|
super()
|
||||||
this.config = opts.config
|
this.config = opts.config
|
||||||
this.langList = opts.langList || [{ lang: 'zh-cn', name: '简体中文' }]
|
this.langList = opts.langList || [{ lang: 'zh-cn', name: '简体中文' }]
|
||||||
this.headerWidgets = opts.headerWidgets || []
|
|
||||||
|
|
||||||
if (opts.sources) {
|
if (opts.sources) {
|
||||||
Object.assign(externalSources, opts.sources)
|
Object.assign(externalSources, opts.sources)
|
||||||
|
|||||||
@@ -43,15 +43,18 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, watch } from "vue";
|
import { ref, watch, defineAsyncComponent } from "vue";
|
||||||
import { vueAdmin } from "../VueAdmin";
|
import { vueAdmin, resolveVue } from "../VueAdmin";
|
||||||
import { type IMenuItem } from "../IShrimpType";
|
import { type IMenuItem } from "../IShrimpType";
|
||||||
import SideM from "./sideM.vue";
|
import SideM from "./sideM.vue";
|
||||||
import navMenu from "./navMenu.vue";
|
import navMenu from "./navMenu.vue";
|
||||||
import Topbar from "./topbar.vue";
|
import Topbar from "./topbar.vue";
|
||||||
import Userbar from "./userbar.vue";
|
|
||||||
import Logo from "./logo.vue";
|
import Logo from "./logo.vue";
|
||||||
|
|
||||||
|
// 顶栏走 resolveVue,消费侧放 shrimp/components/userbar.vue 即可整体替换。
|
||||||
|
// 其余内置组件仍是静态 import——等真有人要覆盖再逐个放开,不预先把整棵树异步化。
|
||||||
|
const Userbar = defineAsyncComponent(resolveVue("components/userbar.vue"));
|
||||||
|
|
||||||
// 初始化选中菜单
|
// 初始化选中菜单
|
||||||
let currentPath = vueAdmin.router.currentRoute.value.path;
|
let currentPath = vueAdmin.router.currentRoute.value.path;
|
||||||
let pick = vueAdmin.getMenuIndex(currentPath);
|
let pick = vueAdmin.getMenuIndex(currentPath);
|
||||||
|
|||||||
@@ -1,7 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="user-bar">
|
<div class="user-bar">
|
||||||
<!-- 业务侧注入的顶栏部件(headerWidgets),按序渲染在语言切换左侧 -->
|
|
||||||
<component :is="w" v-for="(w, i) in vueAdmin.headerWidgets" :key="i" />
|
|
||||||
<LangSwitch class="panel-item" />
|
<LangSwitch class="panel-item" />
|
||||||
<div class="panel-item" @click="screen">
|
<div class="panel-item" @click="screen">
|
||||||
<el-icon><el-icon-full-screen /></el-icon>
|
<el-icon><el-icon-full-screen /></el-icon>
|
||||||
|
|||||||
@@ -55,6 +55,11 @@ textarea {
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
/* 挂载点没加 class="aminui" 时的兜底:#app 已经是 height:100%(本文件开头),
|
||||||
|
但它是块级容器,上面那行 flex:1 在块级父容器里不生效,布局会塌成内容高度——
|
||||||
|
侧边栏比页面矮一截、还跟着表格异步加载忽长忽短,且不报错、页面照常打开。
|
||||||
|
父级确实是 .aminui 时,flex:1 1 0% 接管尺寸,这行等价不冲突。 */
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 全局滚动条样式 */
|
/* 全局滚动条样式 */
|
||||||
|
|||||||
Reference in New Issue
Block a user