style: 修改红色图标的颜色
This commit is contained in:
@@ -1,68 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div id="cy"></div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import cytoscape from 'cytoscape';
|
|
||||||
export default {
|
|
||||||
name:"cytoscape",
|
|
||||||
data(){
|
|
||||||
return {
|
|
||||||
cy:'',
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted(){
|
|
||||||
this.init();
|
|
||||||
},
|
|
||||||
methods:{
|
|
||||||
init(){
|
|
||||||
this.cy = cytoscape({
|
|
||||||
container: document.getElementById('cy'), // container to render in
|
|
||||||
elements: [ // list of graph elements to start with
|
|
||||||
{ // node a
|
|
||||||
data: { id: 'a' }
|
|
||||||
},
|
|
||||||
{ // node b
|
|
||||||
data: { id: 'b' }
|
|
||||||
},
|
|
||||||
{ // edge ab
|
|
||||||
data: { id: 'ab', source: 'a', target: 'b' }
|
|
||||||
}
|
|
||||||
],
|
|
||||||
style: [ // the stylesheet for the graph
|
|
||||||
{
|
|
||||||
selector: 'node',
|
|
||||||
style: {
|
|
||||||
'background-color': '#666',
|
|
||||||
'label': 'data(id)'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
selector: 'edge',
|
|
||||||
style: {
|
|
||||||
'width': 3,
|
|
||||||
'line-color': '#ccc',
|
|
||||||
'target-arrow-color': '#ccc',
|
|
||||||
'target-arrow-shape': 'triangle',
|
|
||||||
'curve-style': 'bezier'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
],
|
|
||||||
layout: {
|
|
||||||
name: 'grid',
|
|
||||||
rows: 1
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
#cy {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1038,7 +1038,10 @@
|
|||||||
color: #84d5c2;
|
color: #84d5c2;
|
||||||
}
|
}
|
||||||
.network-pop .nz-icon-hexagonBorder.error-model-stat{
|
.network-pop .nz-icon-hexagonBorder.error-model-stat{
|
||||||
color: #DE5D3F;
|
color: #F5BAAC;
|
||||||
|
}
|
||||||
|
.network-pop .nz-icon-hexagonBorder.error-model-stat:hover{
|
||||||
|
color: #EC7F66;
|
||||||
}
|
}
|
||||||
.network-pop .nz-icon-liubianxing{
|
.network-pop .nz-icon-liubianxing{
|
||||||
color:#e2f3ef;
|
color:#e2f3ef;
|
||||||
@@ -1050,7 +1053,7 @@
|
|||||||
z-index: -1;
|
z-index: -1;
|
||||||
}
|
}
|
||||||
.network-pop .error-model-stat .nz-icon-liubianxing{
|
.network-pop .error-model-stat .nz-icon-liubianxing{
|
||||||
color: rgba(222,93,63,0.45);
|
color: #FADED7 ;
|
||||||
}
|
}
|
||||||
.network-pop .nz-icon.noMove{
|
.network-pop .nz-icon.noMove{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@@ -1060,7 +1063,7 @@
|
|||||||
color: #27c09c;
|
color: #27c09c;
|
||||||
}
|
}
|
||||||
.network-pop .error-model-stat .nz-icon.noMove{
|
.network-pop .error-model-stat .nz-icon.noMove{
|
||||||
color: #DE5D3F;
|
color: #EC7F66;
|
||||||
}
|
}
|
||||||
.network-pop .selpop:hover{
|
.network-pop .selpop:hover{
|
||||||
transform: scale(1.2);
|
transform: scale(1.2);
|
||||||
@@ -1221,12 +1224,12 @@
|
|||||||
width: 38px;
|
width: 38px;
|
||||||
}
|
}
|
||||||
.model-error.nz-icon-shuidi{
|
.model-error.nz-icon-shuidi{
|
||||||
color: rgba(222,93,63,0.45);
|
color: #FADED7 ;
|
||||||
animation: model-error-animation .6s infinite ease-in-out;
|
animation: model-error-animation .6s infinite ease-in-out;
|
||||||
animation-direction:normal;
|
animation-direction:normal;
|
||||||
}
|
}
|
||||||
.model-error-active.nz-icon-shuidi{
|
.model-error-active.nz-icon-shuidi{
|
||||||
color: rgba(222,93,63,0.45);
|
color: #FADED7 ;
|
||||||
}
|
}
|
||||||
.nz-icon-model{
|
.nz-icon-model{
|
||||||
color: #23BF9A;
|
color: #23BF9A;
|
||||||
@@ -1236,12 +1239,12 @@
|
|||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
}
|
}
|
||||||
.model-error .nz-icon-model{
|
.model-error .nz-icon-model{
|
||||||
color: #DE5D3F;
|
color: #EC7F66;
|
||||||
animation: model-icon-animation .6s infinite ease-in-out;
|
animation: model-icon-animation .6s infinite ease-in-out;
|
||||||
animation-direction:normal;
|
animation-direction:normal;
|
||||||
}
|
}
|
||||||
.model-error-active .nz-icon-model{
|
.model-error-active .nz-icon-model{
|
||||||
color: #DE5D3F;
|
color: #EC7F66;
|
||||||
}
|
}
|
||||||
.network-info{
|
.network-info{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
@@ -107,18 +107,6 @@
|
|||||||
@topologyLoad="topologyLoad"
|
@topologyLoad="topologyLoad"
|
||||||
>
|
>
|
||||||
</topology>
|
</topology>
|
||||||
<!--<cytoscape-->
|
|
||||||
<!--:editVisNetwork="editVisNetwork"-->
|
|
||||||
<!--:nodesArray="nodesArray"-->
|
|
||||||
<!--:edgesArray="edgesArray"-->
|
|
||||||
<!--@setTopologyData="setTopologyData"-->
|
|
||||||
<!--:isFullScreen="false"-->
|
|
||||||
<!--ref="topology"-->
|
|
||||||
<!--:allModuleInfo="allModuleInfo"-->
|
|
||||||
<!--v-loading="topologyLoading"-->
|
|
||||||
<!--@editVisNetworkChange="editVisNetworkChange"-->
|
|
||||||
<!--@reload="reload"-->
|
|
||||||
<!--/>-->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -130,7 +118,6 @@
|
|||||||
import loading from "@/components/common/loading";
|
import loading from "@/components/common/loading";
|
||||||
import timePicker from '@/components/common/timePicker';
|
import timePicker from '@/components/common/timePicker';
|
||||||
import topology from './topology'
|
import topology from './topology'
|
||||||
import cytoscape from './cytoscape'
|
|
||||||
import bus from '@/libs/bus';
|
import bus from '@/libs/bus';
|
||||||
// import other from './other'
|
// import other from './other'
|
||||||
export default {
|
export default {
|
||||||
@@ -139,7 +126,6 @@
|
|||||||
'loading': loading,
|
'loading': loading,
|
||||||
'time-picker':timePicker,
|
'time-picker':timePicker,
|
||||||
'topology':topology,
|
'topology':topology,
|
||||||
cytoscape,
|
|
||||||
// other
|
// other
|
||||||
},
|
},
|
||||||
props:{
|
props:{
|
||||||
|
|||||||
Reference in New Issue
Block a user