mirror of
https://github.com/crawlab-team/crawlab.git
synced 2026-01-21 17:21:09 +01:00
updated code highlight
This commit is contained in:
@@ -5,9 +5,6 @@
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta name="renderer" content="webkit">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<script>
|
||||
|
||||
</script>
|
||||
<title>Crawlab</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@@ -3,39 +3,28 @@
|
||||
class="file-content"
|
||||
:options="options"
|
||||
v-model="fileContent"
|
||||
@change="onChange"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { codemirror } from 'vue-codemirror'
|
||||
import { codemirror } from 'vue-codemirror-lite'
|
||||
|
||||
require('codemirror/mode/python/python.js')
|
||||
require('codemirror/mode/javascript/javascript.js')
|
||||
require('codemirror/mode/go/go.js')
|
||||
require('codemirror/mode/shell/shell.js')
|
||||
require('codemirror/addon/fold/foldcode.js')
|
||||
require('codemirror/addon/fold/foldgutter.js')
|
||||
require('codemirror/addon/fold/brace-fold.js')
|
||||
require('codemirror/addon/fold/xml-fold.js')
|
||||
require('codemirror/addon/fold/indent-fold.js')
|
||||
require('codemirror/addon/fold/markdown-fold.js')
|
||||
require('codemirror/addon/fold/comment-fold.js')
|
||||
import 'codemirror/lib/codemirror.js'
|
||||
|
||||
// language
|
||||
import 'codemirror/mode/python/python.js'
|
||||
import 'codemirror/mode/javascript/javascript.js'
|
||||
import 'codemirror/mode/go/go.js'
|
||||
import 'codemirror/mode/shell/shell.js'
|
||||
import 'codemirror/mode/markdown/markdown.js'
|
||||
import 'codemirror/mode/php/php.js'
|
||||
|
||||
export default {
|
||||
name: 'FileDetail',
|
||||
components: { codemirror },
|
||||
data () {
|
||||
return {
|
||||
internalFileContent: '',
|
||||
options: {
|
||||
theme: 'darcula',
|
||||
// mode: 'javascript',
|
||||
mode: { name: 'javascript', json: true },
|
||||
lineNumbers: true,
|
||||
line: true,
|
||||
matchBrackets: true
|
||||
}
|
||||
internalFileContent: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@@ -46,6 +35,34 @@ export default {
|
||||
set (value) {
|
||||
return this.$store.commit('file/SET_FILE_CONTENT', value)
|
||||
}
|
||||
},
|
||||
options () {
|
||||
return {
|
||||
mode: this.lanaguage,
|
||||
theme: 'darcula',
|
||||
styleActiveLine: true,
|
||||
lineNumbers: true,
|
||||
line: true,
|
||||
matchBrackets: true
|
||||
}
|
||||
},
|
||||
lanaguage () {
|
||||
const fileName = this.$store.state.file.currentPath
|
||||
if (fileName.match(/\.js$/)) {
|
||||
return 'text/javascript'
|
||||
} else if (fileName.match(/\.py$/)) {
|
||||
return 'text/x-python'
|
||||
} else if (fileName.match(/\.go$/)) {
|
||||
return 'text/x-go'
|
||||
} else if (fileName.match(/\.sh$/)) {
|
||||
return 'text/x-shell'
|
||||
} else if (fileName.match(/\.php$/)) {
|
||||
return 'text/x-php'
|
||||
} else if (fileName.match(/\.md$/)) {
|
||||
return 'text/x-markdown'
|
||||
} else {
|
||||
return 'text'
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
|
||||
@@ -111,7 +111,7 @@ export default {
|
||||
} else {
|
||||
// 文件
|
||||
this.showFile = true
|
||||
this.$store.commit('file/SET_CURRENT_CONTENT', '')
|
||||
this.$store.commit('file/SET_FILE_CONTENT', '')
|
||||
this.$store.commit('file/SET_CURRENT_PATH', item.path)
|
||||
this.$store.dispatch('file/getFileContent', { path: item.path })
|
||||
}
|
||||
|
||||
@@ -36,15 +36,17 @@ export default {
|
||||
},
|
||||
nodes () {
|
||||
let nodes = this.$store.state.node.nodeList
|
||||
nodes = nodes.map(d => {
|
||||
d.id = d._id
|
||||
d.x = Math.floor(100 * Math.random())
|
||||
d.y = Math.floor(100 * Math.random())
|
||||
d.itemStyle = {
|
||||
color: d.is_master ? '#409EFF' : '#e6a23c'
|
||||
}
|
||||
return d
|
||||
})
|
||||
nodes = nodes
|
||||
.filter(d => d.status !== 'offline')
|
||||
.map(d => {
|
||||
d.id = d._id
|
||||
d.x = Math.floor(100 * Math.random())
|
||||
d.y = Math.floor(100 * Math.random())
|
||||
d.itemStyle = {
|
||||
color: d.is_master ? '#409EFF' : '#e6a23c'
|
||||
}
|
||||
return d
|
||||
})
|
||||
|
||||
// mongodb
|
||||
nodes.push({
|
||||
@@ -73,6 +75,7 @@ export default {
|
||||
links () {
|
||||
const links = []
|
||||
for (let i = 0; i < this.nodes.length; i++) {
|
||||
if (this.nodes[i].status === 'offline') continue
|
||||
if (['redis', 'mongodb'].includes(this.nodes[i].id)) continue
|
||||
// mongodb
|
||||
links.push({
|
||||
@@ -115,7 +118,15 @@ export default {
|
||||
title: {
|
||||
text: this.$t('Node Network')
|
||||
},
|
||||
tooltip: {},
|
||||
tooltip: {
|
||||
formatter: params => {
|
||||
let str = '<span style="margin-right:5px;display:inline-block;height:12px;width:12px;border-radius:6px;background:' + params.color + '"></span>'
|
||||
if (params.data.name) str += '<span>' + params.data.name + '</span><br>'
|
||||
if (params.data.ip) str += '<span>IP: ' + params.data.ip + '</span><br>'
|
||||
if (params.data.mac) str += '<span>MAC: ' + params.data.mac + '</span><br>'
|
||||
return str
|
||||
}
|
||||
},
|
||||
animationDurationUpdate: 1500,
|
||||
animationEasingUpdate: 'quinticInOut',
|
||||
series: [
|
||||
@@ -141,9 +152,9 @@ export default {
|
||||
focusOneNodeAdjacency: true,
|
||||
force: {
|
||||
initLayout: 'force',
|
||||
repulsion: 50,
|
||||
repulsion: 30,
|
||||
gravity: 0.001,
|
||||
edgeLength: 40
|
||||
edgeLength: 30
|
||||
},
|
||||
draggable: true,
|
||||
data: this.nodes,
|
||||
|
||||
@@ -15,7 +15,8 @@ import { fas } from '@fortawesome/free-solid-svg-icons'
|
||||
import { far } from '@fortawesome/free-regular-svg-icons'
|
||||
import { FontAwesomeIcon, FontAwesomeLayers, FontAwesomeLayersText } from '@fortawesome/vue-fontawesome'
|
||||
|
||||
import { codemirror } from 'vue-codemirror'
|
||||
import 'codemirror/lib/codemirror.js'
|
||||
import { codemirror } from 'vue-codemirror-lite'
|
||||
import 'codemirror/lib/codemirror.css'
|
||||
import 'codemirror/theme/darcula.css'
|
||||
|
||||
|
||||
@@ -62,6 +62,9 @@
|
||||
<template v-else-if="ex.file_name.match(/^node/)">
|
||||
<font-awesome-icon :icon="['fab','node-js']"/>
|
||||
</template>
|
||||
<template v-else-if="ex.file_name.match(/^php/)">
|
||||
<font-awesome-icon :icon="['fab','php']"/>
|
||||
</template>
|
||||
<template v-else>
|
||||
<font-awesome-icon :icon="['fas', 'terminal']"/>
|
||||
</template>
|
||||
|
||||
@@ -8479,7 +8479,8 @@ vue-ba@^1.2.5:
|
||||
|
||||
vue-codemirror-lite@^1.0.4:
|
||||
version "1.0.4"
|
||||
resolved "http://registry.npm.taobao.org/vue-codemirror-lite/download/vue-codemirror-lite-1.0.4.tgz#48a5cd7d17c0914503c8cd9d9b56b438e49c3410"
|
||||
resolved "https://registry.npm.taobao.org/vue-codemirror-lite/download/vue-codemirror-lite-1.0.4.tgz#48a5cd7d17c0914503c8cd9d9b56b438e49c3410"
|
||||
integrity sha1-SKXNfRfAkUUDyM2dm1a0OOScNBA=
|
||||
dependencies:
|
||||
codemirror "^5.22.0"
|
||||
|
||||
|
||||
Reference in New Issue
Block a user