commit
f62d475c36
20 changed files with 464 additions and 0 deletions
@ -0,0 +1,25 @@ |
|||||
|
# Logs |
||||
|
logs |
||||
|
*.log |
||||
|
npm-debug.log* |
||||
|
yarn-debug.log* |
||||
|
yarn-error.log* |
||||
|
pnpm-debug.log* |
||||
|
lerna-debug.log* |
||||
|
src/assets/mapdata/* |
||||
|
node_modules |
||||
|
dist |
||||
|
package-lock.json |
||||
|
dist-ssr |
||||
|
*.local |
||||
|
|
||||
|
# Editor directories and files |
||||
|
.vscode/* |
||||
|
!.vscode/extensions.json |
||||
|
.idea |
||||
|
.DS_Store |
||||
|
*.suo |
||||
|
*.ntvs* |
||||
|
*.njsproj |
||||
|
*.sln |
||||
|
*.sw? |
||||
@ -0,0 +1,3 @@ |
|||||
|
[submodule "pathogen_api"] |
||||
|
path = pathogen_api |
||||
|
url = http://gitlab.app.bio-it.tech/root/pathogen_api.git |
||||
@ -0,0 +1,35 @@ |
|||||
|
# 病原数据项目简介 |
||||
|
|
||||
|
## 设计图 |
||||
|
https://nv3dpiclr7.feishu.cn/docx/Y3c0dj64TowO8KxhxbvcCniCnhd |
||||
|
|
||||
|
## 需求讨论 |
||||
|
https://nv3dpiclr7.feishu.cn/docx/Y3c0dj64TowO8KxhxbvcCniCnhd |
||||
|
|
||||
|
## 环境 |
||||
|
`node>16` |
||||
|
|
||||
|
## 基础包列表 |
||||
|
`axios` `dayjs` `echarts` `element-plus` `lodash``nprogress` `pinia` `vue3` `vue-i18n` `vite5` |
||||
|
|
||||
|
## 项目启动 |
||||
|
|
||||
|
- //安装依赖包 |
||||
|
``` |
||||
|
npm install |
||||
|
``` |
||||
|
|
||||
|
- //开发环境 |
||||
|
``` |
||||
|
npm run dev |
||||
|
``` |
||||
|
|
||||
|
- //开发前准备 |
||||
|
``` |
||||
|
需要将src/assets下的mapdata解压下方可使用，解压后目录层级示例为src/assets/mapdata/provinces |
||||
|
``` |
||||
|
|
||||
|
- //打包 |
||||
|
``` |
||||
|
npm run build |
||||
|
``` |
||||
@ -0,0 +1,16 @@ |
|||||
|
<!DOCTYPE html> |
||||
|
<html lang="zh"> |
||||
|
<head> |
||||
|
<meta charset="UTF-8" /> |
||||
|
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> |
||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
||||
|
<!-- <script type="text/javascript" src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=oVfsVaYhLHUB2dqfOIdSTYASndsX33LF"></script> --> |
||||
|
<!-- <script src="//unpkg.com/@bmapgl-plugin/cluster@0.0.5"></script> --> |
||||
|
<!-- <script src="//mapopen-pub-jsapi.cdn.bcebos.com/static/js/bjpoi.js"></script> --> |
||||
|
<title>pathogenData</title> |
||||
|
</head> |
||||
|
<body> |
||||
|
<div id="app"></div> |
||||
|
<script type="module" src="/src/main.js"></script> |
||||
|
</body> |
||||
|
</html> |
||||
@ -0,0 +1,36 @@ |
|||||
|
{ |
||||
|
"name": "pathogendata", |
||||
|
"private": true, |
||||
|
"version": "0.0.0", |
||||
|
"type": "module", |
||||
|
"scripts": { |
||||
|
"dev": "vite", |
||||
|
"build": "node --max_old_space_size=16384 ./node_modules/vite/bin/vite.js build", |
||||
|
"npm:i": "npm i -d --registry=https://registry.npmmirror.com", |
||||
|
"updateapi": "git submodule update --init --recursive" |
||||
|
}, |
||||
|
"dependencies": { |
||||
|
"@element-plus/icons-vue": "^2.3.1", |
||||
|
"@jamescoyle/vue-icon": "^0.1.2", |
||||
|
"@mdi/font": "^7.4.47", |
||||
|
"@mdi/js": "^7.4.47", |
||||
|
"axios": "^1.7.9", |
||||
|
"dayjs": "^1.11.13", |
||||
|
"element-plus": "^2.9.0", |
||||
|
"lodash": "^4.17.21", |
||||
|
"nprogress": "^0.2.0", |
||||
|
"vue": "^3.5.13", |
||||
|
"vue-i18n": "^10.0.5", |
||||
|
"vue-router": "^4.5.0", |
||||
|
"vuetify": "^3.7.5" |
||||
|
}, |
||||
|
"devDependencies": { |
||||
|
"@vitejs/plugin-vue": "^4.6.2", |
||||
|
"sass": "~1.32.0", |
||||
|
"sass-loader": "^10.5.2", |
||||
|
"unplugin-fonts": "^1.3.1", |
||||
|
"unplugin-vue-components": "^0.27.5", |
||||
|
"vite": "^5.4.11", |
||||
|
"vite-plugin-vuetify": "^2.0.4" |
||||
|
} |
||||
|
} |
||||
|
After Width: | Height: | Size: 569 B |
@ -0,0 +1,30 @@ |
|||||
|
<template> |
||||
|
<el-config-provider :locale="locale"> |
||||
|
<router-view /> |
||||
|
</el-config-provider> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { ElConfigProvider } from 'element-plus' |
||||
|
import zhCn from 'element-plus/es/locale/lang/zh-cn' |
||||
|
|
||||
|
export default { |
||||
|
name: "app", |
||||
|
components: { |
||||
|
ElConfigProvider, |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
locale: zhCn, |
||||
|
}; |
||||
|
}, |
||||
|
watch: {}, |
||||
|
computed: {}, |
||||
|
async mounted() { }, |
||||
|
methods: {}, |
||||
|
|
||||
|
destoryed() { }, |
||||
|
|
||||
|
}; |
||||
|
</script> |
||||
|
<style scoped></style> |
||||
@ -0,0 +1,11 @@ |
|||||
|
import _axios from "@/plugins/axios"; |
||||
|
import _ from "lodash"; |
||||
|
let personalToken = `6LEduRKgkheVUBeQ6uvGrZ`//广实代谢
|
||||
|
//获取分析
|
||||
|
export function mathedAnalyzedParams(data = {}) { |
||||
|
return _axios({ |
||||
|
url: `/biobank/v1/workflowlaunchs?token=${personalToken}`, |
||||
|
method: "POST", |
||||
|
data: data, |
||||
|
}); |
||||
|
} |
||||
@ -0,0 +1,5 @@ |
|||||
|
html, |
||||
|
body { |
||||
|
margin: 0; |
||||
|
padding: 0; |
||||
|
} |
||||
@ -0,0 +1,11 @@ |
|||||
|
const en = { |
||||
|
"menus": { |
||||
|
"home": 'Home', |
||||
|
"customStatistics": 'Data Statistics', |
||||
|
"spatiotemporalDistribution": 'Spatiotemporal Distribution', |
||||
|
"hostComparison": 'Host Comparison', |
||||
|
'pathogenSpatiotemporalDistribution': 'Pathogen Spatiotemporal Distribution', |
||||
|
'monitoringWarningSystem': 'Monitoring Warning System', |
||||
|
}, |
||||
|
} |
||||
|
export default en |
||||
@ -0,0 +1,11 @@ |
|||||
|
const zh = { |
||||
|
"menus": { |
||||
|
"home": '首 页', |
||||
|
"customStatistics": '数据统计', |
||||
|
"spatiotemporalDistribution": '时空分布', |
||||
|
"hostComparison": '宿主物种', |
||||
|
'pathogenSpatiotemporalDistribution': '病原时空分布', |
||||
|
'monitoringWarningSystem': '监测预警系统', |
||||
|
}, |
||||
|
} |
||||
|
export default zh |
||||
@ -0,0 +1,47 @@ |
|||||
|
<template> |
||||
|
<el-container> |
||||
|
<el-header class="appNav"> |
||||
|
44 |
||||
|
</el-header> |
||||
|
<el-main class="appMain"> |
||||
|
<router-view /> |
||||
|
</el-main> |
||||
|
<el-footer class="appFooter"> |
||||
|
55 |
||||
|
</el-footer> |
||||
|
</el-container> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: "basic", |
||||
|
components: {}, |
||||
|
data() { |
||||
|
return {}; |
||||
|
}, |
||||
|
watch: {}, |
||||
|
computed: {}, |
||||
|
async mounted() { }, |
||||
|
methods: {}, |
||||
|
}; |
||||
|
</script> |
||||
|
<style scoped lang="scss"> |
||||
|
.appNav { |
||||
|
padding: 0; |
||||
|
} |
||||
|
|
||||
|
.appMain { |
||||
|
height: calc(100vh - 105px); |
||||
|
padding: 0; |
||||
|
overflow-y: auto; |
||||
|
overflow-x: hidden; |
||||
|
} |
||||
|
|
||||
|
.appFooter { |
||||
|
height: 45px; |
||||
|
//background-color:$blue-color; |
||||
|
background-color: #f7f7f7; |
||||
|
color: rgba(99, 99, 99, 0.7); |
||||
|
text-align: center; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,42 @@ |
|||||
|
import App from "./App.vue"; |
||||
|
import { createApp } from "vue"; |
||||
|
import { createI18n } from 'vue-i18n' |
||||
|
// 引入路由实例
|
||||
|
import router from "@/router/index.js"; |
||||
|
//全局引入lodash
|
||||
|
import _ from "lodash"; |
||||
|
//全局引入lodash
|
||||
|
import dayjs from "dayjs"; |
||||
|
// 引入css
|
||||
|
import "@/assets/css/base.scss"; |
||||
|
//全局引入element-plus组件库，方便修改配置，也可以在vite.config.js中动态引入
|
||||
|
import ElementPlus from 'element-plus' |
||||
|
//全局引入element-plus所有图标
|
||||
|
import * as ElementPlusIconsVue from '@element-plus/icons-vue' |
||||
|
import 'element-plus/dist/index.css' |
||||
|
//引入中英文的数据
|
||||
|
import en from './assets/i18n/en.js' |
||||
|
import zh from './assets/i18n/zh.js' |
||||
|
|
||||
|
const i18n = createI18n({ |
||||
|
// something vue-i18n options here ...
|
||||
|
locale: 'zh', // 设置默认的语音版本语言
|
||||
|
messages: { |
||||
|
zh: { ...zh }, |
||||
|
en: { ...en }, |
||||
|
} |
||||
|
}) |
||||
|
// Plugins
|
||||
|
import vuetify from '@/plugins/vuetify.js' |
||||
|
|
||||
|
const app = createApp(App); |
||||
|
i18n.install(app) // use不生效，install生效
|
||||
|
for (const [key, component] of Object.entries(ElementPlusIconsVue)) { |
||||
|
app.component(key, component) |
||||
|
} |
||||
|
app.config.globalProperties.$_ = _; //挂载到app实例上
|
||||
|
app.config.globalProperties.$dayjs = dayjs; //挂载到app实例上
|
||||
|
app.use(ElementPlus, { zIndex: 3000 }) |
||||
|
.use(vuetify) //vuetify
|
||||
|
.use(router) //路由
|
||||
|
.mount("#app"); |
||||
@ -0,0 +1,30 @@ |
|||||
|
import axios from "axios"; |
||||
|
import {ElMessage} from 'element-plus' |
||||
|
|
||||
|
let config = { |
||||
|
baseURL: "", |
||||
|
timeout: 600 * 1000, |
||||
|
withCredentials: true, |
||||
|
|
||||
|
}; |
||||
|
|
||||
|
const _axios = axios.create(config); |
||||
|
|
||||
|
_axios.interceptors.request.use( |
||||
|
(config) => { |
||||
|
return config; |
||||
|
}, |
||||
|
(error) => { |
||||
|
return Promise.reject(error); |
||||
|
} |
||||
|
); |
||||
|
_axios.interceptors.response.use( |
||||
|
(response) => { |
||||
|
return Promise.resolve(response.data); |
||||
|
}, |
||||
|
(error) => { |
||||
|
ElMessage.error(error.response.data.message); |
||||
|
return Promise.reject(error); |
||||
|
} |
||||
|
); |
||||
|
export default _axios; |
||||
@ -0,0 +1,13 @@ |
|||||
|
// Styles
|
||||
|
import '@mdi/font/css/materialdesignicons.css' |
||||
|
import 'vuetify/styles' |
||||
|
|
||||
|
// Composables
|
||||
|
import {createVuetify} from 'vuetify' |
||||
|
|
||||
|
// https://vuetifyjs.com/en/introduction/why-vuetify/#feature-guides
|
||||
|
export default createVuetify({ |
||||
|
theme: { |
||||
|
defaultTheme: 'light', |
||||
|
}, |
||||
|
}) |
||||
@ -0,0 +1,35 @@ |
|||||
|
import { createRouter, createWebHistory } from "vue-router"; |
||||
|
import { close, start } from "@/utils/nprogress"; |
||||
|
import layout from "@/layouts/basic/index" |
||||
|
|
||||
|
const routes = [ |
||||
|
{ |
||||
|
path: "/", |
||||
|
name: "", |
||||
|
component: layout, |
||||
|
redirect: "/home", |
||||
|
children: [ |
||||
|
{ |
||||
|
path: "home", |
||||
|
name: "home", |
||||
|
component: () => import("@/views/home/index.vue"), |
||||
|
}, |
||||
|
] |
||||
|
}, |
||||
|
{ name: "重定向", path: "/:catchAll(.*)", redirect: "/home" }, |
||||
|
]; |
||||
|
|
||||
|
// 创建路由实例
|
||||
|
const router = createRouter({ |
||||
|
history: createWebHistory(), |
||||
|
routes, //路由表
|
||||
|
}); |
||||
|
router.beforeEach((to, from, next) => { |
||||
|
next() |
||||
|
start(); |
||||
|
}); |
||||
|
|
||||
|
router.afterEach((pre, next) => { |
||||
|
close(); |
||||
|
}); |
||||
|
export default router; |
||||
@ -0,0 +1,20 @@ |
|||||
|
import NProgress from 'nprogress' |
||||
|
import 'nprogress/nprogress.css' |
||||
|
|
||||
|
NProgress.configure({ |
||||
|
easing: 'ease', // 动画方式
|
||||
|
speed: 1000, // 递增进度条的速度
|
||||
|
showSpinner: false, // 是否显示加载ico
|
||||
|
trickleSpeed: 200, // 自动递增间隔
|
||||
|
minimum: 0.3, // 更改启动时使用的最小百分比
|
||||
|
parent: 'body', //指定进度条的父容器
|
||||
|
}) |
||||
|
// 打开进度条
|
||||
|
export const start = () => { |
||||
|
NProgress.start() |
||||
|
} |
||||
|
|
||||
|
// 关闭进度条
|
||||
|
export const close = () => { |
||||
|
NProgress.done() |
||||
|
} |
||||
@ -0,0 +1,21 @@ |
|||||
|
<template> |
||||
|
<div>home</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: "home", |
||||
|
components: {}, |
||||
|
data() { |
||||
|
return {}; |
||||
|
}, |
||||
|
watch: {}, |
||||
|
computed: {}, |
||||
|
async mounted() { }, |
||||
|
methods: {}, |
||||
|
|
||||
|
destoryed() { }, |
||||
|
|
||||
|
}; |
||||
|
</script> |
||||
|
<style scoped></style> |
||||
@ -0,0 +1,63 @@ |
|||||
|
// Plugins
|
||||
|
import vue from "@vitejs/plugin-vue"; |
||||
|
import Vuetify, {transformAssetUrls} from 'vite-plugin-vuetify' |
||||
|
import Components from 'unplugin-vue-components/vite' |
||||
|
// Utilities
|
||||
|
import {defineConfig} from "vite"; |
||||
|
import {fileURLToPath, URL} from "node:url"; |
||||
|
|
||||
|
// https://vitejs.dev/config/
|
||||
|
export default defineConfig({ |
||||
|
// publicDir: "src/assets",
|
||||
|
// assetsDir:"src/assets",
|
||||
|
plugins: [ |
||||
|
vue({ |
||||
|
template: {transformAssetUrls} |
||||
|
}), |
||||
|
Vuetify(), |
||||
|
Components(), |
||||
|
], |
||||
|
define: {"process.env": {}}, |
||||
|
resolve: { |
||||
|
alias: { |
||||
|
"@": fileURLToPath(new URL("./src", import.meta.url)), |
||||
|
}, |
||||
|
extensions: [".js", ".json", ".jsx", ".mjs", ".ts", ".tsx", ".vue"], |
||||
|
}, |
||||
|
server: { |
||||
|
host: "0.0.0.0", |
||||
|
port: 3000, |
||||
|
proxy: { |
||||
|
// "/biobank": {
|
||||
|
// target: "http://127.0.0.1:7001",
|
||||
|
// changeOrigin: true,
|
||||
|
// // rewrite: (path) => path.replace(/^\/biobank/, "")
|
||||
|
// },
|
||||
|
"/biobank": { |
||||
|
target: "http://10.20.16.11:8000", |
||||
|
changeOrigin: true, |
||||
|
// rewrite: (path) => path.replace(/^\/biobank/, "")
|
||||
|
}, |
||||
|
// "/pathogen_api": {
|
||||
|
// target: "http://10.20.16.11:7727",
|
||||
|
// changeOrigin: true,
|
||||
|
// // rewrite: (path) => path.replace(/^\/pathogen_api/, "")
|
||||
|
// },
|
||||
|
"/pathogen_api": { |
||||
|
target: "http://127.0.0.1:7002", |
||||
|
// target: "http://192.168.31.138:7002",
|
||||
|
changeOrigin: true, |
||||
|
// rewrite: (path) => path.replace(/^\/pathogen_api/, "")
|
||||
|
}, |
||||
|
// "/biobank": {
|
||||
|
// target: "http://192.168.31.89:7002",
|
||||
|
// changeOrigin: true,
|
||||
|
// // rewrite: (path) => path.replace(/^\/biobank/, "")
|
||||
|
// },
|
||||
|
}, |
||||
|
}, |
||||
|
// 构建的时候添加源代码映射，调试可以快速定位，上线的时候最好注掉
|
||||
|
build: { |
||||
|
sourcemap: true, |
||||
|
}, |
||||
|
}); |
||||
Loading…
Reference in new issue