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