zcx/jwl-manage-web
1
0
Fork 0
forked from qiushanhe/dm-manage-web
Code Issues Pull Requests Packages Projects Releases Wiki Activity

eslint

Browse Source
This commit is contained in:
qsh
2023-03-21 00:53:28 +08:00
parent 953377e655
commit 955687d473
171 changed files with 7149 additions and 7341 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
.eslintrc.js
View File

@@ -24,7 +24,7 @@ module.exports = {
'vue/max-attributes-per-line': [ 'vue/max-attributes-per-line': [
2, 2,
{ {
singleline: 10, // 当开始标签位于单行时，每行的最大属性数 singleline: 20, // 当开始标签位于单行时，每行的最大属性数
// 当开始标签位于多行时，每行的最大属性数 // 当开始标签位于多行时，每行的最大属性数
multiline: { multiline: {
max: 1, max: 1,
@@ -75,7 +75,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', 'never', { null: 'ignore' }], // 要求使用 === 和 !==
// 强制 generator 函数中 * 号周围使用一致的空格 // 强制 generator 函数中 * 号周围使用一致的空格
'generator-star-spacing': [ 'generator-star-spacing': [
2, 2,
@@ -290,6 +290,8 @@ module.exports = {
objectsInObjects: false objectsInObjects: false
} }
], ],
'array-bracket-spacing': [2, 'never'] // 该规则在数组括号内强制实现一致的间距 'array-bracket-spacing': [2, 'never'], // 该规则在数组括号内强制实现一致的间距
'vue/require-default-prop': 'off',
'vue/require-prop-types': 'off'
} }
}; };

222
public/index.html
View File

@@ -1,13 +1,17 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="renderer" content="webkit"> <meta name="renderer" content="webkit" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= webpackConfig.name %></title> <title><%= webpackConfig.name %></title>
<!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]--> <!--[if lt IE 11
]><script>
window.location.href = '/html/ie.html';
</script><!
[endif]-->
<style> <style>
html, html,
body, body,
@@ -22,187 +26,67 @@
color: #000; color: #000;
padding: 0.2em 0; padding: 0.2em 0;
} }
.logo {
#loader-wrapper { position: absolute;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 999999;
}
#loader {
display: block; display: block;
position: relative;
left: 50%; left: 50%;
top: 50%; top: 50%;
width: 150px; width: 100px;
height: 150px; /* height: 162px; */
margin: -75px 0 0 -75px; transform: translate3d(-50%, -80px, 0);
border-radius: 50%; animation: twinkling 1.2s infinite ease-in-out;
border: 3px solid transparent;
border-top-color: #FFF;
-webkit-animation: spin 2s linear infinite;
-ms-animation: spin 2s linear infinite;
-moz-animation: spin 2s linear infinite;
-o-animation: spin 2s linear infinite;
animation: spin 2s linear infinite;
z-index: 1001;
} }
/* .animated {
#loader:before { -webkit-animation-duration: 1s;
content: ""; animation-duration: 1s;
position: absolute; -webkit-animation-fill-mode: both;
top: 5px; animation-fill-mode: both;
left: 5px; } */
right: 5px; @keyframes twinkling {
bottom: 5px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: #FFF;
-webkit-animation: spin 3s linear infinite;
-moz-animation: spin 3s linear infinite;
-o-animation: spin 3s linear infinite;
-ms-animation: spin 3s linear infinite;
animation: spin 3s linear infinite;
}
#loader:after {
content: "";
position: absolute;
top: 15px;
left: 15px;
right: 15px;
bottom: 15px;
border-radius: 50%;
border: 3px solid transparent;
border-top-color: #FFF;
-moz-animation: spin 1.5s linear infinite;
-o-animation: spin 1.5s linear infinite;
-ms-animation: spin 1.5s linear infinite;
-webkit-animation: spin 1.5s linear infinite;
animation: spin 1.5s linear infinite;
}
@-webkit-keyframes spin {
0% { 0% {
-webkit-transform: rotate(0deg); opacity: 0.8;
-ms-transform: rotate(0deg); }
transform: rotate(0deg); 50% {
opacity: 0.4;
} }
100% { 100% {
-webkit-transform: rotate(360deg); opacity: 0.8;
-ms-transform: rotate(360deg);
transform: rotate(360deg);
} }
} }
.loading {
position: absolute;
display: block;
left: 50%;
top: 50%;
transform: translate3d(-50%, 80px, 0);
color: #fefeff;
font-size: 14px;
}
canvas {
display: block;
left: 50%;
position: absolute;
top: 50%;
transform: translate3d(-50%, 100px, 0);
}
@keyframes spin { #loader-wrapper {
0% { position: relative;
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
}
#loader-wrapper .loader-section {
position: fixed;
top: 0;
width: 51%;
height: 100%;
background: #7171C6;
z-index: 1000;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
#loader-wrapper .loader-section.section-left {
left: 0;
}
#loader-wrapper .loader-section.section-right {
right: 0;
}
.loaded #loader-wrapper .loader-section.section-left {
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
.loaded #loader-wrapper .loader-section.section-right {
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%);
-webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
.loaded #loader {
opacity: 0;
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.loaded #loader-wrapper {
visibility: hidden;
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
transform: translateY(-100%);
-webkit-transition: all 0.3s 1s ease-out;
transition: all 0.3s 1s ease-out;
}
.no-js #loader-wrapper {
display: none;
}
.no-js h1 {
color: #222222;
}
#loader-wrapper .load_title {
font-family: 'Open Sans';
color: #FFF;
font-size: 19px;
width: 100%; width: 100%;
text-align: center; height: 100%;
z-index: 9999999999999; background: #1a1a34;
position: absolute; z-index: 1000;
top: 60%;
opacity: 1;
line-height: 30px;
}
#loader-wrapper .load_title span {
font-weight: normal;
font-style: italic;
font-size: 13px;
color: #FFF;
opacity: 0.5;
} }
</style> </style>
<script src="/loading/prefixfree.min.js"></script>
</head> </head>
<body> <body>
<div id="app"> <div id="app">
<div id="loader-wrapper"> <div id="loader-wrapper">
<div id="loader"></div> <img class="logo animated" src="/logo.png" alt="" srcset="" />
<div class="loader-section section-left"></div> <div class="loading">资源加载中...</div>
<div class="loader-section section-right"></div>
<div class="load_title">正在加载系统资源，请耐心等待</div>
</div> </div>
</div> </div>
<script src="/loading/index.js"></script>
</body> </body>
</html> </html>

208
public/loading/index.js Normal file
View File

@@ -0,0 +1,208 @@
/* ========================================================*/
/* Light Loader
/*========================================================*/
var lightLoader = function (c, cw, ch) {
var _this = this;
this.c = c;
this.ctx = c.getContext('2d');
this.cw = cw;
this.ch = ch;
this.loaded = 0;
this.loaderSpeed = 1.5;
this.loaderHeight = 8;
this.loaderWidth = 428;
this.loader = {
x: this.cw / 2 - this.loaderWidth / 2,
y: this.ch / 2 - this.loaderHeight / 2
};
this.particles = [];
this.particleLift = 180;
this.gravity = 0.15;
this.particleRate = 8;
/* ========================================================*/
/* Initialize
/*========================================================*/
this.init = function () {
this.loop();
};
/* ========================================================*/
/* Utility Functions
/*========================================================*/
this.rand = function (rMi, rMa) {
return ~~(Math.random() * (rMa - rMi + 1) + rMi);
};
this.hitTest = function (x1, y1, w1, h1, x2, y2, w2, h2) {
return !(x1 + w1 < x2 || x2 + w2 < x1 || y1 + h1 < y2 || y2 + h2 < y1);
};
/* ========================================================*/
/* Update Loader
/*========================================================*/
this.updateLoader = function () {
if (this.loaded < 100) {
this.loaded += this.loaderSpeed;
} else {
this.loaded = 0;
}
};
/* ========================================================*/
/* Render Loader
/*========================================================*/
this.renderLoader = function () {
this.ctx.fillStyle = '#2F2F47';
this.ctx.fillRect(this.loader.x, this.loader.y, this.loaderWidth, this.loaderHeight);
var newWidth = (this.loaded / 100) * this.loaderWidth;
var linearGrad = this.ctx.createLinearGradient(0, 0, this.loaderWidth, 0);
linearGrad.addColorStop(0.0, '#24DED0');
linearGrad.addColorStop(1.0, '#1490EA');
this.ctx.fillStyle = linearGrad;
this.ctx.fillRect(this.loader.x, this.loader.y, newWidth, this.loaderHeight);
// this.ctx.fillStyle = '#2F2F47';
// this.ctx.fillRect(
// this.loader.x,
// this.loader.y,
// newWidth,
// this.loaderHeight
// );
};
/* ========================================================*/
/* Particles
/*========================================================*/
this.Particle = function () {
this.x = _this.loader.x + (_this.loaded / 100) * _this.loaderWidth - _this.rand(0, 1);
this.y = _this.ch / 2 + _this.rand(0, _this.loaderHeight) - _this.loaderHeight / 2;
this.vx = (_this.rand(0, 4) - 2) / 100;
this.vy = (_this.rand(0, _this.particleLift) - _this.particleLift * 2) / 100;
this.width = _this.rand(1, 4) / 2;
this.height = _this.rand(1, 4) / 2;
};
this.Particle.prototype.update = function (i) {
this.vx += (_this.rand(0, 6) - 3) / 100;
this.vy += _this.gravity;
this.x += this.vx;
this.y += this.vy;
if (this.y > _this.ch) {
_this.particles.splice(i, 1);
}
};
this.Particle.prototype.render = function () {
_this.ctx.fillStyle = 'rgba(50, 213, 203, 0.4)';
_this.ctx.fillRect(this.x, this.y, this.width, this.height);
};
this.createParticles = function () {
var i = this.particleRate;
while (i--) {
this.particles.push(new this.Particle());
}
};
this.updateParticles = function () {
var i = this.particles.length;
while (i--) {
var p = this.particles[i];
p.update(i);
}
};
this.renderParticles = function () {
var i = this.particles.length;
while (i--) {
var p = this.particles[i];
p.render();
}
};
/* ========================================================*/
/* Clear Canvas
/*========================================================*/
this.clearCanvas = function () {
this.ctx.globalCompositeOperation = 'source-over';
this.ctx.clearRect(0, 0, this.cw, this.ch);
this.ctx.globalCompositeOperation = 'lighter';
};
/* ========================================================*/
/* Animation Loop
/*========================================================*/
this.loop = function () {
var loopIt = function () {
requestAnimationFrame(loopIt, _this.c);
_this.clearCanvas();
_this.createParticles();
_this.updateLoader();
_this.updateParticles();
_this.renderLoader();
_this.renderParticles();
};
loopIt();
};
};
/* ========================================================*/
/* Check Canvas Support
/*========================================================*/
var isCanvasSupported = function () {
var elem = document.createElement('canvas');
return !!(elem.getContext && elem.getContext('2d'));
};
/* ========================================================*/
/* Setup requestAnimationFrame
/*========================================================*/
var setupRAF = function () {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame'];
window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] || window[vendors[x] + 'CancelRequestAnimationFrame'];
}
if (!window.requestAnimationFrame) {
window.requestAnimationFrame = function (callback, element) {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 16 - (currTime - lastTime));
var id = window.setTimeout(function () {
callback(currTime + timeToCall);
}, timeToCall);
lastTime = currTime + timeToCall;
return id;
};
}
if (!window.cancelAnimationFrame) {
window.cancelAnimationFrame = function (id) {
clearTimeout(id);
};
}
};
/* ========================================================*/
/* Define Canvas and Initialize
/*========================================================*/
if (isCanvasSupported) {
var c = document.createElement('canvas');
c.width = 428;
c.height = 100;
var cw = c.width;
var ch = c.height;
// document.body.appendChild(c);
document.getElementById('loader-wrapper').appendChild(c);
var cl = new lightLoader(c, cw, ch);
setupRAF();
cl.init();
}

477
public/loading/prefixfree.min.js vendored Normal file
View File

@@ -0,0 +1,477 @@
(function () {
if (!window.addEventListener) {
return;
}
var self = (window.StyleFix = {
link: function (link) {
try {
// Ignore stylesheets with data-noprefix attribute as well as alternate stylesheets
if (link.rel !== 'stylesheet' || link.hasAttribute('data-noprefix')) {
return;
}
} catch (e) {
return;
}
var url = link.href || link.getAttribute('data-href');
var base = url.replace(/[^\/]+$/, '');
var base_scheme = (/^[a-z]{3,10}:/.exec(base) || [''])[0];
var base_domain = (/^[a-z]{3,10}:\/\/[^\/]+/.exec(base) || [''])[0];
var base_query = /^([^?]*)\??/.exec(url)[1];
var parent = link.parentNode;
var xhr = new XMLHttpRequest();
var process;
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
process();
}
};
process = function () {
var css = xhr.responseText;
if (css && link.parentNode && (!xhr.status || xhr.status < 400 || xhr.status > 600)) {
css = self.fix(css, true, link);
// Convert relative URLs to absolute, if needed
if (base) {
css = css.replace(/url\(\s*?((?:"|')?)(.+?)\1\s*?\)/gi, function ($0, quote, url) {
if (/^([a-z]{3,10}:|#)/i.test(url)) {
// Absolute & or hash-relative
return $0;
} else if (/^\/\//.test(url)) {
// Scheme-relative
// May contain sequences like /../ and /./ but those DO work
return 'url("' + base_scheme + url + '")';
} else if (/^\//.test(url)) {
// Domain-relative
return 'url("' + base_domain + url + '")';
} else if (/^\?/.test(url)) {
// Query-relative
return 'url("' + base_query + url + '")';
} else {
// Path-relative
return 'url("' + base + url + '")';
}
});
// behavior URLs shoudn’t be converted (Issue #19)
// base should be escaped before added to RegExp (Issue #81)
var escaped_base = base.replace(/([\\\^\$*+[\]?{}.=!:(|)])/g, '\\$1');
css = css.replace(RegExp('\\b(behavior:\\s*?url\\(\'?"?)' + escaped_base, 'gi'), '$1');
}
var style = document.createElement('style');
style.textContent = css;
style.media = link.media;
style.disabled = link.disabled;
style.setAttribute('data-href', link.getAttribute('href'));
parent.insertBefore(style, link);
parent.removeChild(link);
style.media = link.media; // Duplicate is intentional. See issue #31
}
};
try {
xhr.open('GET', url);
xhr.send(null);
} catch (e) {
// Fallback to XDomainRequest if available
if (typeof XDomainRequest !== 'undefined') {
xhr = new XDomainRequest();
xhr.onerror = xhr.onprogress = function () {};
xhr.onload = process;
xhr.open('GET', url);
xhr.send(null);
}
}
link.setAttribute('data-inprogress', '');
},
styleElement: function (style) {
if (style.hasAttribute('data-noprefix')) {
return;
}
var disabled = style.disabled;
style.textContent = self.fix(style.textContent, true, style);
style.disabled = disabled;
},
styleAttribute: function (element) {
var css = element.getAttribute('style');
css = self.fix(css, false, element);
element.setAttribute('style', css);
},
process: function () {
// Linked stylesheets
$('link[rel="stylesheet"]:not([data-inprogress])').forEach(StyleFix.link);
// Inline stylesheets
$('style').forEach(StyleFix.styleElement);
// Inline styles
$('[style]').forEach(StyleFix.styleAttribute);
},
register: function (fixer, index) {
(self.fixers = self.fixers || []).splice(index === undefined ? self.fixers.length : index, 0, fixer);
},
fix: function (css, raw, element) {
for (var i = 0; i < self.fixers.length; i++) {
css = self.fixers[i](css, raw, element) || css;
}
return css;
},
camelCase: function (str) {
return str
.replace(/-([a-z])/g, function ($0, $1) {
return $1.toUpperCase();
})
.replace('-', '');
},
deCamelCase: function (str) {
return str.replace(/[A-Z]/g, function ($0) {
return '-' + $0.toLowerCase();
});
}
});
/** ************************************
* Process styles
**************************************/
(function () {
setTimeout(function () {
$('link[rel="stylesheet"]').forEach(StyleFix.link);
}, 10);
document.addEventListener('DOMContentLoaded', StyleFix.process, false);
})();
function $(expr, con) {
return [].slice.call((con || document).querySelectorAll(expr));
}
})();
/**
* PrefixFree
*/
(function (root) {
if (!window.StyleFix || !window.getComputedStyle) {
return;
}
// Private helper
function fix(what, before, after, replacement, css) {
what = self[what];
if (what.length) {
var regex = RegExp(before + '(' + what.join('|') + ')' + after, 'gi');
css = css.replace(regex, replacement);
}
return css;
}
var self = (window.PrefixFree = {
prefixCSS: function (css, raw, element) {
var prefix = self.prefix;
// Gradient angles hotfix
if (self.functions.indexOf('linear-gradient') > -1) {
// Gradients are supported with a prefix, convert angles to legacy
css = css.replace(/(\s|:|,)(repeating-)?linear-gradient\(\s*(-?\d*\.?\d*)deg/gi, function ($0, delim, repeating, deg) {
return delim + (repeating || '') + 'linear-gradient(' + (90 - deg) + 'deg';
});
}
css = fix('functions', '(\\s|:|,)', '\\s*\\(', '$1' + prefix + '$2(', css);
css = fix('keywords', '(\\s|:)', '(\\s|;|\\}|$)', '$1' + prefix + '$2$3', css);
css = fix('properties', '(^|\\{|\\s|;)', '\\s*:', '$1' + prefix + '$2:', css);
// Prefix properties *inside* values (issue #8)
if (self.properties.length) {
var regex = RegExp('\\b(' + self.properties.join('|') + ')(?!:)', 'gi');
css = fix(
'valueProperties',
'\\b',
':(.+?);',
function ($0) {
return $0.replace(regex, prefix + '$1');
},
css
);
}
if (raw) {
css = fix('selectors', '', '\\b', self.prefixSelector, css);
css = fix('atrules', '@', '\\b', '@' + prefix + '$1', css);
}
// Fix double prefixing
css = css.replace(RegExp('-' + prefix, 'g'), '-');
// Prefix wildcard
css = css.replace(/-\*-(?=[a-z]+)/gi, self.prefix);
return css;
},
property: function (property) {
return (self.properties.indexOf(property) ? self.prefix : '') + property;
},
value: function (value, property) {
value = fix('functions', '(^|\\s|,)', '\\s*\\(', '$1' + self.prefix + '$2(', value);
value = fix('keywords', '(^|\\s)', '(\\s|$)', '$1' + self.prefix + '$2$3', value);
// TODO properties inside values
return value;
},
// Warning: Prefixes no matter what, even if the selector is supported prefix-less
prefixSelector: function (selector) {
return selector.replace(/^:{1,2}/, function ($0) {
return $0 + self.prefix;
});
},
// Warning: Prefixes no matter what, even if the property is supported prefix-less
prefixProperty: function (property, camelCase) {
var prefixed = self.prefix + property;
return camelCase ? StyleFix.camelCase(prefixed) : prefixed;
}
});
/** ************************************
* Properties
**************************************/
(function () {
var prefixes = {};
var properties = [];
var shorthands = {};
var style = getComputedStyle(document.documentElement, null);
var dummy = document.createElement('div').style;
// Why are we doing this instead of iterating over properties in a .style object? Cause Webkit won't iterate over those.
var iterate = function (property) {
if (property.charAt(0) === '-') {
properties.push(property);
var parts = property.split('-');
var prefix = parts[1];
// Count prefix uses
prefixes[prefix] = ++prefixes[prefix] || 1;
// This helps determining shorthands
while (parts.length > 3) {
parts.pop();
var shorthand = parts.join('-');
if (supported(shorthand) && properties.indexOf(shorthand) === -1) {
properties.push(shorthand);
}
}
}
};
var supported = function (property) {
return StyleFix.camelCase(property) in dummy;
};
// Some browsers have numerical indices for the properties, some don't
if (style.length > 0) {
for (var i = 0; i < style.length; i++) {
iterate(style[i]);
}
} else {
for (var property in style) {
iterate(StyleFix.deCamelCase(property));
}
}
// Find most frequently used prefix
var highest = { uses: 0 };
for (var prefix in prefixes) {
var uses = prefixes[prefix];
if (highest.uses < uses) {
highest = { prefix: prefix, uses: uses };
}
}
self.prefix = '-' + highest.prefix + '-';
self.Prefix = StyleFix.camelCase(self.prefix);
self.properties = [];
// Get properties ONLY supported with a prefix
for (var i = 0; i < properties.length; i++) {
var property = properties[i];
if (property.indexOf(self.prefix) === 0) {
// we might have multiple prefixes, like Opera
var unprefixed = property.slice(self.prefix.length);
if (!supported(unprefixed)) {
self.properties.push(unprefixed);
}
}
}
// IE fix
if (self.Prefix == 'Ms' && !('transform' in dummy) && !('MsTransform' in dummy) && 'msTransform' in dummy) {
self.properties.push('transform', 'transform-origin');
}
self.properties.sort();
})();
/** ************************************
* Values
**************************************/
(function () {
// Values that might need prefixing
var functions = {
'linear-gradient': {
property: 'backgroundImage',
params: 'red, teal'
},
calc: {
property: 'width',
params: '1px + 5%'
},
element: {
property: 'backgroundImage',
params: '#foo'
},
'cross-fade': {
property: 'backgroundImage',
params: 'url(a.png), url(b.png), 50%'
}
};
functions['repeating-linear-gradient'] = functions['repeating-radial-gradient'] = functions['radial-gradient'] = functions['linear-gradient'];
// Note: The properties assigned are just to *test* support.
// The keywords will be prefixed everywhere.
var keywords = {
initial: 'color',
'zoom-in': 'cursor',
'zoom-out': 'cursor',
box: 'display',
flexbox: 'display',
'inline-flexbox': 'display',
flex: 'display',
'inline-flex': 'display',
grid: 'display',
'inline-grid': 'display',
'min-content': 'width'
};
self.functions = [];
self.keywords = [];
var style = document.createElement('div').style;
function supported(value, property) {
style[property] = '';
style[property] = value;
return !!style[property];
}
for (var func in functions) {
var test = functions[func];
var property = test.property;
var value = func + '(' + test.params + ')';
if (!supported(value, property) && supported(self.prefix + value, property)) {
// It's supported, but with a prefix
self.functions.push(func);
}
}
for (var keyword in keywords) {
var property = keywords[keyword];
if (!supported(keyword, property) && supported(self.prefix + keyword, property)) {
// It's supported, but with a prefix
self.keywords.push(keyword);
}
}
})();
/** ************************************
* Selectors and @-rules
**************************************/
(function () {
var selectors = {
':read-only': null,
':read-write': null,
':any-link': null,
'::selection': null
};
var atrules = {
keyframes: 'name',
viewport: null,
document: 'regexp(".")'
};
self.selectors = [];
self.atrules = [];
var style = root.appendChild(document.createElement('style'));
function supported(selector) {
style.textContent = selector + '{}'; // Safari 4 has issues with style.innerHTML
return !!style.sheet.cssRules.length;
}
for (var selector in selectors) {
var test = selector + (selectors[selector] ? '(' + selectors[selector] + ')' : '');
if (!supported(test) && supported(self.prefixSelector(test))) {
self.selectors.push(selector);
}
}
for (var atrule in atrules) {
var test = atrule + ' ' + (atrules[atrule] || '');
if (!supported('@' + test) && supported('@' + self.prefix + test)) {
self.atrules.push(atrule);
}
}
root.removeChild(style);
})();
// Properties that accept properties as their value
self.valueProperties = ['transition', 'transition-property'];
// Add class for current prefix
root.className += ' ' + self.prefix;
StyleFix.register(self.prefixCSS);
})(document.documentElement);

BIN
public/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 137 KiB

14
src/api/login.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 登录方法 // 登录方法
export function login(username, password, code, uuid) { export function login(username, password, code, uuid) {
@@ -7,7 +7,7 @@ export function login(username, password, code, uuid) {
password, password,
code, code,
uuid uuid
} };
return request({ return request({
url: '/login', url: '/login',
headers: { headers: {
@@ -15,7 +15,7 @@ export function login(username, password, code, uuid) {
}, },
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 注册方法 // 注册方法
@@ -27,7 +27,7 @@ export function register(data) {
}, },
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 获取用户详细信息 // 获取用户详细信息
@@ -35,7 +35,7 @@ export function getInfo() {
return request({ return request({
url: '/getInfo', url: '/getInfo',
method: 'get' method: 'get'
}) });
} }
// 退出方法 // 退出方法
@@ -43,7 +43,7 @@ export function logout() {
return request({ return request({
url: '/logout', url: '/logout',
method: 'post' method: 'post'
}) });
} }
// 获取验证码 // 获取验证码
@@ -55,5 +55,5 @@ export function getCodeImg() {
}, },
method: 'get', method: 'get',
timeout: 20000 timeout: 20000
}) });
} }

6
src/api/menu.js
View File

@@ -1,9 +1,9 @@
import request from '@/utils/request' import request from '@/utils/request';
// 获取路由 // 获取路由
export const getRouters = () => { export const getRouters = () => {
return request({ return request({
url: '/getRouters', url: '/getRouters',
method: 'get' method: 'get'
}) });
} };

16
src/api/monitor/cache.js
View File

@@ -1,11 +1,11 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询缓存详细 // 查询缓存详细
export function getCache() { export function getCache() {
return request({ return request({
url: '/monitor/cache', url: '/monitor/cache',
method: 'get' method: 'get'
}) });
} }
// 查询缓存名称列表 // 查询缓存名称列表
@@ -13,7 +13,7 @@ export function listCacheName() {
return request({ return request({
url: '/monitor/cache/getNames', url: '/monitor/cache/getNames',
method: 'get' method: 'get'
}) });
} }
// 查询缓存键名列表 // 查询缓存键名列表
@@ -21,7 +21,7 @@ export function listCacheKey(cacheName) {
return request({ return request({
url: '/monitor/cache/getKeys/' + cacheName, url: '/monitor/cache/getKeys/' + cacheName,
method: 'get' method: 'get'
}) });
} }
// 查询缓存内容 // 查询缓存内容
@@ -29,7 +29,7 @@ export function getCacheValue(cacheName, cacheKey) {
return request({ return request({
url: '/monitor/cache/getValue/' + cacheName + '/' + cacheKey, url: '/monitor/cache/getValue/' + cacheName + '/' + cacheKey,
method: 'get' method: 'get'
}) });
} }
// 清理指定名称缓存 // 清理指定名称缓存
@@ -37,7 +37,7 @@ export function clearCacheName(cacheName) {
return request({ return request({
url: '/monitor/cache/clearCacheName/' + cacheName, url: '/monitor/cache/clearCacheName/' + cacheName,
method: 'delete' method: 'delete'
}) });
} }
// 清理指定键名缓存 // 清理指定键名缓存
@@ -45,7 +45,7 @@ export function clearCacheKey(cacheKey) {
return request({ return request({
url: '/monitor/cache/clearCacheKey/' + cacheKey, url: '/monitor/cache/clearCacheKey/' + cacheKey,
method: 'delete' method: 'delete'
}) });
} }
// 清理全部缓存 // 清理全部缓存
@@ -53,5 +53,5 @@ export function clearCacheAll() {
return request({ return request({
url: '/monitor/cache/clearCacheAll', url: '/monitor/cache/clearCacheAll',
method: 'delete' method: 'delete'
}) });
} }

21
src/api/monitor/job.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询定时任务调度列表 // 查询定时任务调度列表
export function listJob(query) { export function listJob(query) {
@@ -6,7 +6,7 @@ export function listJob(query) {
url: '/monitor/job/list', url: '/monitor/job/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询定时任务调度详细 // 查询定时任务调度详细
@@ -14,7 +14,7 @@ export function getJob(jobId) {
return request({ return request({
url: '/monitor/job/' + jobId, url: '/monitor/job/' + jobId,
method: 'get' method: 'get'
}) });
} }
// 新增定时任务调度 // 新增定时任务调度
@@ -23,7 +23,7 @@ export function addJob(data) {
url: '/monitor/job', url: '/monitor/job',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改定时任务调度 // 修改定时任务调度
@@ -32,7 +32,7 @@ export function updateJob(data) {
url: '/monitor/job', url: '/monitor/job',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除定时任务调度 // 删除定时任务调度
@@ -40,7 +40,7 @@ export function delJob(jobId) {
return request({ return request({
url: '/monitor/job/' + jobId, url: '/monitor/job/' + jobId,
method: 'delete' method: 'delete'
}) });
} }
// 任务状态修改 // 任务状态修改
@@ -48,24 +48,23 @@ export function changeJobStatus(jobId, status) {
const data = { const data = {
jobId, jobId,
status status
} };
return request({ return request({
url: '/monitor/job/changeStatus', url: '/monitor/job/changeStatus',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 定时任务立即执行一次 // 定时任务立即执行一次
export function runJob(jobId, jobGroup) { export function runJob(jobId, jobGroup) {
const data = { const data = {
jobId, jobId,
jobGroup jobGroup
} };
return request({ return request({
url: '/monitor/job/run', url: '/monitor/job/run',
method: 'put', method: 'put',
data: data data: data
}) });
} }

8
src/api/monitor/jobLog.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询调度日志列表 // 查询调度日志列表
export function listJobLog(query) { export function listJobLog(query) {
@@ -6,7 +6,7 @@ export function listJobLog(query) {
url: '/monitor/jobLog/list', url: '/monitor/jobLog/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 删除调度日志 // 删除调度日志
@@ -14,7 +14,7 @@ export function delJobLog(jobLogId) {
return request({ return request({
url: '/monitor/jobLog/' + jobLogId, url: '/monitor/jobLog/' + jobLogId,
method: 'delete' method: 'delete'
}) });
} }
// 清空调度日志 // 清空调度日志
@@ -22,5 +22,5 @@ export function cleanJobLog() {
return request({ return request({
url: '/monitor/jobLog/clean', url: '/monitor/jobLog/clean',
method: 'delete' method: 'delete'
}) });
} }

10
src/api/monitor/logininfor.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询登录日志列表 // 查询登录日志列表
export function list(query) { export function list(query) {
@@ -6,7 +6,7 @@ export function list(query) {
url: '/monitor/logininfor/list', url: '/monitor/logininfor/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 删除登录日志 // 删除登录日志
@@ -14,7 +14,7 @@ export function delLogininfor(infoId) {
return request({ return request({
url: '/monitor/logininfor/' + infoId, url: '/monitor/logininfor/' + infoId,
method: 'delete' method: 'delete'
}) });
} }
// 解锁用户登录状态 // 解锁用户登录状态
@@ -22,7 +22,7 @@ export function unlockLogininfor(userName) {
return request({ return request({
url: '/monitor/logininfor/unlock/' + userName, url: '/monitor/logininfor/unlock/' + userName,
method: 'get' method: 'get'
}) });
} }
// 清空登录日志 // 清空登录日志
@@ -30,5 +30,5 @@ export function cleanLogininfor() {
return request({ return request({
url: '/monitor/logininfor/clean', url: '/monitor/logininfor/clean',
method: 'delete' method: 'delete'
}) });
} }

6
src/api/monitor/online.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询在线用户列表 // 查询在线用户列表
export function list(query) { export function list(query) {
@@ -6,7 +6,7 @@ export function list(query) {
url: '/monitor/online/list', url: '/monitor/online/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 强退用户 // 强退用户
@@ -14,5 +14,5 @@ export function forceLogout(tokenId) {
return request({ return request({
url: '/monitor/online/' + tokenId, url: '/monitor/online/' + tokenId,
method: 'delete' method: 'delete'
}) });
} }

8
src/api/monitor/operlog.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询操作日志列表 // 查询操作日志列表
export function list(query) { export function list(query) {
@@ -6,7 +6,7 @@ export function list(query) {
url: '/monitor/operlog/list', url: '/monitor/operlog/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 删除操作日志 // 删除操作日志
@@ -14,7 +14,7 @@ export function delOperlog(operId) {
return request({ return request({
url: '/monitor/operlog/' + operId, url: '/monitor/operlog/' + operId,
method: 'delete' method: 'delete'
}) });
} }
// 清空操作日志 // 清空操作日志
@@ -22,5 +22,5 @@ export function cleanOperlog() {
return request({ return request({
url: '/monitor/operlog/clean', url: '/monitor/operlog/clean',
method: 'delete' method: 'delete'
}) });
} }

4
src/api/monitor/server.js
View File

@@ -1,9 +1,9 @@
import request from '@/utils/request' import request from '@/utils/request';
// 获取服务信息 // 获取服务信息
export function getServer() { export function getServer() {
return request({ return request({
url: '/monitor/server', url: '/monitor/server',
method: 'get' method: 'get'
}) });
} }

12
src/api/sch/classType.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询班型列表 // 查询班型列表
export function getClassTypeTableList(query) { export function getClassTypeTableList(query) {
@@ -6,7 +6,7 @@ export function getClassTypeTableList(query) {
url: '/sch/classType/list', url: '/sch/classType/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 新增班型 // 新增班型
@@ -15,7 +15,7 @@ export function insertClassType(params) {
url: '/sch/classType', url: '/sch/classType',
method: 'post', method: 'post',
data: params data: params
}) });
} }
// 修改班型 // 修改班型
export function updateClassType(params) { export function updateClassType(params) {
@@ -23,14 +23,14 @@ export function updateClassType(params) {
url: '/sch/classType', url: '/sch/classType',
method: 'put', method: 'put',
data: params data: params
}) });
} }
// 删除班型 // 删除班型
export function deleteClassType(ids) { export function deleteClassType(ids) {
return request({ return request({
url: '/sch/classType/' + ids, url: '/sch/classType/' + ids,
method: 'delete' method: 'delete'
}) });
} }
// 克隆班型 // 克隆班型
@@ -39,5 +39,5 @@ export function cloneClassType(data) {
url: '/sch/classType/clone', url: '/sch/classType/clone',
method: 'post', method: 'post',
data: data data: data
}) });
} }

8
src/api/sch/place.js
View File

@@ -1,11 +1,11 @@
import request from '@/utils/request' import request from '@/utils/request';
// 获取地图数据 // 获取地图数据
export function getMapData() { export function getMapData() {
return request({ return request({
url: '/sch/place/list', url: '/sch/place/list',
method: 'get' method: 'get'
}) });
} }
// 更新驾校状态 // 更新驾校状态
@@ -14,7 +14,7 @@ export async function updateSchoolStatus(data) {
url: '/sch/place/updateSchool', url: '/sch/place/updateSchool',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 保存场地状态 // 保存场地状态
@@ -23,5 +23,5 @@ export function savePlace(data) {
url: '/sch/place', url: '/sch/place',
method: 'post', method: 'post',
data: data data: data
}) });
} }

26
src/api/sch/school.js
View File

@@ -1,36 +1,36 @@
import request from '@/utils/request' import request from '@/utils/request';
export default { export default {
pageList(data = {}) { pageList(data = {}) {
return request({ return request({
url: "/sch/school/list", url: '/sch/school/list',
method: "get", method: 'get',
params: data, params: data
}); });
}, },
getById(id) { getById(id) {
return request({ return request({
url: `/sch/school/${id}`, url: `/sch/school/${id}`,
method: "get", method: 'get'
}); });
}, },
add(data = {}) { add(data = {}) {
return request({ return request({
url: "/sch/school", url: '/sch/school',
method: "post", method: 'post',
data, data
}); });
}, },
update(data = {}) { update(data = {}) {
return request({ return request({
url: "/sch/school", url: '/sch/school',
method: "put", method: 'put',
data, data
}); });
}, },
delete(id) { delete(id) {
return request({ return request({
url: `/sch/school/${id}`, url: `/sch/school/${id}`,
method: "delete", method: 'delete'
}); });
} }
} };

16
src/api/system/config.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询参数列表 // 查询参数列表
export function listConfig(query) { export function listConfig(query) {
@@ -6,7 +6,7 @@ export function listConfig(query) {
url: '/system/config/list', url: '/system/config/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询参数详细 // 查询参数详细
@@ -14,7 +14,7 @@ export function getConfig(configId) {
return request({ return request({
url: '/system/config/' + configId, url: '/system/config/' + configId,
method: 'get' method: 'get'
}) });
} }
// 根据参数键名查询参数值 // 根据参数键名查询参数值
@@ -22,7 +22,7 @@ export function getConfigKey(configKey) {
return request({ return request({
url: '/system/config/configKey/' + configKey, url: '/system/config/configKey/' + configKey,
method: 'get' method: 'get'
}) });
} }
// 新增参数配置 // 新增参数配置
@@ -31,7 +31,7 @@ export function addConfig(data) {
url: '/system/config', url: '/system/config',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改参数配置 // 修改参数配置
@@ -40,7 +40,7 @@ export function updateConfig(data) {
url: '/system/config', url: '/system/config',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除参数配置 // 删除参数配置
@@ -48,7 +48,7 @@ export function delConfig(configId) {
return request({ return request({
url: '/system/config/' + configId, url: '/system/config/' + configId,
method: 'delete' method: 'delete'
}) });
} }
// 刷新参数缓存 // 刷新参数缓存
@@ -56,5 +56,5 @@ export function refreshCache() {
return request({ return request({
url: '/system/config/refreshCache', url: '/system/config/refreshCache',
method: 'delete' method: 'delete'
}) });
} }

16
src/api/system/dept.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询部门列表 // 查询部门列表
export function listDept(query) { export function listDept(query) {
@@ -6,7 +6,7 @@ export function listDept(query) {
url: '/system/dept/list', url: '/system/dept/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询部门列表（排除节点） // 查询部门列表（排除节点）
@@ -14,7 +14,7 @@ export function listDeptExcludeChild(deptId) {
return request({ return request({
url: '/system/dept/list/exclude/' + deptId, url: '/system/dept/list/exclude/' + deptId,
method: 'get' method: 'get'
}) });
} }
// 查询部门详细 // 查询部门详细
@@ -22,7 +22,7 @@ export function getDept(deptId) {
return request({ return request({
url: '/system/dept/' + deptId, url: '/system/dept/' + deptId,
method: 'get' method: 'get'
}) });
} }
// 新增部门 // 新增部门
@@ -31,7 +31,7 @@ export function addDept(data) {
url: '/system/dept', url: '/system/dept',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改部门 // 修改部门
@@ -40,7 +40,7 @@ export function updateDept(data) {
url: '/system/dept', url: '/system/dept',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除部门 // 删除部门
@@ -48,12 +48,12 @@ export function delDept(deptId) {
return request({ return request({
url: '/system/dept/' + deptId, url: '/system/dept/' + deptId,
method: 'delete' method: 'delete'
}) });
} }
// 查询部门下拉树结构 // 查询部门下拉树结构
export function deptTreeSelect() { export function deptTreeSelect() {
return request({ return request({
url: '/system/dept/deptTree', url: '/system/dept/deptTree',
method: 'get' method: 'get'
}) });
} }

14
src/api/system/dict/data.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询字典数据列表 // 查询字典数据列表
export function listData(query) { export function listData(query) {
@@ -6,7 +6,7 @@ export function listData(query) {
url: '/system/dict/data/list', url: '/system/dict/data/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询字典数据详细 // 查询字典数据详细
@@ -14,7 +14,7 @@ export function getData(dictCode) {
return request({ return request({
url: '/system/dict/data/' + dictCode, url: '/system/dict/data/' + dictCode,
method: 'get' method: 'get'
}) });
} }
// 根据字典类型查询字典数据信息 // 根据字典类型查询字典数据信息
@@ -22,7 +22,7 @@ export function getDicts(dictType) {
return request({ return request({
url: '/system/dict/data/type/' + dictType, url: '/system/dict/data/type/' + dictType,
method: 'get' method: 'get'
}) });
} }
// 新增字典数据 // 新增字典数据
@@ -31,7 +31,7 @@ export function addData(data) {
url: '/system/dict/data', url: '/system/dict/data',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改字典数据 // 修改字典数据
@@ -40,7 +40,7 @@ export function updateData(data) {
url: '/system/dict/data', url: '/system/dict/data',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除字典数据 // 删除字典数据
@@ -48,5 +48,5 @@ export function delData(dictCode) {
return request({ return request({
url: '/system/dict/data/' + dictCode, url: '/system/dict/data/' + dictCode,
method: 'delete' method: 'delete'
}) });
} }

16
src/api/system/dict/type.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询字典类型列表 // 查询字典类型列表
export function listType(query) { export function listType(query) {
@@ -6,7 +6,7 @@ export function listType(query) {
url: '/system/dict/type/list', url: '/system/dict/type/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询字典类型详细 // 查询字典类型详细
@@ -14,7 +14,7 @@ export function getType(dictId) {
return request({ return request({
url: '/system/dict/type/' + dictId, url: '/system/dict/type/' + dictId,
method: 'get' method: 'get'
}) });
} }
// 新增字典类型 // 新增字典类型
@@ -23,7 +23,7 @@ export function addType(data) {
url: '/system/dict/type', url: '/system/dict/type',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改字典类型 // 修改字典类型
@@ -32,7 +32,7 @@ export function updateType(data) {
url: '/system/dict/type', url: '/system/dict/type',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除字典类型 // 删除字典类型
@@ -40,7 +40,7 @@ export function delType(dictId) {
return request({ return request({
url: '/system/dict/type/' + dictId, url: '/system/dict/type/' + dictId,
method: 'delete' method: 'delete'
}) });
} }
// 刷新字典缓存 // 刷新字典缓存
@@ -48,7 +48,7 @@ export function refreshCache() {
return request({ return request({
url: '/system/dict/type/refreshCache', url: '/system/dict/type/refreshCache',
method: 'delete' method: 'delete'
}) });
} }
// 获取字典选择框列表 // 获取字典选择框列表
@@ -56,5 +56,5 @@ export function optionselect() {
return request({ return request({
url: '/system/dict/type/optionselect', url: '/system/dict/type/optionselect',
method: 'get' method: 'get'
}) });
} }

30
src/api/system/employee.js
View File

@@ -1,42 +1,42 @@
import request from '@/utils/request' import request from '@/utils/request';
export default { export default {
pageList(data = {}) { pageList(data = {}) {
return request({ return request({
url: "/system/employee/list", url: '/system/employee/list',
method: "get", method: 'get',
params: data, params: data
}); });
}, },
getById(id) { getById(id) {
return request({ return request({
url: `/system/employee/${id}`, url: `/system/employee/${id}`,
method: "get", method: 'get'
}); });
}, },
add(data = {}) { add(data = {}) {
return request({ return request({
url: "/system/employee", url: '/system/employee',
method: "post", method: 'post',
data, data
}); });
}, },
update(data = {}) { update(data = {}) {
return request({ return request({
url: "/system/employee", url: '/system/employee',
method: "put", method: 'put',
data, data
}); });
}, },
delete(id) { delete(id) {
return request({ return request({
url: `/system/employee/${id}`, url: `/system/employee/${id}`,
method: "delete", method: 'delete'
}); });
}, },
getEmployee() { getEmployee() {
return request({ return request({
url: "/system/employee/getEmployees", url: '/system/employee/getEmployees',
method: "get" method: 'get'
}); });
} }
} };

16
src/api/system/menu.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询菜单列表 // 查询菜单列表
export function listMenu(query) { export function listMenu(query) {
@@ -6,7 +6,7 @@ export function listMenu(query) {
url: '/system/menu/list', url: '/system/menu/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询菜单详细 // 查询菜单详细
@@ -14,7 +14,7 @@ export function getMenu(menuId) {
return request({ return request({
url: '/system/menu/' + menuId, url: '/system/menu/' + menuId,
method: 'get' method: 'get'
}) });
} }
// 查询菜单下拉树结构 // 查询菜单下拉树结构
@@ -22,7 +22,7 @@ export function treeselect() {
return request({ return request({
url: '/system/menu/treeselect', url: '/system/menu/treeselect',
method: 'get' method: 'get'
}) });
} }
// 根据角色ID查询菜单下拉树结构 // 根据角色ID查询菜单下拉树结构
@@ -30,7 +30,7 @@ export function roleMenuTreeselect(roleId) {
return request({ return request({
url: '/system/menu/roleMenuTreeselect/' + roleId, url: '/system/menu/roleMenuTreeselect/' + roleId,
method: 'get' method: 'get'
}) });
} }
// 新增菜单 // 新增菜单
@@ -39,7 +39,7 @@ export function addMenu(data) {
url: '/system/menu', url: '/system/menu',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改菜单 // 修改菜单
@@ -48,7 +48,7 @@ export function updateMenu(data) {
url: '/system/menu', url: '/system/menu',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除菜单 // 删除菜单
@@ -56,5 +56,5 @@ export function delMenu(menuId) {
return request({ return request({
url: '/system/menu/' + menuId, url: '/system/menu/' + menuId,
method: 'delete' method: 'delete'
}) });
} }

12
src/api/system/notice.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询公告列表 // 查询公告列表
export function listNotice(query) { export function listNotice(query) {
@@ -6,7 +6,7 @@ export function listNotice(query) {
url: '/system/notice/list', url: '/system/notice/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询公告详细 // 查询公告详细
@@ -14,7 +14,7 @@ export function getNotice(noticeId) {
return request({ return request({
url: '/system/notice/' + noticeId, url: '/system/notice/' + noticeId,
method: 'get' method: 'get'
}) });
} }
// 新增公告 // 新增公告
@@ -23,7 +23,7 @@ export function addNotice(data) {
url: '/system/notice', url: '/system/notice',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改公告 // 修改公告
@@ -32,7 +32,7 @@ export function updateNotice(data) {
url: '/system/notice', url: '/system/notice',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除公告 // 删除公告
@@ -40,5 +40,5 @@ export function delNotice(noticeId) {
return request({ return request({
url: '/system/notice/' + noticeId, url: '/system/notice/' + noticeId,
method: 'delete' method: 'delete'
}) });
} }

12
src/api/system/post.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询岗位列表 // 查询岗位列表
export function listPost(query) { export function listPost(query) {
@@ -6,7 +6,7 @@ export function listPost(query) {
url: '/system/post/list', url: '/system/post/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询岗位详细 // 查询岗位详细
@@ -14,7 +14,7 @@ export function getPost(postId) {
return request({ return request({
url: '/system/post/' + postId, url: '/system/post/' + postId,
method: 'get' method: 'get'
}) });
} }
// 新增岗位 // 新增岗位
@@ -23,7 +23,7 @@ export function addPost(data) {
url: '/system/post', url: '/system/post',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改岗位 // 修改岗位
@@ -32,7 +32,7 @@ export function updatePost(data) {
url: '/system/post', url: '/system/post',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除岗位 // 删除岗位
@@ -40,5 +40,5 @@ export function delPost(postId) {
return request({ return request({
url: '/system/post/' + postId, url: '/system/post/' + postId,
method: 'delete' method: 'delete'
}) });
} }

34
src/api/system/role.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询角色列表 // 查询角色列表
export function listRole(query) { export function listRole(query) {
@@ -6,7 +6,7 @@ export function listRole(query) {
url: '/system/role/list', url: '/system/role/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询角色详细 // 查询角色详细
@@ -14,7 +14,7 @@ export function getRole(roleId) {
return request({ return request({
url: '/system/role/' + roleId, url: '/system/role/' + roleId,
method: 'get' method: 'get'
}) });
} }
// 新增角色 // 新增角色
@@ -23,7 +23,7 @@ export function addRole(data) {
url: '/system/role', url: '/system/role',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改角色 // 修改角色
@@ -32,7 +32,7 @@ export function updateRole(data) {
url: '/system/role', url: '/system/role',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 角色数据权限 // 角色数据权限
@@ -41,7 +41,7 @@ export function dataScope(data) {
url: '/system/role/dataScope', url: '/system/role/dataScope',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 角色状态修改 // 角色状态修改
@@ -49,12 +49,12 @@ export function changeRoleStatus(roleId, status) {
const data = { const data = {
roleId, roleId,
status status
} };
return request({ return request({
url: '/system/role/changeStatus', url: '/system/role/changeStatus',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除角色 // 删除角色
@@ -62,7 +62,7 @@ export function delRole(roleId) {
return request({ return request({
url: '/system/role/' + roleId, url: '/system/role/' + roleId,
method: 'delete' method: 'delete'
}) });
} }
// 查询角色已授权用户列表 // 查询角色已授权用户列表
@@ -71,7 +71,7 @@ export function allocatedUserList(query) {
url: '/system/role/authUser/allocatedList', url: '/system/role/authUser/allocatedList',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询角色未授权用户列表 // 查询角色未授权用户列表
@@ -80,7 +80,7 @@ export function unallocatedUserList(query) {
url: '/system/role/authUser/unallocatedList', url: '/system/role/authUser/unallocatedList',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 取消用户授权角色 // 取消用户授权角色
@@ -89,7 +89,7 @@ export function authUserCancel(data) {
url: '/system/role/authUser/cancel', url: '/system/role/authUser/cancel',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 批量取消用户授权角色 // 批量取消用户授权角色
@@ -98,7 +98,7 @@ export function authUserCancelAll(data) {
url: '/system/role/authUser/cancelAll', url: '/system/role/authUser/cancelAll',
method: 'put', method: 'put',
params: data params: data
}) });
} }
// 授权用户选择 // 授权用户选择
@@ -107,7 +107,7 @@ export function authUserSelectAll(data) {
url: '/system/role/authUser/selectAll', url: '/system/role/authUser/selectAll',
method: 'put', method: 'put',
params: data params: data
}) });
} }
// 根据角色ID查询部门树结构 // 根据角色ID查询部门树结构
@@ -115,14 +115,12 @@ export function deptTreeSelect(roleId) {
return request({ return request({
url: '/system/role/deptTree/' + roleId, url: '/system/role/deptTree/' + roleId,
method: 'get' method: 'get'
}) });
} }
export function getRoleOptions() { export function getRoleOptions() {
return request({ return request({
url: '/system/role/getRoles', url: '/system/role/getRoles',
method: 'get' method: 'get'
}) });
} }

38
src/api/system/user.js
View File

@@ -1,7 +1,5 @@
import request from '@/utils/request' import request from '@/utils/request';
import { import { parseStrEmpty } from '@/utils/ruoyi';
parseStrEmpty
} from "@/utils/ruoyi";
// 查询用户列表 // 查询用户列表
export function listUser(query) { export function listUser(query) {
@@ -9,7 +7,7 @@ export function listUser(query) {
url: '/system/user/list', url: '/system/user/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询用户详细 // 查询用户详细
@@ -17,7 +15,7 @@ export function getUser(userId) {
return request({ return request({
url: '/system/user/' + parseStrEmpty(userId), url: '/system/user/' + parseStrEmpty(userId),
method: 'get' method: 'get'
}) });
} }
// 新增用户 // 新增用户
@@ -26,7 +24,7 @@ export function addUser(data) {
url: '/system/user', url: '/system/user',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改用户 // 修改用户
@@ -35,7 +33,7 @@ export function updateUser(data) {
url: '/system/user', url: '/system/user',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除用户 // 删除用户
@@ -43,7 +41,7 @@ export function delUser(userId) {
return request({ return request({
url: '/system/user/' + userId, url: '/system/user/' + userId,
method: 'delete' method: 'delete'
}) });
} }
// 用户密码重置 // 用户密码重置
@@ -51,12 +49,12 @@ export function resetUserPwd(userId, password) {
const data = { const data = {
userId, userId,
password password
} };
return request({ return request({
url: '/system/user/resetPwd', url: '/system/user/resetPwd',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 用户状态修改 // 用户状态修改
@@ -64,12 +62,12 @@ export function changeUserStatus(userId, status) {
const data = { const data = {
userId, userId,
status status
} };
return request({ return request({
url: '/system/user/changeStatus', url: '/system/user/changeStatus',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 查询用户个人信息 // 查询用户个人信息
@@ -77,7 +75,7 @@ export function getUserProfile() {
return request({ return request({
url: '/system/user/profile', url: '/system/user/profile',
method: 'get' method: 'get'
}) });
} }
// 修改用户个人信息 // 修改用户个人信息
@@ -86,7 +84,7 @@ export function updateUserProfile(data) {
url: '/system/user/profile', url: '/system/user/profile',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 用户密码重置 // 用户密码重置
@@ -94,12 +92,12 @@ export function updateUserPwd(oldPassword, newPassword) {
const data = { const data = {
oldPassword, oldPassword,
newPassword newPassword
} };
return request({ return request({
url: '/system/user/profile/updatePwd', url: '/system/user/profile/updatePwd',
method: 'put', method: 'put',
params: data params: data
}) });
} }
// 用户头像上传 // 用户头像上传
@@ -108,7 +106,7 @@ export function uploadAvatar(data) {
url: '/system/user/profile/avatar', url: '/system/user/profile/avatar',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 查询授权角色 // 查询授权角色
@@ -116,7 +114,7 @@ export function getAuthRole(userId) {
return request({ return request({
url: '/system/user/authRole/' + userId, url: '/system/user/authRole/' + userId,
method: 'get' method: 'get'
}) });
} }
// 保存授权角色 // 保存授权角色
@@ -125,5 +123,5 @@ export function updateAuthRole(data) {
url: '/system/user/authRole', url: '/system/user/authRole',
method: 'put', method: 'put',
params: data params: data
}) });
} }

20
src/api/tool/gen.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询生成表数据 // 查询生成表数据
export function listTable(query) { export function listTable(query) {
@@ -6,7 +6,7 @@ export function listTable(query) {
url: '/tool/gen/list', url: '/tool/gen/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询db数据库列表 // 查询db数据库列表
export function listDbTable(query) { export function listDbTable(query) {
@@ -14,7 +14,7 @@ export function listDbTable(query) {
url: '/tool/gen/db/list', url: '/tool/gen/db/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 查询表详细信息 // 查询表详细信息
@@ -22,7 +22,7 @@ export function getGenTable(tableId) {
return request({ return request({
url: '/tool/gen/' + tableId, url: '/tool/gen/' + tableId,
method: 'get' method: 'get'
}) });
} }
// 修改代码生成信息 // 修改代码生成信息
@@ -31,7 +31,7 @@ export function updateGenTable(data) {
url: '/tool/gen', url: '/tool/gen',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 导入表 // 导入表
@@ -40,7 +40,7 @@ export function importTable(data) {
url: '/tool/gen/importTable', url: '/tool/gen/importTable',
method: 'post', method: 'post',
params: data params: data
}) });
} }
// 预览生成代码 // 预览生成代码
@@ -48,7 +48,7 @@ export function previewTable(tableId) {
return request({ return request({
url: '/tool/gen/preview/' + tableId, url: '/tool/gen/preview/' + tableId,
method: 'get' method: 'get'
}) });
} }
// 删除表数据 // 删除表数据
@@ -56,7 +56,7 @@ export function delTable(tableId) {
return request({ return request({
url: '/tool/gen/' + tableId, url: '/tool/gen/' + tableId,
method: 'delete' method: 'delete'
}) });
} }
// 生成代码（自定义路径） // 生成代码（自定义路径）
@@ -64,7 +64,7 @@ export function genCode(tableName) {
return request({ return request({
url: '/tool/gen/genCode/' + tableName, url: '/tool/gen/genCode/' + tableName,
method: 'get' method: 'get'
}) });
} }
// 同步数据库 // 同步数据库
@@ -72,5 +72,5 @@ export function synchDb(tableName) {
return request({ return request({
url: '/tool/gen/synchDb/' + tableName, url: '/tool/gen/synchDb/' + tableName,
method: 'get' method: 'get'
}) });
} }

45
src/api/zs/clue.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询线索列表 // 查询线索列表
export function getClueList(query) { export function getClueList(query) {
@@ -6,7 +6,7 @@ export function getClueList(query) {
url: '/zs/clue/list', url: '/zs/clue/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 新增线索 // 新增线索
@@ -15,7 +15,7 @@ export function addClue(data) {
url: '/zs/clue', url: '/zs/clue',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 修改线索 // 修改线索
@@ -24,7 +24,7 @@ export function updateClue(data) {
url: '/zs/clue', url: '/zs/clue',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 删除 // 删除
@@ -33,7 +33,7 @@ export function deleteClue(data) {
url: '/zs/clue', url: '/zs/clue',
method: 'delete', method: 'delete',
params: data params: data
}) });
} }
// 导出 // 导出
export function exportData(query) { export function exportData(query) {
@@ -41,7 +41,7 @@ export function exportData(query) {
url: '/zs/clue/export', url: '/zs/clue/export',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 导入模板 // 导入模板
@@ -50,7 +50,7 @@ export function importTemplate(param) {
url: '/zs/clue/importTemplate', url: '/zs/clue/importTemplate',
method: 'get', method: 'get',
params: param params: param
}) });
} }
// 导入 // 导入
export function importData(data) { export function importData(data) {
@@ -58,7 +58,7 @@ export function importData(data) {
url: '/zs/clue/importData', url: '/zs/clue/importData',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 查询登记getSign // 查询登记getSign
@@ -67,7 +67,7 @@ export function getSign(query) {
url: '/zs/clue/sign', url: '/zs/clue/sign',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 保存登记 // 保存登记
export function saveSign(data) { export function saveSign(data) {
@@ -75,7 +75,7 @@ export function saveSign(data) {
url: '/zs/clue/sign', url: '/zs/clue/sign',
method: 'post', method: 'post',
data: data data: data
}) });
} }
// 甩单 // 甩单
@@ -84,7 +84,7 @@ export function saveDistribute(data) {
url: '/zs/clue/distribute', url: '/zs/clue/distribute',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 驳回 // 驳回
@@ -93,7 +93,7 @@ export function refuse(data) {
url: '/zs/clue/refuse', url: '/zs/clue/refuse',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 查询甩单记录 // 查询甩单记录
@@ -102,7 +102,7 @@ export function getDistributeRecord(param) {
url: '/zs/clue/distributerecord', url: '/zs/clue/distributerecord',
method: 'get', method: 'get',
params: param params: param
}) });
} }
// 查询跟踪记录 // 查询跟踪记录
@@ -111,8 +111,7 @@ export function getFollowRecord(param) {
url: '/zs/clue/followrecord', url: '/zs/clue/followrecord',
method: 'get', method: 'get',
params: param params: param
}) });
} }
// //
@@ -122,14 +121,14 @@ export function getConsultRecord(param) {
url: '/zs/clue/consultrecord', url: '/zs/clue/consultrecord',
method: 'get', method: 'get',
params: param params: param
}) });
} }
// 获取已过期 // 获取已过期
export function getClueCountBadge() { export function getClueCountBadge() {
return request({ return request({
url: `/zs/clue/badgeCount`, url: `/zs/clue/badgeCount`,
method: 'get' method: 'get'
}) });
} }
// 批量更新 // 批量更新
@@ -138,7 +137,7 @@ export function batchUpdate(data) {
url: `/zs/clue/batchUpdate`, url: `/zs/clue/batchUpdate`,
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 公海线索 getPublicList // 公海线索 getPublicList
@@ -147,7 +146,7 @@ export function getPublicList(param) {
url: `/zs/clue/public/list`, url: `/zs/clue/public/list`,
method: 'get', method: 'get',
params: param params: param
}) });
} }
// 拾取线索 // 拾取线索
@@ -156,7 +155,7 @@ export function pickupClue(data) {
url: `/zs/clue/public/pickup`, url: `/zs/clue/public/pickup`,
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 丢弃线索 // 丢弃线索
@@ -165,7 +164,7 @@ export function discardClue(data) {
url: `/zs/clue/public/discard`, url: `/zs/clue/public/discard`,
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 查询接收 // 查询接收
@@ -173,7 +172,7 @@ export function getAccept() {
return request({ return request({
url: `/zs/clue/accept`, url: `/zs/clue/accept`,
method: 'get' method: 'get'
}) });
} }
// 丢弃线索 // 丢弃线索
@@ -182,5 +181,5 @@ export function updateAccept(data) {
url: `/zs/clue/accept`, url: `/zs/clue/accept`,
method: 'put', method: 'put',
data: data data: data
}) });
} }

26
src/api/zs/sign.js
View File

@@ -1,4 +1,4 @@
import request from '@/utils/request' import request from '@/utils/request';
// 查询线索列表 // 查询线索列表
export function getSignList(query) { export function getSignList(query) {
@@ -6,7 +6,7 @@ export function getSignList(query) {
url: '/zs/sign/list', url: '/zs/sign/list',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 导出 // 导出
@@ -15,7 +15,7 @@ export function exportData(query) {
url: '/zs/sign/export', url: '/zs/sign/export',
method: 'get', method: 'get',
params: query params: query
}) });
} }
// 导入模板 // 导入模板
@@ -23,7 +23,7 @@ export function importTemplate() {
return request({ return request({
url: '/zs/sign/importTemplate', url: '/zs/sign/importTemplate',
method: 'get' method: 'get'
}) });
} }
// 导入 // 导入
export function importData(data) { export function importData(data) {
@@ -31,16 +31,15 @@ export function importData(data) {
url: '/zs/sign/importData', url: '/zs/sign/importData',
method: 'post', method: 'post',
data: data data: data
}) });
} }
export function addSign(data) { export function addSign(data) {
return request({ return request({
url: '/zs/sign', url: '/zs/sign',
method: 'post', method: 'post',
data: data data: data
}) });
} }
export function updateSign(data) { export function updateSign(data) {
@@ -48,7 +47,7 @@ export function updateSign(data) {
url: '/zs/sign', url: '/zs/sign',
method: 'put', method: 'put',
data: data data: data
}) });
} }
export function getClues(param) { export function getClues(param) {
@@ -56,17 +55,15 @@ export function getClues(param) {
url: '/zs/sign/clue', url: '/zs/sign/clue',
method: 'get', method: 'get',
params: param params: param
}) });
} }
export function deleteSign(data) { export function deleteSign(data) {
return request({ return request({
url: '/zs/sign', url: '/zs/sign',
method: 'delete', method: 'delete',
params: data params: data
}) });
} }
// 审核登记 // 审核登记
@@ -75,15 +72,14 @@ export function checkSign(data) {
url: '/zs/sign/check', url: '/zs/sign/check',
method: 'put', method: 'put',
data: data data: data
}) });
} }
// 审核记录 // 审核记录
export function getCheckRecord(data) { export function getCheckRecord(data) {
return request({ return request({
url: '/zs/sign/check', url: '/zs/sign/check',
method: 'get', method: 'get',
params: data params: data
}) });
} }

12
src/assets/icons/index.js
View File

@@ -1,9 +1,9 @@
import Vue from 'vue' import Vue from 'vue';
import SvgIcon from '@/components/SvgIcon'// svg component import SvgIcon from '@/components/SvgIcon'; // svg component
// register globally // register globally
Vue.component('svg-icon', SvgIcon) Vue.component('SvgIcon', SvgIcon);
const req = require.context('./svg', false, /\.svg$/) const req = require.context('./svg', false, /\.svg$/);
const requireAll = requireContext => requireContext.keys().map(requireContext) const requireAll = (requireContext) => requireContext.keys().map(requireContext);
requireAll(req) requireAll(req);

37
src/components/Breadcrumb/index.vue
View File

@@ -14,49 +14,54 @@ export default {
data() { data() {
return { return {
levelList: null levelList: null
} };
}, },
watch: { watch: {
$route(route) { $route(route) {
// if you go to the redirect page, do not update the breadcrumbs // if you go to the redirect page, do not update the breadcrumbs
if (route.path.startsWith('/redirect/')) { if (route.path.startsWith('/redirect/')) {
return return;
} }
this.getBreadcrumb() this.getBreadcrumb();
} }
}, },
created() { created() {
this.getBreadcrumb() this.getBreadcrumb();
}, },
methods: { methods: {
getBreadcrumb() { getBreadcrumb() {
// only show routes with meta.title // only show routes with meta.title
let matched = this.$route.matched.filter(item => item.meta && item.meta.title) let matched = this.$route.matched.filter((item) => item.meta && item.meta.title);
const first = matched[0] const first = matched[0];
if (!this.isDashboard(first)) { if (!this.isDashboard(first)) {
matched = [{ path: '/index', meta: { title: '首页' }}].concat(matched) matched = [
{
path: '/index',
meta: { title: '首页' }
}
].concat(matched);
} }
this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false) this.levelList = matched.filter((item) => item.meta && item.meta.title && item.meta.breadcrumb !== false);
}, },
isDashboard(route) { isDashboard(route) {
const name = route && route.name const name = route && route.name;
if (!name) { if (!name) {
return false return false;
} }
return name.trim() === 'Index' return name.trim() === 'Index';
}, },
handleLink(item) { handleLink(item) {
const { redirect, path } = item const { redirect, path } = item;
if (redirect) { if (redirect) {
this.$router.push(redirect) this.$router.push(redirect);
return return;
}
this.$router.push(path)
} }
this.$router.push(path);
} }
} }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

105
src/components/Crontab/day.vue
View File

@@ -1,50 +1,50 @@
<template> <template>
<el-form size="small"> <el-form size="small">
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="1"> <el-radio v-model="radioValue" :label="1">
日，允许的通配符[, - * ? / L W] 日，允许的通配符[, - * ? / L W]
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="2"> <el-radio v-model="radioValue" :label="2">
不指定 不指定
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="3"> <el-radio v-model="radioValue" :label="3">
周期从 周期从
<el-input-number v-model='cycle01' :min="1" :max="30" /> - <el-input-number v-model="cycle01" :min="1" :max="30" /> -
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : 2" :max="31" /> 日 <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 2" :max="31" /> 日
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="4"> <el-radio v-model="radioValue" :label="4">
从 从
<el-input-number v-model='average01' :min="1" :max="30" /> 号开始，每 <el-input-number v-model="average01" :min="1" :max="30" /> 号开始，每
<el-input-number v-model='average02' :min="1" :max="31 - average01 || 1" /> 日执行一次 <el-input-number v-model="average02" :min="1" :max="31 - average01 || 1" /> 日执行一次
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="5"> <el-radio v-model="radioValue" :label="5">
每月 每月
<el-input-number v-model='workday' :min="1" :max="31" /> 号最近的那个工作日 <el-input-number v-model="workday" :min="1" :max="31" /> 号最近的那个工作日
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="6"> <el-radio v-model="radioValue" :label="6">
本月最后一天 本月最后一天
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="7"> <el-radio v-model="radioValue" :label="7">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> <el-select v-model="checkboxList" clearable placeholder="可多选" multiple style="width:100%">
<el-option v-for="item in 31" :key="item" :value="item">{{ item }}</el-option> <el-option v-for="item in 31" :key="item" :value="item">{{ item }}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
@@ -54,6 +54,9 @@
<script> <script>
export default { export default {
name: 'CrontabDay',
// eslint-disable-next-line vue/require-prop-types
props: ['check', 'cron'],
data() { data() {
return { return {
radioValue: 1, radioValue: 1,
@@ -64,16 +67,45 @@ export default {
average02: 1, average02: 1,
checkboxList: [], checkboxList: [],
checkNum: this.$options.propsData.check checkNum: this.$options.propsData.check
};
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, 1, 30);
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : 2, 31, 31);
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, 1, 30);
const average02 = this.checkNum(this.average02, 1, 31 - average01 || 0);
return average01 + '/' + average02;
},
// 计算工作日格式
workdayCheck: function () {
const workday = this.checkNum(this.workday, 1, 31);
return workday;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
const str = this.checkboxList.join();
return str === '' ? '*' : str;
} }
}, },
name: 'crontab-day', watch: {
props: ['check', 'cron'], radioValue: 'radioChange',
cycleTotal: 'cycleChange',
averageTotal: 'averageChange',
workdayCheck: 'workdayChange',
checkboxString: 'checkboxChange'
},
methods: { methods: {
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
('day rachange'); ('day rachange');
if (this.radioValue !== 2 && this.cron.week !== '?') { if (this.radioValue !== 2 && this.cron.week !== '?') {
this.$emit('update', 'week', '?', 'day') this.$emit('update', 'week', '?', 'day');
} }
switch (this.radioValue) { switch (this.radioValue) {
@@ -103,59 +135,28 @@ export default {
}, },
// 周期两个值变化时 // 周期两个值变化时
cycleChange() { cycleChange() {
if (this.radioValue == '3') { if (this.radioValue === '3') {
this.$emit('update', 'day', this.cycleTotal); this.$emit('update', 'day', this.cycleTotal);
} }
}, },
// 平均两个值变化时 // 平均两个值变化时
averageChange() { averageChange() {
if (this.radioValue == '4') { if (this.radioValue === '4') {
this.$emit('update', 'day', this.averageTotal); this.$emit('update', 'day', this.averageTotal);
} }
}, },
// 最近工作日值变化时 // 最近工作日值变化时
workdayChange() { workdayChange() {
if (this.radioValue == '5') { if (this.radioValue === '5') {
this.$emit('update', 'day', this.workdayCheck + 'W'); this.$emit('update', 'day', this.workdayCheck + 'W');
} }
}, },
// checkbox值变化时 // checkbox值变化时
checkboxChange() { checkboxChange() {
if (this.radioValue == '7') { if (this.radioValue === '7') {
this.$emit('update', 'day', this.checkboxString); this.$emit('update', 'day', this.checkboxString);
} }
} }
},
watch: {
'radioValue': 'radioChange',
'cycleTotal': 'cycleChange',
'averageTotal': 'averageChange',
'workdayCheck': 'workdayChange',
'checkboxString': 'checkboxChange',
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, 1, 30)
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : 2, 31, 31)
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, 1, 30)
const average02 = this.checkNum(this.average02, 1, 31 - average01 || 0)
return average01 + '/' + average02;
},
// 计算工作日格式
workdayCheck: function () {
const workday = this.checkNum(this.workday, 1, 31)
return workday;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
let str = this.checkboxList.join();
return str == '' ? '*' : str;
}
}
} }
};
</script> </script>

83
src/components/Crontab/hour.vue
View File

@@ -1,31 +1,31 @@
<template> <template>
<el-form size="small"> <el-form size="small">
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="1"> <el-radio v-model="radioValue" :label="1">
小时，允许的通配符[, - * /] 小时，允许的通配符[, - * /]
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="2"> <el-radio v-model="radioValue" :label="2">
周期从 周期从
<el-input-number v-model='cycle01' :min="0" :max="22" /> - <el-input-number v-model="cycle01" :min="0" :max="22" /> -
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : 1" :max="23" /> 小时 <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="23" /> 小时
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="3"> <el-radio v-model="radioValue" :label="3">
从 从
<el-input-number v-model='average01' :min="0" :max="22" /> 小时开始，每 <el-input-number v-model="average01" :min="0" :max="22" /> 小时开始，每
<el-input-number v-model='average02' :min="1" :max="23 - average01 || 0" /> 小时执行一次 <el-input-number v-model="average02" :min="1" :max="23 - average01 || 0" /> 小时执行一次
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="4"> <el-radio v-model="radioValue" :label="4">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> <el-select v-model="checkboxList" clearable placeholder="可多选" multiple style="width:100%">
<el-option v-for="item in 24" :key="item" :value="item-1">{{ item-1 }}</el-option> <el-option v-for="item in 24" :key="item" :value="item-1">{{ item-1 }}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
@@ -35,6 +35,9 @@
<script> <script>
export default { export default {
name: 'CrontabHour',
// eslint-disable-next-line vue/require-prop-types
props: ['check', 'cron'],
data() { data() {
return { return {
radioValue: 1, radioValue: 1,
@@ -44,16 +47,39 @@ export default {
average02: 1, average02: 1,
checkboxList: [], checkboxList: [],
checkNum: this.$options.propsData.check checkNum: this.$options.propsData.check
};
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, 0, 22);
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : 1, 23);
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, 0, 22);
const average02 = this.checkNum(this.average02, 1, 23 - average01 || 0);
return average01 + '/' + average02;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
const str = this.checkboxList.join();
return str === '' ? '*' : str;
} }
}, },
name: 'crontab-hour', watch: {
props: ['check', 'cron'], radioValue: 'radioChange',
cycleTotal: 'cycleChange',
averageTotal: 'averageChange',
checkboxString: 'checkboxChange'
},
methods: { methods: {
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
switch (this.radioValue) { switch (this.radioValue) {
case 1: case 1:
this.$emit('update', 'hour', '*') this.$emit('update', 'hour', '*');
break; break;
case 2: case 2:
this.$emit('update', 'hour', this.cycleTotal); this.$emit('update', 'hour', this.cycleTotal);
@@ -68,47 +94,22 @@ export default {
}, },
// 周期两个值变化时 // 周期两个值变化时
cycleChange() { cycleChange() {
if (this.radioValue == '2') { if (this.radioValue === '2') {
this.$emit('update', 'hour', this.cycleTotal); this.$emit('update', 'hour', this.cycleTotal);
} }
}, },
// 平均两个值变化时 // 平均两个值变化时
averageChange() { averageChange() {
if (this.radioValue == '3') { if (this.radioValue === '3') {
this.$emit('update', 'hour', this.averageTotal); this.$emit('update', 'hour', this.averageTotal);
} }
}, },
// checkbox值变化时 // checkbox值变化时
checkboxChange() { checkboxChange() {
if (this.radioValue == '4') { if (this.radioValue === '4') {
this.$emit('update', 'hour', this.checkboxString); this.$emit('update', 'hour', this.checkboxString);
} }
} }
},
watch: {
'radioValue': 'radioChange',
'cycleTotal': 'cycleChange',
'averageTotal': 'averageChange',
'checkboxString': 'checkboxChange'
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, 0, 22)
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : 1, 23)
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, 0, 22)
const average02 = this.checkNum(this.average02, 1, 23 - average01 || 0)
return average01 + '/' + average02;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
let str = this.checkboxList.join();
return str == '' ? '*' : str;
}
}
} }
};
</script> </script>

314
src/components/Crontab/index.vue
View File

@@ -1,67 +1,32 @@
<template> <template>
<div> <div>
<el-tabs type="border-card"> <el-tabs type="border-card">
<el-tab-pane label="秒" v-if="shouldHide('second')"> <el-tab-pane v-if="shouldHide('second')" label="秒">
<CrontabSecond <CrontabSecond ref="cronsecond" :check="checkNumber" :cron="crontabValueObj" @update="updateCrontabValue" />
@update="updateCrontabValue"
:check="checkNumber"
:cron="crontabValueObj"
ref="cronsecond"
/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="分钟" v-if="shouldHide('min')"> <el-tab-pane v-if="shouldHide('min')" label="分钟">
<CrontabMin <CrontabMin ref="cronmin" :check="checkNumber" :cron="crontabValueObj" @update="updateCrontabValue" />
@update="updateCrontabValue"
:check="checkNumber"
:cron="crontabValueObj"
ref="cronmin"
/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="小时" v-if="shouldHide('hour')"> <el-tab-pane v-if="shouldHide('hour')" label="小时">
<CrontabHour <CrontabHour ref="cronhour" :check="checkNumber" :cron="crontabValueObj" @update="updateCrontabValue" />
@update="updateCrontabValue"
:check="checkNumber"
:cron="crontabValueObj"
ref="cronhour"
/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="日" v-if="shouldHide('day')"> <el-tab-pane v-if="shouldHide('day')" label="日">
<CrontabDay <CrontabDay ref="cronday" :check="checkNumber" :cron="crontabValueObj" @update="updateCrontabValue" />
@update="updateCrontabValue"
:check="checkNumber"
:cron="crontabValueObj"
ref="cronday"
/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="月" v-if="shouldHide('month')"> <el-tab-pane v-if="shouldHide('month')" label="月">
<CrontabMonth <CrontabMonth ref="cronmonth" :check="checkNumber" :cron="crontabValueObj" @update="updateCrontabValue" />
@update="updateCrontabValue"
:check="checkNumber"
:cron="crontabValueObj"
ref="cronmonth"
/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="周" v-if="shouldHide('week')"> <el-tab-pane v-if="shouldHide('week')" label="周">
<CrontabWeek <CrontabWeek ref="cronweek" :check="checkNumber" :cron="crontabValueObj" @update="updateCrontabValue" />
@update="updateCrontabValue"
:check="checkNumber"
:cron="crontabValueObj"
ref="cronweek"
/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="年" v-if="shouldHide('year')"> <el-tab-pane v-if="shouldHide('year')" label="年">
<CrontabYear <CrontabYear ref="cronyear" :check="checkNumber" :cron="crontabValueObj" @update="updateCrontabValue" />
@update="updateCrontabValue"
:check="checkNumber"
:cron="crontabValueObj"
ref="cronyear"
/>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@@ -70,7 +35,7 @@
<p class="title">时间表达式</p> <p class="title">时间表达式</p>
<table> <table>
<thead> <thead>
<th v-for="item of tabTitles" width="40" :key="item">{{item}}</th> <th v-for="item of tabTitles" :key="item" width="40">{{ item }}</th>
<th>Cron 表达式</th> <th>Cron 表达式</th>
</thead> </thead>
<tbody> <tbody>
@@ -101,7 +66,7 @@
</tbody> </tbody>
</table> </table>
</div> </div>
<CrontabResult :ex="crontabValueString"></CrontabResult> <CrontabResult :ex="crontabValueString" />
<div class="pop_btn"> <div class="pop_btn">
<el-button size="small" type="primary" @click="submitFill">确定</el-button> <el-button size="small" type="primary" @click="submitFill">确定</el-button>
@@ -113,34 +78,62 @@
</template> </template>
<script> <script>
import CrontabSecond from "./second.vue"; import CrontabSecond from './second.vue';
import CrontabMin from "./min.vue"; import CrontabMin from './min.vue';
import CrontabHour from "./hour.vue"; import CrontabHour from './hour.vue';
import CrontabDay from "./day.vue"; import CrontabDay from './day.vue';
import CrontabMonth from "./month.vue"; import CrontabMonth from './month.vue';
import CrontabWeek from "./week.vue"; import CrontabWeek from './week.vue';
import CrontabYear from "./year.vue"; import CrontabYear from './year.vue';
import CrontabResult from "./result.vue"; import CrontabResult from './result.vue';
export default { export default {
name: 'Vcrontab',
components: {
CrontabSecond,
CrontabMin,
CrontabHour,
CrontabDay,
CrontabMonth,
CrontabWeek,
CrontabYear,
CrontabResult
},
// eslint-disable-next-line vue/require-prop-types
props: ['expression', 'hideComponent'],
data() { data() {
return { return {
tabTitles: ["秒", "分钟", "小时", "日", "月", "周", "年"], tabTitles: ['秒', '分钟', '小时', '日', '月', '周', '年'],
tabActive: 0, tabActive: 0,
myindex: 0, myindex: 0,
crontabValueObj: { crontabValueObj: {
second: "*", second: '*',
min: "*", min: '*',
hour: "*", hour: '*',
day: "*", day: '*',
month: "*", month: '*',
week: "?", week: '?',
year: "", year: ''
}, }
}; };
}, },
name: "vcrontab", computed: {
props: ["expression", "hideComponent"], crontabValueString: function () {
const obj = this.crontabValueObj;
const str =
obj.second + ' ' + obj.min + ' ' + obj.hour + ' ' + obj.day + ' ' + obj.month + ' ' + obj.week + (obj.year == '' ? '' : ' ' + obj.year);
return str;
}
},
watch: {
expression: 'resolveExp',
hideComponent(value) {
// 隐藏部分组件
}
},
mounted: function () {
this.resolveExp();
},
methods: { methods: {
shouldHide(key) { shouldHide(key) {
if (this.hideComponent && this.hideComponent.includes(key)) return false; if (this.hideComponent && this.hideComponent.includes(key)) return false;
@@ -149,22 +142,22 @@ export default {
resolveExp() { resolveExp() {
// 反解析 表达式 // 反解析 表达式
if (this.expression) { if (this.expression) {
let arr = this.expression.split(" "); const arr = this.expression.split(' ');
if (arr.length >= 6) { if (arr.length >= 6) {
// 6 位以上是合法表达式 // 6 位以上是合法表达式
let obj = { const obj = {
second: arr[0], second: arr[0],
min: arr[1], min: arr[1],
hour: arr[2], hour: arr[2],
day: arr[3], day: arr[3],
month: arr[4], month: arr[4],
week: arr[5], week: arr[5],
year: arr[6] ? arr[6] : "", year: arr[6] ? arr[6] : ''
}; };
this.crontabValueObj = { this.crontabValueObj = {
...obj, ...obj
}; };
for (let i in obj) { for (const i in obj) {
if (obj[i]) this.changeRadio(i, obj[i]); if (obj[i]) this.changeRadio(i, obj[i]);
} }
} }
@@ -179,7 +172,8 @@ export default {
}, },
// 由子组件触发，更改表达式组成的字段值 // 由子组件触发，更改表达式组成的字段值
updateCrontabValue(name, value, from) { updateCrontabValue(name, value, from) {
"updateCrontabValue", name, value, from; // eslint-disable-next-line no-sequences
'updateCrontabValue', name, value, from;
this.crontabValueObj[name] = value; this.crontabValueObj[name] = value;
if (from && from !== name) { if (from && from !== name) {
console.log(`来自组件 ${from} 改变了 ${name} ${value}`); console.log(`来自组件 ${from} 改变了 ${name} ${value}`);
@@ -188,104 +182,88 @@ export default {
}, },
// 赋值到组件 // 赋值到组件
changeRadio(name, value) { changeRadio(name, value) {
let arr = ["second", "min", "hour", "month"], const arr = ['second', 'min', 'hour', 'month'];
refName = "cron" + name, const refName = 'cron' + name;
insValue; let insValue;
if (!this.$refs[refName]) return; if (!this.$refs[refName]) return;
if (arr.includes(name)) { if (arr.includes(name)) {
if (value === "*") { if (value === '*') {
insValue = 1; insValue = 1;
} else if (value.indexOf("-") > -1) { } else if (value.indexOf('-') > -1) {
let indexArr = value.split("-"); const indexArr = value.split('-');
isNaN(indexArr[0]) isNaN(indexArr[0]) ? (this.$refs[refName].cycle01 = 0) : (this.$refs[refName].cycle01 = indexArr[0]);
? (this.$refs[refName].cycle01 = 0)
: (this.$refs[refName].cycle01 = indexArr[0]);
this.$refs[refName].cycle02 = indexArr[1]; this.$refs[refName].cycle02 = indexArr[1];
insValue = 2; insValue = 2;
} else if (value.indexOf("/") > -1) { } else if (value.indexOf('/') > -1) {
let indexArr = value.split("/"); const indexArr = value.split('/');
isNaN(indexArr[0]) isNaN(indexArr[0]) ? (this.$refs[refName].average01 = 0) : (this.$refs[refName].average01 = indexArr[0]);
? (this.$refs[refName].average01 = 0)
: (this.$refs[refName].average01 = indexArr[0]);
this.$refs[refName].average02 = indexArr[1]; this.$refs[refName].average02 = indexArr[1];
insValue = 3; insValue = 3;
} else { } else {
insValue = 4; insValue = 4;
this.$refs[refName].checkboxList = value.split(","); this.$refs[refName].checkboxList = value.split(',');
} }
} else if (name == "day") { } else if (name == 'day') {
if (value === "*") { if (value === '*') {
insValue = 1; insValue = 1;
} else if (value == "?") { } else if (value == '?') {
insValue = 2; insValue = 2;
} else if (value.indexOf("-") > -1) { } else if (value.indexOf('-') > -1) {
let indexArr = value.split("-"); const indexArr = value.split('-');
isNaN(indexArr[0]) isNaN(indexArr[0]) ? (this.$refs[refName].cycle01 = 0) : (this.$refs[refName].cycle01 = indexArr[0]);
? (this.$refs[refName].cycle01 = 0)
: (this.$refs[refName].cycle01 = indexArr[0]);
this.$refs[refName].cycle02 = indexArr[1]; this.$refs[refName].cycle02 = indexArr[1];
insValue = 3; insValue = 3;
} else if (value.indexOf("/") > -1) { } else if (value.indexOf('/') > -1) {
let indexArr = value.split("/"); const indexArr = value.split('/');
isNaN(indexArr[0]) isNaN(indexArr[0]) ? (this.$refs[refName].average01 = 0) : (this.$refs[refName].average01 = indexArr[0]);
? (this.$refs[refName].average01 = 0)
: (this.$refs[refName].average01 = indexArr[0]);
this.$refs[refName].average02 = indexArr[1]; this.$refs[refName].average02 = indexArr[1];
insValue = 4; insValue = 4;
} else if (value.indexOf("W") > -1) { } else if (value.indexOf('W') > -1) {
let indexArr = value.split("W"); const indexArr = value.split('W');
isNaN(indexArr[0]) isNaN(indexArr[0]) ? (this.$refs[refName].workday = 0) : (this.$refs[refName].workday = indexArr[0]);
? (this.$refs[refName].workday = 0)
: (this.$refs[refName].workday = indexArr[0]);
insValue = 5; insValue = 5;
} else if (value === "L") { } else if (value === 'L') {
insValue = 6; insValue = 6;
} else { } else {
this.$refs[refName].checkboxList = value.split(","); this.$refs[refName].checkboxList = value.split(',');
insValue = 7; insValue = 7;
} }
} else if (name == "week") { } else if (name == 'week') {
if (value === "*") { if (value === '*') {
insValue = 1; insValue = 1;
} else if (value == "?") { } else if (value == '?') {
insValue = 2; insValue = 2;
} else if (value.indexOf("-") > -1) { } else if (value.indexOf('-') > -1) {
let indexArr = value.split("-"); const indexArr = value.split('-');
isNaN(indexArr[0]) isNaN(indexArr[0]) ? (this.$refs[refName].cycle01 = 0) : (this.$refs[refName].cycle01 = indexArr[0]);
? (this.$refs[refName].cycle01 = 0)
: (this.$refs[refName].cycle01 = indexArr[0]);
this.$refs[refName].cycle02 = indexArr[1]; this.$refs[refName].cycle02 = indexArr[1];
insValue = 3; insValue = 3;
} else if (value.indexOf("#") > -1) { } else if (value.indexOf('#') > -1) {
let indexArr = value.split("#"); const indexArr = value.split('#');
isNaN(indexArr[0]) isNaN(indexArr[0]) ? (this.$refs[refName].average01 = 1) : (this.$refs[refName].average01 = indexArr[0]);
? (this.$refs[refName].average01 = 1)
: (this.$refs[refName].average01 = indexArr[0]);
this.$refs[refName].average02 = indexArr[1]; this.$refs[refName].average02 = indexArr[1];
insValue = 4; insValue = 4;
} else if (value.indexOf("L") > -1) { } else if (value.indexOf('L') > -1) {
let indexArr = value.split("L"); const indexArr = value.split('L');
isNaN(indexArr[0]) isNaN(indexArr[0]) ? (this.$refs[refName].weekday = 1) : (this.$refs[refName].weekday = indexArr[0]);
? (this.$refs[refName].weekday = 1)
: (this.$refs[refName].weekday = indexArr[0]);
insValue = 5; insValue = 5;
} else { } else {
this.$refs[refName].checkboxList = value.split(","); this.$refs[refName].checkboxList = value.split(',');
insValue = 6; insValue = 6;
} }
} else if (name == "year") { } else if (name == 'year') {
if (value == "") { if (value == '') {
insValue = 1; insValue = 1;
} else if (value == "*") { } else if (value == '*') {
insValue = 2; insValue = 2;
} else if (value.indexOf("-") > -1) { } else if (value.indexOf('-') > -1) {
insValue = 3; insValue = 3;
} else if (value.indexOf("/") > -1) { } else if (value.indexOf('/') > -1) {
insValue = 4; insValue = 4;
} else { } else {
this.$refs[refName].checkboxList = value.split(","); this.$refs[refName].checkboxList = value.split(',');
insValue = 5; insValue = 5;
} }
} }
@@ -304,68 +282,30 @@ export default {
}, },
// 隐藏弹窗 // 隐藏弹窗
hidePopup() { hidePopup() {
this.$emit("hide"); this.$emit('hide');
}, },
// 填充表达式 // 填充表达式
submitFill() { submitFill() {
this.$emit("fill", this.crontabValueString); this.$emit('fill', this.crontabValueString);
this.hidePopup(); this.hidePopup();
}, },
clearCron() { clearCron() {
// 还原选择项 // 还原选择项
("准备还原"); ('准备还原');
this.crontabValueObj = { this.crontabValueObj = {
second: "*", second: '*',
min: "*", min: '*',
hour: "*", hour: '*',
day: "*", day: '*',
month: "*", month: '*',
week: "?", week: '?',
year: "", year: ''
}; };
for (let j in this.crontabValueObj) { for (const j in this.crontabValueObj) {
this.changeRadio(j, this.crontabValueObj[j]); this.changeRadio(j, this.crontabValueObj[j]);
} }
}, }
}, }
computed: {
crontabValueString: function() {
let obj = this.crontabValueObj;
let str =
obj.second +
" " +
obj.min +
" " +
obj.hour +
" " +
obj.day +
" " +
obj.month +
" " +
obj.week +
(obj.year == "" ? "" : " " + obj.year);
return str;
},
},
components: {
CrontabSecond,
CrontabMin,
CrontabHour,
CrontabDay,
CrontabMonth,
CrontabWeek,
CrontabYear,
CrontabResult,
},
watch: {
expression: "resolveExp",
hideComponent(value) {
// 隐藏部分组件
},
},
mounted: function() {
this.resolveExp();
},
}; };
</script> </script>
<style scoped> <style scoped>

75
src/components/Crontab/min.vue
View File

@@ -1,31 +1,31 @@
<template> <template>
<el-form size="small"> <el-form size="small">
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="1"> <el-radio v-model="radioValue" :label="1">
分钟，允许的通配符[, - * /] 分钟，允许的通配符[, - * /]
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="2"> <el-radio v-model="radioValue" :label="2">
周期从 周期从
<el-input-number v-model='cycle01' :min="0" :max="58" /> - <el-input-number v-model="cycle01" :min="0" :max="58" /> -
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 分钟 <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 分钟
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="3"> <el-radio v-model="radioValue" :label="3">
从 从
<el-input-number v-model='average01' :min="0" :max="58" /> 分钟开始，每 <el-input-number v-model="average01" :min="0" :max="58" /> 分钟开始，每
<el-input-number v-model='average02' :min="1" :max="59 - average01 || 0" /> 分钟执行一次 <el-input-number v-model="average02" :min="1" :max="59 - average01 || 0" /> 分钟执行一次
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="4"> <el-radio v-model="radioValue" :label="4">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> <el-select v-model="checkboxList" clearable placeholder="可多选" multiple style="width:100%">
<el-option v-for="item in 60" :key="item" :value="item-1">{{ item-1 }}</el-option> <el-option v-for="item in 60" :key="item" :value="item-1">{{ item-1 }}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
@@ -36,6 +36,8 @@
<script> <script>
export default { export default {
name: 'CrontabMin',
props: ['check', 'cron'],
data() { data() {
return { return {
radioValue: 1, radioValue: 1,
@@ -45,10 +47,33 @@ export default {
average02: 1, average02: 1,
checkboxList: [], checkboxList: [],
checkNum: this.$options.propsData.check checkNum: this.$options.propsData.check
};
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, 0, 58);
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : 1, 59);
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, 0, 58);
const average02 = this.checkNum(this.average02, 1, 59 - average01 || 0);
return average01 + '/' + average02;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
const str = this.checkboxList.join();
return str == '' ? '*' : str;
} }
}, },
name: 'crontab-min', watch: {
props: ['check', 'cron'], radioValue: 'radioChange',
cycleTotal: 'cycleChange',
averageTotal: 'averageChange',
checkboxString: 'checkboxChange'
},
methods: { methods: {
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
@@ -84,33 +109,7 @@ export default {
if (this.radioValue == '4') { if (this.radioValue == '4') {
this.$emit('update', 'min', this.checkboxString, 'min'); this.$emit('update', 'min', this.checkboxString, 'min');
} }
},
},
watch: {
'radioValue': 'radioChange',
'cycleTotal': 'cycleChange',
'averageTotal': 'averageChange',
'checkboxString': 'checkboxChange',
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, 0, 58)
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : 1, 59)
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, 0, 58)
const average02 = this.checkNum(this.average02, 1, 59 - average01 || 0)
return average01 + '/' + average02;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
let str = this.checkboxList.join();
return str == '' ? '*' : str;
}
} }
} }
};
</script> </script>

76
src/components/Crontab/month.vue
View File

@@ -1,31 +1,31 @@
<template> <template>
<el-form size='small'> <el-form size="small">
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="1"> <el-radio v-model="radioValue" :label="1">
月，允许的通配符[, - * /] 月，允许的通配符[, - * /]
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="2"> <el-radio v-model="radioValue" :label="2">
周期从 周期从
<el-input-number v-model='cycle01' :min="1" :max="11" /> - <el-input-number v-model="cycle01" :min="1" :max="11" /> -
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : 2" :max="12" /> 月 <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 2" :max="12" /> 月
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="3"> <el-radio v-model="radioValue" :label="3">
从 从
<el-input-number v-model='average01' :min="1" :max="11" /> 月开始，每 <el-input-number v-model="average01" :min="1" :max="11" /> 月开始，每
<el-input-number v-model='average02' :min="1" :max="12 - average01 || 0" /> 月月执行一次 <el-input-number v-model="average02" :min="1" :max="12 - average01 || 0" /> 月月执行一次
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="4"> <el-radio v-model="radioValue" :label="4">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> <el-select v-model="checkboxList" clearable placeholder="可多选" multiple style="width:100%">
<el-option v-for="item in 12" :key="item" :value="item">{{ item }}</el-option> <el-option v-for="item in 12" :key="item" :value="item">{{ item }}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
@@ -35,6 +35,8 @@
<script> <script>
export default { export default {
name: 'CrontabMonth',
props: ['check', 'cron'],
data() { data() {
return { return {
radioValue: 1, radioValue: 1,
@@ -44,10 +46,33 @@ export default {
average02: 1, average02: 1,
checkboxList: [], checkboxList: [],
checkNum: this.check checkNum: this.check
};
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, 1, 11);
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : 2, 12);
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, 1, 11);
const average02 = this.checkNum(this.average02, 1, 12 - average01 || 0);
return average01 + '/' + average02;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
const str = this.checkboxList.join();
return str == '' ? '*' : str;
} }
}, },
name: 'crontab-month', watch: {
props: ['check', 'cron'], radioValue: 'radioChange',
cycleTotal: 'cycleChange',
averageTotal: 'averageChange',
checkboxString: 'checkboxChange'
},
methods: { methods: {
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
@@ -84,31 +109,6 @@ export default {
this.$emit('update', 'month', this.checkboxString); this.$emit('update', 'month', this.checkboxString);
} }
} }
},
watch: {
'radioValue': 'radioChange',
'cycleTotal': 'cycleChange',
'averageTotal': 'averageChange',
'checkboxString': 'checkboxChange'
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, 1, 11)
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : 2, 12)
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, 1, 11)
const average02 = this.checkNum(this.average02, 1, 12 - average01 || 0)
return average01 + '/' + average02;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
let str = this.checkboxList.join();
return str == '' ? '*' : str;
}
}
} }
};
</script> </script>

205
src/components/Crontab/result.vue
View File

@@ -2,8 +2,8 @@
<div class="popup-result"> <div class="popup-result">
<p class="title">最近5次运行时间</p> <p class="title">最近5次运行时间</p>
<ul class="popup-result-scroll"> <ul class="popup-result-scroll">
<template v-if='isShow'> <template v-if="isShow">
<li v-for='item in resultList' :key="item">{{item}}</li> <li v-for="item in resultList" :key="item">{{ item }}</li>
</template> </template>
<li v-else>计算结果中...</li> <li v-else>计算结果中...</li>
</ul> </ul>
@@ -12,6 +12,8 @@
<script> <script>
export default { export default {
name: 'CrontabResult',
props: ['ex'],
data() { data() {
return { return {
dayRule: '', dayRule: '',
@@ -19,24 +21,29 @@ export default {
dateArr: [], dateArr: [],
resultList: [], resultList: [],
isShow: false isShow: false
} };
},
watch: {
ex: 'expressionChange'
},
mounted: function () {
// 初始化 获取一次结果
this.expressionChange();
}, },
name: 'crontab-result',
methods: { methods: {
// 表达式值变化时，开始去计算结果 // 表达式值变化时，开始去计算结果
expressionChange() { expressionChange() {
// 计算开始-隐藏结果 // 计算开始-隐藏结果
this.isShow = false; this.isShow = false;
// 获取规则数组[0秒、1分、2时、3日、4月、5星期、6年] // 获取规则数组[0秒、1分、2时、3日、4月、5星期、6年]
let ruleArr = this.$options.propsData.ex.split(' '); const ruleArr = this.$options.propsData.ex.split(' ');
// 用于记录进入循环的次数 // 用于记录进入循环的次数
let nums = 0; let nums = 0;
// 用于暂时存符号时间规则结果的数组 // 用于暂时存符号时间规则结果的数组
let resultArr = []; const resultArr = [];
// 获取当前时间精确至[年、月、日、时、分、秒] // 获取当前时间精确至[年、月、日、时、分、秒]
let nTime = new Date(); const nTime = new Date();
let nYear = nTime.getFullYear(); const nYear = nTime.getFullYear();
let nMonth = nTime.getMonth() + 1; let nMonth = nTime.getMonth() + 1;
let nDay = nTime.getDate(); let nDay = nTime.getDate();
let nHour = nTime.getHours(); let nHour = nTime.getHours();
@@ -51,44 +58,44 @@ export default {
this.getWeekArr(ruleArr[5]); this.getWeekArr(ruleArr[5]);
this.getYearArr(ruleArr[6], nYear); this.getYearArr(ruleArr[6], nYear);
// 将获取到的数组赋值-方便使用 // 将获取到的数组赋值-方便使用
let sDate = this.dateArr[0]; const sDate = this.dateArr[0];
let mDate = this.dateArr[1]; const mDate = this.dateArr[1];
let hDate = this.dateArr[2]; const hDate = this.dateArr[2];
let DDate = this.dateArr[3]; const DDate = this.dateArr[3];
let MDate = this.dateArr[4]; const MDate = this.dateArr[4];
let YDate = this.dateArr[5]; const YDate = this.dateArr[5];
// 获取当前时间在数组中的索引 // 获取当前时间在数组中的索引
let sIdx = this.getIndex(sDate, nSecond); let sIdx = this.getIndex(sDate, nSecond);
let mIdx = this.getIndex(mDate, nMin); let mIdx = this.getIndex(mDate, nMin);
let hIdx = this.getIndex(hDate, nHour); let hIdx = this.getIndex(hDate, nHour);
let DIdx = this.getIndex(DDate, nDay); let DIdx = this.getIndex(DDate, nDay);
let MIdx = this.getIndex(MDate, nMonth); let MIdx = this.getIndex(MDate, nMonth);
let YIdx = this.getIndex(YDate, nYear); const YIdx = this.getIndex(YDate, nYear);
// 重置月日时分秒的函数(后面用的比较多) // 重置月日时分秒的函数(后面用的比较多)
const resetSecond = function () { const resetSecond = function () {
sIdx = 0; sIdx = 0;
nSecond = sDate[sIdx] nSecond = sDate[sIdx];
} };
const resetMin = function () { const resetMin = function () {
mIdx = 0; mIdx = 0;
nMin = mDate[mIdx] nMin = mDate[mIdx];
resetSecond(); resetSecond();
} };
const resetHour = function () { const resetHour = function () {
hIdx = 0; hIdx = 0;
nHour = hDate[hIdx] nHour = hDate[hIdx];
resetMin(); resetMin();
} };
const resetDay = function () { const resetDay = function () {
DIdx = 0; DIdx = 0;
nDay = DDate[DIdx] nDay = DDate[DIdx];
resetHour(); resetHour();
} };
const resetMonth = function () { const resetMonth = function () {
MIdx = 0; MIdx = 0;
nMonth = MDate[MIdx] nMonth = MDate[MIdx];
resetDay(); resetDay();
} };
// 如果当前年份不为数组中当前值 // 如果当前年份不为数组中当前值
if (nYear !== YDate[YIdx]) { if (nYear !== YDate[YIdx]) {
resetMonth(); resetMonth();
@@ -112,7 +119,7 @@ export default {
// 循环年份数组 // 循环年份数组
goYear: for (let Yi = YIdx; Yi < YDate.length; Yi++) { goYear: for (let Yi = YIdx; Yi < YDate.length; Yi++) {
let YY = YDate[Yi]; const YY = YDate[Yi];
// 如果到达最大值时 // 如果到达最大值时
if (nMonth > MDate[MDate.length - 1]) { if (nMonth > MDate[MDate.length - 1]) {
resetMonth(); resetMonth();
@@ -153,7 +160,12 @@ export default {
} }
// 判断日期的合法性，不合法的话也是跳出当前循环 // 判断日期的合法性，不合法的话也是跳出当前循环
if (this.checkDate(YY + '-' + MM + '-' + thisDD + ' 00:00:00') !== true && this.dayRule !== 'workDay' && this.dayRule !== 'lastWeek' && this.dayRule !== 'lastDay') { if (
this.checkDate(YY + '-' + MM + '-' + thisDD + ' 00:00:00') !== true &&
this.dayRule !== 'workDay' &&
this.dayRule !== 'lastWeek' &&
this.dayRule !== 'lastDay'
) {
resetDay(); resetDay();
continue goMonth; continue goMonth;
} }
@@ -177,7 +189,7 @@ export default {
} }
} }
// 获取达到条件的日期是星期X // 获取达到条件的日期是星期X
let thisWeek = this.formatDate(new Date(YY + '-' + MM + '-' + thisDD + ' 00:00:00'), 'week'); const thisWeek = this.formatDate(new Date(YY + '-' + MM + '-' + thisDD + ' 00:00:00'), 'week');
// 当星期日时 // 当星期日时
if (thisWeek == 1) { if (thisWeek == 1) {
// 先找下一个日，并判断是否为月底 // 先找下一个日，并判断是否为月底
@@ -198,7 +210,7 @@ export default {
} else if (this.dayRule == 'weekDay') { } else if (this.dayRule == 'weekDay') {
// 如果指定了是星期几 // 如果指定了是星期几
// 获取当前日期是属于星期几 // 获取当前日期是属于星期几
let thisWeek = this.formatDate(new Date(YY + '-' + MM + '-' + DD + ' 00:00:00'), 'week'); const thisWeek = this.formatDate(new Date(YY + '-' + MM + '-' + DD + ' 00:00:00'), 'week');
// 校验当前星期是否在星期池（dayRuleSup）中 // 校验当前星期是否在星期池（dayRuleSup）中
if (this.dayRuleSup.indexOf(thisWeek) < 0) { if (this.dayRuleSup.indexOf(thisWeek) < 0) {
// 如果到达最大值时 // 如果到达最大值时
@@ -215,7 +227,7 @@ export default {
} else if (this.dayRule == 'assWeek') { } else if (this.dayRule == 'assWeek') {
// 如果指定了是第几周的星期几 // 如果指定了是第几周的星期几
// 获取每月1号是属于星期几 // 获取每月1号是属于星期几
let thisWeek = this.formatDate(new Date(YY + '-' + MM + '-' + DD + ' 00:00:00'), 'week'); const thisWeek = this.formatDate(new Date(YY + '-' + MM + '-' + DD + ' 00:00:00'), 'week');
if (this.dayRuleSup[1] >= thisWeek) { if (this.dayRuleSup[1] >= thisWeek) {
DD = (this.dayRuleSup[0] - 1) * 7 + this.dayRuleSup[1] - thisWeek + 1; DD = (this.dayRuleSup[0] - 1) * 7 + this.dayRuleSup[1] - thisWeek + 1;
} else { } else {
@@ -231,12 +243,12 @@ export default {
} }
} }
// 获取月末最后一天是星期几 // 获取月末最后一天是星期几
let thisWeek = this.formatDate(new Date(YY + '-' + MM + '-' + thisDD + ' 00:00:00'), 'week'); const thisWeek = this.formatDate(new Date(YY + '-' + MM + '-' + thisDD + ' 00:00:00'), 'week');
// 找到要求中最近的那个星期几 // 找到要求中最近的那个星期几
if (this.dayRuleSup < thisWeek) { if (this.dayRuleSup < thisWeek) {
DD -= thisWeek - this.dayRuleSup; DD -= thisWeek - this.dayRuleSup;
} else if (this.dayRuleSup > thisWeek) { } else if (this.dayRuleSup > thisWeek) {
DD -= 7 - (this.dayRuleSup - thisWeek) DD -= 7 - (this.dayRuleSup - thisWeek);
} }
} }
// 判断时间值是否小于10置换成“05”这种格式 // 判断时间值是否小于10置换成“05”这种格式
@@ -244,7 +256,7 @@ export default {
// 循环“时”数组 // 循环“时”数组
goHour: for (let hi = hIdx; hi < hDate.length; hi++) { goHour: for (let hi = hIdx; hi < hDate.length; hi++) {
let hh = hDate[hi] < 10 ? '0' + hDate[hi] : hDate[hi] const hh = hDate[hi] < 10 ? '0' + hDate[hi] : hDate[hi];
// 如果到达最大值时 // 如果到达最大值时
if (nMin > mDate[mDate.length - 1]) { if (nMin > mDate[mDate.length - 1]) {
@@ -265,7 +277,7 @@ export default {
} }
// 循环"分"数组 // 循环"分"数组
goMin: for (let mi = mIdx; mi < mDate.length; mi++) { goMin: for (let mi = mIdx; mi < mDate.length; mi++) {
let mm = mDate[mi] < 10 ? '0' + mDate[mi] : mDate[mi]; const mm = mDate[mi] < 10 ? '0' + mDate[mi] : mDate[mi];
// 如果到达最大值时 // 如果到达最大值时
if (nSecond > sDate[sDate.length - 1]) { if (nSecond > sDate[sDate.length - 1]) {
@@ -289,11 +301,11 @@ export default {
continue; continue;
} }
// 循环"秒"数组 // 循环"秒"数组
goSecond: for (let si = sIdx; si <= sDate.length - 1; si++) { for (let si = sIdx; si <= sDate.length - 1; si++) {
let ss = sDate[si] < 10 ? '0' + sDate[si] : sDate[si]; const ss = sDate[si] < 10 ? '0' + sDate[si] : sDate[si];
// 添加当前时间（时间合法性在日期循环时已经判断） // 添加当前时间（时间合法性在日期循环时已经判断）
if (MM !== '00' && DD !== '00') { if (MM !== '00' && DD !== '00') {
resultArr.push(YY + '-' + MM + '-' + DD + ' ' + hh + ':' + mm + ':' + ss) resultArr.push(YY + '-' + MM + '-' + DD + ' ' + hh + ':' + mm + ':' + ss);
nums++; nums++;
} }
// 如果条数满了就退出循环 // 如果条数满了就退出循环
@@ -331,13 +343,11 @@ export default {
} else { } else {
this.resultList = resultArr; this.resultList = resultArr;
if (resultArr.length !== 5) { if (resultArr.length !== 5) {
this.resultList.push('最近100年内只有上面' + resultArr.length + '条结果！') this.resultList.push('最近100年内只有上面' + resultArr.length + '条结果！');
} }
} }
// 计算完成-显示结果 // 计算完成-显示结果
this.isShow = true; this.isShow = true;
}, },
// 用于计算某位数字在数组中的索引 // 用于计算某位数字在数组中的索引
getIndex(arr, value) { getIndex(arr, value) {
@@ -356,11 +366,11 @@ export default {
this.dateArr[5] = this.getOrderArr(year, year + 100); this.dateArr[5] = this.getOrderArr(year, year + 100);
if (rule !== undefined) { if (rule !== undefined) {
if (rule.indexOf('-') >= 0) { if (rule.indexOf('-') >= 0) {
this.dateArr[5] = this.getCycleArr(rule, year + 100, false) this.dateArr[5] = this.getCycleArr(rule, year + 100, false);
} else if (rule.indexOf('/') >= 0) { } else if (rule.indexOf('/') >= 0) {
this.dateArr[5] = this.getAverageArr(rule, year + 100) this.dateArr[5] = this.getAverageArr(rule, year + 100);
} else if (rule !== '*') { } else if (rule !== '*') {
this.dateArr[5] = this.getAssignArr(rule) this.dateArr[5] = this.getAssignArr(rule);
} }
} }
}, },
@@ -368,11 +378,11 @@ export default {
getMonthArr(rule) { getMonthArr(rule) {
this.dateArr[4] = this.getOrderArr(1, 12); this.dateArr[4] = this.getOrderArr(1, 12);
if (rule.indexOf('-') >= 0) { if (rule.indexOf('-') >= 0) {
this.dateArr[4] = this.getCycleArr(rule, 12, false) this.dateArr[4] = this.getCycleArr(rule, 12, false);
} else if (rule.indexOf('/') >= 0) { } else if (rule.indexOf('/') >= 0) {
this.dateArr[4] = this.getAverageArr(rule, 12) this.dateArr[4] = this.getAverageArr(rule, 12);
} else if (rule !== '*') { } else if (rule !== '*') {
this.dateArr[4] = this.getAssignArr(rule) this.dateArr[4] = this.getAssignArr(rule);
} }
}, },
// 获取"日"数组-主要为日期规则 // 获取"日"数组-主要为日期规则
@@ -381,10 +391,10 @@ export default {
if (this.dayRule == '' && this.dayRuleSup == '') { if (this.dayRule == '' && this.dayRuleSup == '') {
if (rule.indexOf('-') >= 0) { if (rule.indexOf('-') >= 0) {
this.dayRule = 'weekDay'; this.dayRule = 'weekDay';
this.dayRuleSup = this.getCycleArr(rule, 7, false) this.dayRuleSup = this.getCycleArr(rule, 7, false);
} else if (rule.indexOf('#') >= 0) { } else if (rule.indexOf('#') >= 0) {
this.dayRule = 'assWeek'; this.dayRule = 'assWeek';
let matchRule = rule.match(/[0-9]{1}/g); const matchRule = rule.match(/[0-9]{1}/g);
this.dayRuleSup = [Number(matchRule[1]), Number(matchRule[0])]; this.dayRuleSup = [Number(matchRule[1]), Number(matchRule[0])];
this.dateArr[3] = [1]; this.dateArr[3] = [1];
if (this.dayRuleSup[1] == 7) { if (this.dayRuleSup[1] == 7) {
@@ -399,7 +409,7 @@ export default {
} }
} else if (rule !== '*' && rule !== '?') { } else if (rule !== '*' && rule !== '?') {
this.dayRule = 'weekDay'; this.dayRule = 'weekDay';
this.dayRuleSup = this.getAssignArr(rule) this.dayRuleSup = this.getAssignArr(rule);
} }
} }
}, },
@@ -409,10 +419,10 @@ export default {
this.dayRule = ''; this.dayRule = '';
this.dayRuleSup = ''; this.dayRuleSup = '';
if (rule.indexOf('-') >= 0) { if (rule.indexOf('-') >= 0) {
this.dateArr[3] = this.getCycleArr(rule, 31, false) this.dateArr[3] = this.getCycleArr(rule, 31, false);
this.dayRuleSup = 'null'; this.dayRuleSup = 'null';
} else if (rule.indexOf('/') >= 0) { } else if (rule.indexOf('/') >= 0) {
this.dateArr[3] = this.getAverageArr(rule, 31) this.dateArr[3] = this.getAverageArr(rule, 31);
this.dayRuleSup = 'null'; this.dayRuleSup = 'null';
} else if (rule.indexOf('W') >= 0) { } else if (rule.indexOf('W') >= 0) {
this.dayRule = 'workDay'; this.dayRule = 'workDay';
@@ -423,7 +433,7 @@ export default {
this.dayRuleSup = 'null'; this.dayRuleSup = 'null';
this.dateArr[3] = [31]; this.dateArr[3] = [31];
} else if (rule !== '*' && rule !== '?') { } else if (rule !== '*' && rule !== '?') {
this.dateArr[3] = this.getAssignArr(rule) this.dateArr[3] = this.getAssignArr(rule);
this.dayRuleSup = 'null'; this.dayRuleSup = 'null';
} else if (rule == '*') { } else if (rule == '*') {
this.dayRuleSup = 'null'; this.dayRuleSup = 'null';
@@ -433,38 +443,38 @@ export default {
getHourArr(rule) { getHourArr(rule) {
this.dateArr[2] = this.getOrderArr(0, 23); this.dateArr[2] = this.getOrderArr(0, 23);
if (rule.indexOf('-') >= 0) { if (rule.indexOf('-') >= 0) {
this.dateArr[2] = this.getCycleArr(rule, 24, true) this.dateArr[2] = this.getCycleArr(rule, 24, true);
} else if (rule.indexOf('/') >= 0) { } else if (rule.indexOf('/') >= 0) {
this.dateArr[2] = this.getAverageArr(rule, 23) this.dateArr[2] = this.getAverageArr(rule, 23);
} else if (rule !== '*') { } else if (rule !== '*') {
this.dateArr[2] = this.getAssignArr(rule) this.dateArr[2] = this.getAssignArr(rule);
} }
}, },
// 获取"分"数组 // 获取"分"数组
getMinArr(rule) { getMinArr(rule) {
this.dateArr[1] = this.getOrderArr(0, 59); this.dateArr[1] = this.getOrderArr(0, 59);
if (rule.indexOf('-') >= 0) { if (rule.indexOf('-') >= 0) {
this.dateArr[1] = this.getCycleArr(rule, 60, true) this.dateArr[1] = this.getCycleArr(rule, 60, true);
} else if (rule.indexOf('/') >= 0) { } else if (rule.indexOf('/') >= 0) {
this.dateArr[1] = this.getAverageArr(rule, 59) this.dateArr[1] = this.getAverageArr(rule, 59);
} else if (rule !== '*') { } else if (rule !== '*') {
this.dateArr[1] = this.getAssignArr(rule) this.dateArr[1] = this.getAssignArr(rule);
} }
}, },
// 获取"秒"数组 // 获取"秒"数组
getSecondArr(rule) { getSecondArr(rule) {
this.dateArr[0] = this.getOrderArr(0, 59); this.dateArr[0] = this.getOrderArr(0, 59);
if (rule.indexOf('-') >= 0) { if (rule.indexOf('-') >= 0) {
this.dateArr[0] = this.getCycleArr(rule, 60, true) this.dateArr[0] = this.getCycleArr(rule, 60, true);
} else if (rule.indexOf('/') >= 0) { } else if (rule.indexOf('/') >= 0) {
this.dateArr[0] = this.getAverageArr(rule, 59) this.dateArr[0] = this.getAverageArr(rule, 59);
} else if (rule !== '*') { } else if (rule !== '*') {
this.dateArr[0] = this.getAssignArr(rule) this.dateArr[0] = this.getAssignArr(rule);
} }
}, },
// 根据传进来的min-max返回一个顺序的数组 // 根据传进来的min-max返回一个顺序的数组
getOrderArr(min, max) { getOrderArr(min, max) {
let arr = []; const arr = [];
for (let i = min; i <= max; i++) { for (let i = min; i <= max; i++) {
arr.push(i); arr.push(i);
} }
@@ -472,20 +482,20 @@ export default {
}, },
// 根据规则中指定的零散值返回一个数组 // 根据规则中指定的零散值返回一个数组
getAssignArr(rule) { getAssignArr(rule) {
let arr = []; const arr = [];
let assiginArr = rule.split(','); const assiginArr = rule.split(',');
for (let i = 0; i < assiginArr.length; i++) { for (let i = 0; i < assiginArr.length; i++) {
arr[i] = Number(assiginArr[i]) arr[i] = Number(assiginArr[i]);
} }
arr.sort(this.compare) arr.sort(this.compare);
return arr; return arr;
}, },
// 根据一定算术规则计算返回一个数组 // 根据一定算术规则计算返回一个数组
getAverageArr(rule, limit) { getAverageArr(rule, limit) {
let arr = []; const arr = [];
let agArr = rule.split('/'); const agArr = rule.split('/');
let min = Number(agArr[0]); let min = Number(agArr[0]);
let step = Number(agArr[1]); const step = Number(agArr[1]);
while (min <= limit) { while (min <= limit) {
arr.push(min); arr.push(min);
min += step; min += step;
@@ -495,9 +505,9 @@ export default {
// 根据规则返回一个具有周期性的数组 // 根据规则返回一个具有周期性的数组
getCycleArr(rule, limit, status) { getCycleArr(rule, limit, status) {
// status--表示是否从0开始（则从1开始） // status--表示是否从0开始（则从1开始）
let arr = []; const arr = [];
let cycleArr = rule.split('-'); const cycleArr = rule.split('-');
let min = Number(cycleArr[0]); const min = Number(cycleArr[0]);
let max = Number(cycleArr[1]); let max = Number(cycleArr[1]);
if (min > max) { if (min > max) {
max += limit; max += limit;
@@ -507,9 +517,9 @@ export default {
if (status == false && i % limit == 0) { if (status == false && i % limit == 0) {
add = limit; add = limit;
} }
arr.push(Math.round(i % limit + add)) arr.push(Math.round((i % limit) + add));
} }
arr.sort(this.compare) arr.sort(this.compare);
return arr; return arr;
}, },
// 比较数字大小（用于Array.sort） // 比较数字大小（用于Array.sort）
@@ -523,17 +533,29 @@ export default {
// 格式化日期格式如：2017-9-19 18:04:33 // 格式化日期格式如：2017-9-19 18:04:33
formatDate(value, type) { formatDate(value, type) {
// 计算日期相关值 // 计算日期相关值
let time = typeof value == 'number' ? new Date(value) : value; const time = typeof value == 'number' ? new Date(value) : value;
let Y = time.getFullYear(); const Y = time.getFullYear();
let M = time.getMonth() + 1; const M = time.getMonth() + 1;
let D = time.getDate(); const D = time.getDate();
let h = time.getHours(); const h = time.getHours();
let m = time.getMinutes(); const m = time.getMinutes();
let s = time.getSeconds(); const s = time.getSeconds();
let week = time.getDay(); const week = time.getDay();
// 如果传递了type的话 // 如果传递了type的话
if (type == undefined) { if (type == undefined) {
return Y + '-' + (M < 10 ? '0' + M : M) + '-' + (D < 10 ? '0' + D : D) + ' ' + (h < 10 ? '0' + h : h) + ':' + (m < 10 ? '0' + m : m) + ':' + (s < 10 ? '0' + s : s); return (
Y +
'-' +
(M < 10 ? '0' + M : M) +
'-' +
(D < 10 ? '0' + D : D) +
' ' +
(h < 10 ? '0' + h : h) +
':' +
(m < 10 ? '0' + m : m) +
':' +
(s < 10 ? '0' + s : s)
);
} else if (type == 'week') { } else if (type == 'week') {
// 在quartz中 1为星期日 // 在quartz中 1为星期日
return week + 1; return week + 1;
@@ -541,19 +563,10 @@ export default {
}, },
// 检查日期是否存在 // 检查日期是否存在
checkDate(value) { checkDate(value) {
let time = new Date(value); const time = new Date(value);
let format = this.formatDate(time) const format = this.formatDate(time);
return value === format; return value === format;
} }
},
watch: {
'ex': 'expressionChange'
},
props: ['ex'],
mounted: function () {
// 初始化 获取一次结果
this.expressionChange();
} }
} };
</script> </script>

80
src/components/Crontab/second.vue
View File

@@ -1,31 +1,31 @@
<template> <template>
<el-form size="small"> <el-form size="small">
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="1"> <el-radio v-model="radioValue" :label="1">
秒，允许的通配符[, - * /] 秒，允许的通配符[, - * /]
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="2"> <el-radio v-model="radioValue" :label="2">
周期从 周期从
<el-input-number v-model='cycle01' :min="0" :max="58" /> - <el-input-number v-model="cycle01" :min="0" :max="58" /> -
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 秒 <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 秒
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="3"> <el-radio v-model="radioValue" :label="3">
从 从
<el-input-number v-model='average01' :min="0" :max="58" /> 秒开始，每 <el-input-number v-model="average01" :min="0" :max="58" /> 秒开始，每
<el-input-number v-model='average02' :min="1" :max="59 - average01 || 0" /> 秒执行一次 <el-input-number v-model="average02" :min="1" :max="59 - average01 || 0" /> 秒执行一次
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="4"> <el-radio v-model="radioValue" :label="4">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> <el-select v-model="checkboxList" clearable placeholder="可多选" multiple style="width:100%">
<el-option v-for="item in 60" :key="item" :value="item-1">{{ item-1 }}</el-option> <el-option v-for="item in 60" :key="item" :value="item-1">{{ item-1 }}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
@@ -35,6 +35,8 @@
<script> <script>
export default { export default {
name: 'CrontabSecond',
props: ['check', 'radioParent'],
data() { data() {
return { return {
radioValue: 1, radioValue: 1,
@@ -44,10 +46,36 @@ export default {
average02: 1, average02: 1,
checkboxList: [], checkboxList: [],
checkNum: this.$options.propsData.check checkNum: this.$options.propsData.check
};
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, 0, 58);
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : 1, 59);
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, 0, 58);
const average02 = this.checkNum(this.average02, 1, 59 - average01 || 0);
return average01 + '/' + average02;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
const str = this.checkboxList.join();
return str == '' ? '*' : str;
}
},
watch: {
radioValue: 'radioChange',
cycleTotal: 'cycleChange',
averageTotal: 'averageChange',
checkboxString: 'checkboxChange',
radioParent() {
this.radioValue = this.radioParent;
} }
}, },
name: 'crontab-second',
props: ['check', 'radioParent'],
methods: { methods: {
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
@@ -84,34 +112,6 @@ export default {
this.$emit('update', 'second', this.checkboxString); this.$emit('update', 'second', this.checkboxString);
} }
} }
},
watch: {
'radioValue': 'radioChange',
'cycleTotal': 'cycleChange',
'averageTotal': 'averageChange',
'checkboxString': 'checkboxChange',
radioParent() {
this.radioValue = this.radioParent
}
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, 0, 58)
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : 1, 59)
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, 0, 58)
const average02 = this.checkNum(this.average02, 1, 59 - average01 || 0)
return average01 + '/' + average02;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
let str = this.checkboxList.join();
return str == '' ? '*' : str;
}
}
} }
};
</script> </script>

113
src/components/Crontab/week.vue
View File

@@ -1,65 +1,54 @@
<template> <template>
<el-form size='small'> <el-form size="small">
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="1"> <el-radio v-model="radioValue" :label="1">
周，允许的通配符[, - * ? / L #] 周，允许的通配符[, - * ? / L #]
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="2"> <el-radio v-model="radioValue" :label="2">
不指定 不指定
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="3"> <el-radio v-model="radioValue" :label="3">
周期从星期 周期从星期
<el-select clearable v-model="cycle01"> <el-select v-model="cycle01" clearable>
<el-option <el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="item.key" :disabled="item.key === 1">{{ item.value }}</el-option>
v-for="(item,index) of weekList"
:key="index"
:label="item.value"
:value="item.key"
:disabled="item.key === 1"
>{{item.value}}</el-option>
</el-select> </el-select>
- -
<el-select clearable v-model="cycle02"> <el-select v-model="cycle02" clearable>
<el-option <el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="item.key" :disabled="item.key < cycle01 && item.key !== 1">{{ item.value }}</el-option>
v-for="(item,index) of weekList"
:key="index"
:label="item.value"
:value="item.key"
:disabled="item.key < cycle01 && item.key !== 1"
>{{item.value}}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="4"> <el-radio v-model="radioValue" :label="4">
第 第
<el-input-number v-model='average01' :min="1" :max="4" /> 周的星期 <el-input-number v-model="average01" :min="1" :max="4" /> 周的星期
<el-select clearable v-model="average02"> <el-select v-model="average02" clearable>
<el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="item.key">{{ item.value }}</el-option> <el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="item.key">{{ item.value }}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="5"> <el-radio v-model="radioValue" :label="5">
本月最后一个星期 本月最后一个星期
<el-select clearable v-model="weekday"> <el-select v-model="weekday" clearable>
<el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="item.key">{{ item.value }}</el-option> <el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="item.key">{{ item.value }}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio v-model='radioValue' :label="6"> <el-radio v-model="radioValue" :label="6">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> <el-select v-model="checkboxList" clearable placeholder="可多选" multiple style="width:100%">
<el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="String(item.key)">{{ item.value }}</el-option> <el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="String(item.key)">{{ item.value }}</el-option>
</el-select> </el-select>
</el-radio> </el-radio>
@@ -67,9 +56,11 @@
</el-form> </el-form>
</template> </template>
<!-- eslint-disable vue/no-side-effects-in-computed-properties -->
<script> <script>
export default { export default {
name: 'CrontabWeek',
props: ['check', 'cron'],
data() { data() {
return { return {
radioValue: 2, radioValue: 2,
@@ -110,10 +101,39 @@ export default {
} }
], ],
checkNum: this.$options.propsData.check checkNum: this.$options.propsData.check
};
},
computed: {
// 计算两个周期值
cycleTotal: function () {
this.cycle01 = this.checkNum(this.cycle01, 1, 7);
this.cycle02 = this.checkNum(this.cycle02, 1, 7);
return this.cycle01 + '-' + this.cycle02;
},
// 计算平均用到的值
averageTotal: function () {
this.average01 = this.checkNum(this.average01, 1, 4);
this.average02 = this.checkNum(this.average02, 1, 7);
return this.average02 + '#' + this.average01;
},
// 最近的工作日（格式）
weekdayCheck: function () {
this.weekday = this.checkNum(this.weekday, 1, 7);
return this.weekday;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
const str = this.checkboxList.join();
return str == '' ? '*' : str;
} }
}, },
name: 'crontab-week', watch: {
props: ['check', 'cron'], radioValue: 'radioChange',
cycleTotal: 'cycleChange',
averageTotal: 'averageChange',
weekdayCheck: 'weekdayChange',
checkboxString: 'checkboxChange'
},
methods: { methods: {
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
@@ -165,38 +185,7 @@ export default {
if (this.radioValue == '6') { if (this.radioValue == '6') {
this.$emit('update', 'week', this.checkboxString); this.$emit('update', 'week', this.checkboxString);
} }
},
},
watch: {
'radioValue': 'radioChange',
'cycleTotal': 'cycleChange',
'averageTotal': 'averageChange',
'weekdayCheck': 'weekdayChange',
'checkboxString': 'checkboxChange',
},
computed: {
// 计算两个周期值
cycleTotal: function () {
this.cycle01 = this.checkNum(this.cycle01, 1, 7)
this.cycle02 = this.checkNum(this.cycle02, 1, 7)
return this.cycle01 + '-' + this.cycle02;
},
// 计算平均用到的值
averageTotal: function () {
this.average01 = this.checkNum(this.average01, 1, 4)
this.average02 = this.checkNum(this.average02, 1, 7)
return this.average02 + '#' + this.average01;
},
// 最近的工作日（格式）
weekdayCheck: function () {
this.weekday = this.checkNum(this.weekday, 1, 7)
return this.weekday;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
let str = this.checkboxList.join();
return str == '' ? '*' : str;
}
} }
} }
};
</script> </script>

88
src/components/Crontab/year.vue
View File

@@ -1,38 +1,38 @@
<template> <template>
<el-form size="small"> <el-form size="small">
<el-form-item> <el-form-item>
<el-radio :label="1" v-model='radioValue'> <el-radio v-model="radioValue" :label="1">
不填，允许的通配符[, - * /] 不填，允许的通配符[, - * /]
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio :label="2" v-model='radioValue'> <el-radio v-model="radioValue" :label="2">
每年 每年
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio :label="3" v-model='radioValue'> <el-radio v-model="radioValue" :label="3">
周期从 周期从
<el-input-number v-model='cycle01' :min='fullYear' :max="2098" /> - <el-input-number v-model="cycle01" :min="fullYear" :max="2098" /> -
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : fullYear + 1" :max="2099" /> <el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : fullYear + 1" :max="2099" />
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio :label="4" v-model='radioValue'> <el-radio v-model="radioValue" :label="4">
从 从
<el-input-number v-model='average01' :min='fullYear' :max="2098"/> 年开始，每 <el-input-number v-model="average01" :min="fullYear" :max="2098" /> 年开始，每
<el-input-number v-model='average02' :min="1" :max="2099 - average01 || fullYear" /> 年执行一次 <el-input-number v-model="average02" :min="1" :max="2099 - average01 || fullYear" /> 年执行一次
</el-radio> </el-radio>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-radio :label="5" v-model='radioValue'> <el-radio v-model="radioValue" :label="5">
指定 指定
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple> <el-select v-model="checkboxList" clearable placeholder="可多选" multiple>
<el-option v-for="item in 9" :key="item" :value="item - 1 + fullYear" :label="item -1 + fullYear" /> <el-option v-for="item in 9" :key="item" :value="item - 1 + fullYear" :label="item -1 + fullYear" />
</el-select> </el-select>
</el-radio> </el-radio>
@@ -42,6 +42,8 @@
<script> <script>
export default { export default {
name: 'CrontabYear',
props: ['check', 'month', 'cron'],
data() { data() {
return { return {
fullYear: 0, fullYear: 0,
@@ -52,10 +54,39 @@ export default {
average02: 1, average02: 1,
checkboxList: [], checkboxList: [],
checkNum: this.$options.propsData.check checkNum: this.$options.propsData.check
};
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, this.fullYear, 2098);
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : this.fullYear + 1, 2099);
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, this.fullYear, 2098);
const average02 = this.checkNum(this.average02, 1, 2099 - average01 || this.fullYear);
return average01 + '/' + average02;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
const str = this.checkboxList.join();
return str;
} }
}, },
name: 'crontab-year', watch: {
props: ['check', 'month', 'cron'], radioValue: 'radioChange',
cycleTotal: 'cycleChange',
averageTotal: 'averageChange',
checkboxString: 'checkboxChange'
},
mounted: function () {
// 仅获取当前年份
this.fullYear = Number(new Date().getFullYear());
this.cycle01 = this.fullYear;
this.average01 = this.fullYear;
},
methods: { methods: {
// 单选按钮值变化时 // 单选按钮值变化时
radioChange() { radioChange() {
@@ -95,37 +126,6 @@ export default {
this.$emit('update', 'year', this.checkboxString); this.$emit('update', 'year', this.checkboxString);
} }
} }
},
watch: {
'radioValue': 'radioChange',
'cycleTotal': 'cycleChange',
'averageTotal': 'averageChange',
'checkboxString': 'checkboxChange'
},
computed: {
// 计算两个周期值
cycleTotal: function () {
const cycle01 = this.checkNum(this.cycle01, this.fullYear, 2098)
const cycle02 = this.checkNum(this.cycle02, cycle01 ? cycle01 + 1 : this.fullYear + 1, 2099)
return cycle01 + '-' + cycle02;
},
// 计算平均用到的值
averageTotal: function () {
const average01 = this.checkNum(this.average01, this.fullYear, 2098)
const average02 = this.checkNum(this.average02, 1, 2099 - average01 || this.fullYear)
return average01 + '/' + average02;
},
// 计算勾选的checkbox值合集
checkboxString: function () {
let str = this.checkboxList.join();
return str;
}
},
mounted: function () {
// 仅获取当前年份
this.fullYear = Number(new Date().getFullYear());
this.cycle01 = this.fullYear
this.average01 = this.fullYear
}
} }
};
</script> </script>

112
src/components/CustomColumnTable/index.vue
View File

@@ -83,17 +83,17 @@
</template> </template>
<script> <script>
import draggable from 'vuedraggable' import draggable from 'vuedraggable';
export default { export default {
components: { draggable }, components: { draggable },
props: { props: {
tableList: { tableList: {
type: Array, type: Array,
default: () => [], default: () => []
}, },
tableLoading: { tableLoading: {
type: Boolean, type: Boolean,
default: false, default: false
}, },
queryParams: { queryParams: {
required: true, required: true,
@@ -101,18 +101,18 @@ export default {
default: () => ({ default: () => ({
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
total: 0, total: 0
}), })
}, },
// 表格操作按钮 // 表格操作按钮
tableBtns: { tableBtns: {
type: Array, type: Array,
default: () => [], default: () => []
}, },
// 表格可选 // 表格可选
selectable: { selectable: {
type: Boolean, type: Boolean,
default: false, default: false
}, },
/** /**
* 接口访问得到的所有表格列/或者写死的表格列格 * 接口访问得到的所有表格列/或者写死的表格列格
@@ -121,7 +121,7 @@ export default {
tableAllFields: { tableAllFields: {
required: true, required: true,
type: Array, type: Array,
default: () => [], default: () => []
}, },
/** /**
* 默认表格列 * 默认表格列
@@ -129,27 +129,27 @@ export default {
*/ */
defaultColumns: { defaultColumns: {
type: Array, type: Array,
default: () => [], default: () => []
}, },
tablename: { tablename: {
type: String, type: String,
default: '', default: ''
}, },
// 可点击的列 // 可点击的列
clickColumns: { clickColumns: {
type: Array, type: Array,
default: () => [], default: () => []
}, },
// 控制按钮隐藏 // 控制按钮隐藏
btnShowValid: { btnShowValid: {
type: Array, type: Array,
default: () => [], default: () => []
}, },
// 可排序的列 // 可排序的列
sortableColumns: { sortableColumns: {
type: Array, type: Array,
default: () => [], default: () => []
}, }
}, },
data() { data() {
return { return {
@@ -158,102 +158,92 @@ export default {
dialogSelectColumn: [], dialogSelectColumn: [],
name: this.tablename || this.$route.name, name: this.tablename || this.$route.name,
customColumns: [], // 本地缓存的表格列 customColumns: [], // 本地缓存的表格列
tableColumns: [], // 实际展示表格列 tableColumns: [] // 实际展示表格列
} };
}, },
watch: { watch: {
tableAllFields: { tableAllFields: {
handler(val) { handler(val) {
const localStr = localStorage.getItem(this.name) const localStr = localStorage.getItem(this.name);
const arr = localStr ? localStr.split(',') : [] const arr = localStr ? localStr.split(',') : [];
if (this.isNullOrEmpty(arr)) { if (this.isNullOrEmpty(arr)) {
this.tableColumns = val this.tableColumns = val
.filter((item) => this.defaultColumns.includes(item.prop)) .filter((item) => this.defaultColumns.includes(item.prop))
.sort( .sort((a, b) => this.defaultColumns.indexOf(a.prop) - this.defaultColumns.indexOf(b.prop));
(a, b) => this.customColumns = this.defaultColumns;
this.defaultColumns.indexOf(a.prop) -
this.defaultColumns.indexOf(b.prop)
)
this.customColumns = this.defaultColumns
} else { } else {
this.tableColumns = val this.tableColumns = val.filter((item) => arr.includes(item.prop)).sort((a, b) => arr.indexOf(a.prop) - arr.indexOf(b.prop));
.filter((item) => arr.includes(item.prop))
.sort((a, b) => arr.indexOf(a.prop) - arr.indexOf(b.prop))
} }
}, },
immediate: true, immediate: true,
deep: true, deep: true
}, }
}, },
created() { created() {
if (this.isNullOrEmpty(this.customColumns)) { if (this.isNullOrEmpty(this.customColumns)) {
const localStr = localStorage.getItem(this.name) const localStr = localStorage.getItem(this.name);
this.customColumns = localStr ? localStr.split(',') : [] this.customColumns = localStr ? localStr.split(',') : [];
} }
}, },
methods: { methods: {
showCustomClick() { showCustomClick() {
this.columnsetDialogShow = true this.columnsetDialogShow = true;
this.dialogSelectColumn = [...this.customColumns] this.dialogSelectColumn = [...this.customColumns];
}, },
handleChangeColumns() { handleChangeColumns() {
this.customColumns = this.dialogSelectColumn this.customColumns = this.dialogSelectColumn;
this.tableColumns = this.tableAllFields this.tableColumns = this.tableAllFields
.filter((item) => this.customColumns.includes(item.prop)) .filter((item) => this.customColumns.includes(item.prop))
.sort( .sort((a, b) => this.customColumns.indexOf(a.prop) - this.customColumns.indexOf(b.prop));
(a, b) => localStorage.setItem(this.name, this.customColumns.join(','));
this.customColumns.indexOf(a.prop) - this.columnsetDialogShow = false;
this.customColumns.indexOf(b.prop)
)
localStorage.setItem(this.name, this.customColumns.join(','))
this.columnsetDialogShow = false
}, },
_getTableList() { _getTableList() {
this.$emit('update:queryParams', this.queryParams) this.$emit('update:queryParams', this.queryParams);
this.$emit('getlist') this.$emit('getlist');
}, },
handleSelectionChange(row) { handleSelectionChange(row) {
this.selectable && this.$emit('selectRow', row) this.selectable && this.$emit('selectRow', row);
}, },
changeSort(val) { changeSort(val) {
this.$emit('changeSort', val) this.$emit('changeSort', val);
}, },
handleRowClick(row) { handleRowClick(row) {
this.$emit('clickRow', row) this.$emit('clickRow', row);
}, },
call(funcName, row) { call(funcName, row) {
this.$emit('callFunc', funcName, row) this.$emit('callFunc', funcName, row);
}, },
getOpearateWidth() { getOpearateWidth() {
let width = 30 let width = 30;
for (let index = 0; index < this.tableBtns.length; index++) { for (let index = 0; index < this.tableBtns.length; index++) {
if (index < 2) { if (index < 2) {
const column = this.tableBtns[index] const column = this.tableBtns[index];
width += column.buttonName.length * 15 width += column.buttonName.length * 15;
column.buttonColor !== 'text' && (width += 30) column.buttonColor !== 'text' && (width += 30);
} else { } else {
width += 70 // 更多 width += 70; // 更多
break break;
} }
} }
return width return width;
}, },
btnShow(row, btn) { btnShow(row, btn) {
if (this.isNullOrEmpty(this.btnShowValid)) { if (this.isNullOrEmpty(this.btnShowValid)) {
return true return true;
} else { } else {
let show = true let show = true;
for (let i = 0; i < this.btnShowValid.length; i++) { for (let i = 0; i < this.btnShowValid.length; i++) {
const valid = this.btnShowValid[i] const valid = this.btnShowValid[i];
if (row[valid.key] === valid.value) { if (row[valid.key] === valid.value) {
show = btn.buttonName !== valid.btnName show = btn.buttonName !== valid.btnName;
} }
} }
return show return show;
} }
},
},
} }
}
};
</script> </script>
<style scoped> <style scoped>

48
src/components/DictData/index.js
View File

@@ -1,20 +1,20 @@
import Vue from 'vue' import Vue from 'vue';
import store from '@/store' import store from '@/store';
import DataDict from '@/utils/dict' import DataDict from '@/utils/dict';
import { getDicts as getDicts } from '@/api/system/dict/data' import { getDicts as getDicts } from '@/api/system/dict/data';
function searchDictByKey(dict, key) { function searchDictByKey(dict, key) {
if (key == null && key == "") { if (key == null && key == '') {
return null return null;
} }
try { try {
for (let i = 0; i < dict.length; i++) { for (let i = 0; i < dict.length; i++) {
if (dict[i].key == key) { if (dict[i].key == key) {
return dict[i].value return dict[i].value;
} }
} }
} catch (e) { } catch (e) {
return null return null;
} }
} }
@@ -25,25 +25,29 @@ function install() {
labelField: 'dictLabel', labelField: 'dictLabel',
valueField: 'dictValue', valueField: 'dictValue',
request(dictMeta) { request(dictMeta) {
const storeDict = searchDictByKey(store.getters.dict, dictMeta.type) const storeDict = searchDictByKey(store.getters.dict, dictMeta.type);
if (storeDict) { if (storeDict) {
return new Promise(resolve => { resolve(storeDict) }) return new Promise((resolve) => {
resolve(storeDict);
});
} else { } else {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
getDicts(dictMeta.type).then(res => { getDicts(dictMeta.type)
store.dispatch('dict/setDict', { key: dictMeta.type, value: res.data }) .then((res) => {
resolve(res.data) store.dispatch('dict/setDict', { key: dictMeta.type, value: res.data });
}).catch(error => { resolve(res.data);
reject(error)
})
}) })
.catch((error) => {
reject(error);
});
});
} }
}, }
}, }
}, }
}) });
} }
export default { export default {
install, install
} };

27
src/components/DictTag/index.vue
View File

@@ -2,21 +2,8 @@
<div> <div>
<template v-for="(item, index) in options"> <template v-for="(item, index) in options">
<template v-if="values.includes(item.value)"> <template v-if="values.includes(item.value)">
<span <span v-if="item.raw.listClass == 'default' || item.raw.listClass == ''" :key="item.value" :index="index" :class="item.raw.cssClass">{{ item.label }}</span>
v-if="item.raw.listClass == 'default' || item.raw.listClass == ''" <el-tag v-else :key="item.value" :disable-transitions="true" :index="index" :type="item.raw.listClass == 'primary' ? '' : item.raw.listClass" :class="item.raw.cssClass">
:key="item.value"
:index="index"
:class="item.raw.cssClass"
>{{ item.label }}</span
>
<el-tag
v-else
:disable-transitions="true"
:key="item.value"
:index="index"
:type="item.raw.listClass == 'primary' ? '' : item.raw.listClass"
:class="item.raw.cssClass"
>
{{ item.label }} {{ item.label }}
</el-tag> </el-tag>
</template> </template>
@@ -26,13 +13,13 @@
<script> <script>
export default { export default {
name: "DictTag", name: 'DictTag',
props: { props: {
options: { options: {
type: Array, type: Array,
default: null, default: null
}, },
value: [Number, String, Array], value: [Number, String, Array]
}, },
computed: { computed: {
values() { values() {
@@ -41,8 +28,8 @@ export default {
} else { } else {
return []; return [];
} }
}, }
}, }
}; };
</script> </script>
<style scoped> <style scoped>

207
src/components/Editor/index.vue
View File

@@ -1,98 +1,86 @@
<template> <template>
<div> <div>
<el-upload <el-upload v-if="type == 'url'" ref="upload" :action="uploadUrl" :before-upload="handleBeforeUpload" :on-success="handleUploadSuccess" :on-error="handleUploadError" name="file" :show-file-list="false" :headers="headers" style="display: none" />
:action="uploadUrl" <div ref="editor" class="editor" :style="styles" />
:before-upload="handleBeforeUpload"
:on-success="handleUploadSuccess"
:on-error="handleUploadError"
name="file"
:show-file-list="false"
:headers="headers"
style="display: none"
ref="upload"
v-if="this.type == 'url'"
>
</el-upload>
<div class="editor" ref="editor" :style="styles"></div>
</div> </div>
</template> </template>
<script> <script>
import Quill from "quill"; import Quill from 'quill';
import "quill/dist/quill.core.css"; import 'quill/dist/quill.core.css';
import "quill/dist/quill.snow.css"; import 'quill/dist/quill.snow.css';
import "quill/dist/quill.bubble.css"; import 'quill/dist/quill.bubble.css';
import { getToken } from "@/utils/auth"; import { getToken } from '@/utils/auth';
export default { export default {
name: "Editor", name: 'Editor',
props: { props: {
/* 编辑器的内容 */ /* 编辑器的内容 */
value: { value: {
type: String, type: String,
default: "", default: ''
}, },
/* 高度 */ /* 高度 */
height: { height: {
type: Number, type: Number,
default: null, default: null
}, },
/* 最小高度 */ /* 最小高度 */
minHeight: { minHeight: {
type: Number, type: Number,
default: null, default: null
}, },
/* 只读 */ /* 只读 */
readOnly: { readOnly: {
type: Boolean, type: Boolean,
default: false, default: false
}, },
// 上传文件大小限制(MB) // 上传文件大小限制(MB)
fileSize: { fileSize: {
type: Number, type: Number,
default: 5, default: 5
}, },
/* 类型（base64格式、url格式） */ /* 类型（base64格式、url格式） */
type: { type: {
type: String, type: String,
default: "url", default: 'url'
} }
}, },
data() { data() {
return { return {
uploadUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址 uploadUrl: process.env.VUE_APP_BASE_API + '/common/upload', // 上传的图片服务器地址
headers: { headers: {
Authorization: "Bearer " + getToken() Authorization: 'Bearer ' + getToken()
}, },
Quill: null, Quill: null,
currentValue: "", currentValue: '',
options: { options: {
theme: "snow", theme: 'snow',
bounds: document.body, bounds: document.body,
debug: "warn", debug: 'warn',
modules: { modules: {
// 工具栏配置 // 工具栏配置
toolbar: [ toolbar: [
["bold", "italic", "underline", "strike"], // 加粗 斜体 下划线 删除线 ['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线
["blockquote", "code-block"], // 引用 代码块 ['blockquote', 'code-block'], // 引用 代码块
[{ list: "ordered" }, { list: "bullet" }], // 有序、无序列表 [{ list: 'ordered' }, { list: 'bullet' }], // 有序、无序列表
[{ indent: "-1" }, { indent: "+1" }], // 缩进 [{ indent: '-1' }, { indent: '+1' }], // 缩进
[{ size: ["small", false, "large", "huge"] }], // 字体大小 [{ size: ['small', false, 'large', 'huge'] }], // 字体大小
[{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题 [{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题
[{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色 [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
[{ align: [] }], // 对齐方式 [{ align: [] }], // 对齐方式
["clean"], // 清除文本格式 ['clean'], // 清除文本格式
["link", "image", "video"] // 链接、图片、视频 ['link', 'image', 'video'] // 链接、图片、视频
], ]
},
placeholder: "请输入内容",
readOnly: this.readOnly,
}, },
placeholder: '请输入内容',
readOnly: this.readOnly
}
}; };
}, },
computed: { computed: {
styles() { styles() {
let style = {}; const style = {};
if (this.minHeight) { if (this.minHeight) {
style.minHeight = `${this.minHeight}px`; style.minHeight = `${this.minHeight}px`;
} }
@@ -100,20 +88,20 @@ export default {
style.height = `${this.height}px`; style.height = `${this.height}px`;
} }
return style; return style;
}, }
}, },
watch: { watch: {
value: { value: {
handler(val) { handler(val) {
if (val !== this.currentValue) { if (val !== this.currentValue) {
this.currentValue = val === null ? "" : val; this.currentValue = val === null ? '' : val;
if (this.Quill) { if (this.Quill) {
this.Quill.pasteHTML(this.currentValue); this.Quill.pasteHTML(this.currentValue);
} }
} }
}, },
immediate: true, immediate: true
}, }
}, },
mounted() { mounted() {
this.init(); this.init();
@@ -127,33 +115,33 @@ export default {
this.Quill = new Quill(editor, this.options); this.Quill = new Quill(editor, this.options);
// 如果设置了上传地址则自定义图片上传事件 // 如果设置了上传地址则自定义图片上传事件
if (this.type == 'url') { if (this.type == 'url') {
let toolbar = this.Quill.getModule("toolbar"); const toolbar = this.Quill.getModule('toolbar');
toolbar.addHandler("image", (value) => { toolbar.addHandler('image', (value) => {
this.uploadType = "image"; this.uploadType = 'image';
if (value) { if (value) {
this.$refs.upload.$children[0].$refs.input.click(); this.$refs.upload.$children[0].$refs.input.click();
} else { } else {
this.quill.format("image", false); this.quill.format('image', false);
} }
}); });
} }
this.Quill.pasteHTML(this.currentValue); this.Quill.pasteHTML(this.currentValue);
this.Quill.on("text-change", (delta, oldDelta, source) => { this.Quill.on('text-change', (delta, oldDelta, source) => {
const html = this.$refs.editor.children[0].innerHTML; const html = this.$refs.editor.children[0].innerHTML;
const text = this.Quill.getText(); const text = this.Quill.getText();
const quill = this.Quill; const quill = this.Quill;
this.currentValue = html; this.currentValue = html;
this.$emit("input", html); this.$emit('input', html);
this.$emit("on-change", { html, text, quill }); this.$emit('on-change', { html, text, quill });
}); });
this.Quill.on("text-change", (delta, oldDelta, source) => { this.Quill.on('text-change', (delta, oldDelta, source) => {
this.$emit("on-text-change", delta, oldDelta, source); this.$emit('on-text-change', delta, oldDelta, source);
}); });
this.Quill.on("selection-change", (range, oldRange, source) => { this.Quill.on('selection-change', (range, oldRange, source) => {
this.$emit("on-selection-change", range, oldRange, source); this.$emit('on-selection-change', range, oldRange, source);
}); });
this.Quill.on("editor-change", (eventName, ...args) => { this.Quill.on('editor-change', (eventName, ...args) => {
this.$emit("on-editor-change", eventName, ...args); this.$emit('on-editor-change', eventName, ...args);
}); });
}, },
// 上传前校检格式和大小 // 上传前校检格式和大小
@@ -170,103 +158,104 @@ export default {
}, },
handleUploadSuccess(res, file) { handleUploadSuccess(res, file) {
// 获取富文本组件实例 // 获取富文本组件实例
let quill = this.Quill; const quill = this.Quill;
// 如果上传成功 // 如果上传成功
if (res.code == 200) { if (res.code == 200) {
// 获取光标所在位置 // 获取光标所在位置
let length = quill.getSelection().index; const length = quill.getSelection().index;
// 插入图片 res.url为服务器返回的图片地址 // 插入图片 res.url为服务器返回的图片地址
quill.insertEmbed(length, "image", process.env.VUE_APP_BASE_API + res.fileName); quill.insertEmbed(length, 'image', process.env.VUE_APP_BASE_API + res.fileName);
// 调整光标到最后 // 调整光标到最后
quill.setSelection(length + 1); quill.setSelection(length + 1);
} else { } else {
this.$message.error("图片插入失败"); this.$message.error('图片插入失败');
} }
}, },
handleUploadError() { handleUploadError() {
this.$message.error("图片插入失败"); this.$message.error('图片插入失败');
}, }
}, }
}; };
</script> </script>
<style> <style>
.editor, .ql-toolbar { .editor,
.ql-toolbar {
white-space: pre-wrap !important; white-space: pre-wrap !important;
line-height: normal !important; line-height: normal !important;
} }
.quill-img { .quill-img {
display: none; display: none;
} }
.ql-snow .ql-tooltip[data-mode="link"]::before { .ql-snow .ql-tooltip[data-mode='link']::before {
content: "请输入链接地址:"; content: '请输入链接地址:';
} }
.ql-snow .ql-tooltip.ql-editing a.ql-action::after { .ql-snow .ql-tooltip.ql-editing a.ql-action::after {
border-right: 0px; border-right: 0px;
content: "保存"; content: '保存';
padding-right: 0px; padding-right: 0px;
} }
.ql-snow .ql-tooltip[data-mode="video"]::before { .ql-snow .ql-tooltip[data-mode='video']::before {
content: "请输入视频地址:"; content: '请输入视频地址:';
} }
.ql-snow .ql-picker.ql-size .ql-picker-label::before, .ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before { .ql-snow .ql-picker.ql-size .ql-picker-item::before {
content: "14px"; content: '14px';
} }
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before, .ql-snow .ql-picker.ql-size .ql-picker-label[data-value='small']::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before { .ql-snow .ql-picker.ql-size .ql-picker-item[data-value='small']::before {
content: "10px"; content: '10px';
} }
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before, .ql-snow .ql-picker.ql-size .ql-picker-label[data-value='large']::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before { .ql-snow .ql-picker.ql-size .ql-picker-item[data-value='large']::before {
content: "18px"; content: '18px';
} }
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before, .ql-snow .ql-picker.ql-size .ql-picker-label[data-value='huge']::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before { .ql-snow .ql-picker.ql-size .ql-picker-item[data-value='huge']::before {
content: "32px"; content: '32px';
} }
.ql-snow .ql-picker.ql-header .ql-picker-label::before, .ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before { .ql-snow .ql-picker.ql-header .ql-picker-item::before {
content: "文本"; content: '文本';
} }
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before, .ql-snow .ql-picker.ql-header .ql-picker-label[data-value='1']::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before { .ql-snow .ql-picker.ql-header .ql-picker-item[data-value='1']::before {
content: "标题1"; content: '标题1';
} }
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before, .ql-snow .ql-picker.ql-header .ql-picker-label[data-value='2']::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before { .ql-snow .ql-picker.ql-header .ql-picker-item[data-value='2']::before {
content: "标题2"; content: '标题2';
} }
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before, .ql-snow .ql-picker.ql-header .ql-picker-label[data-value='3']::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before { .ql-snow .ql-picker.ql-header .ql-picker-item[data-value='3']::before {
content: "标题3"; content: '标题3';
} }
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before, .ql-snow .ql-picker.ql-header .ql-picker-label[data-value='4']::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before { .ql-snow .ql-picker.ql-header .ql-picker-item[data-value='4']::before {
content: "标题4"; content: '标题4';
} }
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before, .ql-snow .ql-picker.ql-header .ql-picker-label[data-value='5']::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before { .ql-snow .ql-picker.ql-header .ql-picker-item[data-value='5']::before {
content: "标题5"; content: '标题5';
} }
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before, .ql-snow .ql-picker.ql-header .ql-picker-label[data-value='6']::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before { .ql-snow .ql-picker.ql-header .ql-picker-item[data-value='6']::before {
content: "标题6"; content: '标题6';
} }
.ql-snow .ql-picker.ql-font .ql-picker-label::before, .ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before { .ql-snow .ql-picker.ql-font .ql-picker-item::before {
content: "标准字体"; content: '标准字体';
} }
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before, .ql-snow .ql-picker.ql-font .ql-picker-label[data-value='serif']::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before { .ql-snow .ql-picker.ql-font .ql-picker-item[data-value='serif']::before {
content: "衬线字体"; content: '衬线字体';
} }
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before, .ql-snow .ql-picker.ql-font .ql-picker-label[data-value='monospace']::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before { .ql-snow .ql-picker.ql-font .ql-picker-item[data-value='monospace']::before {
content: "等宽字体"; content: '等宽字体';
} }
</style> </style>

79
src/components/FileUpload/index.vue
View File

@@ -1,23 +1,10 @@
<template> <template>
<div class="upload-file"> <div class="upload-file">
<el-upload <el-upload ref="fileUpload" multiple :action="uploadFileUrl" :before-upload="handleBeforeUpload" :file-list="fileList" :limit="limit" :on-error="handleUploadError" :on-exceed="handleExceed" :on-success="handleUploadSuccess" :show-file-list="false" :headers="headers" class="upload-file-uploader">
multiple
:action="uploadFileUrl"
:before-upload="handleBeforeUpload"
:file-list="fileList"
:limit="limit"
:on-error="handleUploadError"
:on-exceed="handleExceed"
:on-success="handleUploadSuccess"
:show-file-list="false"
:headers="headers"
class="upload-file-uploader"
ref="fileUpload"
>
<!-- 上传按钮 --> <!-- 上传按钮 -->
<el-button size="mini" type="primary">选取文件</el-button> <el-button size="mini" type="primary">选取文件</el-button>
<!-- 上传提示 --> <!-- 上传提示 -->
<div class="el-upload__tip" slot="tip" v-if="showTip"> <div v-if="showTip" slot="tip" class="el-upload__tip">
请上传 请上传
<template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> </template> <template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> </template>
<template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template> <template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template>
@@ -27,12 +14,12 @@
<!-- 文件列表 --> <!-- 文件列表 -->
<transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul"> <transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
<li :key="file.url" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in fileList"> <li v-for="(file, index) in fileList" :key="file.url" class="el-upload-list__item ele-upload-list__item-content">
<el-link :href="`${baseUrl}${file.url}`" :underline="false" target="_blank"> <el-link :href="`${baseUrl}${file.url}`" :underline="false" target="_blank">
<span class="el-icon-document"> {{ getFileName(file.name) }} </span> <span class="el-icon-document"> {{ getFileName(file.name) }} </span>
</el-link> </el-link>
<div class="ele-upload-list__item-content-action"> <div class="ele-upload-list__item-content-action">
<el-link :underline="false" @click="handleDelete(index)" type="danger">删除</el-link> <el-link :underline="false" type="danger" @click="handleDelete(index)">删除</el-link>
</div> </div>
</li> </li>
</transition-group> </transition-group>
@@ -40,27 +27,27 @@
</template> </template>
<script> <script>
import { getToken } from "@/utils/auth"; import { getToken } from '@/utils/auth';
export default { export default {
name: "FileUpload", name: 'FileUpload',
props: { props: {
// 值 // 值
value: [String, Object, Array], value: [String, Object, Array],
// 数量限制 // 数量限制
limit: { limit: {
type: Number, type: Number,
default: 5, default: 5
}, },
// 大小限制(MB) // 大小限制(MB)
fileSize: { fileSize: {
type: Number, type: Number,
default: 5, default: 5
}, },
// 文件类型, 例如['png', 'jpg', 'jpeg'] // 文件类型, 例如['png', 'jpg', 'jpeg']
fileType: { fileType: {
type: Array, type: Array,
default: () => ["doc", "xls", "ppt", "txt", "pdf"], default: () => ['doc', 'xls', 'ppt', 'txt', 'pdf']
}, },
// 是否显示提示 // 是否显示提示
isShowTip: { isShowTip: {
@@ -73,13 +60,19 @@ export default {
number: 0, number: 0,
uploadList: [], uploadList: [],
baseUrl: process.env.VUE_APP_BASE_API, baseUrl: process.env.VUE_APP_BASE_API,
uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传文件服务器地址 uploadFileUrl: process.env.VUE_APP_BASE_API + '/common/upload', // 上传文件服务器地址
headers: { headers: {
Authorization: "Bearer " + getToken(), Authorization: 'Bearer ' + getToken()
}, },
fileList: [], fileList: []
}; };
}, },
computed: {
// 是否显示提示
showTip() {
return this.isShowTip && (this.fileType || this.fileSize);
}
},
watch: { watch: {
value: { value: {
handler(val) { handler(val) {
@@ -88,8 +81,8 @@ export default {
// 首先将值转为数组 // 首先将值转为数组
const list = Array.isArray(val) ? val : this.value.split(','); const list = Array.isArray(val) ? val : this.value.split(',');
// 然后将数组转为对象数组 // 然后将数组转为对象数组
this.fileList = list.map(item => { this.fileList = list.map((item) => {
if (typeof item === "string") { if (typeof item === 'string') {
item = { name: item, url: item }; item = { name: item, url: item };
} }
item.uid = item.uid || new Date().getTime() + temp++; item.uid = item.uid || new Date().getTime() + temp++;
@@ -104,12 +97,6 @@ export default {
immediate: true immediate: true
} }
}, },
computed: {
// 是否显示提示
showTip() {
return this.isShowTip && (this.fileType || this.fileSize);
},
},
methods: { methods: {
// 上传前校检格式和大小 // 上传前校检格式和大小
handleBeforeUpload(file) { handleBeforeUpload(file) {
@@ -119,7 +106,7 @@ export default {
const fileExt = fileName[fileName.length - 1]; const fileExt = fileName[fileName.length - 1];
const isTypeOk = this.fileType.indexOf(fileExt) >= 0; const isTypeOk = this.fileType.indexOf(fileExt) >= 0;
if (!isTypeOk) { if (!isTypeOk) {
this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join("/")}格式文件!`); this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join('/')}格式文件!`);
return false; return false;
} }
} }
@@ -131,7 +118,7 @@ export default {
return false; return false;
} }
} }
this.$modal.loading("正在上传文件，请稍候..."); this.$modal.loading('正在上传文件，请稍候...');
this.number++; this.number++;
return true; return true;
}, },
@@ -140,9 +127,9 @@ export default {
this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`); this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`);
}, },
// 上传失败 // 上传失败
handleUploadError(err) { handleUploadError() {
this.$modal.msgError("上传文件失败，请重试"); this.$modal.msgError('上传文件失败，请重试');
this.$modal.closeLoading() this.$modal.closeLoading();
}, },
// 上传成功回调 // 上传成功回调
handleUploadSuccess(res, file) { handleUploadSuccess(res, file) {
@@ -160,7 +147,7 @@ export default {
// 删除文件 // 删除文件
handleDelete(index) { handleDelete(index) {
this.fileList.splice(index, 1); this.fileList.splice(index, 1);
this.$emit("input", this.listToString(this.fileList)); this.$emit('input', this.listToString(this.fileList));
}, },
// 上传结束处理 // 上传结束处理
uploadedSuccessfully() { uploadedSuccessfully() {
@@ -168,23 +155,23 @@ export default {
this.fileList = this.fileList.concat(this.uploadList); this.fileList = this.fileList.concat(this.uploadList);
this.uploadList = []; this.uploadList = [];
this.number = 0; this.number = 0;
this.$emit("input", this.listToString(this.fileList)); this.$emit('input', this.listToString(this.fileList));
this.$modal.closeLoading(); this.$modal.closeLoading();
} }
}, },
// 获取文件名称 // 获取文件名称
getFileName(name) { getFileName(name) {
if (name.lastIndexOf("/") > -1) { if (name.lastIndexOf('/') > -1) {
return name.slice(name.lastIndexOf("/") + 1); return name.slice(name.lastIndexOf('/') + 1);
} else { } else {
return ""; return '';
} }
}, },
// 对象转成指定字符串分隔 // 对象转成指定字符串分隔
listToString(list, separator) { listToString(list, separator) {
let strs = ""; let strs = '';
separator = separator || ","; separator = separator || ',';
for (let i in list) { for (const i in list) {
strs += list[i].url + separator; strs += list[i].url + separator;
} }
return strs != '' ? strs.substr(0, strs.length - 1) : ''; return strs != '' ? strs.substr(0, strs.length - 1) : '';

13
src/components/Hamburger/index.vue
View File

@@ -1,13 +1,6 @@
<template> <template>
<div style="padding: 0 15px;" @click="toggleClick"> <div style="padding: 0 15px;" @click="toggleClick">
<svg <svg :class="{'is-active':isActive}" class="hamburger" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="64" height="64">
:class="{'is-active':isActive}"
class="hamburger"
viewBox="0 0 1024 1024"
xmlns="http://www.w3.org/2000/svg"
width="64"
height="64"
>
<path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" /> <path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" />
</svg> </svg>
</div> </div>
@@ -24,10 +17,10 @@ export default {
}, },
methods: { methods: {
toggleClick() { toggleClick() {
this.$emit('toggleClick') this.$emit('toggleClick');
}
} }
} }
};
</script> </script>
<style scoped> <style scoped>

91
src/components/HeaderSearch/index.vue
View File

@@ -1,17 +1,7 @@
<template> <template>
<div :class="{'show':show}" class="header-search"> <div :class="{'show':show}" class="header-search">
<svg-icon class-name="search-icon" icon-class="search" @click.stop="click" /> <svg-icon class-name="search-icon" icon-class="search" @click.stop="click" />
<el-select <el-select ref="headerSearchSelect" v-model="search" :remote-method="querySearch" filterable default-first-option remote placeholder="Search" class="header-search-select" @change="change">
ref="headerSearchSelect"
v-model="search"
:remote-method="querySearch"
filterable
default-first-option
remote
placeholder="Search"
class="header-search-select"
@change="change"
>
<el-option v-for="option in options" :key="option.item.path" :value="option.item" :label="option.item.title.join(' > ')" /> <el-option v-for="option in options" :key="option.item.path" :value="option.item" :label="option.item.title.join(' > ')" />
</el-select> </el-select>
</div> </div>
@@ -20,8 +10,8 @@
<script> <script>
// fuse is a lightweight fuzzy-search module // fuse is a lightweight fuzzy-search module
// make search results more in line with expectations // make search results more in line with expectations
import Fuse from 'fuse.js/dist/fuse.min.js' import Fuse from 'fuse.js/dist/fuse.min.js';
import path from 'path' import path from 'path';
export default { export default {
name: 'HeaderSearch', name: 'HeaderSearch',
@@ -32,57 +22,57 @@ export default {
searchPool: [], searchPool: [],
show: false, show: false,
fuse: undefined fuse: undefined
} };
}, },
computed: { computed: {
routes() { routes() {
return this.$store.getters.permission_routes return this.$store.getters.permission_routes;
} }
}, },
watch: { watch: {
routes() { routes() {
this.searchPool = this.generateRoutes(this.routes) this.searchPool = this.generateRoutes(this.routes);
}, },
searchPool(list) { searchPool(list) {
this.initFuse(list) this.initFuse(list);
}, },
show(value) { show(value) {
if (value) { if (value) {
document.body.addEventListener('click', this.close) document.body.addEventListener('click', this.close);
} else { } else {
document.body.removeEventListener('click', this.close) document.body.removeEventListener('click', this.close);
} }
} }
}, },
mounted() { mounted() {
this.searchPool = this.generateRoutes(this.routes) this.searchPool = this.generateRoutes(this.routes);
}, },
methods: { methods: {
click() { click() {
this.show = !this.show this.show = !this.show;
if (this.show) { if (this.show) {
this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.focus() this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.focus();
} }
}, },
close() { close() {
this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.blur() this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.blur();
this.options = [] this.options = [];
this.show = false this.show = false;
}, },
change(val) { change(val) {
const path = val.path; const path = val.path;
if (this.ishttp(val.path)) { if (this.ishttp(val.path)) {
// http(s):// 路径新窗口打开 // http(s):// 路径新窗口打开
const pindex = path.indexOf("http"); const pindex = path.indexOf('http');
window.open(path.substr(pindex, path.length), "_blank"); window.open(path.substr(pindex, path.length), '_blank');
} else { } else {
this.$router.push(val.path) this.$router.push(val.path);
} }
this.search = '' this.search = '';
this.options = [] this.options = [];
this.$nextTick(() => { this.$nextTick(() => {
this.show = false this.show = false;
}) });
}, },
initFuse(list) { initFuse(list) {
this.fuse = new Fuse(list, { this.fuse = new Fuse(list, {
@@ -92,61 +82,66 @@ export default {
distance: 100, distance: 100,
maxPatternLength: 32, maxPatternLength: 32,
minMatchCharLength: 1, minMatchCharLength: 1,
keys: [{ keys: [
{
name: 'title', name: 'title',
weight: 0.7 weight: 0.7
}, { },
{
name: 'path', name: 'path',
weight: 0.3 weight: 0.3
}] }
}) ]
});
}, },
// Filter out the routes that can be displayed in the sidebar // Filter out the routes that can be displayed in the sidebar
// And generate the internationalized title // And generate the internationalized title
generateRoutes(routes, basePath = '/', prefixTitle = []) { generateRoutes(routes, basePath = '/', prefixTitle = []) {
let res = [] let res = [];
for (const router of routes) { for (const router of routes) {
// skip hidden router // skip hidden router
if (router.hidden) { continue } if (router.hidden) {
continue;
}
const data = { const data = {
path: !this.ishttp(router.path) ? path.resolve(basePath, router.path) : router.path, path: !this.ishttp(router.path) ? path.resolve(basePath, router.path) : router.path,
title: [...prefixTitle] title: [...prefixTitle]
} };
if (router.meta && router.meta.title) { if (router.meta && router.meta.title) {
data.title = [...data.title, router.meta.title] data.title = [...data.title, router.meta.title];
if (router.redirect !== 'noRedirect') { if (router.redirect !== 'noRedirect') {
// only push the routes with title // only push the routes with title
// special case: need to exclude parent router without redirect // special case: need to exclude parent router without redirect
res.push(data) res.push(data);
} }
} }
// recursive child routes // recursive child routes
if (router.children) { if (router.children) {
const tempRoutes = this.generateRoutes(router.children, data.path, data.title) const tempRoutes = this.generateRoutes(router.children, data.path, data.title);
if (tempRoutes.length >= 1) { if (tempRoutes.length >= 1) {
res = [...res, ...tempRoutes] res = [...res, ...tempRoutes];
} }
} }
} }
return res return res;
}, },
querySearch(query) { querySearch(query) {
if (query !== '') { if (query !== '') {
this.options = this.fuse.search(query) this.options = this.fuse.search(query);
} else { } else {
this.options = [] this.options = [];
} }
}, },
ishttp(url) { ishttp(url) {
return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1 return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1;
}
} }
} }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

18
src/components/IconSelect/index.vue
View File

@@ -14,32 +14,32 @@
</template> </template>
<script> <script>
import icons from './requireIcons' import icons from './requireIcons';
export default { export default {
name: 'IconSelect', name: 'IconSelect',
data() { data() {
return { return {
name: '', name: '',
iconList: icons iconList: icons
} };
}, },
methods: { methods: {
filterIcons() { filterIcons() {
this.iconList = icons this.iconList = icons;
if (this.name) { if (this.name) {
this.iconList = this.iconList.filter(item => item.includes(this.name)) this.iconList = this.iconList.filter((item) => item.includes(this.name));
} }
}, },
selectedIcon(name) { selectedIcon(name) {
this.$emit('selected', name) this.$emit('selected', name);
document.body.click() document.body.click();
}, },
reset() { reset() {
this.name = '' this.name = '';
this.iconList = icons this.iconList = icons;
}
} }
} }
};
</script> </script>
<style rel="stylesheet/scss" lang="scss" scoped> <style rel="stylesheet/scss" lang="scss" scoped>

15
src/components/IconSelect/requireIcons.js
View File

@@ -1,11 +1,10 @@
const req = require.context('../../assets/icons/svg', false, /\.svg$/);
const requireAll = (requireContext) => requireContext.keys();
const req = require.context('../../assets/icons/svg', false, /\.svg$/) const re = /\.\/(.*)\.svg/;
const requireAll = requireContext => requireContext.keys()
const re = /\.\/(.*)\.svg/ const icons = requireAll(req).map((i) => {
return i.match(re)[1];
});
const icons = requireAll(req).map(i => { export default icons;
return i.match(re)[1]
})
export default icons

33
src/components/ImagePreview/index.vue
View File

@@ -1,33 +1,28 @@
<template> <template>
<el-image <el-image :src="`${realSrc}`" fit="cover" :style="`width:${realWidth};height:${realHeight};`" :preview-src-list="realSrcList">
:src="`${realSrc}`"
fit="cover"
:style="`width:${realWidth};height:${realHeight};`"
:preview-src-list="realSrcList"
>
<div slot="error" class="image-slot"> <div slot="error" class="image-slot">
<i class="el-icon-picture-outline"></i> <i class="el-icon-picture-outline" />
</div> </div>
</el-image> </el-image>
</template> </template>
<script> <script>
import { isExternal } from "@/utils/validate"; import { isExternal } from '@/utils/validate';
export default { export default {
name: "ImagePreview", name: 'ImagePreview',
props: { props: {
src: { src: {
type: String, type: String,
default: "" default: ''
}, },
width: { width: {
type: [Number, String], type: [Number, String],
default: "" default: ''
}, },
height: { height: {
type: [Number, String], type: [Number, String],
default: "" default: ''
} }
}, },
computed: { computed: {
@@ -35,7 +30,7 @@ export default {
if (!this.src) { if (!this.src) {
return; return;
} }
let real_src = this.src.split(",")[0]; const real_src = this.src.split(',')[0];
if (isExternal(real_src)) { if (isExternal(real_src)) {
return real_src; return real_src;
} }
@@ -45,9 +40,9 @@ export default {
if (!this.src) { if (!this.src) {
return; return;
} }
let real_src_list = this.src.split(","); const real_src_list = this.src.split(',');
let srcList = []; const srcList = [];
real_src_list.forEach(item => { real_src_list.forEach((item) => {
if (isExternal(item)) { if (isExternal(item)) {
return srcList.push(item); return srcList.push(item);
} }
@@ -56,12 +51,12 @@ export default {
return srcList; return srcList;
}, },
realWidth() { realWidth() {
return typeof this.width == "string" ? this.width : `${this.width}px`; return typeof this.width == 'string' ? this.width : `${this.width}px`;
}, },
realHeight() { realHeight() {
return typeof this.height == "string" ? this.height : `${this.height}px`; return typeof this.height == 'string' ? this.height : `${this.height}px`;
}
} }
},
}; };
</script> </script>

97
src/components/ImageUpload/index.vue
View File

@@ -1,49 +1,25 @@
<template> <template>
<div class="component-upload-image"> <div class="component-upload-image">
<el-upload <el-upload ref="imageUpload" multiple :action="uploadImgUrl" list-type="picture-card" :on-success="handleUploadSuccess" :before-upload="handleBeforeUpload" :limit="limit" :on-error="handleUploadError" :on-exceed="handleExceed" :on-remove="handleDelete" :show-file-list="true" :headers="headers" :file-list="fileList" :on-preview="handlePictureCardPreview" :class="{hide: fileList.length >= limit}">
multiple <i class="el-icon-plus" />
:action="uploadImgUrl"
list-type="picture-card"
:on-success="handleUploadSuccess"
:before-upload="handleBeforeUpload"
:limit="limit"
:on-error="handleUploadError"
:on-exceed="handleExceed"
ref="imageUpload"
:on-remove="handleDelete"
:show-file-list="true"
:headers="headers"
:file-list="fileList"
:on-preview="handlePictureCardPreview"
:class="{hide: this.fileList.length >= this.limit}"
>
<i class="el-icon-plus"></i>
</el-upload> </el-upload>
<!-- 上传提示 --> <!-- 上传提示 -->
<div class="el-upload__tip" slot="tip" v-if="showTip"> <div v-if="showTip" slot="tip" class="el-upload__tip">
请上传 请上传
<template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> </template> <template v-if="fileSize"> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> </template>
<template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template> <template v-if="fileType"> 格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b> </template>
的文件 的文件
</div> </div>
<el-dialog <el-dialog :visible.sync="dialogVisible" title="预览" width="800" append-to-body>
:visible.sync="dialogVisible" <img :src="dialogImageUrl" style="display: block; max-width: 100%; margin: 0 auto">
title="预览"
width="800"
append-to-body
>
<img
:src="dialogImageUrl"
style="display: block; max-width: 100%; margin: 0 auto"
/>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { getToken } from "@/utils/auth"; import { getToken } from '@/utils/auth';
export default { export default {
props: { props: {
@@ -51,17 +27,17 @@ export default {
// 图片数量限制 // 图片数量限制
limit: { limit: {
type: Number, type: Number,
default: 5, default: 5
}, },
// 大小限制(MB) // 大小限制(MB)
fileSize: { fileSize: {
type: Number, type: Number,
default: 5, default: 5
}, },
// 文件类型, 例如['png', 'jpg', 'jpeg'] // 文件类型, 例如['png', 'jpg', 'jpeg']
fileType: { fileType: {
type: Array, type: Array,
default: () => ["png", "jpg", "jpeg"], default: () => ['png', 'jpg', 'jpeg']
}, },
// 是否显示提示 // 是否显示提示
isShowTip: { isShowTip: {
@@ -73,17 +49,23 @@ export default {
return { return {
number: 0, number: 0,
uploadList: [], uploadList: [],
dialogImageUrl: "", dialogImageUrl: '',
dialogVisible: false, dialogVisible: false,
hideUpload: false, hideUpload: false,
baseUrl: process.env.VUE_APP_BASE_API, baseUrl: process.env.VUE_APP_BASE_API,
uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址 uploadImgUrl: process.env.VUE_APP_BASE_API + '/common/upload', // 上传的图片服务器地址
headers: { headers: {
Authorization: "Bearer " + getToken(), Authorization: 'Bearer ' + getToken()
}, },
fileList: [] fileList: []
}; };
}, },
computed: {
// 是否显示提示
showTip() {
return this.isShowTip && (this.fileType || this.fileSize);
}
},
watch: { watch: {
value: { value: {
handler(val) { handler(val) {
@@ -91,8 +73,8 @@ export default {
// 首先将值转为数组 // 首先将值转为数组
const list = Array.isArray(val) ? val : this.value.split(','); const list = Array.isArray(val) ? val : this.value.split(',');
// 然后将数组转为对象数组 // 然后将数组转为对象数组
this.fileList = list.map(item => { this.fileList = list.map((item) => {
if (typeof item === "string") { if (typeof item === 'string') {
if (item.indexOf(this.baseUrl) === -1) { if (item.indexOf(this.baseUrl) === -1) {
item = { name: this.baseUrl + item, url: this.baseUrl + item }; item = { name: this.baseUrl + item, url: this.baseUrl + item };
} else { } else {
@@ -110,32 +92,26 @@ export default {
immediate: true immediate: true
} }
}, },
computed: {
// 是否显示提示
showTip() {
return this.isShowTip && (this.fileType || this.fileSize);
},
},
methods: { methods: {
// 上传前loading加载 // 上传前loading加载
handleBeforeUpload(file) { handleBeforeUpload(file) {
let isImg = false; let isImg = false;
if (this.fileType.length) { if (this.fileType.length) {
let fileExtension = ""; let fileExtension = '';
if (file.name.lastIndexOf(".") > -1) { if (file.name.lastIndexOf('.') > -1) {
fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1); fileExtension = file.name.slice(file.name.lastIndexOf('.') + 1);
} }
isImg = this.fileType.some(type => { isImg = this.fileType.some((type) => {
if (file.type.indexOf(type) > -1) return true; if (file.type.indexOf(type) > -1) return true;
if (fileExtension && fileExtension.indexOf(type) > -1) return true; if (fileExtension && fileExtension.indexOf(type) > -1) return true;
return false; return false;
}); });
} else { } else {
isImg = file.type.indexOf("image") > -1; isImg = file.type.indexOf('image') > -1;
} }
if (!isImg) { if (!isImg) {
this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join("/")}图片格式文件!`); this.$modal.msgError(`文件格式不正确, 请上传${this.fileType.join('/')}图片格式文件!`);
return false; return false;
} }
if (this.fileSize) { if (this.fileSize) {
@@ -145,7 +121,7 @@ export default {
return false; return false;
} }
} }
this.$modal.loading("正在上传图片，请稍候..."); this.$modal.loading('正在上传图片，请稍候...');
this.number++; this.number++;
}, },
// 文件个数超出 // 文件个数超出
@@ -167,15 +143,15 @@ export default {
}, },
// 删除图片 // 删除图片
handleDelete(file) { handleDelete(file) {
const findex = this.fileList.map(f => f.name).indexOf(file.name); const findex = this.fileList.map((f) => f.name).indexOf(file.name);
if (findex > -1) { if (findex > -1) {
this.fileList.splice(findex, 1); this.fileList.splice(findex, 1);
this.$emit("input", this.listToString(this.fileList)); this.$emit('input', this.listToString(this.fileList));
} }
}, },
// 上传失败 // 上传失败
handleUploadError() { handleUploadError() {
this.$modal.msgError("上传图片失败，请重试"); this.$modal.msgError('上传图片失败，请重试');
this.$modal.closeLoading(); this.$modal.closeLoading();
}, },
// 上传结束处理 // 上传结束处理
@@ -184,7 +160,7 @@ export default {
this.fileList = this.fileList.concat(this.uploadList); this.fileList = this.fileList.concat(this.uploadList);
this.uploadList = []; this.uploadList = [];
this.number = 0; this.number = 0;
this.$emit("input", this.listToString(this.fileList)); this.$emit('input', this.listToString(this.fileList));
this.$modal.closeLoading(); this.$modal.closeLoading();
} }
}, },
@@ -195,11 +171,11 @@ export default {
}, },
// 对象转成指定字符串分隔 // 对象转成指定字符串分隔
listToString(list, separator) { listToString(list, separator) {
let strs = ""; let strs = '';
separator = separator || ","; separator = separator || ',';
for (let i in list) { for (const i in list) {
if (list[i].url) { if (list[i].url) {
strs += list[i].url.replace(this.baseUrl, "") + separator; strs += list[i].url.replace(this.baseUrl, '') + separator;
} }
} }
return strs != '' ? strs.substr(0, strs.length - 1) : ''; return strs != '' ? strs.substr(0, strs.length - 1) : '';
@@ -218,7 +194,8 @@ export default {
transition: all 0s; transition: all 0s;
} }
::v-deep .el-list-enter, .el-list-leave-active { ::v-deep .el-list-enter,
.el-list-leave-active {
opacity: 0; opacity: 0;
transform: translateY(0); transform: translateY(0);
} }

40
src/components/Pagination/index.vue
View File

@@ -1,22 +1,11 @@
<template> <template>
<div :class="{'hidden':hidden}" class="pagination-container"> <div :class="{'hidden':hidden}" class="pagination-container">
<el-pagination <el-pagination :background="background" :current-page.sync="currentPage" :page-size.sync="pageSize" :layout="layout" :page-sizes="pageSizes" :pager-count="pagerCount" :total="total" v-bind="$attrs" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
:background="background"
:current-page.sync="currentPage"
:page-size.sync="pageSize"
:layout="layout"
:page-sizes="pageSizes"
:pager-count="pagerCount"
:total="total"
v-bind="$attrs"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div> </div>
</template> </template>
<script> <script>
import { scrollTo } from '@/utils/scroll-to' import { scrollTo } from '@/utils/scroll-to';
export default { export default {
name: 'Pagination', name: 'Pagination',
@@ -36,7 +25,7 @@ export default {
pageSizes: { pageSizes: {
type: Array, type: Array,
default() { default() {
return [10, 20, 30, 50] return [10, 20, 30, 50];
} }
}, },
// 移动端页码按钮的数量端默认值5 // 移动端页码按钮的数量端默认值5
@@ -62,45 +51,44 @@ export default {
} }
}, },
data() { data() {
return { return {};
};
}, },
computed: { computed: {
currentPage: { currentPage: {
get() { get() {
return this.page return this.page;
}, },
set(val) { set(val) {
this.$emit('update:page', val) this.$emit('update:page', val);
} }
}, },
pageSize: { pageSize: {
get() { get() {
return this.limit return this.limit;
}, },
set(val) { set(val) {
this.$emit('update:limit', val) this.$emit('update:limit', val);
} }
} }
}, },
methods: { methods: {
handleSizeChange(val) { handleSizeChange(val) {
if (this.currentPage * val > this.total) { if (this.currentPage * val > this.total) {
this.currentPage = 1 this.currentPage = 1;
} }
this.$emit('pagination', { page: this.currentPage, limit: val }) this.$emit('pagination', { page: this.currentPage, limit: val });
if (this.autoScroll) { if (this.autoScroll) {
scrollTo(0, 800) scrollTo(0, 800);
} }
}, },
handleCurrentChange(val) { handleCurrentChange(val) {
this.$emit('pagination', { page: val, limit: this.pageSize }) this.$emit('pagination', { page: val, limit: this.pageSize });
if (this.autoScroll) { if (this.autoScroll) {
scrollTo(0, 800) scrollTo(0, 800);
}
} }
} }
} }
};
</script> </script>
<style scoped> <style scoped>

2
src/components/PanThumb/index.vue
View File

@@ -31,7 +31,7 @@ export default {
default: '150px' default: '150px'
} }
} }
} };
</script> </script>
<style scoped> <style scoped>

38
src/components/RightPanel/index.vue
View File

@@ -21,49 +21,49 @@ export default {
computed: { computed: {
show: { show: {
get() { get() {
return this.$store.state.settings.showSettings return this.$store.state.settings.showSettings;
}, },
set(val) { set(val) {
this.$store.dispatch('settings/changeSetting', { this.$store.dispatch('settings/changeSetting', {
key: 'showSettings', key: 'showSettings',
value: val value: val
}) });
} }
} }
}, },
watch: { watch: {
show(value) { show(value) {
if (value && !this.clickNotClose) { if (value && !this.clickNotClose) {
this.addEventClick() this.addEventClick();
} }
} }
}, },
mounted() { mounted() {
this.insertToBody() this.insertToBody();
this.addEventClick() this.addEventClick();
}, },
beforeDestroy() { beforeDestroy() {
const elx = this.$refs.rightPanel const elx = this.$refs.rightPanel;
elx.remove() elx.remove();
}, },
methods: { methods: {
addEventClick() { addEventClick() {
window.addEventListener('click', this.closeSidebar) window.addEventListener('click', this.closeSidebar);
}, },
closeSidebar(evt) { closeSidebar(evt) {
const parent = evt.target.closest('.el-drawer__body') const parent = evt.target.closest('.el-drawer__body');
if (!parent) { if (!parent) {
this.show = false this.show = false;
window.removeEventListener('click', this.closeSidebar) window.removeEventListener('click', this.closeSidebar);
} }
}, },
insertToBody() { insertToBody() {
const elx = this.$refs.rightPanel const elx = this.$refs.rightPanel;
const body = document.querySelector('body') const body = document.querySelector('body');
body.insertBefore(elx, body.firstChild) body.insertBefore(elx, body.firstChild);
}
} }
} }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@@ -72,8 +72,8 @@ export default {
top: 0; top: 0;
left: 0; left: 0;
opacity: 0; opacity: 0;
transition: opacity .3s cubic-bezier(.7, .3, .1, 1); transition: opacity 0.3s cubic-bezier(0.7, 0.3, 0.1, 1);
background: rgba(0, 0, 0, .2); background: rgba(0, 0, 0, 0.2);
z-index: -1; z-index: -1;
} }
@@ -84,8 +84,8 @@ export default {
position: fixed; position: fixed;
top: 0; top: 0;
right: 0; right: 0;
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .05); box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
transition: all .25s cubic-bezier(.7, .3, .1, 1); transition: all 0.25s cubic-bezier(0.7, 0.3, 0.1, 1);
transform: translate(100%); transform: translate(100%);
background: #fff; background: #fff;
z-index: 40000; z-index: 40000;

65
src/components/RightToolbar/index.vue
View File

@@ -1,56 +1,52 @@
<template> <template>
<div class="top-right-btn" :style="style"> <div class="top-right-btn" :style="style">
<el-row> <el-row>
<el-tooltip class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '显示搜索'" placement="top" v-if="search"> <el-tooltip v-if="search" class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '显示搜索'" placement="top">
<el-button size="mini" circle icon="el-icon-search" @click="toggleSearch()" /> <el-button size="mini" circle icon="el-icon-search" @click="toggleSearch()" />
</el-tooltip> </el-tooltip>
<el-tooltip class="item" effect="dark" content="刷新" placement="top"> <el-tooltip class="item" effect="dark" content="刷新" placement="top">
<el-button size="mini" circle icon="el-icon-refresh" @click="refresh()" /> <el-button size="mini" circle icon="el-icon-refresh" @click="refresh()" />
</el-tooltip> </el-tooltip>
<el-tooltip class="item" effect="dark" content="显隐列" placement="top" v-if="columns"> <el-tooltip v-if="columns" class="item" effect="dark" content="显隐列" placement="top">
<el-button size="mini" circle icon="el-icon-menu" @click="showColumn()" /> <el-button size="mini" circle icon="el-icon-menu" @click="showColumn()" />
</el-tooltip> </el-tooltip>
</el-row> </el-row>
<el-dialog :title="title" :visible.sync="open" append-to-body> <el-dialog :title="title" :visible.sync="open" append-to-body>
<el-transfer <el-transfer v-model="value" :titles="['显示', '隐藏']" :data="columns" @change="dataChange" />
:titles="['显示', '隐藏']"
v-model="value"
:data="columns"
@change="dataChange"
></el-transfer>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: "RightToolbar", name: 'RightToolbar',
props: {
showSearch: {
type: Boolean,
default: true
},
columns: {
type: Array,
default: () => []
},
search: {
type: Boolean,
default: true
},
gutter: {
type: Number,
default: 10
}
},
data() { data() {
return { return {
// 显隐数据 // 显隐数据
value: [], value: [],
// 弹出层标题 // 弹出层标题
title: "显示/隐藏", title: '显示/隐藏',
// 是否显示弹出层 // 是否显示弹出层
open: false, open: false
}; };
}, },
props: {
showSearch: {
type: Boolean,
default: true,
},
columns: {
type: Array,
},
search: {
type: Boolean,
default: true,
},
gutter: {
type: Number,
default: 10,
},
},
computed: { computed: {
style() { style() {
const ret = {}; const ret = {};
@@ -62,7 +58,7 @@ export default {
}, },
created() { created() {
// 显隐列初始默认隐藏列 // 显隐列初始默认隐藏列
for (let item in this.columns) { for (const item in this.columns) {
if (this.columns[item].visible === false) { if (this.columns[item].visible === false) {
this.value.push(parseInt(item)); this.value.push(parseInt(item));
} }
@@ -71,24 +67,25 @@ export default {
methods: { methods: {
// 搜索 // 搜索
toggleSearch() { toggleSearch() {
this.$emit("update:showSearch", !this.showSearch); this.$emit('update:showSearch', !this.showSearch);
}, },
// 刷新 // 刷新
refresh() { refresh() {
this.$emit("queryTable"); this.$emit('queryTable');
}, },
// 右侧列表元素变化 // 右侧列表元素变化
dataChange(data) { dataChange(data) {
for (let item in this.columns) { for (const item in this.columns) {
const key = this.columns[item].key; const key = this.columns[item].key;
// eslint-disable-next-line vue/no-mutating-props
this.columns[item].visible = !data.includes(key); this.columns[item].visible = !data.includes(key);
} }
}, },
// 打开显隐列dialog // 打开显隐列dialog
showColumn() { showColumn() {
this.open = true; this.open = true;
}, }
}, }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

21
src/components/RuoYi/Doc/index.vue
View File

@@ -1,21 +0,0 @@
<template>
<div>
<svg-icon icon-class="question" @click="goto" />
</div>
</template>
<script>
export default {
name: 'RuoYiDoc',
data() {
return {
url: 'http://doc.ruoyi.vip/ruoyi-vue'
}
},
methods: {
goto() {
window.open(this.url)
}
}
}
</script>

21
src/components/RuoYi/Git/index.vue
View File

@@ -1,21 +0,0 @@
<template>
<div>
<svg-icon icon-class="github" @click="goto" />
</div>
</template>
<script>
export default {
name: 'RuoYiGit',
data() {
return {
url: 'https://gitee.com/y_project/RuoYi-Vue'
}
},
methods: {
goto() {
window.open(this.url)
}
}
}
</script>

24
src/components/Screenfull/index.vue
View File

@@ -5,51 +5,51 @@
</template> </template>
<script> <script>
import screenfull from 'screenfull' import screenfull from 'screenfull';
export default { export default {
name: 'Screenfull', name: 'Screenfull',
data() { data() {
return { return {
isFullscreen: false isFullscreen: false
} };
}, },
mounted() { mounted() {
this.init() this.init();
}, },
beforeDestroy() { beforeDestroy() {
this.destroy() this.destroy();
}, },
methods: { methods: {
click() { click() {
if (!screenfull.isEnabled) { if (!screenfull.isEnabled) {
this.$message({ message: '你的浏览器不支持全屏', type: 'warning' }) this.$message({ message: '你的浏览器不支持全屏', type: 'warning' });
return false return false;
} }
screenfull.toggle() screenfull.toggle();
}, },
change() { change() {
this.isFullscreen = screenfull.isFullscreen this.isFullscreen = screenfull.isFullscreen;
}, },
init() { init() {
if (screenfull.isEnabled) { if (screenfull.isEnabled) {
screenfull.on('change', this.change) screenfull.on('change', this.change);
} }
}, },
destroy() { destroy() {
if (screenfull.isEnabled) { if (screenfull.isEnabled) {
screenfull.off('change', this.change) screenfull.off('change', this.change);
}
} }
} }
} }
};
</script> </script>
<style scoped> <style scoped>
.screenfull-svg { .screenfull-svg {
display: inline-block; display: inline-block;
cursor: pointer; cursor: pointer;
fill: #5a5e66;; fill: #5a5e66;
width: 20px; width: 20px;
height: 20px; height: 20px;
vertical-align: 10px; vertical-align: 10px;

23
src/components/SizeSelect/index.vue
View File

@@ -21,36 +21,35 @@ export default {
{ label: 'Small', value: 'small' }, { label: 'Small', value: 'small' },
{ label: 'Mini', value: 'mini' } { label: 'Mini', value: 'mini' }
] ]
} };
}, },
computed: { computed: {
size() { size() {
return this.$store.getters.size return this.$store.getters.size;
} }
}, },
methods: { methods: {
handleSetSize(size) { handleSetSize(size) {
this.$ELEMENT.size = size this.$ELEMENT.size = size;
this.$store.dispatch('app/setSize', size) this.$store.dispatch('app/setSize', size);
this.refreshView() this.refreshView();
this.$message({ this.$message({
message: 'Switch Size Success', message: 'Switch Size Success',
type: 'success' type: 'success'
}) });
}, },
refreshView() { refreshView() {
// In order to make the cached page re-rendered // In order to make the cached page re-rendered
this.$store.dispatch('tagsView/delAllCachedViews', this.$route) this.$store.dispatch('tagsView/delAllCachedViews', this.$route);
const { fullPath } = this.$route const { fullPath } = this.$route;
this.$nextTick(() => { this.$nextTick(() => {
this.$router.replace({ this.$router.replace({
path: '/redirect' + fullPath path: '/redirect' + fullPath
}) });
}) });
} }
} }
};
}
</script> </script>

14
src/components/SvgIcon/index.vue
View File

@@ -6,7 +6,7 @@
</template> </template>
<script> <script>
import { isExternal } from '@/utils/validate' import { isExternal } from '@/utils/validate';
export default { export default {
name: 'SvgIcon', name: 'SvgIcon',
@@ -22,26 +22,26 @@ export default {
}, },
computed: { computed: {
isExternal() { isExternal() {
return isExternal(this.iconClass) return isExternal(this.iconClass);
}, },
iconName() { iconName() {
return `#icon-${this.iconClass}` return `#icon-${this.iconClass}`;
}, },
svgClass() { svgClass() {
if (this.className) { if (this.className) {
return 'svg-icon ' + this.className return 'svg-icon ' + this.className;
} else { } else {
return 'svg-icon' return 'svg-icon';
} }
}, },
styleExternalIcon() { styleExternalIcon() {
return { return {
mask: `url(${this.iconClass}) no-repeat 50% 50%`, mask: `url(${this.iconClass}) no-repeat 50% 50%`,
'-webkit-mask': `url(${this.iconClass}) no-repeat 50% 50%` '-webkit-mask': `url(${this.iconClass}) no-repeat 50% 50%`
};
} }
} }
} };
}
</script> </script>
<style scoped> <style scoped>

159
src/components/ThemePicker/index.vue
View File

@@ -1,158 +1,153 @@
<template> <template>
<el-color-picker <el-color-picker v-model="theme" :predefine="['#409EFF', '#1890ff', '#304156','#212121','#11a983', '#13c2c2', '#6959CD', '#f5222d', ]" class="theme-picker" popper-class="theme-picker-dropdown" />
v-model="theme"
:predefine="['#409EFF', '#1890ff', '#304156','#212121','#11a983', '#13c2c2', '#6959CD', '#f5222d', ]"
class="theme-picker"
popper-class="theme-picker-dropdown"
/>
</template> </template>
<script> <script>
const version = require('element-ui/package.json').version // element-ui version from node_modules const version = require('element-ui/package.json').version; // element-ui version from node_modules
const ORIGINAL_THEME = '#409EFF' // default color const ORIGINAL_THEME = '#409EFF'; // default color
export default { export default {
data() { data() {
return { return {
chalk: '', // content of theme-chalk css chalk: '', // content of theme-chalk css
theme: '' theme: ''
} };
}, },
computed: { computed: {
defaultTheme() { defaultTheme() {
return this.$store.state.settings.theme return this.$store.state.settings.theme;
} }
}, },
watch: { watch: {
defaultTheme: { defaultTheme: {
handler: function (val, oldVal) { handler: function (val, oldVal) {
this.theme = val this.theme = val;
}, },
immediate: true immediate: true
}, },
async theme(val) { async theme(val) {
await this.setTheme(val) await this.setTheme(val);
} }
}, },
created() { created() {
if (this.defaultTheme !== ORIGINAL_THEME) { if (this.defaultTheme !== ORIGINAL_THEME) {
this.setTheme(this.defaultTheme) this.setTheme(this.defaultTheme);
} }
}, },
methods: { methods: {
async setTheme(val) { async setTheme(val) {
const oldVal = this.chalk ? this.theme : ORIGINAL_THEME const oldVal = this.chalk ? this.theme : ORIGINAL_THEME;
if (typeof val !== 'string') return if (typeof val !== 'string') return;
const themeCluster = this.getThemeCluster(val.replace('#', '')) const themeCluster = this.getThemeCluster(val.replace('#', ''));
const originalCluster = this.getThemeCluster(oldVal.replace('#', '')) const originalCluster = this.getThemeCluster(oldVal.replace('#', ''));
const getHandler = (variable, id) => { const getHandler = (variable, id) => {
return () => { return () => {
const originalCluster = this.getThemeCluster(ORIGINAL_THEME.replace('#', '')) const originalCluster = this.getThemeCluster(ORIGINAL_THEME.replace('#', ''));
const newStyle = this.updateStyle(this[variable], originalCluster, themeCluster) const newStyle = this.updateStyle(this[variable], originalCluster, themeCluster);
let styleTag = document.getElementById(id) let styleTag = document.getElementById(id);
if (!styleTag) { if (!styleTag) {
styleTag = document.createElement('style') styleTag = document.createElement('style');
styleTag.setAttribute('id', id) styleTag.setAttribute('id', id);
document.head.appendChild(styleTag) document.head.appendChild(styleTag);
}
styleTag.innerText = newStyle
}
} }
styleTag.innerText = newStyle;
};
};
if (!this.chalk) { if (!this.chalk) {
const url = `https://unpkg.com/element-ui@${version}/lib/theme-chalk/index.css` const url = `https://unpkg.com/element-ui@${version}/lib/theme-chalk/index.css`;
await this.getCSSString(url, 'chalk') await this.getCSSString(url, 'chalk');
} }
const chalkHandler = getHandler('chalk', 'chalk-style') const chalkHandler = getHandler('chalk', 'chalk-style');
chalkHandler() chalkHandler();
const styles = [].slice.call(document.querySelectorAll('style')) const styles = [].slice.call(document.querySelectorAll('style')).filter((style) => {
.filter(style => { const text = style.innerText;
const text = style.innerText return new RegExp(oldVal, 'i').test(text) && !/Chalk Variables/.test(text);
return new RegExp(oldVal, 'i').test(text) && !/Chalk Variables/.test(text) });
}) styles.forEach((style) => {
styles.forEach(style => { const { innerText } = style;
const { innerText } = style if (typeof innerText !== 'string') return;
if (typeof innerText !== 'string') return style.innerText = this.updateStyle(innerText, originalCluster, themeCluster);
style.innerText = this.updateStyle(innerText, originalCluster, themeCluster) });
})
this.$emit('change', val) this.$emit('change', val);
}, },
updateStyle(style, oldCluster, newCluster) { updateStyle(style, oldCluster, newCluster) {
let newStyle = style let newStyle = style;
oldCluster.forEach((color, index) => { oldCluster.forEach((color, index) => {
newStyle = newStyle.replace(new RegExp(color, 'ig'), newCluster[index]) newStyle = newStyle.replace(new RegExp(color, 'ig'), newCluster[index]);
}) });
return newStyle return newStyle;
}, },
getCSSString(url, variable) { getCSSString(url, variable) {
return new Promise(resolve => { return new Promise((resolve) => {
const xhr = new XMLHttpRequest() const xhr = new XMLHttpRequest();
xhr.onreadystatechange = () => { xhr.onreadystatechange = () => {
if (xhr.readyState === 4 && xhr.status === 200) { if (xhr.readyState === 4 && xhr.status === 200) {
this[variable] = xhr.responseText.replace(/@font-face{[^}]+}/, '') this[variable] = xhr.responseText.replace(/@font-face{[^}]+}/, '');
resolve() resolve();
} }
} };
xhr.open('GET', url) xhr.open('GET', url);
xhr.send() xhr.send();
}) });
}, },
getThemeCluster(theme) { getThemeCluster(theme) {
const tintColor = (color, tint) => { const tintColor = (color, tint) => {
let red = parseInt(color.slice(0, 2), 16) let red = parseInt(color.slice(0, 2), 16);
let green = parseInt(color.slice(2, 4), 16) let green = parseInt(color.slice(2, 4), 16);
let blue = parseInt(color.slice(4, 6), 16) let blue = parseInt(color.slice(4, 6), 16);
if (tint === 0) { // when primary color is in its rgb space if (tint === 0) {
return [red, green, blue].join(',') // when primary color is in its rgb space
return [red, green, blue].join(',');
} else { } else {
red += Math.round(tint * (255 - red)) red += Math.round(tint * (255 - red));
green += Math.round(tint * (255 - green)) green += Math.round(tint * (255 - green));
blue += Math.round(tint * (255 - blue)) blue += Math.round(tint * (255 - blue));
red = red.toString(16) red = red.toString(16);
green = green.toString(16) green = green.toString(16);
blue = blue.toString(16) blue = blue.toString(16);
return `#${red}${green}${blue}` return `#${red}${green}${blue}`;
}
} }
};
const shadeColor = (color, shade) => { const shadeColor = (color, shade) => {
let red = parseInt(color.slice(0, 2), 16) let red = parseInt(color.slice(0, 2), 16);
let green = parseInt(color.slice(2, 4), 16) let green = parseInt(color.slice(2, 4), 16);
let blue = parseInt(color.slice(4, 6), 16) let blue = parseInt(color.slice(4, 6), 16);
red = Math.round((1 - shade) * red) red = Math.round((1 - shade) * red);
green = Math.round((1 - shade) * green) green = Math.round((1 - shade) * green);
blue = Math.round((1 - shade) * blue) blue = Math.round((1 - shade) * blue);
red = red.toString(16) red = red.toString(16);
green = green.toString(16) green = green.toString(16);
blue = blue.toString(16) blue = blue.toString(16);
return `#${red}${green}${blue}` return `#${red}${green}${blue}`;
} };
const clusters = [theme] const clusters = [theme];
for (let i = 0; i <= 9; i++) { for (let i = 0; i <= 9; i++) {
clusters.push(tintColor(theme, Number((i / 10).toFixed(2)))) clusters.push(tintColor(theme, Number((i / 10).toFixed(2))));
}
clusters.push(shadeColor(theme, 0.1))
return clusters
} }
clusters.push(shadeColor(theme, 0.1));
return clusters;
} }
} }
};
</script> </script>
<style> <style>

60
src/components/TopNav/index.vue
View File

@@ -1,34 +1,23 @@
<template> <template>
<el-menu <el-menu :default-active="activeMenu" mode="horizontal" @select="handleSelect">
:default-active="activeMenu"
mode="horizontal"
@select="handleSelect"
>
<template v-for="(item, index) in topMenus"> <template v-for="(item, index) in topMenus">
<el-menu-item :style="{'--theme': theme}" :index="item.path" :key="index" v-if="index < visibleNumber" <el-menu-item v-if="index < visibleNumber" :key="index" :style="{'--theme': theme}" :index="item.path"><svg-icon :icon-class="item.meta.icon" />
><svg-icon :icon-class="item.meta.icon" /> {{ item.meta.title }}</el-menu-item>
{{ item.meta.title }}</el-menu-item
>
</template> </template>
<!-- 顶部菜单超出数量折叠 --> <!-- 顶部菜单超出数量折叠 -->
<el-submenu :style="{'--theme': theme}" index="more" v-if="topMenus.length > visibleNumber"> <el-submenu v-if="topMenus.length > visibleNumber" :style="{'--theme': theme}" index="more">
<template slot="title">更多菜单</template> <template slot="title">更多菜单</template>
<template v-for="(item, index) in topMenus"> <template v-for="(item, index) in topMenus">
<el-menu-item <el-menu-item v-if="index >= visibleNumber" :key="index" :index="item.path"><svg-icon :icon-class="item.meta.icon" />
:index="item.path" {{ item.meta.title }}</el-menu-item>
:key="index"
v-if="index >= visibleNumber"
><svg-icon :icon-class="item.meta.icon" />
{{ item.meta.title }}</el-menu-item
>
</template> </template>
</el-submenu> </el-submenu>
</el-menu> </el-menu>
</template> </template>
<script> <script>
import { constantRoutes } from "@/router"; import { constantRoutes } from '@/router';
// 隐藏侧边栏路由 // 隐藏侧边栏路由
const hideList = ['/index', '/user/profile']; const hideList = ['/index', '/user/profile'];
@@ -48,11 +37,11 @@ export default {
}, },
// 顶部显示菜单 // 顶部显示菜单
topMenus() { topMenus() {
let topMenus = []; const topMenus = [];
this.routers.map((menu) => { this.routers.map((menu) => {
if (menu.hidden !== true) { if (menu.hidden !== true) {
// 兼容顶部栏一级菜单内部跳转 // 兼容顶部栏一级菜单内部跳转
if (menu.path === "/") { if (menu.path === '/') {
topMenus.push(menu.children[0]); topMenus.push(menu.children[0]);
} else { } else {
topMenus.push(menu); topMenus.push(menu);
@@ -71,11 +60,11 @@ export default {
this.routers.map((router) => { this.routers.map((router) => {
for (var item in router.children) { for (var item in router.children) {
if (router.children[item].parentPath === undefined) { if (router.children[item].parentPath === undefined) {
if(router.path === "/") { if (router.path === '/') {
router.children[item].path = "/" + router.children[item].path; router.children[item].path = '/' + router.children[item].path;
} else { } else {
if (!this.ishttp(router.children[item].path)) { if (!this.ishttp(router.children[item].path)) {
router.children[item].path = router.path + "/" + router.children[item].path; router.children[item].path = router.path + '/' + router.children[item].path;
} }
} }
router.children[item].parentPath = router.path; router.children[item].parentPath = router.path;
@@ -89,9 +78,9 @@ export default {
activeMenu() { activeMenu() {
const path = this.$route.path; const path = this.$route.path;
let activePath = path; let activePath = path;
if (path !== undefined && path.lastIndexOf("/") > 0 && hideList.indexOf(path) === -1) { if (path !== undefined && path.lastIndexOf('/') > 0 && hideList.indexOf(path) === -1) {
const tmpPath = path.substring(1, path.length); const tmpPath = path.substring(1, path.length);
activePath = "/" + tmpPath.substring(0, tmpPath.indexOf("/")); activePath = '/' + tmpPath.substring(0, tmpPath.indexOf('/'));
this.$store.dispatch('app/toggleSideBarHide', false); this.$store.dispatch('app/toggleSideBarHide', false);
} else if (!this.$route.children) { } else if (!this.$route.children) {
activePath = path; activePath = path;
@@ -99,13 +88,13 @@ export default {
} }
this.activeRoutes(activePath); this.activeRoutes(activePath);
return activePath; return activePath;
}, }
}, },
beforeMount() { beforeMount() {
window.addEventListener('resize', this.setVisibleNumber) window.addEventListener('resize', this.setVisibleNumber);
}, },
beforeDestroy() { beforeDestroy() {
window.removeEventListener('resize', this.setVisibleNumber) window.removeEventListener('resize', this.setVisibleNumber);
}, },
mounted() { mounted() {
this.setVisibleNumber(); this.setVisibleNumber();
@@ -119,10 +108,10 @@ export default {
// 菜单选择事件 // 菜单选择事件
handleSelect(key, keyPath) { handleSelect(key, keyPath) {
this.currentIndex = key; this.currentIndex = key;
const route = this.routers.find(item => item.path === key); const route = this.routers.find((item) => item.path === key);
if (this.ishttp(key)) { if (this.ishttp(key)) {
// http(s):// 路径新窗口打开 // http(s):// 路径新窗口打开
window.open(key, "_blank"); window.open(key, '_blank');
} else if (!route || !route.children) { } else if (!route || !route.children) {
// 没有子路由路径内部打开 // 没有子路由路径内部打开
this.$router.push({ path: key }); this.$router.push({ path: key });
@@ -138,19 +127,19 @@ export default {
var routes = []; var routes = [];
if (this.childrenMenus && this.childrenMenus.length > 0) { if (this.childrenMenus && this.childrenMenus.length > 0) {
this.childrenMenus.map((item) => { this.childrenMenus.map((item) => {
if (key == item.parentPath || (key == "index" && "" == item.path)) { if (key == item.parentPath || (key == 'index' && item.path == '')) {
routes.push(item); routes.push(item);
} }
}); });
} }
if (routes.length > 0) { if (routes.length > 0) {
this.$store.commit("SET_SIDEBAR_ROUTERS", routes); this.$store.commit('SET_SIDEBAR_ROUTERS', routes);
} }
}, },
ishttp(url) { ishttp(url) {
return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1 return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1;
}
} }
},
}; };
</script> </script>
@@ -164,7 +153,8 @@ export default {
margin: 0 10px !important; margin: 0 10px !important;
} }
.topmenu-container.el-menu--horizontal > .el-menu-item.is-active, .el-menu--horizontal > .el-submenu.is-active .el-submenu__title { .topmenu-container.el-menu--horizontal > .el-menu-item.is-active,
.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {
border-bottom: 2px solid #{'var(--theme)'} !important; border-bottom: 2px solid #{'var(--theme)'} !important;
color: #303133; color: #303133;
} }

13
src/components/iFrame/index.vue
View File

@@ -1,11 +1,6 @@
<template> <template>
<div v-loading="loading" :style="'height:' + height"> <div v-loading="loading" :style="'height:' + height">
<iframe <iframe :src="src" frameborder="no" style="width: 100%; height: 100%" scrolling="auto" />
:src="src"
frameborder="no"
style="width: 100%; height: 100%"
scrolling="auto"
/>
</div> </div>
</template> </template>
<script> <script>
@@ -14,11 +9,11 @@ export default {
src: { src: {
type: String, type: String,
required: true required: true
}, }
}, },
data() { data() {
return { return {
height: document.documentElement.clientHeight - 94.5 + "px;", height: document.documentElement.clientHeight - 94.5 + 'px;',
loading: true, loading: true,
url: this.src url: this.src
}; };
@@ -29,7 +24,7 @@ export default {
}, 300); }, 300);
const that = this; const that = this;
window.onresize = function temp() { window.onresize = function temp() {
that.height = document.documentElement.clientHeight - 94.5 + "px;"; that.height = document.documentElement.clientHeight - 94.5 + 'px;';
}; };
} }
}; };

6
src/directive/click/throttle.js
View File

@@ -1,8 +1,8 @@
import { throttleTime } from "@/global/global"; import { throttleTime } from '@/global/global';
export default { export default {
inserted: function (el, binding) { inserted: function (el, binding) {
el.addEventListener("click", () => { el.addEventListener('click', () => {
if (!el.disabled) { if (!el.disabled) {
el.disabled = true; el.disabled = true;
@@ -11,5 +11,5 @@ export default {
}, binding.value || throttleTime); }, binding.value || throttleTime);
} }
}); });
}, }
}; };

13
src/directive/dialog/drag.js
View File

@@ -5,8 +5,8 @@
export default { export default {
bind(el, binding, vnode, oldVnode) { bind(el, binding, vnode, oldVnode) {
const value = binding.value const value = binding.value;
if (value == false) return if (!value) return;
// 获取拖拽内容头部 // 获取拖拽内容头部
const dialogHeaderEl = el.querySelector('.el-dialog__header'); const dialogHeaderEl = el.querySelector('.el-dialog__header');
const dragDom = el.querySelector('.el-dialog'); const dragDom = el.querySelector('.el-dialog');
@@ -38,7 +38,7 @@ export default {
} else { } else {
styL = +sty.left.replace(/\px/g, ''); styL = +sty.left.replace(/\px/g, '');
styT = +sty.top.replace(/\px/g, ''); styT = +sty.top.replace(/\px/g, '');
}; }
// 鼠标拖拽事件 // 鼠标拖拽事件
document.onmousemove = function (e) { document.onmousemove = function (e) {
@@ -46,19 +46,18 @@ export default {
const l = e.clientX - disX; const l = e.clientX - disX;
const t = e.clientY - disY; const t = e.clientY - disY;
let finallyL = l + styL const finallyL = l + styL;
let finallyT = t + styT const finallyT = t + styT;
// 移动当前元素 // 移动当前元素
dragDom.style.left = `${finallyL}px`; dragDom.style.left = `${finallyL}px`;
dragDom.style.top = `${finallyT}px`; dragDom.style.top = `${finallyT}px`;
}; };
document.onmouseup = function (e) { document.onmouseup = function (e) {
document.onmousemove = null; document.onmousemove = null;
document.onmouseup = null; document.onmouseup = null;
}; };
} };
} }
}; };

14
src/directive/dialog/dragHeight.js
View File

@@ -7,8 +7,10 @@ export default {
bind(el) { bind(el) {
const dragDom = el.querySelector('.el-dialog'); const dragDom = el.querySelector('.el-dialog');
const lineEl = document.createElement('div'); const lineEl = document.createElement('div');
lineEl.style = 'width: 6px; background: inherit; height: 10px; position: absolute; right: 0; bottom: 0; margin: auto; z-index: 1; cursor: nwse-resize;'; lineEl.style =
lineEl.addEventListener('mousedown', 'width: 6px; background: inherit; height: 10px; position: absolute; right: 0; bottom: 0; margin: auto; z-index: 1; cursor: nwse-resize;';
lineEl.addEventListener(
'mousedown',
function (e) { function (e) {
// 鼠标按下，计算当前元素距离可视区的距离 // 鼠标按下，计算当前元素距离可视区的距离
const disX = e.clientX - el.offsetLeft; const disX = e.clientX - el.offsetLeft;
@@ -20,7 +22,7 @@ export default {
e.preventDefault(); // 移动时禁用默认事件 e.preventDefault(); // 移动时禁用默认事件
// 通过事件委托，计算移动的距离 // 通过事件委托，计算移动的距离
const xl = e.clientX - disX; const xl = e.clientX - disX;
const yl = e.clientY - disY const yl = e.clientY - disY;
dragDom.style.width = `${curWidth + xl}px`; dragDom.style.width = `${curWidth + xl}px`;
dragDom.style.height = `${curHeight + yl}px`; dragDom.style.height = `${curHeight + yl}px`;
}; };
@@ -28,7 +30,9 @@ export default {
document.onmousemove = null; document.onmousemove = null;
document.onmouseup = null; document.onmouseup = null;
}; };
}, false); },
false
);
dragDom.appendChild(lineEl); dragDom.appendChild(lineEl);
} }
} };

12
src/directive/dialog/dragWidth.js
View File

@@ -7,8 +7,10 @@ export default {
bind(el) { bind(el) {
const dragDom = el.querySelector('.el-dialog'); const dragDom = el.querySelector('.el-dialog');
const lineEl = document.createElement('div'); const lineEl = document.createElement('div');
lineEl.style = 'width: 5px; background: inherit; height: 80%; position: absolute; right: 0; top: 0; bottom: 0; margin: auto; z-index: 1; cursor: w-resize;'; lineEl.style =
lineEl.addEventListener('mousedown', 'width: 5px; background: inherit; height: 80%; position: absolute; right: 0; top: 0; bottom: 0; margin: auto; z-index: 1; cursor: w-resize;';
lineEl.addEventListener(
'mousedown',
function (e) { function (e) {
// 鼠标按下，计算当前元素距离可视区的距离 // 鼠标按下，计算当前元素距离可视区的距离
const disX = e.clientX - el.offsetLeft; const disX = e.clientX - el.offsetLeft;
@@ -24,7 +26,9 @@ export default {
document.onmousemove = null; document.onmousemove = null;
document.onmouseup = null; document.onmouseup = null;
}; };
}, false); },
false
);
dragDom.appendChild(lineEl); dragDom.appendChild(lineEl);
} }
} };

40
src/directive/index.js
View File

@@ -1,28 +1,28 @@
import hasRole from "./permission/hasRole"; import hasRole from './permission/hasRole';
import hasPermi from "./permission/hasPermi"; import hasPermi from './permission/hasPermi';
import dialogDrag from "./dialog/drag"; import dialogDrag from './dialog/drag';
import dialogDragWidth from "./dialog/dragWidth"; import dialogDragWidth from './dialog/dragWidth';
import dialogDragHeight from "./dialog/dragHeight"; import dialogDragHeight from './dialog/dragHeight';
import clipboard from "./module/clipboard"; import clipboard from './module/clipboard';
import phone from "./input/phone"; import phone from './input/phone';
import trim from "./input/trim"; import trim from './input/trim';
import throttle from "./click/throttle"; import throttle from './click/throttle';
const install = function (Vue) { const install = function (Vue) {
Vue.directive("hasRole", hasRole); Vue.directive('hasRole', hasRole);
Vue.directive("hasPermi", hasPermi); Vue.directive('hasPermi', hasPermi);
Vue.directive("clipboard", clipboard); Vue.directive('clipboard', clipboard);
Vue.directive("dialogDrag", dialogDrag); Vue.directive('dialogDrag', dialogDrag);
Vue.directive("dialogDragWidth", dialogDragWidth); Vue.directive('dialogDragWidth', dialogDragWidth);
Vue.directive("dialogDragHeight", dialogDragHeight); Vue.directive('dialogDragHeight', dialogDragHeight);
Vue.directive("phone", phone); Vue.directive('phone', phone);
Vue.directive("jtrim", trim); // 禁止输入空格 Vue.directive('jtrim', trim); // 禁止输入空格
Vue.directive("jclick", throttle); // 节流只支持Button按钮 Vue.directive('jclick', throttle); // 节流只支持Button按钮
}; };
if (window.Vue) { if (window.Vue) {
window["hasRole"] = hasRole; window['hasRole'] = hasRole;
window["hasPermi"] = hasPermi; window['hasPermi'] = hasPermi;
Vue.use(install); // eslint-disable-line Vue.use(install); // eslint-disable-line
} }

19
src/directive/input/trim.js
View File

@@ -1,3 +1,4 @@
/* eslint-disable indent */
/* /*
* @Author: riverQiu * @Author: riverQiu
* @Date: 2022-11-04 * @Date: 2022-11-04
@@ -9,25 +10,27 @@
export default { export default {
inserted(el, bind, vnode, prevVnode) { inserted(el, bind, vnode, prevVnode) {
const input = const input =
el.nodeName.toLowerCase() === "input" el.nodeName.toLowerCase() === 'input'
? el ? el
: el.getElementsByTagName("input")[0] ? el.getElementsByTagName("input")[0] : el.getElementsByTagName("textarea")[0]; : el.getElementsByTagName('input')[0]
? el.getElementsByTagName('input')[0]
: el.getElementsByTagName('textarea')[0];
// 改变值过后，需要主动触发input时间，组件绑定的值才会改变 // 改变值过后，需要主动触发input时间，组件绑定的值才会改变
let triggerBySelf = false; let triggerBySelf = false;
if (input) { if (input) {
input.addEventListener("input", () => { input.addEventListener('input', () => {
if (triggerBySelf) { if (triggerBySelf) {
triggerBySelf = false; triggerBySelf = false;
return; return;
} }
let val = input.value.replace(/[ ]/g, ""); const val = input.value.replace(/[ ]/g, '');
if (val === "") { if (val === '') {
input.value = ""; input.value = '';
return; return;
} }
try { try {
// 改变值过后，需要主动触发input时间，组件绑定的值才会改变 // 改变值过后，需要主动触发input时间，组件绑定的值才会改变
const ev = new Event("input", { bubbles: true }); const ev = new Event('input', { bubbles: true });
input.value = val; input.value = val;
triggerBySelf = true; triggerBySelf = true;
input.dispatchEvent(ev); input.dispatchEvent(ev);
@@ -37,5 +40,5 @@ export default {
} }
}); });
} }
}, }
}; };

18
src/directive/module/clipboard.js
View File

@@ -3,7 +3,7 @@
* Copyright (c) 2021 ruoyi * Copyright (c) 2021 ruoyi
*/ */
import Clipboard from 'clipboard' import Clipboard from 'clipboard';
export default { export default {
bind(el, binding, vnode) { bind(el, binding, vnode) {
switch (binding.arg) { switch (binding.arg) {
@@ -16,13 +16,13 @@ export default {
default: { default: {
const clipboard = new Clipboard(el, { const clipboard = new Clipboard(el, {
text: () => binding.value, text: () => binding.value,
action: () => binding.arg === 'cut' ? 'cut' : 'copy' action: () => (binding.arg === 'cut' ? 'cut' : 'copy')
}); });
clipboard.on('success', e => { clipboard.on('success', (e) => {
const callback = el._vClipBoard_success; const callback = el._vClipBoard_success;
callback && callback(e); callback && callback(e);
}); });
clipboard.on('error', e => { clipboard.on('error', (e) => {
const callback = el._vClipBoard_error; const callback = el._vClipBoard_error;
callback && callback(e); callback && callback(e);
}); });
@@ -36,12 +36,14 @@ export default {
} else if (binding.arg === 'error') { } else if (binding.arg === 'error') {
el._vClipBoard_error = binding.value; el._vClipBoard_error = binding.value;
} else { } else {
el._vClipBoard.text = function () { return binding.value; }; el._vClipBoard.text = function () {
el._vClipBoard.action = () => binding.arg === 'cut' ? 'cut' : 'copy'; return binding.value;
};
el._vClipBoard.action = () => (binding.arg === 'cut' ? 'cut' : 'copy');
} }
}, },
unbind(el, binding) { unbind(el, binding) {
if (!el._vClipboard) return if (!el._vClipboard) return;
if (binding.arg === 'success') { if (binding.arg === 'success') {
delete el._vClipBoard_success; delete el._vClipBoard_success;
} else if (binding.arg === 'error') { } else if (binding.arg === 'error') {
@@ -51,4 +53,4 @@ export default {
delete el._vClipBoard; delete el._vClipBoard;
} }
} }
} };

22
src/directive/permission/hasPermi.js
View File

@@ -3,26 +3,26 @@
* Copyright (c) 2019 ruoyi * Copyright (c) 2019 ruoyi
*/ */
import store from '@/store' import store from '@/store';
export default { export default {
inserted(el, binding, vnode) { inserted(el, binding, vnode) {
const { value } = binding const { value } = binding;
const all_permission = "*:*:*"; const all_permission = '*:*:*';
const permissions = store.getters && store.getters.permissions const permissions = store.getters && store.getters.permissions;
if (value && value instanceof Array && value.length > 0) { if (value && value instanceof Array && value.length > 0) {
const permissionFlag = value const permissionFlag = value;
const hasPermissions = permissions.some(permission => { const hasPermissions = permissions.some((permission) => {
return all_permission === permission || permissionFlag.includes(permission) return all_permission === permission || permissionFlag.includes(permission);
}) });
if (!hasPermissions) { if (!hasPermissions) {
el.parentNode && el.parentNode.removeChild(el) el.parentNode && el.parentNode.removeChild(el);
} }
} else { } else {
throw new Error(`请设置操作权限标签值`) throw new Error(`请设置操作权限标签值`);
}
} }
} }
};

22
src/directive/permission/hasRole.js
View File

@@ -3,26 +3,26 @@
* Copyright (c) 2019 ruoyi * Copyright (c) 2019 ruoyi
*/ */
import store from '@/store' import store from '@/store';
export default { export default {
inserted(el, binding, vnode) { inserted(el, binding, vnode) {
const { value } = binding const { value } = binding;
const super_admin = "admin"; const super_admin = 'admin';
const roles = store.getters && store.getters.roles const roles = store.getters && store.getters.roles;
if (value && value instanceof Array && value.length > 0) { if (value && value instanceof Array && value.length > 0) {
const roleFlag = value const roleFlag = value;
const hasRole = roles.some(role => { const hasRole = roles.some((role) => {
return super_admin === role || roleFlag.includes(role) return super_admin === role || roleFlag.includes(role);
}) });
if (!hasRole) { if (!hasRole) {
el.parentNode && el.parentNode.removeChild(el) el.parentNode && el.parentNode.removeChild(el);
} }
} else { } else {
throw new Error(`请设置角色权限标签值"`) throw new Error(`请设置角色权限标签值"`);
}
} }
} }
};

34
src/global/components.js
View File

@@ -1,28 +1,28 @@
import Vue from "vue"; import Vue from 'vue';
// 分页组件 // 分页组件
import Pagination from "@/components/Pagination"; import Pagination from '@/components/Pagination';
// 自定义表格工具组件 // 自定义表格工具组件
import RightToolbar from "@/components/RightToolbar"; import RightToolbar from '@/components/RightToolbar';
// 富文本组件 // 富文本组件
import Editor from "@/components/Editor"; import Editor from '@/components/Editor';
// 文件上传组件 // 文件上传组件
import FileUpload from "@/components/FileUpload"; import FileUpload from '@/components/FileUpload';
// 图片上传组件 // 图片上传组件
import ImageUpload from "@/components/ImageUpload"; import ImageUpload from '@/components/ImageUpload';
// 图片预览组件 // 图片预览组件
import ImagePreview from "@/components/ImagePreview"; import ImagePreview from '@/components/ImagePreview';
// 字典标签组件 // 字典标签组件
import DictTag from "@/components/DictTag"; import DictTag from '@/components/DictTag';
// 字典数据组件 // 字典数据组件
import DictData from '@/components/DictData' import DictData from '@/components/DictData';
// 全局组件挂载 // 全局组件挂载
Vue.component("DictTag", DictTag); Vue.component('DictTag', DictTag);
Vue.component("Pagination", Pagination); Vue.component('Pagination', Pagination);
Vue.component("RightToolbar", RightToolbar); Vue.component('RightToolbar', RightToolbar);
Vue.component("Editor", Editor); Vue.component('Editor', Editor);
Vue.component("FileUpload", FileUpload); Vue.component('FileUpload', FileUpload);
Vue.component("ImageUpload", ImageUpload); Vue.component('ImageUpload', ImageUpload);
Vue.component("ImagePreview", ImagePreview); Vue.component('ImagePreview', ImagePreview);
DictData.install() DictData.install();

11
src/global/func.js
View File

@@ -1,8 +1,9 @@
import Vue from "vue"; import Vue from 'vue';
import { parseTime, resetForm, handleTree } from "@/utils/ruoyi"; import { parseTime, resetForm, handleTree, addDateRange } from '@/utils/ruoyi';
import { deepClone } from "@/utils/index"; import { deepClone } from '@/utils/index';
import { download } from "@/utils/request"; import { download } from '@/utils/request';
import { getConfigKey } from '@/api/system/config';
// 全局方法挂载 // 全局方法挂载
Vue.prototype.parseTime = parseTime; Vue.prototype.parseTime = parseTime;
@@ -10,3 +11,5 @@ Vue.prototype.resetForm = resetForm;
Vue.prototype.download = download; Vue.prototype.download = download;
Vue.prototype.handleTree = handleTree; Vue.prototype.handleTree = handleTree;
Vue.prototype.deepClone = deepClone; Vue.prototype.deepClone = deepClone;
Vue.prototype.addDateRange = addDateRange;
Vue.prototype.getConfigKey = getConfigKey;

2
src/global/global.js
View File

@@ -13,5 +13,5 @@ Vue.prototype.$global = {
clientHeight: document.body.clientHeight, clientHeight: document.body.clientHeight,
defaultPageSize: 10, defaultPageSize: 10,
successCode: successCode, successCode: successCode,
STORAGE_KEY: 'jslx' STORAGE_KEY: 'duima'
}; };

8
src/global/index.js
View File

@@ -1,4 +1,4 @@
import "./global"; import './global';
import "./element"; import './element';
import "./components"; import './components';
import "./func"; import './func';

14
src/layout/components/IframeToggle/index.vue
View File

@@ -1,24 +1,18 @@
<template> <template>
<transition-group name="fade-transform" mode="out-in"> <transition-group name="fade-transform" mode="out-in">
<inner-link <inner-link v-for="(item, index) in iframeViews" v-show="$route.path === item.path" :key="item.path" :iframe-id="'iframe' + index" :src="item.meta.link" />
v-for="(item, index) in iframeViews"
:key="item.path"
:iframeId="'iframe' + index"
v-show="$route.path === item.path"
:src="item.meta.link"
></inner-link>
</transition-group> </transition-group>
</template> </template>
<script> <script>
import InnerLink from "../InnerLink/index" import InnerLink from '../InnerLink/index';
export default { export default {
components: { InnerLink }, components: { InnerLink },
computed: { computed: {
iframeViews() { iframeViews() {
return this.$store.state.tagsView.iframeViews return this.$store.state.tagsView.iframeViews;
}
} }
} }
};
</script> </script>

20
src/layout/components/InnerLink/index.vue
View File

@@ -1,11 +1,6 @@
<template> <template>
<div :style="'height:' + height" v-loading="loading" element-loading-text="正在加载页面，请稍候！"> <div v-loading="loading" :style="'height:' + height" element-loading-text="正在加载页面，请稍候！">
<iframe <iframe :id="iframeId" style="width: 100%; height: 100%" :src="src" frameborder="no" />
:id="iframeId"
style="width: 100%; height: 100%"
:src="src"
frameborder="no"
></iframe>
</div> </div>
</template> </template>
@@ -14,26 +9,27 @@ export default {
props: { props: {
src: { src: {
type: String, type: String,
default: "/" default: '/'
}, },
iframeId: { iframeId: {
type: String type: String,
default: ''
} }
}, },
data() { data() {
return { return {
loading: false, loading: false,
height: document.documentElement.clientHeight - 94.5 + "px;" height: document.documentElement.clientHeight - 94.5 + 'px;'
}; };
}, },
mounted() { mounted() {
var _this = this; var _this = this;
const iframeId = ("#" + this.iframeId).replace(/\//g, "\\/"); const iframeId = ('#' + this.iframeId).replace(/\//g, '\\/');
const iframe = document.querySelector(iframeId); const iframe = document.querySelector(iframeId);
// iframe页面loading控制 // iframe页面loading控制
if (iframe.attachEvent) { if (iframe.attachEvent) {
this.loading = true; this.loading = true;
iframe.attachEvent("onload", function () { iframe.attachEvent('onload', function () {
_this.loading = false; _this.loading = false;
}); });
} else { } else {

2
src/layout/components/Navbar.vue
View File

@@ -8,7 +8,7 @@
<div class="right-menu"> <div class="right-menu">
<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click"> <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
<div class="avatar-wrapper"> <div class="avatar-wrapper">
<img :src="avatar" class="user-avatar" /> <img :src="avatar" class="user-avatar">
<i class="el-icon-caret-bottom" /> <i class="el-icon-caret-bottom" />
</div> </div>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">

54
src/layout/components/Settings/index.vue
View File

@@ -74,7 +74,7 @@
</template> </template>
<script> <script>
import ThemePicker from '@/components/ThemePicker' import ThemePicker from '@/components/ThemePicker';
export default { export default {
components: { ThemePicker }, components: { ThemePicker },
@@ -87,88 +87,88 @@ export default {
computed: { computed: {
visible: { visible: {
get() { get() {
return this.$store.state.settings.showSettings return this.$store.state.settings.showSettings;
} }
}, },
fixedHeader: { fixedHeader: {
get() { get() {
return this.$store.state.settings.fixedHeader return this.$store.state.settings.fixedHeader;
}, },
set(val) { set(val) {
this.$store.dispatch('settings/changeSetting', { this.$store.dispatch('settings/changeSetting', {
key: 'fixedHeader', key: 'fixedHeader',
value: val value: val
}) });
} }
}, },
topNav: { topNav: {
get() { get() {
return this.$store.state.settings.topNav return this.$store.state.settings.topNav;
}, },
set(val) { set(val) {
this.$store.dispatch('settings/changeSetting', { this.$store.dispatch('settings/changeSetting', {
key: 'topNav', key: 'topNav',
value: val value: val
}) });
if (!val) { if (!val) {
this.$store.dispatch('app/toggleSideBarHide', false); this.$store.dispatch('app/toggleSideBarHide', false);
this.$store.commit("SET_SIDEBAR_ROUTERS", this.$store.state.permission.defaultRoutes); this.$store.commit('SET_SIDEBAR_ROUTERS', this.$store.state.permission.defaultRoutes);
} }
} }
}, },
tagsView: { tagsView: {
get() { get() {
return this.$store.state.settings.tagsView return this.$store.state.settings.tagsView;
}, },
set(val) { set(val) {
this.$store.dispatch('settings/changeSetting', { this.$store.dispatch('settings/changeSetting', {
key: 'tagsView', key: 'tagsView',
value: val value: val
}) });
} }
}, },
sidebarLogo: { sidebarLogo: {
get() { get() {
return this.$store.state.settings.sidebarLogo return this.$store.state.settings.sidebarLogo;
}, },
set(val) { set(val) {
this.$store.dispatch('settings/changeSetting', { this.$store.dispatch('settings/changeSetting', {
key: 'sidebarLogo', key: 'sidebarLogo',
value: val value: val
}) });
} }
}, },
dynamicTitle: { dynamicTitle: {
get() { get() {
return this.$store.state.settings.dynamicTitle return this.$store.state.settings.dynamicTitle;
}, },
set(val) { set(val) {
this.$store.dispatch('settings/changeSetting', { this.$store.dispatch('settings/changeSetting', {
key: 'dynamicTitle', key: 'dynamicTitle',
value: val value: val
}) });
}
} }
},
}, },
methods: { methods: {
themeChange(val) { themeChange(val) {
this.$store.dispatch('settings/changeSetting', { this.$store.dispatch('settings/changeSetting', {
key: 'theme', key: 'theme',
value: val value: val
}) });
this.theme = val; this.theme = val;
}, },
handleTheme(val) { handleTheme(val) {
this.$store.dispatch('settings/changeSetting', { this.$store.dispatch('settings/changeSetting', {
key: 'sideTheme', key: 'sideTheme',
value: val value: val
}) });
this.sideTheme = val; this.sideTheme = val;
}, },
saveSetting() { saveSetting() {
this.$modal.loading("正在保存到本地，请稍候..."); this.$modal.loading('正在保存到本地，请稍候...');
this.$cache.local.set( this.$cache.local.set(
"layout-setting", 'layout-setting',
`{ `{
"topNav":${this.topNav}, "topNav":${this.topNav},
"tagsView":${this.tagsView}, "tagsView":${this.tagsView},
@@ -179,22 +179,22 @@ export default {
"theme":"${this.theme}" "theme":"${this.theme}"
}` }`
); );
setTimeout(this.$modal.closeLoading(), 1000) setTimeout(this.$modal.closeLoading(), 1000);
}, },
resetSetting() { resetSetting() {
this.$modal.loading("正在清除设置缓存并刷新，请稍候..."); this.$modal.loading('正在清除设置缓存并刷新，请稍候...');
this.$cache.local.remove("layout-setting") this.$cache.local.remove('layout-setting');
setTimeout("window.location.reload()", 1000) // setTimeout('window.location.reload()', 1000);
}
} }
} }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.setting-drawer-content { .setting-drawer-content {
.setting-drawer-title { .setting-drawer-title {
margin-bottom: 12px; margin-bottom: 12px;
color: rgba(0, 0, 0, .85); color: rgba(0, 0, 0, 0.85);
font-size: 14px; font-size: 14px;
line-height: 22px; line-height: 22px;
font-weight: bold; font-weight: bold;
@@ -242,19 +242,19 @@ export default {
.drawer-title { .drawer-title {
margin-bottom: 12px; margin-bottom: 12px;
color: rgba(0, 0, 0, .85); color: rgba(0, 0, 0, 0.85);
font-size: 14px; font-size: 14px;
line-height: 22px; line-height: 22px;
} }
.drawer-item { .drawer-item {
color: rgba(0, 0, 0, .65); color: rgba(0, 0, 0, 0.65);
font-size: 14px; font-size: 14px;
padding: 12px 0; padding: 12px 0;
} }
.drawer-switch { .drawer-switch {
float: right float: right;
} }
} }
</style> </style>

16
src/layout/components/Sidebar/FixiOSBug.js
View File

@@ -1,25 +1,25 @@
export default { export default {
computed: { computed: {
device() { device() {
return this.$store.state.app.device return this.$store.state.app.device;
} }
}, },
mounted() { mounted() {
// In order to fix the click on menu on the ios device will trigger the mouseleave bug // In order to fix the click on menu on the ios device will trigger the mouseleave bug
this.fixBugIniOS() this.fixBugIniOS();
}, },
methods: { methods: {
fixBugIniOS() { fixBugIniOS() {
const $subMenu = this.$refs.subMenu const $subMenu = this.$refs.subMenu;
if ($subMenu) { if ($subMenu) {
const handleMouseleave = $subMenu.handleMouseleave const handleMouseleave = $subMenu.handleMouseleave;
$subMenu.handleMouseleave = (e) => { $subMenu.handleMouseleave = (e) => {
if (this.device === 'mobile') { if (this.device === 'mobile') {
return return;
}
handleMouseleave(e)
}
} }
handleMouseleave(e);
};
} }
} }
} }
};

19
src/layout/components/Sidebar/Item.vue
View File

@@ -1,3 +1,4 @@
<!-- eslint-disable jsx-quotes -->
<script> <script>
export default { export default {
name: 'MenuItem', name: 'MenuItem',
@@ -13,21 +14,25 @@ export default {
} }
}, },
render(h, context) { render(h, context) {
const { icon, title } = context.props const { icon, title } = context.props;
const vnodes = [] const vnodes = [];
if (icon) { if (icon) {
vnodes.push(<svg-icon icon-class={icon}/>) vnodes.push(<svg-icon icon-class={icon} />);
} }
if (title) { if (title) {
if (title.length > 5) { if (title.length > 5) {
vnodes.push(<span slot='title' title={(title)}>{(title)}</span>) vnodes.push(
<span slot="title" title={title}>
{title}
</span>
);
} else { } else {
vnodes.push(<span slot='title'>{(title)}</span>) vnodes.push(<span slot="title">{title}</span>);
} }
} }
return vnodes return vnodes;
}
} }
};
</script> </script>

14
src/layout/components/Sidebar/Link.vue
View File

@@ -5,7 +5,7 @@
</template> </template>
<script> <script>
import { isExternal } from '@/utils/validate' import { isExternal } from '@/utils/validate';
export default { export default {
props: { props: {
@@ -16,13 +16,13 @@ export default {
}, },
computed: { computed: {
isExternal() { isExternal() {
return isExternal(this.to) return isExternal(this.to);
}, },
type() { type() {
if (this.isExternal) { if (this.isExternal) {
return 'a' return 'a';
} }
return 'router-link' return 'router-link';
} }
}, },
methods: { methods: {
@@ -32,12 +32,12 @@ export default {
href: to, href: to,
target: '_blank', target: '_blank',
rel: 'noopener' rel: 'noopener'
} };
} }
return { return {
to: to to: to
};
} }
} }
} };
}
</script> </script>

53
src/layout/components/Sidebar/SidebarItem.vue
View File

@@ -12,24 +12,17 @@
<template slot="title"> <template slot="title">
<item v-if="item.meta" :icon="item.meta && item.meta.icon" :title="item.meta.title" /> <item v-if="item.meta" :icon="item.meta && item.meta.icon" :title="item.meta.title" />
</template> </template>
<sidebar-item <sidebar-item v-for="child in item.children" :key="child.path" :is-nest="true" :item="child" :base-path="resolvePath(child.path)" class="nest-menu" />
v-for="child in item.children"
:key="child.path"
:is-nest="true"
:item="child"
:base-path="resolvePath(child.path)"
class="nest-menu"
/>
</el-submenu> </el-submenu>
</div> </div>
</template> </template>
<script> <script>
import path from 'path' import path from 'path';
import { isExternal } from '@/utils/validate' import { isExternal } from '@/utils/validate';
import Item from './Item' import Item from './Item';
import AppLink from './Link' import AppLink from './Link';
import FixiOSBug from './FixiOSBug' import FixiOSBug from './FixiOSBug';
export default { export default {
name: 'SidebarItem', name: 'SidebarItem',
@@ -51,50 +44,50 @@ export default {
} }
}, },
data() { data() {
this.onlyOneChild = null this.onlyOneChild = null;
return {} return {};
}, },
methods: { methods: {
hasOneShowingChild(children = [], parent) { hasOneShowingChild(children = [], parent) {
if (!children) { if (!children) {
children = []; children = [];
} }
const showingChildren = children.filter(item => { const showingChildren = children.filter((item) => {
if (item.hidden) { if (item.hidden) {
return false return false;
} else { } else {
// Temp set(will be used if only has one showing child) // Temp set(will be used if only has one showing child)
this.onlyOneChild = item this.onlyOneChild = item;
return true return true;
} }
}) });
// When there is only one child router, the child router is displayed by default // When there is only one child router, the child router is displayed by default
if (showingChildren.length === 1) { if (showingChildren.length === 1) {
return true return true;
} }
// Show parent if there are no child router to display // Show parent if there are no child router to display
if (showingChildren.length === 0) { if (showingChildren.length === 0) {
this.onlyOneChild = { ... parent, path: '', noShowingChildren: true } this.onlyOneChild = { ...parent, path: '', noShowingChildren: true };
return true return true;
} }
return false return false;
}, },
resolvePath(routePath, routeQuery) { resolvePath(routePath, routeQuery) {
if (isExternal(routePath)) { if (isExternal(routePath)) {
return routePath return routePath;
} }
if (isExternal(this.basePath)) { if (isExternal(this.basePath)) {
return this.basePath return this.basePath;
} }
if (routeQuery) { if (routeQuery) {
let query = JSON.parse(routeQuery); const query = JSON.parse(routeQuery);
return { path: path.resolve(this.basePath, routePath), query: query } return { path: path.resolve(this.basePath, routePath), query: query };
}
return path.resolve(this.basePath, routePath)
} }
return path.resolve(this.basePath, routePath);
} }
} }
};
</script> </script>

30
src/layout/components/Sidebar/index.vue
View File

@@ -2,38 +2,24 @@
<div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }"> <div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
<logo v-if="showLogo" :collapse="isCollapse" /> <logo v-if="showLogo" :collapse="isCollapse" />
<el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper"> <el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper">
<el-menu <el-menu :default-active="activeMenu" :collapse="isCollapse" :background-color="settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground" :text-color="settings.sideTheme === 'theme-dark' ? variables.menuColor : variables.menuLightColor" :unique-opened="true" :active-text-color="settings.theme" :collapse-transition="false" mode="vertical">
:default-active="activeMenu" <sidebar-item v-for="(route, index) in sidebarRouters" :key="route.path + index" :item="route" :base-path="route.path" />
:collapse="isCollapse"
:background-color="settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground"
:text-color="settings.sideTheme === 'theme-dark' ? variables.menuColor : variables.menuLightColor"
:unique-opened="true"
:active-text-color="settings.theme"
:collapse-transition="false"
mode="vertical"
>
<sidebar-item
v-for="(route, index) in sidebarRouters"
:key="route.path + index"
:item="route"
:base-path="route.path"
/>
</el-menu> </el-menu>
</el-scrollbar> </el-scrollbar>
</div> </div>
</template> </template>
<script> <script>
import { mapGetters, mapState } from "vuex"; import { mapGetters, mapState } from 'vuex';
import Logo from "./Logo"; import Logo from './Logo';
import SidebarItem from "./SidebarItem"; import SidebarItem from './SidebarItem';
import variables from "@/assets/styles/variables.scss"; import variables from '@/assets/styles/variables.scss';
export default { export default {
components: { SidebarItem, Logo }, components: { SidebarItem, Logo },
computed: { computed: {
...mapState(["settings"]), ...mapState(['settings']),
...mapGetters(["sidebarRouters", "sidebar"]), ...mapGetters(['sidebarRouters', 'sidebar']),
activeMenu() { activeMenu() {
const route = this.$route; const route = this.$route;
const { meta, path } = route; const { meta, path } = route;

54
src/layout/components/TagsView/ScrollPane.vue
View File

@@ -5,75 +5,75 @@
</template> </template>
<script> <script>
const tagAndTagSpacing = 4 // tagAndTagSpacing const tagAndTagSpacing = 4; // tagAndTagSpacing
export default { export default {
name: 'ScrollPane', name: 'ScrollPane',
data() { data() {
return { return {
left: 0 left: 0
} };
}, },
computed: { computed: {
scrollWrapper() { scrollWrapper() {
return this.$refs.scrollContainer.$refs.wrap return this.$refs.scrollContainer.$refs.wrap;
} }
}, },
mounted() { mounted() {
this.scrollWrapper.addEventListener('scroll', this.emitScroll, true) this.scrollWrapper.addEventListener('scroll', this.emitScroll, true);
}, },
beforeDestroy() { beforeDestroy() {
this.scrollWrapper.removeEventListener('scroll', this.emitScroll) this.scrollWrapper.removeEventListener('scroll', this.emitScroll);
}, },
methods: { methods: {
handleScroll(e) { handleScroll(e) {
const eventDelta = e.wheelDelta || -e.deltaY * 40 const eventDelta = e.wheelDelta || -e.deltaY * 40;
const $scrollWrapper = this.scrollWrapper const $scrollWrapper = this.scrollWrapper;
$scrollWrapper.scrollLeft = $scrollWrapper.scrollLeft + eventDelta / 4 $scrollWrapper.scrollLeft = $scrollWrapper.scrollLeft + eventDelta / 4;
}, },
emitScroll() { emitScroll() {
this.$emit('scroll') this.$emit('scroll');
}, },
moveToTarget(currentTag) { moveToTarget(currentTag) {
const $container = this.$refs.scrollContainer.$el const $container = this.$refs.scrollContainer.$el;
const $containerWidth = $container.offsetWidth const $containerWidth = $container.offsetWidth;
const $scrollWrapper = this.scrollWrapper const $scrollWrapper = this.scrollWrapper;
const tagList = this.$parent.$refs.tag const tagList = this.$parent.$refs.tag;
let firstTag = null let firstTag = null;
let lastTag = null let lastTag = null;
// find first tag and last tag // find first tag and last tag
if (tagList.length > 0) { if (tagList.length > 0) {
firstTag = tagList[0] firstTag = tagList[0];
lastTag = tagList[tagList.length - 1] lastTag = tagList[tagList.length - 1];
} }
if (firstTag === currentTag) { if (firstTag === currentTag) {
$scrollWrapper.scrollLeft = 0 $scrollWrapper.scrollLeft = 0;
} else if (lastTag === currentTag) { } else if (lastTag === currentTag) {
$scrollWrapper.scrollLeft = $scrollWrapper.scrollWidth - $containerWidth $scrollWrapper.scrollLeft = $scrollWrapper.scrollWidth - $containerWidth;
} else { } else {
// find preTag and nextTag // find preTag and nextTag
const currentIndex = tagList.findIndex(item => item === currentTag) const currentIndex = tagList.findIndex((item) => item === currentTag);
const prevTag = tagList[currentIndex - 1] const prevTag = tagList[currentIndex - 1];
const nextTag = tagList[currentIndex + 1] const nextTag = tagList[currentIndex + 1];
// the tag's offsetLeft after of nextTag // the tag's offsetLeft after of nextTag
const afterNextTagOffsetLeft = nextTag.$el.offsetLeft + nextTag.$el.offsetWidth + tagAndTagSpacing const afterNextTagOffsetLeft = nextTag.$el.offsetLeft + nextTag.$el.offsetWidth + tagAndTagSpacing;
// the tag's offsetLeft before of prevTag // the tag's offsetLeft before of prevTag
const beforePrevTagOffsetLeft = prevTag.$el.offsetLeft - tagAndTagSpacing const beforePrevTagOffsetLeft = prevTag.$el.offsetLeft - tagAndTagSpacing;
if (afterNextTagOffsetLeft > $scrollWrapper.scrollLeft + $containerWidth) { if (afterNextTagOffsetLeft > $scrollWrapper.scrollLeft + $containerWidth) {
$scrollWrapper.scrollLeft = afterNextTagOffsetLeft - $containerWidth $scrollWrapper.scrollLeft = afterNextTagOffsetLeft - $containerWidth;
} else if (beforePrevTagOffsetLeft < $scrollWrapper.scrollLeft) { } else if (beforePrevTagOffsetLeft < $scrollWrapper.scrollLeft) {
$scrollWrapper.scrollLeft = beforePrevTagOffsetLeft $scrollWrapper.scrollLeft = beforePrevTagOffsetLeft;
}
} }
} }
} }
} }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

177
src/layout/components/TagsView/index.vue
View File

@@ -1,36 +1,25 @@
<template> <template>
<div id="tags-view-container" class="tags-view-container"> <div id="tags-view-container" class="tags-view-container">
<scroll-pane ref="scrollPane" class="tags-view-wrapper" @scroll="handleScroll"> <scroll-pane ref="scrollPane" class="tags-view-wrapper" @scroll="handleScroll">
<router-link <router-link v-for="tag in visitedViews" ref="tag" :key="tag.path" :class="isActive(tag)?'active':''" :to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }" tag="span" class="tags-view-item" :style="activeStyle(tag)" @click.middle.native="!isAffix(tag)?closeSelectedTag(tag):''" @contextmenu.prevent.native="openMenu(tag,$event)">
v-for="tag in visitedViews"
ref="tag"
:key="tag.path"
:class="isActive(tag)?'active':''"
:to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }"
tag="span"
class="tags-view-item"
:style="activeStyle(tag)"
@click.middle.native="!isAffix(tag)?closeSelectedTag(tag):''"
@contextmenu.prevent.native="openMenu(tag,$event)"
>
{{ tag.title }} {{ tag.title }}
<span v-if="!isAffix(tag)" class="el-icon-close" @click.prevent.stop="closeSelectedTag(tag)" /> <span v-if="!isAffix(tag)" class="el-icon-close" @click.prevent.stop="closeSelectedTag(tag)" />
</router-link> </router-link>
</scroll-pane> </scroll-pane>
<ul v-show="visible" :style="{left:left+'px',top:top+'px'}" class="contextmenu"> <ul v-show="visible" :style="{left:left+'px',top:top+'px'}" class="contextmenu">
<li @click="refreshSelectedTag(selectedTag)"><i class="el-icon-refresh-right"></i> 刷新页面</li> <li @click="refreshSelectedTag(selectedTag)"><i class="el-icon-refresh-right" /> 刷新页面</li>
<li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)"><i class="el-icon-close"></i> 关闭当前</li> <li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)"><i class="el-icon-close" /> 关闭当前</li>
<li @click="closeOthersTags"><i class="el-icon-circle-close"></i> 关闭其他</li> <li @click="closeOthersTags"><i class="el-icon-circle-close" /> 关闭其他</li>
<li v-if="!isFirstView()" @click="closeLeftTags"><i class="el-icon-back"></i> 关闭左侧</li> <li v-if="!isFirstView()" @click="closeLeftTags"><i class="el-icon-back" /> 关闭左侧</li>
<li v-if="!isLastView()" @click="closeRightTags"><i class="el-icon-right"></i> 关闭右侧</li> <li v-if="!isLastView()" @click="closeRightTags"><i class="el-icon-right" /> 关闭右侧</li>
<li @click="closeAllTags(selectedTag)"><i class="el-icon-circle-close"></i> 全部关闭</li> <li @click="closeAllTags(selectedTag)"><i class="el-icon-circle-close" /> 全部关闭</li>
</ul> </ul>
</div> </div>
</template> </template>
<script> <script>
import ScrollPane from './ScrollPane' import ScrollPane from './ScrollPane';
import path from 'path' import path from 'path';
export default { export default {
components: { ScrollPane }, components: { ScrollPane },
@@ -41,14 +30,14 @@ export default {
left: 0, left: 0,
selectedTag: {}, selectedTag: {},
affixTags: [] affixTags: []
} };
}, },
computed: { computed: {
visitedViews() { visitedViews() {
return this.$store.state.tagsView.visitedViews return this.$store.state.tagsView.visitedViews;
}, },
routes() { routes() {
return this.$store.state.permission.routes return this.$store.state.permission.routes;
}, },
theme() { theme() {
return this.$store.state.settings.theme; return this.$store.state.settings.theme;
@@ -56,185 +45,185 @@ export default {
}, },
watch: { watch: {
$route() { $route() {
this.addTags() this.addTags();
this.moveToCurrentTag() this.moveToCurrentTag();
}, },
visible(value) { visible(value) {
if (value) { if (value) {
document.body.addEventListener('click', this.closeMenu) document.body.addEventListener('click', this.closeMenu);
} else { } else {
document.body.removeEventListener('click', this.closeMenu) document.body.removeEventListener('click', this.closeMenu);
} }
} }
}, },
mounted() { mounted() {
this.initTags() this.initTags();
this.addTags() this.addTags();
}, },
methods: { methods: {
isActive(route) { isActive(route) {
return route.path === this.$route.path return route.path === this.$route.path;
}, },
activeStyle(tag) { activeStyle(tag) {
if (!this.isActive(tag)) return {}; if (!this.isActive(tag)) return {};
return { return {
"background-color": this.theme, 'background-color': this.theme,
"border-color": this.theme 'border-color': this.theme
}; };
}, },
isAffix(tag) { isAffix(tag) {
return tag.meta && tag.meta.affix return tag.meta && tag.meta.affix;
}, },
isFirstView() { isFirstView() {
try { try {
return this.selectedTag.fullPath === this.visitedViews[1].fullPath || this.selectedTag.fullPath === '/index' return this.selectedTag.fullPath === this.visitedViews[1].fullPath || this.selectedTag.fullPath === '/index';
} catch (err) { } catch (err) {
return false return false;
} }
}, },
isLastView() { isLastView() {
try { try {
return this.selectedTag.fullPath === this.visitedViews[this.visitedViews.length - 1].fullPath return this.selectedTag.fullPath === this.visitedViews[this.visitedViews.length - 1].fullPath;
} catch (err) { } catch (err) {
return false return false;
} }
}, },
filterAffixTags(routes, basePath = '/') { filterAffixTags(routes, basePath = '/') {
let tags = [] let tags = [];
routes.forEach(route => { routes.forEach((route) => {
if (route.meta && route.meta.affix) { if (route.meta && route.meta.affix) {
const tagPath = path.resolve(basePath, route.path) const tagPath = path.resolve(basePath, route.path);
tags.push({ tags.push({
fullPath: tagPath, fullPath: tagPath,
path: tagPath, path: tagPath,
name: route.name, name: route.name,
meta: { ...route.meta } meta: { ...route.meta }
}) });
} }
if (route.children) { if (route.children) {
const tempTags = this.filterAffixTags(route.children, route.path) const tempTags = this.filterAffixTags(route.children, route.path);
if (tempTags.length >= 1) { if (tempTags.length >= 1) {
tags = [...tags, ...tempTags] tags = [...tags, ...tempTags];
} }
} }
}) });
return tags return tags;
}, },
initTags() { initTags() {
const affixTags = this.affixTags = this.filterAffixTags(this.routes) const affixTags = (this.affixTags = this.filterAffixTags(this.routes));
for (const tag of affixTags) { for (const tag of affixTags) {
// Must have tag name // Must have tag name
if (tag.name) { if (tag.name) {
this.$store.dispatch('tagsView/addVisitedView', tag) this.$store.dispatch('tagsView/addVisitedView', tag);
} }
} }
}, },
addTags() { addTags() {
const { name } = this.$route const { name } = this.$route;
if (name) { if (name) {
this.$store.dispatch('tagsView/addView', this.$route) this.$store.dispatch('tagsView/addView', this.$route);
if (this.$route.meta.link) { if (this.$route.meta.link) {
this.$store.dispatch('tagsView/addIframeView', this.$route) this.$store.dispatch('tagsView/addIframeView', this.$route);
} }
} }
return false return false;
}, },
moveToCurrentTag() { moveToCurrentTag() {
const tags = this.$refs.tag const tags = this.$refs.tag;
this.$nextTick(() => { this.$nextTick(() => {
for (const tag of tags) { for (const tag of tags) {
if (tag.to.path === this.$route.path) { if (tag.to.path === this.$route.path) {
this.$refs.scrollPane.moveToTarget(tag) this.$refs.scrollPane.moveToTarget(tag);
// when query is different then update // when query is different then update
if (tag.to.fullPath !== this.$route.fullPath) { if (tag.to.fullPath !== this.$route.fullPath) {
this.$store.dispatch('tagsView/updateVisitedView', this.$route) this.$store.dispatch('tagsView/updateVisitedView', this.$route);
} }
break break;
} }
} }
}) });
}, },
refreshSelectedTag(view) { refreshSelectedTag(view) {
this.$tab.refreshPage(view); this.$tab.refreshPage(view);
if (this.$route.meta.link) { if (this.$route.meta.link) {
this.$store.dispatch('tagsView/delIframeView', this.$route) this.$store.dispatch('tagsView/delIframeView', this.$route);
} }
}, },
closeSelectedTag(view) { closeSelectedTag(view) {
this.$tab.closePage(view).then(({ visitedViews }) => { this.$tab.closePage(view).then(({ visitedViews }) => {
if (this.isActive(view)) { if (this.isActive(view)) {
this.toLastView(visitedViews, view) this.toLastView(visitedViews, view);
} }
}) });
}, },
closeRightTags() { closeRightTags() {
this.$tab.closeRightPage(this.selectedTag).then(visitedViews => { this.$tab.closeRightPage(this.selectedTag).then((visitedViews) => {
if (!visitedViews.find(i => i.fullPath === this.$route.fullPath)) { if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {
this.toLastView(visitedViews) this.toLastView(visitedViews);
} }
}) });
}, },
closeLeftTags() { closeLeftTags() {
this.$tab.closeLeftPage(this.selectedTag).then(visitedViews => { this.$tab.closeLeftPage(this.selectedTag).then((visitedViews) => {
if (!visitedViews.find(i => i.fullPath === this.$route.fullPath)) { if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {
this.toLastView(visitedViews) this.toLastView(visitedViews);
} }
}) });
}, },
closeOthersTags() { closeOthersTags() {
this.$router.push(this.selectedTag).catch(() => {}); this.$router.push(this.selectedTag).catch(() => {});
this.$tab.closeOtherPage(this.selectedTag).then(() => { this.$tab.closeOtherPage(this.selectedTag).then(() => {
this.moveToCurrentTag() this.moveToCurrentTag();
}) });
}, },
closeAllTags(view) { closeAllTags(view) {
this.$tab.closeAllPage().then(({ visitedViews }) => { this.$tab.closeAllPage().then(({ visitedViews }) => {
if (this.affixTags.some(tag => tag.path === this.$route.path)) { if (this.affixTags.some((tag) => tag.path === this.$route.path)) {
return return;
} }
this.toLastView(visitedViews, view) this.toLastView(visitedViews, view);
}) });
}, },
toLastView(visitedViews, view) { toLastView(visitedViews, view) {
const latestView = visitedViews.slice(-1)[0] const latestView = visitedViews.slice(-1)[0];
if (latestView) { if (latestView) {
this.$router.push(latestView.fullPath) this.$router.push(latestView.fullPath);
} else { } else {
// now the default is to redirect to the home page if there is no tags-view, // now the default is to redirect to the home page if there is no tags-view,
// you can adjust it according to your needs. // you can adjust it according to your needs.
if (view.name === 'Dashboard') { if (view.name === 'Dashboard') {
// to reload home page // to reload home page
this.$router.replace({ path: '/redirect' + view.fullPath }) this.$router.replace({ path: '/redirect' + view.fullPath });
} else { } else {
this.$router.push('/') this.$router.push('/');
} }
} }
}, },
openMenu(tag, e) { openMenu(tag, e) {
const menuMinWidth = 105 const menuMinWidth = 105;
const offsetLeft = this.$el.getBoundingClientRect().left // container margin left const offsetLeft = this.$el.getBoundingClientRect().left; // container margin left
const offsetWidth = this.$el.offsetWidth // container width const offsetWidth = this.$el.offsetWidth; // container width
const maxLeft = offsetWidth - menuMinWidth // left boundary const maxLeft = offsetWidth - menuMinWidth; // left boundary
const left = e.clientX - offsetLeft + 15 // 15: margin right const left = e.clientX - offsetLeft + 15; // 15: margin right
if (left > maxLeft) { if (left > maxLeft) {
this.left = maxLeft this.left = maxLeft;
} else { } else {
this.left = left this.left = left;
} }
this.top = e.clientY this.top = e.clientY;
this.visible = true this.visible = true;
this.selectedTag = tag this.selectedTag = tag;
}, },
closeMenu() { closeMenu() {
this.visible = false this.visible = false;
}, },
handleScroll() { handleScroll() {
this.closeMenu() this.closeMenu();
}
} }
} }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@@ -243,7 +232,7 @@ export default {
width: 100%; width: 100%;
background: #fff; background: #fff;
border-bottom: 1px solid #d8dce5; border-bottom: 1px solid #d8dce5;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .12), 0 0 3px 0 rgba(0, 0, 0, .04); box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);
.tags-view-wrapper { .tags-view-wrapper {
.tags-view-item { .tags-view-item {
display: inline-block; display: inline-block;
@@ -292,7 +281,7 @@ export default {
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
color: #333; color: #333;
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, .3); box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
li { li {
margin: 0; margin: 0;
padding: 7px 16px; padding: 7px 16px;
@@ -315,10 +304,10 @@ export default {
vertical-align: 2px; vertical-align: 2px;
border-radius: 50%; border-radius: 50%;
text-align: center; text-align: center;
transition: all .3s cubic-bezier(.645, .045, .355, 1); transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
transform-origin: 100% 50%; transform-origin: 100% 50%;
&:before { &:before {
transform: scale(.6); transform: scale(0.6);
display: inline-block; display: inline-block;
vertical-align: -3px; vertical-align: -3px;
} }

10
src/layout/components/index.js
View File

@@ -1,5 +1,5 @@
export { default as AppMain } from './AppMain' export { default as AppMain } from './AppMain';
export { default as Navbar } from './Navbar' export { default as Navbar } from './Navbar';
export { default as Settings } from './Settings' export { default as Settings } from './Settings';
export { default as Sidebar } from './Sidebar/index.vue' export { default as Sidebar } from './Sidebar/index.vue';
export { default as TagsView } from './TagsView/index.vue' export { default as TagsView } from './TagsView/index.vue';

32
src/layout/index.vue
View File

@@ -16,11 +16,11 @@
</template> </template>
<script> <script>
import RightPanel from '@/components/RightPanel' import RightPanel from '@/components/RightPanel';
import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components' import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components';
import ResizeMixin from './mixin/ResizeHandler' import ResizeMixin from './mixin/ResizeHandler';
import { mapState } from 'vuex' import { mapState } from 'vuex';
import variables from '@/assets/styles/variables.scss' import variables from '@/assets/styles/variables.scss';
export default { export default {
name: 'Layout', name: 'Layout',
@@ -35,12 +35,12 @@ export default {
mixins: [ResizeMixin], mixins: [ResizeMixin],
computed: { computed: {
...mapState({ ...mapState({
theme: state => state.settings.theme, theme: (state) => state.settings.theme,
sideTheme: state => state.settings.sideTheme, sideTheme: (state) => state.settings.sideTheme,
sidebar: state => state.app.sidebar, sidebar: (state) => state.app.sidebar,
device: state => state.app.device, device: (state) => state.app.device,
needTagsView: state => state.settings.tagsView, needTagsView: (state) => state.settings.tagsView,
fixedHeader: state => state.settings.fixedHeader fixedHeader: (state) => state.settings.fixedHeader
}), }),
classObj() { classObj() {
return { return {
@@ -48,7 +48,7 @@ export default {
openSidebar: this.sidebar.opened, openSidebar: this.sidebar.opened,
withoutAnimation: this.sidebar.withoutAnimation, withoutAnimation: this.sidebar.withoutAnimation,
mobile: this.device === 'mobile' mobile: this.device === 'mobile'
} };
}, },
variables() { variables() {
return variables; return variables;
@@ -56,15 +56,15 @@ export default {
}, },
methods: { methods: {
handleClickOutside() { handleClickOutside() {
this.$store.dispatch('app/closeSideBar', { withoutAnimation: false }) this.$store.dispatch('app/closeSideBar', { withoutAnimation: false });
}
} }
} }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "~@/assets/styles/mixin.scss"; @import '~@/assets/styles/mixin.scss';
@import "~@/assets/styles/variables.scss"; @import '~@/assets/styles/variables.scss';
.app-wrapper { .app-wrapper {
@include clearfix; @include clearfix;

30
src/layout/mixin/ResizeHandler.js
View File

@@ -1,45 +1,45 @@
import store from '@/store' import store from '@/store';
const { body } = document const { body } = document;
const WIDTH = 992 // refer to Bootstrap's responsive design const WIDTH = 992; // refer to Bootstrap's responsive design
export default { export default {
watch: { watch: {
$route(route) { $route(route) {
if (this.device === 'mobile' && this.sidebar.opened) { if (this.device === 'mobile' && this.sidebar.opened) {
store.dispatch('app/closeSideBar', { withoutAnimation: false }) store.dispatch('app/closeSideBar', { withoutAnimation: false });
} }
} }
}, },
beforeMount() { beforeMount() {
window.addEventListener('resize', this.$_resizeHandler) window.addEventListener('resize', this.$_resizeHandler);
}, },
beforeDestroy() { beforeDestroy() {
window.removeEventListener('resize', this.$_resizeHandler) window.removeEventListener('resize', this.$_resizeHandler);
}, },
mounted() { mounted() {
const isMobile = this.$_isMobile() const isMobile = this.$_isMobile();
if (isMobile) { if (isMobile) {
store.dispatch('app/toggleDevice', 'mobile') store.dispatch('app/toggleDevice', 'mobile');
store.dispatch('app/closeSideBar', { withoutAnimation: true }) store.dispatch('app/closeSideBar', { withoutAnimation: true });
} }
}, },
methods: { methods: {
// use $_ for mixins properties // use $_ for mixins properties
// https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential // https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential
$_isMobile() { $_isMobile() {
const rect = body.getBoundingClientRect() const rect = body.getBoundingClientRect();
return rect.width - 1 < WIDTH return rect.width - 1 < WIDTH;
}, },
$_resizeHandler() { $_resizeHandler() {
if (!document.hidden) { if (!document.hidden) {
const isMobile = this.$_isMobile() const isMobile = this.$_isMobile();
store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop') store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop');
if (isMobile) { if (isMobile) {
store.dispatch('app/closeSideBar', { withoutAnimation: true }) store.dispatch('app/closeSideBar', { withoutAnimation: true });
}
} }
} }
} }
} }
};

29
src/main.js
View File

@@ -19,38 +19,9 @@ import './global';
import './assets/icons'; // icon import './assets/icons'; // icon
import './permission'; // permission control import './permission'; // permission control
import {
download
} from '@/utils/request'
import {
getDicts
} from "@/api/system/dict/data";
import {
getConfigKey
} from "@/api/system/config";
import {
parseTime,
resetForm,
addDateRange,
selectDictLabel,
selectDictLabels,
handleTree
} from "@/utils/ruoyi";
// 头部标签组件 // 头部标签组件
import VueMeta from 'vue-meta'; import VueMeta from 'vue-meta';
// 全局方法挂载
Vue.prototype.getDicts = getDicts
Vue.prototype.getConfigKey = getConfigKey
Vue.prototype.parseTime = parseTime
Vue.prototype.resetForm = resetForm
Vue.prototype.addDateRange = addDateRange
Vue.prototype.selectDictLabel = selectDictLabel
Vue.prototype.selectDictLabels = selectDictLabels
Vue.prototype.download = download
Vue.prototype.handleTree = handleTree
import Mixin from './mixins/Mixin'; import Mixin from './mixins/Mixin';
Vue.mixin(Mixin); Vue.mixin(Mixin);

38
src/plugins/cache.js
View File

@@ -1,69 +1,69 @@
const sessionCache = { const sessionCache = {
set(key, value) { set(key, value) {
if (!sessionStorage) { if (!sessionStorage) {
return return;
} }
if (key != null && value != null) { if (key != null && value != null) {
sessionStorage.setItem(key, value) sessionStorage.setItem(key, value);
} }
}, },
get(key) { get(key) {
if (!sessionStorage) { if (!sessionStorage) {
return null return null;
} }
if (key == null) { if (key == null) {
return null return null;
} }
return sessionStorage.getItem(key) return sessionStorage.getItem(key);
}, },
setJSON(key, jsonValue) { setJSON(key, jsonValue) {
if (jsonValue != null) { if (jsonValue != null) {
this.set(key, JSON.stringify(jsonValue)) this.set(key, JSON.stringify(jsonValue));
} }
}, },
getJSON(key) { getJSON(key) {
const value = this.get(key) const value = this.get(key);
if (value != null) { if (value != null) {
return JSON.parse(value) return JSON.parse(value);
} }
}, },
remove(key) { remove(key) {
sessionStorage.removeItem(key); sessionStorage.removeItem(key);
} }
} };
const localCache = { const localCache = {
set(key, value) { set(key, value) {
if (!localStorage) { if (!localStorage) {
return return;
} }
if (key != null && value != null) { if (key != null && value != null) {
localStorage.setItem(key, value) localStorage.setItem(key, value);
} }
}, },
get(key) { get(key) {
if (!localStorage) { if (!localStorage) {
return null return null;
} }
if (key == null) { if (key == null) {
return null return null;
} }
return localStorage.getItem(key) return localStorage.getItem(key);
}, },
setJSON(key, jsonValue) { setJSON(key, jsonValue) {
if (jsonValue != null) { if (jsonValue != null) {
this.set(key, JSON.stringify(jsonValue)) this.set(key, JSON.stringify(jsonValue));
} }
}, },
getJSON(key) { getJSON(key) {
const value = this.get(key) const value = this.get(key);
if (value != null) { if (value != null) {
return JSON.parse(value) return JSON.parse(value);
} }
}, },
remove(key) { remove(key) {
localStorage.removeItem(key); localStorage.removeItem(key);
} }
} };
export default { export default {
/** /**
@@ -74,4 +74,4 @@ export default {
* 本地缓存 * 本地缓存
*/ */
local: localCache local: localCache
} };

44
src/plugins/modal.js
View File

@@ -1,43 +1,43 @@
import { Message, MessageBox, Notification, Loading } from 'element-ui' import { Message, MessageBox, Notification, Loading } from 'element-ui';
let loadingInstance; let loadingInstance;
export default { export default {
// 消息提示 // 消息提示
msg(content) { msg(content) {
Message.info(content) Message.info(content);
}, },
// 错误消息 // 错误消息
msgError(content) { msgError(content) {
Message.error(content) Message.error(content);
}, },
// 成功消息 // 成功消息
msgSuccess(content) { msgSuccess(content) {
Message.success(content) Message.success(content);
}, },
// 警告消息 // 警告消息
msgWarning(content) { msgWarning(content) {
Message.warning(content) Message.warning(content);
}, },
// 弹出提示 // 弹出提示
alert(content) { alert(content) {
MessageBox.alert(content, "系统提示") MessageBox.alert(content, '系统提示');
}, },
// 错误提示 // 错误提示
alertError(content) { alertError(content) {
MessageBox.alert(content, "系统提示", { type: 'error' }) MessageBox.alert(content, '系统提示', { type: 'error' });
}, },
// 成功提示 // 成功提示
alertSuccess(content) { alertSuccess(content) {
MessageBox.alert(content, "系统提示", { type: 'success' }) MessageBox.alert(content, '系统提示', { type: 'success' });
}, },
// 警告提示 // 警告提示
alertWarning(content) { alertWarning(content) {
MessageBox.alert(content, "系统提示", { type: 'warning' }) MessageBox.alert(content, '系统提示', { type: 'warning' });
}, },
// 通知提示 // 通知提示
notify(content) { notify(content) {
Notification.info(content) Notification.info(content);
}, },
// 错误通知 // 错误通知
notifyError(content) { notifyError(content) {
@@ -45,39 +45,39 @@ export default {
}, },
// 成功通知 // 成功通知
notifySuccess(content) { notifySuccess(content) {
Notification.success(content) Notification.success(content);
}, },
// 警告通知 // 警告通知
notifyWarning(content) { notifyWarning(content) {
Notification.warning(content) Notification.warning(content);
}, },
// 确认窗体 // 确认窗体
confirm(content) { confirm(content) {
return MessageBox.confirm(content, "系统提示", { return MessageBox.confirm(content, '系统提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: "warning", type: 'warning'
}) });
}, },
// 提交内容 // 提交内容
prompt(content) { prompt(content) {
return MessageBox.prompt(content, "系统提示", { return MessageBox.prompt(content, '系统提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: "warning", type: 'warning'
}) });
}, },
// 打开遮罩层 // 打开遮罩层
loading(content) { loading(content) {
loadingInstance = Loading.service({ loadingInstance = Loading.service({
lock: true, lock: true,
text: content, text: content,
spinner: "el-icon-loading", spinner: 'el-icon-loading',
background: "rgba(0, 0, 0, 0.7)", background: 'rgba(0, 0, 0, 0.7)'
}) });
}, },
// 关闭遮罩层 // 关闭遮罩层
closeLoading() { closeLoading() {
loadingInstance.close(); loadingInstance.close();
} }
} };

19
src/plugins/tab.js
View File

@@ -1,4 +1,4 @@
import store from '@/store' import store from '@/store';
import router from '@/router'; import router from '@/router';
export default { export default {
@@ -15,16 +15,16 @@ export default {
}); });
} }
return store.dispatch('tagsView/delCachedView', obj).then(() => { return store.dispatch('tagsView/delCachedView', obj).then(() => {
const { path, query } = obj const { path, query } = obj;
router.replace({ router.replace({
path: '/redirect' + path, path: '/redirect' + path,
query: query query: query
}) });
}) });
}, },
// 关闭当前tab页签，打开新页签 // 关闭当前tab页签，打开新页签
closeOpenPage(obj) { closeOpenPage(obj) {
store.dispatch("tagsView/delView", router.currentRoute); store.dispatch('tagsView/delView', router.currentRoute);
if (obj !== undefined) { if (obj !== undefined) {
return router.push(obj); return router.push(obj);
} }
@@ -56,7 +56,12 @@ export default {
}, },
// 添加tab页签 // 添加tab页签
openPage(title, url, params) { openPage(title, url, params) {
var obj = { path: url, meta: { title: title } } var obj = {
path: url,
meta: {
title: title
}
};
store.dispatch('tagsView/addView', obj); store.dispatch('tagsView/addView', obj);
return router.push({ path: url, query: params }); return router.push({ path: url, query: params });
}, },
@@ -64,4 +69,4 @@ export default {
updatePage(obj) { updatePage(obj) {
return store.dispatch('tagsView/updateVisitedView', obj); return store.dispatch('tagsView/updateVisitedView', obj);
} }
} };

48
src/router/index.js
View File

@@ -29,14 +29,17 @@ import Layout from '@/layout';
*/ */
// 公共路由 // 公共路由
export const constantRoutes = [{ export const constantRoutes = [
{
path: '/redirect', path: '/redirect',
component: Layout, component: Layout,
hidden: true, hidden: true,
children: [{ children: [
{
path: '/redirect/:path(.*)', path: '/redirect/:path(.*)',
component: () => import('@/views/redirect') component: () => import('@/views/redirect')
}] }
]
}, },
{ {
path: '/login', path: '/login',
@@ -62,7 +65,8 @@ export const constantRoutes = [{
path: '', path: '',
component: Layout, component: Layout,
redirect: 'index', redirect: 'index',
children: [{ children: [
{
path: 'index', path: 'index',
component: () => import('@/views/index'), component: () => import('@/views/index'),
name: 'Index', name: 'Index',
@@ -71,7 +75,8 @@ export const constantRoutes = [{
icon: 'dashboard', icon: 'dashboard',
affix: true affix: true
} }
}] }
]
}, },
// { // {
// path: '/demo', // path: '/demo',
@@ -106,7 +111,8 @@ export const constantRoutes = [{
component: Layout, component: Layout,
hidden: true, hidden: true,
redirect: 'noredirect', redirect: 'noredirect',
children: [{ children: [
{
path: 'profile', path: 'profile',
component: () => import('@/views/system/user/profile/index'), component: () => import('@/views/system/user/profile/index'),
name: 'Profile', name: 'Profile',
@@ -114,17 +120,20 @@ export const constantRoutes = [{
title: '个人中心', title: '个人中心',
icon: 'user' icon: 'user'
} }
}] }
]
} }
]; ];
// 动态路由，基于用户权限动态去加载 // 动态路由，基于用户权限动态去加载
export const dynamicRoutes = [{ export const dynamicRoutes = [
{
path: '/system/user-auth', path: '/system/user-auth',
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['system:user:edit'], permissions: ['system:user:edit'],
children: [{ children: [
{
path: 'role/:userId(\\d+)', path: 'role/:userId(\\d+)',
component: () => import('@/views/system/user/authRole'), component: () => import('@/views/system/user/authRole'),
name: 'AuthRole', name: 'AuthRole',
@@ -132,14 +141,16 @@ export const dynamicRoutes = [{
title: '分配角色', title: '分配角色',
activeMenu: '/system/user' activeMenu: '/system/user'
} }
}] }
]
}, },
{ {
path: '/system/role-auth', path: '/system/role-auth',
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['system:role:edit'], permissions: ['system:role:edit'],
children: [{ children: [
{
path: 'user/:roleId(\\d+)', path: 'user/:roleId(\\d+)',
component: () => import('@/views/system/role/authUser'), component: () => import('@/views/system/role/authUser'),
name: 'AuthUser', name: 'AuthUser',
@@ -147,14 +158,16 @@ export const dynamicRoutes = [{
title: '分配用户', title: '分配用户',
activeMenu: '/system/role' activeMenu: '/system/role'
} }
}] }
]
}, },
{ {
path: '/system/dict-data', path: '/system/dict-data',
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['system:dict:list'], permissions: ['system:dict:list'],
children: [{ children: [
{
path: 'index/:dictId(\\d+)', path: 'index/:dictId(\\d+)',
component: () => import('@/views/system/dict/data'), component: () => import('@/views/system/dict/data'),
name: 'Data', name: 'Data',
@@ -162,14 +175,16 @@ export const dynamicRoutes = [{
title: '字典数据', title: '字典数据',
activeMenu: '/system/dict' activeMenu: '/system/dict'
} }
}] }
]
}, },
{ {
path: '/monitor/job-log', path: '/monitor/job-log',
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['monitor:job:list'], permissions: ['monitor:job:list'],
children: [{ children: [
{
path: 'index', path: 'index',
component: () => import('@/views/monitor/job/log'), component: () => import('@/views/monitor/job/log'),
name: 'JobLog', name: 'JobLog',
@@ -177,7 +192,8 @@ export const dynamicRoutes = [{
title: '调度日志', title: '调度日志',
activeMenu: '/monitor/job' activeMenu: '/monitor/job'
} }
}] }
]
} }
]; ];

2
src/settings.js
View File

@@ -41,4 +41,4 @@ module.exports = {
* If you want to also use it in dev, you can pass ['production', 'development'] * If you want to also use it in dev, you can pass ['production', 'development']
*/ */
errorLog: 'production' errorLog: 'production'
} };

44
src/store/modules/app.js
View File

@@ -1,4 +1,4 @@
import Cookies from 'js-cookie' import Cookies from 'js-cookie';
const state = { const state = {
sidebar: { sidebar: {
@@ -8,59 +8,59 @@ const state = {
}, },
device: 'desktop', device: 'desktop',
size: Cookies.get('size') || 'medium' size: Cookies.get('size') || 'medium'
} };
const mutations = { const mutations = {
TOGGLE_SIDEBAR: state => { TOGGLE_SIDEBAR: (state) => {
if (state.sidebar.hide) { if (state.sidebar.hide) {
return false; return false;
} }
state.sidebar.opened = !state.sidebar.opened state.sidebar.opened = !state.sidebar.opened;
state.sidebar.withoutAnimation = false state.sidebar.withoutAnimation = false;
if (state.sidebar.opened) { if (state.sidebar.opened) {
Cookies.set('sidebarStatus', 1) Cookies.set('sidebarStatus', 1);
} else { } else {
Cookies.set('sidebarStatus', 0) Cookies.set('sidebarStatus', 0);
} }
}, },
CLOSE_SIDEBAR: (state, withoutAnimation) => { CLOSE_SIDEBAR: (state, withoutAnimation) => {
Cookies.set('sidebarStatus', 0) Cookies.set('sidebarStatus', 0);
state.sidebar.opened = false state.sidebar.opened = false;
state.sidebar.withoutAnimation = withoutAnimation state.sidebar.withoutAnimation = withoutAnimation;
}, },
TOGGLE_DEVICE: (state, device) => { TOGGLE_DEVICE: (state, device) => {
state.device = device state.device = device;
}, },
SET_SIZE: (state, size) => { SET_SIZE: (state, size) => {
state.size = size state.size = size;
Cookies.set('size', size) Cookies.set('size', size);
}, },
SET_SIDEBAR_HIDE: (state, status) => { SET_SIDEBAR_HIDE: (state, status) => {
state.sidebar.hide = status state.sidebar.hide = status;
}
} }
};
const actions = { const actions = {
toggleSideBar({ commit }) { toggleSideBar({ commit }) {
commit('TOGGLE_SIDEBAR') commit('TOGGLE_SIDEBAR');
}, },
closeSideBar({ commit }, { withoutAnimation }) { closeSideBar({ commit }, { withoutAnimation }) {
commit('CLOSE_SIDEBAR', withoutAnimation) commit('CLOSE_SIDEBAR', withoutAnimation);
}, },
toggleDevice({ commit }, device) { toggleDevice({ commit }, device) {
commit('TOGGLE_DEVICE', device) commit('TOGGLE_DEVICE', device);
}, },
setSize({ commit }, size) { setSize({ commit }, size) {
commit('SET_SIZE', size) commit('SET_SIZE', size);
}, },
toggleSideBarHide({ commit }, status) { toggleSideBarHide({ commit }, status) {
commit('SET_SIDEBAR_HIDE', status) commit('SET_SIDEBAR_HIDE', status);
}
} }
};
export default { export default {
namespaced: true, namespaced: true,
state, state,
mutations, mutations,
actions actions
} };

30
src/store/modules/dict.js
View File

@@ -1,50 +1,50 @@
const state = { const state = {
dict: new Array() dict: []
} };
const mutations = { const mutations = {
SET_DICT: (state, { key, value }) => { SET_DICT: (state, { key, value }) => {
if (key !== null && key !== "") { if (key !== null && key !== '') {
state.dict.push({ state.dict.push({
key: key, key: key,
value: value value: value
}) });
} }
}, },
REMOVE_DICT: (state, key) => { REMOVE_DICT: (state, key) => {
try { try {
for (let i = 0; i < state.dict.length; i++) { for (let i = 0; i < state.dict.length; i++) {
if (state.dict[i].key == key) { if (state.dict[i].key === key) {
state.dict.splice(i, i) state.dict.splice(i, i);
return true return true;
} }
} }
} catch (e) { } catch (e) {
console.log(e);
} }
}, },
CLEAN_DICT: (state) => { CLEAN_DICT: (state) => {
state.dict = new Array() state.dict = [];
}
} }
};
const actions = { const actions = {
// 设置字典 // 设置字典
setDict({ commit }, data) { setDict({ commit }, data) {
commit('SET_DICT', data) commit('SET_DICT', data);
}, },
// 删除字典 // 删除字典
removeDict({ commit }, key) { removeDict({ commit }, key) {
commit('REMOVE_DICT', key) commit('REMOVE_DICT', key);
}, },
// 清空字典 // 清空字典
cleanDict({ commit }) { cleanDict({ commit }) {
commit('CLEAN_DICT') commit('CLEAN_DICT');
}
} }
};
export default { export default {
namespaced: true, namespaced: true,
state, state,
mutations, mutations,
actions actions
} };

22
src/store/modules/settings.js
View File

@@ -1,8 +1,8 @@
import defaultSettings from '@/settings' import defaultSettings from '@/settings';
const { sideTheme, showSettings, topNav, tagsView, fixedHeader, sidebarLogo, dynamicTitle } = defaultSettings const { sideTheme, showSettings, topNav, tagsView, fixedHeader, sidebarLogo, dynamicTitle } = defaultSettings;
const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || '' const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || '';
const state = { const state = {
title: '', title: '',
theme: storageSetting.theme || '#409EFF', theme: storageSetting.theme || '#409EFF',
@@ -13,30 +13,30 @@ const state = {
fixedHeader: storageSetting.fixedHeader === undefined ? fixedHeader : storageSetting.fixedHeader, fixedHeader: storageSetting.fixedHeader === undefined ? fixedHeader : storageSetting.fixedHeader,
sidebarLogo: storageSetting.sidebarLogo === undefined ? sidebarLogo : storageSetting.sidebarLogo, sidebarLogo: storageSetting.sidebarLogo === undefined ? sidebarLogo : storageSetting.sidebarLogo,
dynamicTitle: storageSetting.dynamicTitle === undefined ? dynamicTitle : storageSetting.dynamicTitle dynamicTitle: storageSetting.dynamicTitle === undefined ? dynamicTitle : storageSetting.dynamicTitle
} };
const mutations = { const mutations = {
CHANGE_SETTING: (state, { key, value }) => { CHANGE_SETTING: (state, { key, value }) => {
// eslint-disable-next-line no-prototype-builtins
if (state.hasOwnProperty(key)) { if (state.hasOwnProperty(key)) {
state[key] = value state[key] = value;
}
} }
} }
};
const actions = { const actions = {
// 修改布局设置 // 修改布局设置
changeSetting({ commit }, data) { changeSetting({ commit }, data) {
commit('CHANGE_SETTING', data) commit('CHANGE_SETTING', data);
}, },
// 设置网页标题 // 设置网页标题
setTitle({ commit }, title) { setTitle({ commit }, title) {
state.title = title state.title = title;
}
} }
};
export default { export default {
namespaced: true, namespaced: true,
state, state,
mutations, mutations,
actions actions
} };

Some files were not shown because too many files have changed in this diff Show More