mirror of https://github.com/dtm-labs/dtm.git
yedf2
4 years ago
38 changed files with 4277 additions and 0 deletions
@ -0,0 +1,2 @@ |
|||||
|
VITE_PROXY=[["/api", "http://localhost:36789"]] |
||||
|
VITE_ADMIN_VERSION="v0.0.0-dev" |
||||
@ -0,0 +1,68 @@ |
|||||
|
module.exports = { |
||||
|
parser: "vue-eslint-parser", |
||||
|
"env": { |
||||
|
"browser": true, |
||||
|
"es2021": true |
||||
|
}, |
||||
|
"extends": [ |
||||
|
"plugin:@typescript-eslint/recommended", |
||||
|
"plugin:vue/vue3-recommended" |
||||
|
], |
||||
|
"parserOptions": { |
||||
|
"parser": "@typescript-eslint/parser", |
||||
|
"sourceType": "module", |
||||
|
ecmaFeature: { |
||||
|
jsx: true, |
||||
|
tsx: true |
||||
|
} |
||||
|
}, |
||||
|
"plugins": [ |
||||
|
"@typescript-eslint" |
||||
|
], |
||||
|
"rules": { |
||||
|
'vue/max-attributes-per-line': ['error', { |
||||
|
singleline: 10, |
||||
|
multiline: { |
||||
|
max: 1, |
||||
|
allowFirstLine: false |
||||
|
} |
||||
|
}], |
||||
|
'vue/singleline-html-element-content-newline': 'off', |
||||
|
'vue/multiline-html-element-content-newline': 'off', |
||||
|
'vue/html-indent': ['error', 4], |
||||
|
indent: ['error', 4], // 4行缩进
|
||||
|
'vue/script-indent': ['error', 4], |
||||
|
quotes: ['error', 'single'], // 单引号
|
||||
|
// 'vue/html-quotes': ['error', 'single'],
|
||||
|
semi: ['error', 'never'], // 禁止使用分号
|
||||
|
'space-infix-ops': ['error', { int32Hint: false }], // 要求操作符周围有空格
|
||||
|
'no-multi-spaces': 'error', // 禁止多个空格
|
||||
|
'no-whitespace-before-property': 'error', // 禁止在属性前使用空格
|
||||
|
'space-before-blocks': 'error', // 在块之前强制保持一致的间距
|
||||
|
'space-before-function-paren': ['error', 'never'], // 在“ function”定义打开括号之前强制不加空格
|
||||
|
'space-in-parens': ['error', 'never'], // 强制括号左右的不加空格
|
||||
|
'spaced-comment': ['error', 'always'], // 注释间隔
|
||||
|
'template-tag-spacing': ['error', 'always'], // 在模板标签及其文字之间需要空格
|
||||
|
'no-var': 'error', |
||||
|
'prefer-destructuring': ['error', { // 优先使用数组和对象解构
|
||||
|
array: true, |
||||
|
object: true |
||||
|
}, { |
||||
|
enforceForRenamedProperties: false |
||||
|
}], |
||||
|
'comma-dangle': ['error', 'never'], // 最后一个属性不允许有逗号
|
||||
|
'arrow-spacing': 'error', // 箭头函数空格
|
||||
|
'prefer-template': 'error', |
||||
|
'template-curly-spacing': 'error', |
||||
|
'quote-props': ['error', 'as-needed'], // 对象字面量属性名称使用引号
|
||||
|
'object-curly-spacing': ['error', 'always'], // 强制在花括号中使用一致的空格
|
||||
|
'no-unneeded-ternary': 'error', // 禁止可以表达为更简单结构的三元操作符
|
||||
|
'no-restricted-syntax': ['error', 'WithStatement', 'BinaryExpression[operator="in"]'], // 禁止with/in语句
|
||||
|
'no-lonely-if': 'error', // 禁止 if 语句作为唯一语句出现在 else 语句块中
|
||||
|
'newline-per-chained-call': ['error', { ignoreChainWithDepth: 2 }], // 要求方法链中每个调用都有一个换行符
|
||||
|
// 路径别名设置
|
||||
|
'no-submodule-imports': ['off', '/@'], |
||||
|
'no-implicit-dependencies': ['off', ['/@']], |
||||
|
'@typescript-eslint/no-explicit-any': 'off' // 类型可以使用any
|
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,24 @@ |
|||||
|
# Logs |
||||
|
logs |
||||
|
*.log |
||||
|
npm-debug.log* |
||||
|
yarn-debug.log* |
||||
|
yarn-error.log* |
||||
|
pnpm-debug.log* |
||||
|
lerna-debug.log* |
||||
|
|
||||
|
node_modules |
||||
|
dist |
||||
|
dist-ssr |
||||
|
*.local |
||||
|
|
||||
|
# Editor directories and files |
||||
|
.vscode/* |
||||
|
!.vscode/extensions.json |
||||
|
.idea |
||||
|
.DS_Store |
||||
|
*.suo |
||||
|
*.ntvs* |
||||
|
*.njsproj |
||||
|
*.sln |
||||
|
*.sw? |
||||
@ -0,0 +1 @@ |
|||||
|
# DTM-Admin |
||||
@ -0,0 +1,13 @@ |
|||||
|
<!DOCTYPE html> |
||||
|
<html lang="en"> |
||||
|
<head> |
||||
|
<meta charset="UTF-8" /> |
||||
|
<link rel="icon" href="/favicon.ico" /> |
||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
||||
|
<title>Vite App</title> |
||||
|
</head> |
||||
|
<body> |
||||
|
<div id="app"></div> |
||||
|
<script type="module" src="/src/main.ts"></script> |
||||
|
</body> |
||||
|
</html> |
||||
@ -0,0 +1,39 @@ |
|||||
|
{ |
||||
|
"name": "dtm-admin", |
||||
|
"private": true, |
||||
|
"version": "0.0.0", |
||||
|
"scripts": { |
||||
|
"dev": "vite", |
||||
|
"build": "vite build", |
||||
|
"preview": "vite preview" |
||||
|
}, |
||||
|
"dependencies": { |
||||
|
"ant-design-vue": "^3.1.1", |
||||
|
"vue": "^3.2.25", |
||||
|
"vue-request": "^1.2.4" |
||||
|
}, |
||||
|
"devDependencies": { |
||||
|
"@types/node": "^17.0.23", |
||||
|
"@types/nprogress": "^0.2.0", |
||||
|
"@typescript-eslint/eslint-plugin": "^5.18.0", |
||||
|
"@typescript-eslint/parser": "^5.18.0", |
||||
|
"@vitejs/plugin-vue": "^2.3.0", |
||||
|
"autoprefixer": "^10.4.4", |
||||
|
"axios": "^0.26.1", |
||||
|
"eslint": "^8.13.0", |
||||
|
"eslint-plugin-vue": "^8.6.0", |
||||
|
"nprogress": "^0.2.0", |
||||
|
"pinia": "^2.0.0-rc.10", |
||||
|
"postcss": "^8.4.12", |
||||
|
"postcss-import": "^14.1.0", |
||||
|
"postcss-nested": "^5.0.6", |
||||
|
"postcss-simple-vars": "^6.0.3", |
||||
|
"tailwindcss": "^3.0.24", |
||||
|
"typescript": "^4.5.4", |
||||
|
"unplugin-vue-components": "^0.19.3", |
||||
|
"vite": "^2.9.1", |
||||
|
"vite-plugin-svg-icons": "^1.1.0", |
||||
|
"vue-router": "^4.0.13", |
||||
|
"vue-tsc": "^0.29.8" |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,6 @@ |
|||||
|
module.exports = { |
||||
|
plugins: { |
||||
|
tailwindcss: {}, |
||||
|
autoprefixer: {}, |
||||
|
}, |
||||
|
} |
||||
|
After Width: | Height: | Size: 4.2 KiB |
@ -0,0 +1,6 @@ |
|||||
|
<template> |
||||
|
<router-view /> |
||||
|
</template> |
||||
|
|
||||
|
<script setup lang="ts"></script> |
||||
|
|
||||
@ -0,0 +1,22 @@ |
|||||
|
import { AxiosResponse } from 'axios' |
||||
|
import request from '/@/utils/request' |
||||
|
|
||||
|
export interface IListAllTransactionsReq { |
||||
|
limit: number |
||||
|
position?: number |
||||
|
} |
||||
|
|
||||
|
export function listAllTransactions<T>(payload: IListAllTransactionsReq): Promise<AxiosResponse<T>> { |
||||
|
return request({ |
||||
|
url: '/api/dtmsvr/all', |
||||
|
method: 'get', |
||||
|
params: payload |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
export function getDtmVersion(): Promise<AxiosResponse<any>> { |
||||
|
return request({ |
||||
|
url: '/api/dtmsvr/version', |
||||
|
method: 'get', |
||||
|
}) |
||||
|
} |
||||
@ -0,0 +1,3 @@ |
|||||
|
/* @tailwind base; */ |
||||
|
@tailwind components; |
||||
|
@tailwind utilities; |
||||
@ -0,0 +1,14 @@ |
|||||
|
// generated by unplugin-vue-components
|
||||
|
// We suggest you to commit this file into source control
|
||||
|
// Read more: https://github.com/vuejs/vue-next/pull/3399
|
||||
|
import '@vue/runtime-core' |
||||
|
|
||||
|
declare module '@vue/runtime-core' { |
||||
|
export interface GlobalComponents { |
||||
|
RouterLink: typeof import('vue-router')['RouterLink'] |
||||
|
RouterView: typeof import('vue-router')['RouterView'] |
||||
|
SvgIcon: typeof import('./components/SvgIcon/index.vue')['default'] |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
export {} |
||||
@ -0,0 +1,42 @@ |
|||||
|
<template> |
||||
|
<div v-if="isExternal" :style="styleExternalIcon" class="svg-external-icon svg-icon" /> |
||||
|
<svg v-else :class="svgClass" aria-hidden="true"> |
||||
|
<use :xlink:href="iconName" /> |
||||
|
</svg> |
||||
|
</template> |
||||
|
<script setup lang='ts'> |
||||
|
|
||||
|
const props = defineProps({ |
||||
|
iconClass: { |
||||
|
type: String, |
||||
|
required: true |
||||
|
}, |
||||
|
className: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
const isExternal = /^(https?:|mailto:|tel:)/.test(props.iconClass) |
||||
|
const iconName = `#icon-${props.iconClass}` |
||||
|
const svgClass = props.className ? `svg-icon ${props.className}` : 'svg-icon ' |
||||
|
const styleExternalIcon = () => { |
||||
|
return { |
||||
|
mask: `url(${props.iconClass}) no-repeat 50% 50%`, |
||||
|
'-webkit-mask': `url(${props.iconClass}) no-repeat 50% 50%` |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="postcss" scoped> |
||||
|
.svg-icon { |
||||
|
vertical-align: -0.15em; |
||||
|
fill: currentColor; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
.svg-external-icon { |
||||
|
background-color: currentColor; |
||||
|
mask-size: cover !important; |
||||
|
display: inline-block; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1 @@ |
|||||
|
# ICon Component |
||||
|
After Width: | Height: | Size: 1.3 KiB |
@ -0,0 +1,78 @@ |
|||||
|
<template> |
||||
|
<a-layout> |
||||
|
<a-layout-sider width="200" style="background: #fff"> |
||||
|
<Sidebar /> |
||||
|
</a-layout-sider> |
||||
|
<a-layout style="padding: 0 24px 24px"> |
||||
|
<div v-if="layout.dtmVersion && layout.dtmVersion != dashVer" style="color:#f00"> !!! admin version: {{dashVer}} != dtm version: {{layout.dtmVersion}}. </div> |
||||
|
<a-breadcrumb style="margin: 16px 0"> |
||||
|
<a-breadcrumb-item>{{ mainNav }}</a-breadcrumb-item> |
||||
|
<a-breadcrumb-item>{{ subNav }}</a-breadcrumb-item> |
||||
|
<a-breadcrumb-item>{{ page }}</a-breadcrumb-item> |
||||
|
</a-breadcrumb> |
||||
|
<a-layout-content |
||||
|
:style="{ background: '#fff', padding: '24px', margin: 0, minHeight: '280px' }" |
||||
|
> |
||||
|
<Content /> |
||||
|
</a-layout-content> |
||||
|
</a-layout> |
||||
|
</a-layout> |
||||
|
</template> |
||||
|
|
||||
|
<script setup lang='ts'> |
||||
|
import Sidebar from './components/sidebar.vue' |
||||
|
import Content from './components/content.vue' |
||||
|
import { useRoute } from 'vue-router' |
||||
|
import { useLayoutStore } from '../store/modules/layout' |
||||
|
import { IMenubarList } from '../type/store/layout' |
||||
|
import { findCurrentMenubar } from '../utils/util' |
||||
|
import { computed, onMounted, ref } from 'vue' |
||||
|
import { getDtmVersion } from '../api/api_dtm' |
||||
|
|
||||
|
|
||||
|
const dashVer = import.meta.env.VITE_ADMIN_VERSION |
||||
|
const route = useRoute() |
||||
|
const layout = useLayoutStore() |
||||
|
|
||||
|
const mainNav = computed(() => { |
||||
|
const currentMenubar = findCurrentMenubar(layout.getMenubar.menuList, true) |
||||
|
return currentMenubar?.meta.title |
||||
|
}) |
||||
|
|
||||
|
const subNav = computed(() => { |
||||
|
let subNav = '' |
||||
|
const currentMenubar = findCurrentMenubar(layout.getMenubar.menuList, true) |
||||
|
currentMenubar.children?.forEach(v => { |
||||
|
if (route.path.indexOf(v.path) !== -1) { |
||||
|
subNav = v.meta.title |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
return subNav |
||||
|
}) |
||||
|
|
||||
|
const page = computed(() => { |
||||
|
let page = '' |
||||
|
const currentMenubar = findCurrentMenubar(layout.getMenubar.menuList, true) |
||||
|
currentMenubar.children?.forEach(v => { |
||||
|
v.children?.forEach(vv => { |
||||
|
if (route.path == vv.path) { |
||||
|
page = vv.meta.title |
||||
|
} |
||||
|
}) |
||||
|
}) |
||||
|
|
||||
|
return page |
||||
|
}) |
||||
|
|
||||
|
onMounted(() => { |
||||
|
layout.loadDtmVersion() |
||||
|
}) |
||||
|
|
||||
|
</script> |
||||
|
|
||||
|
<style lang="postcss" scoped> |
||||
|
.ant-layout.ant-layout-has-sider { |
||||
|
min-height: calc(100vh - 64px); |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,17 @@ |
|||||
|
<template> |
||||
|
<router-view v-slot="{Component}"> |
||||
|
<transition name="fade-transform" mode="out-in"> |
||||
|
<keep-alive> |
||||
|
<component :is="Component" :key="key" /> |
||||
|
</keep-alive> |
||||
|
</transition> |
||||
|
</router-view> |
||||
|
</template> |
||||
|
<script setup lang='ts'> |
||||
|
import { computed } from 'vue' |
||||
|
import { useRoute } from 'vue-router' |
||||
|
|
||||
|
const route = useRoute() |
||||
|
|
||||
|
const key = computed(() => route.path) |
||||
|
</script> |
||||
@ -0,0 +1,42 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<a-layout-header class="header flex"> |
||||
|
<div class="flex items-center logo h-16"> |
||||
|
<svg-icon style="width: 36px; height: 36px; margin-right: 84px;" icon-class="svg-logo" /> |
||||
|
<span class="text-gray-400 text-lg">DTM admin {{ version }}</span> |
||||
|
</div> |
||||
|
<a-menu |
||||
|
v-model:selectedKeys="activeMenu" |
||||
|
theme="dark" |
||||
|
mode="horizontal" |
||||
|
:style="{ lineHeight: '64px' }" |
||||
|
@select="onOpenChange" |
||||
|
> |
||||
|
<a-menu-item v-for="v in getMenubar.menuList" :key="v.path">{{ v.meta.title }}</a-menu-item> |
||||
|
</a-menu> |
||||
|
</a-layout-header> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script setup lang='ts'> |
||||
|
import { computed, ref } from 'vue'; |
||||
|
import { useRoute, useRouter } from 'vue-router'; |
||||
|
import { useLayoutStore } from '/@/store/modules/layout' |
||||
|
|
||||
|
const route = useRoute() |
||||
|
const router = useRouter() |
||||
|
const { getMenubar, getCurrentVersion } = useLayoutStore() |
||||
|
const firstRedirectPath = '/admin' |
||||
|
const version = import.meta.env.VITE_ADMIN_VERSION |
||||
|
|
||||
|
const activeMenu = ref([route.meta.activeMenu !== firstRedirectPath ? route.meta.activeMenu : '/']) |
||||
|
|
||||
|
const onOpenChange = (d:any) => { |
||||
|
router.push({ path: d.key }) |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
.logo { |
||||
|
margin-right: 20px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,57 @@ |
|||||
|
<template> |
||||
|
<a-menu |
||||
|
v-model:selectedKeys="activeMenu" |
||||
|
v-model:openKeys="openKeys" |
||||
|
mode="inline" |
||||
|
:style="{ height: '100%', borderRight: 0 }" |
||||
|
@select="onOpenChange" |
||||
|
> |
||||
|
<a-sub-menu v-for="v in filterSubMenubarData" :key="v.path"> |
||||
|
<template #title> |
||||
|
<span> |
||||
|
{{ v.meta.title }} |
||||
|
</span> |
||||
|
</template> |
||||
|
<a-menu-item v-for="vv in v.children" :key="vv.path">{{ vv.meta.title }}</a-menu-item> |
||||
|
</a-sub-menu> |
||||
|
</a-menu> |
||||
|
</template> |
||||
|
|
||||
|
<script setup lang='ts'> |
||||
|
import { ref, computed } from 'vue' |
||||
|
import { useRoute, useRouter } from 'vue-router' |
||||
|
import { useLayoutStore } from '/@/store/modules/layout' |
||||
|
import { IMenubarList } from '/@/type/store/layout' |
||||
|
import { findCurrentMenubar } from '/@/utils/util' |
||||
|
|
||||
|
const route = useRoute() |
||||
|
const router = useRouter() |
||||
|
const { getMenubar } = useLayoutStore() |
||||
|
|
||||
|
const filterSubMenubarData = computed(() => { |
||||
|
return findCurrentMenubar(getMenubar.menuList) as IMenubarList[] |
||||
|
}) |
||||
|
|
||||
|
const activeMenu = computed({ |
||||
|
get: () => { |
||||
|
return [route.path] |
||||
|
}, |
||||
|
set: (val) => { |
||||
|
// do nothing, just for eliminate warn |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
const openKeys = computed({ |
||||
|
get: () => { |
||||
|
const pos = route.path.lastIndexOf('/') |
||||
|
return [route.path.substring(0, pos)] |
||||
|
}, |
||||
|
set: (val) => { |
||||
|
// do onthing, just for eliminate warn |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
const onOpenChange = (d:any) => { |
||||
|
router.push({ path: d.key }) |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,12 @@ |
|||||
|
<script setup lang="ts"> |
||||
|
import Header from './components/header.vue' |
||||
|
</script> |
||||
|
|
||||
|
<template> |
||||
|
<a-layout> |
||||
|
<a-layout-header class="header"> |
||||
|
<Header /> |
||||
|
</a-layout-header> |
||||
|
<router-view /> |
||||
|
</a-layout> |
||||
|
</template> |
||||
@ -0,0 +1,13 @@ |
|||||
|
import { createApp } from 'vue' |
||||
|
import App from './App.vue' |
||||
|
import router from '/@/router/index' |
||||
|
import { pinia } from '/@/store' |
||||
|
import '/@/permission' |
||||
|
|
||||
|
import '/@/assets/css/index.css' |
||||
|
import 'virtual:svg-icons-register' |
||||
|
|
||||
|
const app = createApp(App) |
||||
|
app.use(router) |
||||
|
app.use(pinia) |
||||
|
app.mount('#app') |
||||
@ -0,0 +1,23 @@ |
|||||
|
import router from '/@/router' |
||||
|
import { configure, start, done } from 'nprogress' |
||||
|
import { useLayoutStore } from './store/modules/layout' |
||||
|
|
||||
|
configure({ showSpinner: false }) |
||||
|
|
||||
|
const defaultRoutePath = '/' |
||||
|
|
||||
|
router.beforeEach((to) => { |
||||
|
start() |
||||
|
|
||||
|
const { getMenubar, concatAllowRoutes } = useLayoutStore() |
||||
|
|
||||
|
if (getMenubar.menuList.length === 0) { |
||||
|
concatAllowRoutes() |
||||
|
|
||||
|
return to.fullPath |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
router.afterEach(() => { |
||||
|
done() |
||||
|
}) |
||||
@ -0,0 +1,18 @@ |
|||||
|
const modules = import.meta.glob('../views/**/**.vue') |
||||
|
const components: IObject<() => Promise<typeof import('*.vue')>> = { |
||||
|
LayoutHeader: (() => import('/@/layout/index.vue')) as unknown as () => Promise<typeof import('*.vue')> |
||||
|
} |
||||
|
|
||||
|
Object.keys(modules).forEach(key => { |
||||
|
const nameMatch = key.match(/^\.\.\/views\/(.+)\.vue/) |
||||
|
if (!nameMatch) return |
||||
|
if (nameMatch[1].includes('_Components')) return |
||||
|
const indexMatch = nameMatch[1].match(/(.*)\/Index$/i) |
||||
|
let name = indexMatch ? indexMatch[1] : nameMatch[1]; |
||||
|
[name] = name.split('/').splice(-1) |
||||
|
components[name] = modules[key] as () => Promise<typeof import('*.vue')> |
||||
|
}) |
||||
|
|
||||
|
export { |
||||
|
components |
||||
|
} |
||||
@ -0,0 +1,59 @@ |
|||||
|
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router' |
||||
|
import { IMenubarList } from '../type/store/layout'; |
||||
|
import { components } from './asyncRouter'; |
||||
|
|
||||
|
const Components: IObject<() => Promise<typeof import('*.vue')>> = Object.assign({}, components, { |
||||
|
LayoutHeader: (() => import('/@/layout/index.vue')) as unknown as () => Promise<typeof import('*.vue')>, |
||||
|
LayoutMain: (() => import('/@/layout/aside.vue')) as unknown as () => Promise<typeof import('*.vue')> |
||||
|
}) |
||||
|
|
||||
|
export const allowRouter: Array<IMenubarList> = [ |
||||
|
{ |
||||
|
name: 'Admin', |
||||
|
path: '/', |
||||
|
redirect: '/admin/global-transactions/all', |
||||
|
component: Components['LayoutHeader'], |
||||
|
meta: { title: 'Admin', activeMenu: '/admin' }, |
||||
|
children: [ |
||||
|
{ |
||||
|
name: 'Nodes', |
||||
|
path: '/admin/nodes', |
||||
|
component: Components['LayoutMain'], |
||||
|
meta: { title: 'Nodes' }, |
||||
|
children: [ |
||||
|
{ |
||||
|
name: 'LivingNodes', |
||||
|
path: '/admin/nodes/living', |
||||
|
component: Components['LivingNodes'], |
||||
|
meta: { title: 'Living Nodes' }, |
||||
|
} |
||||
|
] |
||||
|
}, { |
||||
|
name: 'GlobalTransactions', |
||||
|
path: '/admin/global-transactions', |
||||
|
component: Components['LayoutMain'], |
||||
|
meta: { title: 'Global Transactions' }, |
||||
|
children: [ |
||||
|
{ |
||||
|
name: 'AllTransactions', |
||||
|
path: '/admin/global-transactions/all', |
||||
|
component: Components['AllTransactions'], |
||||
|
meta: { title: 'All Transactions' }, |
||||
|
}, { |
||||
|
name: 'UnfinishedTransactions', |
||||
|
path: '/admin/global-transactions/unfinished', |
||||
|
component: Components['UnfinishedTransactions'], |
||||
|
meta: { title: 'Unfinished Transactions' }, |
||||
|
} |
||||
|
] |
||||
|
} |
||||
|
] |
||||
|
} |
||||
|
] |
||||
|
|
||||
|
const router = createRouter({ |
||||
|
history: createWebHistory(), |
||||
|
routes: allowRouter as RouteRecordRaw[] |
||||
|
}) |
||||
|
|
||||
|
export default router |
||||
@ -0,0 +1,2 @@ |
|||||
|
import { createPinia } from 'pinia' |
||||
|
export const pinia = createPinia() |
||||
@ -0,0 +1,38 @@ |
|||||
|
import { defineStore } from 'pinia'; |
||||
|
import { allowRouter } from '/@/router'; |
||||
|
import { ILayout, IMenubar, IMenubarList, IStatus } from '/@/type/store/layout'; |
||||
|
import { getDtmVersion } from '/@/api/api_dtm'; |
||||
|
|
||||
|
export const useLayoutStore = defineStore({ |
||||
|
id: 'layout', |
||||
|
state: (): ILayout => ({ |
||||
|
menubar: { |
||||
|
menuList: [] |
||||
|
}, |
||||
|
status: { |
||||
|
isLoading: false |
||||
|
}, |
||||
|
dtmVersion: "", |
||||
|
}), |
||||
|
getters: { |
||||
|
getMenubar(): IMenubar { |
||||
|
return this.menubar |
||||
|
}, |
||||
|
getStatus(): IStatus { |
||||
|
return this.status |
||||
|
}, |
||||
|
}, |
||||
|
actions: { |
||||
|
setRoutes(data: Array<IMenubarList>): void { |
||||
|
this.menubar.menuList = data |
||||
|
}, |
||||
|
concatAllowRoutes(): void { |
||||
|
allowRouter.reverse().forEach(v => this.menubar.menuList.unshift(v)) |
||||
|
}, |
||||
|
async loadDtmVersion(): Promise<void> { |
||||
|
const { data: { version } } = await getDtmVersion() |
||||
|
this.dtmVersion = version |
||||
|
console.log("dtm version: ", this.dtmVersion) |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
@ -0,0 +1,17 @@ |
|||||
|
export { } |
||||
|
declare global { |
||||
|
interface IObject<T> { |
||||
|
[index: string]: T |
||||
|
} |
||||
|
interface ImportMetaEnv { |
||||
|
VITE_APP_TITLE: string |
||||
|
VITE_PORT: number |
||||
|
VITE_PROXY: string |
||||
|
VITE_ADMIN_VERSION: string |
||||
|
} |
||||
|
interface ITable<T = any> { |
||||
|
data: Array<T> |
||||
|
next_position: number, |
||||
|
size: number |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,5 @@ |
|||||
|
declare module '*.vue' { |
||||
|
import { defineComponent } from 'vue'; |
||||
|
const Component: ReturnType<typeof defineComponent> |
||||
|
export default Component |
||||
|
} |
||||
@ -0,0 +1,31 @@ |
|||||
|
export interface IMenubar { |
||||
|
menuList: Array<IMenubarList> |
||||
|
} |
||||
|
|
||||
|
export interface ILayout { |
||||
|
menubar: IMenubar |
||||
|
status: IStatus |
||||
|
dtmVersion: string |
||||
|
} |
||||
|
|
||||
|
export interface IStatus { |
||||
|
isLoading: boolean |
||||
|
} |
||||
|
|
||||
|
export interface IMenubarList { |
||||
|
parentId?: number | string |
||||
|
id?: number | string |
||||
|
name: string |
||||
|
path: string |
||||
|
redirect?: string |
||||
|
meta: { |
||||
|
icon?: string |
||||
|
title: string |
||||
|
permission?: string[] |
||||
|
activeMenu?: string |
||||
|
hidden?: boolean |
||||
|
alwaysShow?: boolean |
||||
|
} |
||||
|
component: (() => Promise<typeof import('*.vue')>) | string |
||||
|
children?: Array<IMenubarList> |
||||
|
} |
||||
@ -0,0 +1,8 @@ |
|||||
|
import axios from 'axios' |
||||
|
|
||||
|
const request = axios.create({ |
||||
|
baseURL: import.meta.env.VITE_APP_API_BASE_URL as string | undefined, |
||||
|
timeout: 60000 |
||||
|
}) |
||||
|
|
||||
|
export default request |
||||
@ -0,0 +1,23 @@ |
|||||
|
import { useRoute } from 'vue-router'; |
||||
|
import { IMenubarList } from '../type/store/layout'; |
||||
|
|
||||
|
export const findCurrentMenubar = (menuList: IMenubarList[], root?:boolean) => { |
||||
|
const route = useRoute() |
||||
|
let arr:IMenubarList[] | IMenubarList = [] |
||||
|
for (let i = 0; i < menuList.length; i++) { |
||||
|
const v = menuList[i]; |
||||
|
const usePath = v.meta.activeMenu || v.redirect || v.path; |
||||
|
const pos = usePath.lastIndexOf('/') |
||||
|
const rootPath = pos == 0 ? usePath : usePath.substring(0, pos) |
||||
|
if (route.path.indexOf(rootPath) !== -1) { |
||||
|
if (!root) { |
||||
|
arr = v.children as IMenubarList[] |
||||
|
} else { |
||||
|
arr = v |
||||
|
} |
||||
|
break |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
return arr |
||||
|
} |
||||
@ -0,0 +1,133 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<a-table :columns="columns" :data-source="dataSource" :loading="loading" :pagination="false"> |
||||
|
<template #bodyCell="{column, record}"> |
||||
|
<template v-if="column.key === 'status'"> |
||||
|
<span> |
||||
|
<a-tag :key="record.status" :color="record.status === 'succeed' ? 'green' : 'volcano'">{{ record.status.toUpperCase() }}</a-tag> |
||||
|
</span> |
||||
|
</template> |
||||
|
<template v-else-if="column.key === 'action'"> |
||||
|
<span> |
||||
|
<a class="mr-2 font-medium">Detail</a> |
||||
|
<a class="text-red-400 font-medium">Stop</a> |
||||
|
</span> |
||||
|
</template> |
||||
|
</template> |
||||
|
</a-table> |
||||
|
<div class="flex justify-center mt-2 text-lg pager" v-if="canPrev || canNext"> |
||||
|
<a-button type="text" :disabled="!canPrev" @click="handlePrevPage">Previous</a-button> |
||||
|
<a-button type="text" :disabled="!canNext" @click="handleNextPage">Next</a-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script setup lang="ts"> |
||||
|
import { IListAllTransactions, listAllTransactions } from '/@/api/api_dtm' |
||||
|
import { ref, onMounted, reactive, computed } from 'vue-demi' |
||||
|
import { usePagination } from 'vue-request' |
||||
|
import { TableProps } from 'ant-design-vue/es/vc-table/Table' |
||||
|
const columns = [ |
||||
|
{ |
||||
|
title: 'GID', |
||||
|
dataIndex: 'gid', |
||||
|
key: 'gid' |
||||
|
}, { |
||||
|
title: 'TransType', |
||||
|
dataIndex: 'trans_type', |
||||
|
key: 'trans_type' |
||||
|
}, { |
||||
|
title: 'Status', |
||||
|
dataIndex: 'status', |
||||
|
key: 'status' |
||||
|
}, { |
||||
|
title: 'Protocol', |
||||
|
dataIndex: 'protocol', |
||||
|
key: 'protocol' |
||||
|
}, { |
||||
|
title: 'CreateTime', |
||||
|
dataIndex: 'create_time', |
||||
|
key: 'create_time' |
||||
|
}, { |
||||
|
title: 'Action', |
||||
|
key: 'action' |
||||
|
} |
||||
|
] |
||||
|
|
||||
|
const pager = ref([""]) |
||||
|
const currentState = ref(1) |
||||
|
|
||||
|
const canPrev = computed(() => { |
||||
|
if (currentState.value === 1) { |
||||
|
return false; |
||||
|
} |
||||
|
|
||||
|
return true; |
||||
|
}) |
||||
|
|
||||
|
const canNext = computed(() => { |
||||
|
return data.value?.data.next_position !== "" |
||||
|
}) |
||||
|
|
||||
|
type Data = { |
||||
|
transactions: { |
||||
|
gid: string |
||||
|
trans_type: string |
||||
|
status: string |
||||
|
protocol: string |
||||
|
create_time: string |
||||
|
}[] |
||||
|
next_position: string |
||||
|
} |
||||
|
|
||||
|
const queryData = (params: IListAllTransactions) => { |
||||
|
return listAllTransactions<Data>(params) |
||||
|
} |
||||
|
|
||||
|
const { data, run, current, loading, pageSize } = usePagination(queryData, { |
||||
|
defaultParams: [ |
||||
|
{ |
||||
|
limit: 100, |
||||
|
} |
||||
|
], |
||||
|
pagination: { |
||||
|
pageSizeKey: 'limit' |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
const dataSource = computed(() => data.value?.data.transactions || []) |
||||
|
|
||||
|
const handlePrevPage = () => { |
||||
|
currentState.value -= 1; |
||||
|
const params = { |
||||
|
limit: 100 |
||||
|
} |
||||
|
if (pager.value[currentState.value - 1]) { |
||||
|
params.position = pager.value[currentState.value - 1] |
||||
|
} |
||||
|
run(params) |
||||
|
} |
||||
|
|
||||
|
const handleNextPage = () => { |
||||
|
currentState.value += 1; |
||||
|
if (currentState.value >= 2) { |
||||
|
pager.value[currentState.value - 1] = data.value?.data.next_position |
||||
|
} |
||||
|
|
||||
|
run({ |
||||
|
position: data.value?.data.next_position, |
||||
|
limit: 5 |
||||
|
}) |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="postcss" scoped> |
||||
|
::v-deep .ant-pagination-item { |
||||
|
display: none; |
||||
|
} |
||||
|
.pager .ant-btn-text { |
||||
|
font-weight: 500; |
||||
|
}1 |
||||
|
.pager .ant-btn { |
||||
|
padding: 6px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,5 @@ |
|||||
|
<template> |
||||
|
<h1>Coming Soon</h1> |
||||
|
</template> |
||||
|
<script setup lang="ts"> |
||||
|
</script> |
||||
@ -0,0 +1,6 @@ |
|||||
|
<template> |
||||
|
<h1>Coming Soon</h1> |
||||
|
</template> |
||||
|
|
||||
|
<script setup lang="ts"> |
||||
|
</script> |
||||
@ -0,0 +1,7 @@ |
|||||
|
module.exports = { |
||||
|
content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'], |
||||
|
theme: { |
||||
|
extend: {}, |
||||
|
}, |
||||
|
plugins: [], |
||||
|
} |
||||
@ -0,0 +1,21 @@ |
|||||
|
{ |
||||
|
"compilerOptions": { |
||||
|
"target": "esnext", |
||||
|
"useDefineForClassFields": true, |
||||
|
"module": "esnext", |
||||
|
"moduleResolution": "node", |
||||
|
"strict": true, |
||||
|
"jsx": "preserve", |
||||
|
"sourceMap": true, |
||||
|
"resolveJsonModule": true, |
||||
|
"esModuleInterop": true, |
||||
|
"baseUrl": ".", |
||||
|
"paths": { |
||||
|
"/@/*": ["src/*"], |
||||
|
}, |
||||
|
"lib": ["esnext", "dom"], |
||||
|
"types": ["vite/client", "node"] |
||||
|
}, |
||||
|
"include": ["**/*.ts", "**/*.d.ts", "**/*.tsx", "**/*.vue"], |
||||
|
"exclude": ["node_modules"] |
||||
|
} |
||||
@ -0,0 +1,50 @@ |
|||||
|
import { ConfigEnv, UserConfigExport } from 'vite'; |
||||
|
import path from 'path'; |
||||
|
import vue from '@vitejs/plugin-vue'; |
||||
|
import viteSvgIcons from 'vite-plugin-svg-icons'; |
||||
|
import Components from 'unplugin-vue-components/vite'; |
||||
|
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers' |
||||
|
|
||||
|
const setAlias = (alias: [string, string][]) => alias.map((v) => { |
||||
|
return { find: v[0], replacement: path.resolve(__dirname, v[1]) }; |
||||
|
}); |
||||
|
|
||||
|
export default ({ }: ConfigEnv): UserConfigExport => { |
||||
|
return { |
||||
|
resolve: { |
||||
|
alias: setAlias([['/@', 'src']]), |
||||
|
}, |
||||
|
plugins: [ |
||||
|
vue(), |
||||
|
viteSvgIcons({ |
||||
|
iconDirs: [path.resolve(process.cwd(), 'src/icons')], |
||||
|
symbolId: 'icon-[dir]-[name]' |
||||
|
}), |
||||
|
Components({ |
||||
|
dts: 'src/components.d.ts', |
||||
|
resolvers: [ |
||||
|
AntDesignVueResolver() |
||||
|
] |
||||
|
}) |
||||
|
], |
||||
|
server: { |
||||
|
port: 5000, |
||||
|
base: 'admin', |
||||
|
proxy: { |
||||
|
'/api': { |
||||
|
target: 'http://localhost:36789', |
||||
|
}, |
||||
|
} |
||||
|
}, |
||||
|
css: { |
||||
|
postcss: { |
||||
|
plugins: [ |
||||
|
require('autoprefixer'), |
||||
|
require('tailwindcss'), |
||||
|
require('postcss-simple-vars'), |
||||
|
require('postcss-import') |
||||
|
] |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
}; |
||||
File diff suppressed because it is too large
Loading…
Reference in new issue