Merge pull request 'eslint' (#2) from dev-qsh into master
Reviewed-on: http://114.55.169.15:3000/qiushanhe/dm-manage-web/pulls/2pull/3/head
commit
58d702f6f7
@ -1,208 +1,92 @@ |
||||
<!DOCTYPE html> |
||||
<html> |
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
||||
<meta name="renderer" content="webkit"> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> |
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> |
||||
<meta charset="utf-8" /> |
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> |
||||
<meta name="renderer" content="webkit" /> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" /> |
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico" /> |
||||
<title><%= webpackConfig.name %></title> |
||||
<!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]--> |
||||
<style> |
||||
html, |
||||
body, |
||||
#app { |
||||
height: 100%; |
||||
margin: 0px; |
||||
padding: 0px; |
||||
} |
||||
.chromeframe { |
||||
margin: 0.2em 0; |
||||
background: #ccc; |
||||
color: #000; |
||||
padding: 0.2em 0; |
||||
} |
||||
|
||||
#loader-wrapper { |
||||
position: fixed; |
||||
top: 0; |
||||
left: 0; |
||||
width: 100%; |
||||
height: 100%; |
||||
z-index: 999999; |
||||
} |
||||
|
||||
#loader { |
||||
display: block; |
||||
position: relative; |
||||
left: 50%; |
||||
top: 50%; |
||||
width: 150px; |
||||
height: 150px; |
||||
margin: -75px 0 0 -75px; |
||||
border-radius: 50%; |
||||
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; |
||||
} |
||||
|
||||
#loader:before { |
||||
content: ""; |
||||
position: absolute; |
||||
top: 5px; |
||||
left: 5px; |
||||
right: 5px; |
||||
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% { |
||||
-webkit-transform: rotate(0deg); |
||||
-ms-transform: rotate(0deg); |
||||
transform: rotate(0deg); |
||||
<!--[if lt IE 11 |
||||
]><script> |
||||
window.location.href = '/html/ie.html'; |
||||
</script><! |
||||
[endif]--> |
||||
<style> |
||||
html, |
||||
body, |
||||
#app { |
||||
height: 100%; |
||||
margin: 0px; |
||||
padding: 0px; |
||||
} |
||||
100% { |
||||
-webkit-transform: rotate(360deg); |
||||
-ms-transform: rotate(360deg); |
||||
transform: rotate(360deg); |
||||
.chromeframe { |
||||
margin: 0.2em 0; |
||||
background: #ccc; |
||||
color: #000; |
||||
padding: 0.2em 0; |
||||
} |
||||
} |
||||
|
||||
@keyframes spin { |
||||
0% { |
||||
-webkit-transform: rotate(0deg); |
||||
-ms-transform: rotate(0deg); |
||||
transform: rotate(0deg); |
||||
.logo { |
||||
position: absolute; |
||||
display: block; |
||||
left: 50%; |
||||
top: 50%; |
||||
width: 100px; |
||||
/* height: 162px; */ |
||||
transform: translate3d(-50%, -80px, 0); |
||||
animation: twinkling 1.2s infinite ease-in-out; |
||||
} |
||||
100% { |
||||
-webkit-transform: rotate(360deg); |
||||
-ms-transform: rotate(360deg); |
||||
transform: rotate(360deg); |
||||
/* .animated { |
||||
-webkit-animation-duration: 1s; |
||||
animation-duration: 1s; |
||||
-webkit-animation-fill-mode: both; |
||||
animation-fill-mode: both; |
||||
} */ |
||||
@keyframes twinkling { |
||||
0% { |
||||
opacity: 0.8; |
||||
} |
||||
50% { |
||||
opacity: 0.4; |
||||
} |
||||
100% { |
||||
opacity: 0.8; |
||||
} |
||||
} |
||||
.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); |
||||
} |
||||
} |
||||
|
||||
|
||||
#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%; |
||||
text-align: center; |
||||
z-index: 9999999999999; |
||||
position: absolute; |
||||
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> |
||||
#loader-wrapper { |
||||
position: relative; |
||||
width: 100%; |
||||
height: 100%; |
||||
background: #1a1a34; |
||||
z-index: 1000; |
||||
} |
||||
</style> |
||||
<script src="/loading/prefixfree.min.js"></script> |
||||
</head> |
||||
<body> |
||||
<div id="app"> |
||||
<div id="loader-wrapper"> |
||||
<div id="loader"></div> |
||||
<div class="loader-section section-left"></div> |
||||
<div class="loader-section section-right"></div> |
||||
<div class="load_title">正在加载系统资源,请耐心等待</div> |
||||
</div> |
||||
</div> |
||||
<div id="loader-wrapper"> |
||||
<img class="logo animated" src="/logo.png" alt="" srcset="" /> |
||||
<div class="loading">资源加载中...</div> |
||||
</div> |
||||
</div> |
||||
<script src="/loading/index.js"></script> |
||||
</body> |
||||
</html> |
||||
|
@ -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(); |
||||
} |
@ -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); |
After Width: | Height: | Size: 137 KiB |
@ -1,9 +1,9 @@ |
||||
import request from '@/utils/request' |
||||
import request from '@/utils/request'; |
||||
|
||||
// 获取路由
|
||||
export const getRouters = () => { |
||||
return request({ |
||||
url: '/getRouters', |
||||
method: 'get' |
||||
}) |
||||
} |
||||
}); |
||||
}; |
||||
|
@ -1,9 +1,9 @@ |
||||
import request from '@/utils/request' |
||||
import request from '@/utils/request'; |
||||
|
||||
// 获取服务信息
|
||||
export function getServer() { |
||||
return request({ |
||||
url: '/monitor/server', |
||||
method: 'get' |
||||
}) |
||||
} |
||||
}); |
||||
} |
||||
|
@ -1,36 +1,36 @@ |
||||
import request from '@/utils/request' |
||||
import request from '@/utils/request'; |
||||
export default { |
||||
pageList(data = {}) { |
||||
return request({ |
||||
url: "/sch/school/list", |
||||
method: "get", |
||||
params: data, |
||||
url: '/sch/school/list', |
||||
method: 'get', |
||||
params: data |
||||
}); |
||||
}, |
||||
getById(id) { |
||||
return request({ |
||||
url: `/sch/school/${id}`, |
||||
method: "get", |
||||
method: 'get' |
||||
}); |
||||
}, |
||||
add(data = {}) { |
||||
return request({ |
||||
url: "/sch/school", |
||||
method: "post", |
||||
data, |
||||
url: '/sch/school', |
||||
method: 'post', |
||||
data |
||||
}); |
||||
}, |
||||
update(data = {}) { |
||||
return request({ |
||||
url: "/sch/school", |
||||
method: "put", |
||||
data, |
||||
url: '/sch/school', |
||||
method: 'put', |
||||
data |
||||
}); |
||||
}, |
||||
delete(id) { |
||||
return request({ |
||||
url: `/sch/school/${id}`, |
||||
method: "delete", |
||||
method: 'delete' |
||||
}); |
||||
} |
||||
} |
||||
}; |
||||
|
@ -1,42 +1,42 @@ |
||||
import request from '@/utils/request' |
||||
import request from '@/utils/request'; |
||||
export default { |
||||
pageList(data = {}) { |
||||
return request({ |
||||
url: "/system/employee/list", |
||||
method: "get", |
||||
params: data, |
||||
url: '/system/employee/list', |
||||
method: 'get', |
||||
params: data |
||||
}); |
||||
}, |
||||
getById(id) { |
||||
return request({ |
||||
url: `/system/employee/${id}`, |
||||
method: "get", |
||||
method: 'get' |
||||
}); |
||||
}, |
||||
add(data = {}) { |
||||
return request({ |
||||
url: "/system/employee", |
||||
method: "post", |
||||
data, |
||||
url: '/system/employee', |
||||
method: 'post', |
||||
data |
||||
}); |
||||
}, |
||||
update(data = {}) { |
||||
return request({ |
||||
url: "/system/employee", |
||||
method: "put", |
||||
data, |
||||
url: '/system/employee', |
||||
method: 'put', |
||||
data |
||||
}); |
||||
}, |
||||
delete(id) { |
||||
return request({ |
||||
url: `/system/employee/${id}`, |
||||
method: "delete", |
||||
method: 'delete' |
||||
}); |
||||
}, |
||||
getEmployee() { |
||||
return request({ |
||||
url: "/system/employee/getEmployees", |
||||
method: "get" |
||||
url: '/system/employee/getEmployees', |
||||
method: 'get' |
||||
}); |
||||
} |
||||
} |
||||
}; |
||||
|
@ -1,9 +1,9 @@ |
||||
import Vue from 'vue' |
||||
import SvgIcon from '@/components/SvgIcon'// svg component
|
||||
import Vue from 'vue'; |
||||
import SvgIcon from '@/components/SvgIcon'; // svg component
|
||||
|
||||
// register globally
|
||||
Vue.component('svg-icon', SvgIcon) |
||||
Vue.component('SvgIcon', SvgIcon); |
||||
|
||||
const req = require.context('./svg', false, /\.svg$/) |
||||
const requireAll = requireContext => requireContext.keys().map(requireContext) |
||||
requireAll(req) |
||||
const req = require.context('./svg', false, /\.svg$/); |
||||
const requireAll = (requireContext) => requireContext.keys().map(requireContext); |
||||
requireAll(req); |
||||
|
@ -1,161 +1,162 @@ |
||||
<template> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="1"> |
||||
日,允许的通配符[, - * ? / L W] |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="1"> |
||||
日,允许的通配符[, - * ? / L W] |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="2"> |
||||
不指定 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="2"> |
||||
不指定 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="3"> |
||||
周期从 |
||||
<el-input-number v-model='cycle01' :min="1" :max="30" /> - |
||||
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : 2" :max="31" /> 日 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="3"> |
||||
周期从 |
||||
<el-input-number v-model="cycle01" :min="1" :max="30" /> - |
||||
<el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 2" :max="31" /> 日 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="4"> |
||||
从 |
||||
<el-input-number v-model='average01' :min="1" :max="30" /> 号开始,每 |
||||
<el-input-number v-model='average02' :min="1" :max="31 - average01 || 1" /> 日执行一次 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="4"> |
||||
从 |
||||
<el-input-number v-model="average01" :min="1" :max="30" /> 号开始,每 |
||||
<el-input-number v-model="average02" :min="1" :max="31 - average01 || 1" /> 日执行一次 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="5"> |
||||
每月 |
||||
<el-input-number v-model='workday' :min="1" :max="31" /> 号最近的那个工作日 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="5"> |
||||
每月 |
||||
<el-input-number v-model="workday" :min="1" :max="31" /> 号最近的那个工作日 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="6"> |
||||
本月最后一天 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="6"> |
||||
本月最后一天 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="7"> |
||||
指定 |
||||
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> |
||||
<el-option v-for="item in 31" :key="item" :value="item">{{item}}</el-option> |
||||
</el-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="7"> |
||||
指定 |
||||
<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-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
radioValue: 1, |
||||
workday: 1, |
||||
cycle01: 1, |
||||
cycle02: 2, |
||||
average01: 1, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
checkNum: this.$options.propsData.check |
||||
} |
||||
}, |
||||
name: 'crontab-day', |
||||
props: ['check', 'cron'], |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
('day rachange'); |
||||
if (this.radioValue !== 2 && this.cron.week !== '?') { |
||||
this.$emit('update', 'week', '?', 'day') |
||||
} |
||||
name: 'CrontabDay', |
||||
// eslint-disable-next-line vue/require-prop-types |
||||
props: ['check', 'cron'], |
||||
data() { |
||||
return { |
||||
radioValue: 1, |
||||
workday: 1, |
||||
cycle01: 1, |
||||
cycle02: 2, |
||||
average01: 1, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
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; |
||||
} |
||||
}, |
||||
watch: { |
||||
radioValue: 'radioChange', |
||||
cycleTotal: 'cycleChange', |
||||
averageTotal: 'averageChange', |
||||
workdayCheck: 'workdayChange', |
||||
checkboxString: 'checkboxChange' |
||||
}, |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
('day rachange'); |
||||
if (this.radioValue !== 2 && this.cron.week !== '?') { |
||||
this.$emit('update', 'week', '?', 'day'); |
||||
} |
||||
|
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'day', '*'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'day', '?'); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'day', this.cycleTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'day', this.averageTotal); |
||||
break; |
||||
case 5: |
||||
this.$emit('update', 'day', this.workday + 'W'); |
||||
break; |
||||
case 6: |
||||
this.$emit('update', 'day', 'L'); |
||||
break; |
||||
case 7: |
||||
this.$emit('update', 'day', this.checkboxString); |
||||
break; |
||||
} |
||||
('day rachange end'); |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'day', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '4') { |
||||
this.$emit('update', 'day', this.averageTotal); |
||||
} |
||||
}, |
||||
// 最近工作日值变化时 |
||||
workdayChange() { |
||||
if (this.radioValue == '5') { |
||||
this.$emit('update', 'day', this.workdayCheck + 'W'); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '7') { |
||||
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; |
||||
} |
||||
} |
||||
} |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'day', '*'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'day', '?'); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'day', this.cycleTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'day', this.averageTotal); |
||||
break; |
||||
case 5: |
||||
this.$emit('update', 'day', this.workday + 'W'); |
||||
break; |
||||
case 6: |
||||
this.$emit('update', 'day', 'L'); |
||||
break; |
||||
case 7: |
||||
this.$emit('update', 'day', this.checkboxString); |
||||
break; |
||||
} |
||||
('day rachange end'); |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue === '3') { |
||||
this.$emit('update', 'day', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue === '4') { |
||||
this.$emit('update', 'day', this.averageTotal); |
||||
} |
||||
}, |
||||
// 最近工作日值变化时 |
||||
workdayChange() { |
||||
if (this.radioValue === '5') { |
||||
this.$emit('update', 'day', this.workdayCheck + 'W'); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue === '7') { |
||||
this.$emit('update', 'day', this.checkboxString); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
@ -1,114 +1,115 @@ |
||||
<template> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="1"> |
||||
小时,允许的通配符[, - * /] |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="1"> |
||||
小时,允许的通配符[, - * /] |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="2"> |
||||
周期从 |
||||
<el-input-number v-model='cycle01' :min="0" :max="22" /> - |
||||
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : 1" :max="23" /> 小时 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="2"> |
||||
周期从 |
||||
<el-input-number v-model="cycle01" :min="0" :max="22" /> - |
||||
<el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="23" /> 小时 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="3"> |
||||
从 |
||||
<el-input-number v-model='average01' :min="0" :max="22" /> 小时开始,每 |
||||
<el-input-number v-model='average02' :min="1" :max="23 - average01 || 0" /> 小时执行一次 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="3"> |
||||
从 |
||||
<el-input-number v-model="average01" :min="0" :max="22" /> 小时开始,每 |
||||
<el-input-number v-model="average02" :min="1" :max="23 - average01 || 0" /> 小时执行一次 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="4"> |
||||
指定 |
||||
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> |
||||
<el-option v-for="item in 24" :key="item" :value="item-1">{{item-1}}</el-option> |
||||
</el-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="4"> |
||||
指定 |
||||
<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-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
radioValue: 1, |
||||
cycle01: 0, |
||||
cycle02: 1, |
||||
average01: 0, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
checkNum: this.$options.propsData.check |
||||
} |
||||
}, |
||||
name: 'crontab-hour', |
||||
props: ['check', 'cron'], |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'hour', '*') |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'hour', this.cycleTotal); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'hour', this.averageTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'hour', this.checkboxString); |
||||
break; |
||||
} |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '2') { |
||||
this.$emit('update', 'hour', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'hour', this.averageTotal); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '4') { |
||||
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; |
||||
} |
||||
} |
||||
} |
||||
name: 'CrontabHour', |
||||
// eslint-disable-next-line vue/require-prop-types |
||||
props: ['check', 'cron'], |
||||
data() { |
||||
return { |
||||
radioValue: 1, |
||||
cycle01: 0, |
||||
cycle02: 1, |
||||
average01: 0, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
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; |
||||
} |
||||
}, |
||||
watch: { |
||||
radioValue: 'radioChange', |
||||
cycleTotal: 'cycleChange', |
||||
averageTotal: 'averageChange', |
||||
checkboxString: 'checkboxChange' |
||||
}, |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'hour', '*'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'hour', this.cycleTotal); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'hour', this.averageTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'hour', this.checkboxString); |
||||
break; |
||||
} |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue === '2') { |
||||
this.$emit('update', 'hour', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue === '3') { |
||||
this.$emit('update', 'hour', this.averageTotal); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue === '4') { |
||||
this.$emit('update', 'hour', this.checkboxString); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
@ -1,116 +1,115 @@ |
||||
<template> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="1"> |
||||
分钟,允许的通配符[, - * /] |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="1"> |
||||
分钟,允许的通配符[, - * /] |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="2"> |
||||
周期从 |
||||
<el-input-number v-model='cycle01' :min="0" :max="58" /> - |
||||
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 分钟 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="2"> |
||||
周期从 |
||||
<el-input-number v-model="cycle01" :min="0" :max="58" /> - |
||||
<el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 分钟 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="3"> |
||||
从 |
||||
<el-input-number v-model='average01' :min="0" :max="58" /> 分钟开始,每 |
||||
<el-input-number v-model='average02' :min="1" :max="59 - average01 || 0" /> 分钟执行一次 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="3"> |
||||
从 |
||||
<el-input-number v-model="average01" :min="0" :max="58" /> 分钟开始,每 |
||||
<el-input-number v-model="average02" :min="1" :max="59 - average01 || 0" /> 分钟执行一次 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="4"> |
||||
指定 |
||||
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> |
||||
<el-option v-for="item in 60" :key="item" :value="item-1">{{item-1}}</el-option> |
||||
</el-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="4"> |
||||
指定 |
||||
<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-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
|
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
radioValue: 1, |
||||
cycle01: 1, |
||||
cycle02: 2, |
||||
average01: 0, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
checkNum: this.$options.propsData.check |
||||
} |
||||
}, |
||||
name: 'crontab-min', |
||||
props: ['check', 'cron'], |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'min', '*', 'min'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'min', this.cycleTotal, 'min'); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'min', this.averageTotal, 'min'); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'min', this.checkboxString, 'min'); |
||||
break; |
||||
} |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '2') { |
||||
this.$emit('update', 'min', this.cycleTotal, 'min'); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'min', this.averageTotal, 'min'); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '4') { |
||||
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> |
||||
name: 'CrontabMin', |
||||
props: ['check', 'cron'], |
||||
data() { |
||||
return { |
||||
radioValue: 1, |
||||
cycle01: 1, |
||||
cycle02: 2, |
||||
average01: 0, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
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' |
||||
}, |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'min', '*', 'min'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'min', this.cycleTotal, 'min'); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'min', this.averageTotal, 'min'); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'min', this.checkboxString, 'min'); |
||||
break; |
||||
} |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '2') { |
||||
this.$emit('update', 'min', this.cycleTotal, 'min'); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'min', this.averageTotal, 'min'); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '4') { |
||||
this.$emit('update', 'min', this.checkboxString, 'min'); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
@ -1,114 +1,114 @@ |
||||
<template> |
||||
<el-form size='small'> |
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="1"> |
||||
月,允许的通配符[, - * /] |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="1"> |
||||
月,允许的通配符[, - * /] |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="2"> |
||||
周期从 |
||||
<el-input-number v-model='cycle01' :min="1" :max="11" /> - |
||||
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : 2" :max="12" /> 月 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="2"> |
||||
周期从 |
||||
<el-input-number v-model="cycle01" :min="1" :max="11" /> - |
||||
<el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 2" :max="12" /> 月 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="3"> |
||||
从 |
||||
<el-input-number v-model='average01' :min="1" :max="11" /> 月开始,每 |
||||
<el-input-number v-model='average02' :min="1" :max="12 - average01 || 0" /> 月月执行一次 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="3"> |
||||
从 |
||||
<el-input-number v-model="average01" :min="1" :max="11" /> 月开始,每 |
||||
<el-input-number v-model="average02" :min="1" :max="12 - average01 || 0" /> 月月执行一次 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="4"> |
||||
指定 |
||||
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> |
||||
<el-option v-for="item in 12" :key="item" :value="item">{{item}}</el-option> |
||||
</el-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="4"> |
||||
指定 |
||||
<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-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
radioValue: 1, |
||||
cycle01: 1, |
||||
cycle02: 2, |
||||
average01: 1, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
checkNum: this.check |
||||
} |
||||
}, |
||||
name: 'crontab-month', |
||||
props: ['check', 'cron'], |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'month', '*'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'month', this.cycleTotal); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'month', this.averageTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'month', this.checkboxString); |
||||
break; |
||||
} |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '2') { |
||||
this.$emit('update', 'month', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'month', this.averageTotal); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '4') { |
||||
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; |
||||
} |
||||
} |
||||
} |
||||
name: 'CrontabMonth', |
||||
props: ['check', 'cron'], |
||||
data() { |
||||
return { |
||||
radioValue: 1, |
||||
cycle01: 1, |
||||
cycle02: 2, |
||||
average01: 1, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
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; |
||||
} |
||||
}, |
||||
watch: { |
||||
radioValue: 'radioChange', |
||||
cycleTotal: 'cycleChange', |
||||
averageTotal: 'averageChange', |
||||
checkboxString: 'checkboxChange' |
||||
}, |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'month', '*'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'month', this.cycleTotal); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'month', this.averageTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'month', this.checkboxString); |
||||
break; |
||||
} |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '2') { |
||||
this.$emit('update', 'month', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'month', this.averageTotal); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '4') { |
||||
this.$emit('update', 'month', this.checkboxString); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
File diff suppressed because it is too large
Load Diff
@ -1,117 +1,117 @@ |
||||
<template> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="1"> |
||||
秒,允许的通配符[, - * /] |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="1"> |
||||
秒,允许的通配符[, - * /] |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="2"> |
||||
周期从 |
||||
<el-input-number v-model='cycle01' :min="0" :max="58" /> - |
||||
<el-input-number v-model='cycle02' :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 秒 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="2"> |
||||
周期从 |
||||
<el-input-number v-model="cycle01" :min="0" :max="58" /> - |
||||
<el-input-number v-model="cycle02" :min="cycle01 ? cycle01 + 1 : 1" :max="59" /> 秒 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="3"> |
||||
从 |
||||
<el-input-number v-model='average01' :min="0" :max="58" /> 秒开始,每 |
||||
<el-input-number v-model='average02' :min="1" :max="59 - average01 || 0" /> 秒执行一次 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="3"> |
||||
从 |
||||
<el-input-number v-model="average01" :min="0" :max="58" /> 秒开始,每 |
||||
<el-input-number v-model="average02" :min="1" :max="59 - average01 || 0" /> 秒执行一次 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="4"> |
||||
指定 |
||||
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple style="width:100%"> |
||||
<el-option v-for="item in 60" :key="item" :value="item-1">{{item-1}}</el-option> |
||||
</el-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="4"> |
||||
指定 |
||||
<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-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
radioValue: 1, |
||||
cycle01: 1, |
||||
cycle02: 2, |
||||
average01: 0, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
checkNum: this.$options.propsData.check |
||||
} |
||||
}, |
||||
name: 'crontab-second', |
||||
props: ['check', 'radioParent'], |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'second', '*', 'second'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'second', this.cycleTotal); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'second', this.averageTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'second', this.checkboxString); |
||||
break; |
||||
} |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '2') { |
||||
this.$emit('update', 'second', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'second', this.averageTotal); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '4') { |
||||
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; |
||||
} |
||||
} |
||||
} |
||||
name: 'CrontabSecond', |
||||
props: ['check', 'radioParent'], |
||||
data() { |
||||
return { |
||||
radioValue: 1, |
||||
cycle01: 1, |
||||
cycle02: 2, |
||||
average01: 0, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
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; |
||||
} |
||||
}, |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'second', '*', 'second'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'second', this.cycleTotal); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'second', this.averageTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'second', this.checkboxString); |
||||
break; |
||||
} |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '2') { |
||||
this.$emit('update', 'second', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'second', this.averageTotal); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '4') { |
||||
this.$emit('update', 'second', this.checkboxString); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
@ -1,202 +1,191 @@ |
||||
|
||||
<template> |
||||
<el-form size='small'> |
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="1"> |
||||
周,允许的通配符[, - * ? / L #] |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="1"> |
||||
周,允许的通配符[, - * ? / L #] |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="2"> |
||||
不指定 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="2"> |
||||
不指定 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="3"> |
||||
周期从星期 |
||||
<el-select clearable v-model="cycle01"> |
||||
<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 clearable v-model="cycle02"> |
||||
<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-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="3"> |
||||
周期从星期 |
||||
<el-select v-model="cycle01" clearable> |
||||
<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 v-model="cycle02" clearable> |
||||
<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-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="4"> |
||||
第 |
||||
<el-input-number v-model='average01' :min="1" :max="4" /> 周的星期 |
||||
<el-select clearable v-model="average02"> |
||||
<el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="item.key">{{item.value}}</el-option> |
||||
</el-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="4"> |
||||
第 |
||||
<el-input-number v-model="average01" :min="1" :max="4" /> 周的星期 |
||||
<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-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="5"> |
||||
本月最后一个星期 |
||||
<el-select clearable v-model="weekday"> |
||||
<el-option v-for="(item,index) of weekList" :key="index" :label="item.value" :value="item.key">{{item.value}}</el-option> |
||||
</el-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="5"> |
||||
本月最后一个星期 |
||||
<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-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio v-model='radioValue' :label="6"> |
||||
指定 |
||||
<el-select clearable v-model="checkboxList" 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-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="6"> |
||||
指定 |
||||
<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-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
</el-form> |
||||
</el-form> |
||||
</template> |
||||
|
||||
<!-- eslint-disable vue/no-side-effects-in-computed-properties --> |
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
radioValue: 2, |
||||
weekday: 2, |
||||
cycle01: 2, |
||||
cycle02: 3, |
||||
average01: 1, |
||||
average02: 2, |
||||
checkboxList: [], |
||||
weekList: [ |
||||
{ |
||||
key: 2, |
||||
value: '星期一' |
||||
}, |
||||
{ |
||||
key: 3, |
||||
value: '星期二' |
||||
}, |
||||
{ |
||||
key: 4, |
||||
value: '星期三' |
||||
}, |
||||
{ |
||||
key: 5, |
||||
value: '星期四' |
||||
}, |
||||
{ |
||||
key: 6, |
||||
value: '星期五' |
||||
}, |
||||
{ |
||||
key: 7, |
||||
value: '星期六' |
||||
}, |
||||
{ |
||||
key: 1, |
||||
value: '星期日' |
||||
} |
||||
], |
||||
checkNum: this.$options.propsData.check |
||||
} |
||||
}, |
||||
name: 'crontab-week', |
||||
props: ['check', 'cron'], |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
if (this.radioValue !== 2 && this.cron.day !== '?') { |
||||
this.$emit('update', 'day', '?', 'week'); |
||||
} |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'week', '*'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'week', '?'); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'week', this.cycleTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'week', this.averageTotal); |
||||
break; |
||||
case 5: |
||||
this.$emit('update', 'week', this.weekdayCheck + 'L'); |
||||
break; |
||||
case 6: |
||||
this.$emit('update', 'week', this.checkboxString); |
||||
break; |
||||
} |
||||
}, |
||||
name: 'CrontabWeek', |
||||
props: ['check', 'cron'], |
||||
data() { |
||||
return { |
||||
radioValue: 2, |
||||
weekday: 2, |
||||
cycle01: 2, |
||||
cycle02: 3, |
||||
average01: 1, |
||||
average02: 2, |
||||
checkboxList: [], |
||||
weekList: [ |
||||
{ |
||||
key: 2, |
||||
value: '星期一' |
||||
}, |
||||
{ |
||||
key: 3, |
||||
value: '星期二' |
||||
}, |
||||
{ |
||||
key: 4, |
||||
value: '星期三' |
||||
}, |
||||
{ |
||||
key: 5, |
||||
value: '星期四' |
||||
}, |
||||
{ |
||||
key: 6, |
||||
value: '星期五' |
||||
}, |
||||
{ |
||||
key: 7, |
||||
value: '星期六' |
||||
}, |
||||
{ |
||||
key: 1, |
||||
value: '星期日' |
||||
} |
||||
], |
||||
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; |
||||
} |
||||
}, |
||||
watch: { |
||||
radioValue: 'radioChange', |
||||
cycleTotal: 'cycleChange', |
||||
averageTotal: 'averageChange', |
||||
weekdayCheck: 'weekdayChange', |
||||
checkboxString: 'checkboxChange' |
||||
}, |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
if (this.radioValue !== 2 && this.cron.day !== '?') { |
||||
this.$emit('update', 'day', '?', 'week'); |
||||
} |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'week', '*'); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'week', '?'); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'week', this.cycleTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'week', this.averageTotal); |
||||
break; |
||||
case 5: |
||||
this.$emit('update', 'week', this.weekdayCheck + 'L'); |
||||
break; |
||||
case 6: |
||||
this.$emit('update', 'week', this.checkboxString); |
||||
break; |
||||
} |
||||
}, |
||||
|
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'week', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '4') { |
||||
this.$emit('update', 'week', this.averageTotal); |
||||
} |
||||
}, |
||||
// 最近工作日值变化时 |
||||
weekdayChange() { |
||||
if (this.radioValue == '5') { |
||||
this.$emit('update', 'week', this.weekday + 'L'); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '6') { |
||||
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; |
||||
} |
||||
} |
||||
} |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'week', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '4') { |
||||
this.$emit('update', 'week', this.averageTotal); |
||||
} |
||||
}, |
||||
// 最近工作日值变化时 |
||||
weekdayChange() { |
||||
if (this.radioValue == '5') { |
||||
this.$emit('update', 'week', this.weekday + 'L'); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '6') { |
||||
this.$emit('update', 'week', this.checkboxString); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
@ -1,131 +1,131 @@ |
||||
<template> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio :label="1" v-model='radioValue'> |
||||
不填,允许的通配符[, - * /] |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form size="small"> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="1"> |
||||
不填,允许的通配符[, - * /] |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio :label="2" v-model='radioValue'> |
||||
每年 |
||||
</el-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="2"> |
||||
每年 |
||||
</el-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio :label="3" v-model='radioValue'> |
||||
周期从 |
||||
<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-radio> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="3"> |
||||
周期从 |
||||
<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-radio> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio :label="4" v-model='radioValue'> |
||||
从 |
||||
<el-input-number v-model='average01' :min='fullYear' :max="2098"/> 年开始,每 |
||||
<el-input-number v-model='average02' :min="1" :max="2099 - average01 || fullYear" /> 年执行一次 |
||||
</el-radio> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="4"> |
||||
从 |
||||
<el-input-number v-model="average01" :min="fullYear" :max="2098" /> 年开始,每 |
||||
<el-input-number v-model="average02" :min="1" :max="2099 - average01 || fullYear" /> 年执行一次 |
||||
</el-radio> |
||||
|
||||
</el-form-item> |
||||
</el-form-item> |
||||
|
||||
<el-form-item> |
||||
<el-radio :label="5" v-model='radioValue'> |
||||
指定 |
||||
<el-select clearable v-model="checkboxList" placeholder="可多选" multiple> |
||||
<el-option v-for="item in 9" :key="item" :value="item - 1 + fullYear" :label="item -1 + fullYear" /> |
||||
</el-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
<el-form-item> |
||||
<el-radio v-model="radioValue" :label="5"> |
||||
指定 |
||||
<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-select> |
||||
</el-radio> |
||||
</el-form-item> |
||||
</el-form> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
fullYear: 0, |
||||
radioValue: 1, |
||||
cycle01: 0, |
||||
cycle02: 0, |
||||
average01: 0, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
checkNum: this.$options.propsData.check |
||||
} |
||||
}, |
||||
name: 'crontab-year', |
||||
props: ['check', 'month', 'cron'], |
||||
methods: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'year', ''); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'year', '*'); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'year', this.cycleTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'year', this.averageTotal); |
||||
break; |
||||
case 5: |
||||
this.$emit('update', 'year', this.checkboxString); |
||||
break; |
||||
} |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'year', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '4') { |
||||
this.$emit('update', 'year', this.averageTotal); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '5') { |
||||
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 |
||||
} |
||||
} |
||||
name: 'CrontabYear', |
||||
props: ['check', 'month', 'cron'], |
||||
data() { |
||||
return { |
||||
fullYear: 0, |
||||
radioValue: 1, |
||||
cycle01: 0, |
||||
cycle02: 0, |
||||
average01: 0, |
||||
average02: 1, |
||||
checkboxList: [], |
||||
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; |
||||
} |
||||
}, |
||||
watch: { |
||||
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: { |
||||
// 单选按钮值变化时 |
||||
radioChange() { |
||||
switch (this.radioValue) { |
||||
case 1: |
||||
this.$emit('update', 'year', ''); |
||||
break; |
||||
case 2: |
||||
this.$emit('update', 'year', '*'); |
||||
break; |
||||
case 3: |
||||
this.$emit('update', 'year', this.cycleTotal); |
||||
break; |
||||
case 4: |
||||
this.$emit('update', 'year', this.averageTotal); |
||||
break; |
||||
case 5: |
||||
this.$emit('update', 'year', this.checkboxString); |
||||
break; |
||||
} |
||||
}, |
||||
// 周期两个值变化时 |
||||
cycleChange() { |
||||
if (this.radioValue == '3') { |
||||
this.$emit('update', 'year', this.cycleTotal); |
||||
} |
||||
}, |
||||
// 平均两个值变化时 |
||||
averageChange() { |
||||
if (this.radioValue == '4') { |
||||
this.$emit('update', 'year', this.averageTotal); |
||||
} |
||||
}, |
||||
// checkbox值变化时 |
||||
checkboxChange() { |
||||
if (this.radioValue == '5') { |
||||
this.$emit('update', 'year', this.checkboxString); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
@ -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 requireAll = requireContext => requireContext.keys() |
||||
const re = /\.\/(.*)\.svg/; |
||||
|
||||
const re = /\.\/(.*)\.svg/ |
||||
const icons = requireAll(req).map((i) => { |
||||
return i.match(re)[1]; |
||||
}); |
||||
|
||||
const icons = requireAll(req).map(i => { |
||||
return i.match(re)[1] |
||||
}) |
||||
|
||||
export default icons |
||||
export default icons; |
||||
|
@ -1,3 +1,3 @@ |
||||
<template > |
||||
<template> |
||||
<router-view /> |
||||
</template> |
||||
|
@ -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> |
@ -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> |
@ -1,34 +1,38 @@ |
||||
/** |
||||
* v-dialogDragWidth 可拖动弹窗高度(右下角) |
||||
* Copyright (c) 2019 ruoyi |
||||
*/ |
||||
* v-dialogDragWidth 可拖动弹窗高度(右下角) |
||||
* Copyright (c) 2019 ruoyi |
||||
*/ |
||||
|
||||
export default { |
||||
bind(el) { |
||||
const dragDom = el.querySelector('.el-dialog'); |
||||
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.addEventListener('mousedown', |
||||
function(e) { |
||||
// 鼠标按下,计算当前元素距离可视区的距离
|
||||
const disX = e.clientX - el.offsetLeft; |
||||
const disY = e.clientY - el.offsetTop; |
||||
// 当前宽度 高度
|
||||
const curWidth = dragDom.offsetWidth; |
||||
const curHeight = dragDom.offsetHeight; |
||||
document.onmousemove = function(e) { |
||||
e.preventDefault(); // 移动时禁用默认事件
|
||||
// 通过事件委托,计算移动的距离
|
||||
const xl = e.clientX - disX; |
||||
const yl = e.clientY - disY |
||||
dragDom.style.width = `${curWidth + xl}px`; |
||||
dragDom.style.height = `${curHeight + yl}px`; |
||||
}; |
||||
document.onmouseup = function(e) { |
||||
document.onmousemove = null; |
||||
document.onmouseup = null; |
||||
}; |
||||
}, false); |
||||
dragDom.appendChild(lineEl); |
||||
} |
||||
} |
||||
bind(el) { |
||||
const dragDom = el.querySelector('.el-dialog'); |
||||
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.addEventListener( |
||||
'mousedown', |
||||
function (e) { |
||||
// 鼠标按下,计算当前元素距离可视区的距离
|
||||
const disX = e.clientX - el.offsetLeft; |
||||
const disY = e.clientY - el.offsetTop; |
||||
// 当前宽度 高度
|
||||
const curWidth = dragDom.offsetWidth; |
||||
const curHeight = dragDom.offsetHeight; |
||||
document.onmousemove = function (e) { |
||||
e.preventDefault(); // 移动时禁用默认事件
|
||||
// 通过事件委托,计算移动的距离
|
||||
const xl = e.clientX - disX; |
||||
const yl = e.clientY - disY; |
||||
dragDom.style.width = `${curWidth + xl}px`; |
||||
dragDom.style.height = `${curHeight + yl}px`; |
||||
}; |
||||
document.onmouseup = function (e) { |
||||
document.onmousemove = null; |
||||
document.onmouseup = null; |
||||
}; |
||||
}, |
||||
false |
||||
); |
||||
dragDom.appendChild(lineEl); |
||||
} |
||||
}; |
||||
|
@ -1,30 +1,34 @@ |
||||
/** |
||||
* v-dialogDragWidth 可拖动弹窗宽度(右侧边) |
||||
* Copyright (c) 2019 ruoyi |
||||
*/ |
||||
* v-dialogDragWidth 可拖动弹窗宽度(右侧边) |
||||
* Copyright (c) 2019 ruoyi |
||||
*/ |
||||
|
||||
export default { |
||||
bind(el) { |
||||
const dragDom = el.querySelector('.el-dialog'); |
||||
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.addEventListener('mousedown', |
||||
function (e) { |
||||
// 鼠标按下,计算当前元素距离可视区的距离
|
||||
const disX = e.clientX - el.offsetLeft; |
||||
// 当前宽度
|
||||
const curWidth = dragDom.offsetWidth; |
||||
document.onmousemove = function (e) { |
||||
e.preventDefault(); // 移动时禁用默认事件
|
||||
// 通过事件委托,计算移动的距离
|
||||
const l = e.clientX - disX; |
||||
dragDom.style.width = `${curWidth + l}px`; |
||||
}; |
||||
document.onmouseup = function (e) { |
||||
document.onmousemove = null; |
||||
document.onmouseup = null; |
||||
}; |
||||
}, false); |
||||
dragDom.appendChild(lineEl); |
||||
} |
||||
} |
||||
bind(el) { |
||||
const dragDom = el.querySelector('.el-dialog'); |
||||
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.addEventListener( |
||||
'mousedown', |
||||
function (e) { |
||||
// 鼠标按下,计算当前元素距离可视区的距离
|
||||
const disX = e.clientX - el.offsetLeft; |
||||
// 当前宽度
|
||||
const curWidth = dragDom.offsetWidth; |
||||
document.onmousemove = function (e) { |
||||
e.preventDefault(); // 移动时禁用默认事件
|
||||
// 通过事件委托,计算移动的距离
|
||||
const l = e.clientX - disX; |
||||
dragDom.style.width = `${curWidth + l}px`; |
||||
}; |
||||
document.onmouseup = function (e) { |
||||
document.onmousemove = null; |
||||
document.onmouseup = null; |
||||
}; |
||||
}, |
||||
false |
||||
); |
||||
dragDom.appendChild(lineEl); |
||||
} |
||||
}; |
||||
|
@ -1,28 +1,28 @@ |
||||
/** |
||||
/** |
||||
* v-hasPermi 操作权限处理 |
||||
* Copyright (c) 2019 ruoyi |
||||
*/ |
||||
|
||||
import store from '@/store' |
||||
|
||||
import store from '@/store'; |
||||
|
||||
export default { |
||||
inserted(el, binding, vnode) { |
||||
const { value } = binding |
||||
const all_permission = "*:*:*"; |
||||
const permissions = store.getters && store.getters.permissions |
||||
const { value } = binding; |
||||
const all_permission = '*:*:*'; |
||||
const permissions = store.getters && store.getters.permissions; |
||||
|
||||
if (value && value instanceof Array && value.length > 0) { |
||||
const permissionFlag = value |
||||
const permissionFlag = value; |
||||
|
||||
const hasPermissions = permissions.some(permission => { |
||||
return all_permission === permission || permissionFlag.includes(permission) |
||||
}) |
||||
const hasPermissions = permissions.some((permission) => { |
||||
return all_permission === permission || permissionFlag.includes(permission); |
||||
}); |
||||
|
||||
if (!hasPermissions) { |
||||
el.parentNode && el.parentNode.removeChild(el) |
||||
el.parentNode && el.parentNode.removeChild(el); |
||||
} |
||||
} else { |
||||
throw new Error(`请设置操作权限标签值`) |
||||
throw new Error(`请设置操作权限标签值`); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
|
@ -1,28 +1,28 @@ |
||||
/** |
||||
/** |
||||
* v-hasRole 角色权限处理 |
||||
* Copyright (c) 2019 ruoyi |
||||
*/ |
||||
|
||||
import store from '@/store' |
||||
|
||||
import store from '@/store'; |
||||
|
||||
export default { |
||||
inserted(el, binding, vnode) { |
||||
const { value } = binding |
||||
const super_admin = "admin"; |
||||
const roles = store.getters && store.getters.roles |
||||
const { value } = binding; |
||||
const super_admin = 'admin'; |
||||
const roles = store.getters && store.getters.roles; |
||||
|
||||
if (value && value instanceof Array && value.length > 0) { |
||||
const roleFlag = value |
||||
const roleFlag = value; |
||||
|
||||
const hasRole = roles.some(role => { |
||||
return super_admin === role || roleFlag.includes(role) |
||||
}) |
||||
const hasRole = roles.some((role) => { |
||||
return super_admin === role || roleFlag.includes(role); |
||||
}); |
||||
|
||||
if (!hasRole) { |
||||
el.parentNode && el.parentNode.removeChild(el) |
||||
el.parentNode && el.parentNode.removeChild(el); |
||||
} |
||||
} else { |
||||
throw new Error(`请设置角色权限标签值"`) |
||||
throw new Error(`请设置角色权限标签值"`); |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
|
@ -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("Pagination", Pagination); |
||||
Vue.component("RightToolbar", RightToolbar); |
||||
Vue.component("Editor", Editor); |
||||
Vue.component("FileUpload", FileUpload); |
||||
Vue.component("ImageUpload", ImageUpload); |
||||
Vue.component("ImagePreview", ImagePreview); |
||||
Vue.component('DictTag', DictTag); |
||||
Vue.component('Pagination', Pagination); |
||||
Vue.component('RightToolbar', RightToolbar); |
||||
Vue.component('Editor', Editor); |
||||
Vue.component('FileUpload', FileUpload); |
||||
Vue.component('ImageUpload', ImageUpload); |
||||
Vue.component('ImagePreview', ImagePreview); |
||||
|
||||
DictData.install() |
||||
DictData.install(); |
||||
|
@ -1,4 +1,4 @@ |
||||
import "./global"; |
||||
import "./element"; |
||||
import "./components"; |
||||
import "./func"; |
||||
import './global'; |
||||
import './element'; |
||||
import './components'; |
||||
import './func'; |
||||
|
@ -1,24 +1,18 @@ |
||||
<template> |
||||
<transition-group name="fade-transform" mode="out-in"> |
||||
<inner-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> |
||||
<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" /> |
||||
</transition-group> |
||||
</template> |
||||
|
||||
<script> |
||||
import InnerLink from "../InnerLink/index" |
||||
import InnerLink from '../InnerLink/index'; |
||||
|
||||
export default { |
||||
components: { InnerLink }, |
||||
computed: { |
||||
iframeViews() { |
||||
return this.$store.state.tagsView.iframeViews |
||||
return this.$store.state.tagsView.iframeViews; |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
@ -1,25 +1,25 @@ |
||||
export default { |
||||
computed: { |
||||
device() { |
||||
return this.$store.state.app.device |
||||
return this.$store.state.app.device; |
||||
} |
||||
}, |
||||
mounted() { |
||||
// In order to fix the click on menu on the ios device will trigger the mouseleave bug
|
||||
this.fixBugIniOS() |
||||
this.fixBugIniOS(); |
||||
}, |
||||
methods: { |
||||
fixBugIniOS() { |
||||
const $subMenu = this.$refs.subMenu |
||||
const $subMenu = this.$refs.subMenu; |
||||
if ($subMenu) { |
||||
const handleMouseleave = $subMenu.handleMouseleave |
||||
const handleMouseleave = $subMenu.handleMouseleave; |
||||
$subMenu.handleMouseleave = (e) => { |
||||
if (this.device === 'mobile') { |
||||
return |
||||
return; |
||||
} |
||||
handleMouseleave(e) |
||||
} |
||||
handleMouseleave(e); |
||||
}; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
|
@ -1,57 +1,43 @@ |
||||
<template> |
||||
<div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }"> |
||||
<logo v-if="showLogo" :collapse="isCollapse" /> |
||||
<el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper"> |
||||
<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" |
||||
> |
||||
<sidebar-item |
||||
v-for="(route, index) in sidebarRouters" |
||||
:key="route.path + index" |
||||
:item="route" |
||||
:base-path="route.path" |
||||
/> |
||||
</el-menu> |
||||
</el-scrollbar> |
||||
</div> |
||||
<div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }"> |
||||
<logo v-if="showLogo" :collapse="isCollapse" /> |
||||
<el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper"> |
||||
<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"> |
||||
<sidebar-item v-for="(route, index) in sidebarRouters" :key="route.path + index" :item="route" :base-path="route.path" /> |
||||
</el-menu> |
||||
</el-scrollbar> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import { mapGetters, mapState } from "vuex"; |
||||
import Logo from "./Logo"; |
||||
import SidebarItem from "./SidebarItem"; |
||||
import variables from "@/assets/styles/variables.scss"; |
||||
import { mapGetters, mapState } from 'vuex'; |
||||
import Logo from './Logo'; |
||||
import SidebarItem from './SidebarItem'; |
||||
import variables from '@/assets/styles/variables.scss'; |
||||
|
||||
export default { |
||||
components: { SidebarItem, Logo }, |
||||
computed: { |
||||
...mapState(["settings"]), |
||||
...mapGetters(["sidebarRouters", "sidebar"]), |
||||
activeMenu() { |
||||
const route = this.$route; |
||||
const { meta, path } = route; |
||||
// if set path, the sidebar will highlight the path you set |
||||
if (meta.activeMenu) { |
||||
return meta.activeMenu; |
||||
} |
||||
return path; |
||||
}, |
||||
showLogo() { |
||||
return this.$store.state.settings.sidebarLogo; |
||||
}, |
||||
variables() { |
||||
return variables; |
||||
}, |
||||
isCollapse() { |
||||
return !this.sidebar.opened; |
||||
} |
||||
components: { SidebarItem, Logo }, |
||||
computed: { |
||||
...mapState(['settings']), |
||||
...mapGetters(['sidebarRouters', 'sidebar']), |
||||
activeMenu() { |
||||
const route = this.$route; |
||||
const { meta, path } = route; |
||||
// if set path, the sidebar will highlight the path you set |
||||
if (meta.activeMenu) { |
||||
return meta.activeMenu; |
||||
} |
||||
return path; |
||||
}, |
||||
showLogo() { |
||||
return this.$store.state.settings.sidebarLogo; |
||||
}, |
||||
variables() { |
||||
return variables; |
||||
}, |
||||
isCollapse() { |
||||
return !this.sidebar.opened; |
||||
} |
||||
} |
||||
}; |
||||
</script> |
||||
|
@ -1,5 +1,5 @@ |
||||
export { default as AppMain } from './AppMain' |
||||
export { default as Navbar } from './Navbar' |
||||
export { default as Settings } from './Settings' |
||||
export { default as Sidebar } from './Sidebar/index.vue' |
||||
export { default as TagsView } from './TagsView/index.vue' |
||||
export { default as AppMain } from './AppMain'; |
||||
export { default as Navbar } from './Navbar'; |
||||
export { default as Settings } from './Settings'; |
||||
export { default as Sidebar } from './Sidebar/index.vue'; |
||||
export { default as TagsView } from './TagsView/index.vue'; |
||||
|
@ -1,45 +1,45 @@ |
||||
import store from '@/store' |
||||
import store from '@/store'; |
||||
|
||||
const { body } = document |
||||
const WIDTH = 992 // refer to Bootstrap's responsive design
|
||||
const { body } = document; |
||||
const WIDTH = 992; // refer to Bootstrap's responsive design
|
||||
|
||||
export default { |
||||
watch: { |
||||
$route(route) { |
||||
if (this.device === 'mobile' && this.sidebar.opened) { |
||||
store.dispatch('app/closeSideBar', { withoutAnimation: false }) |
||||
store.dispatch('app/closeSideBar', { withoutAnimation: false }); |
||||
} |
||||
} |
||||
}, |
||||
beforeMount() { |
||||
window.addEventListener('resize', this.$_resizeHandler) |
||||
window.addEventListener('resize', this.$_resizeHandler); |
||||
}, |
||||
beforeDestroy() { |
||||
window.removeEventListener('resize', this.$_resizeHandler) |
||||
window.removeEventListener('resize', this.$_resizeHandler); |
||||
}, |
||||
mounted() { |
||||
const isMobile = this.$_isMobile() |
||||
const isMobile = this.$_isMobile(); |
||||
if (isMobile) { |
||||
store.dispatch('app/toggleDevice', 'mobile') |
||||
store.dispatch('app/closeSideBar', { withoutAnimation: true }) |
||||
store.dispatch('app/toggleDevice', 'mobile'); |
||||
store.dispatch('app/closeSideBar', { withoutAnimation: true }); |
||||
} |
||||
}, |
||||
methods: { |
||||
// use $_ for mixins properties
|
||||
// https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential
|
||||
$_isMobile() { |
||||
const rect = body.getBoundingClientRect() |
||||
return rect.width - 1 < WIDTH |
||||
const rect = body.getBoundingClientRect(); |
||||
return rect.width - 1 < WIDTH; |
||||
}, |
||||
$_resizeHandler() { |
||||
if (!document.hidden) { |
||||
const isMobile = this.$_isMobile() |
||||
store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop') |
||||
const isMobile = this.$_isMobile(); |
||||
store.dispatch('app/toggleDevice', isMobile ? 'mobile' : 'desktop'); |
||||
|
||||
if (isMobile) { |
||||
store.dispatch('app/closeSideBar', { withoutAnimation: true }) |
||||
store.dispatch('app/closeSideBar', { withoutAnimation: true }); |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
}; |
||||
|
@ -1,50 +1,50 @@ |
||||
const state = { |
||||
dict: new Array() |
||||
} |
||||
dict: [] |
||||
}; |
||||
const mutations = { |
||||
SET_DICT: (state, { key, value }) => { |
||||
if (key !== null && key !== "") { |
||||
if (key !== null && key !== '') { |
||||
state.dict.push({ |
||||
key: key, |
||||
value: value |
||||
}) |
||||
}); |
||||
} |
||||
}, |
||||
REMOVE_DICT: (state, key) => { |
||||
try { |
||||
for (let i = 0; i < state.dict.length; i++) { |
||||
if (state.dict[i].key == key) { |
||||
state.dict.splice(i, i) |
||||
return true |
||||
if (state.dict[i].key === key) { |
||||
state.dict.splice(i, i); |
||||
return true; |
||||
} |
||||
} |
||||
} catch (e) { |
||||
console.log(e); |
||||
} |
||||
}, |
||||
CLEAN_DICT: (state) => { |
||||
state.dict = new Array() |
||||
state.dict = []; |
||||
} |
||||
} |
||||
}; |
||||
|
||||
const actions = { |
||||
// 设置字典
|
||||
setDict({ commit }, data) { |
||||
commit('SET_DICT', data) |
||||
commit('SET_DICT', data); |
||||
}, |
||||
// 删除字典
|
||||
removeDict({ commit }, key) { |
||||
commit('REMOVE_DICT', key) |
||||
commit('REMOVE_DICT', key); |
||||
}, |
||||
// 清空字典
|
||||
cleanDict({ commit }) { |
||||
commit('CLEAN_DICT') |
||||
commit('CLEAN_DICT'); |
||||
} |
||||
} |
||||
}; |
||||
|
||||
export default { |
||||
namespaced: true, |
||||
state, |
||||
mutations, |
||||
actions |
||||
} |
||||
|
||||
}; |
||||
|
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue