Skip to content

E
ElectricitySheep
Commit 4de023ae authored by 黄媛媛's avatar 黄媛媛
Browse files
Options

Merge branch 'master' of http://gitlab.oytour.com/huangyuanyuan/electricitysheep

parents f15715e0 8bec3030
Hide whitespace changes
Inline Side-by-side
Showing with 308 additions and 43 deletions
index.html
View file @ 4de023ae
......@@ -3,10 +3,9 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>electricitysheep</title>
<title>微途超级商城</title>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
package.json
View file @ 4de023ae
......@@ -13,7 +13,9 @@
"build": "node build/build.js"
},
"dependencies": {
"axios": "^0.19.2",
"element-ui": "^2.13.1",
"js-md5": "^0.7.3",
"vue": "^2.5.2",
"vue-router": "^3.0.1"
},
......
src/components/Login.vue
View file @ 4de023ae
<style>
*{
margin:0;
padding:0;
}
.loginDiv{
width:100%;
height:100%;
background-image:url('../assets/img/loginBack.jpg');
position: relative;
background-size: cover;
background-size:100% 100%;
background-position: center;
}
.loginOpacity{
background-color: rgba(0, 0, 0, 0.15);
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
}
.loginDiv {
width: 100%;
height: 100%;
background-image: url("../assets/img/loginBack.jpg");
position: relative;
background-size: cover;
background-size: 100% 100%;
background-position: center;
}
.loginDiv .loginOpacity {
background-color: rgba(0, 0, 0, 0.15);
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
}
.loginDiv .box-card {
position: relative;
border-radius: 15px;
z-index: 99;
border: 0;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .5);
width: 825px;
height: 480px;
margin: 0 auto;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
background-size: 100% 100%;
background-image: url("../assets/img/loginBack.jpg");
}
[flex] {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
[flex~="main:center"] {
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center
}
[flex~="cross:center"] {
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.loginDiv .logo {
position: absolute;
left: 40px;
top: 40px;
height: 50px;
}
.loginDiv .login-form {
padding: 50px 45px 30px;
height: 480px;
width: 245px;
float: right;
background-color: #fff;
}
.loginDiv .form-title {
font-size: 26px;
color: #1F4881;
margin-bottom: 40px;
}
.loginDiv .el-form-item--mini.el-form-item,
.loginDiv .el-form-item--small.el-form-item {
margin-bottom: 18px;
}
.loginDiv .el-input .el-input__inner {
height: 36px;
border-radius: 18px;
background-color: #f7f5fb;
border-color: #f7f5fb;
}
.loginDiv .el-input__inner {
-webkit-appearance: none;
background-color: #FFF;
background-image: none;
border-radius: 4px;
border: 1px solid #DCDFE6;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #606266;
display: inline-block;
font-size: inherit;
height: 40px;
line-height: 40px;
outline: 0;
padding: 0 15px;
-webkit-transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
transition: border-color .2s cubic-bezier(.645, .045, .355, 1);
width: 100%;
}
.loginDiv .register_box {
position: absolute;
right: 15%;
bottom: 35px;
width: 150px;
font-size: 14px;
}
.loginDiv .register {
display: inline-block;
width: 48%;
height: 15px;
line-height: 15px;
text-align: center;
cursor: pointer;
color: #4291ff;
}
.loginDiv .login-btn {
width: 100%;
border-radius: 20px;
height: 38px;
font-size: 16px;
background: linear-gradient(to right, #2E9FFF, #3E79FF);
box-shadow: 0 4px 10px rgba(0, 123, 255, .5);
}
.loginDiv .el-card__body {
padding: 0;
}
.loginDiv .foot {
position: absolute;
bottom: 40px;
left: 0;
right: 0;
width: auto;
color: #fff;
text-align: center;
font-size: 16px;
}
.loginDiv .foot a,
.loginDiv .foot a:visited {
color: #f3f3f3;
}
</style>
<template>
<div class="loginDiv">
<!-- <div class="loginOpacity">
</div> -->
<div class="loginDiv">
<div class="loginOpacity" flex="cross:center main:center">
<div class="el-card box-card is-always-shadow">
<div class="el-card__body">
<img alt class="logo" src="../assets/img/logo.png" />
<form class="el-form login-form">
<div class="form-title">管理员登录</div>
<div class="el-form-item is-required el-form-item--small">
<div class="el-form-item__content" style="margin-left: 0px;">
<div class="el-input el-input--small">
<input type="text" autocomplete="off" v-model="msg.Account" placeholder="请输入用户名"
class="el-input__inner" maxlength="25" />
</div>
</div>
</div>
<div class="el-form-item is-required el-form-item--small">
<div class="el-form-item__content" style="margin-left: 0px;">
<div class="el-input el-input--small">
<input type="password" autocomplete="off" placeholder="请输入密码" v-model="msg.Password"
class="el-input__inner" maxlength="25" />
</div>
</div>
</div>
<div class="el-form-item is-required el-form-item--small">
<div class="el-form-item__content" style="margin-left: 0px;">
<div class="el-input el-input--small" style="width: 140px;">
<input type="text" autocomplete="off" placeholder="验证码" v-model="msg.ValidataCode"
class="el-input__inner" maxlength="4" />
</div>
<img class="pic-captcha" src="/web/index.php?r=site%2Fpic-captcha&amp;v=5e9e7ef6a93ac6.36592545" />
</div>
</div>
<div class="el-form-item el-form-item--small">
<div class="el-form-item__content" style="margin-left: 0px;">
<label class="el-checkbox">
<span class="el-checkbox__input">
<span class="el-checkbox__inner"></span>
<input type="checkbox" aria-hidden="false" class="el-checkbox__original" value />
</span>
<span class="el-checkbox__label">
记住我，以后自动登录
</span>
</label>
</div>
</div>
<div class="el-form-item el-form-item--small">
<div class="el-form-item__content" style="margin-left: 0px;">
<button type="button" @click="login()"
class="el-button login-btn el-button--primary el-button--small is-round">
<span>登录</span>
</button>
</div>
</div>
</form>
<img alt class="logo" />
<div class="register_box">
<span class="register">忘记密码?</span>
<span class="register" style="border-left: 1px solid rgb(169, 169, 169);">注册账号</span>
</div>
</div>
</div>
<div class="foot">
<a target="_blank" href="javascript:void(0)" style="text-decoration: none;">
由成都微途科技有限公司提供技术支持</a></div>
</div>
</div>
</template>
<script>
export default {
name: 'Login',
data () {
return {
msg: ''
export default {
data() {
return {
msg: {
Account: '', //账号
Password: '', //密码
ValidataCode: '', //验证码
}
};
},
created() {
},
methods: {
//登录
login() {
if (this.msg.Account == "") {
this.Info("请输入用户名!")
}
if (this.msg.Password == "") {
this.Info("请输入密码!")
}
if (this.msg.ValidataCode == "") {
this.Info("请输入验证码!")
}
this.apipost("api/user/login", this.msg, res => {
console.log("res", res);
})
}
},
mounted() {
if (!this.isOnline()) {
this.msg.Account = "13551126755";
this.msg.Password = "123456";
this.msg.ValidataCode = "1234";
}
}
}
}
</script>
\ No newline at end of file
};
</script>
src/main.js
View file @ 4de023ae
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import axios from 'axios'
import App from './App'
import router from './router'
import ajaxPlug from './plug/index'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
Vue.config.productionTip = false
Vue.http = Vue.prototype.$http = axios
Vue.use(ajaxPlug)
/* eslint-disable no-new */
new Vue({
el: '#app',
......
src/plug/index.js
View file @ 4de023ae
......@@ -62,7 +62,7 @@ export default {
domainUrl = "http://reborn.oytour.com";
}
var obj = {
//主地址
//主地址npm
DomainUrl: domainUrl,
//常用提交数据URL
PostUrl: domainUrl + "/api/common/post",
......@@ -71,13 +71,43 @@ export default {
},
//浏览器缓存
Vue.prototype.getLocalStorage = function () {
var localStorageData = window.localStorage["userInfo"];
var localStorageData = window.localStorage["mall_userInfo"];
if (localStorageData !== undefined && localStorageData != 'undefined') {
return JSON.parse(localStorageData);
} else {
return null;
}
},
//验证只能输入2位小数【负数：isMinus传true】
Vue.prototype.checkPrice = function (item, filed, isMinus) {
var value = "" + item[filed]; //转字符串
var t = value.charAt(0);
value = value.replace(/[^\d.]/g, ""); //清除“数字”和“.”以外的字符
value = value.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的
value = value
.replace(".", "$#$")
.replace(/\./g, "")
.replace("$#$", ".");
value = value.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能输入两个小数
//如果第一位是负号，则允许添加 如果不允许添加负号 可以把这块注释掉
//是否允许负数
if (isMinus && t == '-') {
value = '-' + value;
}
item[filed] = value;
}
//验证只能输入整数【负数：isMinus传true】
Vue.prototype.checkInteger = function (item, filed, isMinus) {
var value = "" + item[filed]; //转字符串
var t = value.charAt(0);
value = value.replace(this.$commonUtils.Regex.isInteger, "");
//是否允许负数
if (isMinus && t == '-') {
value = '-' + value;
}
item[filed] = value;
},
//是否是线上环境【发布时修改为true】
Vue.prototype.isOnline = function () {
return process.env.NODE_ENV !== 'development';
......@@ -138,4 +168,4 @@ export default {
}, faildCall)
}
}
}
\ No newline at end of file
}
src/router/index.js
View file @ 4de023ae
......@@ -6,8 +6,13 @@ Vue.use(Router)
export default new Router({
routes: [
{
path: '/Login',
name: 'Login',
path: '/',
name: 'login',
component: resolve => require(['@/components/Login'], resolve),
},
{
path: '/login',
name: 'login',
component: resolve => require(['@/components/Login'], resolve),
},
{
......
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