mirror of
https://gitee.com/xiangheng/x_admin.git
synced 2025-10-07 00:52:57 +08:00
修复部分验证码问题
This commit is contained in:
@@ -2,16 +2,14 @@
|
||||
"version" : "1.0",
|
||||
"configurations" : [
|
||||
{
|
||||
"playground" : "custom",
|
||||
"playground" : "standard",
|
||||
"type" : "uni-app:app-android"
|
||||
},
|
||||
{
|
||||
"app-plus" :
|
||||
{
|
||||
"app-plus" : {
|
||||
"launchtype" : "local"
|
||||
},
|
||||
"mp-weixin" :
|
||||
{
|
||||
"mp-weixin" : {
|
||||
"launchtype" : "local"
|
||||
},
|
||||
"type" : "uniCloud"
|
||||
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -1,54 +1,25 @@
|
||||
<template>
|
||||
<view :class="mode == 'pop' ? 'mask' : ''" v-show="showBox">
|
||||
<view
|
||||
:class="mode == 'pop' ? 'verifybox' : ''"
|
||||
:style="{ 'max-width': parseInt(imgSize.width) + 30 + 'px' }"
|
||||
>
|
||||
<view :class="mode == 'pop' ? 'verifybox' : ''" :style="{ 'max-width': parseInt(imgSize.width) + 30 + 'px' }">
|
||||
<view class="verifybox-top" v-if="mode == 'pop'">
|
||||
请完成安全验证
|
||||
<text class="verifybox-close" @click="clickShow = false">
|
||||
<text class="iconfont icon-close"></text>
|
||||
</text>
|
||||
</view>
|
||||
<view
|
||||
class="verifybox-bottom"
|
||||
:style="{ padding: mode == 'pop' ? '15px' : '0' }"
|
||||
>
|
||||
<view class="verifybox-bottom" :style="{ padding: mode == 'pop' ? '15px' : '0' }">
|
||||
<!-- 验证码容器 -->
|
||||
<!-- 滑动 -->
|
||||
<view v-if="componentType == 'VerifySlide'">
|
||||
<VerifySlide
|
||||
@success="success"
|
||||
:captchaType="captchaType"
|
||||
:type="verifyType"
|
||||
:figure="figure"
|
||||
:arith="arith"
|
||||
:mode="mode"
|
||||
:vSpace="vSpace"
|
||||
:explain="explain"
|
||||
:imgSize="imgSize"
|
||||
:blockSize="blockSize"
|
||||
:barSize="barSize"
|
||||
:defaultImg="defaultImg"
|
||||
ref="instance"
|
||||
></VerifySlide>
|
||||
<VerifySlide @success="success" :captchaType="captchaType" :type="verifyType" :figure="figure"
|
||||
:arith="arith" :mode="mode" :vSpace="vSpace" :explain="explain" :imgSize="imgSize"
|
||||
:blockSize="blockSize" :barSize="barSize" ref="VerifySlideInstance"></VerifySlide>
|
||||
</view>
|
||||
<!-- 点选 -->
|
||||
<view v-if="componentType == 'VerifyPoints'">
|
||||
<VerifyPoint
|
||||
:captchaType="captchaType"
|
||||
:type="verifyType"
|
||||
:figure="figure"
|
||||
:arith="arith"
|
||||
:mode="mode"
|
||||
:vSpace="vSpace"
|
||||
:explain="explain"
|
||||
:imgSize="imgSize"
|
||||
:blockSize="blockSize"
|
||||
:barSize="barSize"
|
||||
:defaultImg="defaultImg"
|
||||
ref="instance"
|
||||
></VerifyPoint>
|
||||
<VerifyPoint :captchaType="captchaType" :type="verifyType" :figure="figure" :arith="arith"
|
||||
:mode="mode" :vSpace="vSpace" :explain="explain" :imgSize="imgSize" :blockSize="blockSize"
|
||||
:barSize="barSize" ref="VerifyPointsInstance"></VerifyPoint>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -59,9 +30,9 @@
|
||||
* Verify 验证码组件
|
||||
* @description 分发验证码使用
|
||||
* */
|
||||
import VerifySlide from "./verifySlider/verifySlider";
|
||||
import VerifyPoint from "./verifyPoint/verifyPoint";
|
||||
import defaultJpg from "@/static/default.jpg";
|
||||
import VerifySlide from "./verifySlider/verifySlider.vue";
|
||||
import VerifyPoint from "./verifyPoint/verifyPoint.vue";
|
||||
|
||||
export default {
|
||||
name: "Vue2Verify",
|
||||
components: {
|
||||
@@ -118,13 +89,10 @@ export default {
|
||||
// showBox:true,
|
||||
clickShow: false,
|
||||
|
||||
defaultImg: defaultJpg,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
instance() {
|
||||
return this.$refs.instance || {};
|
||||
},
|
||||
|
||||
showBox() {
|
||||
if (this.mode == "pop") {
|
||||
return this.clickShow;
|
||||
@@ -144,7 +112,7 @@ export default {
|
||||
if (this.captchaType == "blockPuzzle") {
|
||||
return "VerifySlide";
|
||||
} else {
|
||||
return "VerifyPoint";
|
||||
return "VerifyPoints";
|
||||
}
|
||||
},
|
||||
},
|
||||
@@ -187,8 +155,10 @@ export default {
|
||||
* @description 刷新
|
||||
* */
|
||||
refresh() {
|
||||
if (this.instance.refresh) {
|
||||
this.instance.refresh();
|
||||
if (this.captchaType == "blockPuzzle") {
|
||||
this.$refs.VerifySlideInstance?.refresh();
|
||||
} else {
|
||||
this.$refs.VerifyPointsInstance?.refresh();
|
||||
}
|
||||
},
|
||||
show() {
|
||||
@@ -211,6 +181,7 @@ export default {
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.verifybox-top {
|
||||
padding: 0 15px;
|
||||
height: 50px;
|
||||
@@ -221,10 +192,12 @@ export default {
|
||||
border-bottom: 1px solid #e4e7eb;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.verifybox-bottom {
|
||||
/* padding: 15px; */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.verifybox-close {
|
||||
position: absolute;
|
||||
top: 13px;
|
||||
@@ -234,6 +207,7 @@ export default {
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
@@ -245,6 +219,7 @@ export default {
|
||||
/* display: none; */
|
||||
transition: all 0.5s;
|
||||
}
|
||||
|
||||
.verify-tips {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
@@ -255,14 +230,17 @@ export default {
|
||||
line-height: 30px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.tips-enter,
|
||||
.tips-leave-to {
|
||||
bottom: -30px;
|
||||
}
|
||||
|
||||
.tips-enter-active,
|
||||
.tips-leave-active {
|
||||
transition: bottom 0.5s;
|
||||
}
|
||||
|
||||
/* ---------------------------- */
|
||||
/*常规验证码*/
|
||||
.verify-code {
|
573
x_admin_app/components/verify/verifyPoint/verifyPoint.vue
Normal file
573
x_admin_app/components/verify/verifyPoint/verifyPoint.vue
Normal file
File diff suppressed because one or more lines are too long
684
x_admin_app/components/verify/verifySlider/verifySlider.vue
Normal file
684
x_admin_app/components/verify/verifySlider/verifySlider.vue
Normal file
File diff suppressed because one or more lines are too long
@@ -33,33 +33,12 @@
|
||||
let text = ["Fota", "轻松管理"];
|
||||
|
||||
|
||||
let baseList = [
|
||||
// {
|
||||
// icon: "/static/index/product.png",
|
||||
// path: "/pages/product/product",
|
||||
// title: "产品",
|
||||
// },
|
||||
// {
|
||||
// icon: "/static/index/group.png",
|
||||
// path: "/pages/group/group",
|
||||
// title: "分组",
|
||||
// },
|
||||
// {
|
||||
// icon: "/static/index/version.png",
|
||||
// path: "/pages/version/version",
|
||||
// title: "版本",
|
||||
// },
|
||||
{
|
||||
let baseList = [{
|
||||
icon: "/static/index/equipment.png",
|
||||
path: "/pages/monitor_project/index",
|
||||
title: "项目监控",
|
||||
},
|
||||
|
||||
{
|
||||
icon: "/static/index/equipment.png",
|
||||
path: "/pages/equipment/equipment",
|
||||
title: "设备管理",
|
||||
},
|
||||
|
||||
{
|
||||
icon: "scan",
|
||||
@@ -83,26 +62,8 @@
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "/static/index/equipmentLog.png",
|
||||
path: "/pages/statistics/statistics",
|
||||
title: "销量统计",
|
||||
},
|
||||
// {
|
||||
// icon: "/static/index/sysUp.png",
|
||||
// path: "/pages/log/sysUp/sysUp",
|
||||
// title: "上行日志",
|
||||
// },
|
||||
// {
|
||||
// icon: "/static/index/sysDown.png",
|
||||
// path: "/pages/log/sysDown/sysDown",
|
||||
// title: "下行日志",
|
||||
// },
|
||||
// {
|
||||
// icon: "/static/index/log.png",
|
||||
// path: "/pages/log/sysLog/sysLog",
|
||||
// title: "系统日志",
|
||||
// },
|
||||
|
||||
|
||||
];
|
||||
|
||||
function toList(item) {
|
||||
|
@@ -1,64 +1,30 @@
|
||||
<template>
|
||||
<view>
|
||||
<uv-form
|
||||
class="form"
|
||||
ref="form"
|
||||
labelWidth="60"
|
||||
labelAlign="right"
|
||||
:model="model"
|
||||
:rules="rules"
|
||||
>
|
||||
<uv-form class="form" ref="form" labelWidth="60" labelAlign="right" :model="model" :rules="rules">
|
||||
<uv-form-item class="hide">
|
||||
<uv-input
|
||||
class="hide"
|
||||
v-model="model.username"
|
||||
placeholder="请输入账号"
|
||||
:rules="[{ required: true, message: '请填写账号' }]"
|
||||
/>
|
||||
<uv-input class="hide" v-model="model.username" placeholder="请输入账号"
|
||||
:rules="[{ required: true, message: '请填写账号' }]" />
|
||||
</uv-form-item>
|
||||
<uv-form-item class="hide">
|
||||
<uv-input
|
||||
type="password"
|
||||
v-model="model.password"
|
||||
placeholder="请输入密码"
|
||||
:rules="[{ required: true, message: '请填写密码' }]"
|
||||
/>
|
||||
<uv-input type="password" v-model="model.password" placeholder="请输入密码"
|
||||
:rules="[{ required: true, message: '请填写密码' }]" />
|
||||
</uv-form-item>
|
||||
<uv-form-item label="账号" name="username" prop="username">
|
||||
<uv-input
|
||||
v-model="model.username"
|
||||
placeholder="请输入账号"
|
||||
:rules="[{ required: true, message: '请填写账号' }]"
|
||||
/>
|
||||
<uv-input v-model="model.username" placeholder="请输入账号"
|
||||
:rules="[{ required: true, message: '请填写账号' }]" />
|
||||
</uv-form-item>
|
||||
<uv-form-item label="密码" name="password" prop="password">
|
||||
<uv-input
|
||||
type="password"
|
||||
v-model="model.password"
|
||||
placeholder="请输入密码"
|
||||
:rules="[{ required: true, message: '请填写密码' }]"
|
||||
/>
|
||||
<uv-input type="password" v-model="model.password" placeholder="请输入密码"
|
||||
:rules="[{ required: true, message: '请填写密码' }]" />
|
||||
</uv-form-item>
|
||||
|
||||
<Verify
|
||||
@success="VerifySuccess"
|
||||
:mode="'pop'"
|
||||
:captchaType="'blockPuzzle'"
|
||||
ref="verifyRef"
|
||||
:imgSize="{ width: '310px', height: '155px' }"
|
||||
></Verify>
|
||||
|
||||
<Verify :mode="'pop'" :captchaType="'blockPuzzle'" ref="verifyRef"
|
||||
:imgSize="{ width: '310px', height: '155px' }" @success="VerifySuccess"></Verify>
|
||||
|
||||
<view class="footer">
|
||||
<!-- -->
|
||||
|
||||
<wd-button class="btn" size="large" @click="VerifyShow" block
|
||||
>VerifyShow</wd-button
|
||||
>
|
||||
|
||||
<wd-button class="btn" size="large" @click="handleSubmit" block
|
||||
>登录</wd-button
|
||||
>
|
||||
<wd-button class="btn" size="large" @click="VerifyShow" block>登录</wd-button>
|
||||
</view>
|
||||
</uv-form>
|
||||
</view>
|
||||
@@ -66,20 +32,18 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive } from "vue";
|
||||
import { v1 as uuid_v1 } from "uuid";
|
||||
|
||||
import Verify from "@/components/verifition/verify";
|
||||
import Verify from "@/components/verify/verify.vue";
|
||||
|
||||
import { login } from "@/api/user.js";
|
||||
import { setLocalStorage } from "@/utils/storage.js";
|
||||
import { toast } from "@/utils/utils.js";
|
||||
import { alert } from "@/utils/utils.js";
|
||||
// import appicon from "@/static/appicon.png";
|
||||
|
||||
import { useUserStore } from "@/stores/user";
|
||||
|
||||
const userStore = useUserStore();
|
||||
|
||||
|
||||
const model = reactive({
|
||||
username: "",
|
||||
password: "",
|
||||
@@ -99,17 +63,16 @@ const rules = {
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
],
|
||||
|
||||
};
|
||||
const form = ref();
|
||||
const verifyRef=ref()
|
||||
const verifyRef = ref();
|
||||
function VerifyShow(e) {
|
||||
verifyRef.value.show()
|
||||
verifyRef.value.show();
|
||||
}
|
||||
function VerifySuccess(e) {
|
||||
console.log('VerifySuccess',e);
|
||||
console.log("VerifySuccess", e);
|
||||
|
||||
handleSubmit(e)
|
||||
handleSubmit(e);
|
||||
}
|
||||
function handleSubmit(verify) {
|
||||
form.value
|
||||
@@ -119,7 +82,7 @@ function handleSubmit(verify) {
|
||||
username: model.username,
|
||||
password: model.password,
|
||||
|
||||
...verify
|
||||
...verify,
|
||||
};
|
||||
|
||||
// userStore.getUser();
|
||||
@@ -135,16 +98,15 @@ function handleSubmit(verify) {
|
||||
});
|
||||
});
|
||||
} else {
|
||||
|
||||
toast(res.message);
|
||||
alert(res.message);
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
toast(err.message);
|
||||
alert(err.message);
|
||||
});
|
||||
})
|
||||
.catch((err) => {
|
||||
toast(err.message);
|
||||
alert(err.message);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
Reference in New Issue
Block a user