2018-03-09 00:36:34 +09:00
|
|
|
<template>
|
|
|
|
<div>
|
2019-02-03 17:00:45 +09:00
|
|
|
<div class="regText" v-for="(res, i) in result" :key="`res-${i}`">
|
|
|
|
{{ res.text }}
|
|
|
|
<br v-if="res.text" />
|
2019-01-08 12:03:42 +09:00
|
|
|
<span class="regBold">
|
2019-02-03 17:00:45 +09:00
|
|
|
{{ res.username }}@{{ res.hostname }}:<span class="pathText">{{ res.path }}</span>
|
2019-01-08 12:03:42 +09:00
|
|
|
</span>$
|
2019-02-03 17:00:45 +09:00
|
|
|
<input
|
|
|
|
:key="i"
|
|
|
|
:password="res.password"
|
|
|
|
:autofocus="res.active"
|
|
|
|
:disabled="!res.active"
|
|
|
|
spellcheck="false"
|
|
|
|
type="text"
|
|
|
|
class="inputField"
|
|
|
|
v-model="res.command"
|
|
|
|
@keyup.enter="exec(res.command, i)"
|
|
|
|
/>
|
|
|
|
<br />
|
|
|
|
</div>
|
2018-03-09 00:36:34 +09:00
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2019-02-03 17:00:45 +09:00
|
|
|
import Cookies from 'js-cookie';
|
|
|
|
|
2019-01-08 12:03:42 +09:00
|
|
|
export default {
|
|
|
|
data: function () {
|
|
|
|
return {
|
2019-02-03 17:00:45 +09:00
|
|
|
user: Cookies.get('username'),
|
2019-02-22 22:34:20 +09:00
|
|
|
host: '076.ne.jp',
|
2019-01-08 12:03:42 +09:00
|
|
|
pwd: '/',
|
2019-02-03 17:00:45 +09:00
|
|
|
result: []
|
2019-01-08 12:03:42 +09:00
|
|
|
}
|
2018-03-09 00:36:34 +09:00
|
|
|
},
|
2019-01-08 12:03:42 +09:00
|
|
|
created: function () {
|
2019-02-03 17:00:45 +09:00
|
|
|
this.result = [];
|
|
|
|
this.user = Cookies.get('username');
|
2019-02-22 22:34:20 +09:00
|
|
|
this.host = '076.ne.jp';
|
2019-02-03 17:00:45 +09:00
|
|
|
this.pwd = '/';
|
|
|
|
|
|
|
|
this.result.push({
|
2018-03-09 00:36:34 +09:00
|
|
|
username: this.user,
|
|
|
|
hostname: this.host,
|
|
|
|
path: this.pwd,
|
2019-02-03 17:00:45 +09:00
|
|
|
active: true,
|
|
|
|
text: '',
|
|
|
|
field: false,
|
|
|
|
password: false,
|
2018-03-09 00:36:34 +09:00
|
|
|
command: ''
|
|
|
|
});
|
|
|
|
},
|
2019-01-08 12:03:42 +09:00
|
|
|
methods: {
|
|
|
|
exec(text, key) {
|
|
|
|
var arg = text.split(' ');
|
2019-02-03 17:00:45 +09:00
|
|
|
this.result[key].active = false;
|
2019-01-08 12:03:42 +09:00
|
|
|
|
2019-02-03 17:00:45 +09:00
|
|
|
if (arg[0] === 'ls') this.ls(this.result[key].path);
|
2019-01-08 12:03:42 +09:00
|
|
|
else if (arg[0] === 'cd') this.cd(arg[1]);
|
|
|
|
else if (arg[0] === 'clear') this.clear();
|
|
|
|
else this.result.push({
|
2019-02-03 17:00:45 +09:00
|
|
|
username: this.user,
|
|
|
|
hostname: this.host,
|
|
|
|
path: this.pwd,
|
2018-03-09 20:09:45 +09:00
|
|
|
active: true,
|
2019-01-08 12:03:42 +09:00
|
|
|
text: arg[0] + ': コマンドは見つかれません。',
|
2018-03-09 20:09:45 +09:00
|
|
|
field: false,
|
|
|
|
password: false,
|
|
|
|
command: ''
|
|
|
|
});
|
2019-01-08 12:03:42 +09:00
|
|
|
},
|
|
|
|
ls(pwd) {
|
|
|
|
var neopwd = pwd.replace('/', 'sl');
|
2019-08-08 18:00:24 +09:00
|
|
|
axios.get('/api/rpc/bash/exec', { arg: ['ls', '', ''] }).then(res => {
|
2019-01-08 12:03:42 +09:00
|
|
|
this.result.push({
|
2019-02-03 17:00:45 +09:00
|
|
|
username: this.user,
|
|
|
|
hostname: this.host,
|
|
|
|
path: this.pwd,
|
2019-01-08 12:03:42 +09:00
|
|
|
active: true,
|
|
|
|
text: res.data,
|
|
|
|
field: false,
|
|
|
|
password: false,
|
|
|
|
command: ''
|
|
|
|
})
|
|
|
|
})
|
|
|
|
},
|
|
|
|
cd(pwd) {
|
|
|
|
if (pwd === '/fuck' || pwd === 'fuck') {
|
|
|
|
this.result.push({
|
2019-02-03 17:00:45 +09:00
|
|
|
username: this.user,
|
|
|
|
hostname: this.host,
|
|
|
|
path: this.pwd,
|
2019-01-08 12:03:42 +09:00
|
|
|
active: true,
|
|
|
|
text: 'bash: cd: ' + pwd + ': このファイルまたはフォルダがありません。',
|
|
|
|
field: false,
|
|
|
|
password: false,
|
|
|
|
command: ''
|
|
|
|
});
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
if (!pwd.startsWith('/')) pwd = '/' + pwd;
|
|
|
|
|
|
|
|
this.pwd = pwd;
|
|
|
|
},
|
2019-08-08 18:00:24 +09:00
|
|
|
clear() { this.result = []; }
|
2018-03-09 00:36:34 +09:00
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped>
|
2019-01-08 12:03:42 +09:00
|
|
|
.inputField {
|
2019-01-28 18:14:15 +09:00
|
|
|
background-color: #31363b;
|
|
|
|
color: #2ecc71;
|
2019-01-08 12:03:42 +09:00
|
|
|
border-width: 0px;
|
|
|
|
font-family: monospace;
|
|
|
|
font-size: large;
|
|
|
|
width: 500px;
|
|
|
|
outline: none;
|
|
|
|
}
|
2019-08-08 18:00:24 +09:00
|
|
|
.regBold { font-weight: bold; }
|
|
|
|
.regText { color: #2ecc71; }
|
|
|
|
.pathText { color: #3498db; }
|
|
|
|
h1, h2 { font-weight: normal; }
|
|
|
|
ul { list-style-type: none; padding: 0; }
|
|
|
|
li { display: inline-block; margin: 0 10px; }
|
|
|
|
a { color: #1cdc9a; }
|
2018-03-09 00:36:34 +09:00
|
|
|
</style>
|