*{margin: 0; padding: 0; box-sizing: border-box; -webkit-overflow-scrolling:touch;} $bgclor:#00a0ea; $top:0.86rem; $borcolor:#e8e8e8; $huicolor:#4c4c4c; ul li {list-style-type: none;} a {text-decoration: none;} img {max-width: 100%;display: block;} h1, h2, h3, h4, h5, h6 {font-weight: 400;} html,body,#app,.view{width: 100%; height: 100%; overflow: hidden; background: #fff;} .flex { display: flex !important; display: -webkit-flex !important; &.a-center { align-items: center; } &.a-end{ align-items: flex-end; } &.j-center { justify-content: center; } &.j-end{ justify-content: flex-end; } &.jlr { justify-content: space-between; } &.col { flex-direction: column; } &.wrap { flex-wrap: wrap; } .fx1{flex: 1;} } .header{ background: $bgclor; color: #fff; width: 100%; height: 0.86rem; position:fixed; left: 0; top: 0; z-index: 2; font-size: 0.32rem; .icon-back{font-size: 0.3rem; color: #fff; position:absolute; left: 5%; top: 50%; transform: translateY(-50%);} .toobla{ position: absolute; right: 5%; top: 50%; transform: translateY(-50%); .icon1{width: 0.5rem; height: 0.5rem; background: url(../img/images/too_01.png) no-repeat; background-size: 100% 100%;} .icon2{width: 0.5rem; margin-left: 0.3rem; height: 0.5rem; background: url(../img/images/too_02.png) no-repeat; background-size: 100% 100%;} .icon3{width: 0.5rem; height: 0.5rem; background: url(../img/images/riliIcon.png) no-repeat center center; background-size: 0.32rem 0.32rem;} .icon4{width: 0.42rem; height: 0.42rem; background: url(../img/images/ewmSour.png) no-repeat; background-size: 100% 100%;} } } .shopHomebar{ width: 100%; height: 1.4rem; background: $bgclor; .item{ flex: 1; color: #fff; font-size: 0.28rem; .icon{background: url(../img/shopIcon.png) no-repeat; background-size: 1.5rem auto;} b{ display:block; width: 0.5rem; height: 0.5rem; margin-bottom: 0.12rem; &.i1{background-position: 0 0;} &.i2{background-position: -0.5rem 0;} &.i3{background-position: -1rem 0;} } } } .banner{ width: 100%; overflow: hidden; padding: 0px 0.15rem; height: 2.88rem; background: url(../img/shopBanner.png) no-repeat; background-size: 100% auto; .my-swipe,img{width: 100%; height: 100%;} .van-swipe-item{border-radius: 5px; overflow: hidden; box-shadow: 0px 1px 3px rgba(0,0,0,0.1);} } .homeTipbox{ width: 100%; height: 0.65rem; padding: 0px 0.15rem; margin: 0.2rem 0px; .laba{width: 0.45rem; height: 0.31rem; margin: 0.3rem 0px; background: url(../img/laba.png) no-repeat; background-size: 100% 100%;} .labaInfos{flex: 1; padding-left: 0.3rem; font-size: 0.26rem; color:$bgclor;} } .menu{ width: 100%; background: #fff; margin-bottom: 0.3rem; .item{ width: 25%; margin-bottom: 0.2rem; b{ width: 0.8rem; height: 0.8rem; &.i1{background: url(../img/images/menu_01.png) no-repeat; background-size: 100% 100%;} &.i2{background: url(../img/images/menu_02.png) no-repeat; background-size: 100% 100%;} &.i3{background: url(../img/images/menu_03.png) no-repeat; background-size: 100% 100%;} &.i4{background: url(../img/images/menu_04.png) no-repeat; background-size: 100% 100%;} &.icon{ background: url(../img/images/iconMenu.png) no-repeat; background-size: 6.4rem 0.8rem; &.c1{background-position:0px 0px;} &.c2{background-position:-0.8rem 0px;} &.c3{background-position:-1.6rem 0px;} &.c4{background-position:-2.4rem 0px;} &.c5{background-position:-3.2rem 0px;} &.c6{background-position:-4.0rem 0px;} &.c7{background-position:-4.8rem 0px;} &.c8{background-position:-5.6rem 0px;} } } p{font-size: 0.3rem; color: #000; margin-top:0.2rem;} } } .router{overflow: auto;} .workField{ width: 100%; height: 0.8rem; padding: 0px 0.15rem; font-size: 0.3rem; color: #000; box-shadow: 0px 2px 3px rgba(0,0,0,0.1); .sup{width: 0.5rem; margin-right: 0.2rem; height: 0.5rem; background: url(../img/sup.png) no-repeat; background-size: 100% 100%;} .case{width: 0.5rem; margin-right: 0.2rem; height: 0.5rem; } } .workFieldContainer{ padding: 0.2rem 0.28rem; .item{width: 3.42rem; height: 1.71rem; margin-bottom: 0.2rem; img{width: 100%; height:100%;}} } .anzhuangCase{ padding: 0.2rem 0.28rem; .item{ width: 3.42rem; height: 3.28rem; border-radius:5px; overflow: hidden; box-shadow: 0px 1px 2px rgba(0,0,0,0.1); img{width: 100%; height: 2.12rem;} .anzhuangCaseInfos{ flex: 1; padding: 0.1rem 0.2rem; font-size: 0.2rem; color: #333; .left{ flex: 1; h4{margin-bottom: 0.1rem; font-size: 0.24rem;} .touxiang{width: 0.45rem; margin-right: 0.12rem; height: 0.45rem; border-radius: 50%; overflow: hidden; background: $bgclor;} } .dianzan{width: 0.41rem; height: 0.39rem; background: url(../img/images/zan.png) no-repeat; background-size: 100% 100%;} } } } .pipei{ width: 2.8rem; font-size: 0.2rem; position: fixed; right: 0; bottom: 15%; height: 0.6rem; border-radius: 0.3rem 0 0 0.3rem; background: $bgclor; color: #fff; b{width: 0.5rem; height: 0.5rem; background: url(../img/car.png) no-repeat; background-size: 100% 100%; margin-right: 0.2rem;} i{font-size: 0.28rem; color: #fff !important;} } .pageView{ padding-top: 0.86rem; height: 100%; overflow: auto; &.bdjl{ background: $bgclor; padding-top: 1.96rem; padding-left: 0.36rem; padding-right: 0.36rem; .search{ width:100%; background: $bgclor; height: 1.1rem; padding-left: 0.36rem; padding-right: 0.36rem; position: absolute; left: 0; top: 0.86rem; .searchbox{ width: 100%; height: 0.84rem; background: #fff; border-radius: 0.2rem; input{width: 100%; font-size: 0.3rem; display: block; color: #999; height: 100%; position: relative; padding-left: 15%; padding-right: 5%; background: none; border: 0; outline: none;} svg{position: absolute; left: 10%; top: 50%; transform: translateY(-50%);} } } .zhuceTimer{ width:100%; margin-bottom:0.2rem; background: #fff; border-radius: 0.2rem; padding:0.25rem 0.3rem; color: $bgclor; font-size: 0.26rem; h4{ font-size: 0.3rem;} } .jiluItems{ background: #fff; border-radius: 0.2rem; padding: 0.3rem; margin-bottom:0.2rem; color: $bgclor; font-size: 0.26rem; .title{ width: 100%; b{display:block; width: 0.5rem; margin-right: 0.2rem; height: 0.5rem; background: url(../img/dunpai.png) no-repeat; background-size: 100% 100%;} } .content{ padding-top: 0.15rem;} .content .item{ width: 45%; padding-top: 0.12rem; &:nth-child(odd){ width: 55%; } } .shangwuLipei{ font-size: 0.24rem; color: #00ff0c;} } } } .wodelibao{ padding-top: 1.46rem; .tab{ width: 100%; height: 0.6rem; font-size: .28rem; color: $bgclor; background: #fff; position: absolute; z-index: 2; left: 0; top: $top; .item{ width: 36%; height: 100%; margin: 0px 7%; position: relative; &.on::before{content: ''; height: 1px; background: $bgclor; width: 1.2rem; display: block; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);} } } ul{ width: 100%; padding: 0px 0.16rem; margin: auto; padding-bottom: 0.2rem; background: #f9f9f9; li{ width: 100%; padding: 0.26rem; margin-top: 0.2rem; height: 3rem; padding-bottom: 0.04rem; background: url(../img/libaoItem.png) no-repeat; background-size: 100% 100%; .image{width: 2.4rem; height: 2.44rem; img{width: 100%; height: 100%;}} .info{ flex: 1; padding-left: 0.3rem; h4{font-size: 0.24rem; font-weight: 600; color: #333;} .address{ font-size: 0.24rem; margin-top: 0.3rem; padding-left: 1.1rem; position: relative; &::before{content: '送货地址:'; font-size: 0.24rem; position: absolute; left: 0; top: 0;} } .tag{color: #e0a70f; margin-top: 0.3rem; width: 1rem; height: 0.46rem; font-size: .24rem; background: #f7eab6; border-radius:0.23rem;} } } } } /*出库记录*/ .chukujilu{ width: 100%; height: 100%; overflow: hidden; background: $bgclor; .leiji{font-size: 0.28rem; height: 1.32rem; color: #fff; h4{ font-size: 0.52rem;} } .chukuTimer{ width:100%; margin-bottom:0.2rem; background: #fff; border-radius: 0.12rem; padding:0.25rem 0.3rem; color: $bgclor; font-size: 0.26rem; h4{ font-size: 0.3rem;} } .boxs{ width: 100%; padding: 0.2rem; background: #fff; flex: 1; border-radius: 5px 5px 0px 0px; ul{ width: 100%; height: 100%; overflow: auto; li{ border-bottom: 1px solid $borcolor; padding: 0.2rem 0px; font-size: 0.28rem; color: $huicolor; .title{ padding-bottom: 0.2rem; h3{font-size: 0.28rem;} span{ color: $bgclor;} } } } } } /*订单详情*/ .dingdanxiangqing{ ul{ padding: 0.3rem; li{ width: 100%; margin-top: 0.3rem; position: relative; font-size: 0.28rem; padding: 0px 0.24rem; background: #fff; box-shadow: 0px 2px 4px rgba(0,0,0,0.1); height: 2.69rem; border-radius: 5px; .title{width: 100%; height: 0.99rem; border-bottom: 1px solid #f1f1f2;} .center{ width: 100%; height: 0.81rem; border-bottom: 1px solid #f1f1f2; font-size: .24rem; p{margin-right: 0.5rem;} } .bottom{flex: 1;} .chuxiao{width: 1.38rem; height: .47rem; background: url(../img/cuxiao.png) no-repeat; background-size: 100% 100%; position: absolute; right: -0.1rem; top: 4%;} } } } /*库存详情*/ .kucunxiangqing{ background: $bgclor; width: 100%; height: 100%; overflow: hidden; .boxs{ background: #fff; border-radius: 5px 5px 0px 0px; flex: 1; margin-top: 0.3rem; position: relative; padding-top: 1rem; .title{ width: 100%; height: 1rem; border-bottom: 1px solid $borcolor; position: absolute; left: 0; top: 0; .item{width: 40%; font-size: 0.28rem; color: $huicolor;} } ul{ width: 100%; height: 100%; overflow: auto; li{ height: 1.24rem; border-bottom: 1px solid $borcolor; .item{width: 40%; font-size: 0.28rem; color: $huicolor;} } } } .leiji{font-size: 0.28rem; height: 1.32rem; color: #fff; h4{ font-size: 0.52rem;} } .typeFooter{ width: 100%; height: 0.6rem; font-size: 0.28rem; color: #fff; .item{flex: 1;} span{width: 2px; height: 0.28rem; background: #fff;} } .kucunList{ flex: 1; background: #fff; border-radius: 5px 5px 0px 0px; padding-top: 1rem; position: relative; .title{ width: 100%; height: 1rem; border-bottom: 1px solid $borcolor; position: absolute; left: 0; top: 0; .item{ font-size: 0.28rem; color: $huicolor; flex: 1;} } .srcollBox{ width: 100%; height: 100%; overflow: auto; .item{ width: 100%; height: 1.45rem; border-bottom: 1px solid $borcolor; font-size: 0.28rem; color: $huicolor; .fx1{ flex: 1; text-align: center; u{color: $bgclor;} } } } } } /**/ .jingxiaoshangliebiao{ background: $bgclor; width: 100%; height: 100%; overflow: hidden; .listbox{ padding: 0.3rem 0.36rem; flex: 1; font-size: 0.2rem; color: #7d7d7d; ul{ width: 100%; height: 100%; overflow: auto; li{ width: 100%; background: #fff; padding: 0.2rem; border-radius: 5px; margin-bottom: 0.1rem; .van-radio__icon--round .van-icon{border-radius: 5px !important;} h4{ color: $bgclor; font-size: 0.3rem;} .van-radio__icon .van-icon{border: 1px solid #0093dc;} } } } .lipeichaxunList{ padding: 0.3rem 0.36rem; flex: 1; .searchTimer{ width: 100%; padding: 0px 0.3rem; height: 0.84rem; background: #fff; border-radius: 5px; font-size: 0.28rem; color: $bgclor; h4{ font-size: 0.3rem;} } ul{ flex: 1; padding-top: 0.2rem; overflow: auto; li{ background: #fff; height: 1.44rem; border-radius: 0.2rem; padding: 0.2rem; margin-bottom: 0.1rem; .images{width: 1.1rem; height: 1.1rem; img{width: 100%; height: 100%;}} .info{ flex: 1; padding: 0px 0.2rem; font-size: 0.22rem; color: $bgclor; .item{width:50%; padding-top: 0.1rem;} } .icon-right{ color: #0093DC;} } } } } .peifuxiangqing{ background: $bgclor; width: 100%; padding-left:0.36rem; padding-right:0.36rem; .card{ width: 100%; background: #f2fafd; border-radius: 0.2rem; } .userInfos{ padding: 0.2rem 0px; .title{width: 4.7rem; overflow: hidden; margin:auto; height: .26rem; background: url(../img/userTitle.png) no-repeat; background-size:100% 100%;} .Forms{ width: 100%; padding: 0px 0.43rem; .item{ width: 100%; height: 0.96rem; padding-top: 0.3rem; border-bottom: 1px solid $bgclor; .label{ font-size: 0.24rem; color: $bgclor; width: 1.4rem; .icon{ width: 0.34rem; height: 0.34rem; background: url(../img/iconTl.png) no-repeat; background-size:1.36rem auto; &.i1{background-position:0 0;} &.i2{background-position:-0.34rem 0;} &.i3{background-position:-0.68rem 0;} &.i4{background-position:-1.02rem 0;} } } .value{ flex: 1; font-size: 0.24rem; input{border: 0; width: 100%; outline: none; background: none;} } } } } .phone{ margin-top: 0.2rem; padding: 0.2rem 0px; margin-bottom: 1.5rem; .title{width: 5.04rem; margin: auto; height: .26rem; background: url(../img/phoneTitle.png) no-repeat; background-size: 100% 100%;} .fileImage{width: 4.68rem; height: 2.66rem; margin: 0.3rem auto; img{width: 100%; height: 100%;} } } .nextFoot{ width: 6.76rem; font-size: 0.32rem; overflow: hidden; height: 0.86rem; border-radius: 0.43rem; background: #f2f8fc; position: fixed; left: 50%; transform: translateX(-50%); bottom: 2%; .nextBtns{width: 50%; height: 100%; background: #5e6468; color: #fff;} .nextBtns2{width: 50%; height: 100%; background: #bbbbbb; color: #fff;} .nextBtns1{width: 50%; color: $bgclor;} } } .court{ padding: 0.2rem 0px; .fileImage{width: 4.68rem; height: 2.66rem; margin: 0.3rem auto; img{width: 100%; height: 100%;} } .title{width: 5.04rem; font-size: .24rem; color: $bgclor; text-align: center; margin: auto; height: .26rem; background: url(../img/titlebg.png) no-repeat; background-size: 100% 100%;} .Forms{ width: 100%; padding: 0px 0.43rem; .item{ width: 100%; height: 0.96rem; padding-top: 0.3rem; border-bottom: 1px solid $bgclor; .label{ font-size: 0.24rem; color: $bgclor; width: 1.4rem; .icon{ width: 0.34rem; height: 0.34rem; background: url(../img/iconTl.png) no-repeat; background-size:1.36rem auto; &.i1{background-position:0 0;} &.i2{background-position:-0.34rem 0;} &.i3{background-position:-0.68rem 0;} &.i4{background-position:-1.02rem 0;} } } .value{ flex: 1; font-size: 0.24rem; input{border: 0; width: 100%; outline: none; background: none;} } } } } .meberHeader{ width: 100%; padding-right: 0.21rem; height: 3.15rem; background: linear-gradient(45deg,#005fa3,#00a0ea); .userTouxiang{ width: 2rem; font-size: 0.16rem; color: #fff; .image{width: .98rem; height: .98rem; border-radius: 50%; background: #fff; img{width: 100%; height: 100%;}} p{ padding-top: 0.2rem;} } .shopInfo{ flex: 1; color: #fff; .edit{width: .41rem; margin-left: 0.2rem; height: .34rem; background: url(../img/images/edit.png) no-repeat; background-size: 100% 100%;} h2{ font-size: 0.38rem; font-weight: 600; margin-top: 0.2rem;} .tag{background: #4d98c9; margin-top: 0.2rem; text-align: center; font-size: 0.18rem; padding: 2px 5px; border-radius: 15px;} } .ewm{ width: 1.18rem; b{display: block; width: .64rem; align-self: flex-end; height: .64rem; background: url(../img/images/ewm.png) no-repeat; background-size: 100% 100%;} .sysIcon{width: .64rem; height: .64rem; align-self: flex-end; background:url(../img/images/sysIcons.png) no-repeat; background-size: 100% 100%;} } .meberHeaderBottom{ width: 100%; padding-top: 0.4rem; .item{flex: 1; color: #fff; font-size: 0.22rem;} span{display: block; width: 1px; height: 0.22rem; background: #fff;} } } .fanliBar{ width: 7.1rem; font-size: 0.2rem; box-shadow: 0px 1px 3px rgba(0,0,0,0.1); color: #333; padding-right:0.3rem; height: 0.8rem; margin: auto; margin-top: -0.4rem; border-radius: 0.25rem; background: #fff; .item{ flex: 1; padding-left: 0.3rem; h4{ font-size: 0.5rem; color: $bgclor; padding-left: 0.2rem;} em{ font-size: 0.16rem; color: #333333; font-style: normal; padding-bottom: 0.05rem; padding-left: 0.2rem;} } .fgx{width: 1px; height: 0.4rem; background: $bgclor;} } .meberMenu{ width: 100%; height: 2.2rem; .item{ flex: 1; b{ display: block; width: 0.78rem; height: 0.78rem; &.i1{background: url(../img/images/images/meberIcon_01.png) no-repeat; background-size: 100% 100%;} &.i2{background: url(../img/images/images/meberIcon_02.png) no-repeat; background-size: 100% 100%;} &.i3{background: url(../img/images/images/meberIcon_03.png) no-repeat; background-size: 100% 100%;} &.i4{background: url(../img/images/images/meberIcon_04.png) no-repeat; background-size: 100% 100%;} } h4{ font-size: 0.28rem; color: #000; padding-top: 0.2rem;} } } .meberMenu01{ width: 100%; padding: 0.2rem; .item{ width: 33.33%; b{ display: block; width: 0.8rem; height: 0.8rem; margin-top: 0.3rem; &.i1{background: url(../img/images/images/jingxiaoshangIcons_01.png) no-repeat; background-size: 100% 100%;} &.i2{background: url(../img/images/images/jingxiaoshangIcons_02.png) no-repeat; background-size: 100% 100%;} &.i3{background: url(../img/images/images/jingxiaoshangIcons_03.png) no-repeat; background-size: 100% 100%;} &.i4{background: url(../img/images/images/jingxiaoshangIcons_04.png) no-repeat; background-size: 100% 100%;} &.i5{background: url(../img/images/images/jingxiaoshangIcons_05.png) no-repeat; background-size: 100% 100%;} &.i6{background: url(../img/images/images/jingxiaoshangIcons_06.png) no-repeat; background-size: 100% 100%;} } h4{ font-size: 0.28rem; color: #000; padding-top: 0.2rem;} } } .meberList{ .item{ width: 100%; height: 1rem; border-bottom: 1px solid #f4f4f4; padding: 0px 0.3rem; font-size: 0.3rem; .rightIcons{color: #999; span{margin-right: 0.2rem;} } } } .login{ width: 100%; padding-top: 1.1rem; height: 100%; background: url(../img/images/loginBg.png) no-repeat; background-size: 100% 100%; .logo{ width: 3.19rem; height: 1rem; background: url(../img/images/loginLogo.png) no-repeat; background-size: 100% 100%; margin: auto; } .loginBox{ width: 6.78rem; color: $bgclor; font-size: 0.24rem; padding: 0.5rem 0.44rem; margin: auto; margin-top: 0.4rem; height: 6.91rem; background: url(../img/images/loginBox.png) no-repeat; background-size: 100% 100%; .labelTitle{ height: 0.5rem; margin-top: 0.3rem; b{ display: block; margin-right: 0.2rem; width: 0.3rem; height: 0.3rem; background: url(../img/images/userIcons.png) no-repeat; background-size: 0.6rem 0.3rem; &.i1{background-position:0 0;} &.i2{background-position:-0.3rem 0;} } } .labelValue{ width: 100%; height: 0.7rem; border-bottom: 1px solid $bgclor; color: $bgclor; margin-top: 0.2rem; position: relative; input{ width: 100%; outline: none; border: 0; background: none; color: $bgclor; &::-webkit-input-placeholder {color: $bgclor;} } .labelToolbel{ position: absolute; right:2%; top: 50%; transform: translateY(-50%); i{margin-right: 0.3rem;} } } } .loginBtns{width: 100%; height: 0.76rem; border-radius: 0.38rem; background: $bgclor; color: #fff; margin-top: 0.3rem;} .goEnter{ font-size: 0.24rem; color: $bgclor; padding-top: 0.3rem; a{ color: $bgclor;} } .checkedXieyi{ padding-top: 0.3rem; .van-checkbox__icon--round .van-icon{border-radius: 5px !important;} .van-checkbox__icon .van-icon{border: 1px solid $bgclor;} .van-checkbox__label{ color: #6dd1ff;} a{ color: $bgclor;} } .loginFix{ width: 100%; font-size: 0.24rem; line-height: 0.6rem; text-align: center; color: #fff; position: fixed; left: 0; bottom: 0; height: 0.6rem; background: url(../img/images/loginFix.png) no-repeat; background-size: 100% 100%; } } .setp{ width: 1.5rem; height: 0.4rem; border: 1px solid #e5e5e5; border-radius: 3px; .left{width: 0.4rem; height: 0.4rem; border-right: 1px solid #e5e5e5; color:#999} .right{width: 0.4rem; height: 0.4rem; border-left: 1px solid #e5e5e5; color:#999} .value{flex: 1; height:0.4rem;} } .gouwuche{ background: #ededed; padding-bottom: 0.4rem; .van-checkbox{ display: flex; .van-checkbox__label{flex: 1;} } .gouwucheBackground{ background: url(../img/shopBanner.png) no-repeat; overflow: auto; background-size: 100% auto; height: 100%; padding-top: 0.3rem; .cardGouwuche{ width: 7.02rem; margin: auto; background: #fff; border-radius: 5px; overflow: hidden; padding: 0px 0.2rem; padding-bottom: 0.7rem; position: relative; .item{ padding: 0.4rem 0px; border-bottom: 1px solid $borcolor; .image{width: 2rem; height: 2rem; border: 1px solid #eee; img{width: 100%; height: 100%;} } .infos{ font-size: 0.2rem; color: #333; flex: 1; padding-left: 0.2rem; height: 2rem; h2{font-size: 0.2rem; max-width: 90%;} } } .cardFooter{ width: 100%; padding: 0px 0.2rem; font-size: 0.24rem; color: #5f5f5f; height: 0.7rem; position: absolute; left: 0; bottom: 0px; z-index: 2; h4{ font-size: 0.3rem;} .gouwuquan{ font-size: 0.3rem; color: $bgclor; i{font-size: 0.2rem; color: #666 !important; margin-left: 0.1rem;} } } } } .caigouBg{ background: url(../img/shopBanner.png) no-repeat; position: relative; overflow: hidden; background-size: 100% auto; height: 100%; padding-top: 0.78rem; .caigouBgPix{ width: 100%; font-size: 0.3rem; color: #fff; padding: 0.1rem 0.2rem 0px 0.2rem; height: 0.78rem; position: absolute; left: 0; top: 0; z-index:2; .item{ flex: 1; i{ font-size: 0.2rem !important; margin-left: 0.1rem;} } .fgx{width: 1px; height: 0.3rem; background: #fff;} } ul{ width: 100%; padding: 0px 0.2rem; height: 100%; overflow: auto; li{ background: #fff; position: relative; padding-bottom: 0.84rem; height: 3rem; background: #fff; border-radius: 0.1rem; overflow: hidden; margin-bottom: 0.2rem; .libox{padding: 0.2rem; padding-bottom: 0px;} .image{width: 1.7rem; height: 1.5rem; background: #fff; img{width: 100%; height: 100%;}} .info{ flex: 1; padding-left: 0.2rem; font-size: 0.25rem; span{color: $bgclor; padding: 0.2rem 0px; display: block;} .kuchun{font-size: 0.18rem; color: #999;} } .timer{ font-size: 0.16rem; color: $bgclor; flex: 1; padding-left: 0.2rem;} .btnFooter{ width: 100%; height:0.84rem; position: absolute; left: 0; bottom: 0; .item{ width: 50%; height: 100%; background: #038dfc; font-size: 0.3rem; color: #fff; &.active{background: #9d9d9d;} } } } } .fixBor{ width: 0.7rem; height: 0.7rem; background: url(../img/images/carBtn.png) no-repeat; background-size: 100% 100%; position: fixed; right: 5%; bottom: 15%; } } .querendingdanFix{width: 7.02rem; border-radius: 0.32rem; position: fixed; left: 50%; transform: translateX(-50%); bottom: 3%; height: 0.64rem; background: $bgclor; font-size: 0.18rem; color: #fff;} } .myCalendar{ font-size: 0.2rem; position: relative; overflow: hidden; .body{ padding-top: 0.8rem; position: relative;} .golbal-left{ width: 13px; height: 13px; border-top: 2px solid gainsboro; border-right: 2px solid gainsboro; transform: rotate(225deg); -webkit-transform: rotate(225deg); position: absolute; left: 16px; top: 15px; } .calendar { width: 100vw; height:76vw; overflow: auto; text-align: center; } .week-title { overflow: hidden; display: flex; background: #fff; position: absolute; width: 100%; height:0.8rem; line-height: 0.8rem; left: 0; top: 0; } .week-title>div { width: 14.28%; height:0.8rem; line-height: 0.8rem; float: left; } .data-title { height: 0.9rem; line-height: 0.9rem; font-size: 0.32rem; clear: both; } .calendar-data { width: 100vw; clear: both; } .day { width: 14.28%; height: 0.7rem; margin-bottom: 0.02rem; line-height: 180%; float: left; display: flex; flex-direction: column; } .day.disabled{ color:#ddd; } .active-start { color: white; background-color: #0096df; } .active-start::after { content: '开始'; margin-top: -0.1rem; font-size: 14px; } .active { color: white; background-color: #0096df; } .active-end { color: white; background-color: #0096df; position: relative; } .active-end::after { content: '结束'; margin-top: -0.1rem; font-size: 14px; } .active-end i{ position: absolute; top:-120%; width:100%; height:100%; background:rgba(0,0,0,1); opacity:0.6; border-radius:8px; display: flex; align-items: center; justify-content: center; font-style: normal; font-size: 15px; color:#fff; } .active-end i::after{ position: absolute; content: ''; float: left; width: 0; height: 0; border-width: 10px; border-style: solid; border-color:#000 transparent transparent transparent; opacity:1; bottom:-20px; left:50%; margin-left:-10px; } .screenbottom{ height:35px; width:100%; display: flex; } .reset{ width:50%; height:40px; line-height: 40px; color:#3E3E3E; text-align: center; background: #fff; } .determine{ width:50%; height:40px; line-height: 40px; background: #48D8BF; color:#fff; text-align: center; } .calendar-body{ overflow: auto;} } .shaomachuku{ width: 100%; height: 100%; background: #000; padding-top: 0.86rem; overflow: auto; padding-bottom: 1.2rem; .head{ width: 100%; height: 0.86rem; background: #000; position: fixed; left: 0; top: 0; font-size: 0.32rem; color: #fff; i{ font-size: 0.3rem; color: #fff; position: absolute; left: 0.2rem; top: 50%; transform: translateY(-50%);} } .QRcode{width: 4.2rem; margin: auto; height: 4.2rem; background: url(../img/images/QEbox.png) no-repeat; background-size: 100% 100%;} .addCount{ font-size: 0.26rem; color: $bgclor; margin: 0.2rem 0px; i{width: 0.44rem; margin-right: 0.2rem; display: block; height: 0.52rem; background: url(../img/images/gangbi.png) no-repeat; background-size: 100% 100%;} } table{ border: 1px solid $bgclor; border-collapse: collapse; width: 80%; margin: auto; border-right: 0; border-bottom: 0px; tr td{ border-right: 1px solid $bgclor; text-align: center; padding: 0.1rem; border-bottom: 1px solid $bgclor; font-size: 0.28rem; color: #fff;} } .QRsend{background: $bgclor; margin: 0.2rem auto; color: #fff; border-radius: 50%; width: 1.44rem; height: 1.44rem; font-size: 0.32rem;} .paisheBtn{width: 5.92rem; color: #fff; position: fixed; left: 50%; transform: translateX(-50%); bottom: 2%; height: 0.74rem; border-radius: 0.37rem; background: $bgclor; font-size: 0.26rem;} } .rukuTongji{ width: 100%; height: 100%; height: auto; .rukuTongjiTitle{ width: 100%; font-size: 0.28rem; color: $bgclor; height: 0.45rem; line-height: 0.45rem; background: url(../img/images/rukuTitle.png) no-repeat; background-size: 100% 100%; } .rukuTongjiHead{ width: 100%; font-size: 0.28rem; color: #4c4c4c; padding: 0.2rem; margin-top: 0.2rem; border-top: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8; .item{flex: 1;} } .rukuTongjiBody{ padding: 0px 0.2rem; font-size: 0.28rem; .item{ padding:0.2rem; border-bottom: 1px solid #e8e8e8; text-align: center; .fx1{flex: 1;} } } } .rukuTongjiFoot{width: 6rem; font-size: 0.36rem; position: fixed; bottom: 0.27rem; left: 50%; transform: translateX(-50%); height: 0.84rem; border-radius: 0.42rem; background: $bgclor; color: #fff;} .youhuijuan{ padding-top: 1.46rem; padding-bottom: 0.2rem; .title{ width: 100%; height: 0.6rem; position: fixed; left: 0; top: 0.86rem; font-size: 0.28rem; .item{ flex: 1; height: 0.6rem; color:#616161; position: relative; &.on:before{content:''; display: block; width: 30%; height: 1px; background: $bgclor; position: absolute; bottom: 0; left: 35%;} } } ul{ width: 100%; height: 100%; padding: 0px 0.16rem; li{ width: 100%; height: 1.94rem; position: relative; padding-left: 2.4rem; margin-top: 0.2rem; .youhuiLeft{ width: 2.4rem; color: #fff; padding-top: 0.2rem; padding-bottom: 0.6rem; height: 1.94rem; background: url(../img/images/youhuijuanLeft.png) no-repeat; background-size: 100% 100%; position: absolute; left: 0; top: 0; font-size: 0.7rem; em{font-size: 0.3rem; font-style: normal; padding-bottom: 0.2rem;} } .youhuiInfos{ flex: 1; height: 99%; border: 1px solid #dadada; border-left: 0px; .infos{ flex: 1; padding: 0.2rem; font-size: 0.24rem; color: #888; h2{font-size: 0.42rem; color: $bgclor; padding-bottom: 0.12rem;} } .bottom{width: 100%; font-size: 0.18rem; padding: 0px 0.2rem; height: 0.5rem; border-top: 1px dashed #dadada;} .circle{width: 0.3rem; height: 0.3rem; border-radius: 50%; background: #b0b0b0; position: relative; transform-origin: center center;} } } } .youhuiFooterss{ font-size: 0.18rem; width: 100%; padding: 0.2rem; border: 1px solid #dadada; border-top: 0px; h4{ font-size: 0.18rem; margin-bottom: 0.1rem; color: $bgclor;} p{width: 50%; margin-bottom: 0.1rem;} } } .dingdangenzong{ width: 100%; height: 100%; padding-top: 1.96rem; .dingdanSearch{ width: 7.18rem; position: absolute; left: 50%; transform: translateX(-50%); height: 1.1rem; top: 0.86rem; .search_box{ width: 100%; height: 0.7rem; overflow: hidden; position: relative; border-radius: 0.2rem; background: #fff; box-shadow: 0px 0px 3px rgba(0,0,0,0.2); input{flex: 1; height: 100%; border: 0px; outline: none; font-size: 0.24rem; color: #666; padding-left: 0.9rem;} .fgx{width: 1px; height: 0.35rem; background: #0096df;} .search_btn{ font-size: 0.24rem; color: #8a8a8a; padding: 0px 0.3rem; i{font-size: 0.2rem !important; color: #aaa; margin-left: 0.1rem;} } .van-icon{position: absolute; left: 0.3rem; top: 50%; transform: translateY(-50%);} } } .dingdangenzongContainer{ width: 100%; height: 100%; overflow: auto; padding: 0px 0.4rem; padding-bottom: 0.3rem; .item{ width: 100%; overflow: hidden; position: relative; padding-left: 0.47rem; padding-right: 0.47rem; padding-bottom: 0.8rem; height: 3.12rem; border-radius: 0.2rem; background: #fff; box-shadow: 0px -1px 3px rgba(0,0,0,0.15); margin-top: 0.2rem; &::before{content: ''; display: block; position: absolute; left: 0; top: 0.48rem; height: 1.24rem; width: 0.11rem; background: #0093DC;} &::after{content: ''; display: block; position: absolute; right: 0; top: 0.48rem; height: 1.24rem; width: 0.11rem; background: #0093DC;} .title{ width: 100%; font-size: 0.24rem; color: #909090; padding-top: 0.26rem; b{width: 0.29rem; margin-left: 0.1rem; height: 0.27rem; background: url(../img/images/copy.png) no-repeat; background-size: 100% 100%;} h2{color: #10e000; font-size: 0.32rem;} } .cont{ padding-top: 0.1rem; font-size: 0.22rem; color: #909090; p{margin: 0.1rem;} } .foot{ width: 100%; height: 0.8rem; background: #b9b4b4; color: #fff; font-size: 0.32rem; position: absolute; left: 0; bottom: 0; .btn{ width: 50%; height: 0.8rem; &.on{background: #0096df;} } } } } } .dingdanzhuizong{ width: 100%; height: 100%; padding-top: 0.86rem; .dingdanzhuizongbox{ width: 100%; height: 100%; overflow: auto; padding: 0px 0.17rem; .stepList{ padding-top: 0.43rem; padding-bottom: 0.6rem; .item{ width: 0.88rem; position: relative; height: 0.88rem; border-radius: 50%; border: 1px solid $bgclor; font-size: 0.2rem; color: $bgclor; p{ color: #bfc2c3; font-size: 0.16rem; white-space: nowrap; position: absolute; bottom: -45%; left: 0%; width: 100%; text-align: center;} &.active{ background: $bgclor; color: #fff; p{color: $bgclor;} } &.disabled{background: #bfc2c3; color: #fff; border: 1px solid #bfc2c3;} } i{ color: #bfc2c3; &.on{color: #0096df;} } } .songdaInfo{ width: 100%; padding: 0px 0.2rem; height: 0.8rem; border-radius: 0.1rem; background: $bgclor; color: #fff; font-size: 0.24rem; } .subListTitles1{ font-size: 0.32rem; color: $bgclor; position: relative; padding-left: 0.2rem; margin-top: 0.2rem; height: 0.76rem; b{left: 0px; background: $bgclor; display: block; width: 2px; height: 0.3rem; position: absolute; top: 50%; transform: translateY(-50%);} } .dingdanLists li{ width: 6.72rem; padding: 0.25rem 0.43rem; position: relative; border-radius: 5px; overflow: hidden; margin: 0.2rem auto 0px auto; height: 2.72rem; background: #fff; box-shadow: 0px 0px 3px rgba(0,0,0,0.2); &::after{content: ''; display: block; width: 3px; height: 1.6rem; background: $bgclor; position: absolute; top: 50%; left: 0; transform: translateY(-50%);} &::before{content: ''; display: block; width: 3px; height: 1.6rem; background: $bgclor; position: absolute; top: 50%; right: 0; transform: translateY(-50%);} .title{ width: 100%; font-size: 0.24rem; color: #909090; h4{ font-size: 0.32rem; color: $bgclor;} } .subTitle{font-size: 0.22rem; color: #909090; padding: 0.1rem 0px; span{margin-left: 0.3rem;}} .count{ font-size: 0.22rem; color: #909090; em{font-style: normal; width: 2.5rem;} } .foots{font-size: 0.24rem; margin-top: 0.1rem; color: #333; h4{ font-size: 0.45rem; margin-top: 0.1rem; color: $bgclor;} } } } } .jinhuoRank{ padding-bottom: 0.5rem; li{ width: 6.94rem; margin: auto; margin-top: 0.2rem; height: 1.5rem; border-radius: 10px; overflow: hidden; box-shadow: 0px 2px 3px rgba(0,0,0,0.2); .image{width: 1.66rem; height: 100%; img{width: 100%; height: 100%;}} .info{flex: 1; padding: 0px 0.2rem; font-size: 0.24rem; color: #333;} .fgx{ width: 1px; height: 0.83rem; background: #bfbfbf;} .rankwrap{ width: 1.45rem; color: #ffc600; font-size: .24rem; h2{ color: #ffc600; font-size: 0.48rem;} } } } .lipeimingxi{ width: 100%; background: #fff; margin-bottom: 0.2rem; padding: 0.2rem; border-radius: 0.2rem; font-size: 0.22rem; color: $bgclor; .image{width: 1rem; height: 1rem; img{width: 100%; height: 100%;}} .info{ padding: 0px 0.2rem; .item{width: 50%;} } } .leijiFooterSelect{ width: 100%; height: 0.86rem; padding: 0px 0.2rem; color: $bgclor; font-size: 0.28rem; .select{ width: 49%; height: 0.6rem; background: #fff; border-radius: 5px; position: relative; padding: 0px 0.2rem; .icon-xia{ position: absolute; right: 0.2rem; top: 50%; transform: translateY(-45%);} } } .mendianliebiao{ width: 100%; height: 100%; overflow: auto; padding: 0px 0.17rem; padding-bottom: 0.2rem; .item{ width: 100%; border-radius: 5px; overflow: hidden; margin-top: 0.2rem; height: 2.5rem; background: #fff; box-shadow: 0px 1px 2px rgba(0,0,0,0.2); .img{width: 2.34rem; margin-left: 0.1rem; height: 2.34rem; img{width: 100%; height: 100%;}} .infos{ flex: 1; font-size: 0.24rem; padding: 0px 0.2rem; color: #9c9c9c; h2{font-size: 0.3rem; color: #333; margin-bottom: 0.2rem;} p{margin-bottom: 0.1rem;} span{ color: $bgclor;} } .icon-right{color: #999; margin-right: 0.3rem;} } } .shouhuodizhiBox{ width: 6.76rem; margin: auto; border-radius: 10px; background: #fff; padding: 0.2rem; color: $bgclor; .icon{ width: 0.3rem; margin-right: 0.2rem; height: 0.3rem; background: url(../img/images/iconAddress.png) no-repeat; background-size: 0.9rem 0.3rem; &.i2{background-position: -0.3rem 0px;} &.i3{background-position: -0.6rem 0px;} &.i4{background:url(../img/images/i4icon.png) no-repeat; background-size: 100% 100%;} } .addressTitle{ font-size: 0.24rem; margin-bottom: 0.1rem; margin-top: 0.2rem; position: relative; .icon-right{position: absolute; right: 2%; top: 135%; font-size: 0.2rem !important;} .i3.icon-right{margin-right: 0px !important;} .i3.icon-right:before{content: '';} } input{ color: $bgclor; display: block; width: 100%; border: 0px; font-size: 0.26rem; border-bottom: 1px solid $bgclor; height: 0.6rem; &[disabled]{background: #fff;} } } .addressFooter{width: 5.94rem; font-size: 0.26rem; border-radius: 0.38rem; color: $bgclor; height: 0.76rem; background: #fff; position: fixed; left: 50%; bottom: 5%; transform: translateX(-50%);} .uploadFiles{width: 1.2rem; height: 1.2rem; background: url(../img/images/uploadFile.png) no-repeat; background-size: 100% 100%;} .uploadTouxiang{ margin: 0.3rem 0px;} .addressFooterbtn{width: 5.94rem; margin: auto; font-size: 0.26rem; border-radius: 0.38rem; color: #fff; height: 0.76rem; background: $bgclor; }