// Import lit-html from CDN
import * as lit from 'https://kevisual.xiongxiao.me/system/lib/html.js';
import { client as query } from 'https://kevisual.xiongxiao.me/system/lib/query.js';
import { message } from 'https://kevisual.xiongxiao.me/system/ui/message.js';
// Function to render a login template into a given context's renderRoot
export const render = (ctx) => {
const template = lit.html`
`;
lit.render(template, ctx.renderRoot);
// Add event listener for form submission
const form = ctx.renderRoot.querySelector('#loginForm');
if (form) {
form.addEventListener('submit', async (event) => {
event.preventDefault();
const username = form.username.value;
const password = form.password.value;
if (!username || !password) {
message.error('Username and password are required');
return;
}
// console.log('Username:', username);
// console.log('Password:', password);
const res = await query.post(
{
path: 'user',
key: 'login',
username,
password,
},
{
url: 'https://envision.xiongxiao.me/api/router',
},
); // Implement login request
// Further login logic can be implemented here
if (res.code === 200) {
message.success('Login success');
// Redirect to home page
// window.location.href = '/';
}
});
}
};
// Function to unmount or perform any clean-up operations
export const unmount = (ctx) => {
console.log('unMount');
lit.render(lit.nothing, ctx.renderRoot); // Clear the rendered content
};
// Usage Example:
// import { renderTemplate, unMountTemplate } from './render-library.js';
// render(context);
// unmount(context);