login/register update
This commit is contained in:
parent
29fe82a05b
commit
c0a044355b
26
package-lock.json
generated
26
package-lock.json
generated
@ -8,7 +8,9 @@
|
|||||||
"name": "love-nav-vue",
|
"name": "love-nav-vue",
|
||||||
"version": "0.1.0",
|
"version": "0.1.0",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@popperjs/core": "^2.11.8",
|
||||||
"axios": "^1.6.2",
|
"axios": "^1.6.2",
|
||||||
|
"bootstrap": "^5.3.2",
|
||||||
"core-js": "^3.8.3",
|
"core-js": "^3.8.3",
|
||||||
"echarts": "^5.4.3",
|
"echarts": "^5.4.3",
|
||||||
"element-ui": "^2.15.14",
|
"element-ui": "^2.15.14",
|
||||||
@ -2042,6 +2044,11 @@
|
|||||||
"integrity": "sha512-2LuNTFBIO0m7kKIQvvPHN6UE63VjpmL9rnEEaOOaiSPbZK+zUOYIzBAWcED+3XYzhYsd/0mD57VdxAEqqV52CQ==",
|
"integrity": "sha512-2LuNTFBIO0m7kKIQvvPHN6UE63VjpmL9rnEEaOOaiSPbZK+zUOYIzBAWcED+3XYzhYsd/0mD57VdxAEqqV52CQ==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"node_modules/@popperjs/core": {
|
||||||
|
"version": "2.11.8",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@popperjs/core/-/core-2.11.8.tgz",
|
||||||
|
"integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A=="
|
||||||
|
},
|
||||||
"node_modules/@sideway/address": {
|
"node_modules/@sideway/address": {
|
||||||
"version": "4.1.4",
|
"version": "4.1.4",
|
||||||
"resolved": "https://registry.npmmirror.com/@sideway/address/-/address-4.1.4.tgz",
|
"resolved": "https://registry.npmmirror.com/@sideway/address/-/address-4.1.4.tgz",
|
||||||
@ -3716,6 +3723,14 @@
|
|||||||
"integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
|
"integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"node_modules/bootstrap": {
|
||||||
|
"version": "5.3.2",
|
||||||
|
"resolved": "https://registry.npmmirror.com/bootstrap/-/bootstrap-5.3.2.tgz",
|
||||||
|
"integrity": "sha512-D32nmNWiQHo94BKHLmOrdjlL05q1c8oxbtBphQFb9Z5to6eGRDCm0QgeaZ4zFBHzfg2++rqa2JkqCcxDy0sH0g==",
|
||||||
|
"peerDependencies": {
|
||||||
|
"@popperjs/core": "^2.11.8"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/brace-expansion": {
|
"node_modules/brace-expansion": {
|
||||||
"version": "1.1.11",
|
"version": "1.1.11",
|
||||||
"resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
"resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||||
@ -12620,6 +12635,11 @@
|
|||||||
"integrity": "sha512-2LuNTFBIO0m7kKIQvvPHN6UE63VjpmL9rnEEaOOaiSPbZK+zUOYIzBAWcED+3XYzhYsd/0mD57VdxAEqqV52CQ==",
|
"integrity": "sha512-2LuNTFBIO0m7kKIQvvPHN6UE63VjpmL9rnEEaOOaiSPbZK+zUOYIzBAWcED+3XYzhYsd/0mD57VdxAEqqV52CQ==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"@popperjs/core": {
|
||||||
|
"version": "2.11.8",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@popperjs/core/-/core-2.11.8.tgz",
|
||||||
|
"integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A=="
|
||||||
|
},
|
||||||
"@sideway/address": {
|
"@sideway/address": {
|
||||||
"version": "4.1.4",
|
"version": "4.1.4",
|
||||||
"resolved": "https://registry.npmmirror.com/@sideway/address/-/address-4.1.4.tgz",
|
"resolved": "https://registry.npmmirror.com/@sideway/address/-/address-4.1.4.tgz",
|
||||||
@ -14029,6 +14049,12 @@
|
|||||||
"integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
|
"integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"bootstrap": {
|
||||||
|
"version": "5.3.2",
|
||||||
|
"resolved": "https://registry.npmmirror.com/bootstrap/-/bootstrap-5.3.2.tgz",
|
||||||
|
"integrity": "sha512-D32nmNWiQHo94BKHLmOrdjlL05q1c8oxbtBphQFb9Z5to6eGRDCm0QgeaZ4zFBHzfg2++rqa2JkqCcxDy0sH0g==",
|
||||||
|
"requires": {}
|
||||||
|
},
|
||||||
"brace-expansion": {
|
"brace-expansion": {
|
||||||
"version": "1.1.11",
|
"version": "1.1.11",
|
||||||
"resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
"resolved": "https://registry.npmmirror.com/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||||
|
@ -8,7 +8,9 @@
|
|||||||
"lint": "vue-cli-service lint"
|
"lint": "vue-cli-service lint"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@popperjs/core": "^2.11.8",
|
||||||
"axios": "^1.6.2",
|
"axios": "^1.6.2",
|
||||||
|
"bootstrap": "^5.3.2",
|
||||||
"core-js": "^3.8.3",
|
"core-js": "^3.8.3",
|
||||||
"echarts": "^5.4.3",
|
"echarts": "^5.4.3",
|
||||||
"element-ui": "^2.15.14",
|
"element-ui": "^2.15.14",
|
||||||
|
@ -875,12 +875,22 @@ body.light-mode .video-bg:before {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
/*::-webkit-scrollbar {*/
|
||||||
width: 6px;
|
/* width: 6px;*/
|
||||||
border-radius: 10px;
|
/* height: 0px;*/
|
||||||
}
|
/* border-radius: 10px;*/
|
||||||
|
/*}*/
|
||||||
::-webkit-scrollbar-thumb {
|
::-webkit-scrollbar-thumb {
|
||||||
background: var(--scrollbar-bg);
|
background: var(--scrollbar-bg);
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
}
|
}
|
||||||
|
*::-webkit-scrollbar {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
* {
|
||||||
|
scrollbar-width: none;
|
||||||
|
}
|
||||||
|
* {
|
||||||
|
-ms-overflow-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@ -2,10 +2,13 @@
|
|||||||
<div class="header">
|
<div class="header">
|
||||||
<div class="menu-circle"></div>
|
<div class="menu-circle"></div>
|
||||||
<div class="header-menu">
|
<div class="header-menu">
|
||||||
<router-link to="/home"><a class="menu-link is-active" >ALL</a></router-link>
|
<!-- <router-link class="router" to="/home"><a class="menu-link is-active" >ALL</a></router-link>-->
|
||||||
<router-link to="/hotNews"><a class="menu-link notify">HotNews</a></router-link>
|
<!-- <router-link class="router" to="/hotNews"><a class="menu-link notify">HotNews</a></router-link>-->
|
||||||
<router-link to="/navDetail"><a class="menu-link">Discover</a></router-link>
|
<!-- <router-link class="router" to="/navDetail"><a class="menu-link">Discover</a></router-link>-->
|
||||||
<a class="menu-link notify" href="#">Market</a>
|
<router-link class="menu-link is-active" to="/home">ALL</router-link>
|
||||||
|
<router-link class="menu-link notify" to="/news">HotNews</router-link>
|
||||||
|
<router-link class="menu-link" to="/navDetail">Discover</router-link>
|
||||||
|
<router-link class="menu-link notify" to="#">Market</router-link>
|
||||||
</div>
|
</div>
|
||||||
<div class="search-bar">
|
<div class="search-bar">
|
||||||
<input type="text" placeholder="Search">
|
<input type="text" placeholder="Search">
|
||||||
@ -13,46 +16,198 @@
|
|||||||
<div class="header-profile">
|
<div class="header-profile">
|
||||||
<div class="notification">
|
<div class="notification">
|
||||||
<span class="notification-number">3</span>
|
<span class="notification-number">3</span>
|
||||||
<svg viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-bell">
|
<svg viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round"
|
||||||
|
stroke-linejoin="round" class="feather feather-bell">
|
||||||
<path d="M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9M13.73 21a2 2 0 01-3.46 0"></path>
|
<path d="M18 8A6 6 0 006 8c0 7-3 9-3 9h18s-3-2-3-9M13.73 21a2 2 0 01-3.46 0"></path>
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
<svg viewBox="0 0 512 512" fill="currentColor">
|
<svg viewBox="0 0 512 512" fill="currentColor">
|
||||||
<path d="M448.773 235.551A135.893 135.893 0 00451 211c0-74.443-60.557-135-135-135-47.52 0-91.567 25.313-115.766 65.537-32.666-10.59-66.182-6.049-93.794 12.979-27.612 19.013-44.092 49.116-45.425 82.031C24.716 253.788 0 290.497 0 331c0 7.031 1.703 13.887 3.006 20.537l.015.015C12.719 400.492 56.034 436 106 436h300c57.891 0 106-47.109 106-105 0-40.942-25.053-77.798-63.227-95.449z"></path>
|
<path
|
||||||
|
d="M448.773 235.551A135.893 135.893 0 00451 211c0-74.443-60.557-135-135-135-47.52 0-91.567 25.313-115.766 65.537-32.666-10.59-66.182-6.049-93.794 12.979-27.612 19.013-44.092 49.116-45.425 82.031C24.716 253.788 0 290.497 0 331c0 7.031 1.703 13.887 3.006 20.537l.015.015C12.719 400.492 56.034 436 106 436h300c57.891 0 106-47.109 106-105 0-40.942-25.053-77.798-63.227-95.449z"></path>
|
||||||
</svg>
|
</svg>
|
||||||
<img @click="openLoginDialog" class="profile-img" src="https://images.unsplash.com/photo-1600353068440-6361ef3a86e8?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1000&q=80" alt="">
|
<img @click="openLoginDialog" class="profile-img"
|
||||||
|
src="https://images.unsplash.com/photo-1600353068440-6361ef3a86e8?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1000&q=80"
|
||||||
|
alt="">
|
||||||
</div>
|
</div>
|
||||||
<LoginDialog :login-dialog-visible="loginDialogVisible"></LoginDialog>
|
<!--登录弹窗-->
|
||||||
|
<el-dialog
|
||||||
|
class="dialog"
|
||||||
|
:visible.sync="loginDialogVisible"
|
||||||
|
width="30vw"
|
||||||
|
append-to-body
|
||||||
|
:close-on-click-modal="false"
|
||||||
|
:before-close="modalClose"
|
||||||
|
>
|
||||||
|
<el-tabs type="border-card">
|
||||||
|
<el-tab-pane>
|
||||||
|
<span slot="label"><i class="el-icon-user-solid"></i>登录</span>
|
||||||
|
<el-form :model="loginForm" ref="ruleForm" class="form">
|
||||||
|
<el-form-item prop="username">
|
||||||
|
<el-input
|
||||||
|
v-model="loginForm.username"
|
||||||
|
prefix-icon="el-icon-user"
|
||||||
|
placeholder="用户名/邮箱"
|
||||||
|
auto-complete="off"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item prop="password">
|
||||||
|
<!-- type:密码显示* -->
|
||||||
|
<el-input
|
||||||
|
prefix-icon="el-icon-unlock"
|
||||||
|
:type="passwordVisible"
|
||||||
|
v-model="loginForm.password"
|
||||||
|
placeholder="密码"
|
||||||
|
auto-complete="new-password"
|
||||||
|
>
|
||||||
|
<i slot="suffix" :class="icon" @click="showPass" ></i>
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item prop="code" style="display: flex;flex-wrap: nowrap;flex-direction: row;">
|
||||||
|
<el-input
|
||||||
|
prefix-icon="el-icon-mobile-phone"
|
||||||
|
type="text"
|
||||||
|
placeholder="点击图片更换验证码"
|
||||||
|
v-model="loginForm.code"
|
||||||
|
class="vertify_code"
|
||||||
|
auto-complete="false"
|
||||||
|
style="width: 15.8vw"
|
||||||
|
></el-input>
|
||||||
|
<!-- <span class="code">验证码</span> -->
|
||||||
|
<img src="imageUrl" @click="resetImg" class="vertify_img"/>
|
||||||
|
</el-form-item>
|
||||||
|
<div style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;align-content: center">
|
||||||
|
<el-form-item prop="remember">
|
||||||
|
<el-checkbox v-model="loginForm.remember" class="remember">记住我</el-checkbox>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="login-btn" style="display: flex;flex-direction: row;justify-content: space-between">
|
||||||
|
<el-button type="primary" @click="submitLoginForm('ruleForm')" >登录
|
||||||
|
</el-button
|
||||||
|
>
|
||||||
|
<el-button @click="resetForm('ruleForm')">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</el-form>
|
||||||
|
</el-tab-pane>
|
||||||
|
|
||||||
|
<el-tab-pane>
|
||||||
|
<span slot="label"><i class="el-icon-edit"></i> 注册</span>
|
||||||
|
<el-form :model="registerFrom" ref="ruleForm" class="form">
|
||||||
|
<el-form-item prop="username">
|
||||||
|
<el-input
|
||||||
|
v-model="registerFrom.username"
|
||||||
|
prefix-icon="el-icon-user"
|
||||||
|
placeholder="用户名"
|
||||||
|
auto-complete="off"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item prop="email">
|
||||||
|
<el-input
|
||||||
|
prefix-icon="el-icon-s-promotion"
|
||||||
|
v-model="registerFrom.email"
|
||||||
|
placeholder="邮箱"
|
||||||
|
>
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item prop="password">
|
||||||
|
<!-- type:密码显示* -->
|
||||||
|
<el-input
|
||||||
|
prefix-icon="el-icon-unlock"
|
||||||
|
:type="passwordVisible"
|
||||||
|
v-model="registerFrom.password"
|
||||||
|
placeholder="密码"
|
||||||
|
auto-complete="new-password"
|
||||||
|
>
|
||||||
|
<i slot="suffix" :class="icon" @click="showPass" ></i>
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item prop="repassword">
|
||||||
|
<!-- type:密码显示* -->
|
||||||
|
<el-input
|
||||||
|
prefix-icon="el-icon-unlock"
|
||||||
|
:type="passwordVisible"
|
||||||
|
v-model="registerFrom.repassword"
|
||||||
|
placeholder="确认密码"
|
||||||
|
auto-complete="new-password"
|
||||||
|
>
|
||||||
|
<i slot="suffix" :class="icon" @click="showPass" ></i>
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
|
||||||
|
<el-form-item prop="captcha" style="display: flex;flex-wrap: nowrap;flex-direction: row;justify-content: space-between">
|
||||||
|
<el-input
|
||||||
|
prefix-icon="el-icon-mobile-phone"
|
||||||
|
type="text"
|
||||||
|
placeholder="验证码"
|
||||||
|
v-model="registerFrom.captcha"
|
||||||
|
class="vertify_code"
|
||||||
|
auto-complete="false"
|
||||||
|
style="width: 15.3vw"
|
||||||
|
></el-input>
|
||||||
|
<el-button style="margin-left: 5px" @click="sendEmail" type="success" :disabled="!showTime">
|
||||||
|
获取验证码
|
||||||
|
<span v-show="!showTime" class="count">({{sendTime}}s)</span>
|
||||||
|
</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
<div class="login-btn" style="display: flex;flex-direction: row;justify-content: space-between">
|
||||||
|
<el-button type="primary" @click="submitRegisterForm('ruleForm')" >注册
|
||||||
|
</el-button
|
||||||
|
>
|
||||||
|
<el-button @click="resetForm('ruleForm')">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</el-form>
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import $ from 'jquery'
|
import $ from 'jquery'
|
||||||
import LoginDialog from "@/components/login/LoginDialog.vue";
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name:"HomeHeader",
|
name: "HomeHeader",
|
||||||
components:{
|
components: {},
|
||||||
LoginDialog
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
loginDialogVisible:false,
|
loginDialogVisible: false,
|
||||||
}},
|
passwordVisible: "password",
|
||||||
|
icon: "el-icon-view",
|
||||||
|
showTime: true, /* 布尔值,通过v-show控制显示‘获取按钮’还是‘倒计时’ */
|
||||||
|
sendTime: '', /* 倒计时 计数器 */
|
||||||
|
timer: null,
|
||||||
|
loginForm: {
|
||||||
|
username: null,
|
||||||
|
password: null,
|
||||||
|
code: null,
|
||||||
|
remember: null
|
||||||
|
},
|
||||||
|
registerFrom:{
|
||||||
|
username: null,
|
||||||
|
email:null,
|
||||||
|
captcha:null,
|
||||||
|
password: null,
|
||||||
|
repassword:null,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.toggleActive();
|
this.toggleActive();
|
||||||
this.reacherBarFun();
|
this.reacherBarFun();
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {},
|
||||||
|
|
||||||
},
|
|
||||||
methods: {
|
methods: {
|
||||||
openLoginDialog(){
|
// 打开登陆注册
|
||||||
this.loginDialogVisible=true;
|
openLoginDialog() {
|
||||||
|
this.loginDialogVisible = true;
|
||||||
},
|
},
|
||||||
|
// 导航栏动态切换
|
||||||
toggleActive(){
|
toggleActive() {
|
||||||
$(function () {
|
$(function () {
|
||||||
$(".menu-link").click(function () {
|
$(".menu-link").click(function () {
|
||||||
$(".menu-link").removeClass("is-active");
|
$(".menu-link").removeClass("is-active");
|
||||||
@ -60,19 +215,83 @@ this.reacherBarFun();
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
reacherBarFun(){
|
// 搜索框
|
||||||
$(".search-bar input").
|
reacherBarFun() {
|
||||||
focus(function () {
|
$(".search-bar input").focus(function () {
|
||||||
$(".header").addClass("wide");
|
$(".header").addClass("wide");
|
||||||
}).
|
}).blur(function () {
|
||||||
blur(function () {
|
|
||||||
$(".header").removeClass("wide");
|
$(".header").removeClass("wide");
|
||||||
});
|
});
|
||||||
}
|
},
|
||||||
|
// 弹窗关闭
|
||||||
|
modalClose() {
|
||||||
|
this.loginDialogVisible = false;
|
||||||
|
},
|
||||||
|
// 显示密码
|
||||||
|
showPass() {
|
||||||
|
if (this.passwordVisible === "text") {
|
||||||
|
this.passwordVisible = "password";
|
||||||
|
//更换图标
|
||||||
|
this.icon = "el-icon-view";
|
||||||
|
} else {
|
||||||
|
this.passwordVisible = "text";
|
||||||
|
this.icon = "el-icon-lock";
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 登录提交
|
||||||
|
submitLoginForm(formName) {
|
||||||
|
// var _this=this;
|
||||||
|
// this.$refs[formName].validate((valid) => {
|
||||||
|
// if (valid) {
|
||||||
|
//
|
||||||
|
// }
|
||||||
|
//
|
||||||
|
// });
|
||||||
|
},
|
||||||
|
// 注册提交
|
||||||
|
submitRegisterForm(formName) {
|
||||||
|
// var _this=this;
|
||||||
|
// this.$refs[formName].validate((valid) => {
|
||||||
|
// if (valid) {
|
||||||
|
//
|
||||||
|
// }
|
||||||
|
//
|
||||||
|
// });
|
||||||
|
},
|
||||||
|
//重置
|
||||||
|
resetForm(formName) {
|
||||||
|
this.$refs[formName].resetFields();
|
||||||
|
},
|
||||||
|
// 发送邮箱验证码
|
||||||
|
sendEmail(){
|
||||||
|
|
||||||
|
const TIME_COUNT = 60; // 更改倒计时时间
|
||||||
|
if (!this.timer) {
|
||||||
|
this.sendTime = TIME_COUNT;
|
||||||
|
this.showTime = false;
|
||||||
|
this.timer = setInterval(() => {
|
||||||
|
if (this.sendTime > 0 && this.sendTime <= TIME_COUNT) {
|
||||||
|
this.sendTime--;
|
||||||
|
} else {
|
||||||
|
this.showTime = true;
|
||||||
|
clearInterval(this.timer); // 清除定时器
|
||||||
|
this.timer = null;
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//点击图片更换验证码
|
||||||
|
resetImg() {
|
||||||
|
this.imageUrl = "http://localhost:8082/helloGithub_war_exploded/VerifycodeServlet?" + new Date().getTime();
|
||||||
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
.dialog {
|
||||||
|
backdrop-filter: blur(20px);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
@ -1,45 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<el-dialog
|
|
||||||
title="登录"
|
|
||||||
:visible="loginDialogVisible"
|
|
||||||
width="25vw"
|
|
||||||
append-to-body
|
|
||||||
:close-on-click-modal="false"
|
|
||||||
:before-close="modalClose">
|
|
||||||
<div>
|
|
||||||
登录
|
|
||||||
</div>
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name:"LoginDialog",
|
|
||||||
props:{
|
|
||||||
loginDialogVisible:Boolean
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
|
|
||||||
}},
|
|
||||||
mounted() {
|
|
||||||
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
modalClose() {
|
|
||||||
this.$emit('update:loginDialogVisible', false); // 直接修改父组件的属性
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
<style scoped>
|
|
||||||
|
|
||||||
</style>
|
|
@ -14,6 +14,8 @@ window.$ = $;
|
|||||||
import * as echarts from 'echarts';//引入echarts
|
import * as echarts from 'echarts';//引入echarts
|
||||||
Vue.prototype.$echarts = echarts //引入组件
|
Vue.prototype.$echarts = echarts //引入组件
|
||||||
|
|
||||||
|
import 'bootstrap'
|
||||||
|
import 'bootstrap/dist/css/bootstrap.min.css'
|
||||||
|
|
||||||
Vue.config.productionTip = false
|
Vue.config.productionTip = false
|
||||||
Vue.use(ElementUI);
|
Vue.use(ElementUI);
|
||||||
|
@ -2,7 +2,7 @@ import Vue from 'vue'
|
|||||||
import VueRouter from 'vue-router'
|
import VueRouter from 'vue-router'
|
||||||
import index from '../views/Index.vue'
|
import index from '../views/Index.vue'
|
||||||
import home from "@/components/home/HomePage.vue";
|
import home from "@/components/home/HomePage.vue";
|
||||||
import hotNews from "@/components/hotNews/HotNews.vue";
|
import news from "@/components/hotNews/HotNews.vue";
|
||||||
import navDetail from "@/components/detail/NavDetail.vue";
|
import navDetail from "@/components/detail/NavDetail.vue";
|
||||||
import notFound from "@/components/notFound/NotFound.vue";
|
import notFound from "@/components/notFound/NotFound.vue";
|
||||||
import settings from "@/views/Settings.vue";
|
import settings from "@/views/Settings.vue";
|
||||||
@ -30,9 +30,9 @@ const routes = [
|
|||||||
component: home
|
component: home
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/hotNews',
|
path: '/news',
|
||||||
name: 'hotNews',
|
name: 'news',
|
||||||
component: hotNews
|
component: news
|
||||||
},{
|
},{
|
||||||
path: '/navDetail',
|
path: '/navDetail',
|
||||||
name: 'navDetail',
|
name: 'navDetail',
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
const { defineConfig } = require('@vue/cli-service')
|
const { defineConfig } = require('@vue/cli-service')
|
||||||
module.exports = defineConfig({
|
module.exports = defineConfig({
|
||||||
transpileDependencies: true,
|
transpileDependencies: true,
|
||||||
|
lintOnSave:false,//关闭语法检查
|
||||||
devServer: {
|
devServer: {
|
||||||
client: {
|
client: {
|
||||||
overlay: false // 编译错误时,取消全屏覆盖
|
overlay: false // 编译错误时,取消全屏覆盖
|
||||||
|
Loading…
Reference in New Issue
Block a user