benjamyn/dnspy3-webui
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

initial

Browse Source
This commit is contained in:
Benjamyn Love 2020-05-19 09:47:40 -04:00
parent a445533fd9
commit 01960b2822
4 changed files with 303 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/App.vue
View File

@ -1,28 +1,39 @@
<template> <template>
<div id="app"> <div id="app">
<img alt="Vue logo" src="./assets/logo.png"> <link
<HelloWorld msg="Welcome to Your Vue.js App"/> href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@500&display=swap"
rel="stylesheet"
/>
<HelloWorld @updated="logger" />
</div> </div>
</template> </template>
<script> <script>
import HelloWorld from './components/HelloWorld.vue' import HelloWorld from "./components/HelloWorld.vue";
export default { export default {
name: 'App', name: "App",
components: { components: {
HelloWorld HelloWorld,
} },
} methods: {
logger(val) {
console.log(val);
},
},
};
</script> </script>
<style> <style>
#app { #app {
font-family: Avenir, Helvetica, Arial, sans-serif; /* font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale; */
text-align: center; /* text-align: center; */
color: #2c3e50; color: azure;
margin-top: 60px; }
* {
background: #2a2a2a;
} }
</style> </style>

244
src/components/HelloWorld.vue
View File

@ -1,58 +1,230 @@
<template> <template>
<div class="hello"> <div class="main">
<h1>{{ msg }}</h1> <HistoryList />
<p> <div class="top">
For a guide and recipes on how to configure / customize this project,<br> <div class="header">
check out the DNS Lookup Tool
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>. <div class="flexRow">
</p> <button @click="getRecordsFromDomain(newDomain)" class="btn input">
<h3>Installed CLI Plugins</h3> Lookup
</button>
<input
id="domainEnter"
type="text"
v-model="newDomain"
class="input text"
@keyup.enter="getRecordsFromDomain(newDomain)"
/>
<label style="margin: 10px;" for="domainEnter">Domain: </label>
</div>
</div>
</div>
<div class="center">
<h2 class="title" v-if="!data">Please enter a domain</h2>
<div v-if="data">
<h2 class="title">
Domain:
<a :href="domain">{{ data[0]["dns"]["domain"] }}</a>
</h2>
<h3 class="title">Whois</h3>
<ul> <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 v-for="reg in data[0]['whois']['registrar']" :key="reg.id">
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li> Registrar: {{ reg }}
</li>
<li v-for="stat in data[0]['whois']['status']" :key="stat.id">
Status: {{ stat }}
</li>
<div v-if="data[0]['whois']['registrant']['registrantID'] != null">
<li
v-for="reg in data[0]['whois']['registrant']['registrantName']"
:key="reg.id"
>
Registrant Name: {{ reg }}
</li>
<li
v-for="reg in data[0]['whois']['registrant']['registrantID']"
:key="reg.id"
>
Eligibility ID: {{ reg }}
</li>
<li
v-for="reg in data[0]['whois']['registrant']['eligibilityType']"
:key="reg.id"
>
Eligibility Type: {{ reg }}
</li>
</div>
<li v-for="cd in data[0]['whois']['createDate']" :key="cd.id">
Creation Date: {{ cd }}
</li>
<li v-for="ns in data[0]['whois']['nameservers']" :key="ns.id">
Nameserver: {{ ns }}
</li>
</ul> </ul>
<h3>Essential Links</h3> <h3 class="title">DNS Records</h3>
<ul> <ul>
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li> <li v-for="a in data[0]['dns']['a']" :key="a.id">A: {{ a }}</li>
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li> <li v-for="aaaa in data[0]['dns']['aaaa']" :key="aaaa.id">
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li> AAAA: {{ aaaa }}
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li> </li>
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li> <li v-for="mx in data[0]['dns']['mx']" :key="mx.id">
</ul> MX: {{ mx[1] }} PRI: {{ mx[0] }}
<h3>Ecosystem</h3> </li>
<ul> <li v-for="txt in data[0]['dns']['txt']" :key="txt.id">
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li> TXT: {{ txt }}
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li> </li>
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li> <li v-for="ns in data[0]['dns']['ns']" :key="ns.id">NS: {{ ns }}</li>
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li> <li v-for="soa in data[0]['dns']['soa']" :key="soa.id">
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li> SOA: {{ soa }}
</li>
</ul> </ul>
</div> </div>
</div>
</div>
</template> </template>
<script> <script>
import getRecords from "@/services/doRequest";
import HistoryList from "@/components/HistoryList.vue";
export default { export default {
name: 'HelloWorld', name: "HelloWorld",
props: { props: ["value"],
msg: String components: {
HistoryList,
},
data() {
return {
data: [],
domain: [],
newDomain: "",
};
},
methods: {
getRecordsFromDomain(id) {
if (id.includes("http")) {
id = id.split(/https?:\/\//)[1];
} }
} if (id.includes("/")) {
id = id.split("/")[0];
}
id = id.trim();
console.log(id);
if (
/^[a-zA-Z0-9][a-zA-Z0-9-.]{1,100}[a-zA-Z0-9](?:\.[a-zA-Z]{2,})+$/.test(
id
)
) {
getRecords(id)
.then((records) => {
this.data = JSON.parse(records);
this.domain = "http://" + this.data[0]["dns"]["domain"];
})
.catch((error) => {
console.log(error);
});
} else {
console.log(this.newDomain + " is not a domain aparently");
this.newDomain = "";
}
},
},
created: function() {
this.data = this.getRecordsFromDomain("blank");
},
computed: {
inputValue: {
set(text) {
this.$emit("updated", text);
},
get() {
return this.value;
},
},
},
};
</script> </script>
<!-- Add "scoped" attribute to limit CSS to this component only --> <!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped> <style scoped>
h3 { a {
margin: 40px 0 0; background: rgb(66, 66, 66);
}
a:link,
a:visited {
color: azure;
}
* {
background: rgb(66, 66, 66);
color: azure;
}
h3,
h2 {
background: rgb(66, 66, 66);
margin-left: 2%;
} }
ul { ul {
list-style-type: none; background: rgb(66, 66, 66);
padding: 0; margin-left: 5%;
margin-top: 20px;
} }
li { li {
display: inline-block; background: rgb(66, 66, 66);
margin: 0 10px; padding: 5px;
font-family: "Roboto Mono", monospace;
list-style: none;
font-size: medium;
} }
a { .top {
color: #42b983; position: absolute;
border: 1px lightgrey;
border-style: solid;
border-radius: 15px;
left: 20%;
top: 10px;
width: 70%;
background: rgb(66, 66, 66);
}
.center {
position: absolute;
border: 1px lightgrey;
border-radius: 15px;
border-style: solid;
left: 20%;
top: 107px;
width: 70%;
background: rgb(66, 66, 66);
min-height: 100px;
}
.input {
color: azure;
background: rgb(66, 66, 66);
padding-left: 10px;
}
.title {
font-family: "Arial", bold;
}
.header {
margin: 1em;
display: flex;
flex-direction: row;
}
.btn {
min-width: 100px;
min-height: 35px;
font-size: 24px;
display: flex;
align-content: flex-end;
margin-left: 2em;
border-radius: 5px;
}
.text {
width: 400px;
border-radius: 10px;
}
.flexRow {
display: flex;
flex-direction: row-reverse;
width: 100%;
} }
</style> </style>

42
src/components/HistoryList.vue Normal file
View File

@ -0,0 +1,42 @@
<template>
<div class="side">
<ul>
<li>Lookup 1</li>
<li>Lookup 2</li>
<li>Lookup 3</li>
<li>Lookup 4</li>
<li>Lookup 5</li>
<li>Lookup 6</li>
</ul>
</div>
</template>
<script>
export default {};
</script>
<style>
.side {
position: absolute;
left: 2em;
border: 1px lightgrey;
border-radius: 15px;
border-style: solid;
width: 15%;
height: 80vh;
margin-top: 100px;
background: rgb(66, 66, 66);
}
ul {
background: rgb(66, 66, 66);
margin-left: 5%;
margin-top: 20px;
}
li {
background: rgb(66, 66, 66);
padding: 5px;
font-family: "Roboto Mono", monospace;
list-style: none;
font-size: medium;
}
</style>

25
src/services/doRequest.js Normal file
View File

@ -0,0 +1,25 @@
function getRecords(id) {
let URL = "http://10.6.9.42:5000/lookup/";
// id = "mmorison.com";
let domain = URL + id;
let request = new XMLHttpRequest();
return new Promise(function(resolve, reject) {
request.onreadystatechange = function() {
if (request.readyState !== 4) return;
if (request.status >= 200 && request.status <= 300) {
resolve(request.responseText);
} else {
reject({
status: request.status,
statusText: request.statusText,
});
}
};
request.open("GET", domain, true);
request.send();
});
}
module.exports = getRecords;