Skip to content

S
SuperMan
Commit 3221a7f6 authored by 黄奎's avatar 黄奎
Browse files
Options

no message

parent c40da16b
Show whitespace changes
Inline Side-by-side
Showing with 882 additions and 0 deletions
src/components/SupplierIndex.vue 0 → 100644
View file @ 3221a7f6
<template>
<div style="position: relative;" ref="firstParent">
<div class="nav">
<div class="nav-left">
<img class="GroupPic" src="../assets/img/default_head_img.jpg" />
</div>
<div class="nav-middle">
<ul class="clearfix" :style="{width:`${allWindowWidth}px`}">
<li v-for="(item,index) in menuList" v-if="item.URL!=''" :class="{active:item.Id==chosenIndex}"
@click="goUrl(item.URL,item.Id,index)">
<span class="big_tittle"><i :class="[fontPub,item.icon]"></i>{{item.MenuName}}</span>
<div class="hoverNote"></div>
</li>
</ul>
</div>
<div class="nav-right">
<ul>
<li class="user_head">
<el-dropdown trigger="click">
<div class="el-dropdown-link">
<img src="../assets/img/default_head_img.jpg" />
<span class="name" :title="userInfo.SupplierName">{{userInfo.SupplierName}}</span>
</div>
<el-dropdown-menu slot="dropdown" class="_dropdown _more_dropdown">
<el-dropdown-item class="clearfix _dropdown_other" @click.native="settingSys">
<i class="iconfont icon-menu-shezhi1"></i>
设置
</el-dropdown-item>
<el-dropdown-item class="clearfix _dropdown_other" @click.native="exit">
<i class="iconfont icon-menu-tuichu"></i>
退出
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</li>
<li>
<el-dropdown trigger="click">
<span class="el-dropdown-link">
<i v-if="language=='zh-CN'" class="iconfont icon-language_top"></i>
<i v-if="language=='Japanese'" class="iconfont icon-icon-riyu"></i>
</span>
<el-dropdown-menu class="changelanguage" slot="dropdown">
<el-dropdown-item @click.native="ChangeLan('Japanese')">日语 <i v-if="language=='Japanese'"
class="iconfont icon-duigou"></i></el-dropdown-item>
<el-dropdown-item @click.native="ChangeLan('zh-CN')">简体中文 <i v-if="language=='zh-CN'"
class="iconfont icon-duigou"></i></el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</li>
</ul>
</div>
</div>
</div>
</template>
<script>
import util from "../utils";
import config from "../configs";
import pageUtil from "../utils/page";
import emojiObj from "../configs/emoji";
import loading from "./commonPage/loading";
export default {
components: {
loading,
},
data() {
return {
language: 'zh-CN',
userInfo: {},
menuList: [],
chosenIndex: 1,
fontPub: "iconfont",
icon: 'this.src="' + require("../assets/img/NotificationIcon.png") + '"',
allWindowWidth: '',
};
},
mounted() {
let that = this;
document.title = this.userInfo.GroupName;
this.getMenu();
},
created() {
this.userInfo = this.getLocalStorageSupplier();
console.log("this.userinfo", this.userInfo);
let language = localStorage.language;
if (!language) {
this.language = 'zh-CN';
this.$i18n.locale = 'zh-CN';
} else {
this.language = language
this.$i18n.locale = language;
}
let allWindowWidth = window.innerWidth;
this.allWindowWidth = allWindowWidth - 50 - 220 - 60;
let maxLength = parseInt(allWindowWidth / 100);
this.maxLength = maxLength;
},
methods: {
goUrl(url, id, index) {
this.chosenIndex = id;
if (localStorage.openMode && localStorage.openMode == 1)
this.$router.push({
path: url,
query: {
blank: 'y'
}
});
else
this.$router.push({
path: url,
query: {}
});
},
getMenu() {
this.menuList = this.userInfo.UserMenu;
},
exit() {
this.$store.dispatch("logout")
localStorage.removeItem("userInfo");
localStorage.removeItem("previousPathInfo");
location.href = '/SupplierLogin';
},
settingSys: function () {
this.MsgBus.$emit('settingOpen')
},
}
};
</script>
<style lang="less">
@import "../assets/css/main.less";
@import "../assets/css/cssReset.css";
@import "../assets/css/message.css";
.changelanguage {
width: 124px;
}
.changelanguage .el-dropdown-menu__item .icon-duigou {
color: #000000;
position: absolute;
right: 10px;
font-size: 14px;
}
.changelanguage .el-dropdown-menu__item {
padding: 0;
padding-left: 15px;
font-size: 14px;
position: relative;
color: #333333;
}
.changelanguage .el-dropdown-menu__item:hover {
background: #D9D9D9;
color: #333333;
}
._dropdown.el-dropdown-menu {
padding: 0;
background-color: #1f2533 !important;
border-radius: 4px;
overflow: hidden;
width: 210px;
top: 40px !important;
}
._dropdown_f1.el-dropdown-menu__item {
background-color: #4d515b !important;
color: #ffffff !important;
cursor: default;
height: 50px;
line-height: 50px;
}
._dropdown_f1.el-dropdown-menu__item .company {
font-size: 14px;
display: flex;
justify-content: space-between;
align-items: center;
}
._dropdown_f1.el-dropdown-menu__item .company span:nth-child(2) {
display: inline-block;
padding: 3px 8px;
background-color: #007eff;
border-radius: 9px;
line-height: 18px;
font-size: 12px;
}
._dropdown_f1.el-dropdown-menu__item:hover,
._dropdown_f1.el-dropdown-menu__item:focus {
background-color: #4d515b !important;
color: #ffffff !important;
}
._dropdown_other.el-dropdown-menu__item {
color: #a9aaad;
position: relative;
}
._dropdown_other.el-dropdown-menu__item .el-badge {
position: absolute;
right: 20px;
top: 5px;
}
._dropdown_other.el-dropdown-menu__item i {
color: #a9aaad;
display: inline-block;
margin-right: 6px;
}
._dropdown_other.el-dropdown-menu__item:hover,
._dropdown_other.el-dropdown-menu__item:focus {
background-color: #6f737b !important;
color: #ffffff !important;
}
._dropdown .popper__arrow::after {
border-bottom-color: transparent !important;
}
.nav-right ul li.user_head .el-dropdown-link {
display: flex;
align-items: center;
cursor: pointer;
}
.nav-right ul li.user_head span.name {
color: #99a7b3;
font-size: 12px;
display: inline-block;
margin-left: 10px;
overflow: hidden;
width: 45px;
height: 50px;
}
.nav-right ul li.user_head img {
width: 24px;
height: 24px;
border-radius: 50%;
}
.nav {
display: -webkit-box;
.size(100%, 50px);
.min-width(1366px);
background: #1f2533;
}
.nav-left {
width: 56px;
line-height: 50px;
color: #e73828;
text-align: center;
}
.nav-left .GroupPic {
width: 36px;
height: 36px;
-webkit-border-radius: 36px;
margin: 7px 0px 0px 15px;
}
.nav-left i.iconfont {
font-size: 24px;
}
.nav-left img {
.fl();
.size(50px; 50px);
.circle(25px);
}
.nav-left p.name {
.fz(14px, 18px);
color: #444;
margin: 20px 0 5px 0;
}
.nav-left p.company {
.fz(12px);
color: #444;
}
.nav-middle {
display: flex;
}
.nav-middle ul {
width: 100%;
margin: 0 auto;
height: 100%;
z-index: 2019128;
}
.nav-middle ul li {
.size(100px, 100%);
.fz(14px);
.center(text-x);
.hover-bg(#f1f1f1);
color: #a6adb4;
position: relative;
padding: 12px 0;
float: left;
z-index: 2019128;
}
.nav-middle ul li i {
font-size: 16px;
color: #a6adb4;
}
.nav-middle ul li img {
height: 40px;
margin: 32px 0 14px;
}
.nav-middle ul li:hover .menuList_son {
width: 1000px;
z-index: 999999;
opacity: 1;
padding: 20px 0 20px 20px;
height: auto;
animation: ttt .5s forwards;
}
@keyframes ttt {
0% {
opacity: 0;
}
66% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.nav-middle ul li .menuList_son {
position: fixed;
z-index: 9000;
background-color: #363c4a;
top: 50px;
opacity: 0;
padding: 0;
overflow: hidden;
height: 0;
}
.menuList_tittle_box {
line-height: 30px;
padding-top: 15px;
}
.menuList_son_one_tittle {
color: #a6adb4;
font-size: 16px;
padding-bottom: 15px;
border-bottom: 1px solid #495165;
text-align: left;
}
.menuList_son_two_tittle {
color: #e9ebec;
text-align: left;
}
.menuList_son_three_tittle {
cursor: pointer;
transition: all linear .3s;
text-align: left;
}
.menuList_son_three_tittle:hover {
color: white;
}
.menuList_son_item {
width: 100%;
display: flex;
justify-content: flex-start;
}
.menuList_son_item>div {}
.hoverNote {
width: 0;
height: 4px;
background: #e95252;
position: absolute;
left: 0;
bottom: -2px;
}
.nav-middle ul li:hover {
background-color: #2f384d;
}
.nav-middle ul li:hover .hoverNote {
width: 100%;
transition: width 0.3s;
}
.nav-middle ul li i {
color: #a6adb4;
display: inline-block;
margin-right: 12px;
}
.big_tittle {
cursor: pointer;
}
.nav-middle ul li.active .big_tittle {
color: #ffffff;
cursor: pointer;
}
.nav-middle ul li.active .hoverNote {
width: 100%;
}
.nav-right {
width: 220px;
position: absolute;
right: 0;
}
.nav-right ul {
display: flex;
line-height: 50px;
justify-content: flex-end;
}
.nav-right ul li {
height: 50px;
margin-right: 20px;
text-align: center;
justify-content: flex-end;
}
.nav-right ul li i {
cursor: pointer;
.fz(18px);
color: #e4e4e4;
}
.nav-right ul li i:hover {
color: #999;
}
._more_dropdown._dropdown.el-dropdown-menu {
top: 50px !important;
}
</style>
src/components/SupplierLogin.vue 0 → 100644
View file @ 3221a7f6
<style>
@import "../assets/css/login.css";
</style>
<template>
<div class="login-box">
<div class="homepage-hero-module">
<div class="silder-box" ref='box' :style="{'height':'100vh'}" v-show="height>0">
<div class="item" v-for="(item,index) in imgs" :key="index">
<img :style="{'height':'100vh'}" :class="index==crtIndex?'active':''" ref="swiper" :src="item">
</div>
</div>
</div>
<div class="cover"></div>
<form class="login-Div">
<div v-if="isShow==1">
<div class="mainTitle">{{groupModel.GroupName?groupModel.GroupName:''}} 供应商登录</div>
<div class="login-commonBotm T1">
<i class="icon-login-name iconfont icon-user11"></i>
<input class="input" @focus="name_bline=true" @blur="name_bline=false" maxlength="20"
autocomplete="new-password" v-model="userInfo.name" style="background-color:transparent !important;"
type="text" :placeholder="$t('login.login_account')" @keyup.enter="doLogin" />
<div class="name_bline_left" :class="name_bline==true?'_bline_w':''"></div>
<div class="name_bline_right" :class="name_bline==true?'_bline_w':''"></div>
</div>
<div class="error-msg">
<div v-show="nameIsShow"><img src="../assets/img/login-error-tips.png" />{{ nameErrorMsg }}</div>
</div>
<div class="login-commonBotm">
<i class="icon-login-password iconfont icon-mima"></i>
<input class="input" @focus="pwd_bline=true" @blur="pwd_bline=false" maxlength="20"
autocomplete="new-password" v-model="userInfo.password" style="background-color:transparent !important"
type="password" :placeholder="$t('login.login_password')" @keyup.enter="doLogin" />
<div class="pwd_bline_left" :class="pwd_bline==true?'_bline_w':''"></div>
<div class="pwd_bline_right" :class="pwd_bline==true?'_bline_w':''"></div>
</div>
<div class="error-msg">
<div v-show="passwordIsShow"><img src="../assets/img/login-error-tips.png" />{{ passwordErrorMsg }}</div>
</div>
<button type="button" class="loginBtn" :class="{'loginIng':loginState==1}" :disabled="loginState==1"
@click="doLogin">{{loginState==1?'登录中...':'登录'}}</button>
<div class="forgetPw">
<span @click="updatePwd">{{$t('login.login_forgetpwd')}}?</span>
</div>
<div class="login-way">
<div class="wayLeft">
<i class="icon-login-qqicon"></i>
<span>QQ登录</span>
</div>
<div class="wayRight">
<i class="icon-login-wechaticon"></i>
<span>微信登录</span>
</div>
</div>
</div>
<div v-if="isShow==2" class="phoneLogin">
<div class="mainTitle bindTitle">{{groupModel.GroupName?groupModel.GroupName:''}}</div>
<div class="bindPhone">绑定手机号</div>
<div class="login-commonBotm T1">
<i class="icon-login-name iconfont icon-phone1"></i>
<input class="input" @focus="name_bline=true" @blur="name_bline=false"
onkeyup="value=value.replace(/[^\d]/g,'')" maxlength="11" autocomplete="new-password" v-model="mobileNumber"
style="background-color:transparent !important;" type="text" placeholder="请输入手机号" />
<div class="name_bline_left" :class="name_bline==true?'_bline_w':''"></div>
<div class="name_bline_right" :class="name_bline==true?'_bline_w':''"></div>
</div>
<div class="error-msg">
<div v-show="nameIsShow"><img src="../assets/img/login-error-tips.png" />{{ nameErrorMsg }}</div>
</div>
<div class="login-commonBotm">
<i class="icon-login-password iconfont icon-mima"></i>
<input class="input phoneValidate" maxlength="4" @focus="pwd_bline=true"
onkeyup="value=value.replace(/[^\d]/g,'')" @blur="pwd_bline=false" v-model="code"
autocomplete="new-password" style="background-color:transparent !important" type="text" placeholder="验证码"
@keyup.enter="doBind" />
<div class="pwd_bline_left" :class="pwd_bline==true?'_bline_w':''"></div>
<div class="pwd_bline_right" :class="pwd_bline==true?'_bline_w':''"></div>
<div class="validatCode">
<span v-show="show" @click="getCode">获取验证码</span>
<span v-show="!show" class="count">{{count}}s重新获取</span>
</div>
</div>
<div class="error-msg">
<div v-show="passwordIsShow"><img src="../assets/img/login-error-tips.png" />{{ passwordErrorMsg }}</div>
</div>
<input type="button" class="loginBtn" @click="doBind" value="确认绑定" />
</div>
<div v-if="isShow==3" class="phoneLogin">
<div class="mainTitle bindTitle">{{groupModel.GroupName?groupModel.GroupName:''}}</div>
<div class="bindPhone">修改密码</div>
<div class="login-commonBotm T1">
<i class="icon-login-name iconfont icon-phone1"></i>
<input class="input" @focus="name_bline=true" onkeyup="value=value.replace(/[^\d]/g,'')" maxlength="11"
@blur="name_bline=false" autocomplete="new-password" v-model="mobileNumber"
style="background-color:transparent !important;" type="text" placeholder="请输入手机号" />
<div class="name_bline_left" :class="name_bline==true?'_bline_w':''"></div>
<div class="name_bline_right" :class="name_bline==true?'_bline_w':''"></div>
</div>
<div class="error-msg">
<div v-show="nameIsShow"><img src="../assets/img/login-error-tips.png" />{{ nameErrorMsg }}</div>
</div>
<div class="login-commonBotm">
<i class="icon-login-password iconfont icon-mima"></i>
<input class="input" @focus="pwd_bline=true" @blur="pwd_bline=false" autocomplete="new-password"
maxlength="20" v-model="password" style="background-color:transparent !important" type="password"
placeholder="请输入新密码" />
<div class="pwd_bline_left" :class="pwd_bline==true?'_bline_w':''"></div>
<div class="pwd_bline_right" :class="pwd_bline==true?'_bline_w':''"></div>
</div>
<div class="login-commonBotm btValidate">
<i class="icon-login-password iconfont icon-mima"></i>
<input class="input phoneValidate" maxlength="4" onkeyup="value=value.replace(/[^\d]/g,'')"
@focus="validate_bline=true" @blur="validate_bline=false" v-model="code" autocomplete="new-password"
style="background-color:transparent !important" type="text" placeholder="验证码" @keyup.enter="changePwd" />
<div class="pwd_bline_left" :class="validate_bline==true?'_bline_w':''"></div>
<div class="pwd_bline_right" :class="validate_bline==true?'_bline_w':''"></div>
<div class="validatCode">
<span v-show="show" @click="getCode">获取验证码</span>
<span v-show="!show" class="count">{{count}}s重新获取</span>
</div>
</div>
<div class="forgetPw">
<span @click="goLogin">去登录</span>
</div>
<div class="error-msg">
<div v-show="passwordIsShow"><img src="../assets/img/login-error-tips.png" />{{ passwordErrorMsg }}</div>
</div>
<input type="button" class="loginBtn changeBtn" @click="changePwd" value="确认修改" />
</div>
</form>
</div>
</template>
<script>
import url_1 from "@/assets/img/login_bg_1.jpg";
import url_2 from "@/assets/img/login_bg_2.jpg";
export default {
name: "login-box",
data() {
return {
userInfo: {
name: "",
password: "",
Domain: ""
},
groupModel: "",
password: "",
mobileNumber: "",
code: "",
mobileCodeType: 1,
show: true,
count: "",
timer: null,
isShow: 1,
vedioCanPlay: false,
fixStyle: "",
nameIsShow: false,
passwordIsShow: false,
nameErrorMsg: "",
passwordErrorMsg: "",
name_bline: false,
pwd_bline: false,
validate_bline: false,
loginState: 0,
height: 0,
clock: null,
crtIndex: 0,
imgs: [
url_1,
url_2
]
};
},
mounted() {
this.init();
let that = this;
this.clock = setInterval(() => {
that.init()
}, 1000);
let _audio = this.$refs.audio;
try {
_audio.playbackRate = 0.5;
} catch (error) {}
this.getGroup();
this.initData();
window.onresize = () => {
const windowWidth = document.body.clientWidth;
const windowHeight = document.body.clientHeight;
const windowAspectRatio = windowHeight / windowWidth;
let videoWidth;
let videoHeight;
if (windowAspectRatio < 0.5625) {
videoWidth = windowWidth;
videoHeight = videoWidth * 0.5625;
this.fixStyle = {
height: windowWidth * 0.5625 + "px",
width: windowWidth + "px",
"margin-bottom": (windowHeight - videoHeight) / 2 + "px",
"margin-left": "initial"
};
} else {
videoHeight = windowHeight;
videoWidth = videoHeight / 0.5625;
this.fixStyle = {
height: windowHeight + "px",
width: windowHeight / 0.5625 + "px",
"margin-left": (windowWidth - videoWidth) / 2 + "px",
"margin-bottom": "initial"
};
}
};
window.onresize();
},
methods: {
init() {
let over = true;
let maxHeight = 0;
if (!this.$refs['swiper'])
return false;
this.$refs['swiper'].forEach(x => {
if (x.complete) {
maxHeight = x.height > maxHeight ? x.height : maxHeight
} else {
over = false;
return false
}
});
if (over) {
this.height = maxHeight;
clearInterval(this.clock);
let that = this;
that.change();
setInterval(() => {
that.change()
}, 8000)
}
},
change() {
if (this.crtIndex < this.imgs.length - 1)
this.crtIndex++
else
this.crtIndex = 0
},
//初始化数据
initData() {
//判断是否是线上环境
if (!this.isOnline()) {
this.userInfo.name = "13551126756";
this.userInfo.password = "123456";
}
},
getGroup() { //获取集团
let Domain = window.location.hostname
this.ApiPost2('admin_get_GetModelByDomain', {
'Domain': Domain
}, res => {
this.groupModel = res.data.data;
document.title = "欢迎使用 " + this.groupModel.GroupName + " ERP系统";
}, err => {})
},
canplay() {
this.vedioCanPlay = true;
},
doLogin() {
if (this.userInfo.name == "") {
this.nameIsShow = true;
this.nameErrorMsg = "请输入用户名";
return;
} else if (this.userInfo.password == "") {
this.passwordIsShow = true;
this.passwordErrorMsg = "请输入密码";
return;
} else {
this.nameIsShow = false;
this.passwordIsShow = false;
}
this.loginState = 1;
var msg = {
EmAccount: this.userInfo.name,
EmPassword: this.userInfo.password
};
this.ApiPost2(
"supplier_get_UserLogin",
msg,
response => {
var jsonData = response.data;
if (jsonData.resultCode == 1) {
//登录成功
var userData = jsonData.data;
var userJson = JSON.stringify(userData);
localStorage.SupplierInfo = userJson;
this.$router.push({
path: "/SupplierIndex"
});
} else {
this.$notify.error({
title: "提示",
customClass: "msgTips",
message: response.data.message,
showClose: false,
duration: 3000
});
}
},
err => {}
);
},
getCode() {
// var phoneReg = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/;
// //电话
// var phone = this.mobileNumber.replace(/^\s+|\s+$/gm, "");
// if (!phoneReg.test(phone)) {
// this.nameIsShow = true;
// this.nameErrorMsg = "请输入有效的手机号码！";
// return false;
// } else {
// this.nameIsShow = false;
// }
// const TIME_COUNT = 60;
// this.code = "";
// 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);
// }
// let msg = {
// mobileNumber: this.mobileNumber,
// mobileCodeType: this.mobileCodeType
// };
// this.ApiPost2("user_get_moblieNumber_code", msg, res => {
// if (res.data.resultCode == 1) {} else {
// this.$notify.error({
// title: "提示",
// customClass: "msgTips",
// message: res.data.message,
// showClose: false,
// duration: 3000
// });
// }
// });
},
doBind() {
// if (this.mobileNumber == "") {
// this.nameIsShow = true;
// this.nameErrorMsg = "请输入手机号";
// return;
// } else if (this.code == "") {
// this.passwordIsShow = true;
// this.passwordErrorMsg = "请输入验证码";
// return;
// }
// let msg = {
// account: this.userInfo.name,
// password: this.userInfo.password,
// mobileNumber: this.mobileNumber,
// code: this.code
// };
// this.ApiPost2("user_account_bind_moblieNumber", msg, res => {
// if (res.data.resultCode == 1) {
// this.isShow = 1;
// this.loginState = 0;
// this.userInfo.name = this.mobileNumber;
// } else {
// this.$notify.error({
// title: "提示",
// customClass: "msgTips",
// message: res.data.message,
// showClose: false,
// duration: 3000
// });
// }
// });
},
updatePwd() {
// this.isShow = 3;
// this.mobileCodeType = 2;
},
changePwd() {
// let msg = {
// password: this.password,
// mobileNumber: this.mobileNumber,
// code: this.code
// };
// this.ApiPost2("user_change_password_by_mobileNumber", msg, res => {
// if (res.data.resultCode == 1) {
// this.isShow = 1;
// } else {
// this.$notify.error({
// title: "提示",
// customClass: "msgTips",
// message: res.data.message,
// showClose: false,
// duration: 3000
// });
// }
// });
},
goLogin() {
this.isShow = 1;
}
}
};
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment