1
0
mirror of https://github.com/cwchristerw/bokxin-ip synced 2024-11-09 16:50:28 +00:00
This commit is contained in:
Juho Salli 2019-12-18 22:57:45 +02:00
parent 11d91093d7
commit 63ec872164
3 changed files with 105 additions and 20 deletions

View File

@ -1,8 +1,8 @@
module.exports = {
siteMetadata: {
title: `Gatsby Default Starter`,
description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`,
author: `@gatsbyjs`,
title: `Generoi Bokxi IP`,
description: ``,
author: `@juhosa`,
},
plugins: [
`gatsby-plugin-react-helmet`,

View File

@ -36,9 +36,9 @@ const Layout = ({ children }) => {
>
<main>{children}</main>
<footer>
© {new Date().getFullYear()}, Built with
© {new Date().getFullYear()}, Tehny
{` `}
<a href="https://www.gatsbyjs.org">Gatsby</a>
<a href="https://github.com/juhosa">Juho</a>
</footer>
</div>
</>

View File

@ -1,21 +1,106 @@
import React from "react"
import { Link } from "gatsby"
import React, { useState, useEffect } from "react"
import Layout from "../components/layout"
import Image from "../components/image"
import SEO from "../components/seo"
const IndexPage = () => (
<Layout>
<SEO title="Home" />
<h1>Hi people</h1>
<p>Welcome to your new Gatsby site.</p>
<p>Now go build something great.</p>
<div style={{ maxWidth: `300px`, marginBottom: `1.45rem` }}>
<Image />
</div>
<Link to="/page-2/">Go to page 2</Link>
</Layout>
)
const IndexPage = () => {
const [osat, setOsat] = useState({ loppu: "", verkko: "vlan" })
const [ip, setIp] = useState("")
useEffect(() => {
console.log("doip")
// console.log({ osat })
setIp("")
if (osat.loppu === "" || osat.loppu.length !== 4) return
let ekanumero = ""
let loppu = osat.loppu
let verkko = osat.verkko
if (verkko === "vlan") {
const lopuneka = loppu.slice(0, 1)
ekanumero = lopuneka
} else if (verkko === "vlan2") {
const lopuneka = loppu.slice(0, 1)
ekanumero = lopuneka === "2" ? "6" : "7"
}
let loppuosa = ""
for (let i of loppu.slice(1)) {
if (i !== "0") {
loppuosa += i
}
}
setIp(`10.22${ekanumero}.${loppuosa}.x`)
}, [osat.verkko, osat.loppu])
return (
<Layout>
<SEO title="Home" />
<span>
<b>Verkko</b>
</span>
<br />
<label>
<input
type="radio"
value="vlan"
name="verkko-radio"
checked={osat.verkko === "vlan"}
onChange={e => {
// setVerkko(e.target.value)
setOsat({ loppu: osat.loppu, verkko: "vlan" })
}}
/>
VI vlan
</label>
<br />
<label>
<input
type="radio"
value="vlan2"
name="verkko-radio"
checked={osat.verkko === "vlan2"}
onChange={e => {
// setVerkko(e.target.value)
setOsat({ loppu: osat.loppu, verkko: "vlan2" })
}}
/>
VI vlan L2
</label>
<br />
<span>
<b>Tunnuksen/verkon loppuosa</b> (neljä viimeistä merkkiä)
</span>
<br />
<input
type="text"
value={osat.loppu}
onChange={ev => {
setOsat({ loppu: ev.target.value, verkko: osat.verkko })
}}
/>
<div>
<span>
<b>IP</b>
</span>
<br />
{ip !== "" ? `${ip} (valitse x väliltä 2-254)` : "10.22x.xxx.xxx"}
<br />
<span>
<b>Default gateway</b>
</span>
<br />
{ip !== "" ? `${ip} (x on 1)` : "10.22x.xxx.1"}
</div>
</Layout>
)
}
export default IndexPage