This commit is contained in:
2023-05-22 19:02:04 +08:00
parent f0213d7d5e
commit 392f28cfff
3 changed files with 104 additions and 628 deletions

View File

@@ -0,0 +1,99 @@
<template>
<div class="login-container">
<div class="login-wraper">
<div class="login-logo-wraper">
<div class="login-logo"></div>
<div class="login-logo-txts">
<p class="login-logo-txt1">诺力智能搬运车系统</p>
<p class="login-logo-txt2">NoBleLift intelligent truck system</p>
</div>
</div>
<div class="login-content">
<div class="login-content_wraper">
<div class="dl">登录</div>
<div class="login-items-wraper">
<div class="login-item">
<input type="text" class="login-input">
</div>
<div class="login-item">
<input type="password" class="login-input">
</div>
</div>
<div class="login-buttons-wraper">
<button class="button button--primary button-login">登录</button>
</div>
<div class="login-forget-wraper">
<router-link to="/home">忘记密码</router-link>
</div>
</div>
</div>
</div>
</div>
</template>
<style lang="stylus" scoped>
@import '~@style/mixin'
.login-container
_wh(100%, 100%)
background-color #64b4dc
background-image linear-gradient(to right bottom,#4489e0, #55a1df, #64b4dc)
_fj(center)
.login-wraper
_fj()
_wh(80vw, 65vh)
padding 20px
background-color #fff
border-radius 20px
.login-logo-wraper
width 50%
padding 20px
_fj(center,,column)
.login-logo
width 100px
height 112px
background center / 100% 100% url(../../../images/aio/car1.png) no-repeat
.login-logo-txts
// margin-top 20px
text-align center
.login-logo-txt1
_font(24px, 34px, $red2,bold,center)
.login-logo-txt2
_font(20px, 34px, #464646,,center)
.login-content
width 50%
padding 20px
.login-content_wraper
width 100%
max-width 200px
margin 0 auto
_fj(center,,column)
.dl
width 100%
_font(16px, 28px, #333, bold, center)
margin-bottom 10px
.login-items-wraper
width 100%
.login-item
width 100%
+.login-item
margin-top 20px
.login-input
width 100%
height 40px
border 1px solid $gray2
padding 5px 12px
_font(14px, 16px, #323232,,)
border-radius 6px
.login-forget-wraper
width 100%
margin-top 15px
text-align right
a
_font(14px, 20px, $red1,,)
.login-buttons-wraper
width 100%
margin-top 20px
.button-login
width 100%
border-radius 12px
</style>

View File

@@ -2,6 +2,7 @@ import Vue from 'vue'
import Router from 'vue-router' import Router from 'vue-router'
const Preload = r => require.ensure([], () => r(require('@page/Preload')), 'Preload') const Preload = r => require.ensure([], () => r(require('@page/Preload')), 'Preload')
const Login = r => require.ensure([], () => r(require('@page/modules/login/login.vue')), 'login')
const Setup = r => require.ensure([], () => r(require('@page/Setup')), 'Setup') const Setup = r => require.ensure([], () => r(require('@page/Setup')), 'Setup')
const IndexComponent = r => require.ensure([], () => r(require('@page/shells/index/index.vue')), 'shells') const IndexComponent = r => require.ensure([], () => r(require('@page/shells/index/index.vue')), 'shells')
@@ -62,6 +63,10 @@ export default new Router({
path: '/preload', path: '/preload',
component: Preload component: Preload
}, },
{
path: '/login',
component: Login
},
{ {
path: '/setup', path: '/setup',
component: Setup component: Setup

View File

@@ -1,628 +0,0 @@
@import 'mixin.styl'
@import 'iconfont.styl'
@font-face
font-family 'iconfont';
src url('iconfont/iconfont.eot');
src url('iconfont/iconfont.eot?#iefix') format('embedded-opentype'),
url('iconfont/iconfont.woff2') format('woff2'),
url('iconfont/iconfont.woff') format('woff'),
url('iconfont/iconfont.ttf') format('truetype'),
url('iconfont/iconfont.svg#iconfont') format('svg');
[class*=" el-icon-"], [class^=el-icon-]
color #c0c4cc
line-height .3rem
.el-date-editor.el-input
width calc(100% - .8rem)
.el-input
font-size .13rem
.el-date-editor--daterange.el-input__inner
width calc(100% - 0.8rem)
padding .03rem .1rem
vertical-align top
.el-input__inner
height .3rem
line-height .3rem
.el-date-range-picker__header div
color #606266
.el-date-table td span
color #606266
.el-date-editor .el-range__icon,.el-date-editor .el-range-separator
font-size .14rem
line-height .22rem
.el-date-editor .el-range__close-icon
line-height .22rem
font-size .14rem
.el-date-range-picker
width 5.5rem
.el-date-table td span
width .2rem
height .2rem
line-height .2rem
font-size .14rem
.el-date-table td div
height .24rem
.el-date-table td
padding 0
height .28rem
.el-date-range-picker__content
padding .06rem
.el-date-picker__header-label
font-size .16rem
line-height .22rem
.el-date-editor .el-range-input
font-size .14rem
line-height .22rem
.el-date-range-picker__content .el-date-range-picker__header div
margin-left: .5rem
margin-right: .5rem
.el-date-range-picker__header div
font-size .16rem
.iconfont
font-family "iconfont" !important
font-size .16rem
font-style normal
-webkit-font-smoothing antialiased
-moz-osx-font-smoothing grayscale
[class*="_icon"]
background none
.button--primary
min-width .6rem
height .3rem
line-height .3rem
font-size .15rem
color #ffffff
background-color #D7592F
padding 0 .1rem
border-radius 5px
.button--defalut
color #606266
border 1px solid #dcdfe6
background-color #fff
.button--cancle
color #D7592F
background-color #fff
.top_header
position fixed
top 0
width 100%
border-bottom 1px solid #E1E1E1
z-index 1000
header
position relative
height .4rem
line-height .4rem
background-color #D7592F
padding 0 .15rem
box-sizing border-box
.header-title
width 3rem
font-size .16rem
padding-left .1rem
overflow hidden
.header-title_ex
padding-left 0
.header-name
width auto
.top-left
text-align center
position relative
ul
width 1.8rem
position absolute
background #d7592f
left 0
top .45rem
border-radius 2px
box-shadow 1px 2px 3px rgba(228,243,244,0.5)
overflow hidden
li
line-height .36rem
font-size .15rem
border-bottom 1px solid #e1e1e1
&:nth-of-type(2)
border none
text-align center
.home-items
display flex
align-items center
padding 0 5%
height 100%
li
float left
text-align center
width 33.333333%
img
width 80%
height 80%
p
line-height .34rem
color #464646
.drift
transition height .3s linear
.date-box
width 2.3rem
text-align left
overflow hidden
.date-box_time
position absolute
width 2.3rem
height .44rem
overflow hidden
right 0
.tabs
width 100%
font-size .18rem
line-height .4rem
height .4rem
background-color #f5f5f5
li
float left
width 1rem
line-height .4rem
text-align center
a
display inline-block
line-height .4rem
color #323232
width 100%
.router-link-active
border-bottom 1px solid #D7592F
.inner-wrap
height 100%
background-color #F5F5F5
.wrap
width 8rem
padding .9rem .05rem .05rem .05rem
.wrap_ex
padding-top .44rem
.wrap-filter-button
width 100%
padding .1rem .2rem
margin .1rem auto
border-radius .1rem
background-color #fff
.wrap-filter
padding-bottom .1rem
.filter_item
width 50%
padding 0 .2rem
margin .1rem 0 0 0
.filter_input
width 100%
display flex
justify-content space-between
.filter-label
color #464646
width .6rem
line-height .3rem
height .3rem
text-align justify
text-align-last justify
&::after
position absolute
top .3rem
left 0
display inline-block
content ''
overflow hidden
width .5rem
height 0
.wrap-button
margin .1rem auto
padding 0 .2rem
text-align right
.filter-table
width 100%
margin .2rem 0
border-collapse separate
border-spacing 0
border: 1px#e1e1e1
text-align center
th,td
color #464646
background-color #fff
border-right 1px solid #e1e1e1
border-bottom 1px solid #e1e1e1
&::first-child
border-left 1px solid #e1e1e1
.filter-table th
font-size .13rem
line-height .3rem
padding 0 .01rem
background-color #e1e1e1
.filter-table td
height 0.3rem
line-height .18rem
font-size .12rem
padding .01rem
.filter-table tr:first-child th:first-child
border-top-left-radius .1rem
.filter-table tr:first-child th:last-child
border-top-right-radius .1rem
.filter-table tr:last-child td:first-child
border-bottom-left-radius .1rem
.filter-table tr:last-child td:last-child
border-bottom-right-radius .1rem
.radio__icon
display inline-block
vertical-align middle
width .2rem
line-height .2rem
height .2rem
.radio__icon--square
border-radius 3px
border 1px solid #e5e5e5
background-color #e5e5e5
.radio__icon--round
border 1px solid #e5e5e5
background-color transparent
border-radius 100%
.radio__icon--disabled
border 1px solid #c0c4cc
background-color #c0c4cc
.icon
color #c0c4cc
&::before
content '\e608'
.radio__icon--checked
border-color #D7592F
background-color #D7592F
.icon
color #fff
&::before
content '\e608'
.input
display inline-block
// width calc(100% - .8rem)
width 100%
height .3rem
line-height .3rem
font-size .13rem
color #606266
text-indent .05rem
background-color #fff
border 1px solid #D1D1D1
border-radius 4px
.select
position relative
display inline-block
width calc(100% - .8rem)
height .3rem
font-size .13rem
color #606266
line-height .3rem
background-color #fff
border 1px solid #D1D1D1
border-radius 4px
vertical-align top
option
line-height .3rem
.select-wrap
position relative
display inline-block
width calc(100% - .8rem)
vertical-align top
.input
width 100%
.select-option
position absolute
max-height 3.32rem
overflow-y auto
top calc(.3rem + 8px)
left 0
width 100%
z-index 100
background-color #ffffff
border 1px solid #d1d1d1
border-radius 4px
box-shadow 0 2px 12px 0 rgba(0,0,0,.1)
li
width 100%
line-height .3rem
height .3rem
overflow hidden
font-size .13rem
color #606266
padding 0 .05rem
user-select none
&:hover
background #f5f5f5
.fontRed
color #D7592F
.dropdown_icon_2
position: absolute
top .08rem
right 0.15rem
color #bbb
width .14rem
font-size .14rem
line-height .14rem
transition transform .3s
.message-box__wrapper
position fixed
top 0
bottom 0
left 0
right 0
z-index 2000
text-align center
background rgba(0,0,0,.5)
.message-box__wrapper::after
content ""
display inline-block
height 100%
width 0
vertical-align middle
z-index 100
.message-box
display inline-block
width 4.9rem
padding-bottom 10px
vertical-align middle
background-color #fff
border-radius 4px
border 1px solid #ebeef5
font-size 18px
box-shadow 0 2px 12px 0 rgba(0,0,0,.1)
text-align left
overflow hidden
backface-visibility hidden
.message-box__content
position relative
padding 10px 15px
color #606266
font-size 14px
.message-box__btns
padding 5px 15px 0
text-align right
.message-box__message p
color #303133
line-height .3rem
border-bottom 1px solid #e1e1e1
.message-box__input
padding-top 15px
color #606266
.message-box__input .input-cus
border 1px solid #dcdfe6
padding-right .2rem
.keyValue
position relative
.close_icon
position absolute
right .05rem
top .075rem
color #C0C4CC
font-size .14rem
&::before
content '\e659'
.input-cus-wrap
position relative
display inline-block
.close_icon
top .1rem
.dropdown_icon
position relative
display inline-block
left .07rem
font-size .18rem
color #ffffff
.login_icon
position absolute
top .12rem
right .1rem
color #BBBBBB
.back_icon
font-size .20rem
line-height .44rem
.delete_icon_2
position absolute
top .07rem
right .1rem
color #BBBBBB
.modal_item
width 3.5rem
margin 0 auto
.textarea
display inline-block
width calc(100% - 0.8rem)
line-height 0.3rem
border 1px solid #d1d1d1
border-radius 4px
vertical-align top
padding 0 .05rem
.input_disabled
background-color #e1e1e1
.select_icon
width .2rem
height .2rem
line-height .2rem
text-align center
border-radius 100%
overflow hidden
.selected_icon
background-color #d7592f
color #fff
.unselect_icon
background-color #c0c4cc
color #c0c4cc
/** **/
.btn
min-width .6rem
height .4rem
// line-height .3rem
font-size .15rem
color #ffffff
background-color #D7592F
padding 0 .1rem
border-radius 5px
.btn-disabled
background-color: $gray
/** **/
.submit-bar
display flex
justify-content space-between
align-items center
position fixed
bottom 0
width 100%
background-color #fff
box-shadow 0 0 20px 0 rgba(160,160,160,0.9)
.submit-bt
flex 1
line-height .4rem
margin .15rem 0.3rem
.wrap2
width 100%
padding 0.05rem 0.05rem 0.05rem 0.05rem
// no
.fxrow
display: flex
justify-content: space-between
align-items: center
.fxcol
flex: 1
overflow hidden
// no
.fxc
display: inline-block;
width: calc(100% - 0.8rem);
height: 0.3rem;
line-height: 0.3rem;
font-size: 0.13rem;
color: #606266;
text-indent: 0.05rem;
background-color: #fff;
border: 1px solid #d1d1d1;
border-radius: 4px;
[class^="icon-"]
display: inline-block
height: inherit
.search-input
margin-right: .15rem
_font(.28rem,.53rem,#929292)
background: #ffffff
&:disabled
cursor: not-allowed
.iliblock
flex 1
margin-left .2rem
position relative
.filter-scan
display: block
_ct()
right .15rem
_wh(.22rem,.22rem)
.icon-scan
flex 0 0 .22rem
_bis('../images/saoma.png',.22rem)
.filter-scan-input
padding-right .5rem
border-bottom 1px solid #d7d7d7
.loading-tips
_font(.12rem,.23rem,#929292,,center)
margin-bottom .12rem
.pagination-wrapper
display flex
justify-content flex-end
align-items center
.pagination-wrapper .total
color: #464646
margin-right 0.5rem
.van-pagination__item
color #464646
.van-pagination__item--active
background-color #d7592f
color #fff
.van-pagination__next, .van-pagination__prev
padding: 0 20px
// +
.msg_wrapper
position fixed
top 0
bottom 0
left 0
right 0
text-align center
z-index 100
&::after
content ""
display inline-block
height 100%
width 0
vertical-align middle
.msg_box
display inline-block
width 420px
padding 25px
vertical-align middle
background-color #fff
border-radius 4px
border 1px solid #ebeef5
font-size 18px
box-shadow 0 2px 12px 0 rgb(0 0 0 / 10%)
text-align left
overflow hidden
backface-visibility hidden
.mask
position fixed
top 0
left 0
width 100%
height 100%
opacity .2
background #000
z-index 99
.msg_item
height 50px
line-height 50px
.label_item
display inline-block
width 90px
font-size 16px
line-height inherit
.from_item
display inline-block
width calc(100% - 100px)
line-height inherit
.from_item .el-select
width 100%
.from_item .el-input
font-size 14px
.from_item .el-input__inner
height 50px
line-height inherit
.el-select-dropdown__item span
font-size 14px !important
.el-select .el-input .el-select__caret
line-height 50px
.msg_btns
height 35px
line-height 35px
width 300px
margin 25px auto 0
_fj()
.msg_btn
width 80px
height 35px
line-height 35px
font-size 14px
color #fff
background-color #d7592f
border-radius 5px
text-align center
::-webkit-scrollbar
width 4px
::-webkit-scrollbar-track
background-color #fff
::-webkit-scrollbar-track-piece
background-color #e5e5e5
::-webkit-scrollbar-thumb
display block
width 4px
height 10px
margin 0 auto
cursor pointer
border-radius 2px
background-color #e1e1e1