接入 登录认证

This commit is contained in:
Shikong 2023-05-12 14:31:38 +08:00
parent e2bdc93429
commit afca0a9e00
5 changed files with 84 additions and 10 deletions

View File

@ -0,0 +1,11 @@
import http from "matrix-middle-service-web/src/api";
export interface LoginDTO {
account: string,
password: string
}
export const auth = {
login: (dto:LoginDTO)=>{
return http.post("/auth/login", dto)
}
}

View File

@ -0,0 +1,17 @@
import http from "matrix-middle-service-web/src/api";
import {LoginDTO} from "matrix-middle-service-web/src/api/auth";
export interface locationRecordListDTO {
startTime?:string,
endTime?:string
}
export const locationRecord = {
list: (dto:locationRecordListDTO)=>{
return http.post("/location/record/list", dto,{
headers: {
token: localStorage.getItem("token")
}
})
}
}

View File

@ -2,7 +2,7 @@ import { createApp } from 'vue'
import App from './App.vue'
import "./style.css"
import { Quasar } from 'quasar'
import {Dialog, Notify, Quasar} from 'quasar'
import quasarLang from 'quasar/lang/zh-CN'
import './index.css'
@ -24,7 +24,10 @@ let app = createApp(App);
app.use(Store())
app.use(Router())
app.use(Quasar, {
plugins: {}, // import Quasar plugins and add here
plugins: {
Dialog,
Notify
}, // import Quasar plugins and add here
lang: quasarLang,
/*
config: {

View File

@ -1,5 +1,9 @@
<template>
<div class="flex justify-start flex-wrap items-center">
<q-input v-model="authModel.account" class="mx-1" placeholder="账号" outlined dense></q-input>
<q-input v-model="authModel.password" class="mx-1" placeholder="密码" type="password" outlined dense></q-input>
<q-btn @click="login">登录</q-btn>
<DateTimeSelector v-model="date" range></DateTimeSelector>
<q-btn @click="search">查询</q-btn>
</div>
@ -44,6 +48,8 @@ import {reactive, ref} from "vue";
import DateTimeSelector from "matrix-middle-service-web/src/components/DateTimeSelector.vue";
import {useQuasar} from "quasar";
import moment from "moment";
import {auth} from "matrix-middle-service-web/src/api/auth/index";
import {locationRecord} from "matrix-middle-service-web/src/api/location/record/index";
const $q = useQuasar();
const COLOR = [
'#6090e0', '#30c030', '#d070d0', '#80c0f0', '#f07050', '#ffb900',
@ -95,6 +101,36 @@ const layers = reactive({
show: false,
}
})
const authModel = reactive({
account: "",
password: "",
})
function login(){
console.log("$q", $q)
auth.login(authModel).then((resp)=>{
let res = resp.data
console.log("login", res)
if(res.code !== 200){
$q.notify({
position: "top",
color:"warning",
message: res.data || res.msg,
timeout: 500,
})
} else {
$q.notify({
position: "top",
color:"positive",
message: "登录成功",
timeout: 500,
})
localStorage.setItem("token",res.data.token)
}
})
}
function toggleSatellite(){
if (layers.satellite.show) {
layers.satellite.inst.show()
@ -214,13 +250,20 @@ function search() {
});
data.labelsLayer = labelsLayer
fetch("http://10.10.10.200:6573/record/location/get", {
method: "POST",
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(params)
}).then(resp => resp.json()).then(res => {
locationRecord.list(params).then(resp => {
if(resp.status !== 200){
console.log(resp)
let res = resp.data || {}
$q.notify({
position: "top",
color: 'negative',
message: res.data || res.msg || "请求失败",
icon: 'report_problem'
})
throw new Error("请求失败")
}
return resp.data;
}).then(res => {
let _data = res.data || []
_data = _data.map(item=>{
return {

View File

@ -11,7 +11,7 @@ export default defineConfig({
port: 7868,
proxy:{
"^/api/.*":{
target: "http://10.10.10.100:6573/",
target: "http://10.10.10.20:45680/",
rewrite: (path) => path.replace(/^\/api\//, ''),
},
}