22 changed files with 15526 additions and 0 deletions
@ -0,0 +1,24 @@ |
|||||
|
# testvue |
||||
|
|
||||
|
## Project setup |
||||
|
``` |
||||
|
npm install |
||||
|
``` |
||||
|
|
||||
|
### Compiles and hot-reloads for development |
||||
|
``` |
||||
|
npm run serve |
||||
|
``` |
||||
|
|
||||
|
### Compiles and minifies for production |
||||
|
``` |
||||
|
npm run build |
||||
|
``` |
||||
|
|
||||
|
### Lints and fixes files |
||||
|
``` |
||||
|
npm run lint |
||||
|
``` |
||||
|
|
||||
|
### Customize configuration |
||||
|
See [Configuration Reference](https://cli.vuejs.org/config/). |
||||
@ -0,0 +1,5 @@ |
|||||
|
module.exports = { |
||||
|
presets: [ |
||||
|
'@vue/cli-plugin-babel/preset' |
||||
|
] |
||||
|
} |
||||
@ -0,0 +1,19 @@ |
|||||
|
{ |
||||
|
"compilerOptions": { |
||||
|
"target": "es5", |
||||
|
"module": "esnext", |
||||
|
"baseUrl": "./", |
||||
|
"moduleResolution": "node", |
||||
|
"paths": { |
||||
|
"@/*": [ |
||||
|
"src/*" |
||||
|
] |
||||
|
}, |
||||
|
"lib": [ |
||||
|
"esnext", |
||||
|
"dom", |
||||
|
"dom.iterable", |
||||
|
"scripthost" |
||||
|
] |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,47 @@ |
|||||
|
{ |
||||
|
"name": "testvue", |
||||
|
"version": "0.1.0", |
||||
|
"private": true, |
||||
|
"scripts": { |
||||
|
"serve": "vue-cli-service serve", |
||||
|
"build": "vue-cli-service build", |
||||
|
"lint": "vue-cli-service lint" |
||||
|
}, |
||||
|
"dependencies": { |
||||
|
"axios": "^1.7.9", |
||||
|
"core-js": "^3.8.3", |
||||
|
"element-ui": "^2.15.14", |
||||
|
"js-cookie": "^3.0.5", |
||||
|
"vue": "^2.6.14", |
||||
|
"vue-router": "^3.5.1" |
||||
|
}, |
||||
|
"devDependencies": { |
||||
|
"@babel/core": "^7.12.16", |
||||
|
"@babel/eslint-parser": "^7.12.16", |
||||
|
"@vue/cli-plugin-babel": "~5.0.0", |
||||
|
"@vue/cli-plugin-eslint": "~5.0.0", |
||||
|
"@vue/cli-service": "~5.0.0", |
||||
|
"eslint": "^7.32.0", |
||||
|
"eslint-plugin-vue": "^8.0.3", |
||||
|
"vue-template-compiler": "^2.6.14" |
||||
|
}, |
||||
|
"eslintConfig": { |
||||
|
"root": true, |
||||
|
"env": { |
||||
|
"node": true |
||||
|
}, |
||||
|
"extends": [ |
||||
|
"plugin:vue/essential", |
||||
|
"eslint:recommended" |
||||
|
], |
||||
|
"parserOptions": { |
||||
|
"parser": "@babel/eslint-parser" |
||||
|
}, |
||||
|
"rules": {} |
||||
|
}, |
||||
|
"browserslist": [ |
||||
|
"> 1%", |
||||
|
"last 2 versions", |
||||
|
"not dead" |
||||
|
] |
||||
|
} |
||||
|
After Width: | Height: | Size: 4.2 KiB |
@ -0,0 +1,17 @@ |
|||||
|
<!DOCTYPE html> |
||||
|
<html lang=""> |
||||
|
<head> |
||||
|
<meta charset="utf-8"> |
||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
||||
|
<meta name="viewport" content="width=device-width,initial-scale=1.0"> |
||||
|
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> |
||||
|
<title><%= htmlWebpackPlugin.options.title %></title> |
||||
|
</head> |
||||
|
<body> |
||||
|
<noscript> |
||||
|
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> |
||||
|
</noscript> |
||||
|
<div id="app"></div> |
||||
|
<!-- built files will be auto injected --> |
||||
|
</body> |
||||
|
</html> |
||||
@ -0,0 +1,21 @@ |
|||||
|
<template> |
||||
|
<router-view ></router-view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
|
||||
|
export default { |
||||
|
name: 'App', |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
#app { |
||||
|
font-family: Avenir, Helvetica, Arial, sans-serif; |
||||
|
-webkit-font-smoothing: antialiased; |
||||
|
-moz-osx-font-smoothing: grayscale; |
||||
|
text-align: center; |
||||
|
color: #2c3e50; |
||||
|
margin-top: 60px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,34 @@ |
|||||
|
import request from "@/utils/request"; |
||||
|
|
||||
|
// 登录方法
|
||||
|
export function userLogin() { |
||||
|
return request({ |
||||
|
url: '/user/doLogin', |
||||
|
method: 'get', |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
|
||||
|
export function test() { |
||||
|
return request({ |
||||
|
url: '/user/test', |
||||
|
method: 'get', |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
|
||||
|
//获取图谱数据
|
||||
|
// export function getgraphInfo(data) {
|
||||
|
// return request({
|
||||
|
// url: '/user/getDomainGraphTest',
|
||||
|
// method: 'post',
|
||||
|
// data: data
|
||||
|
// })
|
||||
|
// }
|
||||
|
export function getgraphInfo(data) { |
||||
|
return request({ |
||||
|
url: '/graph/getDomainGraphTest', |
||||
|
method: 'post', |
||||
|
data: data |
||||
|
}) |
||||
|
} |
||||
@ -0,0 +1,10 @@ |
|||||
|
//import axios from '../axios'
|
||||
|
import request from '@/utils/request'; |
||||
|
|
||||
|
export const uploadInfo = (params) => { |
||||
|
return request({ |
||||
|
url: '/api/updateload/upload', |
||||
|
method: 'post', |
||||
|
data: params, |
||||
|
}); |
||||
|
}; |
||||
@ -0,0 +1,30 @@ |
|||||
|
export const config = { |
||||
|
background:'40,47,183', |
||||
|
node: { //节点的默认配置
|
||||
|
label: { //标签配置
|
||||
|
show: false, //是否显示
|
||||
|
color: '20,20,20', //字体颜色
|
||||
|
font: 'normal 30px Arial', //字体大小及类型
|
||||
|
textPosition: 'Bottom_Center' //文字位置 Top_Center,Bottom_Center,Middle_Right,Middle_Center
|
||||
|
}, |
||||
|
shape: 'circle', |
||||
|
showLabel:false, |
||||
|
}, |
||||
|
link: { //连线的默认配置
|
||||
|
label: { //连线标签
|
||||
|
show: true, //是否显示
|
||||
|
color: '255,255,255', //字体颜色
|
||||
|
font: 'normal 13px Arial', //字体大小及类型
|
||||
|
//background:'220,220,220' //标签背景色
|
||||
|
}, |
||||
|
lineType: 'direct', //连线类型,direct,curver,vlink,hlink,vbezier,hbezier,bezier
|
||||
|
colorType: 'defined', //连线颜色类型 source:继承source颜色,target:继承target颜色 both:用双边颜色，defined:自定义
|
||||
|
alpha: 1, // 连线透明度
|
||||
|
showArrow: true, //显示连线箭头
|
||||
|
}, |
||||
|
lineColor:'202,202,202', |
||||
|
layerName:'frDirect', |
||||
|
|
||||
|
wheelZoom: 0.8, //开启鼠标滚轮缩放
|
||||
|
highLightNeiber: false //相邻节点高亮开关
|
||||
|
} |
||||
File diff suppressed because it is too large
File diff suppressed because it is too large
|
After Width: | Height: | Size: 6.7 KiB |
@ -0,0 +1,58 @@ |
|||||
|
<template> |
||||
|
<div class="hello"> |
||||
|
<h1>{{ msg }}</h1> |
||||
|
<p> |
||||
|
For a guide and recipes on how to configure / customize this project,<br> |
||||
|
check out the |
||||
|
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>. |
||||
|
</p> |
||||
|
<h3>Installed CLI Plugins</h3> |
||||
|
<ul> |
||||
|
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li> |
||||
|
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li> |
||||
|
</ul> |
||||
|
<h3>Essential Links</h3> |
||||
|
<ul> |
||||
|
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li> |
||||
|
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li> |
||||
|
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li> |
||||
|
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li> |
||||
|
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li> |
||||
|
</ul> |
||||
|
<h3>Ecosystem</h3> |
||||
|
<ul> |
||||
|
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li> |
||||
|
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li> |
||||
|
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li> |
||||
|
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li> |
||||
|
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li> |
||||
|
</ul> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'HelloWorld', |
||||
|
props: { |
||||
|
msg: String |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<!-- Add "scoped" attribute to limit CSS to this component only --> |
||||
|
<style scoped> |
||||
|
h3 { |
||||
|
margin: 40px 0 0; |
||||
|
} |
||||
|
ul { |
||||
|
list-style-type: none; |
||||
|
padding: 0; |
||||
|
} |
||||
|
li { |
||||
|
display: inline-block; |
||||
|
margin: 0 10px; |
||||
|
} |
||||
|
a { |
||||
|
color: #42b983; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,16 @@ |
|||||
|
import Vue from 'vue' |
||||
|
import App from './App.vue' |
||||
|
import VueRouter from 'vue-router'; |
||||
|
|
||||
|
import router from '../src/router/router.js' |
||||
|
|
||||
|
|
||||
|
Vue.config.productionTip = false |
||||
|
|
||||
|
|
||||
|
// 安装 Vue Router 插件
|
||||
|
Vue.use(VueRouter); |
||||
|
new Vue({ |
||||
|
router, // 将路由器传递给 Vue 实例
|
||||
|
render: h => h(App), |
||||
|
}).$mount('#app') |
||||
@ -0,0 +1,25 @@ |
|||||
|
//1.导入vue 和 vuerouter 的包
|
||||
|
import Vue from 'vue' |
||||
|
import VueRouter from 'vue-router' |
||||
|
import Home from '@/view/Home.vue' |
||||
|
import Book from '@/view/Book.vue' |
||||
|
|
||||
|
//2.调用vue.use() 函数，把 VueRouter 安装为 Vue 的插件
|
||||
|
//vue.use()函数的作用，就是来安装插件的
|
||||
|
Vue.use(VueRouter) |
||||
|
|
||||
|
|
||||
|
export default new VueRouter({ |
||||
|
routes: [ //配置路由，这里是个数组
|
||||
|
{ //每一个链接都是一个对象
|
||||
|
path: '/', //链接路径
|
||||
|
name: 'Home', //路由名称，
|
||||
|
component: Home //对应的组件模板
|
||||
|
}, |
||||
|
{ //每一个链接都是一个对象
|
||||
|
path: '/Book', //链接路径
|
||||
|
name: 'Book', //路由名称，
|
||||
|
component: Book //对应的组件模板
|
||||
|
}, |
||||
|
] |
||||
|
}) |
||||
@ -0,0 +1,14 @@ |
|||||
|
// utils/auth.js
|
||||
|
import Cookies from 'js-cookie'; |
||||
|
|
||||
|
export const setToken = (token) => { |
||||
|
Cookies.set('satoken', token, { expires: 7, secure: true, sameSite: 'strict' }); // Token有效期为7天
|
||||
|
}; |
||||
|
|
||||
|
export const getToken = () => { |
||||
|
return Cookies.get('satoken'); |
||||
|
}; |
||||
|
|
||||
|
export const removeToken = () => { |
||||
|
Cookies.remove('satoken'); |
||||
|
}; |
||||
@ -0,0 +1,137 @@ |
|||||
|
import axios from 'axios'; |
||||
|
|
||||
|
// import { ElMessage } from "element-ui";
|
||||
|
// import router from '../router/router';
|
||||
|
|
||||
|
// create an axios instance
|
||||
|
const service = axios.create({ |
||||
|
// baseURL: "http://127.0.0.1:10031/", // api 的 base_url
|
||||
|
baseURL: "http://127.0.0.1:10031/", // api 的 base_urls
|
||||
|
withCredentials: true, |
||||
|
timeout: 300000, // request timeout
|
||||
|
}); |
||||
|
|
||||
|
// request interceptor
|
||||
|
service.interceptors.request.use( |
||||
|
(config) => { |
||||
|
//config.headers['token'] = Auth.getToken()
|
||||
|
return config; |
||||
|
}, |
||||
|
(error) => { |
||||
|
// Do something with request error
|
||||
|
// console.log(error) // for debug
|
||||
|
Promise.reject(error); |
||||
|
} |
||||
|
); |
||||
|
|
||||
|
// response interceptor
|
||||
|
service.interceptors.response.use( |
||||
|
//response => response,
|
||||
|
/** |
||||
|
* 下面的注释为通过在response里，自定义code来标示请求状态 |
||||
|
* 当code返回如下情况则说明权限有问题，登出并返回到登录页 |
||||
|
* 如想通过 xmlhttprequest 来状态码标识 逻辑可写在下面error中 |
||||
|
* 以下代码均为样例，请结合自生需求加以修改，若不需要，则可删除 |
||||
|
*/ |
||||
|
// response => {
|
||||
|
// const res = response.data
|
||||
|
// if (res.code !== 20000) {
|
||||
|
// Message({
|
||||
|
// message: res.message,
|
||||
|
// type: 'error',
|
||||
|
// duration: 5 * 1000
|
||||
|
// })
|
||||
|
// // 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了;
|
||||
|
// if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
|
||||
|
// // 请自行在引入 MessageBox
|
||||
|
// // import { Message, MessageBox } from 'element-ui'
|
||||
|
// MessageBox.confirm('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', {
|
||||
|
// confirmButtonText: '重新登录',
|
||||
|
// cancelButtonText: '取消',
|
||||
|
// type: 'warning'
|
||||
|
// }).then(() => {
|
||||
|
// store.dispatch('FedLogOut').then(() => {
|
||||
|
// location.reload() // 为了重新实例化vue-router对象 避免bug
|
||||
|
// })
|
||||
|
// })
|
||||
|
// }
|
||||
|
// return Promise.reject('error')
|
||||
|
// } else {
|
||||
|
// return response.data
|
||||
|
// }
|
||||
|
// },
|
||||
|
(response) => { |
||||
|
let data; |
||||
|
// IE9时response.data是undefined，因此需要使用response.request.responseText(Stringify后的字符串)
|
||||
|
if (response.data == undefined) { |
||||
|
data = JSON.parse(response.request.responseText); |
||||
|
} else { |
||||
|
data = response.data; |
||||
|
// const code = response.data.code
|
||||
|
// if(code == '0') {
|
||||
|
// data = response.data.data
|
||||
|
// }else {
|
||||
|
// Message({
|
||||
|
// message: response.data.msg,
|
||||
|
// type: 'error',
|
||||
|
// duration: 5 * 1000
|
||||
|
// })
|
||||
|
// return Promise.reject('error')
|
||||
|
// }
|
||||
|
} |
||||
|
return data; |
||||
|
}, |
||||
|
(error) => { |
||||
|
if (error && error.response) { |
||||
|
switch (error.response.status) { |
||||
|
case 400: |
||||
|
error.message = '数据请求错误'; |
||||
|
break; |
||||
|
case 401: |
||||
|
error.message = '未授权，请登录'; |
||||
|
break; |
||||
|
case 403: |
||||
|
error.message = '拒绝访问'; |
||||
|
break; |
||||
|
case 404: |
||||
|
error.message = '请求地址出错'; |
||||
|
break; |
||||
|
case 408: |
||||
|
error.message = '请求超时'; |
||||
|
break; |
||||
|
case 500: |
||||
|
error.message = '服务器内部错误'; |
||||
|
break; |
||||
|
case 501: |
||||
|
error.message = '服务未实现'; |
||||
|
break; |
||||
|
case 502: |
||||
|
error.message = '网关错误'; |
||||
|
break; |
||||
|
case 503: |
||||
|
error.message = '服务不可用'; |
||||
|
break; |
||||
|
case 504: |
||||
|
error.message = '网关超时'; |
||||
|
break; |
||||
|
case 505: |
||||
|
error.message = 'HTTP版本不受支持'; |
||||
|
break; |
||||
|
default: |
||||
|
} |
||||
|
} |
||||
|
// ElMessage({
|
||||
|
// message: error.message || '系统错误！',
|
||||
|
// type: 'error',
|
||||
|
// duration: 3 * 1000,
|
||||
|
// });
|
||||
|
// if (error.response.status == 403) {
|
||||
|
// // eslint-disable-next-line no-undef
|
||||
|
// clearAllSession();
|
||||
|
// router.push('/');
|
||||
|
// }
|
||||
|
// return Promise.reject(error);
|
||||
|
} |
||||
|
); |
||||
|
|
||||
|
export default service; |
||||
@ -0,0 +1,228 @@ |
|||||
|
import Vue from "vue"; |
||||
|
let getevent = () => { |
||||
|
var Event = new Vue(); |
||||
|
return Event; |
||||
|
}; |
||||
|
const vueEvent = getevent(); |
||||
|
export { vueEvent }; |
||||
|
// 获取UUID
|
||||
|
export function getUUID() { |
||||
|
var s = []; |
||||
|
var hexDigits = '0123456789abcdef'; |
||||
|
for (var i = 0; i < 36; i++) { |
||||
|
s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1); |
||||
|
} |
||||
|
s[14] = '4'; // bits 12-15 of the time_hi_and_version field to 0010
|
||||
|
s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01
|
||||
|
s[8] = s[13] = s[18] = s[23] = '-'; |
||||
|
|
||||
|
var uuid = s.join(''); |
||||
|
return uuid; |
||||
|
} |
||||
|
//本地存储
|
||||
|
export function getlocal(name) { |
||||
|
let data = localStorage.getItem(name); |
||||
|
if (data != null && data != '') { |
||||
|
try { |
||||
|
let obj = eval('(' + data + ')'); |
||||
|
return obj; |
||||
|
} catch (e) { |
||||
|
return ''; |
||||
|
} |
||||
|
} else { |
||||
|
return ''; |
||||
|
} |
||||
|
} |
||||
|
export function getSession(name) { |
||||
|
let data = sessionStorage.getItem(name); |
||||
|
if (data != null && data != '') { |
||||
|
try { |
||||
|
let obj = eval('(' + data + ')'); |
||||
|
return obj; |
||||
|
} catch (e) { |
||||
|
return ''; |
||||
|
} |
||||
|
} else { |
||||
|
return ''; |
||||
|
} |
||||
|
} |
||||
|
export function setLocal(key, value) { |
||||
|
window.localStorage.setItem(key, JSON.stringify(value)); |
||||
|
} |
||||
|
export function setSession(key, value) { |
||||
|
window.sessionStorage.setItem(key, JSON.stringify(value)); |
||||
|
} |
||||
|
export function clearOneLocal(key) { |
||||
|
window.localStorage.removeItem(key); |
||||
|
} |
||||
|
export function clearOneSession(key) { |
||||
|
window.sessionStorage.removeItem(key); |
||||
|
} |
||||
|
export function clearAllLocal() { |
||||
|
window.localStorage.clear(); |
||||
|
} |
||||
|
export function clearAllSession() { |
||||
|
window.sessionStorage.clear(); |
||||
|
} |
||||
|
// 时间格式化
|
||||
|
export function parseTime(time, cFormat) { |
||||
|
if (arguments.length === 0) { |
||||
|
return null; |
||||
|
} |
||||
|
const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}'; |
||||
|
let date; |
||||
|
if (typeof time === 'object') { |
||||
|
date = time; |
||||
|
} else { |
||||
|
if (typeof time === 'string' && /^[0-9]+$/.test(time)) { |
||||
|
time = parseInt(time); |
||||
|
} |
||||
|
if (typeof time === 'number' && time.toString().length === 10) { |
||||
|
time = time * 1000; |
||||
|
} |
||||
|
date = new Date(time); |
||||
|
} |
||||
|
const formatObj = { |
||||
|
y: date.getFullYear(), |
||||
|
m: date.getMonth() + 1, |
||||
|
d: date.getDate(), |
||||
|
h: date.getHours(), |
||||
|
i: date.getMinutes(), |
||||
|
s: date.getSeconds(), |
||||
|
a: date.getDay(), |
||||
|
}; |
||||
|
const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => { |
||||
|
let value = formatObj[key]; |
||||
|
// Note: getDay() returns 0 on Sunday
|
||||
|
if (key === 'a') { |
||||
|
return ['日', '一', '二', '三', '四', '五', '六'][value]; |
||||
|
} |
||||
|
if (result.length > 0 && value < 10) { |
||||
|
value = '0' + value; |
||||
|
} |
||||
|
return value || 0; |
||||
|
}); |
||||
|
return time_str; |
||||
|
} |
||||
|
export function formatTime(time, option) { |
||||
|
if (('' + time).length === 10) { |
||||
|
time = parseInt(time) * 1000; |
||||
|
} else { |
||||
|
time = +time; |
||||
|
} |
||||
|
const d = new Date(time); |
||||
|
const now = Date.now(); |
||||
|
|
||||
|
const diff = (now - d) / 1000; |
||||
|
|
||||
|
if (diff < 30) { |
||||
|
return '刚刚'; |
||||
|
} else if (diff < 3600) { |
||||
|
// less 1 hour
|
||||
|
return Math.ceil(diff / 60) + '分钟前'; |
||||
|
} else if (diff < 3600 * 24) { |
||||
|
return Math.ceil(diff / 3600) + '小时前'; |
||||
|
} else if (diff < 3600 * 24 * 2) { |
||||
|
return '1天前'; |
||||
|
} |
||||
|
if (option) { |
||||
|
return parseTime(time, option); |
||||
|
} else { |
||||
|
return ( |
||||
|
d.getMonth() + 1 + '月' + d.getDate() + '日' + d.getHours() + '时' + d.getMinutes() + '分' |
||||
|
); |
||||
|
} |
||||
|
} |
||||
|
//登录错误提示
|
||||
|
export function errortip(info) { |
||||
|
vueEvent.$message({ |
||||
|
message: info, |
||||
|
type: 'error', |
||||
|
duration: '2000', |
||||
|
}); |
||||
|
} |
||||
|
//成功提示
|
||||
|
export function successtip(info) { |
||||
|
vueEvent.$message({ |
||||
|
message: info, |
||||
|
type: 'success', |
||||
|
duration: '2000', |
||||
|
}); |
||||
|
} |
||||
|
//警告提示
|
||||
|
export function warningtip(info) { |
||||
|
vueEvent.$message({ |
||||
|
message: info, |
||||
|
type: 'warning', |
||||
|
duration: '2000', |
||||
|
}); |
||||
|
} |
||||
|
// 单位格式化
|
||||
|
export function numberFormat(value) { |
||||
|
var param = ''; |
||||
|
var k = 10000, |
||||
|
sizes = ['', '万', '亿', '万亿'], |
||||
|
i; |
||||
|
if (value < k) { |
||||
|
param = value; |
||||
|
} else { |
||||
|
i = Math.floor(Math.log(value) / Math.log(k)); |
||||
|
param = (value / Math.pow(k, i)).toFixed(1) + sizes[i]; |
||||
|
} |
||||
|
return param; |
||||
|
} |
||||
|
// 数据格式化
|
||||
|
export function converdata(limit) { |
||||
|
limit = limit * 1; |
||||
|
var size = ''; |
||||
|
if (limit < 1024) { |
||||
|
size = limit + 'KB'; |
||||
|
} else if (limit < 1024 * 1024) { |
||||
|
size = (limit / 1024).toFixed(1) + 'MB'; |
||||
|
} else if (limit < 1024 * 1024 * 1024) { |
||||
|
size = (limit / (1024 * 1024)).toFixed(1) + 'GB'; |
||||
|
} else { |
||||
|
size = (limit / (1024 * 1024 * 1024)).toFixed(1) + 'TB'; |
||||
|
} |
||||
|
return size; |
||||
|
// var sizestr = size + "";
|
||||
|
// var len = sizestr.indexOf("\.");
|
||||
|
// var dec = sizestr.substr(len + 1, 2);
|
||||
|
// if(dec == "0"){//当小数点后为00时 去掉小数部分
|
||||
|
// return sizestr.substring(0,len) + sizestr.substr(len + 3,2);
|
||||
|
// }
|
||||
|
// return sizestr;
|
||||
|
} |
||||
|
// 单位格式化
|
||||
|
export function converunit(limit) { |
||||
|
limit = limit * 1; |
||||
|
var size = ''; |
||||
|
if (limit < 1024) { |
||||
|
size = 'KB'; |
||||
|
} else if (limit < 1024 * 1024) { |
||||
|
size = 'MB'; |
||||
|
} else if (limit < 1024 * 1024 * 1024) { |
||||
|
size = 'GB'; |
||||
|
} else { |
||||
|
size = 'TB'; |
||||
|
} |
||||
|
return size; |
||||
|
} |
||||
|
// 颜色转换
|
||||
|
// export function colorRgb(color) {
|
||||
|
// var color = color.toLowerCase();
|
||||
|
// var pattern = /^#([0-9|a-f]{3}|[0-9|a-f]{6})$/;
|
||||
|
// if (color && pattern.test(color)) {
|
||||
|
// if (color.length == 4) {
|
||||
|
// // 将三位转换为六位
|
||||
|
// color = '#' + color[1] + color[1] + color[2] + color[2] + color[3] + color[3];
|
||||
|
// }
|
||||
|
// //处理六位的颜色值
|
||||
|
// var colorNew = [];
|
||||
|
// for (var i = 1; i < 7; i += 2) {
|
||||
|
// colorNew.push(parseInt('0x' + color.slice(i, i + 2)));
|
||||
|
// }
|
||||
|
// return colorNew.join(',');
|
||||
|
// }
|
||||
|
// return color;
|
||||
|
// }
|
||||
@ -0,0 +1,274 @@ |
|||||
|
<template> |
||||
|
<div style="width: 100%;height: 100%;"> |
||||
|
<div style="width: 100%;height: 4vw;background-color: #42b983;"> |
||||
|
<div style="background-color: silver;width: 3vw;height: 2vw;line-height: 2vw;text-align: center;" @click="goHome">跳转回去</div> |
||||
|
</div> |
||||
|
<div> |
||||
|
|
||||
|
|
||||
|
aaaaaaaaaaaaaaaaaaa{{num}} |
||||
|
|
||||
|
</div> |
||||
|
<!-- <div style="width: 100%;height: 100%;">--> |
||||
|
<!-- <div class="gContainer">--> |
||||
|
<!-- <div id="graph-panel" style="width: 100%;height: 100%;"></div>--> |
||||
|
<!-- </div>--> |
||||
|
<!-- </div>--> |
||||
|
</div> |
||||
|
|
||||
|
</template> |
||||
|
<script> |
||||
|
import {getgraphInfo} from "@/api/login"; |
||||
|
import VisGraph from '@/assets/js/graphvis.min.20241008.js' |
||||
|
import LayoutFactory from '@/assets/js/graphvis.layout.min.js' |
||||
|
import {config} from '@/assets/defaultConfig.js' |
||||
|
export default { |
||||
|
// eslint-disable-next-line vue/multi-word-component-names |
||||
|
name: 'Home', |
||||
|
data() { |
||||
|
return{ |
||||
|
num:undefined, |
||||
|
infos:[], |
||||
|
demoData:{}, |
||||
|
graphData: { |
||||
|
nodes: [], |
||||
|
links: [] |
||||
|
}, |
||||
|
config, |
||||
|
} |
||||
|
}, |
||||
|
methods:{ |
||||
|
goHome(){ |
||||
|
this.$router.push('/') |
||||
|
}, |
||||
|
onCreated(editor) { |
||||
|
this.editor = Object.seal(editor) // 一定要用 Object.seal() ，否则会报错 |
||||
|
}, |
||||
|
getInfo(){ |
||||
|
var data = {} |
||||
|
getgraphInfo(data).then((res)=>{ |
||||
|
console.log(res); |
||||
|
this.infos = res; |
||||
|
var data1 = {}; |
||||
|
data1.nodes = this.infos.docList; |
||||
|
data1.links = this.infos.relaList; |
||||
|
this.zhengl(data1) |
||||
|
|
||||
|
}) |
||||
|
}, |
||||
|
async drawGraphData() { |
||||
|
this.graphData = this.demoData; |
||||
|
if (this.visGraph === null) { |
||||
|
this.createGraph(); |
||||
|
// this.genrateGraphData(); |
||||
|
this.visGraph.drawData(this.graphData); |
||||
|
// this.refreshGraphData(); |
||||
|
this.visGraph.incremaNodesCodinate(this.graphData.nodes); |
||||
|
this.reLayout(); |
||||
|
// this.goCenter(); |
||||
|
} else { |
||||
|
this.createGraph(); |
||||
|
|
||||
|
this.visGraph.drawData(this.graphData); |
||||
|
// this.refreshGraphData(); |
||||
|
this.visGraph.incremaNodesCodinate(this.graphData.nodes); |
||||
|
this.reLayout(); |
||||
|
// this.goCenter(); |
||||
|
} |
||||
|
this.loading = false; |
||||
|
}, |
||||
|
// 创建全局绘图客户端对象 |
||||
|
createGraph() { |
||||
|
this.visGraph = new VisGraph(document.getElementById('graph-panel'), this.config) |
||||
|
}, |
||||
|
// 执行布局算法 |
||||
|
reLayout(alpha) { |
||||
|
var that = this; |
||||
|
if (alpha == null) { |
||||
|
that.visLayout = null; |
||||
|
that.visLayout = new LayoutFactory(this.visGraph.getGraphData()).createLayout('fastFR'); |
||||
|
that.visLayout.resetConfig({ |
||||
|
label: { |
||||
|
show: true |
||||
|
}, |
||||
|
friction: 0.8, |
||||
|
linkDistance: 400, |
||||
|
linkStrength: 0.2, |
||||
|
charge: -1000, |
||||
|
gravity: 0.01, |
||||
|
noverlap: true, |
||||
|
size: [that.visGraph.stage.width, that.visGraph.stage.height] |
||||
|
}); |
||||
|
} else { |
||||
|
that.visLayout.alpha += (alpha > 1 ? 0.2 : alpha); //继续运动 |
||||
|
} |
||||
|
|
||||
|
runLayout();//开始继续动画执行 |
||||
|
|
||||
|
//通过动画帧控制控制布局算法的执行，有动画效果 |
||||
|
function runLayout() { |
||||
|
cancelAnimationFrame(that.layoutLoopName);//停止动画控制 |
||||
|
that.visLayout.runLayout(); //运行布局算法 |
||||
|
that.visGraph.refresh(); |
||||
|
if (that.visLayout.alpha > 0.05) { |
||||
|
that.layoutLoopName = requestAnimationFrame(runLayout); |
||||
|
} else { |
||||
|
if (that.visGraph.currentNode && that.visGraph.currentNode.isDragging) { |
||||
|
that.visLayout.alpha = 0.1; //继续运动 |
||||
|
that.layoutLoopName = requestAnimationFrame(runLayout); |
||||
|
} else { |
||||
|
that.visLayout.alpha = 0; //停止运动 |
||||
|
cancelAnimationFrame(that.layoutLoopName); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// this.autoLayout(); |
||||
|
}, |
||||
|
zhengl(data) { |
||||
|
const nodes = [] |
||||
|
const links = [] // 存放节点和关系 |
||||
|
// const nodeSet = [] // 存放去重后nodes的id |
||||
|
var nodeList = data.nodes; |
||||
|
var lineList = data.links; |
||||
|
console.log(nodeList); |
||||
|
console.log(lineList); |
||||
|
for (let a = 0; a < nodeList.length; a++) { |
||||
|
if (nodeList[a].group == '0') { |
||||
|
const aaa = {name: nodeList[a].docTitle, docId: nodeList[a].docId,docLevel: nodeList[a].group} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].Id, |
||||
|
label: nodeList[a].docTitle, |
||||
|
properties: aaa, |
||||
|
size: 450, |
||||
|
color: '227,203,0', |
||||
|
font: 'normal 70px Arial', |
||||
|
fontColor: '255,255,255' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '1') { |
||||
|
const aaa = {name: nodeList[a].docTitle, docId: nodeList[a].docId,docLevel: nodeList[a].group} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].Id, |
||||
|
label: nodeList[a].docTitle, |
||||
|
properties: aaa, |
||||
|
size: 350, |
||||
|
width:350, |
||||
|
height:300, |
||||
|
color: '47,47,230', |
||||
|
font: 'normal 68px Arial', |
||||
|
fontColor: '255,255,255' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '2') { |
||||
|
const aaa = {name: nodeList[a].docTitle, docId: nodeList[a].docId,docLevel: nodeList[a].group} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].Id, |
||||
|
label: nodeList[a].docTitle, |
||||
|
properties: aaa, |
||||
|
size: 300, |
||||
|
width:300, |
||||
|
height:250, |
||||
|
color: '255,138,0', |
||||
|
font: 'normal 50px Arial', |
||||
|
fontColor: '255,255,255' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '3') { |
||||
|
const aaa = {name: nodeList[a].docTitle, docId: nodeList[a].docId,docLevel: nodeList[a].group} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].Id, |
||||
|
label: nodeList[a].docTitle, |
||||
|
properties: aaa, |
||||
|
size: 250, |
||||
|
width:250, |
||||
|
height:250, |
||||
|
color: '30,255,0', |
||||
|
font: 'normal 40px Arial', |
||||
|
fontColor: '0,0,0' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '4') { |
||||
|
const aaa = {name: nodeList[a].docTitle, docId: nodeList[a].docId,docLevel: nodeList[a].group} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].Id, |
||||
|
label: nodeList[a].docTitle, |
||||
|
properties: aaa, |
||||
|
size: 200, |
||||
|
width:200, |
||||
|
height:200, |
||||
|
color: '248,143,248', |
||||
|
font: 'normal 32px Arial', |
||||
|
fontColor: '255,255,255' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '5') { |
||||
|
const aaa = {name: nodeList[a].docTitle, docId: nodeList[a].docId,docLevel: nodeList[a].group} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].Id, |
||||
|
label: nodeList[a].docTitle, |
||||
|
properties: aaa, |
||||
|
size: 150, |
||||
|
width:150, |
||||
|
height:150, |
||||
|
color: '65,154,255', |
||||
|
font: 'normal 30px Arial', |
||||
|
fontColor: '255,255,255' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '6') { |
||||
|
const aaa = {name: nodeList[a].docTitle, docId: nodeList[a].docId,docLevel: nodeList[a].group} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].Id, |
||||
|
label: nodeList[a].docTitle, |
||||
|
properties: aaa, |
||||
|
size: 100, |
||||
|
width:100, |
||||
|
height:100, |
||||
|
color: '0,228,255', |
||||
|
font: 'normal 28px Arial', |
||||
|
fontColor: '0,0,0' |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
for (let b = 0; b < lineList.length; b++) { |
||||
|
|
||||
|
var bbb = {name: lineList[b].relate} |
||||
|
links.push({ |
||||
|
source: lineList[b].source, |
||||
|
target: lineList[b].target, |
||||
|
type: lineList[b].relate, |
||||
|
properties: bbb, |
||||
|
color: '202,202,202', |
||||
|
lineWidth: 3, |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
this.demoData = { |
||||
|
"nodes": nodes, |
||||
|
"links": links |
||||
|
} |
||||
|
this.drawGraphData(); |
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
// this.getInfo(); |
||||
|
this.num = this.$route.query.id; |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style scoped> |
||||
|
.gContainer { |
||||
|
position: relative; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
overflow: hidden; |
||||
|
width: 100%; |
||||
|
height: 45vw; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,276 @@ |
|||||
|
<template> |
||||
|
<div style="width: 100%;height: 100%;"> |
||||
|
<div style="width: 100%;height: 4vw;background-color: #42b983;"> |
||||
|
<div style="background-color: silver;width: 3vw;height: 2vw;line-height: 2vw;text-align: center;" @click="goBook">跳转1</div> |
||||
|
</div> |
||||
|
<div style="width: 100%;height: 100%;"> |
||||
|
<div class="gContainer"> |
||||
|
<div id="graph-panel" style="width: 100%;height: 100%;"></div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
</template> |
||||
|
<script> |
||||
|
import {getgraphInfo, test, userLogin} from "@/api/login"; |
||||
|
import VisGraph from '@/assets/js/graphvis.min.20241008.js' |
||||
|
import LayoutFactory from '@/assets/js/graphvis.layout.min.js' |
||||
|
import {config} from '@/assets/defaultConfig.js' |
||||
|
|
||||
|
export default { |
||||
|
// eslint-disable-next-line vue/multi-word-component-names |
||||
|
name: 'Home', |
||||
|
data() { |
||||
|
return{ |
||||
|
infos:[], |
||||
|
demoData:{}, |
||||
|
graphData: { |
||||
|
nodes: [], |
||||
|
links: [] |
||||
|
}, |
||||
|
config, |
||||
|
} |
||||
|
}, |
||||
|
methods:{ |
||||
|
goBook(){ |
||||
|
this.$router.push({name:'Book',query: {id:'1'}}) |
||||
|
}, |
||||
|
onCreated(editor) { |
||||
|
this.editor = Object.seal(editor) // 一定要用 Object.seal() ，否则会报错 |
||||
|
}, |
||||
|
getInfo(){ |
||||
|
var data = {} |
||||
|
getgraphInfo(data).then((res)=>{ |
||||
|
this.zhengl(res.data); |
||||
|
|
||||
|
}) |
||||
|
}, |
||||
|
async drawGraphData() { |
||||
|
this.graphData = this.demoData; |
||||
|
if (this.visGraph === null) { |
||||
|
this.createGraph(); |
||||
|
// this.genrateGraphData(); |
||||
|
this.visGraph.drawData(this.graphData); |
||||
|
// this.refreshGraphData(); |
||||
|
this.visGraph.incremaNodesCodinate(this.graphData.nodes); |
||||
|
this.reLayout(); |
||||
|
// this.goCenter(); |
||||
|
} else { |
||||
|
this.createGraph(); |
||||
|
|
||||
|
this.visGraph.drawData(this.graphData); |
||||
|
// this.refreshGraphData(); |
||||
|
this.visGraph.incremaNodesCodinate(this.graphData.nodes); |
||||
|
this.reLayout(); |
||||
|
// this.goCenter(); |
||||
|
} |
||||
|
this.loading = false; |
||||
|
}, |
||||
|
// 创建全局绘图客户端对象 |
||||
|
createGraph() { |
||||
|
this.visGraph = new VisGraph(document.getElementById('graph-panel'), this.config) |
||||
|
}, |
||||
|
// 执行布局算法 |
||||
|
reLayout(alpha) { |
||||
|
var that = this; |
||||
|
if (alpha == null) { |
||||
|
that.visLayout = null; |
||||
|
that.visLayout = new LayoutFactory(this.visGraph.getGraphData()).createLayout('fastFR'); |
||||
|
that.visLayout.resetConfig({ |
||||
|
label: { |
||||
|
show: true |
||||
|
}, |
||||
|
friction: 0.8, |
||||
|
linkDistance: 400, |
||||
|
linkStrength: 0.2, |
||||
|
charge: -1000, |
||||
|
gravity: 0.01, |
||||
|
noverlap: true, |
||||
|
size: [that.visGraph.stage.width, that.visGraph.stage.height] |
||||
|
}); |
||||
|
} else { |
||||
|
that.visLayout.alpha += (alpha > 1 ? 0.2 : alpha); //继续运动 |
||||
|
} |
||||
|
|
||||
|
runLayout();//开始继续动画执行 |
||||
|
|
||||
|
//通过动画帧控制控制布局算法的执行，有动画效果 |
||||
|
function runLayout() { |
||||
|
cancelAnimationFrame(that.layoutLoopName);//停止动画控制 |
||||
|
that.visLayout.runLayout(); //运行布局算法 |
||||
|
that.visGraph.refresh(); |
||||
|
if (that.visLayout.alpha > 0.05) { |
||||
|
that.layoutLoopName = requestAnimationFrame(runLayout); |
||||
|
} else { |
||||
|
if (that.visGraph.currentNode && that.visGraph.currentNode.isDragging) { |
||||
|
that.visLayout.alpha = 0.1; //继续运动 |
||||
|
that.layoutLoopName = requestAnimationFrame(runLayout); |
||||
|
} else { |
||||
|
that.visLayout.alpha = 0; //停止运动 |
||||
|
cancelAnimationFrame(that.layoutLoopName); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// this.autoLayout(); |
||||
|
}, |
||||
|
zhengl(data) { |
||||
|
const nodes = [] |
||||
|
const links = [] // 存放节点和关系 |
||||
|
|
||||
|
var nodeList = data.nodes; |
||||
|
var lineList = data.links; |
||||
|
|
||||
|
var allOne = nodeList[0].docId |
||||
|
for (let a = 0; a < nodeList.length; a++) { |
||||
|
if (nodeList[a].group == '0') { |
||||
|
const aaa = {name: nodeList[a].name, docId: nodeList[a].docId, parent: allOne} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].id, |
||||
|
label: nodeList[a].name, |
||||
|
properties: aaa, |
||||
|
size: 450, |
||||
|
color: '227,203,0', |
||||
|
font: 'normal 70px Arial', |
||||
|
fontColor: '255,255,255' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '1') { |
||||
|
const aaa = {name: nodeList[a].name, docId: nodeList[a].docId, parent: allOne} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].id, |
||||
|
label: nodeList[a].name, |
||||
|
properties: aaa, |
||||
|
size: 350, |
||||
|
width:350, |
||||
|
height:300, |
||||
|
color: '47,47,230', |
||||
|
font: 'normal 68px Arial', |
||||
|
fontColor: '255,255,255' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '2') { |
||||
|
const aaa = {name: nodeList[a].name, docId: nodeList[a].docId, parent: allOne} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].id, |
||||
|
label: nodeList[a].name, |
||||
|
properties: aaa, |
||||
|
size: 300, |
||||
|
width:300, |
||||
|
height:250, |
||||
|
color: '255,138,0', |
||||
|
font: 'normal 50px Arial', |
||||
|
fontColor: '255,255,255' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '3') { |
||||
|
const aaa = {name: nodeList[a].name, docId: nodeList[a].docId, parent: allOne} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].id, |
||||
|
label: nodeList[a].name, |
||||
|
properties: aaa, |
||||
|
size: 250, |
||||
|
width:250, |
||||
|
height:250, |
||||
|
color: '30,255,0', |
||||
|
font: 'normal 40px Arial', |
||||
|
fontColor: '0,0,0' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '4') { |
||||
|
const aaa = {name: nodeList[a].name, docId: nodeList[a].docId, parent: allOne} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].id, |
||||
|
label: nodeList[a].name, |
||||
|
properties: aaa, |
||||
|
size: 200, |
||||
|
width:200, |
||||
|
height:200, |
||||
|
color: '248,143,248', |
||||
|
font: 'normal 32px Arial', |
||||
|
fontColor: '255,255,255' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '5') { |
||||
|
const aaa = {name: nodeList[a].name, docId: nodeList[a].docId, parent: allOne} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].id, |
||||
|
label: nodeList[a].name, |
||||
|
properties: aaa, |
||||
|
size: 150, |
||||
|
width:150, |
||||
|
height:150, |
||||
|
color: '65,154,255', |
||||
|
font: 'normal 30px Arial', |
||||
|
fontColor: '255,255,255' |
||||
|
}) |
||||
|
} |
||||
|
if (nodeList[a].group == '6') { |
||||
|
const aaa = {name: nodeList[a].name, docId: nodeList[a].docId, parent: allOne} |
||||
|
nodes.push({ |
||||
|
id: nodeList[a].id, |
||||
|
label: nodeList[a].name, |
||||
|
properties: aaa, |
||||
|
size: 100, |
||||
|
width:100, |
||||
|
height:100, |
||||
|
color: '0,228,255', |
||||
|
font: 'normal 28px Arial', |
||||
|
fontColor: '0,0,0' |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
for (let b = 0; b < lineList.length; b++) { |
||||
|
|
||||
|
var bbb = {name: lineList[b].relate} |
||||
|
links.push({ |
||||
|
source: lineList[b].source, |
||||
|
target: lineList[b].target, |
||||
|
type: lineList[b].relate, |
||||
|
properties: bbb, |
||||
|
color: '202,202,202', |
||||
|
lineWidth: 3, |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
this.demoData = { |
||||
|
"nodes": nodes, |
||||
|
"links": links |
||||
|
} |
||||
|
this.drawGraphData(); |
||||
|
}, |
||||
|
|
||||
|
doLogin(){ |
||||
|
userLogin().then((res)=>{ |
||||
|
console.log(res); |
||||
|
this.testInfo(); |
||||
|
this.getInfo(); |
||||
|
}) |
||||
|
}, |
||||
|
testInfo(){ |
||||
|
test().then((res)=>{ |
||||
|
console.log(res); |
||||
|
}) |
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
this.doLogin(); |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style scoped> |
||||
|
.gContainer { |
||||
|
position: relative; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
overflow: hidden; |
||||
|
width: 100%; |
||||
|
height: 45vw; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,4 @@ |
|||||
|
const { defineConfig } = require('@vue/cli-service') |
||||
|
module.exports = defineConfig({ |
||||
|
transpileDependencies: true |
||||
|
}) |
||||
Loading…
Reference in new issue