IPBS_V_Server_Web/src/components/Main/Home.vue
2025-05-05 10:43:58 +08:00

109 lines
2.4 KiB
Vue

<template>
<el-menu
class="el-menu-demo"
mode="horizontal"
:ellipsis="false"
@select="handleSelect"
style="height: 80px;"
default-active="/UI_1"
>
<el-menu-item index="/UI_1">
<span>注册服务</span>
</el-menu-item>
<el-menu-item index="/UI_2">
<span>BS更新服务</span>
</el-menu-item>
</el-menu>
<div style="height: calc(100vh - 80px)">
<el-scrollbar>
<router-view></router-view>
</el-scrollbar>
</div>
<el-dialog
v-model="User.Verify"
title="权限认证"
width="500"
:before-close="VlClose"
>
<el-form>
<el-form-item label="用户名">
<el-input v-model="DataDB.User" />
</el-form-item>
<el-form-item label="密码">
<el-input v-model="DataDB.Pwd" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="VlClose">
取消
</el-button>
<el-button type="primary" @click.stop="PermissionAuthentication">
确认
</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import logo from '/src/assets/logo.png';
import {onMounted, reactive, ref} from "vue";
import {useRouter} from "vue-router";
import {Api, User, VlClose} from "../JS/RequestAPI.js";
import axios from "axios";
import {ElNotification} from "element-plus";
const router = useRouter();
const DataDB = reactive({
User:User.User,
Pwd:User.Pwd,
})
onMounted(()=>{
// router.push('/UI_1');
User.Verify = true;
})
function handleSelect(key, keyPath){
router.push(key);
}
function PermissionAuthentication(){
axios.post(Api.UserVerify,JSON.stringify({
User:DataDB.User,
Pwd:DataDB.Pwd,
})).then(res=>{
const data = res.data;
if(data.Code === 1){
User.Code = 1;
User.User = DataDB.User;
User.Pwd = DataDB.Pwd;
User.Verify = false;
ElNotification({
title: '提示',
message: '验证成功',
type: 'success',
})
}
else {
User.Verify = true;
ElNotification({
title: '错误',
message: '用户名或密码错误',
type: 'error',
})
User.Code = 0;
}
}).catch(err=>{
User.Code = 0;
})
}
</script>
<style scoped>
body, html {
margin: 0;
padding: 0;
height: 100vh;
width: 100%;
background-color: #1a1a1a;
}
</style>