You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

60 lines
1.3 KiB

<script setup lang="ts">
import jfapi from '@/jfapi'
import { ref } from 'vue'
const username = ref('')
const host = ref('http://192.168.0.110:8096')
const password = ref('')
const login = () => {
jfapi.Login(host.value, username.value, password.value).then((data) => {
console.log(data)
if (data !== null) {
localStorage.setItem('jf_userid', data.Id)
localStorage.setItem('jf_host', host.value)
window.location.href = '/'
}
})
}
</script>
<template>
<div class="login-wrapper">
<div class="form-item">
<div class="label">Server Address</div>
<input type="text" v-model="host" />
</div>
<div class="form-item">
<div class="label">Username</div>
<input type="text" v-model="username" />
</div>
<div class="form-item">
<div class="label">Password</div>
<input type="password" v-model="password" />
</div>
<div class="form-item">
<button class="primary-button" @click="login">Submit</button>
</div>
</div>
</template>
<style scoped>
.form-item {
width: 100%;
}
.login-wrapper {
width: 300px;
display: flex;
flex-direction: column;
align-items: baseline;
margin: 0 auto;
margin-top: 30vh;
gap: 1em;
}
input {
width: 100%;
}
.label {
padding-left: 1em;
}
</style>