leftyer/MangoTestingPlatform
1
0
Fork 0
mirror of https://gitee.com/mao-peng/MangoTestingPlatform.git synced 2025-12-06 11:59:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

更新前端代码的样式；

Browse Source
This commit is contained in:
毛鹏
2024-12-24 16:12:22 +08:00
parent cc69b4d4ee
commit ac3d9da16b
49 changed files with 207 additions and 409 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
MangoServer/PyAutoTest/auto_test/auto_user/views/user.py
View File

@@ -192,7 +192,7 @@ class LoginViews(ViewSet):
user_obj.save()
return ResponseData.success(RESPONSE_MSG_0114, data)
@action(methods=['get'], detail=False)
@action(methods=['POST'], detail=False)
def menu(self, request: Request):
return ResponseData.success(RESPONSE_MSG_0044, ad_routes())

2
MangoServer/PyAutoTest/urls.py
View File

@@ -27,7 +27,7 @@ urlpatterns = [
#
path("login", LoginViews.as_view({'post': 'login'})), # 登录
path("register", LoginViews.as_view({'post': 'register'})), # 登录
path("menu", LoginViews.as_view({'get': 'menu'})),
path("menu", LoginViews.as_view({'post': 'menu'})),
path("test", LoginViews.as_view({'get': 'test'})),
#
path('system/', include("PyAutoTest.auto_test.auto_system.urls")),

2
mango-console/.eslintrc.js
View File

@@ -1,4 +1,4 @@
module.exports = {
export default {
root: true,
env: {
browser: true,

1
mango-console/.gitignore vendored
View File

@@ -4,6 +4,5 @@ dist-ssr
*.local
dist
dist-staging
package-lock.json
yarn.loc
.idea

65
mango-console/CHANGELOG.md
View File

@@ -1,3 +1,64 @@
## 2024-1-30(v: 3.0.6)
- 新增：新增 跨域 配置代码
## 2024-1-30(v: 3.0.5)
- 升级：升级 `arco-design` 版本到 `v2.54.3`
- 升级：升级 `tailwindcss` 版本到 `v3.4.1`
- 修复：修复 <a-switch> 组件显示不出来的bug
- 升级：适配 `vite5`，替换 `globEager` 为 `glob`
## 2023-3-22(v: 3.0.2)
- 升级：升级 `arco-design` 版本到 `v2.44.2`
## 2023-3-14(v: 3.0.1)
- 修复：修复在获取菜单数据为空的时候造成系统死循环的异常
涉及文件：
- src/store/help/index.ts
- 修复：修复在`hmr`下 `transition` 动画执行会丢失进入页面的bug
涉及文件：
- src/layouts/Main.vue
- 优化：升级 `import.meta.globEager` 到 `import.meta.glob`
涉及文件：
- src/layouts/index.ts
- src/components/index.ts
## 2023-3-10(v: 3.0.0)
- 升级：全新升级登录页面和首页面UI
- 修复：全新设计并修复 SortableTable.vue 组件报错问题。 涉及文件如下：
- src/components/SortableTable.vue
- src/types/components.ts
- package.json （新增第三方依赖：sortablejs 声明依赖：@types/sortablejs）
- 修复：添加 @typescript-eslint/parser eslint 依赖，修复在某些情况下报错信息： Parsing error: Cannot find module '@typescript-eslint/parser'
## 2023-2-20(v: 2.1.0)
- 优化：优化`路由` 以 `fullPath` 字段为主键，以支持相同路由，query参数不一致时导致路由参数缺失
涉及文件如下：
- src/layouts/actions/index.vue
- src/layouts/tabbar/index.vue
- src/router/guard/visited.ts
- src/store/help/index.ts
- src/store/modules/visited-routes.ts
- 升级：升级 `arco-design` 版本到 `v2.43.1`
## 2022-12-14(v: 2.0.8)
- 优化：优化 `主体滑动` 样式
@@ -121,13 +182,13 @@
- 重要升级：菜单可以从本地路由中过滤
- 之前的菜单都是根据接口数据从本地 `views` 中动态加载，但在某些场景下或者某些人的开发习惯，可能需要根据本地定义中的路由表（如：`src/router/user.ts` 中的 `asyncRoutes`）中动态加载。如果接口中的菜单配置项和本地路由表中的配置项重复，优先使用本地路由表中的配置项。
- 之前的菜单都是根据接口数据从本地 `views` 中动态加载，但在某些场景下或者某些人的开发习惯，可能需要根据本地定义中的路由表（如：`src/router/index.ts` 中的 `asyncRoutes`）中动态加载。如果接口中的菜单配置项和本地路由表中的配置项重复，优先使用本地路由表中的配置项。
- 在根据权限获取到菜单列表的时候，就可以根据以下三种方式加载路由：
- 完全从 本地 `views` 中动态加载
- 完全从 本地 `路由表` 中动态加载
- 本地 `views` 和 本地 `路由表` 两种方式的结合。注：本地 `路由表`方式的 `优先级要高于` 本地 `views`的方式。（本项目默认的使用方式）
- 优化：把 `src/router/user.ts`中的路由分类
- 优化：把 `src/router/index.ts`中的路由分类
- `constantRoutes` 存放一些系统页面，如`login`、`redirect`、`404`、`403`、`500`等
- `asyncRoutes` 存放一些需要根据权限加载的路由

2
mango-console/components.d.ts vendored
View File

@@ -82,4 +82,4 @@ declare module 'vue' {
}
}
export {}
export { }

BIN
mango-console/dist.zip
View File

Binary file not shown.

2
mango-console/index.html
View File

@@ -2,7 +2,7 @@
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="public/favicon.ico" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>芒果测试平台</title>
<link rel="stylesheet" href="/static/css/loading.css" />

3
mango-console/parse-curl.d.ts vendored
View File

@@ -1,3 +0,0 @@
declare module 'parse-curl' {
export default function parseCurl(curl: string): any
}

5
mango-console/postcss.config.js
View File

@@ -1,6 +1,9 @@
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
autoprefixer: {
overrideBrowserslist: ['Android 4.1', 'iOS 7.1', 'Chrome > 31', 'ff > 31'],
grid: true,
},
},
}

BIN
mango-console/src/assets/img_avatar.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 9.1 KiB

2
mango-console/src/components/MarkdownEditor.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="editor-wrapper">开发整理中</div>
<div class="editor-wrapper"> 开发整理中 </div>
</template>
<script lang="ts"></script>

2
mango-console/src/components/RichTextEditor.vue
View File

@@ -1,5 +1,5 @@
<template>
<div id="richTextEditor" :style="{ height: height + 'px' }"></div>
<div id="richTextEditor" :style="{ height: height + 'px' }"> </div>
</template>
<script lang="ts">

22
mango-console/src/components/Scrollbar/src/types.d.ts vendored
View File

@@ -1,18 +1,18 @@
export interface BarMapItem {
offset: string
scroll: string
scrollSize: string
size: string
key: string
axis: string
client: string
direction: string
offset: string;
scroll: string;
scrollSize: string;
size: string;
key: string;
axis: string;
client: string;
direction: string;
}
export interface BarMap {
vertical: BarMapItem
horizontal: BarMapItem
vertical: BarMapItem;
horizontal: BarMapItem;
}
export interface ScrollbarType {
wrap: ElRef
wrap: ElRef;
}

1
mango-console/src/components/TableFooter.vue
View File

@@ -11,7 +11,6 @@
:show-page-size="pagination.showSizePicker"
:total="pagination?.pageCount"
show-total
show-jumper
@page-size-change="onPageSizeChange"
@change="onChange"
size="small"

7
mango-console/src/components/index.ts
View File

@@ -3,10 +3,13 @@ import { toHump } from '../utils'
export default {
install(app: App, options: any) {
const { getComponentName } = options
const components = import.meta.globEager('./**/*.{vue,tsx}')
const components = import.meta.glob('./**/*.{vue,tsx}', { eager: true })
Object.keys(components).forEach((it: string) => {
const component = components[it]
app.component(component.default.name || toHump(getComponentName(it)), component.default)
app.component(
(component as any).default.name || toHump(getComponentName(it)),
(component as any).default
)
})
},
}

1
mango-console/src/hooks/useAppInfo.ts
View File

@@ -1,5 +1,4 @@
import packageInfo from '../../package.json'
export default function useAppInfo() {
return packageInfo
}

1
mango-console/src/hooks/useAxios.ts
View File

@@ -1,5 +1,4 @@
import axios from '../api/axios.config'
export default function () {
return axios
}

1
mango-console/src/hooks/useEcharts.ts
View File

@@ -1,5 +1,4 @@
import echarts from '../utils/echarts'
export default function useEcharts(dom: HTMLElement, theme?: string) {
let instance = echarts.getInstanceByDom(dom)
if (!instance) {

1
mango-console/src/hooks/useEmit.ts
View File

@@ -1,7 +1,6 @@
import { TinyEmitter } from 'tiny-emitter'
import { emitKey } from './../layouts/index'
import { inject } from 'vue'
export default function useEmit() {
return inject<TinyEmitter>(emitKey)
}

1
mango-console/src/hooks/useGet.ts
View File

@@ -1,5 +1,4 @@
import { get } from '../api/http'
export default function useGet() {
return get
}

1
mango-console/src/hooks/usePost.ts
View File

@@ -1,5 +1,4 @@
import { post } from '../api/http'
export default function usePost() {
return post
}

5
mango-console/src/hooks/usePut.ts
View File

@@ -1,5 +0,0 @@
import { http } from '@/api/http'
export default function useGet() {
return http
}

1
mango-console/src/layouts/Main.vue
View File

@@ -10,7 +10,6 @@
import useAppConfigStore from '@/store/modules/app-config'
import useCachedRouteStore from '@/store/modules/cached-routes'
import { defineComponent } from 'vue'
export default defineComponent({
name: 'Main',
setup() {

26
mango-console/src/layouts/MainLayout.vue
View File

@@ -27,10 +27,13 @@
</section>
<component
:is="appStore.isFixedNavBar ? 'Scrollbar' : 'div'"
class="main-base-style scrollbar"
class="main-base-style"
:class="[appStore.theme === 'light' ? 'main-base-light-theme' : 'main-base-dark-theme']"
>
<section class="main-section">
<section
class="main-section"
:class="[appStore.flexMainHeight ? 'flex-height' : 'min-height']"
>
<Main />
</section>
<section class="footer-wrapper">
@@ -43,7 +46,7 @@
</template>
<script lang="ts">
import { computed, defineComponent } from 'vue'
import { computed, defineComponent, onMounted } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { useTitle } from '@vueuse/core'
import { projectName } from '@/setting'
@@ -64,6 +67,10 @@
router.afterEach(() => {
useTitle(projectName + ' | ' + (route.meta.title as string))
})
onMounted(() => {
const mainEl = document.querySelector('.main-section') as HTMLDivElement
appStore.setMainHeight(mainEl.clientHeight || mainEl.offsetHeight)
})
return {
appStore,
isShowTabbar,
@@ -91,6 +98,9 @@
.nav-bar-open-status__ttb {
width: 100%;
}
:deep(.main-base-style .scrollbar__view) {
height: 100%;
}
.main-layout {
overflow-y: auto;
@@ -124,15 +134,21 @@
padding: 5px;
}
.main-base-light-theme {
background-color: #f0f2f5;
// background-color: #f0f2f5;
background-image: linear-gradient(#f0f2f5, rgba(var(--primary-1), 0.1), #f0f2f5);
}
.main-base-dark-theme {
background-color: #333333;
}
.main-section {
min-height: calc(100% - @footerHeight - 10px);
overflow-x: hidden;
}
.flex-height {
height: calc(100% - @footerHeight - 10px);
}
.min-height {
min-height: calc(100% - @footerHeight - 10px);
}
.fixed-nav-bar {
position: fixed;
top: 0;

15
mango-console/src/layouts/actions/index.vue
View File

@@ -59,13 +59,10 @@
const router = useRouter()
const route = useRoute()
const emitter = useEmit()
function onShowSearch() {
emitter?.emit('show-search')
}
const { isSupported, enter, isFullscreen, exit } = useFullscreen(document.documentElement)
function onScreenFull() {
if (!isSupported) {
Message.error('当前浏览器不支持全屏操作')
@@ -77,19 +74,15 @@
enter()
}
}
const debouncedFn = useDebounceFn(() => {
router.replace({ path: '/redirect' + route.path, query: route.query })
}, 200)
function onRefrehRoute() {
debouncedFn()
}
function onShowSetting() {
emitter?.emit('show-setting')
}
return {
settingRef,
showSearchContent,
@@ -112,7 +105,6 @@
display: flex;
align-items: center;
z-index: 1;
.action-item {
min-width: 40px;
display: flex;
@@ -120,20 +112,13 @@
align-items: center;
font-size: 18px;
height: 100%;
&:hover {
cursor: pointer;
background-color: var(--color-secondary-hover);
}
:deep(.arco-badge-number, .arco-badge-dot, .arco-badge-text, .arco-badge-custom-dot) {
transform: translate(10%, 20%);
}
}
}
.garden {
width: 200px;
height: 30px;
}
</style>

4
mango-console/src/layouts/footer/index.vue
View File

@@ -1,7 +1,5 @@
<template>
<a-card class="footer-container card-border-radius" :bordered="false">
Copyright © {{ projectName }} 2024</a-card
>
<a-card class="footer-container" :bordered="false"> Copyright © {{ projectName }} 2023 </a-card>
</template>
<script lang="ts">

11
mango-console/src/layouts/index.ts
View File

@@ -1,5 +1,5 @@
import '../styles/transition.css'
import { App, inject } from 'vue'
import { App } from 'vue'
import { TinyEmitter } from 'tiny-emitter'
import { toHump } from '../utils'
@@ -20,7 +20,7 @@ function getComponentName(key: string) {
.find(
(it) =>
it !== 'index.vue' &&
it !== 'user.ts' &&
it !== 'index.ts' &&
it !== 'index.js' &&
it !== 'index.jsx' &&
it !== 'index.tsx'
@@ -31,10 +31,13 @@ function getComponentName(key: string) {
}
export function registerComponents(app: App) {
const components = import.meta.globEager('./**/**.{vue,tsx}')
const components = import.meta.glob('./**/**.{vue,tsx}', { eager: true })
Object.keys({ ...components }).forEach((it: string) => {
const component = components[it]
app.component(component.default.name || toHump(getComponentName(it)), component.default)
app.component(
(component as any).default.name || toHump(getComponentName(it)),
(component as any).default
)
})
}

2
mango-console/src/layouts/logo/index.vue
View File

@@ -45,7 +45,7 @@
? 'var(--color-menu-dark-bg)'
: 'transparent'
}
return 'var(--color-white)'
return 'transparent'
} else {
return appStore.theme === ThemeMode.DARK
? 'var(--color-menu-dark-bg)'

4
mango-console/src/layouts/setting/index.vue
View File

@@ -77,7 +77,7 @@
<a-divider dashed>按钮显示</a-divider>
<div class="setting-item-wrapper">
<span>固定顶部导航</span>
<a-switch v-model="appStore.isFixedNavBar" :disabled="appStore.layoutMode === 'ltr'" />
<a-switch v-model="appStore.isFixedNavBar" :disabled="appStore.layoutMode === 'ttb'" />
</div>
<div class="setting-item-wrapper">
<span>搜索</span>
@@ -107,7 +107,7 @@
import { useMenuWidth } from '@/hooks/useMenuWidth'
import LeftBg from '@/assets/bg_img.webp'
import useAppConfigStore from '@/store/modules/app-config'
import { PageAnim, ThemeMode } from '@/store/types'
import { ThemeMode } from '@/store/types'
export default defineComponent({
name: 'Setting',
setup() {

32
mango-console/src/layouts/sidebar/InnerSideBar.vue
View File

@@ -86,12 +86,9 @@
}
}
}
:deep(
.arco-menu-dark .arco-menu-item:hover,
.arco-menu-dark .arco-menu-group-title:hover,
.arco-menu-dark .arco-menu-pop-header:hover,
.arco-menu-dark .arco-menu-inline-header:hover
) {
:deep(.arco-menu-dark .arco-menu-item:hover, .arco-menu-dark
.arco-menu-group-title:hover, .arco-menu-dark .arco-menu-pop-header:hover, .arco-menu-dark
.arco-menu-inline-header:hover) {
color: rgb(var(--primary-6)) !important;
& .arco-menu-icon {
color: rgb(var(--primary-6)) !important;
@@ -134,12 +131,9 @@
}
}
}
:deep(
.arco-menu-dark .arco-menu-item:hover,
.arco-menu-dark .arco-menu-group-title:hover,
.arco-menu-dark .arco-menu-pop-header:hover,
.arco-menu-dark .arco-menu-inline-header:hover
) {
:deep(.arco-menu-dark .arco-menu-item:hover, .arco-menu-dark
.arco-menu-group-title:hover, .arco-menu-dark .arco-menu-pop-header:hover, .arco-menu-dark
.arco-menu-inline-header:hover) {
color: var(--color-white) !important;
& .arco-menu-icon {
color: var(--color-white) !important;
@@ -169,6 +163,20 @@
}
.sidebar-bg-light {
background-color: #fff;
:deep(.arco-menu-light .arco-menu-item.arco-menu-selected) {
position: relative;
&::after {
position: absolute;
top: 0;
right: 0;
content: '';
display: block;
border-radius: 3px;
width: 3px;
height: 100%;
background-color: rgb(var(--primary-6));
}
}
}
.open-status {
width: @menuWidth;

58
mango-console/src/layouts/sidebar/SideBar.vue
View File

@@ -16,7 +16,6 @@
import usePermissionStore from '@/store/modules/permission'
import { SideTheme } from '@/store/types'
import { computed, defineComponent } from 'vue'
export default defineComponent({
name: 'SideBar',
props: {
@@ -50,149 +49,110 @@
.sidebar-bg-img {
background-image: url('../../assets/bg_img.webp') !important;
background-size: cover;
:deep(.logo-wrapper .logo-title) {
color: #fff !important;
}
:deep(.arco-menu) {
background-color: transparent !important;
}
:deep(.arco-menu-inline-header) {
background-color: transparent !important;
}
:deep(.arco-menu-dark .arco-menu-pop-header) {
background-color: transparent !important;
}
:deep(.arco-menu-item) {
background-color: transparent !important;
}
:deep(.arco-menu-dark .arco-menu-item.arco-menu-selected) {
color: rgb(var(--primary-6));
& .arco-menu-icon {
color: rgb(var(--primary-6)) !important;
& .arco-icon {
color: currentColor !important;
}
}
}
:deep(
.arco-menu-dark .arco-menu-item:hover,
.arco-menu-dark .arco-menu-group-title:hover,
.arco-menu-dark .arco-menu-pop-header:hover,
.arco-menu-dark .arco-menu-inline-header:hover
) {
:deep(.arco-menu-dark .arco-menu-item:hover, .arco-menu-dark
.arco-menu-group-title:hover, .arco-menu-dark .arco-menu-pop-header:hover, .arco-menu-dark
.arco-menu-inline-header:hover) {
color: rgb(var(--primary-6)) !important;
& .arco-menu-icon {
color: rgb(var(--primary-6)) !important;
& .arco-icon {
color: currentColor !important;
}
}
}
:deep(.arco-menu-dark .arco-menu-inline-header:hover) {
color: rgb(var(--primary-6)) !important;
& .arco-menu-icon {
color: rgb(var(--primary-6)) !important;
& .arco-icon {
color: currentColor !important;
}
}
}
:deep(.arco-menu-dark .arco-menu-pop-header:hover) {
color: rgb(var(--primary-6)) !important;
& .arco-menu-icon {
color: rgb(var(--primary-6)) !important;
& .arco-icon {
color: currentColor !important;
}
}
}
}
.sidebar-bg-dark {
background-color: var(--color-menu-dark-bg);
:deep(.logo-wrapper .logo-title) {
color: #fff !important;
}
:deep(.arco-menu-dark .arco-menu-item.arco-menu-selected) {
color: var(--color-white);
background-color: rgba(var(--primary-6), 0.3);
& .arco-menu-icon {
color: var(--color-white) !important;
& .arco-icon {
color: currentColor !important;
}
}
}
:deep(
.arco-menu-dark .arco-menu-item:hover,
.arco-menu-dark .arco-menu-group-title:hover,
.arco-menu-dark .arco-menu-pop-header:hover,
.arco-menu-dark .arco-menu-inline-header:hover
) {
:deep(.arco-menu-dark .arco-menu-item:hover, .arco-menu-dark
.arco-menu-group-title:hover, .arco-menu-dark .arco-menu-pop-header:hover, .arco-menu-dark
.arco-menu-inline-header:hover) {
color: var(--color-white) !important;
& .arco-menu-icon {
color: var(--color-white) !important;
& .arco-icon {
color: currentColor !important;
}
}
}
:deep(.arco-menu-dark .arco-menu-inline-header:hover) {
color: rgb(var(--primary-6)) !important;
& .arco-menu-icon {
color: rgb(var(--primary-6)) !important;
& .arco-icon {
color: currentColor !important;
}
}
}
:deep(.arco-menu-dark .arco-menu-pop-header:hover) {
color: rgb(var(--primary-6)) !important;
& .arco-menu-icon {
color: rgb(var(--primary-6)) !important;
& .arco-icon {
color: currentColor !important;
}
}
}
}
.sidebar-bg-light {
background-color: #fff;
:deep(.arco-menu-light .arco-menu-item.arco-menu-selected) {
position: relative;
&::after {
position: absolute;
top: 0;
@@ -206,19 +166,16 @@
}
}
}
.open-status {
width: @menuWidth;
box-shadow: 2px 5px 10px rgba(0, 0, 0, 0.12);
transition: all @transitionTime;
}
.close-status {
width: @minMenuWidth;
box-shadow: none;
transition: all @transitionTime;
}
.vaw-side-bar-wrapper {
position: fixed;
top: 0;
@@ -227,20 +184,17 @@
height: 100%;
box-sizing: border-box;
z-index: 999;
.vaw-menu-wrapper {
overflow-x: hidden;
color: white;
}
}
.is-mobile {
.open-status {
width: @menuWidth;
transform: translateX(0);
transition: transform @transitionTime;
}
.close-status {
width: @menuWidth;
@negativeMenuWidth: calc(@menuWidth * -1);

18
mango-console/src/layouts/tabbar/index.vue
View File

@@ -82,7 +82,6 @@
} from '@arco-design/web-vue/es/icon'
import useVisitedRouteStore from '@/store/modules/visited-routes'
import { RouteLocationNormalized, RouteRecordRaw } from 'vue-router'
export default defineComponent({
name: 'TabBar',
components: {
@@ -270,38 +269,31 @@
:deep(.arco-btn-outline) {
border: 1px solid rgba(var(--primary-5), 0.7) !important;
color: rgba(var(--primary-5), 0.7) !important;
&:hover {
border: 1px solid rgba(var(--primary-5), 1) !important;
color: rgba(var(--primary-5), 1) !important;
}
}
:deep(.arco-btn-disabled) {
background-color: transparent !important;
color: rgba(var(--primary-5), 0.7) !important;
}
:deep(.arco-btn-primary) {
background-color: rgba(var(--primary-5), 0.8) !important;
&:hover {
background-color: rgba(var(--primary-5), 1) !important;
}
}
.vaw-tab-bar-container {
:deep(.arco-btn-size-small) {
padding: 0 8px;
height: 24px;
}
position: relative;
height: @tabHeight;
box-sizing: border-box;
white-space: nowrap;
box-shadow: 10px 5px 10px rgb(0 0 0 / 10%);
.contex-menu-wrapper {
position: absolute;
width: 130px;
@@ -310,24 +302,20 @@
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
background-color: #fff;
padding-left: 0;
& > li {
width: 100%;
box-sizing: border-box;
display: flex;
align-items: center;
padding: 5px 0;
& button {
width: 100%;
}
}
& > li:hover {
color: var(--primary-color);
}
}
.humburger-wrapper {
position: absolute;
top: 0;
@@ -338,12 +326,10 @@
align-items: center;
height: 100%;
}
.tab-humburger-wrapper {
margin-left: 40px;
transition: margin-left @transitionTime;
}
.tab-no-humburger-wrapper {
margin-left: 0;
transition: margin-left @transitionTime;
@@ -355,7 +341,6 @@
justify-content: center;
align-items: center;
font-size: 12px;
.icon-item {
margin-left: 0;
width: 0;
@@ -363,7 +348,6 @@
display: inline-flex;
overflow: hidden;
}
&:hover {
.icon-item {
display: inline-flex;
@@ -381,14 +365,12 @@
}
}
}
.arrow-wrapper {
cursor: pointer;
font-size: 16px;
margin: 0 8px;
display: inline-flex;
}
.arrow-wrapper__disabled {
cursor: not-allowed;
color: #b9b9b9;

2
mango-console/src/router/guard/permission.ts
View File

@@ -13,7 +13,7 @@ function usePermissionGuard() {
if (userStore.isTokenExpire()) {
return {
path: '/login',
// query: { redirect: to.fullPath }
query: { redirect: to.fullPath },
}
}
const permissionStore = usePermissionStore()

1
mango-console/src/store/help/index.ts
View File

@@ -136,7 +136,6 @@ export function mapTwoLevelRouter(srcRoutes: Array<RouteRecordRaw>) {
}
})
}
if (srcRoutes && srcRoutes.length > 0) {
const tempRoutes = [] as Array<any>
srcRoutes.forEach((it) => {

8
mango-console/src/store/modules/permission.ts
View File

@@ -3,7 +3,7 @@ import { defineStore } from 'pinia'
import useUserStore from './user'
import router from '@/router'
import { baseAddress, getMenuListByRoleId } from '@/api/url'
import { get } from '@/api/http'
import { post } from '@/api/http'
import { defaultRoutes } from '@/router/routes/default-routes'
import { findRootPathRoute, generatorRoutes, mapTwoLevelRouter } from '../help'
import { constantRoutes } from '@/router/routes/constants'
@@ -41,14 +41,12 @@ const usePermissionStore = defineStore('permission-route', {
async getRoutes(data: { userId: number; roleId: number }) {
try {
if (getMenuListByRoleId) {
const res = await get({
const res = await post({
url: baseAddress + getMenuListByRoleId,
// 在实际的开发中，这个地方可以换成 token，让后端解析用户信息获取 userId 和 roleId，前端可以不用传 userId 和 roleId。
// 这样可以增加安全性
// 用户数据
// data,
data,
})
return generatorRoutes(res.data)
} else {
return generatorRoutes(defaultRoutes)

46
mango-console/src/store/modules/visited-routes.ts
View File

@@ -1,8 +1,8 @@
import { defineStore } from 'pinia'
import { RouteLocationNormalized } from 'vue-router'
import pinia from '../pinia'
import useCachedRouteStore from '@/store/modules/cached-routes'
import { findCachedRoutes } from '../help'
// import useCachedRouteStore from '@/store/modules/cached-routes'
// import { findCachedRoutes } from '../help'
const visitedRoutes = JSON.parse(localStorage.getItem('visited-routes') || '[]')
@@ -30,12 +30,12 @@ const useVisitedRouteStore = defineStore('visited-routes', {
addVisitedRoute(route: RouteLocationNormalized) {
return new Promise((resolve) => {
if (!this.visitedRoutes.find((it) => it.fullPath === route.fullPath)) {
if (route.name) {
const cachedRoutesStore = useCachedRouteStore()
if (!cachedRoutesStore.cachedRoutes.includes(route.name as string)) {
cachedRoutesStore.cachedRoutes.push(route.name as string)
}
}
// if (route.name) {
// const cachedRoutesStore = useCachedRouteStore()
// if (!cachedRoutesStore.cachedRoutes.includes(route.name as string)) {
// cachedRoutesStore.cachedRoutes.push(route.name as string)
// }
// }
this.visitedRoutes.push(route)
this.persistentVisitedView()
@@ -46,15 +46,15 @@ const useVisitedRouteStore = defineStore('visited-routes', {
removeVisitedRoute(route: RouteLocationNormalized) {
return new Promise<string>((resolve) => {
this.visitedRoutes.splice(this.visitedRoutes.indexOf(route), 1)
if (route.name) {
const cachedRoutesStore = useCachedRouteStore()
if (cachedRoutesStore.cachedRoutes.includes(route.name as string)) {
cachedRoutesStore.cachedRoutes.splice(
cachedRoutesStore.cachedRoutes.indexOf(route.name as string),
1
)
}
}
// if (route.name) {
// const cachedRoutesStore = useCachedRouteStore()
// if (cachedRoutesStore.cachedRoutes.includes(route.name as string)) {
// cachedRoutesStore.cachedRoutes.splice(
// cachedRoutesStore.cachedRoutes.indexOf(route.name as string),
// 1
// )
// }
// }
this.persistentVisitedView()
resolve(this.findLastRoutePath())
})
@@ -71,8 +71,8 @@ const useVisitedRouteStore = defineStore('visited-routes', {
this.visitedRoutes = this.visitedRoutes.filter((it, index) => {
return (it.meta && it.meta.affix) || index >= selectIndex
})
const cachedRoutesStore = useCachedRouteStore()
cachedRoutesStore.setCachedRoutes(findCachedRoutes(this.visitedRoutes))
// const cachedRoutesStore = useCachedRouteStore()
// cachedRoutesStore.setCachedRoutes(findCachedRoutes(this.visitedRoutes))
this.persistentVisitedView()
}
resolve(selectRoute)
@@ -85,8 +85,8 @@ const useVisitedRouteStore = defineStore('visited-routes', {
this.visitedRoutes = this.visitedRoutes.filter((it, index) => {
return (it.meta && it.meta.affix) || index <= selectIndex
})
const cachedRoutesStore = useCachedRouteStore()
cachedRoutesStore.setCachedRoutes(findCachedRoutes(this.visitedRoutes))
// const cachedRoutesStore = useCachedRouteStore()
// cachedRoutesStore.setCachedRoutes(findCachedRoutes(this.visitedRoutes))
this.persistentVisitedView()
}
resolve(selectRoute)
@@ -97,8 +97,8 @@ const useVisitedRouteStore = defineStore('visited-routes', {
this.visitedRoutes = this.visitedRoutes.filter((it) => {
return it.meta && it.meta.affix
})
const cachedRoutesStore = useCachedRouteStore()
cachedRoutesStore.setCachedRoutes(findCachedRoutes(this.visitedRoutes))
// const cachedRoutesStore = useCachedRouteStore()
// cachedRoutesStore.setCachedRoutes(findCachedRoutes(this.visitedRoutes))
this.persistentVisitedView()
resolve()
})

199
mango-console/src/styles/common.less
View File

@@ -1,199 +0,0 @@
:root {
--nprogress-color: @primary-color;
}
/* 滚动条凹槽的颜色，还可以设置边框属性 */
*::-webkit-scrollbar-track-piece {
border-radius: 2em;
background-color: transparent;
}
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
font-family: 'PingFang SC', 'Helvetica Neue', Helvetica, 'Hiragino Sans GB', 'Microsoft YaHei',
Arial, sans-serif;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
-webkit-tap-highlight-color: transparent;
-webkit-overflow-scrolling: touch;
}
li:not(.ant-image-preview-operations-operation) {
list-style: auto !important;
}
i {
font-style: normal;
}
input {
border: none;
outline: none;
&:-webkit-autofill {
box-shadow: 0 0 0 1000px #e6e8ed inset !important;
}
}
button {
border: 0;
outline: none;
appearance: none;
}
label {
font-weight: 700;
}
*,
*::before,
*::after {
box-sizing: inherit;
}
div:focus,
span:focus,
i:focus {
outline: none;
}
a:focus,
a:active {
outline: none;
}
a,
a:focus,
a:hover {
color: inherit;
text-decoration: none;
cursor: pointer;
}
div:focus,
span:focus,
i:focus {
outline: none;
}
h3 {
margin: 0;
padding: 0;
font-size: 18px;
line-height: 26px;
}
p {
margin: 0;
padding: 0;
}
.common-container {
position: relative;
width: 100%;
height: 100%;
padding: 0 24px;
}
@media (width >= 1900px) {
.common-container,
.layout-header {
width: 1440px !important;
margin: 0 auto;
}
}
.common-header {
display: flex;
position: sticky;
z-index: 10;
top: 0;
align-items: center;
height: var(--header-height);
margin-bottom: 6px;
padding: 0 24px;
background-color: #f4f5f9;
font-size: 22px;
line-height: var(--header-height);
span {
font-weight: 500;
}
}
// 适用于主内容区灰底色，上下布局，下部自适应，白色背景，衔接处10px边距
.common-container-grey {
display: flex;
position: relative;
flex-direction: column;
width: 100%;
height: 100%;
background-color: #f3f3f3;
&__header {
margin-bottom: 10px;
padding: 22px 24px;
background-color: #fff;
}
&__block {
margin-bottom: 10px;
padding: 24px;
background-color: #fff;
.title {
display: flex;
align-items: center;
justify-content: flex-start;
padding-bottom: 10px;
font-size: 16px;
font-weight: 500;
}
}
&__body {
flex: 1;
padding: 22px 16px;
background-color: #fff;
}
// 适用于主内容区灰底色，上下布局下部自适应，白色背景，衔接处10px边距，下半部分内左右分区，左边自适应
&__body_partition {
display: flex;
flex: 1;
.lf {
flex: 1;
margin-right: 10px;
padding: 22px 16px;
background-color: #fff;
}
.rf {
padding: 22px 16px;
background-color: #fff;
}
}
}
.gk-window {
.msg-resource-messge,
.msg-content-messge {
margin-left: 0 !important;
}
.guide-box {
.guide-title {
font-size: 24px !important;
}
.guide-subtitle {
font-size: 20px !important;
}
}
}

17
mango-console/src/styles/index.css
View File

@@ -1,6 +1,7 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
:root {
--menu-width: 210px;
}
@@ -50,11 +51,11 @@ object {
.card-border-radius {
border-radius: var(--border-radius-large) !important;
}
.card-border-radius:hover {
.card-border-radius:hover{
box-shadow: 0px 0px 10px #ddd;
}
.arco-pagination-item-active {
.arco-pagination-item-active{
color: var(--color-white) !important;
}
@@ -62,11 +63,13 @@ object {
color: var(--color-white) !important;
}
.arco-btn-disabled {
.arco-btn-disabled{
background-color: rgba(var(--primary-1), 0.6) !important;
}
/*.arco-card {*/
/* border-radius: 10px; !* 设置全局卡片的圆角 *!*/
/* overflow: hidden; !* 确保内容不超出圆角 *!*/
/*}*/
.arco-switch {
background-color: var(--color-fill-4);
}
.arco-switch-checked{
background-color: rgb(var(--primary-6));
}

2
mango-console/src/types/components.ts
View File

@@ -24,7 +24,7 @@ export interface SelectOptionItem {
export interface TableSearchItem {
key: string | number
label: string
value: any
value: Ref<any>
placeholder?: string
associatedOption?: string
onChange?: (value: any, associationItem: string) => void

1
mango-console/src/views/exception/403.vue
View File

@@ -7,7 +7,6 @@
<script lang="ts">
import { defineComponent } from 'vue'
import ExceptionStatus from './components/ExceptionStatus.vue'
export default defineComponent({
name: 'Page403',
components: {

1
mango-console/src/views/exception/404.vue
View File

@@ -7,7 +7,6 @@
<script lang="ts">
import { defineComponent } from 'vue'
import ExceptionStatus from './components/ExceptionStatus.vue'
export default defineComponent({
name: 'Page404',
components: {

1
mango-console/src/views/exception/500.vue
View File

@@ -7,7 +7,6 @@
<script lang="ts">
import { defineComponent } from 'vue'
import ExceptionStatus from './components/ExceptionStatus.vue'
export default defineComponent({
name: 'Page500',
components: {

6
mango-console/src/views/exception/components/ExceptionStatus.vue
View File

@@ -6,7 +6,7 @@
<div class="title">
<div>{{ statusTip }}</div>
<div class="margin-top-lg">
<a-button type="primary" size="small" @click="backHome"> 返回首页</a-button>
<a-button type="primary" size="small" @click="backHome"> 返回首页 </a-button>
</div>
</div>
</div>
@@ -17,7 +17,6 @@
import image_403 from '@/assets/img_403.png'
import image_500 from '@/assets/img_500.png'
import { defineComponent } from 'vue'
export default defineComponent({
name: 'ExceptionStatus',
props: {
@@ -65,16 +64,13 @@
.exception-container {
text-align: center;
height: 100%;
.img-wrapper {
width: 80%;
margin: 0 auto;
& > img {
width: 100%;
}
}
.title {
margin-top: -50px;
}

6
mango-console/src/views/index/components/chart/CaseSum.vue
View File

@@ -105,8 +105,10 @@
setTimeout(() => {
loading.value = false
nextTick(() => {
useEcharts(channelsChart.value as HTMLDivElement).setOption(option)
})
if (channelsChart.value) {
useEcharts(channelsChart.value as HTMLDivElement).setOption(option);
}
});
}, 1000)
}
const updateChart = () => {

5
mango-console/src/views/index/components/chart/FullYearSalesChart.vue
View File

@@ -119,7 +119,10 @@
setTimeout(() => {
loading.value = false
setTimeout(() => {
nextTick(() => useEcharts(fullYearSalesChart.value as HTMLDivElement).setOption(option))
nextTick(() => {
if (fullYearSalesChart.value){
useEcharts(fullYearSalesChart.value as HTMLDivElement).setOption(option)}
})
}, 100)
}, 1000)
}

5
mango-console/src/views/index/components/chart/HotProductChart.vue
View File

@@ -84,7 +84,10 @@
setTimeout(() => {
loading.value = false
setTimeout(() => {
nextTick(() => useEcharts(hotProdChart.value as HTMLDivElement).setOption(option))
nextTick(() =>{
if (hotProdChart.value){
useEcharts(hotProdChart.value as HTMLDivElement).setOption(option)}
})
}, 100)
}, 1000)
}

4
mango-console/src/views/index/components/chart/RreportSum.vue
View File

@@ -105,7 +105,9 @@
setTimeout(() => {
loading.value = false
nextTick(() => {
useEcharts(channelsChart.value as HTMLDivElement).setOption(option)
if (channelsChart.value) {
useEcharts(channelsChart.value as HTMLDivElement).setOption(option);
}
})
}, 1000)
}

12
mango-console/src/views/index/components/css/title.module.less
View File

@@ -1,19 +1,17 @@
.title-container {
.title-container{
@text-color: #000;
display: flex;
justify-content: flex-start;
align-items: center;
position: relative;
align-items: center;
position: relative;
padding: 10px;
.title {
.title{
color: var(--color-text-2);
font-size: 16px;
font-weight: bold;
vertical-align: middle;
}
.line {
.line{
display: inline-block;
background-color: rgb(var(--primary-1));
margin-right: 10px;