Skip to content

B
bims
Commit 2b3df4d2 authored by 吴婷慧's avatar 吴婷慧
Browse files
Options

登录模块完成

parent 2b5e9b99
Hide whitespace changes
Inline Side-by-side
Showing with 1665 additions and 654 deletions
.env 0 → 100644
View file @ 2b3df4d2
VUE_APP_API=/dev
\ No newline at end of file
src/api/apis_moudles/author.js 0 → 100644
View file @ 2b3df4d2
// 状态管理api
export default {
getVerifyImg: "/backstage/user/getVerificationCode/authority",
login: "/backstage/user/login/authority",
loginOut: "/backstage/user/exit",
getVerifyEmail: "/backstage/user/pwdEmail",
pwdReset: "/backstage/user/resetPwd",
};
src/api/apis_moudles/base.js
View file @ 2b3df4d2
// 基础api
export default {
getUserInfo: `/getUserInfo`,
corporateCodeList: "/backstage/auth/corporateList",
};
src/api/apis_moudles/customer.js
View file @ 2b3df4d2
// 客户管理api
export default {};
export default {
getCustomerList: "/backstage/auth/patientList",
};
src/api/apis_moudles/index.js
View file @ 2b3df4d2
// 基础
import base from "./base";
// 用户状态api
import author from "./author";
// 报表api
import bi from "./bi";
// 收费查询api
......@@ -17,6 +19,7 @@ import welfare from "./welfare";
const apis = {
...base,
...author,
...bi,
...chargeQuery,
...customer,
......
src/api/env.js
View file @ 2b3df4d2
// 根据环境变量确认baseurl
let baseUrl = "";
switch (process.env.NODE_ENV) {
case "dev":
case "development":
// 本地地址，dev会被代理到测试环境
baseUrl = `${window.location.protocol}//${window.location.host}/dev`;
baseUrl = "/dev";
break;
// 正式地址
case "production":
......
src/api/funcs_modules/author.js 0 → 100644
View file @ 2b3df4d2
// 用户管理函数库
import apis from "../apis_moudles";
import req from "../request";
function toQuery(params) {
if (!params) {
return "";
}
let query = [];
for (let i in params) {
query.push(`${i}=${params[i]}`);
}
return query.join("&");
}
// 对象数组
const GETVERIFYIMG = function () {
return req.get(apis.getVerifyImg, { responseType: "blob" });
};
const GETVERIFYEMAIL = function (params) {
const queryStr = toQuery(params);
return req.post(apis.getVerifyEmail + "?" + queryStr);
};
const LOGIN = function (params) {
const queryStr = toQuery(params);
return req.post(apis.login + "?" + queryStr);
};
const LOGINOUT = function () {
return req.get(apis.loginOut);
};
const RESETPASSWORD = function (params) {
const queryStr = toQuery(params);
return req.post(apis.pwdReset + "?" + queryStr);
};
export default { GETVERIFYIMG, GETVERIFYEMAIL, LOGIN, LOGINOUT, RESETPASSWORD };
src/api/funcs_modules/base.js
View file @ 2b3df4d2
......@@ -8,6 +8,12 @@ const GETUSERINFO = (params) => {
params,
});
};
// get corporate Code
const GETCORPORATECODE = (data) => {
return req.post(apis.corporateCodeList, {
data,
});
};
// 对象数组
export default { GETUSERINFO };
export default { GETUSERINFO, GETCORPORATECODE };
src/api/funcs_modules/customer.js
View file @ 2b3df4d2
// 客户管理函数库
// import apis from "../apis_moudles/index";
// import req from "../request";
import apis from "../apis_moudles/";
import req from "../request";
// 对象数组
export default {};
const GETCUSTOMERLIST = function (data) {
return req.post(apis.getCustomerList, data);
};
export default { GETCUSTOMERLIST };
src/api/funcs_modules/index.js
View file @ 2b3df4d2
// 基础模块
import base from "./base";
// 用户状态
import author from "./author";
// 报表api
import bi from "./bi";
// 收费查询api
......@@ -16,6 +18,7 @@ import verification from "./verification";
import welfare from "./welfare";
const funcs = {
...base,
...author,
...bi,
...chargeQuery,
...customer,
......
src/api/request.js
View file @ 2b3df4d2
// axios二次封装
import axios from "axios"; // 引入 axios
import baseUrl from "./env"; // 基础url
// import baseUrl from "./env"; // 基础url
import Vue from "vue";
import code from "./state_code"; // 状态码维护
import store from "@/store";
......@@ -9,7 +9,7 @@ const service = axios.create({
validateStatus(status) {
return status >= 200 && status <= 504; // 合法状态码
},
baseURL: baseUrl, // 基础请求路径
baseURL: process.env.VUE_APP_API, // 基础请求路径
timeout: 10000, // 请求超时
});
// 重复尝试此时
......@@ -30,6 +30,7 @@ service.interceptors.request.use(
config.data = {};
}
}
console.log(config);
return config;
},
(error) => {
......@@ -50,14 +51,11 @@ service.interceptors.response.use(
// 请求失败
reject(response);
} else {
const { returnCode, returnMsg } = response.data || {};
// 判断token有效
const TOKENSTATE = code.TOKEN_INVLIDE_TO_LOGIN(response.data.status);
const TOKENSTATE = code.TOKEN_INVLIDE_TO_LOGIN(returnCode);
// 全局错误拦截
const PUBSTATE = code.PUB_ERR(
response.data.status,
response.data.message,
response.config
);
const PUBSTATE = code.PUB_ERR(returnCode, returnMsg, response.config);
// 请求成功，但逻辑或者业务有错，返回具体数据，根据业务决定是否要提示 有token失效全局异常不返回
if (TOKENSTATE && PUBSTATE) {
resolve(response.data);
......
src/api/state_code.js
View file @ 2b3df4d2
......@@ -6,7 +6,7 @@ let that = new Vue();
// token失效
const TOKEN_INVLIDE_TO_LOGIN = (code) => {
// 状态码判断
if (code) {
if (code === "1012") {
if (store.state.common.userInfo !== "") {
that.$msg.error({
message: "登陆失败",
......@@ -25,7 +25,11 @@ const TOKEN_INVLIDE_TO_LOGIN = (code) => {
};
// 全局错误处理
const PUB_ERR = (code, message, config) => {
if (config.responseType && config.responseType === "blob") {
return true;
}
console.log("错误信息", code, message, config);
return true;
};
export default {
......
src/assets/style/common.css
View file @ 2b3df4d2
li {
list-style: none;
list-style: none;
}
* {
padding: 0;
margin: 0;
padding: 0;
margin: 0;
}
button {
outline: none !important;
outline: none !important;
}
button:focus {
outline: 0 !important;
outline: 0 !important;
}
button::-moz-focus-inner {
border-color: transparent;
border-color: transparent;
}
/*for mozilla*/
.el-drawer {
box-shadow: none !important;
box-shadow: none !important;
}
.text-overOne {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
src/assets/style/common.less
View file @ 2b3df4d2
@import './reset.less';
// 公共样式
li {
list-style: none;
list-style: none;
}
* {
padding: 0;
margin: 0;
}
// * {
// padding: 0;
// margin: 0;
// }
button {
outline: none !important;
outline: none !important;
}
button:focus {
outline: 0 !important;
outline: 0 !important;
}
button::-moz-focus-inner {
border-color: transparent;
border-color: transparent;
}
/*for mozilla*/
.el-drawer {
box-shadow: none !important;
box-shadow: none !important;
}
.mar-left10 {
.mg-l(40);
}
// form部分全局样式重置
.ant-form label{
.fs(19);
}
.ant-calendar-picker {
width: 100%;
}
// 媒体查询
// 文本超长
.too-long(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
width: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
width: @num*0.66px;
}
@media screen and (min-width: 1280px) {
width: @num*0.66px;
}
@media screen and (min-width: 1280px) {
width: @num*0.66px;
}
@media screen and (min-width: 1366px) {
width: @num*0.71px;
}
@media screen and (min-width: 1366px) {
width: @num*0.71px;
}
@media screen and (min-width: 1440px) {
width: @num*0.75px;
}
@media screen and (min-width: 1440px) {
width: @num*0.75px;
}
@media screen and (min-width: 1920px) {
width: @num*1px;
}
@media screen and (min-width: 1920px) {
width: @num*1px;
}
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
// 文本一行显示省略号
.text-overOne {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
// 文本几行显示省略号
.text-n(@num) {
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: @num;
overflow: hidden;
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: @num;
overflow: hidden;
}
// 最小宽
.min-w(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
min-width: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
min-width: @num*0.66px;
}
@media screen and (min-width: 1280px) {
min-width: @num*0.66px;
}
@media screen and (min-width: 1280px) {
min-width: @num*0.66px;
}
@media screen and (min-width: 1366px) {
min-width: @num*0.71px;
}
@media screen and (min-width: 1366px) {
min-width: @num*0.71px;
}
@media screen and (min-width: 1440px) {
min-width: @num*0.75px;
}
@media screen and (min-width: 1440px) {
min-width: @num*0.75px;
}
@media screen and (min-width: 1920px) {
min-width: @num*1px;
}
@media screen and (min-width: 1920px) {
min-width: @num*1px;
}
}
// 最小宽不自适应
.min-w-n(@num) {
min-width: @num*1px;
min-width: @num*1px;
}
//最大宽度
.max-w(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
max-width: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
max-width: @num*0.66px;
}
@media screen and (min-width: 1280px) {
max-width: @num*0.66px;
}
@media screen and (min-width: 1280px) {
max-width: @num*0.66px;
}
@media screen and (min-width: 1366px) {
max-width: @num*0.71px;
}
@media screen and (min-width: 1366px) {
max-width: @num*0.71px;
}
@media screen and (min-width: 1440px) {
max-width: @num*0.75px;
}
@media screen and (min-width: 1440px) {
max-width: @num*0.75px;
}
@media screen and (min-width: 1920px) {
max-width: @num*1px;
}
@media screen and (min-width: 1920px) {
max-width: @num*1px;
}
}
//最大宽度不自适应
.max-w-n(@num) {
max-width: @num*1px;
max-width: @num*1px;
}
//最小高度
.min-h(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
min-height: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
min-height: @num*0.66px;
}
@media screen and (min-width: 1280px) {
min-height: @num*0.66px;
}
@media screen and (min-width: 1280px) {
min-height: @num*0.66px;
}
@media screen and (min-width: 1366px) {
min-height: @num*0.71px;
}
@media screen and (min-width: 1366px) {
min-height: @num*0.71px;
}
@media screen and (min-width: 1440px) {
min-height: @num*0.75px;
}
@media screen and (min-width: 1440px) {
min-height: @num*0.75px;
}
@media screen and (min-width: 1920px) {
min-height: @num*1px;
}
@media screen and (min-width: 1920px) {
min-height: @num*1px;
}
}
//最小高度不自适应
.min-h-n(@num) {
min-height: @num*1px;
min-height: @num*1px;
}
//最大高度
.max-h(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
max-height: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
max-height: @num*0.66px;
}
@media screen and (min-width: 1280px) {
max-height: @num*0.66px;
}
@media screen and (min-width: 1280px) {
max-height: @num*0.66px;
}
@media screen and (min-width: 1366px) {
max-height: @num*0.71px;
}
@media screen and (min-width: 1366px) {
max-height: @num*0.71px;
}
@media screen and (min-width: 1440px) {
max-height: @num*0.75px;
}
@media screen and (min-width: 1440px) {
max-height: @num*0.75px;
}
@media screen and (min-width: 1920px) {
max-height: @num*1px;
}
@media screen and (min-width: 1920px) {
max-height: @num*1px;
}
}
//最大高度不自适应
.max-h-n(@num) {
max-height: @num*1px;
max-height: @num*1px;
}
// 宽度
.w(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
width: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
width: @num*0.66px;
}
@media screen and (min-width: 1280px) {
width: @num*0.66px;
}
@media screen and (min-width: 1280px) {
width: @num*0.66px;
}
@media screen and (min-width: 1366px) {
width: @num*0.71px;
}
@media screen and (min-width: 1366px) {
width: @num*0.71px;
}
@media screen and (min-width: 1440px) {
width: @num*0.75px;
}
@media screen and (min-width: 1440px) {
width: @num*0.75px;
}
@media screen and (min-width: 1920px) {
width: @num*1px;
}
@media screen and (min-width: 1920px) {
width: @num*1px;
}
}
// 宽度不自适应
.w-n(@num) {
width: @num*1px;
width: @num*1px;
}
// 宽度
.w-im(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
width: @num*0.66px !important;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
width: @num*0.66px !important;
}
@media screen and (min-width: 1280px) {
width: @num*0.66px !important;
}
@media screen and (min-width: 1280px) {
width: @num*0.66px !important;
}
@media screen and (min-width: 1366px) {
width: @num*0.71px !important;
}
@media screen and (min-width: 1366px) {
width: @num*0.71px !important;
}
@media screen and (min-width: 1440px) {
width: @num*0.75px !important;
}
@media screen and (min-width: 1440px) {
width: @num*0.75px !important;
}
@media screen and (min-width: 1920px) {
width: @num*1px !important;
}
@media screen and (min-width: 1920px) {
width: @num*1px !important;
}
}
// 宽度优先级不自适应
.w-im-n(@num) {
width: @num*1px !important;
width: @num*1px !important;
}
// 高度
.h(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
height: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
height: @num*0.66px;
}
@media screen and (min-width: 1280px) {
height: @num*0.66px;
}
@media screen and (min-width: 1280px) {
height: @num*0.66px;
}
@media screen and (min-width: 1366px) {
height: @num*0.71px;
}
@media screen and (min-width: 1366px) {
height: @num*0.71px;
}
@media screen and (min-width: 1440px) {
height: @num*0.75px;
}
@media screen and (min-width: 1440px) {
height: @num*0.75px;
}
@media screen and (min-width: 1920px) {
height: @num*1px;
}
@media screen and (min-width: 1920px) {
height: @num*1px;
}
}
// 高度不自适应
.h-n(@num) {
height: @num*1px;
height: @num*1px;
}
// 行高
.lh(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
line-height: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
line-height: @num*0.66px;
}
@media screen and (min-width: 1280px) {
line-height: @num*0.66px;
}
@media screen and (min-width: 1280px) {
line-height: @num*0.66px;
}
@media screen and (min-width: 1366px) {
line-height: @num*0.71px;
}
@media screen and (min-width: 1366px) {
line-height: @num*0.71px;
}
@media screen and (min-width: 1440px) {
line-height: @num*0.75px;
}
@media screen and (min-width: 1440px) {
line-height: @num*0.75px;
}
@media screen and (min-width: 1920px) {
line-height: @num*1px;
}
@media screen and (min-width: 1920px) {
line-height: @num*1px;
}
}
// 行高不自适应
.lh-n(@num) {
line-height: @num*1px;
line-height: @num*1px;
}
// 平均内边距
.pd(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding: @num*0.66px;
}
@media screen and (min-width: 1280px) {
padding: @num*0.66px;
}
@media screen and (min-width: 1280px) {
padding: @num*0.66px;
}
@media screen and (min-width: 1366px) {
padding: @num*0.71px;
}
@media screen and (min-width: 1366px) {
padding: @num*0.71px;
}
@media screen and (min-width: 1440px) {
padding: @num*0.75px;
}
@media screen and (min-width: 1440px) {
padding: @num*0.75px;
}
@media screen and (min-width: 1920px) {
padding: @num*1px;
}
@media screen and (min-width: 1920px) {
padding: @num*1px;
}
}
// 内边距不自适应
.pd-n(@num) {
padding: @num*1px;
padding: @num*1px;
}
// 自定义内边距
.pa(@num1, @num2, @num3, @num4) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding: @num1*0.66px @num2*0.66px @num3*0.66px @num4*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding: @num1*0.66px @num2*0.66px @num3*0.66px @num4*0.66px;
}
@media screen and (min-width: 1280px) {
padding: @num1*0.66px @num2*0.66px @num3*0.66px @num4*0.66px;
}
@media screen and (min-width: 1280px) {
padding: @num1*0.66px @num2*0.66px @num3*0.66px @num4*0.66px;
}
@media screen and (min-width: 1366px) {
padding: @num1*0.71px @num2*0.71px @num3*0.71px @num4*0.71px;
}
@media screen and (min-width: 1366px) {
padding: @num1*0.71px @num2*0.71px @num3*0.71px @num4*0.71px;
}
@media screen and (min-width: 1440px) {
padding: @num1*0.75px @num2*0.75px @num3*0.75px @num4*0.75px;
}
@media screen and (min-width: 1440px) {
padding: @num1*0.75px @num2*0.75px @num3*0.75px @num4*0.75px;
}
@media screen and (min-width: 1920px) {
padding: @num1*1px @num2*1px @num3*1px @num4*1px;
}
@media screen and (min-width: 1920px) {
padding: @num1*1px @num2*1px @num3*1px @num4*1px;
}
}
.pa-n(@num1, @num2, @num3, @num4) {
padding: @num1*1px @num2*1px @num3*1px @num4*1px;
padding: @num1*1px @num2*1px @num3*1px @num4*1px;
}
// 内左边距
.pl(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding-left: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding-left: @num*0.66px;
}
@media screen and (min-width: 1280px) {
padding-left: @num*0.66px;
}
@media screen and (min-width: 1280px) {
padding-left: @num*0.66px;
}
@media screen and (min-width: 1366px) {
padding-left: @num*0.71px;
}
@media screen and (min-width: 1366px) {
padding-left: @num*0.71px;
}
@media screen and (min-width: 1440px) {
padding-left: @num*0.75px;
}
@media screen and (min-width: 1440px) {
padding-left: @num*0.75px;
}
@media screen and (min-width: 1920px) {
padding-left: @num*1px;
}
@media screen and (min-width: 1920px) {
padding-left: @num*1px;
}
}
.pl-n(@num) {
padding-left: @num*1px;
padding-left: @num*1px;
}
// 内右边距
.pr(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding-right: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding-right: @num*0.66px;
}
@media screen and (min-width: 1280px) {
padding-right: @num*0.66px;
}
@media screen and (min-width: 1280px) {
padding-right: @num*0.66px;
}
@media screen and (min-width: 1366px) {
padding-right: @num*0.71px;
}
@media screen and (min-width: 1366px) {
padding-right: @num*0.71px;
}
@media screen and (min-width: 1440px) {
padding-right: @num*0.75px;
}
@media screen and (min-width: 1440px) {
padding-right: @num*0.75px;
}
@media screen and (min-width: 1920px) {
padding-right: @num*1px;
}
@media screen and (min-width: 1920px) {
padding-right: @num*1px;
}
}
.pr-n(@num) {
padding-right: @num*1px;
padding-right: @num*1px;
}
// 内部顶部边距
.pt(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding-top: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding-top: @num*0.66px;
}
@media screen and (min-width: 1280px) {
padding-top: @num*0.66px;
}
@media screen and (min-width: 1280px) {
padding-top: @num*0.66px;
}
@media screen and (min-width: 1366px) {
padding-top: @num*0.71px;
}
@media screen and (min-width: 1366px) {
padding-top: @num*0.71px;
}
@media screen and (min-width: 1440px) {
padding-top: @num*0.75px;
}
@media screen and (min-width: 1440px) {
padding-top: @num*0.75px;
}
@media screen and (min-width: 1920px) {
padding-top: @num*1px;
}
@media screen and (min-width: 1920px) {
padding-top: @num*1px;
}
}
.pt-n(@num) {
padding-top: @num*1px;
padding-top: @num*1px;
}
// 内下边距
.pb(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding-bottom: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
padding-bottom: @num*0.66px;
}
@media screen and (min-width: 1280px) {
padding-bottom: @num*0.66px;
}
@media screen and (min-width: 1280px) {
padding-bottom: @num*0.66px;
}
@media screen and (min-width: 1366px) {
padding-bottom: @num*0.71px;
}
@media screen and (min-width: 1366px) {
padding-bottom: @num*0.71px;
}
@media screen and (min-width: 1440px) {
padding-bottom: @num*0.75px;
}
@media screen and (min-width: 1440px) {
padding-bottom: @num*0.75px;
}
@media screen and (min-width: 1920px) {
padding-bottom: @num*1px;
}
@media screen and (min-width: 1920px) {
padding-bottom: @num*1px;
}
}
.pb-n(@num) {
padding-bottom: @num*1px;
padding-bottom: @num*1px;
}
// 外边距
.mg-l(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin-left: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin-left: @num*0.66px;
}
@media screen and (min-width: 1280px) {
margin-left: @num*0.66px;
}
@media screen and (min-width: 1280px) {
margin-left: @num*0.66px;
}
@media screen and (min-width: 1366px) {
margin-left: @num*0.71px;
}
@media screen and (min-width: 1366px) {
margin-left: @num*0.71px;
}
@media screen and (min-width: 1440px) {
margin-left: @num*0.75px;
}
@media screen and (min-width: 1440px) {
margin-left: @num*0.75px;
}
@media screen and (min-width: 1920px) {
margin-left: @num*1px;
}
@media screen and (min-width: 1920px) {
margin-left: @num*1px;
}
}
// 外边距
.mg-l-n(@num) {
margin-left: @num*1px;
margin-left: @num*1px;
}
// 上边距
.mg-t(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin-top: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin-top: @num*0.66px;
}
@media screen and (min-width: 1280px) {
margin-top: @num*0.66px;
}
@media screen and (min-width: 1280px) {
margin-top: @num*0.66px;
}
@media screen and (min-width: 1366px) {
margin-top: @num*0.71px;
}
@media screen and (min-width: 1366px) {
margin-top: @num*0.71px;
}
@media screen and (min-width: 1440px) {
margin-top: @num*0.75px;
}
@media screen and (min-width: 1440px) {
margin-top: @num*0.75px;
}
@media screen and (min-width: 1920px) {
margin-top: @num*1px;
}
@media screen and (min-width: 1920px) {
margin-top: @num*1px;
}
}
// 取消自适应
.mg-t-n(@num) {
margin-top: @num*1px;
margin-top: @num*1px;
}
// 右边距
.mg-r(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin-right: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin-right: @num*0.66px;
}
@media screen and (min-width: 1280px) {
margin-right: @num*0.66px;
}
@media screen and (min-width: 1280px) {
margin-right: @num*0.66px;
}
@media screen and (min-width: 1366px) {
margin-right: @num*0.71px;
}
@media screen and (min-width: 1366px) {
margin-right: @num*0.71px;
}
@media screen and (min-width: 1440px) {
margin-right: @num*0.75px;
}
@media screen and (min-width: 1440px) {
margin-right: @num*0.75px;
}
@media screen and (min-width: 1920px) {
margin-right: @num*1px;
}
@media screen and (min-width: 1920px) {
margin-right: @num*1px;
}
}
.mg-r-n(@num) {
margin-right: @num*1px;
margin-right: @num*1px;
}
// 下边距
.mg-b(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin-bottom: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin-bottom: @num*0.66px;
}
@media screen and (min-width: 1280px) {
margin-bottom: @num*0.66px;
}
@media screen and (min-width: 1280px) {
margin-bottom: @num*0.66px;
}
@media screen and (min-width: 1366px) {
margin-bottom: @num*0.71px;
}
@media screen and (min-width: 1366px) {
margin-bottom: @num*0.71px;
}
@media screen and (min-width: 1440px) {
margin-bottom: @num*0.75px;
}
@media screen and (min-width: 1440px) {
margin-bottom: @num*0.75px;
}
@media screen and (min-width: 1920px) {
margin-bottom: @num*1px;
}
@media screen and (min-width: 1920px) {
margin-bottom: @num*1px;
}
}
//下边距取消适应
.mg-b-n(@num) {
margin-bottom: @num*1px;
margin-bottom: @num*1px;
}
// 平均边距
.mg(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin: @num*0.66px;
}
@media screen and (min-width: 1280px) {
margin: @num*0.66px;
}
@media screen and (min-width: 1280px) {
margin: @num*0.66px;
}
@media screen and (min-width: 1366px) {
margin: @num*0.71px;
}
@media screen and (min-width: 1366px) {
margin: @num*0.71px;
}
@media screen and (min-width: 1440px) {
margin: @num*0.75px;
}
@media screen and (min-width: 1440px) {
margin: @num*0.75px;
}
@media screen and (min-width: 1920px) {
margin: @num*1px;
}
@media screen and (min-width: 1920px) {
margin: @num*1px;
}
}
// 平均边距取消适应
.mg-n(@num) {
margin: @num*1px;
margin: @num*1px;
}
// 下边距
.mg-t(@num, @num1) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin: @num*0.66px @num1*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin: @num*0.66px @num1*0.66px;
}
@media screen and (min-width: 1280px) {
margin: @num*0.66px @num1*0.66px;
}
@media screen and (min-width: 1280px) {
margin: @num*0.66px @num1*0.66px;
}
@media screen and (min-width: 1366px) {
margin: @num*0.71px @num1*0.71px;
}
@media screen and (min-width: 1366px) {
margin: @num*0.71px @num1*0.71px;
}
@media screen and (min-width: 1440px) {
margin: @num*0.75px @num1*0.75px;
}
@media screen and (min-width: 1440px) {
margin: @num*0.75px @num1*0.75px;
}
@media screen and (min-width: 1920px) {
margin: @num*1px @num1*1px;
}
@media screen and (min-width: 1920px) {
margin: @num*1px @num1*1px;
}
}
.mg-t-n(@num, @num1) {
margin: @num*1px @num1*1px;
margin: @num*1px @num1*1px;
}
// 自定义四边距
.mg-f(@num, @num1, @num2, @num3) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin: @num*0.66px @num1*0.66px @num2*0.66px @num3*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
margin: @num*0.66px @num1*0.66px @num2*0.66px @num3*0.66px;
}
@media screen and (min-width: 1280px) {
margin: @num*0.66px @num1*0.66px @num2*0.66px @num3*0.66px;
}
@media screen and (min-width: 1280px) {
margin: @num*0.66px @num1*0.66px @num2*0.66px @num3*0.66px;
}
@media screen and (min-width: 1366px) {
margin: @num*0.71px @num1*0.71px @num2*0.71px @num3*0.71px;
}
@media screen and (min-width: 1366px) {
margin: @num*0.71px @num1*0.71px @num2*0.71px @num3*0.71px;
}
@media screen and (min-width: 1440px) {
margin: @num*0.75px @num1*0.75px @num2*0.75px @num3*0.75px;
}
@media screen and (min-width: 1440px) {
margin: @num*0.75px @num1*0.75px @num2*0.75px @num3*0.75px;
}
@media screen and (min-width: 1920px) {
margin: @num*1px @num1*1px @num2*1px @num3*1px;
}
@media screen and (min-width: 1920px) {
margin: @num*1px @num1*1px @num2*1px @num3*1px;
}
}
// 取消边距适配
.mg-f-n(@num, @num1, @num2, @num3) {
margin: @num*1px @num1*1px @num2*1px @num3*1px;
margin: @num*1px @num1*1px @num2*1px @num3*1px;
}
// 左侧
.l(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
left: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
left: @num*0.66px;
}
@media screen and (min-width: 1280px) {
left: @num*0.66px;
}
@media screen and (min-width: 1280px) {
left: @num*0.66px;
}
@media screen and (min-width: 1366px) {
left: @num*0.71px;
}
@media screen and (min-width: 1366px) {
left: @num*0.71px;
}
@media screen and (min-width: 1440px) {
left: @num*0.75px;
}
@media screen and (min-width: 1440px) {
left: @num*0.75px;
}
@media screen and (min-width: 1920px) {
left: @num*1px;
}
@media screen and (min-width: 1920px) {
left: @num*1px;
}
}
.l-n(@num) {
left: @num*1px;
left: @num*1px;
}
// 右侧
.r(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
right: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
right: @num*0.66px;
}
@media screen and (min-width: 1280px) {
right: @num*0.66px;
}
@media screen and (min-width: 1280px) {
right: @num*0.66px;
}
@media screen and (min-width: 1366px) {
right: @num*0.71px;
}
@media screen and (min-width: 1366px) {
right: @num*0.71px;
}
@media screen and (min-width: 1440px) {
right: @num*0.75px;
}
@media screen and (min-width: 1440px) {
right: @num*0.75px;
}
@media screen and (min-width: 1920px) {
right: @num*1px;
}
@media screen and (min-width: 1920px) {
right: @num*1px;
}
}
.r-n(@num) {
right: @num*1px;
right: @num*1px;
}
// 顶部
.t(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
top: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
top: @num*0.66px;
}
@media screen and (min-width: 1280px) {
top: @num*0.66px;
}
@media screen and (min-width: 1280px) {
top: @num*0.66px;
}
@media screen and (min-width: 1366px) {
top: @num*0.71px;
}
@media screen and (min-width: 1366px) {
top: @num*0.71px;
}
@media screen and (min-width: 1440px) {
top: @num*0.75px;
}
@media screen and (min-width: 1440px) {
top: @num*0.75px;
}
@media screen and (min-width: 1920px) {
top: @num*1px;
}
@media screen and (min-width: 1920px) {
top: @num*1px;
}
}
// 取消适配
.t-n(@num) {
top: @num*1px;
top: @num*1px;
}
// 底部
.b(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
bottom: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
bottom: @num*0.66px;
}
@media screen and (min-width: 1280px) {
bottom: @num*0.66px;
}
@media screen and (min-width: 1280px) {
bottom: @num*0.66px;
}
@media screen and (min-width: 1366px) {
bottom: @num*0.71px;
}
@media screen and (min-width: 1366px) {
bottom: @num*0.71px;
}
@media screen and (min-width: 1440px) {
bottom: @num*0.75px;
}
@media screen and (min-width: 1440px) {
bottom: @num*0.75px;
}
@media screen and (min-width: 1920px) {
bottom: @num*1px;
}
@media screen and (min-width: 1920px) {
bottom: @num*1px;
}
}
// 取消适配
.b-n(@num) {
bottom: @num*1px;
bottom: @num*1px;
}
// 边框
.bd(@type, @size, @c) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
border: @type @size*0.66px @c;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
border: @type @size*0.66px @c;
}
@media screen and (min-width: 1280px) {
border: @type @size*0.66px @c;
}
@media screen and (min-width: 1280px) {
border: @type @size*0.66px @c;
}
@media screen and (min-width: 1366px) {
border: @type @size*0.71px @c;
}
@media screen and (min-width: 1366px) {
border: @type @size*0.71px @c;
}
@media screen and (min-width: 1440px) {
border: @type @size*0.75px @c;
}
@media screen and (min-width: 1440px) {
border: @type @size*0.75px @c;
}
@media screen and (min-width: 1920px) {
border: @type @size*1px @c;
}
@media screen and (min-width: 1920px) {
border: @type @size*1px @c;
}
}
// 边框顶部
.bd-t(@type, @size, @c) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
border-top: @type @size*0.66px @c;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
border-top: @type @size*0.66px @c;
}
@media screen and (min-width: 1280px) {
border-top: @type @size*0.66px @c;
}
@media screen and (min-width: 1280px) {
border-top: @type @size*0.66px @c;
}
@media screen and (min-width: 1366px) {
border-top: @type @size*0.71px @c;
}
@media screen and (min-width: 1366px) {
border-top: @type @size*0.71px @c;
}
@media screen and (min-width: 1440px) {
border-top: @type @size*0.75px @c;
}
@media screen and (min-width: 1440px) {
border-top: @type @size*0.75px @c;
}
@media screen and (min-width: 1920px) {
border-top: @type @size*1px @c;
}
@media screen and (min-width: 1920px) {
border-top: @type @size*1px @c;
}
}
// 右边框
.bd-r(@type, @size, @c) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
border-right: @type @size*0.66px @c;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
border-right: @type @size*0.66px @c;
}
@media screen and (min-width: 1280px) {
border-right: @type @size*0.66px @c;
}
@media screen and (min-width: 1280px) {
border-right: @type @size*0.66px @c;
}
@media screen and (min-width: 1366px) {
border-right: @type @size*0.71px @c;
}
@media screen and (min-width: 1366px) {
border-right: @type @size*0.71px @c;
}
@media screen and (min-width: 1440px) {
border-right: @type @size*0.75px @c;
}
@media screen and (min-width: 1440px) {
border-right: @type @size*0.75px @c;
}
@media screen and (min-width: 1920px) {
border-right: @type @size*1px @c;
}
@media screen and (min-width: 1920px) {
border-right: @type @size*1px @c;
}
}
// 取消适配
.bd-r-n(@num) {
border-radius: @num*1px;
border-radius: @num*1px;
}
// 左边框
.bd-l(@type, @size, @c) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
border-left: @type @size*0.66px @c;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
border-left: @type @size*0.66px @c;
}
@media screen and (min-width: 1280px) {
border-left: @type @size*0.66px @c;
}
@media screen and (min-width: 1280px) {
border-left: @type @size*0.66px @c;
}
@media screen and (min-width: 1366px) {
border-left: @type @size*0.71px @c;
}
@media screen and (min-width: 1366px) {
border-left: @type @size*0.71px @c;
}
@media screen and (min-width: 1440px) {
border-left: @type @size*0.75px @c;
}
@media screen and (min-width: 1440px) {
border-left: @type @size*0.75px @c;
}
@media screen and (min-width: 1920px) {
border-left: @type @size*1px @c;
}
@media screen and (min-width: 1920px) {
border-left: @type @size*1px @c;
}
}
// 下边框
.bd-b(@type, @size, @c) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
border-bottom: @type @size*0.66px @c;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
border-bottom: @type @size*0.66px @c;
}
@media screen and (min-width: 1280px) {
border-bottom: @type @size*0.66px @c;
}
@media screen and (min-width: 1280px) {
border-bottom: @type @size*0.66px @c;
}
@media screen and (min-width: 1366px) {
border-bottom: @type @size*0.71px @c;
}
@media screen and (min-width: 1366px) {
border-bottom: @type @size*0.71px @c;
}
@media screen and (min-width: 1440px) {
border-bottom: @type @size*0.75px @c;
}
@media screen and (min-width: 1440px) {
border-bottom: @type @size*0.75px @c;
}
@media screen and (min-width: 1920px) {
border-bottom: @type @size*1px @c;
}
@media screen and (min-width: 1920px) {
border-bottom: @type @size*1px @c;
}
}
.bd-b-n(@type, @size, @c) {
border-bottom: @type @size*1px @c;
border-bottom: @type @size*1px @c;
}
// 边框圆角
.bd-rd(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
border-radius: @num*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
border-radius: @num*0.66px;
}
@media screen and (min-width: 1280px) {
border-radius: @num*0.66px;
}
@media screen and (min-width: 1280px) {
border-radius: @num*0.66px;
}
@media screen and (min-width: 1366px) {
border-radius: @num*0.71px;
}
@media screen and (min-width: 1366px) {
border-radius: @num*0.71px;
}
@media screen and (min-width: 1440px) {
border-radius: @num*0.75px;
}
@media screen and (min-width: 1440px) {
border-radius: @num*0.75px;
}
@media screen and (min-width: 1920px) {
border-radius: @num*1px;
}
@media screen and (min-width: 1920px) {
border-radius: @num*1px;
}
}
// 阴影
.shadow(@p1, @p2, @p3, @p4, @p5) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
box-shadow: @p1*0.66px @p2*0.66px @p3*0.66px @p4*0.66px @p5;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
box-shadow: @p1*0.66px @p2*0.66px @p3*0.66px @p4*0.66px @p5;
}
@media screen and (min-width: 1280px) {
box-shadow: @p1*0.66px @p2*0.66px @p3*0.66px @p4*0.66px @p5;
}
@media screen and (min-width: 1280px) {
box-shadow: @p1*0.66px @p2*0.66px @p3*0.66px @p4*0.66px @p5;
}
@media screen and (min-width: 1366px) {
box-shadow: @p1*0.71px @p2*0.71px @p3*0.71px @p4*0.71px @p5;
}
@media screen and (min-width: 1366px) {
box-shadow: @p1*0.71px @p2*0.71px @p3*0.71px @p4*0.71px @p5;
}
@media screen and (min-width: 1440px) {
box-shadow: @p1*0.75px @p2*0.75px @p3*0.75px @p4*0.75px @p5;
}
@media screen and (min-width: 1440px) {
box-shadow: @p1*0.75px @p2*0.75px @p3*0.75px @p4*0.75px @p5;
}
@media screen and (min-width: 1920px) {
box-shadow: @p1*1px @p2*1px @p3*1px @p4*1px @p5;
}
@media screen and (min-width: 1920px) {
box-shadow: @p1*1px @p2*1px @p3*1px @p4*1px @p5;
}
}
//字体大小
.fs(@size) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
font-size: @size*0.66px;
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
font-size: @size*0.66px;
}
@media screen and (min-width: 1280px) {
font-size: @size*0.66px;
}
@media screen and (min-width: 1280px) {
font-size: @size*0.66px;
}
@media screen and (min-width: 1366px) {
font-size: @size*0.71px;
}
@media screen and (min-width: 1366px) {
font-size: @size*0.71px;
}
@media screen and (min-width: 1440px) {
font-size: @size*0.75px;
}
@media screen and (min-width: 1440px) {
font-size: @size*0.75px;
}
@media screen and (min-width: 1920px) {
font-size: @size*1px;
}
@media screen and (min-width: 1920px) {
font-size: @size*1px;
}
}
// flex左对齐
.flex-l() {
display: flex;
justify-content: flex-start;
align-items: center;
display: flex;
justify-content: flex-start;
align-items: center;
}
// flex居中
.flex-c() {
display: flex;
justify-content: center;
align-items: center;
display: flex;
justify-content: center;
align-items: center;
}
// flex右对齐
.flex-r() {
display: flex;
justify-content: flex-end;
align-items: center;
display: flex;
justify-content: flex-end;
align-items: center;
}
// flex平均对齐
.flex-bt() {
display: flex;
justify-content: space-between;
align-items: center;
display: flex;
justify-content: space-between;
align-items: center;
}
// 数字
.trans-x(@num) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
-webkit-transform: translateX(@num * 0.66px);
transform: translateX(@num * 0.66px);
}
@media screen and (min-width: 1280px) {
-webkit-transform: translateX(@num * 0.66px);
transform: translateX(@num * 0.66px);
}
@media screen and (min-width: 1366px) {
-webkit-transform: translateX(@num * 0.71px);
transform: translateX(@num * 0.71px);
}
@media screen and (min-width: 1440px) {
-webkit-transform: translateX(@num * 0.75px);
transform: translateX(@num * 0.75px);
}
@media screen and (min-width: 1920px) {
-webkit-transform: translateX(@num * 1px);
transform: translateX(@num * 1px);
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
-webkit-transform: translateX(@num * 0.66px);
transform: translateX(@num * 0.66px);
}
@media screen and (min-width: 1280px) {
-webkit-transform: translateX(@num * 0.66px);
transform: translateX(@num * 0.66px);
}
@media screen and (min-width: 1366px) {
-webkit-transform: translateX(@num * 0.71px);
transform: translateX(@num * 0.71px);
}
@media screen and (min-width: 1440px) {
-webkit-transform: translateX(@num * 0.75px);
transform: translateX(@num * 0.75px);
}
@media screen and (min-width: 1920px) {
-webkit-transform: translateX(@num * 1px);
transform: translateX(@num * 1px);
}
}
// 宽度计算
.w-m(@value, @value1) {
@media screen and (min-width: 0px) and (max-width: 1280px) {
width: calc(@value - @value1 * 0.66px);
}
@media screen and (min-width: 0px) and (max-width: 1280px) {
width: calc(@value - @value1 * 0.66px);
}
@media screen and (min-width: 1280px) {
width: calc(@value - @value1 * 0.66px);
}
@media screen and (min-width: 1280px) {
width: calc(@value - @value1 * 0.66px);
}
@media screen and (min-width: 1366px) {
width: calc(@value - @value1 * 0.71px);
}
@media screen and (min-width: 1366px) {
width: calc(@value - @value1 * 0.71px);
}
@media screen and (min-width: 1440px) {
width: calc(@value - @value1 * 0.75px);
}
@media screen and (min-width: 1440px) {
width: calc(@value - @value1 * 0.75px);
}
@media screen and (min-width: 1920px) {
width: calc(@value - @value1 * 1px);
}
@media screen and (min-width: 1920px) {
width: calc(@value - @value1 * 1px);
}
}
// 固定定位
.p-f() {
position: fixed;
position: fixed;
}
// 绝对定位
.p-a() {
position: absolute;
position: absolute;
}
// 相对定位
.p-r() {
position: relative;
position: relative;
}
src/assets/style/reset.less 0 → 100644
View file @ 2b3df4d2
html,
body,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
// outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
// box-sizing: border-box;
}
body {
line-height: 1;
height: auto;
}
:focus {
outline: 1;
}
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary {
display: block;
}
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: "";
content: none;
}
a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
ins {
background-color: #ff9;
color: #000;
text-decoration: none;
}
mark {
background-color: #ff9;
color: #000;
font-style: italic;
font-weight: bold;
}
del {
text-decoration: line-through;
}
abbr[title],
dfn[title] {
border-bottom: 1px dotted #000;
cursor: help;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #cccccc;
margin: 1em 0;
padding: 0;
}
input,
select {
vertical-align: middle;
}
src/components/Antd/index.js
View file @ 2b3df4d2
import Vue from "vue";
import { Button, Input, notification, menu, dropdown } from "ant-design-vue";
import {
Button,
Input,
Select,
DatePicker,
notification,
menu,
dropdown,
FormModel,
Row,
Col,
Table,
InputNumber,
message,
} from "ant-design-vue";
export default () => {
let els = [Button, Input, notification, menu, dropdown];
let els = [
Button,
Input,
notification,
menu,
dropdown,
FormModel,
Row,
Col,
Select,
DatePicker,
Table,
InputNumber,
message,
];
// 注册
els.forEach((item) => {
Vue.use(item);
});
// 全局提示
Vue.prototype.$msg = notification;
Vue.prototype.$message = message;
};
src/components/Lodash/index.js
View file @ 2b3df4d2
import { after } from "lodash";
import { after, cloneDeep } from "lodash";
import Vue from "vue";
let lodashs = { after };
let lodashs = { after, cloneDeep };
export default () => {
Vue.prototype.$lodash = lodashs;
};
src/router/index.js
View file @ 2b3df4d2
......@@ -4,6 +4,8 @@ import RouterGuard from "./router.config";
Vue.use(VueRouter);
// 布局容器
import Layout from "../views/layout/index.vue";
// 登录模块
import author from "./modules/author";
// 客户管理
import customer from "./modules/customer";
// 福利信息管理
......@@ -26,7 +28,7 @@ const routes = [
children: [
{
path: "/",
redirect: "/customer",
redirect: "/login",
},
customer,
welfare,
......@@ -37,6 +39,7 @@ const routes = [
bi,
],
},
author,
];
const router = new VueRouter({
......
src/router/modules/author.js 0 → 100644
View file @ 2b3df4d2
export default {
path: "/",
component: () => {
return import(/* webpackChunkName: "bi" */ "@/views/author");
},
children: [
{
path: "login",
name: "login",
component: () => import("@/views/author/login"),
},
{
path: "forget",
name: "forget",
component: () => import("@/views/author/forget"),
},
],
};
src/router/modules/customer.js
View file @ 2b3df4d2
// 客户信息路由表,分包名称:customer
export default {
path: "/customer",
name: "Customer",
redirect: "/customer/info",
component: () => {
return import(/* webpackChunkName: "customer" */ "@/views/customer");
},
children: [
{
path: "info",
name: "CustomerInfo",
component: () => import("@/views/customer/info"),
},
],
};
src/router/modules/menu.js
View file @ 2b3df4d2
export default [
{
icon: "ssiuser",
path: "customer",
path: "1",
title: "客户信息",
children: [
{
path: "/customer",
path: "/customer/info",
title: "客户信息明细",
},
{
......
src/router/router.config.js
View file @ 2b3df4d2
......@@ -15,12 +15,10 @@ export default (VueRouter, router) => {
// 页面路由切换时进度条
// let router = new VueRouter();
router.beforeEach((to, from, next) => {
console.log(to.path);
NProgress.start();
next();
});
router.afterEach(() => {
console.log("done");
NProgress.done();
});
};
src/views/author/forget.vue 0 → 100644
View file @ 2b3df4d2
<template>
<div class="forget">
<h2 class="title">商保管理系统</h2>
<div class="content">
<p class="module-title">
<router-link to="/login" replace>密码登录</router-link>
<span class="_forget">忘记密码</span>
</p>
<div class="steps">
<div :class="{ 'step-item': true, 'step-active': activeStep === '1' }">
<div class="_flex">
<p class="circle">1</p>
<p class="line"></p>
</div>
<p>验证邮箱</p>
</div>
<div :class="{ 'step-item': true, 'step-active': activeStep === '2' }">
<div class="_flex">
<p class="line"></p>
<p class="circle">2</p>
</div>
<p>填写新密码</p>
</div>
</div>
<a-form-model ref="form" :model="form" :rules="formRules">
<div v-if="activeStep === '1'">
<a-form-model-item prop="userName">
<a-input
size="large"
v-model="form.userName"
placeholder="请输入邮箱"
></a-input>
</a-form-model-item>
<a-form-model-item prop="verificationCode">
<a-input
size="large"
v-model="form.verificationCode"
placeholder="请输入验证码"
>
<a-button type="primary" slot="addonAfter" @click="getVerifyCode"
>发送验证码至邮箱</a-button
>
</a-input>
</a-form-model-item>
<a-form-model-item>
<a-button size="large" type="primary" block @click="handlerNext"
>下一步</a-button
>
</a-form-model-item>
</div>
<div v-if="activeStep === '2'">
<a-form-model-item prop="passWord">
<a-input
size="large"
type="password"
v-model="form.passWord"
placeholder="请输入新密码"
></a-input>
</a-form-model-item>
<a-form-model-item prop="newPwd">
<a-input
size="large"
type="password"
v-model="form.newPwd"
placeholder="再次输入新密码"
></a-input>
</a-form-model-item>
<a-form-model-item>
<a-button size="large" type="primary" block @click="handlerReset"
>确定重置密码</a-button
>
</a-form-model-item>
</div>
</a-form-model>
</div>
</div>
</template>
<script>
export default {
data() {
return {
activeStep: "1",
form: {},
formRules: {
userName: [{ required: true, message: "请输入邮箱" }],
passWord: [{ required: true, message: "请输入密码" }],
newPwd: [
{ required: true, message: "请再次输入新密码" },
{ validator: this.isSamePwd },
],
verificationCode: [{ required: true, message: "请输入验证码" }],
},
verifyImg: "",
};
},
mounted() {
// this._getVerifyImg();
},
methods: {
isSamePwd(rule, value, callback) {
if (value && this.form.passWord) {
if (value !== this.form.passWord) {
return callback(new Error("两次密码输入不一致"));
}
}
callback();
},
getVerifyCode() {
this.$refs.form.validateField(["userName"], (valid) => {
if (valid) {
return false;
}
const data = {
userName: this.form.userName,
};
this._getVerifyEmail(data);
});
},
handlerNext() {
this.$refs.form.validateField(
["userName", "verificationCode"],
(valid) => {
if (valid) {
return false;
}
this.activeStep = "2";
}
);
},
handlerReset() {
this.$refs.form.validate((valid) => {
if (!valid) {
return false;
}
const { userName, verificationCode, newPwd } = this.form;
this._reset({ userName, verificationCode, newPwd });
});
},
_getVerifyEmail(data) {
this.$apis.GETVERIFYEMAIL(data).then((res) => {
if (res.returnCode === "0000") {
this.$message.success(res.returnMsg || "发送成功");
} else {
this.$message.error(res.returnMsg || "发送失败");
}
});
},
_reset(data) {
this.$apis.RESETPASSWORD(data).then((res) => {
if (res.returnCode === "0000") {
this.$message.success(res.returnMsg || "修改成功");
this.$router.replace("/login");
} else {
this.$message.error(res.returnMsg || "修改失败");
}
});
},
},
};
</script>
<style lang="less" scoped>
.forget {
.title {
position: absolute;
top: 0;
left: 50%;
.fs(21);
.lh(29);
color: #fff;
.pa(20, 17, 20, 17);
transform: translate(-50%, -50%);
background-color: #2b63ff;
&::before,
&::after {
content: "";
position: absolute;
top: 0;
.h(69);
.bd-t(solid, 35, transparent);
.bd-b(solid, 35, transparent);
}
&::before {
.l(-20);
.bd-r(solid, 20, #2b63ff);
}
&::after {
.r(-20);
.bd-l(solid, 20, #2b63ff);
}
}
.steps {
.pa(18, 37, 32, 37);
display: flex;
.step-item {
.fs(14);
width: 50%;
opacity: 0.4;
&:first-child {
._flex {
.mg-l(20);
}
}
&:last-child {
text-align: right;
._flex {
.mg-r(20);
}
}
}
._flex {
display: flex;
align-items: center;
.circle {
.w(27);
.h(27);
.fs(12);
.lh(27);
.mg-b(4);
text-align: center;
color: #fff;
background-color: #373842;
border-radius: 50%;
}
.line {
flex: 1;
.h(3);
background-color: #373842;
}
}
.step-active {
opacity: 1;
}
}
.module-title {
.fs(19);
.lh(29);
.mg-b(32);
a {
color: #373842;
opacity: 0.4;
}
._forget {
float: right;
font-weight: bold;
.fs(21);
color: #373842;
}
}
.ant-button {
.mg-t(13);
}
}
</style>
src/views/author/index.vue 0 → 100644
View file @ 2b3df4d2
<template>
<div class="author">
<div class="content">
<h1 class="title">欢迎登陆商保管理系统</h1>
<router-view></router-view>
</div>
</div>
</template>
<script>
export default {};
</script>
<style lang="less" scoped>
.author {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
background: url("../../assets/image/login_bg.png") center center no-repeat;
background-size: 100% 100%;
.title {
.fs(120);
.lh(168);
.pb(90);
color: #fff;
}
.login,
.forget {
.w(525);
.bd-rd(27);
.pa(50, 63, 10, 63);
margin: 0 auto;
position: relative;
background-color: #fff;
}
input {
background-color: #f8fafb;
}
}
</style>
<style lang="less">
.forget,
.login {
.ant-input-group > .ant-input {
background-color: #f8fafb;
}
}
</style>
src/views/author/login.vue 0 → 100644
View file @ 2b3df4d2
<template>
<div class="login">
<h2 class="title">商保管理系统</h2>
<div class="content">
<p class="module-title">
<span>密码登录</span>
<router-link class="_forget" to="/forget" replace>忘记密码</router-link>
</p>
<a-form-model ref="form" :model="form" :rules="formRules">
<a-form-model-item prop="userName">
<a-input
size="large"
v-model="form.userName"
placeholder="请输入用户名"
></a-input>
</a-form-model-item>
<a-form-model-item prop="passWord">
<a-input
size="large"
type="password"
v-model="form.passWord"
placeholder="请输入密码"
></a-input>
</a-form-model-item>
<a-form-model-item prop="verificationCode">
<a-input
size="large"
v-model="form.verificationCode"
placeholder="请输入验证码"
>
<img
:src="verifyImg"
class="verify-img"
@click="_getVerifyImg"
slot="addonAfter"
/>
</a-input>
</a-form-model-item>
<a-form-model-item>
<a-button size="large" type="primary" block @click="handlerLogin"
>登录</a-button
>
</a-form-model-item>
</a-form-model>
</div>
</div>
</template>
<script>
export default {
data() {
return {
form: {},
formRules: {
userName: [{ required: true, message: "请输入用户名" }],
passWord: [{ required: true, message: "请输入密码" }],
verificationCode: [{ required: true, message: "请输入验证码" }],
},
verifyImg: "",
};
},
mounted() {
this._getVerifyImg();
},
methods: {
handlerLogin() {
this.$refs.form.validate((valid) => {
if (!valid) {
return false;
}
this._login();
});
},
_getVerifyImg() {
this.$apis.GETVERIFYIMG().then((res) => {
const url = window.URL.createObjectURL(res);
this.verifyImg = url || "";
});
},
_login() {
this.$apis.LOGIN(this.form).then((res) => {
console.log(res);
if (res.returnCode === "0000") {
console.log(res.content);
this.$router.replace("/customer");
} else {
this.$message.error(res.returnMsg || "出现错误");
this.form.verificationCode = "";
this._getVerifyImg();
}
});
},
},
};
</script>
<style lang="less" scoped>
.login {
.title {
position: absolute;
top: 0;
left: 50%;
.fs(21);
.lh(29);
color: #fff;
.pa(20, 17, 20, 17);
transform: translate(-50%, -50%);
background-color: #2b63ff;
&::before,
&::after {
content: "";
position: absolute;
top: 0;
.h(69);
.bd-t(solid, 35, transparent);
.bd-b(solid, 35, transparent);
}
&::before {
.l(-20);
.bd-r(solid, 20, #2b63ff);
}
&::after {
.r(-20);
.bd-l(solid, 20, #2b63ff);
}
}
.module-title {
.fs(21);
.lh(29);
.mg-b(32);
color: #373842;
font-weight: bold;
._forget {
float: right;
.fs(19);
font-weight: normal;
color: #373842;
opacity: 0.4;
}
}
.ant-button {
.mg-t(13);
}
.verify-img {
cursor: pointer;
}
}
</style>
src/views/customer/index.vue
View file @ 2b3df4d2
<template>
<div class="index">
<!-- 客户信息 -->
客户信息
<!-- 客户信息
<a-button>按钮</a-button>
<a-input placeholder="按需"></a-input>
<a-button @click="() => openNotificationWithIcon('success')">
......@@ -14,7 +14,8 @@
<a-button @click="() => openNotificationWithIcon('error')">
Error
</a-button>
<Icon :name="'ssisuccess'" :size="50" />
<Icon :name="'ssisuccess'" :size="50" /> -->
<router-view></router-view>
</div>
</template>
......
src/views/customer/info/index.vue 0 → 100644
View file @ 2b3df4d2
<template>
<div class="custom-info">
<!-- form -->
<a-form-model ref="form" layout="vertical" :model="form">
<a-row :gutter="40">
<a-col :xl="6" :sm="8">
<a-form-model-item label="病历号码">
<a-input
v-model="form.mrnNo"
size="large"
placeholder="请输入病历号"
></a-input>
</a-form-model-item>
</a-col>
<a-col :xl="6" :sm="8">
<a-form-model-item label="客户姓名">
<a-input
v-model="form.patientName"
size="large"
placeholder="请输入客户姓名"
></a-input>
</a-form-model-item>
</a-col>
<a-col :xl="6" :sm="8">
<a-form-model-item label="出生日期">
<a-date-picker
v-model="form.birthday"
size="large"
placeholder="请选择出生日期"
></a-date-picker>
</a-form-model-item>
</a-col>
<a-col :xl="6" :sm="8">
<a-form-model-item label="保险公司">
<a-select
v-model="form.payorId"
size="large"
placeholder="请选择保险公司"
>
<a-select-option v-for="item in companyCode" :key="item.code">
{{ item.name }}
</a-select-option>
</a-select>
</a-form-model-item>
</a-col>
<a-col :xl="6" :sm="8">
<a-form-model-item label="保单号码">
<a-input
v-model="form.policyNo"
size="large"
placeholder="请输入保单号码"
></a-input>
</a-form-model-item>
</a-col>
<a-col :xl="18" :sm="16" class="none-label">
<a-form-model-item label="button">
<a-button size="large" type="primary">新建客户信息</a-button>
<a-button
size="large"
class="mar-left10"
type="primary"
@click="handlerSearch"
>查询</a-button
>
</a-form-model-item>
</a-col>
</a-row>
</a-form-model>
<!-- table -->
<a-table
:columns="columns"
:data-source="dataList"
size="large"
row-key="mrnNo"
:pagination="pagination"
@change="onChange"
>
<template slot="operation" slot-scope="">
<a-button size="large" type="link">修改</a-button>
</template>
</a-table>
</div>
</template>
<script>
export default {
data() {
const columns = [
{ title: "病历号", dataIndex: "mrnNo", width: 120 },
{ title: "客户姓名", dataIndex: "patientName", width: 120 },
{ title: "出生日期", dataIndex: "birthday", width: 120 },
{ title: "性别", dataIndex: "sex", width: 60 },
{ title: "保险公司", dataIndex: "payorId", width: 120 },
{ title: "保单号码", dataIndex: "policyNo", width: 120 },
{ title: "保险有效日期", dataIndex: "startDate", width: 120 },
{ title: "保险终止日期", dataIndex: "endDate", width: 120 },
{
title: "操作",
key: "operation",
align: "center",
width: "90px",
scopedSlots: { customRender: "operation" },
},
];
return {
columns,
form: {},
pageForm: {},
companyCode: [],
dataList: [],
pager: {
pageNum: 1,
pageSize: 1,
},
total: 0,
};
},
mounted() {
this._getCustomerList();
},
computed: {
pagination() {
const { pageNum, pageSize } = this.pager;
const pages = Math.ceil(this.total / pageSize);
return {
current: pageNum,
size: "large",
position: "bottom",
align: "right",
hideOnSinglePage: false,
itemRender: (current, type, originalElement) => {
originalElement.children = undefined;
if (type === "prev") {
originalElement.text = "上一页";
}
if (type === "page") {
return (
<p>
<span class="current-page">{current}</span> / {pages}
</p>
);
}
if (type === "next") {
originalElement.text = "下一页";
return (
<div>
{originalElement}
<a-input-number
onblur={this.onShowSizeChange}
class="size-change"
></a-input-number>
</div>
);
}
return originalElement;
},
};
},
},
methods: {
onChange(pager) {
console.log(pager);
const { current } = pager;
this.apger.pageNum = current;
},
onShowSizeChange(e) {
e && e.stopPropagation();
console.log(e);
},
handlerSearch() {
console.log(this.$refs.form.validate);
this.$refs.form.validate((valid) => {
if (!valid) {
return false;
}
this.pager.pageNum = 1;
this.pageForm = this.$lodash.cloneDeep(this.form);
this._getCustomerList();
});
},
_getCustomerList() {
const data = {
...this.pageForm,
...this.pager,
};
this.$apis.GETCUSTOMERLIST(data).then((res) => {
this.dataList = (res.content && res.content.list) || [];
this.total = (res.content && res.content.total) || 0;
});
},
},
};
</script>
<style lang="less" scoped>
.custom-info {
.pa(40, 48, 67, 52);
background-color: #fff;
}
.none-label {
text-align: right;
.ant-form-item-label {
opacity: 0;
}
}
.current-page {
color: #4d7cfe;
}
.size-change {
.w(107);
.mg-l(40);
background-color: #f8fafb;
border: none;
}
</style>
<style lang="less">
.none-label {
.ant-form-item-label {
opacity: 0;
}
}
.custom-info {
.ant-pagination-item-active {
.fs(16);
border: none;
// vertical-align: baseline;
}
.ant-pagination-item-link {
.fs(16);
.lh(22);
.pa(7, 15, 7, 15);
display: inline-block;
background-color: #f8fafb;
border: none;
}
}
</style>
src/views/layout/components/Header.vue
View file @ 2b3df4d2
......@@ -15,7 +15,7 @@
<Icon v-else :name="'ssiuser'" :size="32" />
</div>
<a-menu slot="overlay">
<a-menu-item key="1"> 退出登录 </a-menu-item>
<a-menu-item key="1" @click="loginOut"> 退出登录 </a-menu-item>
</a-menu>
</a-dropdown>
</div>
......@@ -36,6 +36,15 @@ export default {
getPopupContainer() {
return document.querySelector(".avator");
},
loginOut() {
this.$apis.LOGINOUT().then((res) => {
if (res.returnCode) {
this.$router.push("/login");
} else {
this.$message.error(res.returnMsg || "退出失败");
}
});
},
},
};
</script>
......
src/views/layout/components/menu/index.js
View file @ 2b3df4d2
......@@ -60,6 +60,7 @@ export default {
break;
}
} else if (item.path && item.path === key) {
console.log(item, key);
menuStack.push(item);
this.$store.dispatch("common/setMenuStack", menuStack);
return true;
......
vue.config.js
View file @ 2b3df4d2
......@@ -48,10 +48,10 @@ module.exports = {
port: 8888,
hot: true,
proxy: {
"/dev": {
target: "http://www.jd.com",
"^/dev": {
target: "http://47.99.75.3:8070",
pathRewrite: {
"/dev": "",
"^/dev": "/",
},
changeOrigin: true,
secure: false,
......
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