joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

desc: 修改eslint 配置 保存

Browse Source
This commit is contained in:
zyy 2019-07-04 10:59:40 +08:00
parent 06003c8068
commit d4191832fb
28 changed files with 1162 additions and 1110 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
.eslintrc.js
View File

@ -10,7 +10,6 @@ module.exports = {
es6: true, es6: true,
}, },
extends: ['plugin:vue/recommended', 'eslint:recommended'], extends: ['plugin:vue/recommended', 'eslint:recommended'],
// add your custom rules here // add your custom rules here
//it is base on https://github.com/vuejs/eslint-config-vue //it is base on https://github.com/vuejs/eslint-config-vue
rules: { rules: {
@ -26,10 +25,7 @@ module.exports = {
"vue/name-property-casing": ["error", "PascalCase"], "vue/name-property-casing": ["error", "PascalCase"],
"vue/no-v-html": "off", "vue/no-v-html": "off",
'accessor-pairs': 2, 'accessor-pairs': 2,
'arrow-spacing': [2, { "arrow-spacing": 0,//=>的前/后括号
'before': true,
'after': true
}],
'block-spacing': [2, 'always'], 'block-spacing': [2, 'always'],
'brace-style': [2, '1tbs', { 'brace-style': [2, '1tbs', {
'allowSingleLine': true 'allowSingleLine': true
@ -47,7 +43,7 @@ module.exports = {
'curly': [2, 'multi-line'], 'curly': [2, 'multi-line'],
'dot-location': [2, 'property'], 'dot-location': [2, 'property'],
'eol-last': 2, 'eol-last': 2,
'eqeqeq': ["error", "always", { "null": "ignore" }], // 'eqeqeq': ["error", "always", { "null": "ignore" }], // 全等
'generator-star-spacing': [2, { 'generator-star-spacing': [2, {
'before': true, 'before': true,
'after': true 'after': true
@ -63,10 +59,7 @@ module.exports = {
'before': true, 'before': true,
'after': true 'after': true
}], }],
'new-cap': [2, { "new-cap": 2,//函数名首行大写必须使用new方式调用，首行小写必须用不带new方式调用
'newIsCap': true,
'capIsNew': false
}],
'new-parens': 2, 'new-parens': 2,
'no-array-constructor': 2, 'no-array-constructor': 2,
'no-caller': 2, 'no-caller': 2,
@ -94,7 +87,7 @@ module.exports = {
'no-implied-eval': 2, 'no-implied-eval': 2,
'no-inner-declarations': [2, 'functions'], 'no-inner-declarations': [2, 'functions'],
'no-invalid-regexp': 2, 'no-invalid-regexp': 2,
'no-irregular-whitespace': 2, 'no-irregular-whitespace': 2, //不能有不规则的空格
'no-iterator': 2, 'no-iterator': 2,
'no-label-var': 2, 'no-label-var': 2,
'no-labels': [2, { 'no-labels': [2, {
@ -102,8 +95,8 @@ module.exports = {
'allowSwitch': false 'allowSwitch': false
}], }],
'no-lone-blocks': 2, 'no-lone-blocks': 2,
'no-mixed-spaces-and-tabs': 2, "no-mixed-spaces-and-tabs": [2, false],//禁止混用tab和空格
'no-multi-spaces': 2, "no-multi-spaces": 1,//不能用多余的空格
'no-multi-str': 2, 'no-multi-str': 2,
'no-multiple-empty-lines': [2, { 'no-multiple-empty-lines': [2, {
'max': 1 'max': 1
@ -126,11 +119,11 @@ module.exports = {
'no-self-compare': 2, 'no-self-compare': 2,
'no-sequences': 2, 'no-sequences': 2,
'no-shadow-restricted-names': 2, 'no-shadow-restricted-names': 2,
'no-spaced-func': 2, 'no-spaced-func': 2,//函数调用时 函数名与()之间不能有空格
'no-sparse-arrays': 2, 'no-sparse-arrays': 2,
'no-this-before-super': 2, 'no-this-before-super': 2,
'no-throw-literal': 2, 'no-throw-literal': 2,
'no-trailing-spaces': 2, "no-trailing-spaces": 1,//一行结束后面不要有空格
'no-undef': 2, 'no-undef': 2,
'no-undef-init': 2, 'no-undef-init': 2,
'no-unexpected-multiline': 2, 'no-unexpected-multiline': 2,
@ -159,38 +152,37 @@ module.exports = {
':': 'before' ':': 'before'
} }
}], }],
'padded-blocks': [2, 'never'], "padded-blocks": 0,//块语句内行首行尾是否要空行
'quotes': [2, 'single', { 'quotes': [2, 'single', {
'avoidEscape': true, 'avoidEscape': true,
'allowTemplateLiterals': true 'allowTemplateLiterals': true
}], }],
'semi': [2, 'never'], 'semi': [2, 'always'], //语句强制分号结尾
'semi-spacing': [2, { 'semi-spacing': [2, {
'before': false, 'before': false,
'after': true 'after': true
}], }],
'space-before-blocks': [2, 'always'], "strict": 2,//使用严格模式
'space-before-function-paren': [2, 'never'], 'space-before-blocks': [2, 'always'], //不以新行开始的块{前面要不要有空格
'space-in-parens': [2, 'never'], "space-before-function-paren": [0, "always"],//函数定义时括号前面要不要有空格
'space-infix-ops': 2, "space-in-parens": [0, "never"],//小括号里面要不要有空格
"space-infix-ops": 0,//中缀操作符周围要不要有空格
'space-unary-ops': [2, { 'space-unary-ops': [2, {
'words': true, 'words': true,
'nonwords': false 'nonwords': false
}], }], //一元运算符的前/后要要加空格
'spaced-comment': [2, 'always', { 'spaced-comment': [2, 'always', {
'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ','] 'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']
}], }], //注释风格要不要有空格什么的
'template-curly-spacing': [2, 'never'], 'template-curly-spacing': [2, 'never'],
'use-isnan': 2, 'use-isnan': 2, //禁止比较时使用NaN，只能用isNaN()
'valid-typeof': 2, 'valid-typeof': 2, //必须使用合法的typeof的值
'wrap-iife': [2, 'any'], "wrap-iife": [2, "inside"],//立即执行函数表达式的小括号风格
'yield-star-spacing': [2, 'both'], 'yield-star-spacing': [2, 'both'],
'yoda': [2, 'never'], 'yoda': [2, 'never'], //禁止尤达条件
'prefer-const': 2, 'prefer-const': 2,
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
'object-curly-spacing': [2, 'always', { "object-curly-spacing": [0, "never"],//大括号内是否允许不必要的空格
objectsInObjects: false "array-bracket-spacing": [2, "never"], //是否允许非空数组里面有多余的空格
}],
'array-bracket-spacing': [2, 'never']
} }
} }

4
src/jmap/config/deviceModel.js
View File

@ -1,9 +1,9 @@
import deviceType from "./deviceType"; import deviceType from './deviceType';
const deviceModel = {}; const deviceModel = {};
/** link字段配置*/ /** link字段配置*/
deviceModel[deviceType.Link] = { deviceModel[deviceType.Link] = {
} };
export default deviceModel; export default deviceModel;

6
src/jmap/config/deviceState.js
View File

@ -1,14 +1,14 @@
import deviceType from './deviceType'; import deviceType from './deviceType';
const deviceState = {} const deviceState = {};
/** link状态配置*/ /** link状态配置*/
deviceState[deviceType.Link] = { deviceState[deviceType.Link] = {
status: { status: {
Default: '01', // 01默认状态 Default: '01', // 01默认状态
State01: '01', // 01状态 State01: '01', // 01状态
State02: '02', //02状态 State02: '02' // 02状态
}
} }
};
export default deviceState; export default deviceState;

8
src/jmap/config/deviceStyle.js
View File

@ -3,15 +3,15 @@ import deviceType from './deviceType';
const deviceStyle = { const deviceStyle = {
Global: { Global: {
textFontSize: '8.2', textFontSize: '8.2',
backgroundColor: '#000000', backgroundColor: '#000000'
}
} }
};
/** link风格配置*/ /** link风格配置*/
deviceStyle[deviceType.Link] = { deviceStyle[deviceType.Link] = {
linkColor: 'red', linkColor: 'red',
linkWidth: 8, linkWidth: 8,
linkTextColor: '#FFFFFF', linkTextColor: '#FFFFFF'
} };
export default deviceStyle; export default deviceStyle;

4
src/jmap/config/deviceType.js
View File

@ -4,7 +4,7 @@ const deviceType = {
Signal: 'Signal', Signal: 'Signal',
Station: 'Station', Station: 'Station',
StationControl: 'StationControl', StationControl: 'StationControl',
StationStand: 'StationStand', StationStand: 'StationStand'
} };
export default deviceType; export default deviceType;

6
src/jmap/map.js
View File

@ -49,14 +49,14 @@ class Jmap {
} }
loaddefaultState() { loaddefaultState() {
let defaultStateDict = {}; const defaultStateDict = {};
Object.keys(deviceState).forEach(type => { Object.keys(deviceState).forEach(type => {
defaultStateDict[type] = {}; defaultStateDict[type] = {};
Object.keys(deviceState[type] || {}).forEach(state => { Object.keys(deviceState[type] || {}).forEach(state => {
defaultStateDict[type][state] = deviceState[type][state].Default; defaultStateDict[type][state] = deviceState[type][state].Default;
}) });
}) });
return defaultStateDict; return defaultStateDict;
} }

37
src/jmap/maps.js
View File

@ -12,7 +12,7 @@ class Jmaps {
this._dependencies = { zrender: '4.0.6' }; this._dependencies = { zrender: '4.0.6' };
this.instances = {} this.instances = {};
} }
init(opts) { init(opts) {
@ -21,12 +21,13 @@ class Jmaps {
} }
if (__DEV__) { if (__DEV__) {
// 判断版本
if ((zrender.version.replace('.', '') - 0) < (this._dependencies.zrender.replace('.', '') - 0)) { if ((zrender.version.replace('.', '') - 0) < (this._dependencies.zrender.replace('.', '') - 0)) {
throw new Error( throw new Error(
'zrender/src ' + zrender.version 'zrender/src ' + zrender.version +
+ ' is too old for ECharts ' + version ' is too old for ECharts ' + zrender.version +
+ '. Current version need ZRender ' '. Current version need ZRender ' +
+ this._dependencies.zrender + '+' this._dependencies.zrender + '+'
); );
} }
@ -39,7 +40,7 @@ class Jmaps {
} }
} }
let existInstance = this.getInstanceByDom(opts.dom); const existInstance = this.getInstanceByDom(opts.dom);
if (existInstance) { if (existInstance) {
if (__DEV__) { if (__DEV__) {
console.warn('There is a chart instance already initialized on the dom.'); console.warn('There is a chart instance already initialized on the dom.');
@ -48,21 +49,18 @@ class Jmaps {
} }
if (__DEV__) { if (__DEV__) {
if (zrUtil.isDom(opts.dom) if (zrUtil.isDom(opts.dom) &&
&& opts.dom.nodeName.toUpperCase() !== 'CANVAS' opts.dom.nodeName.toUpperCase() !== 'CANVAS' &&
&& ( ((!opts.dom.clientWidth && (!opts || opts.width == null)) || (!opts.dom.clientHeight && (!opts || opts.height == null)))
(!opts.dom.clientWidth && (!opts || opts.width == null))
|| (!opts.dom.clientHeight && (!opts || opts.height == null))
)
) { ) {
console.warn('Can\'t get DOM width or height. Please check ' console.warn('Can\'t get DOM width or height. Please check ' +
+ 'dom.clientWidth and dom.clientHeight. They should not be 0.' 'dom.clientWidth and dom.clientHeight. They should not be 0.' +
+ 'For example, you may need to call this in the callback ' 'For example, you may need to call this in the callback ' +
+ 'of window.onload.'); 'of window.onload.');
} }
} }
let jmap = new Jmap(opts); const jmap = new Jmap(opts);
this.instances[opts.id] = jmap; this.instances[opts.id] = jmap;
@ -89,9 +87,8 @@ class Jmaps {
dispose(jmap) { dispose(jmap) {
if (typeof jmap === 'string') { if (typeof jmap === 'string') {
jmap = instances[jmap]; jmap = this.instances[jmap];
} } else if (!(jmap instanceof Jmap)) {
else if (!(jmap instanceof Jmap)) {
jmap = this.getInstanceByDom(jmap); jmap = this.getInstanceByDom(jmap);
} }
if ((jmap instanceof Jmap) && !jmap.isDisposed()) { if ((jmap instanceof Jmap) && !jmap.isDisposed()) {

24
src/jmap/painter.js
View File

@ -45,10 +45,10 @@ class Painter {
// 添加子级图层 // 添加子级图层
Object.values(deviceType).forEach(type => { Object.values(deviceType).forEach(type => {
let level = new Group({ name: `__${type}__` }) const level = new Group({ name: `__${type}__` });
this.viewLevelMap[type] = level; this.viewLevelMap[type] = level;
this.parentLevel.add(level); this.parentLevel.add(level);
}) });
} }
/** /**
@ -65,12 +65,12 @@ class Painter {
// 清空图层 // 清空图层
Object.values(this.viewLevelMap).forEach(level => { Object.values(this.viewLevelMap).forEach(level => {
level && level.removeAll(); level && level.removeAll();
}) });
// 创建视图 // 创建视图
Object.values(mapDevice).forEach(device => { Object.values(mapDevice).forEach(device => {
device && this.add(device); device && this.add(device);
}) });
} }
/** /**
@ -86,9 +86,9 @@ class Painter {
* @param {*} device * @param {*} device
*/ */
add(device) { add(device) {
let type = device._type; const type = device._type;
let code = device._code; const code = device._code;
let view = shapefactory(type, device, this.styleMap); const view = shapefactory(type, device, this.styleMap);
if (view) { if (view) {
this.viewInstance[code] = view; this.viewInstance[code] = view;
this.viewLevelMap[type].add(view); this.viewLevelMap[type].add(view);
@ -100,9 +100,9 @@ class Painter {
* @param {*} device * @param {*} device
*/ */
delete(device) { delete(device) {
let code = device._code; const code = device._code;
let type = device._type; const type = device._type;
let view = this.viewInstance[code]; const view = this.viewInstance[code];
if (view) { if (view) {
this.viewLevelMap[type].remove(view); this.viewLevelMap[type].remove(view);
delete this.viewInstance[code]; delete this.viewInstance[code];
@ -114,8 +114,8 @@ class Painter {
* @param {*} device * @param {*} device
*/ */
update(device) { update(device) {
let code = device._code; const code = device._code;
let view = this.viewInstance[code]; const view = this.viewInstance[code];
if (view) { if (view) {
view.setStatus(device); view.setStatus(device);
} }

8
src/jmap/proxyHandle.js
View File

@ -5,24 +5,24 @@ class ProxyHandle {
} }
set(target, code, device) { set(target, code, device) {
let reflect = Reflect.set(target, code, device); const reflect = Reflect.set(target, code, device);
this.$painter.update(device); this.$painter.update(device);
return reflect; return reflect;
} }
get(target, code) { get(target, code) {
let reflect = Reflect.get(target, code); const reflect = Reflect.get(target, code);
return reflect; return reflect;
} }
has(target, code) { has(target, code) {
let reflect = Reflect.has(target, code); const reflect = Reflect.has(target, code);
this.$painter.add(device); this.$painter.add(device);
return reflect; return reflect;
} }
deletecodeerty(target, code) { deletecodeerty(target, code) {
let reflect = Reflect.deletecodeerty(target, code); const reflect = Reflect.deletecodeerty(target, code);
this.$painter.delete(device); this.$painter.delete(device);
return reflect; return reflect;
} }

10
src/jmap/shape/Link.js
View File

@ -1,6 +1,6 @@
import Line from 'zrender/src/graphic/shape/Line'; import Line from 'zrender/src/graphic/shape/Line';
import Group from 'zrender/src/container/Group'; import Group from 'zrender/src/container/Group';
import { stat } from 'fs'; // import { stat } from 'fs';
class Link extends Group { class Link extends Group {
constructor({ _code, _type, zlevel, model, state }, style) { constructor({ _code, _type, zlevel, model, state }, style) {
@ -15,8 +15,8 @@ class Link extends Group {
} }
create() { create() {
let model = this.model; const model = this.model;
let style = this.style; const style = this.style;
let textPosition = 'insideBottom'; let textPosition = 'insideBottom';
if (model.beg.x !== model.end.x && model.beg.y !== model.end.y) { if (model.beg.x !== model.end.x && model.beg.y !== model.end.y) {
@ -29,7 +29,7 @@ class Link extends Group {
x1: model.beg.x, x1: model.beg.x,
y1: model.beg.y, y1: model.beg.y,
x2: model.end.x, x2: model.end.x,
y2: model.end.y, y2: model.end.y
}, },
style: { style: {
lineWidth: style.Link.linkWidth, lineWidth: style.Link.linkWidth,
@ -40,7 +40,7 @@ class Link extends Group {
textAlign: 'middle', textAlign: 'middle',
fontSize: style.Global.textFontSize, fontSize: style.Global.textFontSize,
textFill: style.Link.linkTextColor, textFill: style.Link.linkTextColor,
textStroke: style.Global.backgroundColor, textStroke: style.Global.backgroundColor
} }
}); });

3
src/jmap/shape/factory.js
View File

@ -6,10 +6,11 @@ const mapShape = {};
mapShape[deviceType.Link] = Link; mapShape[deviceType.Link] = Link;
function shapefactory(type, device, style) { function shapefactory(type, device, style) {
let shape = mapShape[type]; const shape = mapShape[type];
if (shape instanceof Function) { if (shape instanceof Function) {
return new shape(device, style); return new shape(device, style);
} }
} }
export default shapefactory export default shapefactory
;

3
src/jmap/utils/dev.js
View File

@ -3,9 +3,8 @@ var dev;
// In browser // In browser
if (typeof window !== 'undefined') { if (typeof window !== 'undefined') {
dev = window.__DEV__; dev = window.__DEV__;
} } else if (typeof global !== 'undefined') {
// In node // In node
else if (typeof global !== 'undefined') {
dev = global.__DEV__; dev = global.__DEV__;
} }

4
src/jmap/utils/parser.js
View File

@ -7,11 +7,11 @@ function deviceFactory(type, defaultStateDict, elem, zlevel) {
_code: elem.code, _code: elem.code,
model: elem, model: elem,
state: Object.assign({}, defaultStateDict[type]) state: Object.assign({}, defaultStateDict[type])
} };
} }
function parser(data, defaultStateDict) { function parser(data, defaultStateDict) {
let mapDevice = {}; const mapDevice = {};
if (data) { if (data) {
(data.linkList || []).forEach(elem => { (data.linkList || []).forEach(elem => {

4
src/layout1/components/AppMain.vue
View File

@ -11,10 +11,10 @@ export default {
name: 'AppMain', name: 'AppMain',
computed: { computed: {
key() { key() {
return this.$route.fullPath return this.$route.fullPath;
}
} }
} }
};
</script> </script>
<style scoped> <style scoped>

31
src/main.js
View File

@ -1,36 +1,35 @@
import Vue from 'vue' import Vue from 'vue';
import 'normalize.css/normalize.css' // A modern alternative to CSS resets import 'normalize.css/normalize.css'; // A modern alternative to CSS resets
import ElementUI from 'element-ui' import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css' import 'element-ui/lib/theme-chalk/index.css';
// import locale from 'element-ui/lib/locale/lang/en' // lang i18n // import locale from 'element-ui/lib/locale/lang/en' // lang i18n
import '@/styles/index.scss' // global css import '@/styles/index.scss'; // global css
import App from './App' import App from './App';
import store from './store' import store from './store';
import router from './router' import router from './router';
import '@/icons' // icon import '@/icons'; // icon
import '@/permission' // permission control import '@/permission'; // permission control
import '@/scripts/GlobalPlugin' import '@/scripts/GlobalPlugin';
Vue.use(ElementUI) Vue.use(ElementUI);
Vue.config.productionTip = false Vue.config.productionTip = false;
new Vue({ new Vue({
el: '#app', el: '#app',
router, router,
store, store,
render: h => h(App) render: h => h(App)
}) });
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
let name = to.fullPath; const name = to.fullPath;
if (name.includes('/dp/') || name.includes('display/dp')) { if (name.includes('/dp/') || name.includes('display/dp')) {
document.title = '琏课堂-大屏系统'; document.title = '琏课堂-大屏系统';
} else if (name.includes('/plan/') || name.includes('/planEdit/')) { } else if (name.includes('/plan/') || name.includes('/planEdit/')) {

20
src/mixin/WindowResizeHandler.js
View File

@ -1,11 +1,11 @@
import * as throttleUtil from '@/utils/throttle' import * as throttleUtil from '@/utils/throttle';
export default { export default {
data() { data() {
return { return {
_clientWidth: '', _clientWidth: '',
_clientHeight: '' _clientHeight: ''
} };
}, },
beforeMount() { beforeMount() {
// 调用节流函数限制执行频率 // 调用节流函数限制执行频率
@ -14,22 +14,22 @@ export default {
'_resizeHandler', '_resizeHandler',
300, 300,
'debounce' 'debounce'
) );
window.addEventListener('resize', fn) window.addEventListener('resize', fn);
}, },
mounted() { mounted() {
this._resizeHandler() this._resizeHandler();
}, },
methods: { methods: {
_resizeHandler() { _resizeHandler() {
this._clientWidth = document.documentElement.clientWidth this._clientWidth = document.documentElement.clientWidth;
this._clientHeight = document.documentElement.clientHeight this._clientHeight = document.documentElement.clientHeight;
if (this.resizeHandler) { if (this.resizeHandler) {
this.resizeHandler() this.resizeHandler();
} }
} }
}, },
beforeDestroy() { beforeDestroy() {
window.removeEventListener('resize', this._resizeHandler) window.removeEventListener('resize', this._resizeHandler);
}
} }
};

10
src/permission.js
View File

@ -28,14 +28,14 @@ function getRouteInfo(to) {
let loginPath = '/'; let loginPath = '/';
let getTokenInfo = () => { }; let getTokenInfo = () => { };
let clientId = ''; let clientId = '';
let toRoutePath = to.redirectedFrom || to.path; const toRoutePath = to.redirectedFrom || to.path;
if (/^\/dp/.test(toRoutePath) || /^\/display\/dp/.test(toRoutePath)) { if (/^\/dp/.test(toRoutePath) || /^\/display\/dp/.test(toRoutePath)) {
loginPath = loginScreenPage loginPath = loginScreenPage;
getTokenInfo = getScreenToken; getTokenInfo = getScreenToken;
clientId = LoginParams.DaPing.clientId; clientId = LoginParams.DaPing.clientId;
} else if (/^\/plan/.test(toRoutePath) || /^\/display\/plan/.test(toRoutePath) || /^\/planEdit/.test(toRoutePath)) { } else if (/^\/plan/.test(toRoutePath) || /^\/display\/plan/.test(toRoutePath) || /^\/planEdit/.test(toRoutePath)) {
loginPath = loginPlanPage loginPath = loginPlanPage;
getTokenInfo = getPlanToken; getTokenInfo = getPlanToken;
clientId = LoginParams.LianJiHua.clientId; clientId = LoginParams.LianJiHua.clientId;
} else { } else {
@ -44,7 +44,7 @@ function getRouteInfo(to) {
clientId = null; clientId = null;
} }
return { clientId, loginPath, getTokenInfo } return { clientId, loginPath, getTokenInfo };
} }
function handleRoute(to, from, next, routeInfo) { function handleRoute(to, from, next, routeInfo) {
@ -82,7 +82,7 @@ function handleRoute(to, from, next, routeInfo) {
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
NProgress.start(); NProgress.start();
let routeInfo = getRouteInfo(to); const routeInfo = getRouteInfo(to);
if (routeInfo.getTokenInfo()) { if (routeInfo.getTokenInfo()) {
// 已登录 // 已登录
if (to.path === routeInfo.loginPath) { if (to.path === routeInfo.loginPath) {

19
src/router/index.js
View File

@ -1,10 +1,10 @@
import Vue from 'vue' import Vue from 'vue';
import Router from 'vue-router' import Router from 'vue-router';
Vue.use(Router) Vue.use(Router);
/* Layout */ /* Layout */
import Layout from '@/layout' import Layout from '@/layout';
/** /**
* Note: sub-menu only appear when route children.length >= 1 * Note: sub-menu only appear when route children.length >= 1
@ -37,7 +37,6 @@ export const userSimulation = '013'; // 仿真系统
export const userScreen = '014'; // 大屏系统 export const userScreen = '014'; // 大屏系统
export const userPlan = '015'; // 计划系统 export const userPlan = '015'; // 计划系统
export const UrlConfig = { export const UrlConfig = {
display: '/display', display: '/display',
examRuleDraft: '/examRule/draft', examRuleDraft: '/examRule/draft',
@ -85,7 +84,7 @@ export const constantRoutes = [
meta: { title: '首页', icon: 'dashboard' } meta: { title: '首页', icon: 'dashboard' }
}] }]
} }
] ];
export const asyncRouter = [ export const asyncRouter = [
{ {
@ -105,14 +104,14 @@ export const asyncRouter = [
}, },
{ path: '*', redirect: '/404', hidden: true } { path: '*', redirect: '/404', hidden: true }
] ];
const createRouter = () => new Router({ const createRouter = () => new Router({
mode: 'history', // require service support mode: 'history', // require service support
scrollBehavior: () => ({ y: 0 }), scrollBehavior: () => ({ y: 0 }),
routes: constantRoutes routes: constantRoutes
}) });
const router = createRouter() const router = createRouter();
export default router export default router;

2
src/settings.js
View File

@ -13,4 +13,4 @@ module.exports = {
* @description Whether show the logo in sidebar * @description Whether show the logo in sidebar
*/ */
sidebarLogo: false sidebarLogo: false
} };

56
src/views/components/drapLeft/index.vue
View File

@ -10,8 +10,8 @@
</template> </template>
<script> <script>
import WindowResizeHandler from '@/mixin/WindowResizeHandler' import WindowResizeHandler from '@/mixin/WindowResizeHandler';
import localStore from 'storejs' import localStore from 'storejs';
export default { export default {
name: 'DrapLeft', name: 'DrapLeft',
@ -44,52 +44,52 @@ export default {
return { return {
height: 0, height: 0,
widthLefts: 0 widthLefts: 0
} };
}, },
mounted() { mounted() {
const oDiv = this.$refs.drapBox const oDiv = this.$refs.drapBox;
oDiv.onmousedown = () => { oDiv.onmousedown = () => {
return false return false;
} };
}, },
methods: { methods: {
resizeHandler: function() { resizeHandler: function() {
this.height = this._clientHeight this.height = this._clientHeight;
}, },
mousedown(e) { mousedown(e) {
const oDiv = this.$refs.drapBox const oDiv = this.$refs.drapBox;
const maxNum = this.max || 850 const maxNum = this.max || 850;
const minNum = this.min || 150 const minNum = this.min || 150;
oDiv.onmousedown = function() { oDiv.onmousedown = function() {
return false return false;
} };
e.stopPropagation() e.stopPropagation();
window.event.cancelBubble = true window.event.cancelBubble = true;
const odiv = e.target const odiv = e.target;
const disX = e.clientX - odiv.offsetLeft const disX = e.clientX - odiv.offsetLeft;
document.onmousemove = (e) => { document.onmousemove = (e) => {
let left = e.clientX - disX let left = e.clientX - disX;
if (left > maxNum) { if (left > maxNum) {
left = maxNum left = maxNum;
} else if (left < minNum) { } else if (left < minNum) {
left = minNum left = minNum;
}
odiv.style.left = left + 'px'
this.$emit('drapWidth', left)
this.widthLefts = left
} }
odiv.style.left = left + 'px';
this.$emit('drapWidth', left);
this.widthLefts = left;
};
document.onmouseup = (e) => { document.onmouseup = (e) => {
if (this.isSave) { if (this.isSave) {
if (this.widthLefts > minNum) { // 左侧菜单宽度必须大于150 才可以设置 if (this.widthLefts > minNum) { // 左侧菜单宽度必须大于150 才可以设置
localStore('LeftWidth', JSON.stringify(this.widthLefts)) localStore('LeftWidth', JSON.stringify(this.widthLefts));
}
}
document.onmousemove = null
document.onmouseup = null
} }
} }
document.onmousemove = null;
document.onmouseup = null;
};
} }
} }
};
</script> </script>
<style> <style>
.drapWidth { .drapWidth {

9
src/views/jmap/index.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div :id="id" style="background: #000;"></div> <div :id="id" style="background: #000;" />
</template> </template>
<script> <script>
@ -12,7 +12,7 @@
id: '__jmap__', id: '__jmap__',
jmap: null, jmap: null,
jmaps: null jmaps: null
} };
}, },
mounted() { mounted() {
this.jmaps = new Jmaps(); this.jmaps = new Jmaps();
@ -24,10 +24,11 @@
height: document.documentElement.clientHeight height: document.documentElement.clientHeight
} }
}); });
console.log(this.jmap);
this.jmap.loadData('01', this.jmap.loadData('01',
{ {
linkList: [ linkList: [
{ code: '1', beg: { x: 200, y: 200 }, end: { x: 400, y: 200 } }, { code: '31', beg: { x: 200, y: 200 }, end: { x: 400, y: 200 } },
{ code: '2', beg: { x: 200, y: 300 }, end: { x: 400, y: 300 } } { code: '2', beg: { x: 200, y: 300 }, end: { x: 400, y: 300 } }
] ]
} }
@ -36,7 +37,7 @@
methods: { methods: {
} }
} };
</script> </script>
<style rel="stylesheet/scss" lang="scss"> <style rel="stylesheet/scss" lang="scss">

60
src/views/login/index.vue
View File

@ -1,26 +1,38 @@
<template> <template>
<div class="login-container"> <div class="login-container">
<el-form class="login-form" autoComplete="on" :model="loginForm" :rules="loginRules" ref="loginForm" <el-form
label-position="left"> ref="loginForm"
class="login-form"
auto-complete="on"
:model="loginForm"
:rules="loginRules"
label-position="left"
>
<h3 class="title">用户登陆</h3> <h3 class="title">用户登陆</h3>
<el-form-item prop="username"> <el-form-item prop="username">
<span class="svg-container svg-container_login"> <span class="svg-container svg-container_login">
<svg-icon icon-class="user" /> <svg-icon icon-class="user" />
</span> </span>
<el-input name="username" type="text" v-model="loginForm.username" autoComplete="on" placeholder="username" /> <el-input v-model="loginForm.username" name="username" type="text" auto-complete="on" placeholder="username" />
</el-form-item> </el-form-item>
<el-form-item prop="password"> <el-form-item prop="password">
<span class="svg-container"> <span class="svg-container">
<svg-icon icon-class="password"></svg-icon> <svg-icon icon-class="password" />
</span> </span>
<el-input name="password" :type="pwdType" @keyup.enter.native="handleLogin" v-model="loginForm.password" <el-input
autoComplete="on" placeholder="password"></el-input> v-model="loginForm.password"
name="password"
:type="pwdType"
auto-complete="on"
placeholder="password"
@keyup.enter.native="handleLogin"
/>
<span class="show-pwd" @click="showPwd"> <span class="show-pwd" @click="showPwd">
<svg-icon icon-class="eye" /> <svg-icon icon-class="eye" />
</span> </span>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<span class="svg-container"> </span> <span class="svg-container" />
<el-radio>琏课堂</el-radio> <el-radio>琏课堂</el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@ -37,22 +49,22 @@
import localStore from 'storejs'; import localStore from 'storejs';
export default { export default {
name: 'login', name: 'Login',
data() { data() {
const validateUsername = (rule, value, callback) => { const validateUsername = (rule, value, callback) => {
if (value.length < 5) { if (value.length < 5) {
callback(new Error('请输入正确的用户名')) callback(new Error('请输入正确的用户名'));
} else { } else {
callback() callback();
}
} }
};
const validatePass = (rule, value, callback) => { const validatePass = (rule, value, callback) => {
if (value.length < 5) { if (value.length < 5) {
callback(new Error('密码不能小于5位')) callback(new Error('密码不能小于5位'));
} else { } else {
callback() callback();
}
} }
};
return { return {
loginForm: { loginForm: {
username: '', username: '',
@ -64,7 +76,7 @@
}, },
loading: false, loading: false,
pwdType: 'password' pwdType: 'password'
} };
}, },
mounted() { mounted() {
document.title = '琏课堂'; document.title = '琏课堂';
@ -72,15 +84,15 @@
methods: { methods: {
showPwd() { showPwd() {
if (this.pwdType === 'password') { if (this.pwdType === 'password') {
this.pwdType = '' this.pwdType = '';
} else { } else {
this.pwdType = 'password' this.pwdType = 'password';
} }
}, },
handleLogin() { handleLogin() {
this.$refs.loginForm.validate(valid => { this.$refs.loginForm.validate(valid => {
if (valid) { if (valid) {
let model = Object.assign({}, this.loginForm); const model = Object.assign({}, this.loginForm);
model.password = md5(model.password); model.password = md5(model.password);
model.type = 'class'; model.type = 'class';
// 清空js的localStorage值 // 清空js的localStorage值
@ -93,16 +105,16 @@
this.loading = false; this.loading = false;
this.$router.push({ path: '/' }); this.$router.push({ path: '/' });
}).catch(() => { }).catch(() => {
this.loading = false this.loading = false;
}) });
} else { } else {
console.log('error submit!!') console.log('error submit!!');
return false return false;
}
})
} }
});
} }
} }
};
</script> </script>
<style rel="stylesheet/scss" lang="scss"> <style rel="stylesheet/scss" lang="scss">

38
src/views/login/loginNew.vue
View File

@ -1,33 +1,40 @@
<template> <template>
<div class="login-container"> <div class="login-container">
<div class="qrcode-login-main"> <div class="qrcode-login-main">
<div class="qrcode-main"> <a class="qrcode-main">
<h1 class="login-title">琏课堂</h1> <h1 class="login-title">琏课堂</h1>
<div @click="loginRefresh"> <div @click="loginRefresh">
<qrcode-vue ref="qrcode" :value="loginUrl" :className="qrcodeClassName" :size="270" <qrcode-vue
v-loading="loading" element-loading-text="点击刷新" element-loading-spinner="el-icon-refresh" ref="qrcode"
element-loading-background="rgba(255, 255, 255, 0.9)"></qrcode-vue> v-loading="loading"
:value="loginUrl"
:class-name="qrcodeClassName"
:size="270"
element-loading-text="点击刷新"
element-loading-spinner="el-icon-refresh"
element-loading-background="rgba(255, 255, 255, 0.9)"
/>
</div> </div>
<div class="login-tip"> <div class="login-tip">
<div v-if="scanSuccess"> <div v-if="scanSuccess">
<div> <div>
<i class="el-icon-circle-check" style="color: green;"></i>扫码成功 <i class="el-icon-circle-check" style="color: green;" />扫码成功
</div> </div>
<span>请在微信上进行后续操作</span> <span>请在微信上进行后续操作</span>
</div> </div>
<span v-else class="sub-title">使用手机微信扫码登录</span> <span v-else class="sub-title">使用手机微信扫码登录</span>
</div> </div>
<div class="tip-info"> <a class="tip-info">
<fieldset> <fieldset>
<legend>推荐配置</legend> <legend>推荐配置</legend>
<span>浏览器： <span>浏览器：
<a href="https://www.google.cn/chrome/" target="_blank">谷歌浏览器</a> <a href="https://www.google.cn/chrome/" target="_blank">谷歌浏览器</a>
</span> </span>
<br /> <br>
<span>屏幕分辨率：1920*1080</span> <span>屏幕分辨率：1920*1080</span>
</fieldset> </fieldset>
</div> </a>
</div> </a>
</div> </div>
</div> </div>
</template> </template>
@ -37,7 +44,7 @@
import localStore from 'storejs'; import localStore from 'storejs';
import { getLoginUrl, checkLoginStatus } from '@/api/login'; import { getLoginUrl, checkLoginStatus } from '@/api/login';
import { setToken } from '@/utils/auth'; import { setToken } from '@/utils/auth';
import { getSessionId } from '@/utils/index'; // import { getSessionId } from '@/utils/index';
import { LoginParams } from '@/utils/login'; import { LoginParams } from '@/utils/login';
export default { export default {
@ -51,8 +58,8 @@
loginUrl: '', loginUrl: '',
checkLogin: null, checkLogin: null,
checkTimeout: null, checkTimeout: null,
scanSuccess: false, scanSuccess: false
} };
}, },
mounted() { mounted() {
document.title = '琏课堂'; document.title = '琏课堂';
@ -77,13 +84,13 @@
this.loginUrl = ''; this.loginUrl = '';
}, 3 * 60 * 1000); }, 3 * 60 * 1000);
this.checkLoginStatus(); this.checkLoginStatus();
}).catch(error => { }).catch(() => {
this.loading = false; this.loading = false;
this.$messageBox('获取登陆二维码失败，请刷新重试'); this.$messageBox('获取登陆二维码失败，请刷新重试');
}); });
}, },
checkLoginStatus() { checkLoginStatus() {
let self = this; const self = this;
// 销毁则不再定时 // 销毁则不再定时
if (this && this._isDestroyed) { if (this && this._isDestroyed) {
@ -114,7 +121,7 @@
}, 3000); }, 3000);
} }
} }
} };
</script> </script>
<style rel="stylesheet/scss" lang="scss" scoped> <style rel="stylesheet/scss" lang="scss" scoped>
@ -158,7 +165,6 @@
} }
} }
.tip-info { .tip-info {
text-align: left; text-align: left;
display: inline-block; display: inline-block;

26
src/views/login/loginNewPlan.vue
View File

@ -4,14 +4,20 @@
<div class="qrcode-main"> <div class="qrcode-main">
<h1 class="login-title">琏计划</h1> <h1 class="login-title">琏计划</h1>
<div @click="loginRefresh"> <div @click="loginRefresh">
<qrcode-vue :value="loginUrl" :className="qrcodeClassName" :size="270" v-loading="loading" <qrcode-vue
element-loading-text="点击刷新" element-loading-spinner="el-icon-refresh" v-loading="loading"
element-loading-background="rgba(255, 255, 255, 0.9)"></qrcode-vue> :value="loginUrl"
:class-name="qrcodeClassName"
:size="270"
element-loading-text="点击刷新"
element-loading-spinner="el-icon-refresh"
element-loading-background="rgba(255, 255, 255, 0.9)"
/>
</div> </div>
<div class="login-tip"> <div class="login-tip">
<div v-if="scanSuccess"> <div v-if="scanSuccess">
<div> <div>
<i class="el-icon-circle-check" style="color: green;"></i>扫码成功 <i class="el-icon-circle-check" style="color: green;" />扫码成功
</div> </div>
<span>请在微信上进行后续操作</span> <span>请在微信上进行后续操作</span>
</div> </div>
@ -23,7 +29,7 @@
<span>浏览器： <span>浏览器：
<a href="https://www.google.cn/chrome/" target="_blank">谷歌浏览器</a> <a href="https://www.google.cn/chrome/" target="_blank">谷歌浏览器</a>
</span> </span>
<br /> <br>
<span>屏幕分辨率：1920*1080</span> <span>屏幕分辨率：1920*1080</span>
</fieldset> </fieldset>
</div> </div>
@ -37,7 +43,7 @@
import localStore from 'storejs'; import localStore from 'storejs';
import { getLoginUrl, checkLoginStatus } from '@/api/login'; import { getLoginUrl, checkLoginStatus } from '@/api/login';
import { setPlanToken } from '@/utils/auth'; import { setPlanToken } from '@/utils/auth';
import { getSessionId } from '@/utils/index'; // import { getSessionId } from '@/utils/index';
import { UrlConfig } from '@/router/index'; import { UrlConfig } from '@/router/index';
import { LoginParams } from '@/utils/login'; import { LoginParams } from '@/utils/login';
@ -53,7 +59,7 @@
checkLogin: null, checkLogin: null,
checkTimeout: null, checkTimeout: null,
scanSuccess: false scanSuccess: false
} };
}, },
mounted() { mounted() {
this.loginRefresh(); this.loginRefresh();
@ -78,13 +84,13 @@
this.loginUrl = ''; this.loginUrl = '';
}, 3 * 60 * 1000); }, 3 * 60 * 1000);
this.checkLoginStatus(); this.checkLoginStatus();
}).catch(error => { }).catch(() => {
this.loading = false; this.loading = false;
this.$messageBox('获取登陆二维码失败，请刷新重试'); this.$messageBox('获取登陆二维码失败，请刷新重试');
}); });
}, },
checkLoginStatus() { checkLoginStatus() {
let self = this; const self = this;
// 销毁则不再定时 // 销毁则不再定时
if (this && this._isDestroyed) { if (this && this._isDestroyed) {
@ -115,7 +121,7 @@
}, 3000); }, 3000);
} }
} }
} };
</script> </script>
<style rel="stylesheet/scss" lang="scss" scoped> <style rel="stylesheet/scss" lang="scss" scoped>

28
src/views/login/loginNewScreen.vue
View File

@ -4,14 +4,20 @@
<div class="qrcode-main"> <div class="qrcode-main">
<h1 class="login-title">大屏系统</h1> <h1 class="login-title">大屏系统</h1>
<div @click="loginRefresh"> <div @click="loginRefresh">
<qrcode-vue :value="loginUrl" :className="qrcodeClassName" :size="270" v-loading="loading" <qrcode-vue
element-loading-text="点击刷新" element-loading-spinner="el-icon-refresh" v-loading="loading"
element-loading-background="rgba(255, 255, 255, 0.9)"></qrcode-vue> :value="loginUrl"
:class-name="qrcodeClassName"
:size="270"
element-loading-text="点击刷新"
element-loading-spinner="el-icon-refresh"
element-loading-background="rgba(255, 255, 255, 0.9)"
/>
</div> </div>
<div class="login-tip"> <div class="login-tip">
<div v-if="scanSuccess"> <div v-if="scanSuccess">
<div> <div>
<i class="el-icon-circle-check" style="color: green;"></i>扫码成功 <i class="el-icon-circle-check" style="color: green;" />扫码成功
</div> </div>
<span>请在微信上进行后续操作</span> <span>请在微信上进行后续操作</span>
</div> </div>
@ -23,7 +29,7 @@
<span>浏览器： <span>浏览器：
<a href="https://www.google.cn/chrome/" target="_blank">谷歌浏览器</a> <a href="https://www.google.cn/chrome/" target="_blank">谷歌浏览器</a>
</span> </span>
<br /> <br>
<span>屏幕分辨率：1920*1080</span> <span>屏幕分辨率：1920*1080</span>
</fieldset> </fieldset>
</div> </div>
@ -37,7 +43,7 @@
import localStore from 'storejs'; import localStore from 'storejs';
import { getLoginUrl, checkLoginStatus } from '@/api/login'; import { getLoginUrl, checkLoginStatus } from '@/api/login';
import { setScreenToken } from '@/utils/auth'; import { setScreenToken } from '@/utils/auth';
import { getSessionId } from '@/utils/index'; // import { getSessionId } from '@/utils/index';
import { UrlConfig } from '@/router/index'; import { UrlConfig } from '@/router/index';
import { LoginParams } from '@/utils/login'; import { LoginParams } from '@/utils/login';
@ -52,8 +58,8 @@
loginUrl: '', loginUrl: '',
checkLogin: null, checkLogin: null,
checkTimeout: null, checkTimeout: null,
scanSuccess: false, scanSuccess: false
} };
}, },
mounted() { mounted() {
this.loginRefresh(); this.loginRefresh();
@ -78,13 +84,13 @@
this.loginUrl = ''; this.loginUrl = '';
}, 3 * 60 * 1000); }, 3 * 60 * 1000);
this.checkLoginStatus(); this.checkLoginStatus();
}).catch(error => { }).catch(() => {
this.loading = false; this.loading = false;
this.$messageBox('获取登陆二维码失败，请刷新重试'); this.$messageBox('获取登陆二维码失败，请刷新重试');
}); });
}, },
checkLoginStatus() { checkLoginStatus() {
let self = this; const self = this;
// 销毁则不再定时 // 销毁则不再定时
if (this && this._isDestroyed) { if (this && this._isDestroyed) {
@ -115,7 +121,7 @@
}, 3000); }, 3000);
} }
} }
} };
</script> </script>
<style rel="stylesheet/scss" lang="scss" scoped> <style rel="stylesheet/scss" lang="scss" scoped>

67
src/views/login/loginPlan.vue
View File

@ -1,27 +1,44 @@
<template> <template>
<div class="login-container"> <div class="login-container">
<el-form class="login-form" autoComplete="on" :model="loginForm" :rules="loginRules" ref="loginForm" <el-form
label-position="left"> ref="loginForm"
class="login-form"
auto-complete="on"
:model="loginForm"
:rules="loginRules"
label-position="left"
>
<h3 class="title">用户登陆</h3> <h3 class="title">用户登陆</h3>
<el-form-item prop="username"> <el-form-item prop="username">
<span class="svg-container svg-container_login"> <span class="svg-container svg-container_login">
<svg-icon icon-class="user" /> <svg-icon icon-class="user" />
</span> </span>
<el-input name="username" type="text" v-model="loginForm.username" autoComplete="on" <el-input
placeholder="username" /> v-model="loginForm.username"
name="username"
type="text"
auto-complete="on"
placeholder="username"
/>
</el-form-item> </el-form-item>
<el-form-item prop="password"> <el-form-item prop="password">
<span class="svg-container"> <span class="svg-container">
<svg-icon icon-class="password"></svg-icon> <svg-icon icon-class="password" />
</span> </span>
<el-input name="password" :type="pwdType" @keyup.enter.native="handleLogin" v-model="loginForm.password" <el-input
autoComplete="on" placeholder="password"></el-input> v-model="loginForm.password"
name="password"
:type="pwdType"
auto-complete="on"
placeholder="password"
@keyup.enter.native="handleLogin"
/>
<span class="show-pwd" @click="showPwd"> <span class="show-pwd" @click="showPwd">
<svg-icon icon-class="eye" /> <svg-icon icon-class="eye" />
</span> </span>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<span class="svg-container"> </span> <span class="svg-container" />
<el-radio>琏计划</el-radio> <el-radio>琏计划</el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@ -43,18 +60,18 @@
data() { data() {
const validateUsername = (rule, value, callback) => { const validateUsername = (rule, value, callback) => {
if (value.length < 5) { if (value.length < 5) {
callback(new Error('请输入正确的用户名')) callback(new Error('请输入正确的用户名'));
} else { } else {
callback() callback();
}
} }
};
const validatePass = (rule, value, callback) => { const validatePass = (rule, value, callback) => {
if (value.length < 5) { if (value.length < 5) {
callback(new Error('密码不能小于5位')) callback(new Error('密码不能小于5位'));
} else { } else {
callback() callback();
}
} }
};
return { return {
loginForm: { loginForm: {
username: '', username: '',
@ -66,7 +83,7 @@
}, },
loading: false, loading: false,
pwdType: 'password' pwdType: 'password'
} };
}, },
mounted() { mounted() {
document.title = '琏计划'; document.title = '琏计划';
@ -74,15 +91,15 @@
methods: { methods: {
showPwd() { showPwd() {
if (this.pwdType === 'password') { if (this.pwdType === 'password') {
this.pwdType = '' this.pwdType = '';
} else { } else {
this.pwdType = 'password' this.pwdType = 'password';
} }
}, },
handleLogin() { handleLogin() {
this.$refs.loginForm.validate(valid => { this.$refs.loginForm.validate(valid => {
if (valid) { if (valid) {
let model = Object.assign({}, this.loginForm); const model = Object.assign({}, this.loginForm);
model.password = md5(model.password); model.password = md5(model.password);
model.type = 'plan'; model.type = 'plan';
// 清空js的localStorage值 // 清空js的localStorage值
@ -91,20 +108,20 @@
this.$store.dispatch('Login', model).then(() => { this.$store.dispatch('Login', model).then(() => {
this.$store.dispatch('GetUserConfigInfo'); this.$store.dispatch('GetUserConfigInfo');
// 设置路由 // 设置路由
this.loading = false this.loading = false;
this.$router.push({ path: `${UrlConfig.plan.prefix}/home` }); this.$router.push({ path: `${UrlConfig.plan.prefix}/home` });
}).catch(() => { }).catch(() => {
this.loading = false this.loading = false;
}) });
} else { } else {
console.log('error submit!!') console.log('error submit!!');
return false return false;
}
})
} }
});
} }
} }
};
</script> </script>
<style rel="stylesheet/scss" lang="scss"> <style rel="stylesheet/scss" lang="scss">

67
src/views/login/loginScreen.vue
View File

@ -1,27 +1,44 @@
<template> <template>
<div class="login-container"> <div class="login-container">
<el-form class="login-form" autoComplete="on" :model="loginForm" :rules="loginRules" ref="loginForm" <el-form
label-position="left"> ref="loginForm"
class="login-form"
auto-complete="on"
:model="loginForm"
:rules="loginRules"
label-position="left"
>
<h3 class="title">用户登陆</h3> <h3 class="title">用户登陆</h3>
<el-form-item prop="username"> <el-form-item prop="username">
<span class="svg-container svg-container_login"> <span class="svg-container svg-container_login">
<svg-icon icon-class="user" /> <svg-icon icon-class="user" />
</span> </span>
<el-input name="username" type="text" v-model="loginForm.username" autoComplete="on" <el-input
placeholder="username" /> v-model="loginForm.username"
name="username"
type="text"
auto-complete="on"
placeholder="username"
/>
</el-form-item> </el-form-item>
<el-form-item prop="password"> <el-form-item prop="password">
<span class="svg-container"> <span class="svg-container">
<svg-icon icon-class="password"></svg-icon> <svg-icon icon-class="password" />
</span> </span>
<el-input name="password" :type="pwdType" @keyup.enter.native="handleLogin" v-model="loginForm.password" <el-input
autoComplete="on" placeholder="password"></el-input> v-model="loginForm.password"
name="password"
:type="pwdType"
auto-complete="on"
placeholder="password"
@keyup.enter.native="handleLogin"
/>
<span class="show-pwd" @click="showPwd"> <span class="show-pwd" @click="showPwd">
<svg-icon icon-class="eye" /> <svg-icon icon-class="eye" />
</span> </span>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<span class="svg-container"></span> <span class="svg-container" />
<el-radio>大屏系统</el-radio> <el-radio>大屏系统</el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@ -43,18 +60,18 @@
data() { data() {
const validateUsername = (rule, value, callback) => { const validateUsername = (rule, value, callback) => {
if (value.length < 5) { if (value.length < 5) {
callback(new Error('请输入正确的用户名')) callback(new Error('请输入正确的用户名'));
} else { } else {
callback() callback();
}
} }
};
const validatePass = (rule, value, callback) => { const validatePass = (rule, value, callback) => {
if (value.length < 5) { if (value.length < 5) {
callback(new Error('密码不能小于5位')) callback(new Error('密码不能小于5位'));
} else { } else {
callback() callback();
}
} }
};
return { return {
loginForm: { loginForm: {
username: '', username: '',
@ -66,7 +83,7 @@
}, },
loading: false, loading: false,
pwdType: 'password' pwdType: 'password'
} };
}, },
mounted() { mounted() {
document.title = '琏课堂-大屏系统'; document.title = '琏课堂-大屏系统';
@ -74,15 +91,15 @@
methods: { methods: {
showPwd() { showPwd() {
if (this.pwdType === 'password') { if (this.pwdType === 'password') {
this.pwdType = '' this.pwdType = '';
} else { } else {
this.pwdType = 'password' this.pwdType = 'password';
} }
}, },
handleLogin() { handleLogin() {
this.$refs.loginForm.validate(valid => { this.$refs.loginForm.validate(valid => {
if (valid) { if (valid) {
let model = Object.assign({}, this.loginForm); const model = Object.assign({}, this.loginForm);
model.password = md5(model.password); model.password = md5(model.password);
model.type = 'dp'; model.type = 'dp';
// 清空js的localStorage值 // 清空js的localStorage值
@ -91,20 +108,20 @@
this.$store.dispatch('Login', model).then(() => { this.$store.dispatch('Login', model).then(() => {
this.$store.dispatch('GetUserConfigInfo'); this.$store.dispatch('GetUserConfigInfo');
// 设置路由 // 设置路由
this.loading = false this.loading = false;
this.$router.push({ path: `${UrlConfig.dp.prefix}/home` }); this.$router.push({ path: `${UrlConfig.dp.prefix}/home` });
}).catch(() => { }).catch(() => {
this.loading = false this.loading = false;
}) });
} else { } else {
console.log('error submit!!') console.log('error submit!!');
return false return false;
}
})
} }
});
} }
} }
};
</script> </script>
<style rel="stylesheet/scss" lang="scss"> <style rel="stylesheet/scss" lang="scss">