Commit 26695478 authored by 乐宝呗666's avatar 乐宝呗666

code init

parents
Pipeline #306 failed with stages
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/dist
/node_modules
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
\ No newline at end of file
MIT License
Copyright (c) 2018 李杨
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
[D2Admin](https://github.com/d2-projects/d2-admin) is a fully open source and free enterprise back-end product front-end integration solution, using the latest front-end technology stack, javascript files loading of local first screen less than 60kb, has prepared most of the project preparations, and with a lot of sample code to help the management system agile development.
[中文](https://github.com/d2-projects/d2-admin-start-kit/blob/master/README.zh.md) | **English**
## Preview
![Deploy preview](https://github.com/d2-projects/d2-admin-start-kit/workflows/Deploy%20preview/badge.svg)
[![Netlify Status](https://api.netlify.com/api/v1/badges/08ff8c93-f0a8-497a-a081-440b31fb3aa4/deploy-status)](https://app.netlify.com/sites/d2-admin-start-kit/deploys)
The following access addresses are built and deployed by the latest master branch code at the same time. The access effect is completely consistent. Please select the appropriate access link according to your own network situation.
| server | link | server |
| --- | --- | --- |
| d2.pub | [d2.pub/d2-admin-start-kit/preview](https://d2.pub/d2-admin-start-kit/preview) | China server |
| cdn.d2.pub | [cdn.d2.pub/d2-admin-start-kit/preview](https://cdn.d2.pub/d2-admin-start-kit/preview) | qiniu CDN |
| github | [d2-projects.github.io/d2-admin-start-kit](https://d2-projects.github.io/d2-admin-start-kit) | GitHub pages |
| netlify | [d2-admin-start-kit.netlify.com](https://d2-admin-start-kit.netlify.com) | Netlify CDN |
## Other synchronous repositories
| type | link |
| --- | --- |
| gitee | [https://gitee.com/d2-projects/d2-admin](https://gitee.com/d2-projects/d2-admin) |
| coding | [https://d2-projects.coding.net/p/d2-projects/d/d2-admin/git](https://d2-projects.coding.net/p/d2-projects/d/d2-admin/git) |
\ No newline at end of file
[D2Admin](https://github.com/d2-projects/d2-admin) 是一个完全 **开源免费** 的企业中后台产品前端集成方案,使用最新的前端技术栈,小于 60kb 的本地首屏 js 加载,已经做好大部分项目前期准备工作,并且带有大量示例代码,助力管理系统敏捷开发。
**中文** | [English](https://github.com/d2-projects/d2-admin-start-kit)
## 预览
![Deploy preview](https://github.com/d2-projects/d2-admin-start-kit/workflows/Deploy%20preview/badge.svg)
[![Netlify Status](https://api.netlify.com/api/v1/badges/08ff8c93-f0a8-497a-a081-440b31fb3aa4/deploy-status)](https://app.netlify.com/sites/d2-admin-start-kit/deploys)
下列访问地址均由最新的 master 分支代码同时构建部署,访问效果完全一致,请根据自身网络情况选择合适的访问链接。
| 位置 | 链接 | 部署位置 |
| --- | --- | --- |
| d2.pub | [preview](https://d2.pub/d2-admin-start-kit/preview) | 中国服务器 |
| cdn.d2.pub | [preview](https://cdn.d2.pub/d2-admin-start-kit/preview) | 七牛云 CDN |
| github | [preview](https://d2-projects.github.io/d2-admin-start-kit) | GitHub pages |
| netlify | [preview](https://d2-admin-start-kit.netlify.com) | Netlify CDN |
## 其它同步仓库
| 位置 | 链接 |
| --- | --- |
| 码云 | [https://gitee.com/d2-projects/d2-admin-start-kit](https://gitee.com/d2-projects/d2-admin-start-kit) |
| coding | [https://d2-projects.coding.net/p/d2-projects/d/d2-admin-start-kit/git](https://d2-projects.coding.net/p/d2-projects/d/d2-admin-start-kit/git) |
> 如果您在 github 仓库下载很慢,可以尝试使用我们的码云仓库克隆代码
\ No newline at end of file
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
],
// 允许两种编码引入方式共存,也就是 common 规范与 es6 规范的共存处理
sourceType: 'unambiguous',
}
<babeledit_project version="1.2">
<!--
BabelEdit project file
https://www.codeandweb.com/babeledit
This file contains meta data for all translations, but not the translation texts itself.
They are stored in framework-specific message files (.json / .vue / .yaml / .properties)
-->
<preset_collections/>
<framework>vue-json</framework>
<filename>d2-admin.babel</filename>
<source_root_dir></source_root_dir>
<folder_node>
<name></name>
<children>
<concept_node>
<name>_element</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>ja-JP</language>
<approved>false</approved>
</translation>
<translation>
<language>zh-CHS</language>
<approved>false</approved>
</translation>
<translation>
<language>zh-CHT</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<concept_node>
<name>_name</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>ja-JP</language>
<approved>false</approved>
</translation>
<translation>
<language>zh-CHS</language>
<approved>false</approved>
</translation>
<translation>
<language>zh-CHT</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
<folder_node>
<name>page</name>
<children>
<folder_node>
<name>demo</name>
<children>
<folder_node>
<name>playground</name>
<children>
<folder_node>
<name>locales</name>
<children>
<concept_node>
<name>text</name>
<definition_loaded>false</definition_loaded>
<description></description>
<comment></comment>
<default_text></default_text>
<translations>
<translation>
<language>en-US</language>
<approved>false</approved>
</translation>
<translation>
<language>ja-JP</language>
<approved>false</approved>
</translation>
<translation>
<language>zh-CHS</language>
<approved>false</approved>
</translation>
<translation>
<language>zh-CHT</language>
<approved>false</approved>
</translation>
</translations>
</concept_node>
</children>
</folder_node>
</children>
</folder_node>
</children>
</folder_node>
</children>
</folder_node>
</children>
</folder_node>
<isTemplateProject>false</isTemplateProject>
<languages>
<language>
<code>en-US</code>
<source_id></source_id>
<source_file>src/locales/en.json</source_file>
</language>
<language>
<code>ja-JP</code>
<source_id></source_id>
<source_file>src/locales/ja.json</source_file>
</language>
<language>
<code>zh-CHS</code>
<source_id></source_id>
<source_file>src/locales/zh-chs.json</source_file>
</language>
<language>
<code>zh-CHT</code>
<source_id></source_id>
<source_file>src/locales/zh-cht.json</source_file>
</language>
</languages>
<translation_files>
<translation_file>
<file>src/locales/en.json</file>
</translation_file>
<translation_file>
<file>src/locales/ja.json</file>
</translation_file>
<translation_file>
<file>src/locales/zh-chs.json</file>
</translation_file>
<translation_file>
<file>src/locales/zh-cht.json</file>
</translation_file>
</translation_files>
<editor_configuration>
<save_empty_translations>true</save_empty_translations>
<copy_templates>
<copy_template>$t('%1')</copy_template>
<copy_template>{{ $t('%1') }}</copy_template>
<copy_template>this.$t('%1')</copy_template>
</copy_templates>
</editor_configuration>
<primary_language>zh-CHS</primary_language>
<configuration>
<indent>tab</indent>
<format>namespaced-json</format>
</configuration>
</babeledit_project>
module.exports = [
{ name: 'vue', library: 'Vue', js: 'https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.min.js', css: '' },
{ name: 'vue-i18n', library: 'VueI18n', js: 'https://cdn.jsdelivr.net/npm/vue-i18n@8.15.1/dist/vue-i18n.min.js', css: '' },
{ name: 'vue-router', library: 'VueRouter', js: 'https://cdn.jsdelivr.net/npm/vue-router@3.1.3/dist/vue-router.min.js', css: '' },
{ name: 'vuex', library: 'Vuex', js: 'https://cdn.jsdelivr.net/npm/vuex@3.1.2/dist/vuex.min.js', css: '' },
{ name: 'axios', library: 'axios', js: 'https://cdn.jsdelivr.net/npm/axios@0.19.0/dist/axios.min.js', css: '' },
{ name: 'better-scroll', library: 'BScroll', js: 'https://cdn.jsdelivr.net/npm/better-scroll@1.15.2/dist/bscroll.min.js', css: '' },
{ name: 'axios-mock-adapter', library: 'AxiosMockAdapter', js: 'https://cdn.jsdelivr.net/npm/axios-mock-adapter@1.18.1/dist/axios-mock-adapter.min.js', css: '' },
{ name: 'element-ui', library: 'ELEMENT', js: 'https://cdn.jsdelivr.net/npm/element-ui@2.13.1/lib/index.js', css: 'https://cdn.jsdelivr.net/npm/element-ui@2.13.0/lib/theme-chalk/index.css' },
{ name: 'lodash', library: '_', js: 'https://cdn.jsdelivr.net/npm/lodash@4.17.15/lodash.min.js', css: '' },
{ name: 'ua-parser-js', library: 'UAParser', js: 'https://cdn.jsdelivr.net/npm/ua-parser-js@0.7.20/dist/ua-parser.min.js', css: '' },
{ name: 'js-cookie', library: 'Cookies', js: 'https://cdn.jsdelivr.net/npm/js-cookie@2.2.1/src/js.cookie.min.js', css: '' },
{ name: 'nprogress', library: 'NProgress', js: 'https://cdn.jsdelivr.net/npm/nprogress@0.2.0/nprogress.min.js', css: 'https://cdn.jsdelivr.net/npm/nprogress@0.2.0/nprogress.css' },
{ name: 'dayjs', library: 'dayjs', js: 'https://cdn.jsdelivr.net/npm/dayjs@1.8.17/dayjs.min.js', css: '' },
{ name: 'fuse.js', library: 'Fuse', js: 'https://cdn.jsdelivr.net/npm/fuse.js@5.2.3/dist/fuse.min.js', css: '' },
{ name: 'hotkeys-js', library: 'hotkeys', js: 'https://cdn.jsdelivr.net/npm/hotkeys-js@3.7.3/dist/hotkeys.min.js', css: '' },
{ name: 'qs', library: 'Qs', js: 'https://cdn.jsdelivr.net/npm/qs@6.9.1/dist/qs.js', css: '' },
{ name: 'lowdb', library: 'low', js: 'https://cdn.jsdelivr.net/npm/lowdb@1.0.0/dist/low.min.js', css: '' },
{ name: 'lowdb/adapters/LocalStorage', library: 'LocalStorage', js: 'https://cdn.jsdelivr.net/npm/lowdb@1.0.0/dist/LocalStorage.min.js', css: '' },
{ name: 'screenfull', library: 'screenfull', js: 'https://cdn.jsdelivr.net/npm/screenfull@5.0.2/dist/screenfull.min.js', css: '' },
{ name: 'sortablejs', library: 'Sortable', js: 'https://cdn.jsdelivr.net/npm/sortablejs@1.10.1/Sortable.min.js', css: '' }
]
module.exports = {
preset: '@vue/cli-plugin-unit-jest'
}
{
"compilerOptions": {
"target": "es2017",
"allowSyntheticDefaultImports": false,
"baseUrl": "./",
"paths": {
"@/*": ["src/*"]
}
},
"exclude": ["node_modules", "dist"]
}
This diff is collapsed.
{
"name": "d2-admin",
"version": "1.14.0",
"scripts": {
"serve": "vue-cli-service serve --open",
"start": "npm run serve",
"dev": "npm run serve",
"build": "vue-cli-service build",
"build:preview": "NODE_OPTIONS=--max_old_space_size=4096 vue-cli-service build --mode preview",
"lint": "vue-cli-service lint --fix",
"test:unit": "vue-cli-service test:unit"
},
"dependencies": {
"axios": "^0.19.0",
"axios-mock-adapter": "^1.18.1",
"better-scroll": "^1.15.2",
"core-js": "^3.4.3",
"dayjs": "^1.8.17",
"echarts": "^4.7.0",
"echarts-liquidfill": "^2.0.6",
"echarts-wordcloud": "^1.1.3",
"element-ui": "^2.13.1",
"faker": "^4.1.0",
"flex.css": "^1.1.7",
"fuse.js": "^5.2.3",
"hotkeys-js": "^3.7.3",
"js-cookie": "^2.2.1",
"lib-flexible": "^0.3.2",
"lodash": "^4.17.15",
"lowdb": "^1.0.0",
"nprogress": "^0.2.0",
"qs": "^6.7.0",
"screenfull": "^5.0.2",
"sortablejs": "^1.10.1",
"ua-parser-js": "^0.7.20",
"vis": "^4.21.0-EOL",
"vue": "^2.6.11",
"vue-i18n": "^8.15.1",
"vue-router": "^3.1.3",
"vuex": "^3.1.2"
},
"devDependencies": {
"@d2-projects/vue-filename-injector": "^1.1.0",
"@kazupon/vue-i18n-loader": "^0.5.0",
"@vue/cli-plugin-babel": "^4.1.0",
"@vue/cli-plugin-eslint": "^4.1.0",
"@vue/cli-plugin-router": "^4.1.0",
"@vue/cli-plugin-unit-jest": "^4.1.0",
"@vue/cli-plugin-vuex": "^4.1.0",
"@vue/cli-service": "^4.1.0",
"@vue/eslint-config-standard": "^5.1.2",
"@vue/test-utils": "^1.0.2",
"babel-eslint": "^10.0.3",
"compression-webpack-plugin": "^3.0.1",
"cz-conventional-changelog": "^3.2.0",
"eslint": "^6.8.0",
"eslint-plugin-import": "^2.20.2",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^4.2.1",
"eslint-plugin-standard": "^4.0.1",
"eslint-plugin-vue": "^6.2.2",
"px2rem-loader": "^0.1.9",
"sass": "^1.23.7",
"sass-loader": "^8.0.0",
"svg-sprite-loader": "^4.1.6",
"text-loader": "^0.0.1",
"vue-cli-plugin-i18n": "^1.0.1",
"vue-template-compiler": "^2.6.10",
"webpack-bundle-analyzer": "^3.6.0",
"webpack-theme-color-replacer": "^1.3.3"
},
"config": {
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
},
"repository": {
"type": "git",
"url": "https://github.com/d2-projects/d2-admin.git"
}
}
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32" fill="white">
<path opacity=".25" d="M16 0 A16 16 0 0 0 16 32 A16 16 0 0 0 16 0 M16 4 A12 12 0 0 1 16 28 A12 12 0 0 1 16 4"/>
<path d="M16 0 A16 16 0 0 1 32 16 L28 16 A12 12 0 0 0 16 4z">
<animateTransform attributeName="transform" type="rotate" from="0 16 16" to="360 16 16" dur="0.8s" repeatCount="indefinite" />
</path>
</svg>
\ No newline at end of file
<!DOCTYPE html>
<html>
<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 %>icon.ico">
<!-- 使用 CDN 加速的 CSS 文件,配置在 vue.config.js 下 -->
<% for (var i in htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.css) { %>
<link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="preload" as="style">
<link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="stylesheet">
<% } %>
<!-- 使用 CDN 加速的 JS 文件,配置在 vue.config.js 下 -->
<% for (var i in htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.js) { %>
<link href="<%= htmlWebpackPlugin.options.cdn.js[i] %>" rel="preload" as="script">
<% } %>
<title><%= VUE_APP_TITLE %></title>
<style>
html, body, #app { height: 100%; margin: 0px; padding: 0px; width: 100%; }
.d2-home { background-color: #303133; height: 100%; display: flex; flex-direction: column; }
.d2-home__main { user-select: none; width: 100%; flex-grow: 1; display: flex; justify-content: center; align-items: center; flex-direction: column; }
.d2-home__footer { width: 100%; flex-grow: 0; text-align: center; padding: 1em 0; }
.d2-home__footer > a { font-size: 12px; color: #ABABAB; text-decoration: none; }
.d2-home__loading { height: 32px; width: 32px; margin-bottom: 20px; }
</style>
<script>
var _hmt = _hmt || [];
var hmid = "bc38887aa5588add05a38704342ad7e8";
(function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?" + hmid; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s);})();
</script>
</head>
<body>
<noscript>
<strong>
Sorry, D2Admin will not work properly without JavaScript support. Enable JavaScript for browsers and continue.
</strong>
</noscript>
<div id="app">
<div class="d2-home">
<div class="d2-home__main">
<img
class="d2-home__loading"
src="./image/loading/loading-spin.svg"
alt="loading">
</div>
<div class="d2-home__footer">
<a
href="https://github.com/d2-projects/d2-admin"
target="_blank">
https://github.com/d2-projects/d2-admin
</a>
</div>
</div>
</div>
<!-- 使用 CDN 加速的 JS 文件,配置在 vue.config.js 下 -->
<% for (var i in htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.js) { %>
<script src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
<% } %>
</body>
</html>
<template>
<div id="app">
<!-- <login></login> -->
<router-view/>
</div>
</template>
<script>
import util from '@/libs/util'
// import login from '@/views/system/login/page.vue'
export default {
name: 'app',
// components: {
// login
// },
watch: {
'$i18n.locale': 'i18nHandle'
},
created () {
this.i18nHandle(this.$i18n.locale)
},
methods: {
i18nHandle (val, oldVal) {
util.cookies.set('lang', val)
document.querySelector('html').setAttribute('lang', val)
}
}
}
</script>
<style lang="scss">
@import '~@/assets/style/public-class.scss';
</style>
import { service, request, serviceForMock, requestForMock, mock } from './service'
// 获取商机
export function GetBusinessList () {
return request({
url: '/tp/niche/list',
method: 'get'
})
}
import { service, request, serviceForMock, requestForMock, mock } from './service'
// 获取客户图标信息
export function GetClientList () {
return request({
url: '/tp/customer/list',
method: 'get'
})
}
// 根据客户name查询
export function GetCustomerName (name) {
return request({
url: `/tp/customer/getByName?name=${name}`,
method: 'get'
})
}
// 根据客户id查询
export function GetCustomerId (id) {
return request({
url: `/tp/customer/getById?id=${id} `,
method: 'get'
})
}
// 默认展示
export function CustomerInfo () {
return request({
url: '/tp/customer/getById',
method: 'get'
})
}
import { assign, map } from 'lodash'
import faker from 'faker/locale/zh_CN'
import { service, request, serviceForMock, requestForMock, mock } from './service'
// import * as tools from './tools'
const files = require.context('./modules', false, /\.js$/)
const generators = files.keys().map(key => files(key).default)
export default assign({}, ...map(generators, generator => generator({
service,
request,
serviceForMock,
requestForMock,
mock,
faker
})))
import { find, assign } from 'lodash'
const users = [
{ username: 'admin', password: 'admin', uuid: 'admin-uuid', name: 'Admin' },
{ username: 'editor', password: 'editor', uuid: 'editor-uuid', name: 'Editor' },
{ username: 'user1', password: 'user1', uuid: 'user1-uuid', name: 'User1' }
]
export default ({ service, request, serviceForMock, requestForMock, mock, faker }) => ({
/**
* @description 登录
* @param {Object} data 登录携带的信息
*/
SYS_USER_LOGIN (data = {}) {
// 模拟数据
// mock
// .onAny('/login')
// .reply(config => {
// const user = find(users, tools.parse(config.data))
// return user
// ? tools.responseSuccess(assign({}, user, { token: faker.random.uuid() }))
// : tools.responseError({}, '账号或密码不正确')
// })
// 接口请求
return requestForMock({
url: '/login',
method: 'post',
data
})
}
})
import axios from 'axios'
import Adapter from 'axios-mock-adapter'
import { get } from 'lodash'
import util from '@/libs/util'
import store from '../../store/index'
// import { errorLog, errorCreate } from './tools'
/**
* @description 创建请求实例
*/
function createService () {
// 创建一个 axios 实例
const service = axios.create()
// 请求拦截
service.interceptors.request.use(
// config => config,
config => {
const token = sessionStorage.getItem('token')
if (token) {
config.headers['Authorization'] = token
}
return config
},
error => {
// 发送失败
console.log(error)
return Promise.reject(error)
}
)
// 响应拦截
service.interceptors.response.use(
response => {
// dataAxios 是 axios 返回数据中的 data
const dataAxios = response.data
// 这个状态码是和后端约定的
const { code } = dataAxios
// 根据 code 进行判断
if (code === undefined) {
// 如果没有 code 代表这不是项目后端开发的接口 比如可能是 D2Admin 请求最新版本
return dataAxios
} else {
// 有 code 代表这是一个后端接口 可以进行进一步的判断
switch (code) {
case 0:
// [ 示例 ] code === 0 代表没有错误
return dataAxios.data
case 'xxx':
// [ 示例 ] 其它和后台约定的 code
// errorCreate(`[ code: xxx ] ${dataAxios.msg}: ${response.config.url}`)
break
default:
// 不是正确的 code
// errorCreate(`${dataAxios.msg}: ${response.config.url}`)
break
}
}
},
error => {
const status = get(error, 'response.status')
switch (status) {
case 400: error.message = '请求错误'; break
case 401: error.message = '未授权,请登录'; break
case 403: error.message = '拒绝访问'; break
case 404: error.message = `请求地址出错: ${error.response.config.url}`; 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: break
}
// errorLog(error)
return Promise.reject(error)
}
)
return service
}
/**
* @description 创建请求方法
* @param {Object} service axios 实例
*/
function createRequestFunction (service) {
return function (config) {
const token = util.cookies.get('token')
const configDefault = {
headers: {
Authorization: token,
'Content-Type': get(config, 'headers.Content-Type', 'application/json')
},
timeout: 5000,
baseURL: 'http://111.203.232.175:8085',
data: {}
}
return service(Object.assign(configDefault, config))
}
}
// 用于真实网络请求的实例和请求方法
export const service = createService()
export const request = createRequestFunction(service)
// 用于模拟网络请求的实例和请求方法
export const serviceForMock = createService()
export const requestForMock = createRequestFunction(serviceForMock)
// 网络请求数据模拟工具
export const mock = new Adapter(serviceForMock)
import { service, request, serviceForMock, requestForMock, mock } from './service'
/**
* 获取知识图谱
*/
export function GetBasicList () {
return request({
url: `/tp/basic/getList`,
method: 'post'
})
}
export function GetMapChina (type) {
return request({
url: `tp/basic/getMap?type=${type}`,
method: 'post'
})
}
import { service, request, serviceForMock, requestForMock, mock } from './service'
/**
* 获取知识图谱
*/
export function GetKnowledgeGraph (name, type) {
return request({
url: `/tp/map/getByName?name=${name}&type=${type}`,
method: 'get'
})
}
// 根据客户id查询
export function GetKnowledId (id, type) {
return request({
url: `/tp/map/select?id=${id}&type=${type} `,
method: 'get'
})
}
// import request from '@/plugin/axios'
import { service, request, serviceForMock, requestForMock, mock } from './service'
// 登录
export function AccountLogin (data) {
return request({
url: '/public/api/login',
method: 'post',
data
})
}
// 注册
export function register (data) {
return request({
url: '/public/api/register',
method: 'post',
data
})
}
// 重置密码
export function resetPass (data) {
return request({
url: '/public/api/resetPass',
method: 'post',
data
})
}
// 获取短信验证码
export function sendCode (data) {
return request({
url: '/public/api/sendCode',
method: 'post',
data
})
}
// 修改用户信息
export function updateUser (data) {
return request({
url: '/public/api/updateUser',
method: 'post',
data
})
}
import { Message } from 'element-ui'
import store from '../../store'
import util from '@/libs/util'
/**
* @description 安全地解析 json 字符串
* @param {String} jsonString 需要解析的 json 字符串
* @param {String} defaultValue 默认值
*/
export function parse (jsonString = '{}', defaultValue = {}) {
let result = defaultValue
try {
result = JSON.parse(jsonString)
} catch (error) {
console.log(error)
}
return result
}
/**
* @description 接口请求返回
* @param {Any} data 返回值
* @param {String} msg 状态信息
* @param {Number} code 状态码
*/
export function response (data = {}, msg = '', code = 0) {
return [
200,
{ code, msg, data }
]
}
/**
* @description 接口请求返回 正确返回
* @param {Any} data 返回值
* @param {String} msg 状态信息
*/
export function responseSuccess (data = {}, msg = '成功') {
return response(data, msg)
}
/**
* @description 接口请求返回 错误返回
* @param {Any} data 返回值
* @param {String} msg 状态信息
* @param {Number} code 状态码
*/
export function responseError (data = {}, msg = '请求失败', code = 500) {
return response(data, msg, code)
}
/**
* @description 记录和显示错误
* @param {Error} error 错误对象
*/
export function errorLog (error) {
// 添加到日志
store.dispatch('d2admin/log/push', {
message: '数据请求异常',
type: 'danger',
meta: {
error
}
})
// 打印到控制台
if (process.env.NODE_ENV === 'development') {
util.log.danger('>>>>>> Error >>>>>>')
console.log(error)
}
// 显示提示
Message({
message: error.message,
type: 'error',
duration: 5 * 1000
})
}
/**
* @description 创建一个错误
* @param {String} msg 错误信息
*/
export function errorCreate (msg) {
const error = new Error(msg)
errorLog(error)
throw error
}
// import request from '@/utils/request'
import { service, request, serviceForMock, requestForMock, mock } from './service'
export function login(params) {
return request({
url: '/tp/login',
method: 'post',
params
})
}
export function getInfo(token) {
return request({
url: '/vue-admin-template/user/info',
method: 'get',
params: { token }
})
}
export function logout() {
return request({
url: '/vue-admin-template/user/logout',
method: 'post'
})
}
/* Logo 字体 */
@font-face {
font-family: "iconfont logo";
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
}
.logo {
font-family: "iconfont logo";
font-size: 160px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* tabs */
.nav-tabs {
position: relative;
}
.nav-tabs .nav-more {
position: absolute;
right: 0;
bottom: 0;
height: 42px;
line-height: 42px;
color: #666;
}
#tabs {
border-bottom: 1px solid #eee;
}
#tabs li {
cursor: pointer;
width: 100px;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 16px;
border-bottom: 2px solid transparent;
position: relative;
z-index: 1;
margin-bottom: -1px;
color: #666;
}
#tabs .active {
border-bottom-color: #f00;
color: #222;
}
.tab-container .content {
display: none;
}
/* 页面布局 */
.main {
padding: 30px 100px;
width: 960px;
margin: 0 auto;
}
.main .logo {
color: #333;
text-align: left;
margin-bottom: 30px;
line-height: 1;
height: 110px;
margin-top: -50px;
overflow: hidden;
*zoom: 1;
}
.main .logo a {
font-size: 160px;
color: #333;
}
.helps {
margin-top: 40px;
}
.helps pre {
padding: 20px;
margin: 10px 0;
border: solid 1px #e7e1cd;
background-color: #fffdef;
overflow: auto;
}
.icon_lists {
width: 100% !important;
overflow: hidden;
*zoom: 1;
}
.icon_lists li {
width: 100px;
margin-bottom: 10px;
margin-right: 20px;
text-align: center;
list-style: none !important;
cursor: default;
}
.icon_lists li .code-name {
line-height: 1.2;
}
.icon_lists .icon {
display: block;
height: 100px;
line-height: 100px;
font-size: 42px;
margin: 10px auto;
color: #333;
-webkit-transition: font-size 0.25s linear, width 0.25s linear;
-moz-transition: font-size 0.25s linear, width 0.25s linear;
transition: font-size 0.25s linear, width 0.25s linear;
}
.icon_lists .icon:hover {
font-size: 100px;
}
.icon_lists .svg-icon {
/* 通过设置 font-size 来改变图标大小 */
width: 1em;
/* 图标和文字相邻时,垂直对齐 */
vertical-align: -0.15em;
/* 通过设置 color 来改变 SVG 的颜色/fill */
fill: currentColor;
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
normalize.css 中也包含这行 */
overflow: hidden;
}
.icon_lists li .name,
.icon_lists li .code-name {
color: #666;
}
/* markdown 样式 */
.markdown {
color: #666;
font-size: 14px;
line-height: 1.8;
}
.highlight {
line-height: 1.5;
}
.markdown img {
vertical-align: middle;
max-width: 100%;
}
.markdown h1 {
color: #404040;
font-weight: 500;
line-height: 40px;
margin-bottom: 24px;
}
.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6 {
color: #404040;
margin: 1.6em 0 0.6em 0;
font-weight: 500;
clear: both;
}
.markdown h1 {
font-size: 28px;
}
.markdown h2 {
font-size: 22px;
}
.markdown h3 {
font-size: 16px;
}
.markdown h4 {
font-size: 14px;
}
.markdown h5 {
font-size: 12px;
}
.markdown h6 {
font-size: 12px;
}
.markdown hr {
height: 1px;
border: 0;
background: #e9e9e9;
margin: 16px 0;
clear: both;
}
.markdown p {
margin: 1em 0;
}
.markdown>p,
.markdown>blockquote,
.markdown>.highlight,
.markdown>ol,
.markdown>ul {
width: 80%;
}
.markdown ul>li {
list-style: circle;
}
.markdown>ul li,
.markdown blockquote ul>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown>ul li p,
.markdown>ol li p {
margin: 0.6em 0;
}
.markdown ol>li {
list-style: decimal;
}
.markdown>ol li,
.markdown blockquote ol>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown code {
margin: 0 3px;
padding: 0 5px;
background: #eee;
border-radius: 3px;
}
.markdown strong,
.markdown b {
font-weight: 600;
}
.markdown>table {
border-collapse: collapse;
border-spacing: 0px;
empty-cells: show;
border: 1px solid #e9e9e9;
width: 95%;
margin-bottom: 24px;
}
.markdown>table th {
white-space: nowrap;
color: #333;
font-weight: 600;
}
.markdown>table th,
.markdown>table td {
border: 1px solid #e9e9e9;
padding: 8px 16px;
text-align: left;
}
.markdown>table th {
background: #F7F7F7;
}
.markdown blockquote {
font-size: 90%;
color: #999;
border-left: 4px solid #e9e9e9;
padding-left: 0.8em;
margin: 1em 0;
}
.markdown blockquote p {
margin: 0;
}
.markdown .anchor {
opacity: 0;
transition: opacity 0.3s ease;
margin-left: 8px;
}
.markdown .waiting {
color: #ccc;
}
.markdown h1:hover .anchor,
.markdown h2:hover .anchor,
.markdown h3:hover .anchor,
.markdown h4:hover .anchor,
.markdown h5:hover .anchor,
.markdown h6:hover .anchor {
opacity: 1;
display: inline-block;
}
.markdown>br,
.markdown>p>br {
clear: both;
}
.hljs {
display: block;
background: white;
padding: 0.5em;
color: #333333;
overflow-x: auto;
}
.hljs-comment,
.hljs-meta {
color: #969896;
}
.hljs-string,
.hljs-variable,
.hljs-template-variable,
.hljs-strong,
.hljs-emphasis,
.hljs-quote {
color: #df5000;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
color: #a71d5d;
}
.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute {
color: #0086b3;
}
.hljs-section,
.hljs-name {
color: #63a35c;
}
.hljs-tag {
color: #333333;
}
.hljs-title,
.hljs-attr,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
color: #795da3;
}
.hljs-addition {
color: #55a532;
background-color: #eaffea;
}
.hljs-deletion {
color: #bd2c00;
background-color: #ffecec;
}
.hljs-link {
text-decoration: underline;
}
/* 代码高亮 */
/* PrismJS 1.15.0
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
/**
* prism.js default theme for JavaScript, CSS and HTML
* Based on dabblet (http://dabblet.com)
* @author Lea Verou
*/
code[class*="language-"],
pre[class*="language-"] {
color: black;
background: none;
text-shadow: 0 1px white;
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
pre[class*="language-"]::-moz-selection,
pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection,
code[class*="language-"] ::-moz-selection {
text-shadow: none;
background: #b3d4fc;
}
pre[class*="language-"]::selection,
pre[class*="language-"] ::selection,
code[class*="language-"]::selection,
code[class*="language-"] ::selection {
text-shadow: none;
background: #b3d4fc;
}
@media print {
code[class*="language-"],
pre[class*="language-"] {
text-shadow: none;
}
}
/* Code blocks */
pre[class*="language-"] {
padding: 1em;
margin: .5em 0;
overflow: auto;
}
:not(pre)>code[class*="language-"],
pre[class*="language-"] {
background: #f5f2f0;
}
/* Inline code */
:not(pre)>code[class*="language-"] {
padding: .1em;
border-radius: .3em;
white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: slategray;
}
.token.punctuation {
color: #999;
}
.namespace {
opacity: .7;
}
.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
color: #905;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #690;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
color: #9a6e3a;
background: hsla(0, 0%, 100%, .5);
}
.token.atrule,
.token.attr-value,
.token.keyword {
color: #07a;
}
.token.function,
.token.class-name {
color: #DD4A68;
}
.token.regex,
.token.important,
.token.variable {
color: #e90;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
import { DataSet, Network } from 'vis/index-network'
let ori_data = null
let cur_data = {}
let network = null
let container = null
let nodeBorderWidth = 5
let vm = null
let options = {
physics: {
enabled: false
},
interaction: { hover: false }, // 是否hover
nodes: {
shape: 'circle',
size: 25,
font: {
size: 10
},
borderWidth: nodeBorderWidth
},
edges: {
width: 1,
smooth: false,
font: {
size: 10
}
}
}
let int = 0
let nodecontext = null
let edgecontext = null
let colors = {
// n: '#dddddd', // 闪烁背景色
// d: '#cf2b0b', // 深红
l: '#E4F9FF', // 线默认色
y: '#D6FFBA', // 黄色
w: '#FFFFFF', // 白色
gOut: '#4AD2B4', // 淡绿色 (外阴影)
gb: '##002E4F', // 淡绿色外border
g: '#A0FFD8', // 淡绿色
bOut: '#90E0FF', // 蓝色(外阴影)
bb: '#000E42', // 蓝色Border
b: '#30DDF4' // 蓝色
}
let MapNodeIdIndex = {}
let MapEdgeIdIndex = {}
let registerNetworkEvent = () => {
// 屏蔽右键菜单
document.getElementsByTagName('canvas')[0].oncontextmenu = function (ev) {
ev.preventDefault()
}
window.Event.prototype.preventDefault = window.Event.prototype.preventDefault || function () {
// 阻止冒泡
this.cancelBubble = true
// 阻止触发默认事件
this.returnValue = false
}
// network.on("dragStart", params => {
// hidecontext();
// });
network.on('dragEnd', params => {
// hidecontext();
let scale = network.getScale()
if (scale < 0.3) {
scale = 0.3
}
network.moveTo({ scale: scale })
localStorage.setItem('scale', JSON.stringify(scale))
localStorage.setItem(
'viewposition',
JSON.stringify(network.getViewPosition())
)
// network.moveTo();
// setTimeout(function () {
// network.moveNode(params.nodes[0], params.pointer.canvas.x, params.pointer.canvas.y)
// },2000)
if (params.nodes[0]) {
cur_data.nodes._data[params.nodes[0]].x = params.pointer.canvas.x
cur_data.nodes._data[params.nodes[0]].y = params.pointer.canvas.y
cur_data.nodes._data[params.nodes[0]].axisX = params.pointer.canvas.x
cur_data.nodes._data[params.nodes[0]].axisY = params.pointer.canvas.y
// console.log(params.nodes[0], params.pointer.canvas.x, params.pointer.canvas.y)
let arr = []
for (let k in cur_data.nodes._data) {
// 实际需要传位置和id
// obj={axisX:cur_data.nodes._data[k].axisX,axisY : cur_data.nodes._data[k].axisY,ip : cur_data.nodes._data[k].ip}
arr.push(cur_data.nodes._data[k])
}
// 显示修改后的所有内容
// console.log(arr)
// getNodesByJson(arr)
} else {
}
})
//双击事件
network.on("doubleClick", params => {
// saveviewpos();
// hidecontext();
let id = params.nodes[0];
if (id == undefined) {
return;
}
localStorage.setItem("cfg", "");
let bexc = 0;
let bend = 0;
ori_data.nodes.forEach((v,i)=>{
if(v.level == 1){
redraw(id, 1)
}else{
redraw(id, 2)
}
})
// let v = ori_data.nodes[MapNodeIdIndex[id]];
// bexc = v.bexc; //是否有异常子节点 0 没有光圈 1 正常光圈 2 有异常光圈
// bend = v.bend;
// if(bend == '1'){ //叶子节点
// return
// }
// if (bexc != "0") {
// id && redraw(id, 1);
// } else {
// id && redraw(id, 2);
// }
});
}
let redraw = (id, qryType, that) => {
vm = that || vm
let cfg = {
qryType // 1,展开 2,收缩 3,刷新 4,按点查询
}
// cfg.vpnName = sessionStorage.getItem('topuVpnName');
if (qryType === 3 || qryType == 4) {
cfg.nodeId = id
}
let list = []
let listStr = ''
// let list = "";
if (qryType === 3) {
ori_data = JSON.parse(sessionStorage.getItem('graph'))
container = document.querySelector(`#topology`)
}
ori_data &&
ori_data.nodes.forEach(v => {
if (qryType == 1 || qryType == 2) {
if (v.ip == id) {
cfg.nodeId = v.ip
}
}
// list.push({nodeid:v.ip})
list.push(v.ip)
// list += v.ip+","
listStr = list.join(',')
})
if (!list) {
return
}
// cfg.nodeList = JSON.stringify(list);
cfg.nodelist = listStr
cfg.extendLevel = 1
localStorage.setItem('cfg', JSON.stringify(cfg))
// console.log(localStorage.getItem("cfg"))
// localStorage.setItem("cfg", cfg);
cfg.extendLevel = 1
// workHttps.getListtopoall(cfg).then((res)=>{
// if(res.code===0){
// let data = res.data;
// update(data)
// }else {
// // _toast(res.msg)
// }
// }).catch((err=>{
// }))
}
let moveTo = () => {
let scale = JSON.parse(localStorage.getItem('scale'))
let viewposition = JSON.parse(localStorage.getItem('viewposition'))
if (scale && viewposition) {
network.moveTo({
position: viewposition,
scale: scale
})
}
}
//字符串换行
function insertEnter(str,n){
if(str){
var len = str.length;
var strTemp = '';
if(len > n){
strTemp = str.substring(0,n);
str = str.substring(n,len);
return strTemp+'\n'+insertEnter(str,n);
}else{
return str;
}
}
}
let handleData = (data) => {
let newData = { nodes: [], edges: [] }
if (data.retNodes.length != 0) {
// _store.commit('updateRetNode', data.retNodes)
data.retNodes.forEach((v, i) => {
v.label = insertEnter(v.customerName,5) || insertEnter(v.projectName,5) || insertEnter(v.nicheName,5) || insertEnter(v.memberName,5)
newData.nodes.push(v)
})
}
if (data.retLinks.length != 0) {
newData.edges = data.retLinks
}
return newData
}
export default {
init: (ccClassName, data, that) => {
data = handleData(data)
vm = that
sessionStorage.setItem('graph', JSON.stringify(data))
container = document.querySelector(`#${ccClassName}`) // topu 容器
ori_data = data // 原始数据
cur_data = JSON.parse(JSON.stringify(ori_data)) // 拷贝数据(使用)
// bexc 是否有异常子节点 0 没有光圈 1 正常光圈 2 有异常光圈 (光圈代表有子节点)
// status 节点状态 0 异常 1 正常 2 初始状态
// vpnStatus vpn部署状态 0 未纳管 1已纳管 2 已部署
cur_data.nodes.forEach((v, i) => {
MapNodeIdIndex[v.id] = i
v.color = {}
switch (v.level) {
case '1':
v.color = { background: colors.b, border: colors.bb } // 点的hover高亮
v.shadow = { enabled: true, color: colors.bOut, size: 20, x: '0', y: '0' } // 阴影,是否显示,颜色,大小,偏移量
v.margin = 10 // 默认值是5
break
case '2':
v.color = { background: colors.g, border: colors.gb }
v.shadow = { enabled: true, color: colors.gOut, size: 20, x: '0', y: '0' }
v.margin = 10
break
case '3':
v.color = { background: colors.y, border: colors.gb }
v.shadow = { enabled: true, color: colors.w, size: 20, x: '0', y: '0' }
v.margin = 10
break
case '4':
v.color = { background: colors.d, border: colors.b }
break
case '5':
v.color = { background: colors.y, border: colors.q }
break
case '6':
v.color = { background: colors.q, border: colors.d }
break
default:
v.color = { background: colors.g, border: colors.q }
}
})
// 遍历 线
// state 0 正常 1异常
cur_data.edges.forEach((v, i) => {
// console.log(v.lkId)
// console.log(v)
MapEdgeIdIndex[v.id] = i
v.color = { color: colors.l }
v.width = 6
})
},
getnetwork: () => {
return network
},
destroy: () => {
network && (network.destroy(), (network = null))
container && (container.innerHTML = '')
int = clearInterval(int)
ori_data = null
cur_data = {}
int = 0
nodecontext = null
edgecontext = null
MapNodeIdIndex = {}
MapEdgeIdIndex = {}
localStorage.removeItem('cfg')
localStorage.removeItem('scale')
localStorage.removeItem('viewposition')
},
cgraph: (fn, S, __fn) => {
// 改变数据类型
cur_data['edges'] = new DataSet(cur_data['edges'])
cur_data['nodes'] = new DataSet(cur_data['nodes'])
// 初始绘制图表
if (!container) return
network = new Network(container, cur_data, options)
registerNetworkEvent()
if (!S) {
// 计算位置
let initpos = network.getPositions()
let initid = Object.keys(initpos)[0]
sessionStorage.setItem('initpos', JSON.stringify(initpos[initid]))
sessionStorage.setItem('initid', initid)
}
},
redraw: redraw
}
const knowledgeJSON = [
{ 'retNodes': [
{ 'ip': '1',
'axisX': '886.4717477003943',
'axisY': '551.522667542707',
'level': '1',
'status': '1',
'nodeName': '一级节点' },
{ 'ip': '2-1',
'axisX': '1032.0933249370275',
'axisY': '544.7911335012593',
'level': '2',
'status': '1',
'nodeName': '二级节点' },
{ 'ip': '3-1',
'axisX': '1150.6307490144548',
'axisY': '63.60545335085421',
'level': '3',
'status': '1',
'nodeName': '三级节点1' },
{ 'ip': '3-2',
'axisX': '1445.867279894875',
'axisY': '265.6093955321945',
'level': '3',
'status': '1',
'nodeName': '三级节点2' }
],
'retLinks': [
{
'lkId': '54',
'state': '1',
'useRate': '0.00',
'bandwidth': '1000',
'flow': '0',
'dnode': '1',
'snode': '2-1'
},
{
'lkId': '56',
'state': '1',
'useRate': '164.48',
'bandwidth': '155',
'flow': '254',
'dnode': '3-1',
'snode': '2-1'
},
{
'lkId': '61',
'state': '1',
'useRate': '115.55',
'bandwidth': '155',
'flow': '179',
'dnode': '3-2',
'snode': '2-1'
}
] }
]
export default knowledgeJSON
This source diff could not be displayed because it is too large. You can view the blob instead.
// 过渡动画 横向渐变
.fade-transverse-leave-active,
.fade-transverse-enter-active {
transition: all .5s;
}
.fade-transverse-enter {
opacity: 0;
transform: translateX(-30px);
}
.fade-transverse-leave-to {
opacity: 0;
transform: translateX(30px);
}
// 过渡动画 缩放渐变
.fade-scale-leave-active,
.fade-scale-enter-active {
transition: all .3s;
}
.fade-scale-enter {
opacity: 0;
transform: scale(1.2);
}
.fade-scale-leave-to {
opacity: 0;
transform: scale(0.8);
}
.business{
width: 100%;
height: 100%;
background: #000E42;
.topBox{
height: calc(43% - 2vw);
background: url("~@/assets/img/566378.png");
background-color:rgba(0,14,66,0.5);
background-size: 100% 100%;
.businessStatistics{
width: 90%;
height: 58%;
margin: calc(21% - 70px) auto 0;
position: relative;
.circle{
width: 30%;
padding-bottom: 30%;
height: 0;
background: #30DDF4;
border: 1px solid #30DDF4;
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
margin-top: -15%;
margin-left: -15%;
z-index: 2;
.circleTitle{
font-size:16px;
font-family:PingFang-SC-Bold,PingFang-SC;
font-weight:bold;
color:#000E42;
margin-top: 20%;
text-align: center;
}
.circleValue{
font-size:32px;
font-family:ZhenyanGB-Regular,ZhenyanGB;
font-weight:400;
color:#000E42;
text-align: center;
}
}
.circle1{
width: 34%;
padding-bottom: 34%;
height: 0;
background: #000E42;
border-radius: 50%;
position: absolute;
border:1px solid #77E2FF;
top: 50%;
left: 50%;
margin-top: -17%;
margin-left: -17%;
z-index: 1;
}
.box1,.box2,.box3,.box4{
display: inline-block;
width: calc(50% - 50px);
padding: 0 20px;
text-align: center;
height: calc(50% - 8px);
line-height: 50px;
background:rgba(144,224,255,0.15);
color: #fff;
position: absolute;
border:1px solid #77E2FF;
.boxTitle{
font-size:16px;
font-family:PingFang-SC-Medium,PingFang-SC;
font-weight:500;
color:#fff;
height: 40px;
span{
font-size:12px;
}
}
.boxValue{
font-size:32px;
font-family:ZhenyanGB-Regular,ZhenyanGB;
font-weight:400;
color:#30DDF4;
}
}
.box2{
position: absolute;
top:0;
left: calc(50% + 10px);
}
.box3{
position: absolute;
top:calc(50% + 8px);
left: 0;
}
.box4{
position: absolute;
top:calc(50% + 8px);
left: calc(50% + 10px);
}
.horizontal{
width: 100%;
height: 14px;
background: #000E42;
position: absolute;
top:calc(50% - 6px);
left: 0;
z-index: 1;
}
.vertical{
width: 18px;
height: 100%;
background: #000E42;
position: absolute;
top:0;
left: calc(50% - 8px);
z-index: 1;
}
}
}
.bottomBox{
height: 26.5%;
background: url("~@/assets/img/566266.png");
background-color:rgba(0,14,66,0.5);
background-size: 100% 100%;
margin-top: 20px;
}
.bottomBoxLong{
height: calc(53% + 20px);
background: url("~@/assets/img/566378.png");
background-color:rgba(0,14,66,0.5);
background-size: 100% 100%;
margin-top: 20px;
}
.centerBlock{
.topBoxEmpty{
height: calc(47% - 40px);
.halfLeft,.halfRight{
width: calc(50% - 10px);
height: 100%;
background: url("~@/assets/img/326378.png");
background-color:rgba(0,14,66,0.5);
background-size: 100% 100%;
float: left;
}
.halfRight{margin-left: 20px}
}
}
}
.client{
width: 100%;
height: 100%;
background: #000E42;
.businessStatistics{
width: 90%;
height: 58%;
margin: calc(21% - 70px) auto 0;
position: relative;
.circle{
width: 30%;
padding-bottom: 30%;
height: 0;
background: #30DDF4;
border: 1px solid #30DDF4;
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
margin-top: -15%;
margin-left: -15%;
z-index: 2;
.circleTitle{
font-size:16px;
font-family:PingFang-SC-Bold,PingFang-SC;
font-weight:bold;
color:#000E42;
margin-top: 20%;
text-align: center;
}
.circleValue{
font-size:32px;
font-family:ZhenyanGB-Regular,ZhenyanGB;
font-weight:400;
color:#000E42;
text-align: center;
}
}
.circle1{
width: 34%;
padding-bottom: 34%;
height: 0;
background: #000E42;
border-radius: 50%;
position: absolute;
border:1px solid #77E2FF;
top: 50%;
left: 50%;
margin-top: -17%;
margin-left: -17%;
z-index: 1;
}
.box1,.box2,.box3,.box4{
display: inline-block;
width: calc(50% - 50px);
padding: 0 20px;
text-align: center;
height: calc(50% - 8px);
line-height: 50px;
background:rgba(144,224,255,0.15);
color: #fff;
position: absolute;
border:1px solid #77E2FF;
.boxTitle{
font-size:16px;
font-family:PingFang-SC-Medium,PingFang-SC;
font-weight:500;
color:#fff;
height: 40px;
span{
font-size:12px;
}
}
.boxValue{
font-size:32px;
font-family:ZhenyanGB-Regular,ZhenyanGB;
font-weight:400;
color:#30DDF4;
}
}
.box2{
position: absolute;
top:0;
left: calc(50% + 10px);
}
.box3{
position: absolute;
top:calc(50% + 8px);
left: 0;
}
.box4{
position: absolute;
top:calc(50% + 8px);
left: calc(50% + 10px);
}
.horizontal{
width: 100%;
height: 14px;
background: #000E42;
position: absolute;
top:calc(50% - 6px);
left: 0;
z-index: 1;
}
.vertical{
width: 18px;
height: 100%;
background: #000E42;
position: absolute;
top:0;
left: calc(50% - 8px);
z-index: 1;
}
}
.centerBlock{
.content{
height: calc(73.5% - 20px);
.search{
width: 50%;
height: 30px;
margin: 10px auto;
border-radius: 2px;
.el-input{
width: 70%;
float: left;
.el-input__inner{
background:rgba(144,224,255,0.15);
border-radius:2px;
color: #FFFFFF;
font-size:12px;
font-family:PingFang-SC-Bold,PingFang-SC;
font-weight:bold;
border: 0 !important;
}
}
.searchBtn{
width: 30%;
height: 28px;
line-height: 28px;
background:linear-gradient(180deg,rgba(48,221,244,1) 0%,rgba(48,221,244,1) 100%);
box-shadow:0px 4px 10px 0px rgba(0,0,0,0.5);
text-align: center;
float: left;
}
}
.searchMsg{
width: 80%;
height: 40%;
padding: 5%;
margin: 0 auto 20px;
background:rgba(0,14,66,0.5);
box-shadow:0px 0px 8px 4px rgba(10,18,35,0.5);
border-radius:2px;
border:1px solid rgba(48,221,244,1);
>div{
width: 100%;
height: 30px;
line-height: 30px;
font-size:12px;
font-family:PingFang-SC-Medium,PingFang-SC;
.babel{
font-weight:500;
color:rgba(48,221,244,1);
}
.babelMsg{
font-weight:bold;
color:rgba(255,255,255,1);
float: right;
}
}
}
.architecture{
width: 90%;
height: calc(50% - 60px);
margin: 0 auto 20px;
background:rgba(0,14,66,0.5);
box-shadow:0px 0px 8px 4px rgba(10,18,35,0.5);
border-radius:2px;
position: relative;
.subtitle{
position: absolute;
top:0;
left: 0;
i{
display: inline-block;
width: 10px;
height: 10px;
border-radius: 50%;
background: #30DDF4;
margin-right: 10px;
}
font-size:16px;
font-family:PingFang-SC-Bold,PingFang-SC;
font-weight:bold;
color:rgba(255,255,255,1);
}
.architectureBlock{
width: 170px;
height: 150px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -85px;
margin-top: -75px;
background: url("~@/assets/img/ring.png");
background-size: 100% 100%;
.name{
width: 170px;
height: 150px;
font-size:20px;
font-family:PingFang-SC-Bold,PingFang-SC;
font-weight:bold;
color:rgba(0,14,66,1);
line-height:174px;
text-align: center;
}
.top{
width: 80px;
text-align: center;
padding: 6px 10px;
background:rgba(48,221,244,1);
border-radius:2px;
border:1px solid rgba(119,226,255,1);
position: absolute;
top:-30%;
left: 50%;
margin-left: -50px;
}
.left,.right{
width:100%;
position: absolute;
top:-20%;
left: -105%;
padding: 0;
li{
text-align: center;
padding: 6px 10px;
background:rgba(48,221,244,1);
border-radius:2px;
border:1px solid rgba(119,226,255,1);
margin-bottom: 24%;
}
}
.right{
position: absolute;
top:-20%;
left: 105%;
}
}
}
}
.bottomBox{
width: 100%;
height: 26.5%;
background: url("~@/assets/img/674266.png");
background-color: rgba(0, 14, 66, 0.5);
background-size: 100% 100%;
margin-top: 20px;
position: absolute;
left: 0;
bottom: 0;
}
}
.rightBlock{
.iconBlock{
width: 90%;
height:60%;
background:rgba(13,30,91,1);
box-shadow:0px 4px 8px 0px rgba(10,18,35,0.5);
border:1px solid rgba(48,221,244,0.5);
margin: 4% auto 0;
}
i{
display: inline-block;
position: relative;
top: 50%;
margin-top: -10%;
margin-left: 5%;
float: left;
}
.icon20{width: 20%;padding-bottom: 20%;height: 0;}
.icon5{width: 10%;padding-bottom: 20%;height: 0;}
}
.icon-datangjituan{
background: url("~@/assets/icon/大唐集团.png") no-repeat;
background-size: 100%;
background-position:0 50%;
}
.icon-zhongguoshiyou{
background: url("~@/assets/icon/中国石油.png") no-repeat;
background-size: 100%;
background-position:0 50%;
}
.icon-changjiangdianli{
background: url("~@/assets/icon/长江电力.png") no-repeat;
background-size: 100%;
background-position:0 50%;
}
.icon-guojiadianwang{
background: url("~@/assets/icon/国家电网.png") no-repeat;
background-size: 100%;
background-position:0 50%;
}
}
$white: #FFFFFF;
$paleBg: #F8F8F8;
$blue: #3A70F0;
$paleBorder: #F0F0F0;
$iColor: #555555;
$font: #000000;
$liBorder:#F0F0F0;
$bgBlue:#3A70F0;
$iBg:#DADADA;
.el-dialog{
margin-top:30vh !important;
}
.dialogStyle{
.el-dialog__body,.el-dialog__header{padding: 0;}
.el-dialog__header{
background: $blue;
height: 50px;
line-height: 50px;
padding: 0 !important;
.el-dialog__title{
color:$white;
margin-left: 22px;
font-size: 14px;
}
.el-dialog__close{
display: none;
}
}
.el-dialog__body{
padding: 0;
margin-top: 15px;
.el-input{
width: 218px;
height: 30px;
}
.el-input__inner{
height: 30px !important;
line-height: 30px !important;
}
.el-form-item{
margin-bottom: 15px;
}
}
.code {
height: 28px;
line-height: 28px;
display: block;
margin: 0px -8px;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
width: 65px;
text-align: center;
}
}
// 操作按钮
.separate{
text-align: center;
.btn{
width: 70px !important;
height: 26px !important;
line-height: 0;
margin-bottom: 24px;
}
.submit{
background: $blue !important;
}
.cancel{
background: #CCCCCC;
color:$iColor;
}
}
///测距
.polyline-measure-tooltip {
font: 10px Arial, Helvetica, sans-serif;
line-height: 10px;
background: rgba(255, 255, 255, 1) !important;
border: 1px solid rgba(125, 125, 125, 1) !important;
opacity: 0.7;
border-radius: 2px;
margin: 0;
padding: 2px;
width: auto !important;
height: auto !important;
white-space: nowrap;
text-align: right;
}
.polyline-measure-tooltip-end {
background: rgba(255, 255, 255, 1) !important;
border: 1px solid rgba(125, 125, 125, 1) !important;
opacity: 0.7;
border-radius: 2px;
}
.polyline-measure-tooltip-total {
/* color: #006; */
color: rgba(52, 52, 57, 1) !important;
font-weight: bold;
}
.polyline-measure-tooltip-difference {
/* color: #060; */
color: rgba(52, 52, 57, 1) !important;
font-style: italic;
}
.polyline-measure-unicode-icon {
display: none !important;
}
.polyline-measure-arrow {
color: #3A70F0 !important;
font-size: 16px;
line-height: 16px;
vertical-align: top;
}
.map-tooltip-text {
padding: 1px 2px;
white-space: nowrap;
display: inline-block;
position: relative;
left: -30px;
font-family: PingFangSC-Regular;
font-weight: 400;
color: rgba(52, 52, 57, 1);
background: rgba(255, 255, 255, 1);
border: 1px solid rgba(125, 125, 125, 1);
opacity: 0.9;
border-radius: 2px;
}
.leaflet-temp-icon {
background: rgba(255, 255, 255, 1);
border: 4px solid rgba(58,112,240, 1);
border-radius: 50%;
}
// 优化显示
html, body {
margin: 0px;
height: 100%;
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
#app {
@extend %full;
a {
text-decoration: none;
}
}
}
\ No newline at end of file
// element 样式补丁
.el-card {
&.is-always-shadow {
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
}
&.is-hover-shadow {
&:hover {
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
}
}
}
.el-menu--horizontal {
border-bottom: none !important;
}
.el-tabs__item:focus.is-active.is-focus:not(:active) {
box-shadow: none !important;
}
\ No newline at end of file
#nprogress {
.bar {
background: $color-primary !important;
}
.peg {
box-shadow: 0 0 10px $color-primary, 0 0 5px $color-primary !important;
}
}
\ No newline at end of file
@font-face {
font-family: 'PingFang-SC-Bold';
src: url('~@/assets/style/font/PingFang-SC-Bold.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'PingFang-SC';
src: url('~@/assets/style/font/PingFang-SC.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'PingFang-SC-Regular';
src: url('~@/assets/style/font/PingFang-SC-Regular.ttf');
font-weight: normal;
font-style: normal;
}
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment