login重构
This commit is contained in:
junleea
parent
970f013f7a
commit
0a0b2fed2e
|
|
@ -87,63 +87,75 @@
|
|||
</el-row>
|
||||
<div>
|
||||
<div class="qrcode" ref="qrCodeUrl"></div>
|
||||
<vue-qr :logoSrc="imageUrl" text="https://blog.csdn.net/weixin_42601136" :size="200"></vue-qr>
|
||||
<vue-qr
|
||||
:logoSrc="imageUrl"
|
||||
text="https://blog.csdn.net/weixin_42601136"
|
||||
:size="200"
|
||||
></vue-qr>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, inject } from "vue";
|
||||
import axios from "axios";
|
||||
import { getQRService, getUUIDService, loginService, registerService } from "@/api/user.js";
|
||||
import router from "@/router/index.js";
|
||||
import VueQr from 'vue-qr'
|
||||
const isLogin = ref(true);
|
||||
if (localStorage.getItem("token") !== null) {
|
||||
router.push("/videoList");
|
||||
}
|
||||
import { ref, onMounted, inject } from "vue";
|
||||
import axios from "axios";
|
||||
import { getQRService, getUUIDService, loginService, registerService } from "@/api/user.js";
|
||||
import router from "@/router/index.js";
|
||||
import VueQr from 'vue-qr'; // 确保你已经注册了这个组件
|
||||
|
||||
export default {
|
||||
components: {
|
||||
VueQr, // 注册 VueQr 组件
|
||||
},
|
||||
setup() {
|
||||
const isLogin = ref(true);
|
||||
const globalData = inject("globalData");
|
||||
var uuid = "";
|
||||
//表单数据
|
||||
var loginData = ref({
|
||||
username: "",
|
||||
email: "lijun.lj@foxmail.com",
|
||||
password: "",
|
||||
ip:"",
|
||||
});l
|
||||
const registerData = ref({
|
||||
username: "",
|
||||
email: "",
|
||||
password: "",
|
||||
repassword: "",
|
||||
});
|
||||
|
||||
const globalData = inject("globalData");
|
||||
//表单校验规则
|
||||
const rules = {
|
||||
password: [
|
||||
{ required: true, message: "请输入密码", trigger: "blur" },
|
||||
{
|
||||
min: 6,
|
||||
max: 20,
|
||||
message: "密码长度在 6 到 20 个字符",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
username: [
|
||||
{ required: true, message: "请输入用户名", trigger: "blur" },
|
||||
{
|
||||
min: 5,
|
||||
max: 20,
|
||||
message: "用户名长度在 6 到 20 个字符",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
email: [{}],
|
||||
};
|
||||
onMounted(() => {
|
||||
const token = localStorage.getItem("token");
|
||||
if (token !== null) {
|
||||
isLogin.value = true; // 更新登录状态
|
||||
router.push("/videoList"); // 跳转到视频列表页面
|
||||
// 你可以在这里获取 UID 并更新 uid.value
|
||||
}
|
||||
});
|
||||
|
||||
var uuid = "";
|
||||
//表单数据
|
||||
var loginData = ref({
|
||||
username: "",
|
||||
email: "lijun.lj@foxmail.com",
|
||||
password: "",
|
||||
ip:"",
|
||||
});
|
||||
const registerData = ref({
|
||||
username: "",
|
||||
email: "",
|
||||
password: "",
|
||||
repassword: "",
|
||||
});
|
||||
|
||||
//表单校验规则
|
||||
const rules = {
|
||||
password: [
|
||||
{ required: true, message: "请输入密码", trigger: "blur" },
|
||||
{
|
||||
min: 6,
|
||||
max: 20,
|
||||
message: "密码长度在 6 到 20 个字符",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
username: [
|
||||
{ required: true, message: "请输入用户名", trigger: "blur" },
|
||||
{
|
||||
min: 5,
|
||||
max: 20,
|
||||
message: "用户名长度在 6 到 20 个字符",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
email: [{}],
|
||||
};
|
||||
|
||||
const creatQrCode =async () =>{
|
||||
const creatQrCode =async () =>{
|
||||
var qrcode = new qrcode(this.$refs.qrCodeUrl, {
|
||||
text: uuid, // 需要转换为二维码的内容
|
||||
width: 100,
|
||||
|
|
@ -154,56 +166,9 @@ const creatQrCode =async () =>{
|
|||
});
|
||||
};
|
||||
|
||||
//登录接口调用
|
||||
const login = async () => {
|
||||
// let req = axios.create({
|
||||
// baseURL: "/api",
|
||||
// timeout: 5000,
|
||||
// });
|
||||
// await req
|
||||
// .post("/user/login", {
|
||||
// email: loginData.value.username,
|
||||
// password: loginData.value.password,
|
||||
// })
|
||||
// .then((response) => {
|
||||
// alert(response.data.message);
|
||||
// resp = response.data;
|
||||
// jwt = resp.data;
|
||||
// console.log(jwt);
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.error(error);
|
||||
// });
|
||||
let result = await loginService(loginData);
|
||||
globalData.token = result.data;
|
||||
localStorage.setItem("token", result.data.token);
|
||||
localStorage.setItem("userId", result.data.id);
|
||||
localStorage.setItem("username", result.data.username);
|
||||
let now=new Date();
|
||||
localStorage.setItem("end_time", now.setDate(now.getHours() + 12));//过期时间
|
||||
//token.value= result.data;
|
||||
router.push("/videoList");
|
||||
};
|
||||
|
||||
const getUUID= async() => {
|
||||
try {
|
||||
const response = await getUUIDService({"device":"windows"});
|
||||
uuid =response.data.toString();
|
||||
let uid =uuid.toString();
|
||||
console.log("uuid=",uuid);
|
||||
await creatQrCode(uid);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
|
||||
const getQRStatus = async () => {
|
||||
let result = await getQRService({"uuid":uuid});
|
||||
if (result.code === 0) {
|
||||
if(result.data==="0"){
|
||||
}else if(result.data==="1"){
|
||||
alert("等待确认");
|
||||
}else{
|
||||
//登录接口调用
|
||||
const login = async () => {
|
||||
let result = await loginService(loginData);
|
||||
globalData.token = result.data;
|
||||
localStorage.setItem("token", result.data.token);
|
||||
localStorage.setItem("userId", result.data.id);
|
||||
|
|
@ -212,38 +177,69 @@ const getQRStatus = async () => {
|
|||
localStorage.setItem("end_time", now.setDate(now.getHours() + 12));//过期时间
|
||||
//token.value= result.data;
|
||||
router.push("/videoList");
|
||||
};
|
||||
const getUUID= async() => {
|
||||
try {
|
||||
const response = await getUUIDService({"device":"windows"});
|
||||
uuid =response.data.toString();
|
||||
let uid =uuid.toString();
|
||||
console.log("uuid=",uuid);
|
||||
await creatQrCode(uid);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
|
||||
const getQRStatus = async () => {
|
||||
let result = await getQRService({"uuid":uuid});
|
||||
if (result.code === 0) {
|
||||
if(result.data==="0"){
|
||||
}else if(result.data==="1"){
|
||||
alert("等待确认");
|
||||
}else{
|
||||
globalData.token = result.data;
|
||||
localStorage.setItem("token", result.data.token);
|
||||
localStorage.setItem("userId", result.data.id);
|
||||
localStorage.setItem("username", result.data.username);
|
||||
let now=new Date();
|
||||
localStorage.setItem("end_time", now.setDate(now.getHours() + 12));//过期时间
|
||||
//token.value= result.data;
|
||||
router.push("/videoList");
|
||||
}
|
||||
|
||||
} else {
|
||||
alert(result.message);
|
||||
}
|
||||
}
|
||||
|
||||
} else {
|
||||
alert(result.message);
|
||||
}
|
||||
}
|
||||
const getIpClient= async() => {
|
||||
try {
|
||||
const response = await axios.get("https://ipinfo.io/json");
|
||||
loginData.value.ip =response.data.ip;
|
||||
localStorage.setItem("ip", response.data.ip);
|
||||
localStorage.setItem("city", response.data.city);
|
||||
// console.log("ip:",response.data.ip);
|
||||
// console.log("login ip:",loginData.ip);
|
||||
// console.log(response.data);
|
||||
// console.log(loginData);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
};
|
||||
|
||||
const getIpClient= async() => {
|
||||
try {
|
||||
const response = await axios.get("https://ipinfo.io/json");
|
||||
loginData.value.ip =response.data.ip;
|
||||
localStorage.setItem("ip", response.data.ip);
|
||||
localStorage.setItem("city", response.data.city);
|
||||
// console.log("ip:",response.data.ip);
|
||||
// console.log("login ip:",loginData.ip);
|
||||
// console.log(response.data);
|
||||
// console.log(loginData);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
getIpClient();
|
||||
await getUUID();
|
||||
getQRStatus();
|
||||
setInterval("getQRStatus()","1000");//showLogin()函数名一定要带括号
|
||||
const register = async () => {
|
||||
let result = registerService(registerData.value);
|
||||
if (result.code === 0) {
|
||||
alert(result.message);
|
||||
} else {
|
||||
alert(result.message);
|
||||
}
|
||||
};
|
||||
|
||||
getIpClient();
|
||||
await getUUID();
|
||||
getQRStatus();
|
||||
setInterval("getQRStatus()","1000");//showLogin()函数名一定要带括号
|
||||
const register = async () => {
|
||||
let result = registerService(registerData.value);
|
||||
if (result.code === 0) {
|
||||
alert(result.message);
|
||||
} else {
|
||||
alert(result.message);
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue