This commit is contained in:
wangh 2023-11-21 18:12:04 +08:00
commit b51938071a
26 changed files with 460 additions and 112 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 226 KiB

View File

@ -173,7 +173,7 @@
</el-radio-group>
</el-form-item>
<el-form-item label="会员等级" prop="region" v-if="form.groupOriented == '2' " >
<el-select v-model="form.membershipLevel" placeholder="会员等级" >
<el-select v-model="form.membershipLevel" multiple placeholder="会员等级" >
<el-option v-for="(item,index) in vipname" :key="index" :label="item.name" :value="item.name"></el-option>
</el-select>
</el-form-item>
@ -657,7 +657,7 @@
activeStatus:'1',
paymentValue:'1',
amountCommission:'',
membershipLevel:'',
membershipLevel:[],
percentageCommissions:'',
fringeBenefit:'',
cardValueChildList:[],
@ -823,7 +823,7 @@
chongzhi(){
this.form = {
sort:1,
membershipLevel:'',
membershipLevel:[],
groupOriented: '1',
rechargeBalance:'',
giftBalance:'',

View File

@ -131,6 +131,12 @@
<el-radio label="2">等级会员</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="会员等级" prop="dieselUserLevel" v-if="form.adaptUserType == 2" >
<el-select v-model="form.dieselUserLevel" multiple clearable placeholder="会员等级">
<el-option :label="item.name" :value="item.id.toString()" v-for="(item,index) in userGradeList" :key="index" > </el-option>
</el-select>
</el-form-item>
<el-form-item label="赠送类型" prop="activeGift" >
<el-checkbox-group v-model="form.activeGift">
@ -334,14 +340,6 @@
</el-col>
</el-row>
<el-form-item label="会员等级" prop="dieselUserLevel" v-if="form.adaptUserType == 2" >
<el-select v-model="form.dieselUserLevel" multiple clearable placeholder="会员等级">
<el-option :label="item.name" :value="item.id.toString()" v-for="(item,index) in userGradeList" :key="index" > </el-option>
</el-select>
</el-form-item>
<el-form-item label="参与条件" prop="participationCondition">
<el-select v-model="form.participationCondition" clearable placeholder="请选择天参与条件">
<el-option label="不限制" value="0"></el-option>
@ -764,12 +762,13 @@ export default {
this.$message.error("该商品已存在")
return
}
this.pdswidlist.push( this.shopdata.goodsId.id)
this.pdswidlist.push( this.shopdata.goodsId.id,)
let data = {
activeGift: 4,
goodsIds : this.shopdata.goodsId.id,
goodsName: this.shopdata.goodsId.name,
goodsTotal:1
goodsTotal:this.shopdata.count
}
this.form.shiwudata.push(data)
@ -988,6 +987,10 @@ export default {
});
},
qiyong(row){
if(row.isonline == 1){
this.$message.error("下线不可进行操作")
return
}
getActiveConsumption(row.id).then(response => {
// this.form = response.data;
let data = response.data
@ -1001,6 +1004,10 @@ export default {
});
},
jinyong(row){
if(row.isonline == 1){
this.$message.error("下线不可进行操作")
return
}
getActiveConsumption(row.id).then(response => {
// this.form = response.data;
let data = response.data

View File

@ -405,6 +405,11 @@ export default {
});
},
qiyong(row){
//
if(row.isonline == 1){
this.$message.error("下线不可进行操作")
return
}
getActiveDiscount(row.id).then(response => {
// this.form = response.data;
let data = response.data
@ -418,6 +423,10 @@ export default {
});
},
jinyong(row){
if(row.isonline == 1){
this.$message.error("下线不可进行操作")
return
}
getActiveDiscount(row.id).then(response => {
// this.form = response.data;
let data = response.data

View File

@ -405,6 +405,10 @@ export default {
});
},
qiyong(row){
if(row.isonline == 1){
this.$message.error("下线不可进行操作")
return
}
getActiveFullminus(row.id).then(response => {
// this.form = response.data;
let data = response.data
@ -418,6 +422,10 @@ export default {
});
},
jinyong(row){
if(row.isonline == 1){
this.$message.error("下线不可进行操作")
return
}
getActiveFullminus(row.id).then(response => {
// this.form = response.data;
let data = response.data

View File

@ -1,5 +1,5 @@
<template>
<div class="app-container">
<div class="appconter">
<el-card class="box-card">
<div slot="header" class="clearfix">
@ -521,7 +521,7 @@ export default {
total:0
},
dtotal:0,
imagePath:'http://192.168.0.196:8080/',
imagePath:process.env.VUE_APP_SERVER_URL,
//
uploadAction: process.env.VUE_APP_SERVER_URL + 'backendApi/file/upload',
//
@ -950,4 +950,8 @@ export default {
width: 100%;
height: 100%;
}
.appconter{
box-sizing: border-box;
padding: 15px;
}
</style>

View File

@ -127,14 +127,14 @@
@click="handleXia(scope.row)"
>下线
</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
v-if="scope.row.isonline == 1"
@click="handleShang(scope.row)"
>上线
</el-button>
<!-- <el-button-->
<!-- size="mini"-->
<!-- type="text"-->
<!-- icon="el-icon-delete"-->
<!-- v-if="scope.row.isonline == 1"-->
<!-- @click="handleShang(scope.row)"-->
<!-- >上线-->
<!-- </el-button>-->
</template>
</el-table-column>
</el-table>

View File

@ -1,17 +1,28 @@
<template>
<div class="login">
<div class="login-main">
<div class="caption">
<h4 class="caption-title">{{ systemName }}</h4>
<p class="caption-remark">欢迎使用 {{ systemName }}您的卡券储值卡计次卡等会员营销小管家</p>
<div class="box-center">
<div class="box-left">
<div class="bai-size">蓝鲸智慧加油站</div>
<div class="bact-box">
<div class="sanhh">活动营销</div>
<div class="sanhh">节省人力</div>
<div class="sanhh">精准定位</div>
</div>
</div>
<div class="login-form">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules">
<div class="title">
<img class="logo" src="@/assets/logo/logo.png"/>
<span class="name">{{ systemName }}</span>
<div class="box-right">
<div class="box-title">
<div style="margin-right: 15px;cursor: pointer " v-for="(item,index) in dlyzm" :key="index" @click="actindex = item.type " >
<div>{{item.text}}</div>
<div class="gangs" v-if="item.type == actindex " ></div>
</div>
</div>
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" v-if="actindex == 0" >
<!-- <div class="title">-->
<!-- <img class="logo" src="@/assets/logo/logo.png"/>-->
<!-- <span class="name">{{ systemName }}</span>-->
<!-- </div>-->
<el-form-item prop="username">
<el-input
v-model="loginForm.username"
@ -36,18 +47,23 @@
</el-input>
</el-form-item>
<el-form-item prop="captchaCode" v-if="captchaOnOff">
<div style="display: flex;align-items: center">
<div>
<el-input
v-model="loginForm.captchaCode"
auto-complete="off"
placeholder="请输入验证码"
style="width: 63%"
style="width: 90%"
clearable
@keyup.enter.native="handleLogin"
>
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
</el-input>
<div class="login-code">
<img :src="codeUrl" @click="getCode" class="login-code-img"/>
</div>
<div class="login-code">
<img :src="codeUrl" @click="getCode" class="login-code-img"/>
</div>
</div>
</el-form-item>
<el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
@ -63,7 +79,77 @@
<span v-else> 中...</span>
</el-button>
</el-form-item>
</el-form>
</el-form>
<!-- 验证码-->
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" v-if="actindex == 1" >
<!-- <div class="title">-->
<!-- <img class="logo" src="@/assets/logo/logo.png"/>-->
<!-- <span class="name">{{ systemName }}</span>-->
<!-- </div>-->
<el-form-item prop="username">
<el-input
v-model="loginForm.username"
type="text"
auto-complete="off"
clearable
placeholder="账号"
>
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="captchaCode" v-if="captchaOnOff">
<div style="display: flex;align-items: center">
<div>
<el-input
v-model="loginForm.captchaCode"
auto-complete="off"
placeholder="请输入验证码"
style="width: 90%"
clearable
@keyup.enter.native="handleLogin"
>
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
</el-input>
</div>
<div>
<span class="anniulan" v-show="show" @click="getCode" >获取验证码</span>
<span v-show="!show" class="count">{{count}}s后重新获取</span>
</div>
</div>
</el-form-item>
<el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
<el-form-item style="width:100%;">
<el-button
:loading="loading"
size="medium"
type="primary"
style="width:100%;line-height: 24px;font-size: 16px;"
@click.native.prevent="handleLogin"
>
<span v-if="!loading">立即登录</span>
<span v-else> 中...</span>
</el-button>
</el-form-item>
</el-form>
</div>
</div>
<!-- <div class="login-main">-->
<!-- <div class="caption">-->
<!-- <h4 class="caption-title">{{ systemName }}</h4>-->
<!-- <p class="caption-remark">欢迎使用 {{ systemName }}您的卡券储值卡计次卡等会员营销小管家</p>-->
<!-- </div>-->
<!-- </div>-->
<div class="login-form">
<div class="copy-right">
<span>Copyright © 2020-2023 <a class="link" href="https://www.fuint.cn">fuint.cn</a> All Rights Reserved.</span>
</div>
@ -75,11 +161,21 @@
import { getCodeImg } from "@/api/login";
import Cookies from "js-cookie";
import { encrypt, decrypt } from '@/utils/jsencrypt'
import BalanceRecharge from "@/views/member/balanceRecharge.vue";
export default {
name: "Login",
components: {BalanceRecharge},
data() {
return {
show: true,
count: '',
timer: null,
dlyzm:[
{text:'登录',type:'0'},
{text: "验证码",type:'1'}
],
actindex:0,
codeUrl: "",
systemName : process.env.VUE_APP_TITLE,
loginForm: {
@ -115,11 +211,27 @@ export default {
}
},
created() {
this.getCode();
this.getCodeimg();
this.getCookie();
},
methods: {
getCode() {
const TIME_COUNT = 60;
if (!this.timer) {
this.count = TIME_COUNT;
this.show = false;
this.timer = setInterval(() => {
if (this.count > 0 && this.count <= TIME_COUNT) {
this.count--;
} else {
this.show = true;
clearInterval(this.timer);
this.timer = null;
}
}, 1000)
}
},
getCodeimg() {
const app = this
getCodeImg().then(response => {
app.codeUrl = response.data.captcha
@ -171,9 +283,86 @@ export default {
<style rel="stylesheet/scss" lang="scss">
.login {
height: 100%;
height: 100vh;
width: 100%;
position: relative;
background-image: url("../assets/images/loginback.png");
overflow: hidden;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
.box-center{
width: 1000px;
height: 580px;
border-radius: 8px;
background: #FFFFFF;
box-shadow: 0px 4px 10px 0px rgba(20,61,129,0.1);
border-radius: 16px 16px 16px 16px;
opacity: 1;
margin: 150px auto;
overflow: hidden;
display: flex;
}
.gangs{
width: 100%;
height: 5px;
background: #00aaff;
border-radius: 50px;
}
.box-left{
width: 50%;
height: 100%;
background: #00aaff;
background-image: url("../assets/images/box-left.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.box-right{
width: 50%;
box-sizing: border-box;
padding: 80px;
}
.box-title{
width: 100%;
//text-align: center;
display: flex;
align-items: center;
margin-bottom: 20px;
}
.bai-size{
width: 100%;
text-align: center;
font-size: 40px;
font-weight: bold;
color: #FFFFFF;
margin-top: 65px;
}
.bact-box{
width: 85%;
margin: 15px auto;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 40px;
}
.sanhh{
width: 112px;
height: 34px;
background: linear-gradient(90deg, #E1EBFF 0%, #FFFFFF 100%);
border-radius: 2px 2px 2px 2px;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #1755D0;
}
.login-main {
background-image: url("../assets/images/login-bg.png");
position: fixed;

View File

@ -186,6 +186,9 @@ public class ActiveConsumptionServiceImpl extends ServiceImpl<ActiveConsumptionM
activeConsumption.setGasolineUserLevel(arrayToString(activeConsumptionDTO.getGasolineUserLevel()));
//天然气会员等级
activeConsumption.setNaturalUserLevel(arrayToString(activeConsumptionDTO.getNaturalUserLevel()));
if (activeConsumptionDTO.getIsonline().equals("1")){
activeConsumption.setStatus("1");
}
//更新子表数据
update = updateById(activeConsumption);

View File

@ -183,6 +183,9 @@ public class ActiveDiscountServiceImpl extends ServiceImpl<ActiveDiscountMapper,
activeDiscount.setNaturalUserLevel(arrayToString(activeDiscountDTO.getNaturalUserLevel()));
activeDiscount.setAdaptOil(arrayToString(activeDiscountDTO.getAdaptOil()));
if (activeDiscountDTO.getIsonline().equals("1")){
activeDiscount.setStatus("1");
}
update = updateById(activeDiscount);
//更新子表数据
LambdaQueryWrapper<ActiveDiscountChild> queryWrapper = new LambdaQueryWrapper<>();

View File

@ -1,8 +1,8 @@
package com.fuint.business.marketingActivity.activeExchange.controller;
import com.fuint.business.marketingActivity.activeExchange.dto.ActiveExchangeRecordDTO;
import com.fuint.business.marketingActivity.activeExchange.service.ActiveExchangeService;
import com.fuint.business.marketingActivity.activeExchange.dto.TransferDTO;
import com.fuint.business.marketingActivity.activeExchange.service.ActiveExchangeService;
import com.fuint.business.marketingActivity.cardExchange.entity.CardExchangeRecord;
import com.fuint.framework.web.BaseController;
import com.fuint.framework.web.ResponseObject;

View File

@ -1,8 +1,8 @@
package com.fuint.business.marketingActivity.activeExchange.service;
import com.fuint.business.marketingActivity.activeExchange.dto.ActiveExchangeRecordDTO;
import com.fuint.business.marketingActivity.activeExchange.vo.ActiveExchangeRecordVO;
import com.fuint.business.marketingActivity.activeExchange.dto.TransferDTO;
import com.fuint.business.marketingActivity.activeExchange.vo.ActiveExchangeRecordVO;
import com.fuint.business.marketingActivity.activeExchange.vo.ExchangeFavorableVO;
import com.fuint.business.marketingActivity.activeExchange.vo.MaxoutVO;
import com.fuint.business.marketingActivity.cardExchange.entity.CardExchangeRecord;
@ -12,7 +12,7 @@ import java.util.List;
public interface ActiveExchangeService {
/**
* 分页查询所有数据
* @param page
* @param
* @param cardExchangeRecord
* @return
*/
@ -29,7 +29,7 @@ public interface ActiveExchangeService {
* 查询满减活动
* @param pageNo
* @param pageSize
* @param transferVO
* @param transferDTO
* @return
*/
List<MaxoutVO> selectConsumptionList(Integer pageNo, Integer pageSize, TransferDTO transferDTO);

View File

@ -19,7 +19,6 @@ import com.fuint.business.marketingActivity.cardFavorable.entity.CardFavorable;
import com.fuint.business.marketingActivity.cardFavorable.entity.CardFavorableRecord;
import com.fuint.business.marketingActivity.cardFavorable.service.CardFavorableRecordService;
import com.fuint.business.marketingActivity.cardFavorable.service.CardFavorableService;
import com.fuint.business.marketingActivity.cardFavorable.vo.CardFavorableVO;
import com.fuint.business.userManager.service.LJUserGradeService;
import org.apache.commons.lang3.ObjectUtils;
import org.springframework.beans.BeanUtils;
@ -216,8 +215,10 @@ public class ActiveExchangeServiceImpl implements ActiveExchangeService {
cardFavorableLambdaQueryWrapper.in(CardFavorable::getOilType,transferDTO.getOilName());
cardFavorableLambdaQueryWrapper.le(CardFavorable::getSatisfiedAmount,transferDTO.getOilPrice() * transferDTO.getOilLiters());
List<CardFavorable> list1 = cardFavorableService.list(cardFavorableLambdaQueryWrapper);
BeanUtils.copyProperties(list1.get(0), exchangeFavorableVO);
exchangeFavorableVOArrayList.add(exchangeFavorableVO);
if (list1.size()>0){
BeanUtils.copyProperties(list1.get(0), exchangeFavorableVO);
exchangeFavorableVOArrayList.add(exchangeFavorableVO);
}
}
return exchangeFavorableVOArrayList;
}

View File

@ -3,7 +3,6 @@ package com.fuint.business.marketingActivity.activeExchange.vo;
import java.io.Serializable;
public class ExchangeFavorableVO implements Serializable {
//主键id
private Integer id;
//优惠券名称

View File

@ -176,6 +176,10 @@ public class ActiveFullminusServiceImpl extends ServiceImpl<ActiveFullminusMappe
activeFullminus.setNaturalUserLevel(arrayToString(activeFullminusDTO.getNaturalUserLevel()));
activeFullminus.setAdaptOil(arrayToString(activeFullminusDTO.getAdaptOil()));
if (activeFullminusDTO.getIsonline().equals("1")){
activeFullminus.setStatus("1");
}
updateById(activeFullminus);
//更新子表数据
LambdaQueryWrapper<ActiveDiscountChild> queryWrapper = new LambdaQueryWrapper<>();

View File

@ -151,6 +151,9 @@ public class ActiveNewlywedsServiceImpl extends ServiceImpl<ActiveNewlywedsMappe
//奖励类型
activeNewlyweds.setCourtesyReward(arrayToString(activeNewlywedsDTO.getCourtesyReward()));
if (activeNewlywedsDTO.getIsonline().equals("1")){
activeNewlyweds.setStatus("2");
}
update = updateById(activeNewlyweds);
//更新子表数据
LambdaQueryWrapper<ActiveNewlywedsChild> queryWrapper = new LambdaQueryWrapper<>();

View File

@ -74,6 +74,9 @@ public class CardExchangeController extends BaseController {
*/
@PutMapping
public ResponseObject update(@RequestBody CardExchange cardExchange) {
if (cardExchange.getIsonline().equals("1")){
cardExchange.setStatus("1");
}
return getSuccessResult(this.cardExchangeService.updateById(cardExchange));
}

View File

@ -113,7 +113,7 @@ public class CardFavorableServiceImpl extends ServiceImpl<CardFavorableMapper, C
/**
* 修改数据
* @param cardFavorable
* @param cardFavorableDTO
* @return
*/
@Override
@ -137,6 +137,9 @@ public class CardFavorableServiceImpl extends ServiceImpl<CardFavorableMapper, C
checkTime += s + ",";
}
cardFavorable.setCheckTime(checkTime);
if (cardFavorableDTO.getIsonline().equals("1")){
cardFavorable.setStatus("1");
}
return updateById(cardFavorable);
}
}

View File

@ -6,9 +6,6 @@ import com.baomidou.mybatisplus.core.conditions.query.LambdaQueryWrapper;
import com.baomidou.mybatisplus.core.metadata.IPage;
import com.baomidou.mybatisplus.core.toolkit.CollectionUtils;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import com.fuint.business.marketingActivity.activeNewlyweds.controller.vo.ActiveNewlywedsVO;
import com.fuint.business.marketingActivity.activeNewlyweds.entity.ActiveNewlyweds;
import com.fuint.business.marketingActivity.activeNewlyweds.entity.ActiveNewlywedsChild;
import com.fuint.business.marketingActivity.cardValue.dto.CardValueDTO;
import com.fuint.business.marketingActivity.cardValue.entity.CardValue;
import com.fuint.business.marketingActivity.cardValue.entity.CardValueChild;
@ -119,6 +116,7 @@ public class CardValueController extends BaseController {
if (CollectionUtils.isNotEmpty(activeNewlywedsChildList)){
//封装VO返回
BeanUtils.copyProperties(cardValue,cardValueVO);
cardValueVO.setMembershipLevel(cardValue.getMembershipLevel().split(","));
cardValueVO.setCardValueChildList(activeNewlywedsChildList);
}
}
@ -145,6 +143,8 @@ public class CardValueController extends BaseController {
CardValue cardValue = new CardValue();
cardValue.setStartTime(new Date());
cardValue.setEndTime(new Date());
//柴油会员等级
cardValue.setMembershipLevel(arrayToString(cardValueDTO.getMembershipLevel()));
if (ObjectUtils.isNotEmpty(cardValueDTO)){
BeanUtils.copyProperties(cardValueDTO,cardValue);
save = this.cardValueService.save(cardValue);
@ -181,7 +181,9 @@ public class CardValueController extends BaseController {
//更新新人有礼活动
CardValue cardValue = new CardValue();
BeanUtils.copyProperties(cardValueDTO,cardValue);
if (cardValueDTO.getIsonline().equals("1")){
cardValue.setActiveStatus("2");
}
update =this.cardValueService.updateById(cardValue);
//更新子表数据
LambdaQueryWrapper<CardValueChild> queryWrapper = new LambdaQueryWrapper<>();

View File

@ -65,7 +65,7 @@ public class CardValueDTO extends Model<CardValue> {
//面向群体 1普通群体 2等级会员
private String groupOriented;
//会员等级 会员等级 0:新人会员 1V1会员 2V2会员.....
private String membershipLevel;
private String[] membershipLevel;
//排序 数值越大,顺序越在前
private Integer sort;
//新人有礼卡券列表
@ -85,6 +85,14 @@ public class CardValueDTO extends Model<CardValue> {
return cardValueChildList;
}
public String[] getMembershipLevel() {
return membershipLevel;
}
public void setMembershipLevel(String[] membershipLevel) {
this.membershipLevel = membershipLevel;
}
public void setCardValueChildList(List<CardValueChild> cardValueChildList) {
this.cardValueChildList = cardValueChildList;
}
@ -282,14 +290,6 @@ public class CardValueDTO extends Model<CardValue> {
this.groupOriented = groupOriented;
}
public String getMembershipLevel() {
return membershipLevel;
}
public void setMembershipLevel(String membershipLevel) {
this.membershipLevel = membershipLevel;
}
public Integer getSort() {
return sort;
}

View File

@ -64,7 +64,7 @@ public class CardValueVO extends Model<CardValue> {
//面向群体 1普通群体 2等级会员
private String groupOriented;
//会员等级 会员等级 0:新人会员 1V1会员 2V2会员.....
private String membershipLevel;
private String[] membershipLevel;
//排序 数值越大,顺序越在前
private Integer sort;
//新人有礼卡券列表
@ -80,6 +80,14 @@ public class CardValueVO extends Model<CardValue> {
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
private Date updateTime;
public String[] getMembershipLevel() {
return membershipLevel;
}
public void setMembershipLevel(String[] membershipLevel) {
this.membershipLevel = membershipLevel;
}
public Integer getId() {
return id;
}
@ -272,14 +280,6 @@ public class CardValueVO extends Model<CardValue> {
this.groupOriented = groupOriented;
}
public String getMembershipLevel() {
return membershipLevel;
}
public void setMembershipLevel(String membershipLevel) {
this.membershipLevel = membershipLevel;
}
public Integer getSort() {
return sort;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 226 KiB

View File

@ -48,7 +48,7 @@ export const constantRoutes = [
{
path: '',
component: Layout,
redirect: 'index',
redirect: '/login',
children: [
{
path: 'index',

View File

@ -1,49 +1,84 @@
<template>
<div class="login-container">
<div class="login-from-box">
<el-form class="login-form" ref="loginForm" :model="loginForm" :rules="loginRules" label-position="left">
<h3 class="title">{{ systemName }}</h3>
<el-form-item prop="username">
<span class="svg-container svg-container_login">
<svg-icon icon-class="user" />
</span>
<el-input name="username" type="text" clearable v-model="loginForm.username" autocomplete="on" placeholder="用户名" />
</el-form-item>
<el-form-item prop="password">
<span class="svg-container svg-container_login">
<svg-icon icon-class="password"></svg-icon>
</span>
<el-input name="password" :type="pwdType" clearable @keyup.enter.native="handleLogin()" v-model="loginForm.password"
autocomplete="on" placeholder="密码"></el-input>
<span class="show-pwd" @click="showPwd()">
<svg-icon :icon-class="pwdType === 'password' ? 'eye' : 'eye-open'" />
</span>
</el-form-item>
<el-form-item prop="captchaCode">
<span class="svg-container svg-container_login">
<svg-icon icon-class="validCode" />
</span>
<el-input
v-model="loginForm.captchaCode"
auto-complete="off"
placeholder="请输入验证码"
style="width: 63%"
clearable
@keyup.enter.native="handleLogin"
>
</el-input>
<div class="login-code">
<img :src="codeUrl" @click="getCode" class="login-code-img"/>
<div class="login">
<div class="box-center">
<div class="box-left">
<div class="bai-size">蓝鲸智慧加油站收银台</div>
<div class="bact-box">
<div class="sanhh">活动营销</div>
<div class="sanhh">节省人力</div>
<div class="sanhh">精准定位</div>
</div>
</div>
<div class="box-right">
<div class="box-title">
<div>
登录
</div>
<div>
验证码
</div>
</el-form-item>
<div class="login-btn">
<button type="button" class="btn" @click="handleLogin()">立即登录</button>
</div>
<div class="tips">
<span>深蓝数科</span>
</div>
</el-form>
<el-form ref="loginForm" :model="loginForm" :rules="loginRules">
<el-form-item prop="username">
<el-input
v-model="loginForm.username"
type="text"
auto-complete="off"
clearable
placeholder="账号"
>
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model="loginForm.password"
type="password"
auto-complete="off"
placeholder="密码"
clearable
@keyup.enter.native="handleLogin"
>
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
</el-input>
</el-form-item>
<el-form-item prop="captchaCode" v-if="captchaOnOff">
<div style="display: flex;align-items: center">
<div>
<el-input
v-model="loginForm.captchaCode"
auto-complete="off"
placeholder="请输入验证码"
style="width: 90%"
clearable
@keyup.enter.native="handleLogin"
>
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
</el-input>
</div>
<div class="login-code">
<img :src="codeUrl" @click="getCode" class="login-code-img"/>
</div>
</div>
</el-form-item>
<el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
<el-form-item style="width:100%;">
<el-button
:loading="loading"
size="medium"
type="primary"
style="width:100%;line-height: 24px;font-size: 16px;"
@click.native.prevent="handleLogin"
>
<span v-if="!loading">立即登录</span>
<span v-else> 中...</span>
</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
</template>
<script>
@ -164,6 +199,81 @@ $bg: #2d3a4b;
$light_gray: #eee;
$dark_gray: #889aa4;
$light_gray: #eee;
.login {
height: 100vh;
width: 100%;
position: relative;
background-image: url("../../assets/images/loginback.png");
overflow: hidden;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.box-center{
width: 1000px;
height: 580px;
border-radius: 8px;
background: #FFFFFF;
box-shadow: 0px 4px 10px 0px rgba(20,61,129,0.1);
border-radius: 16px 16px 16px 16px;
opacity: 1;
margin: 150px auto;
overflow: hidden;
display: flex;
}
.box-left{
width: 50%;
height: 100%;
background: #00aaff;
background-image: url("../../assets/images/box-left.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.box-right{
width: 50%;
box-sizing: border-box;
padding: 80px;
}
.box-title{
width: 100%;
//text-align: center;
display: flex;
align-items: center;
margin-bottom: 20px;
}
.bai-size{
width: 100%;
text-align: center;
font-size: 40px;
font-weight: bold;
color: #FFFFFF;
margin-top: 65px;
}
.bact-box{
width: 85%;
margin: 15px auto;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 40px;
}
.sanhh{
width: 112px;
height: 34px;
background: linear-gradient(90deg, #E1EBFF 0%, #FFFFFF 100%);
border-radius: 2px 2px 2px 2px;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #1755D0;
}
/* reset element-ui css */
.login-container {