sheyang
/
sheyangCoastalSystem
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

12/1245:33修改login buildinga

Browse Source
hezhengao
何峥傲 1 year ago
parent 18cdc3ff57
commit 050d776cd8
10 changed files with 201 additions and 90 deletions
Show Stats Download Patch File Download Diff File

BIN
src/assets/building-picture-hza/bg_瀵艰埅@2x.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 383 KiB

BIN
src/assets/building-picture-hza/icon7.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

0
src/assets/building-picture-hza/搴曞骇@2x.png → src/assets/building-picture-hza/icon8.png
Unescape View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 14 KiB

BIN
src/assets/building-picture-hza/icon9.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
src/assets/login-video/video.mp4
View File

Binary file not shown.

BIN
src/assets/login/01.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 35 KiB

After

Width:  |  Height:  |  Size: 52 KiB

4
src/utils/request.js
Unescape View File

@ -3,10 +3,10 @@ import vm from '../main'
import { getToken } from '@/utils/auth' import { getToken } from '@/utils/auth'
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8' axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
const request = axios.create({ const request = axios.create({
baseURL: 'http://50.146.63.43:1129/hjapi', // baseURL: 'http://50.146.63.43:1129/hjapi',
//baseURL: 'http://121.41.91.94:12002/hjapi', //baseURL: 'http://121.41.91.94:12002/hjapi',
//baseURL: `http://${window.location.host}/hjapi`, //baseURL: `http://${window.location.host}/hjapi`,
// baseURL: 'http://121.41.91.94:12524/hjapi/', //外网 baseURL: 'http://121.41.91.94:12524/hjapi/', //外网
timeout: 50000, timeout: 50000,
headers: { 'content-type': 'application/json' } headers: { 'content-type': 'application/json' }
}) })

174
src/views/Login/index.vue
Unescape View File

@ -1,5 +1,9 @@
<template> <template>
<div class="login"> <div class="login">
<video autoplay loop muted>
<source src="../../assets/login-video/video.mp4" />
</video>
<div class="system_title"> <div class="system_title">
<!-- 占位 --> <!-- 占位 -->
<div class="blank"></div> <div class="blank"></div>
@ -32,32 +36,42 @@
</div> </div>
<!-- 账号密码 --> <!-- 账号密码 -->
<div class="username" v-show="show"> <div class="username" v-show="show">
<div class="name"> <div class="username_box">
<el-input <div class="username_icon"></div>
placeholder="请输入账号" <div class="name">
v-model="formValue.username" <el-input
prefix-icon="el-icon-user-solid" placeholder="请输入账号"
> v-model="formValue.username"
<div name_icon></div> onkeyup="value=value.replace(/[^\x00-\xff]/g, '')"
</el-input> >
<div name_icon></div>
</el-input>
</div>
</div> </div>
<div class="word"> <div class="word_box">
<el-input <div class="word_icon"></div>
placeholder="请输入密码" <div class="word">
v-model="formValue.password" <el-input
prefix-icon="el-icon-lock" placeholder="请输入密码"
></el-input> v-model="formValue.password"
onkeyup="value=value.replace(/[^\x00-\xff]/g, '')"
></el-input>
</div>
</div> </div>
<div class="code"> <div class="code">
<el-input <div class="code_box">
placeholder="请输入验证码" <div class="code_icon"></div>
v-model="formValue.code" <el-input
prefix-icon="el-icon-attract" placeholder="请输入验证码"
></el-input> v-model="formValue.code"
></el-input>
</div>
<img class="codeImg" :src="picUrl" alt="" /> <img class="codeImg" :src="picUrl" alt="" />
</div> </div>
<div class="uselogin"> <div class="uselogin">
<el-button type="primary" @click="onLogin">登录</el-button> <el-button @click="onLogin" class="loginbtn">登录</el-button>
</div> </div>
</div> </div>
<!-- 证书登录 --> <!-- 证书登录 -->
@ -67,7 +81,7 @@
<div class="bookicon"></div> <div class="bookicon"></div>
</div> </div>
<div class="uselogin"> <div class="uselogin">
<el-button type="primary" @click="onLogin">登录</el-button> <el-button @click="onLogin">登录</el-button>
</div> </div>
</div> </div>
</el-form> </el-form>
@ -185,10 +199,22 @@ export default {
<style lang="scss"> <style lang="scss">
.login { .login {
position: relative; position: relative;
width: 100%; width: 100vw;
height: 100%; height: 100vh;
background-image: url(@/assets/building-picture-hza/bg@2x.png); video {
background-size: 100% 100%; position: fixed;
right: 0px;
bottom: 0px;
min-width: 100%;
min-height: 100%;
z-index: -22;
}
source {
min-width: 100%;
min-height: 100%;
height: auto;
width: auto;
}
.system_title { .system_title {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -348,7 +374,7 @@ export default {
.book { .book {
width: 23vw; width: 23vw;
height: 15vh; height: 15vh;
margin-bottom: 5vh; margin-bottom: 5.8vh;
color: #ecf4f9; color: #ecf4f9;
border: 1px solid #1ceadf; border: 1px solid #1ceadf;
text-align: center; text-align: center;
@ -367,50 +393,106 @@ export default {
background-size: 100% 100%; background-size: 100% 100%;
} }
} }
.name { .username_box {
// background-color: orange;
display: flex;
justify-content: center;
align-items: center;
border: 1px solid #1ceadf;
border-radius: 4px;
margin-bottom: 2vh; margin-bottom: 2vh;
.el-input__inner { &:hover {
border: 1px solid #1ceadf; border: 1px solid #009bfd;
background-color: #0b2f59; }
color: #fff; .username_icon {
&:hover { width: 1vw;
border: 1px solid #009bfd; height: 2vh;
background-image: url(../../assets/login/loginicon01.png);
background-size: 100% 100%;
margin-left: 0.5vw;
}
.name {
// margin-bottom: 2vh;
.el-input__inner {
width: 21.5vw;
// border: 1px solid #1ceadf;
background-color: #0a3762;
// background-color: #0b2f59;
border: 0px solid #000;
color: #fff;
} }
} }
} }
.word {
.word_box {
display: flex;
justify-content: center;
align-items: center;
border: 1px solid #1ceadf;
border-radius: 4px;
margin-bottom: 2vh; margin-bottom: 2vh;
.el-input__inner { &:hover {
border: 1px solid #1ceadf; border: 1px solid #009bfd;
background-color: #0b2f59; }
color: #fff; .word_icon {
&:hover { width: 1vw;
border: 1px solid #009bfd; height: 2vh;
background-image: url(../../assets//login/loginicon02.png);
background-size: 100% 100%;
margin-left: 0.5vw;
}
.word {
.el-input__inner {
width: 21.5vw;
// border: 1px solid #1ceadf;
background-color: #0a3762;
// background-color: #0b2f59;
border: 0px solid #000;
color: #fff;
} }
} }
} }
.code { .code {
display: flex; display: flex;
.el-input__inner { .code_box {
width: 13vw; display: flex;
justify-content: center;
align-items: center;
border: 1px solid #1ceadf; border: 1px solid #1ceadf;
background-color: #0b2f59; border-radius: 4px;
color: #fff; .code_icon {
&:hover { width: 1vw;
border: 1px solid #009bfd; height: 2vh;
background-image: url(../../assets//login/loginicon03.png);
background-size: 100% 100%;
margin-left: 0.5vw;
} }
} }
.el-input__inner {
width: 14vw;
// border: 1px solid #1ceadf;
background-color: #0a3762;
// background-color: #0b2f59;
border: 0px solid #000;
color: #fff;
}
.codeImg { .codeImg {
width: 14vw; width: 14vw;
height: 4.5vh; height: 4.5vh;
border: 1px solid #1ceadf; border: 1px solid #1ceadf;
border-radius: 5%; border-radius: 5%;
margin-left: 0.5vw;
} }
} }
.uselogin { .uselogin {
margin-top: 3vh; margin-top: 3vh;
.el-button { .el-button {
width: 23vw; width: 23vw;
background-image: url(../../assets/login/loginbtn.png);
background-size: 100% 100%;
border: none;
color: #fff;
} }
} }
} }

95
src/views/buildUse/index.vue
Unescape View File

@ -28,12 +28,14 @@
<!-- --> <!-- -->
<div class="box_background"> <div class="box_background">
<div class="box_body"> <div class="box_body">
<div class="delete" @click="deleteto"></div>
<div class="box_allbox"> <div class="box_allbox">
<div class="box_item" v-for="item in roll_list" :key="item.id"> <div class="box_item" v-for="item in roll_list" :key="item.id">
<div <div
class="box_item_icon" class="box_item_icon"
:style="{ backgroundImage: back_change(item.id) }" :style="{ backgroundImage: back_change(item.id) }"
></div> ></div>
<div class="box_item_bgc"></div>
<div class="box_item_title" @click="turn(item.route)"> <div class="box_item_title" @click="turn(item.route)">
{{ item.name }} {{ item.name }}
</div> </div>
@ -55,7 +57,7 @@ export default {
roll_list: [ roll_list: [
{ {
id: '1', id: '1',
name: '非法狩猎', name: '非法捕猎',
route: '/hunting' route: '/hunting'
}, },
{ {
@ -78,30 +80,6 @@ export default {
id: '6', id: '6',
name: '建模平台' name: '建模平台'
} }
// {
// id: '7',
// name: '非法狩猎'
// },
// {
// id: '8',
// name: '非法狩猎'
// },
// {
// id: '9',
// name: '非法狩猎'
// },
// {
// id: '10',
// name: '非法狩猎'
// },
// {
// id: '11',
// name: '非法狩猎'
// },
// {
// id: '12',
// name: '非法狩猎'
// }
] ]
} }
}, },
@ -112,6 +90,10 @@ export default {
this.back_change() this.back_change()
}, },
methods: { methods: {
// 返回上一级路由
deleteto() {
this.$router.go(-1)
},
timeStart() { timeStart() {
this.timer = setInterval(() => { this.timer = setInterval(() => {
this.timeArr = dateFormat(new Date()) this.timeArr = dateFormat(new Date())
@ -122,7 +104,7 @@ export default {
console.log(id, 'lll') console.log(id, 'lll')
switch (id) { switch (id) {
case '1': case '1':
return `url(${require('@/assets/building-picture-hza/icon1.png')})` return `url(${require('@/assets/building-picture-hza/icon9.png')})`
case '2': case '2':
return `url(${require('@/assets/building-picture-hza/icon6.png')})` return `url(${require('@/assets/building-picture-hza/icon6.png')})`
case '3': case '3':
@ -133,18 +115,18 @@ export default {
return `url(${require('@/assets/building-picture-hza/icon3.png')})` return `url(${require('@/assets/building-picture-hza/icon3.png')})`
case '6': case '6':
return `url(${require('@/assets/building-picture-hza/icon2.png')})` return `url(${require('@/assets/building-picture-hza/icon2.png')})`
case '7': // case '7':
return `url(${require('@/assets/building-picture-hza/icon1.png')})` // return `url(${require('@/assets/building-picture-hza/icon1.png')})`
case '8': // case '8':
return `url(${require('@/assets/building-picture-hza/icon1.png')})` // return `url(${require('@/assets/building-picture-hza/icon1.png')})`
case '9': // case '9':
return `url(${require('@/assets/building-picture-hza/icon1.png')})` // return `url(${require('@/assets/building-picture-hza/icon1.png')})`
case '10': // case '10':
return `url(${require('@/assets/building-picture-hza/icon1.png')})` // return `url(${require('@/assets/building-picture-hza/icon1.png')})`
case '11': // case '11':
return `url(${require('@/assets/building-picture-hza/icon1.png')})` // return `url(${require('@/assets/building-picture-hza/icon1.png')})`
case '12': // case '12':
return `url(${require('@/assets/building-picture-hza/icon1.png')})` // return `url(${require('@/assets/building-picture-hza/icon1.png')})`
} }
}, },
turn(path) { turn(path) {
@ -284,7 +266,7 @@ export default {
width: 100%; width: 100%;
height: 100%; height: 100%;
// background-image: url(@/assets/building-picture-hza/bg@2x.png); // background-image: url(@/assets/building-picture-hza/bg@2x.png);
// background-image: url(../../assets/building-picture-hza/icon1.png); // background-image: url(@/assets/building-picture-hza/icon1.png);
// background-size: 100% 100%; // background-size: 100% 100%;
cursor: pointer; cursor: pointer;
@ -298,7 +280,21 @@ export default {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
position: relative;
.delete {
width: 2vw;
height: 4vh;
background-image: url(@/assets/building-picture-hza/icon7.png);
background-size: 100% 100%;
position: absolute;
top: 5vh;
right: 4vw;
&:hover {
border: 1px solid #00f5ff;
}
}
.box_allbox { .box_allbox {
padding-top: 15vh;
width: 65vw; width: 65vw;
height: 65vh; height: 65vh;
// background-color: #fff; // background-color: #fff;
@ -313,18 +309,33 @@ export default {
background-image: url(@/assets/building-picture-hza/bg_nor@2x.png); background-image: url(@/assets/building-picture-hza/bg_nor@2x.png);
background-size: 100% 100%; background-size: 100% 100%;
display: flex; display: flex;
position: relative;
margin-bottom: 5vh;
.box_item_icon { .box_item_icon {
width: 4vw; width: 4vw;
height: 9vh; height: 8vh;
margin-left: 2.5vw; margin-left: 2.5vw;
margin-top: 2.5vh; margin-top: 2vh;
background-size: 100% 100%; background-size: 100% 100%;
// background-color: pink; // background-color: pink;
z-index: 3;
// background-color: pink;
}
.box_item_bgc {
width: 5vw;
height: 5vh;
background-image: url(@/assets/utils-hza/07.png);
background-size: 100% 100%;
position: absolute;
left: 2vw;
top: 7.5vh;
} }
.box_item_title { .box_item_title {
width: 8vw;
margin-left: 2vw; margin-left: 2vw;
margin-top: 6vh; margin-top: 5vh;
font-weight: 800; font-weight: 800;
font-size: 1.6rem;
color: #fff; color: #fff;
} }
} }

18
src/views/developUtils/index.vue
Unescape View File

@ -28,6 +28,7 @@
<!-- --> <!-- -->
<div class="box_background"> <div class="box_background">
<div class="box_body"> <div class="box_body">
<div class="delete" @click="deleteto"></div>
<div class="box_allbox"> <div class="box_allbox">
<div class="box_item" v-for="item in roll_list" :key="item.id"> <div class="box_item" v-for="item in roll_list" :key="item.id">
<div <div
@ -89,6 +90,10 @@ export default {
this.back_change() this.back_change()
}, },
methods: { methods: {
// 返回上一级路由
deleteto() {
this.$router.go(-1)
},
timeStart() { timeStart() {
this.timer = setInterval(() => { this.timer = setInterval(() => {
this.timeArr = dateFormat(new Date()) this.timeArr = dateFormat(new Date())
@ -275,6 +280,19 @@ export default {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
position: absolute;
.delete {
width: 2vw;
height: 4vh;
background-image: url(../../assets/building-picture-hza/icon7.png);
background-size: 100% 100%;
position: absolute;
top: 5vh;
right: 4vw;
&:hover {
border: 1px solid #00f5ff;
}
}
.box_allbox { .box_allbox {
padding-top: 15vh; padding-top: 15vh;
width: 65vw; width: 65vw;

Write Preview
Loading…
Cancel
Save