1067 lines
33 KiB
JavaScript
1067 lines
33 KiB
JavaScript
import { codeLight, __unplugin_components_4 as __unplugin_components_4$1, useHljs, __unplugin_components_8, __unplugin_components_1 as __unplugin_components_1$2 } from "./DropDown2.js";
|
|
import { createTheme, scrollbarLight, derived, createInjectionKey, defineComponent, h, inject, ref, computed, onMounted, watch, toRef, NBaseLoading, cB, c, fadeInScaleUpTransition, cE, Scrollbar, Transition, useConfig, useTheme, provide, useThemeClass, nextTick, warn, cM, resolveWrappedSlot, resolveSlot, throwError, createKey, formatLength, getDefaultExportFromCjs, _export_sfc, useMowerStore, storeToRefs, onUnmounted, useConfigStore, createElementBlock, createBaseVNode, createBlock, createCommentVNode, createVNode, unref, withCtx, normalizeClass, Button, isRef, useCssVars, openBlock, Fragment, renderList, createTextVNode } from "./index.js";
|
|
import { requireVue } from "./index2.js";
|
|
import { Scrollbar as Scrollbar$1 } from "./Scrollbar.js";
|
|
import { useLocale } from "./use-locale.js";
|
|
import { throttle } from "./throttle.js";
|
|
import { useHoudini } from "./use-houdini.js";
|
|
import { __unplugin_components_4 as __unplugin_components_4$2 } from "./Image.js";
|
|
import { __unplugin_components_1 as __unplugin_components_1$1 } from "./Checkbox.js";
|
|
import { NIcon } from "./Icon.js";
|
|
import "./HelpText.js";
|
|
import "./Tooltip.js";
|
|
import "./next-frame-once.js";
|
|
import "./use-compitable.js";
|
|
import "./common.js";
|
|
import "./Add.js";
|
|
import "./Select.js";
|
|
import "./Tag.js";
|
|
import "./create.js";
|
|
import "./get-slot.js";
|
|
import "./Avatar.js";
|
|
import "./utils.js";
|
|
import "./Forward.js";
|
|
import "./Dropdown.js";
|
|
import "./download.js";
|
|
function self$1(vars) {
|
|
const {
|
|
textColor2,
|
|
modalColor,
|
|
borderColor,
|
|
fontSize,
|
|
primaryColor
|
|
} = vars;
|
|
return {
|
|
loaderFontSize: fontSize,
|
|
loaderTextColor: textColor2,
|
|
loaderColor: modalColor,
|
|
loaderBorder: `1px solid ${borderColor}`,
|
|
loadingColor: primaryColor
|
|
};
|
|
}
|
|
const logLight = createTheme({
|
|
name: "Log",
|
|
common: derived,
|
|
peers: {
|
|
Scrollbar: scrollbarLight,
|
|
Code: codeLight
|
|
},
|
|
self: self$1
|
|
});
|
|
const sizeVariables = {
|
|
titleMarginMedium: "0 0 6px 0",
|
|
titleMarginLarge: "-2px 0 6px 0",
|
|
titleFontSizeMedium: "14px",
|
|
titleFontSizeLarge: "16px",
|
|
iconSizeMedium: "14px",
|
|
iconSizeLarge: "14px"
|
|
};
|
|
function self(vars) {
|
|
const {
|
|
textColor3,
|
|
infoColor,
|
|
errorColor,
|
|
successColor,
|
|
warningColor,
|
|
textColor1,
|
|
textColor2,
|
|
railColor,
|
|
fontWeightStrong,
|
|
fontSize
|
|
} = vars;
|
|
return Object.assign(Object.assign({}, sizeVariables), {
|
|
contentFontSize: fontSize,
|
|
titleFontWeight: fontWeightStrong,
|
|
circleBorder: `2px solid ${textColor3}`,
|
|
circleBorderInfo: `2px solid ${infoColor}`,
|
|
circleBorderError: `2px solid ${errorColor}`,
|
|
circleBorderSuccess: `2px solid ${successColor}`,
|
|
circleBorderWarning: `2px solid ${warningColor}`,
|
|
iconColor: textColor3,
|
|
iconColorInfo: infoColor,
|
|
iconColorError: errorColor,
|
|
iconColorSuccess: successColor,
|
|
iconColorWarning: warningColor,
|
|
titleTextColor: textColor1,
|
|
contentTextColor: textColor2,
|
|
metaTextColor: textColor3,
|
|
lineColor: railColor
|
|
});
|
|
}
|
|
const timelineLight = {
|
|
common: derived,
|
|
self
|
|
};
|
|
const logInjectionKey = createInjectionKey("n-log");
|
|
const NLogLine = defineComponent({
|
|
props: {
|
|
line: {
|
|
type: String,
|
|
default: ""
|
|
}
|
|
},
|
|
setup(props) {
|
|
const {
|
|
trimRef,
|
|
highlightRef,
|
|
languageRef,
|
|
mergedHljsRef
|
|
} = inject(logInjectionKey);
|
|
const selfRef = ref(null);
|
|
const maybeTrimmedLinesRef = computed(() => {
|
|
return trimRef.value ? props.line.trim() : props.line;
|
|
});
|
|
function setInnerHTML() {
|
|
if (selfRef.value) {
|
|
selfRef.value.innerHTML = generateCodeHTML(languageRef.value, maybeTrimmedLinesRef.value);
|
|
}
|
|
}
|
|
function generateCodeHTML(language, code) {
|
|
const {
|
|
value: hljs
|
|
} = mergedHljsRef;
|
|
if (hljs) {
|
|
if (language && hljs.getLanguage(language)) {
|
|
return hljs.highlight(code, {
|
|
language
|
|
}).value;
|
|
}
|
|
}
|
|
return code;
|
|
}
|
|
onMounted(() => {
|
|
if (highlightRef.value) {
|
|
setInnerHTML();
|
|
}
|
|
});
|
|
watch(toRef(props, "line"), () => {
|
|
if (highlightRef.value) {
|
|
setInnerHTML();
|
|
}
|
|
});
|
|
return {
|
|
highlight: highlightRef,
|
|
selfRef,
|
|
maybeTrimmedLines: maybeTrimmedLinesRef
|
|
};
|
|
},
|
|
render() {
|
|
const {
|
|
highlight,
|
|
maybeTrimmedLines
|
|
} = this;
|
|
return h("pre", {
|
|
ref: "selfRef"
|
|
}, highlight ? null : maybeTrimmedLines);
|
|
}
|
|
});
|
|
const NLogLoader = defineComponent({
|
|
name: "LogLoader",
|
|
props: {
|
|
clsPrefix: {
|
|
type: String,
|
|
required: true
|
|
}
|
|
},
|
|
setup() {
|
|
return {
|
|
locale: useLocale("Log").localeRef
|
|
};
|
|
},
|
|
render() {
|
|
const {
|
|
clsPrefix
|
|
} = this;
|
|
return h("div", {
|
|
class: `${clsPrefix}-log-loader`
|
|
}, h(NBaseLoading, {
|
|
clsPrefix,
|
|
strokeWidth: 24,
|
|
scale: 0.85
|
|
}), h("span", {
|
|
class: `${clsPrefix}-log-loader__content`
|
|
}, this.locale.loading));
|
|
}
|
|
});
|
|
const style$1 = cB("log", `
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
transition: border-color .3s var(--n-bezier);
|
|
`, [c("pre", `
|
|
white-space: pre-wrap;
|
|
word-break: break-word;
|
|
margin: 0;
|
|
`), cB("log-loader", `
|
|
transition:
|
|
color .3s var(--n-bezier),
|
|
background-color .3s var(--n-bezier),
|
|
border-color .3s var(--n-bezier);
|
|
box-sizing: border-box;
|
|
position: absolute;
|
|
right: 16px;
|
|
top: 8px;
|
|
height: 34px;
|
|
border-radius: 17px;
|
|
line-height: 34px;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
border: var(--n-loader-border);
|
|
color: var(--n-loader-text-color);
|
|
background-color: var(--n-loader-color);
|
|
font-size: var(--n-loader-font-size);
|
|
`, [fadeInScaleUpTransition(), cE("content", `
|
|
display: inline-block;
|
|
vertical-align: bottom;
|
|
line-height: 34px;
|
|
padding-left: 40px;
|
|
padding-right: 20px;
|
|
white-space: nowrap;
|
|
`), cB("base-loading", `
|
|
color: var(--n-loading-color);
|
|
position: absolute;
|
|
left: 12px;
|
|
top: calc(50% - 10px);
|
|
font-size: 20px;
|
|
width: 20px;
|
|
height: 20px;
|
|
display: inline-block;
|
|
`)])]);
|
|
const logProps = Object.assign(Object.assign({}, useTheme.props), {
|
|
loading: Boolean,
|
|
trim: Boolean,
|
|
log: String,
|
|
fontSize: {
|
|
type: Number,
|
|
default: 14
|
|
},
|
|
lines: {
|
|
type: Array,
|
|
default: () => []
|
|
},
|
|
lineHeight: {
|
|
type: Number,
|
|
default: 1.25
|
|
},
|
|
language: String,
|
|
rows: {
|
|
type: Number,
|
|
default: 15
|
|
},
|
|
offsetTop: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
offsetBottom: {
|
|
type: Number,
|
|
default: 0
|
|
},
|
|
hljs: Object,
|
|
onReachTop: Function,
|
|
onReachBottom: Function,
|
|
onRequireMore: Function
|
|
});
|
|
const __unplugin_components_4 = defineComponent({
|
|
name: "Log",
|
|
props: logProps,
|
|
setup(props) {
|
|
const {
|
|
mergedClsPrefixRef,
|
|
inlineThemeDisabled
|
|
} = useConfig(props);
|
|
const silentRef = ref(false);
|
|
const highlightRef = computed(() => {
|
|
return props.language !== void 0;
|
|
});
|
|
const styleHeightRef = computed(() => {
|
|
return `calc(${Math.round(props.rows * props.lineHeight * props.fontSize)}px)`;
|
|
});
|
|
const mergedLinesRef = computed(() => {
|
|
const {
|
|
log
|
|
} = props;
|
|
if (log) {
|
|
return log.split("\n");
|
|
}
|
|
return props.lines;
|
|
});
|
|
const scrollbarRef = ref(null);
|
|
const themeRef = useTheme("Log", "-log", style$1, logLight, props, mergedClsPrefixRef);
|
|
function handleScroll(e) {
|
|
const container = e.target;
|
|
const content = container.firstElementChild;
|
|
if (silentRef.value) {
|
|
void nextTick(() => {
|
|
silentRef.value = false;
|
|
});
|
|
return;
|
|
}
|
|
const containerHeight = container.offsetHeight;
|
|
const containerScrollTop = container.scrollTop;
|
|
const contentHeight = content.offsetHeight;
|
|
const scrollTop = containerScrollTop;
|
|
const scrollBottom = contentHeight - containerScrollTop - containerHeight;
|
|
if (scrollTop <= props.offsetTop) {
|
|
const {
|
|
onReachTop,
|
|
onRequireMore
|
|
} = props;
|
|
if (onRequireMore) onRequireMore("top");
|
|
if (onReachTop) onReachTop();
|
|
}
|
|
if (scrollBottom <= props.offsetBottom) {
|
|
const {
|
|
onReachBottom,
|
|
onRequireMore
|
|
} = props;
|
|
if (onRequireMore) onRequireMore("bottom");
|
|
if (onReachBottom) onReachBottom();
|
|
}
|
|
}
|
|
const handleWheel = throttle(_handleWheel, 300);
|
|
function _handleWheel(e) {
|
|
if (silentRef.value) {
|
|
void nextTick(() => {
|
|
silentRef.value = false;
|
|
});
|
|
return;
|
|
}
|
|
if (scrollbarRef.value) {
|
|
const {
|
|
containerRef,
|
|
contentRef
|
|
} = scrollbarRef.value;
|
|
if (containerRef && contentRef) {
|
|
const containerHeight = containerRef.offsetHeight;
|
|
const containerScrollTop = containerRef.scrollTop;
|
|
const contentHeight = contentRef.offsetHeight;
|
|
const scrollTop = containerScrollTop;
|
|
const scrollBottom = contentHeight - containerScrollTop - containerHeight;
|
|
const deltaY = e.deltaY;
|
|
if (scrollTop === 0 && deltaY < 0) {
|
|
const {
|
|
onRequireMore
|
|
} = props;
|
|
if (onRequireMore) onRequireMore("top");
|
|
}
|
|
if (scrollBottom <= 0 && deltaY > 0) {
|
|
const {
|
|
onRequireMore
|
|
} = props;
|
|
if (onRequireMore) onRequireMore("bottom");
|
|
}
|
|
}
|
|
}
|
|
}
|
|
function scrollTo(options) {
|
|
const {
|
|
value: scrollbarInst
|
|
} = scrollbarRef;
|
|
if (!scrollbarInst) return;
|
|
const {
|
|
silent,
|
|
top,
|
|
position
|
|
} = options;
|
|
if (silent) {
|
|
silentRef.value = true;
|
|
}
|
|
if (top !== void 0) {
|
|
scrollbarInst.scrollTo({
|
|
left: 0,
|
|
top
|
|
});
|
|
} else if (position === "bottom" || position === "top") {
|
|
scrollbarInst.scrollTo({
|
|
position
|
|
});
|
|
}
|
|
}
|
|
function scrollToTop(silent = false) {
|
|
warn("log", "`scrollToTop` is deprecated, please use `scrollTo({ position: 'top'})` instead.");
|
|
scrollTo({
|
|
position: "top",
|
|
silent
|
|
});
|
|
}
|
|
function scrollToBottom(silent = false) {
|
|
warn("log", "`scrollToTop` is deprecated, please use `scrollTo({ position: 'bottom'})` instead.");
|
|
scrollTo({
|
|
position: "bottom",
|
|
silent
|
|
});
|
|
}
|
|
provide(logInjectionKey, {
|
|
languageRef: toRef(props, "language"),
|
|
mergedHljsRef: useHljs(props),
|
|
trimRef: toRef(props, "trim"),
|
|
highlightRef
|
|
});
|
|
const exportedMethods = {
|
|
scrollTo
|
|
};
|
|
const cssVarsRef = computed(() => {
|
|
const {
|
|
self: {
|
|
loaderFontSize,
|
|
loaderTextColor,
|
|
loaderColor,
|
|
loaderBorder,
|
|
loadingColor
|
|
},
|
|
common: {
|
|
cubicBezierEaseInOut
|
|
}
|
|
} = themeRef.value;
|
|
return {
|
|
"--n-bezier": cubicBezierEaseInOut,
|
|
"--n-loader-font-size": loaderFontSize,
|
|
"--n-loader-border": loaderBorder,
|
|
"--n-loader-color": loaderColor,
|
|
"--n-loader-text-color": loaderTextColor,
|
|
"--n-loading-color": loadingColor
|
|
};
|
|
});
|
|
const themeClassHandle = inlineThemeDisabled ? useThemeClass("log", void 0, cssVarsRef, props) : void 0;
|
|
return Object.assign(Object.assign({}, exportedMethods), {
|
|
mergedClsPrefix: mergedClsPrefixRef,
|
|
scrollbarRef,
|
|
mergedTheme: themeRef,
|
|
styleHeight: styleHeightRef,
|
|
mergedLines: mergedLinesRef,
|
|
scrollToTop,
|
|
scrollToBottom,
|
|
handleWheel,
|
|
handleScroll,
|
|
cssVars: inlineThemeDisabled ? void 0 : cssVarsRef,
|
|
themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass,
|
|
onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender
|
|
});
|
|
},
|
|
render() {
|
|
const {
|
|
mergedClsPrefix,
|
|
mergedTheme,
|
|
onRender
|
|
} = this;
|
|
onRender === null || onRender === void 0 ? void 0 : onRender();
|
|
return h("div", {
|
|
class: [`${mergedClsPrefix}-log`, this.themeClass],
|
|
style: [{
|
|
lineHeight: this.lineHeight,
|
|
height: this.styleHeight
|
|
}, this.cssVars],
|
|
onWheelPassive: this.handleWheel
|
|
}, [h(Scrollbar, {
|
|
ref: "scrollbarRef",
|
|
theme: mergedTheme.peers.Scrollbar,
|
|
themeOverrides: mergedTheme.peerOverrides.Scrollbar,
|
|
onScroll: this.handleScroll
|
|
}, {
|
|
default: () => h(__unplugin_components_4$1, {
|
|
internalNoHighlight: true,
|
|
internalFontSize: this.fontSize,
|
|
theme: mergedTheme.peers.Code,
|
|
themeOverrides: mergedTheme.peerOverrides.Code
|
|
}, {
|
|
default: () => this.mergedLines.map((line, index) => {
|
|
return h(NLogLine, {
|
|
key: index,
|
|
line
|
|
});
|
|
})
|
|
})
|
|
}), h(Transition, {
|
|
name: "fade-in-scale-up-transition"
|
|
}, {
|
|
default: () => this.loading ? h(NLogLoader, {
|
|
clsPrefix: mergedClsPrefix
|
|
}) : null
|
|
})]);
|
|
}
|
|
});
|
|
const lineHeight = 1.25;
|
|
const style = cB("timeline", `
|
|
position: relative;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
line-height: ${lineHeight};
|
|
`, [cM("horizontal", `
|
|
flex-direction: row;
|
|
`, [c(">", [cB("timeline-item", `
|
|
flex-shrink: 0;
|
|
padding-right: 40px;
|
|
`, [cM("dashed-line-type", [c(">", [cB("timeline-item-timeline", [cE("line", `
|
|
background-image: linear-gradient(90deg, var(--n-color-start), var(--n-color-start) 50%, transparent 50%, transparent 100%);
|
|
background-size: 10px 1px;
|
|
`)])])]), c(">", [cB("timeline-item-content", `
|
|
margin-top: calc(var(--n-icon-size) + 12px);
|
|
`, [c(">", [cE("meta", `
|
|
margin-top: 6px;
|
|
margin-bottom: unset;
|
|
`)])]), cB("timeline-item-timeline", `
|
|
width: 100%;
|
|
height: calc(var(--n-icon-size) + 12px);
|
|
`, [cE("line", `
|
|
left: var(--n-icon-size);
|
|
top: calc(var(--n-icon-size) / 2 - 1px);
|
|
right: 0px;
|
|
width: unset;
|
|
height: 2px;
|
|
`)])])])])]), cM("right-placement", [cB("timeline-item", [cB("timeline-item-content", `
|
|
text-align: right;
|
|
margin-right: calc(var(--n-icon-size) + 12px);
|
|
`), cB("timeline-item-timeline", `
|
|
width: var(--n-icon-size);
|
|
right: 0;
|
|
`)])]), cM("left-placement", [cB("timeline-item", [cB("timeline-item-content", `
|
|
margin-left: calc(var(--n-icon-size) + 12px);
|
|
`), cB("timeline-item-timeline", `
|
|
left: 0;
|
|
`)])]), cB("timeline-item", `
|
|
position: relative;
|
|
`, [c("&:last-child", [cB("timeline-item-timeline", [cE("line", `
|
|
display: none;
|
|
`)]), cB("timeline-item-content", [cE("meta", `
|
|
margin-bottom: 0;
|
|
`)])]), cB("timeline-item-content", [cE("title", `
|
|
margin: var(--n-title-margin);
|
|
font-size: var(--n-title-font-size);
|
|
transition: color .3s var(--n-bezier);
|
|
font-weight: var(--n-title-font-weight);
|
|
color: var(--n-title-text-color);
|
|
`), cE("content", `
|
|
transition: color .3s var(--n-bezier);
|
|
font-size: var(--n-content-font-size);
|
|
color: var(--n-content-text-color);
|
|
`), cE("meta", `
|
|
transition: color .3s var(--n-bezier);
|
|
font-size: 12px;
|
|
margin-top: 6px;
|
|
margin-bottom: 20px;
|
|
color: var(--n-meta-text-color);
|
|
`)]), cM("dashed-line-type", [cB("timeline-item-timeline", [cE("line", `
|
|
--n-color-start: var(--n-line-color);
|
|
transition: --n-color-start .3s var(--n-bezier);
|
|
background-color: transparent;
|
|
background-image: linear-gradient(180deg, var(--n-color-start), var(--n-color-start) 50%, transparent 50%, transparent 100%);
|
|
background-size: 1px 10px;
|
|
`)])]), cB("timeline-item-timeline", `
|
|
width: calc(var(--n-icon-size) + 12px);
|
|
position: absolute;
|
|
top: calc(var(--n-title-font-size) * ${lineHeight} / 2 - var(--n-icon-size) / 2);
|
|
height: 100%;
|
|
`, [cE("circle", `
|
|
border: var(--n-circle-border);
|
|
transition:
|
|
background-color .3s var(--n-bezier),
|
|
border-color .3s var(--n-bezier);
|
|
width: var(--n-icon-size);
|
|
height: var(--n-icon-size);
|
|
border-radius: var(--n-icon-size);
|
|
box-sizing: border-box;
|
|
`), cE("icon", `
|
|
color: var(--n-icon-color);
|
|
font-size: var(--n-icon-size);
|
|
height: var(--n-icon-size);
|
|
width: var(--n-icon-size);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
`), cE("line", `
|
|
transition: background-color .3s var(--n-bezier);
|
|
position: absolute;
|
|
top: var(--n-icon-size);
|
|
left: calc(var(--n-icon-size) / 2 - 1px);
|
|
bottom: 0px;
|
|
width: 2px;
|
|
background-color: var(--n-line-color);
|
|
`)])])]);
|
|
const timelineProps = Object.assign(Object.assign({}, useTheme.props), {
|
|
horizontal: Boolean,
|
|
itemPlacement: {
|
|
type: String,
|
|
default: "left"
|
|
},
|
|
size: {
|
|
type: String,
|
|
default: "medium"
|
|
},
|
|
iconSize: Number
|
|
});
|
|
const timelineInjectionKey = createInjectionKey("n-timeline");
|
|
const __unplugin_components_2 = defineComponent({
|
|
name: "Timeline",
|
|
props: timelineProps,
|
|
setup(props, {
|
|
slots
|
|
}) {
|
|
const {
|
|
mergedClsPrefixRef
|
|
} = useConfig(props);
|
|
const themeRef = useTheme("Timeline", "-timeline", style, timelineLight, props, mergedClsPrefixRef);
|
|
provide(timelineInjectionKey, {
|
|
props,
|
|
mergedThemeRef: themeRef,
|
|
mergedClsPrefixRef
|
|
});
|
|
return () => {
|
|
const {
|
|
value: mergedClsPrefix
|
|
} = mergedClsPrefixRef;
|
|
return h("div", {
|
|
class: [`${mergedClsPrefix}-timeline`, props.horizontal && `${mergedClsPrefix}-timeline--horizontal`, `${mergedClsPrefix}-timeline--${props.size}-size`, !props.horizontal && `${mergedClsPrefix}-timeline--${props.itemPlacement}-placement`]
|
|
}, slots);
|
|
};
|
|
}
|
|
});
|
|
const timelineItemProps = {
|
|
time: [String, Number],
|
|
title: String,
|
|
content: String,
|
|
color: String,
|
|
lineType: {
|
|
type: String,
|
|
default: "default"
|
|
},
|
|
type: {
|
|
type: String,
|
|
default: "default"
|
|
}
|
|
};
|
|
const __unplugin_components_1 = defineComponent({
|
|
name: "TimelineItem",
|
|
props: timelineItemProps,
|
|
slots: Object,
|
|
setup(props) {
|
|
const NTimeline = inject(timelineInjectionKey);
|
|
if (!NTimeline) {
|
|
throwError("timeline-item", "`n-timeline-item` must be placed inside `n-timeline`.");
|
|
}
|
|
useHoudini();
|
|
const {
|
|
inlineThemeDisabled
|
|
} = useConfig();
|
|
const cssVarsRef = computed(() => {
|
|
const {
|
|
props: {
|
|
size,
|
|
iconSize: iconSizeProp
|
|
},
|
|
mergedThemeRef
|
|
} = NTimeline;
|
|
const {
|
|
type
|
|
} = props;
|
|
const {
|
|
self: {
|
|
titleTextColor,
|
|
contentTextColor,
|
|
metaTextColor,
|
|
lineColor,
|
|
titleFontWeight,
|
|
contentFontSize,
|
|
[createKey("iconSize", size)]: iconSize,
|
|
[createKey("titleMargin", size)]: titleMargin,
|
|
[createKey("titleFontSize", size)]: titleFontSize,
|
|
[createKey("circleBorder", type)]: circleBorder,
|
|
[createKey("iconColor", type)]: iconColor
|
|
},
|
|
common: {
|
|
cubicBezierEaseInOut
|
|
}
|
|
} = mergedThemeRef.value;
|
|
return {
|
|
"--n-bezier": cubicBezierEaseInOut,
|
|
"--n-circle-border": circleBorder,
|
|
"--n-icon-color": iconColor,
|
|
"--n-content-font-size": contentFontSize,
|
|
"--n-content-text-color": contentTextColor,
|
|
"--n-line-color": lineColor,
|
|
"--n-meta-text-color": metaTextColor,
|
|
"--n-title-font-size": titleFontSize,
|
|
"--n-title-font-weight": titleFontWeight,
|
|
"--n-title-margin": titleMargin,
|
|
"--n-title-text-color": titleTextColor,
|
|
"--n-icon-size": formatLength(iconSizeProp) || iconSize
|
|
};
|
|
});
|
|
const themeClassHandle = inlineThemeDisabled ? useThemeClass("timeline-item", computed(() => {
|
|
const {
|
|
props: {
|
|
size,
|
|
iconSize: iconSizeProp
|
|
}
|
|
} = NTimeline;
|
|
const {
|
|
type
|
|
} = props;
|
|
return `${size[0]}${iconSizeProp || "a"}${type[0]}`;
|
|
}), cssVarsRef, NTimeline.props) : void 0;
|
|
return {
|
|
mergedClsPrefix: NTimeline.mergedClsPrefixRef,
|
|
cssVars: inlineThemeDisabled ? void 0 : cssVarsRef,
|
|
themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass,
|
|
onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender
|
|
};
|
|
},
|
|
render() {
|
|
const {
|
|
mergedClsPrefix,
|
|
color,
|
|
onRender,
|
|
$slots
|
|
} = this;
|
|
onRender === null || onRender === void 0 ? void 0 : onRender();
|
|
return h("div", {
|
|
class: [`${mergedClsPrefix}-timeline-item`, this.themeClass, `${mergedClsPrefix}-timeline-item--${this.type}-type`, `${mergedClsPrefix}-timeline-item--${this.lineType}-line-type`],
|
|
style: this.cssVars
|
|
}, h("div", {
|
|
class: `${mergedClsPrefix}-timeline-item-timeline`
|
|
}, h("div", {
|
|
class: `${mergedClsPrefix}-timeline-item-timeline__line`
|
|
}), resolveWrappedSlot($slots.icon, (children) => {
|
|
return children ? h("div", {
|
|
class: `${mergedClsPrefix}-timeline-item-timeline__icon`,
|
|
style: {
|
|
color
|
|
}
|
|
}, children) : h("div", {
|
|
class: `${mergedClsPrefix}-timeline-item-timeline__circle`,
|
|
style: {
|
|
borderColor: color
|
|
}
|
|
});
|
|
})), h("div", {
|
|
class: `${mergedClsPrefix}-timeline-item-content`
|
|
}, resolveWrappedSlot($slots.header, (children) => {
|
|
const mergedChildren = children || this.title;
|
|
if (mergedChildren) {
|
|
return h("div", {
|
|
class: `${mergedClsPrefix}-timeline-item-content__title`
|
|
}, children || this.title);
|
|
}
|
|
return null;
|
|
}), h("div", {
|
|
class: `${mergedClsPrefix}-timeline-item-content__content`
|
|
}, resolveSlot($slots.default, () => [this.content])), h("div", {
|
|
class: `${mergedClsPrefix}-timeline-item-content__meta`
|
|
}, resolveSlot($slots.footer, () => [this.time]))));
|
|
}
|
|
});
|
|
var Play = {};
|
|
var hasRequiredPlay;
|
|
function requirePlay() {
|
|
if (hasRequiredPlay) return Play;
|
|
hasRequiredPlay = 1;
|
|
Object.defineProperty(Play, "__esModule", { value: true });
|
|
const vue_1 = requireVue();
|
|
const _hoisted_12 = {
|
|
xmlns: "http://www.w3.org/2000/svg",
|
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
viewBox: "0 0 512 512"
|
|
};
|
|
Play.default = (0, vue_1.defineComponent)({
|
|
name: "Play",
|
|
render: function render(_ctx, _cache) {
|
|
return (0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(
|
|
"svg",
|
|
_hoisted_12,
|
|
_cache[0] || (_cache[0] = [
|
|
(0, vue_1.createElementVNode)(
|
|
"path",
|
|
{
|
|
d: "M133 440a35.37 35.37 0 0 1-17.5-4.67c-12-6.8-19.46-20-19.46-34.33V111c0-14.37 7.46-27.53 19.46-34.33a35.13 35.13 0 0 1 35.77.45l247.85 148.36a36 36 0 0 1 0 61l-247.89 148.4A35.5 35.5 0 0 1 133 440z",
|
|
fill: "currentColor"
|
|
},
|
|
null,
|
|
-1
|
|
/* HOISTED */
|
|
)
|
|
])
|
|
);
|
|
}
|
|
});
|
|
return Play;
|
|
}
|
|
var PlayExports = /* @__PURE__ */ requirePlay();
|
|
const PlayIcon = /* @__PURE__ */ getDefaultExportFromCjs(PlayExports);
|
|
var Stop = {};
|
|
var hasRequiredStop;
|
|
function requireStop() {
|
|
if (hasRequiredStop) return Stop;
|
|
hasRequiredStop = 1;
|
|
Object.defineProperty(Stop, "__esModule", { value: true });
|
|
const vue_1 = requireVue();
|
|
const _hoisted_12 = {
|
|
xmlns: "http://www.w3.org/2000/svg",
|
|
"xmlns:xlink": "http://www.w3.org/1999/xlink",
|
|
viewBox: "0 0 512 512"
|
|
};
|
|
Stop.default = (0, vue_1.defineComponent)({
|
|
name: "Stop",
|
|
render: function render(_ctx, _cache) {
|
|
return (0, vue_1.openBlock)(), (0, vue_1.createElementBlock)(
|
|
"svg",
|
|
_hoisted_12,
|
|
_cache[0] || (_cache[0] = [
|
|
(0, vue_1.createElementVNode)(
|
|
"path",
|
|
{
|
|
d: "M392 432H120a40 40 0 0 1-40-40V120a40 40 0 0 1 40-40h272a40 40 0 0 1 40 40v272a40 40 0 0 1-40 40z",
|
|
fill: "currentColor"
|
|
},
|
|
null,
|
|
-1
|
|
/* HOISTED */
|
|
)
|
|
])
|
|
);
|
|
}
|
|
});
|
|
return Stop;
|
|
}
|
|
var StopExports = /* @__PURE__ */ requireStop();
|
|
const StopIcon = /* @__PURE__ */ getDefaultExportFromCjs(StopExports);
|
|
const _hoisted_1 = { class: "home-container" };
|
|
const _hoisted_2 = { class: "action-container" };
|
|
const _sfc_main = {
|
|
__name: "Log",
|
|
setup(__props) {
|
|
useCssVars((_ctx) => ({
|
|
"054a8042": unref(bg_size),
|
|
"4a685a07": unref(bg_position)
|
|
}));
|
|
const mower_store = useMowerStore();
|
|
const { ws, log, log_mobile, running, task_list, waiting, get_task_id, sc_uri } = storeToRefs(mower_store);
|
|
const { get_tasks } = mower_store;
|
|
const axios = inject("axios");
|
|
const mobile = inject("mobile");
|
|
const auto_scroll = ref(true);
|
|
onMounted(() => {
|
|
get_tasks();
|
|
updateRemainingTimes();
|
|
});
|
|
onUnmounted(() => {
|
|
clearTimeout(get_task_id.value);
|
|
});
|
|
function start() {
|
|
running.value = true;
|
|
axios.get(`${""}/start`);
|
|
get_tasks();
|
|
}
|
|
function stop() {
|
|
waiting.value = true;
|
|
axios.get(`${""}/stop`).then((response) => {
|
|
running.value = !response.data;
|
|
waiting.value = false;
|
|
});
|
|
}
|
|
const show_task = ref(false);
|
|
const add_task = ref(true);
|
|
provide("show_task", show_task);
|
|
provide("add_task", add_task);
|
|
const config_store = useConfigStore();
|
|
const { conf } = storeToRefs(config_store);
|
|
const bg_size = computed(() => {
|
|
return mobile.value ? "cover, cover" : "753px, cover";
|
|
});
|
|
const bg_position = computed(() => {
|
|
return mobile.value ? "25% 0, 50%, 50%" : "70% -15%, 50% 50%";
|
|
});
|
|
function stop_maa() {
|
|
axios.get(`${""}/stop-maa`);
|
|
}
|
|
const stop_options = [
|
|
{
|
|
label: "停止Maa",
|
|
key: "maa"
|
|
}
|
|
];
|
|
const sc_preview = ref(true);
|
|
watch(sc_preview, (new_value) => {
|
|
ws.value.send(JSON.stringify({ sc: new_value }));
|
|
if (!new_value) {
|
|
sc_uri.value = "";
|
|
}
|
|
});
|
|
const remainingTimes = ref({});
|
|
const calculateRemainingTime = (taskTime) => {
|
|
const now = /* @__PURE__ */ new Date();
|
|
const taskDate = new Date(taskTime);
|
|
const diffInSeconds = Math.floor((taskDate - now) / 1e3);
|
|
if (diffInSeconds <= 0) {
|
|
return "正在执行";
|
|
}
|
|
const hours = Math.floor(diffInSeconds / 3600);
|
|
const minutes = Math.floor(diffInSeconds % 3600 / 60);
|
|
const seconds = diffInSeconds % 60;
|
|
return `${String(hours).padStart(2, "0")}:${String(minutes).padStart(2, "0")}:${String(seconds).padStart(2, "0")}`;
|
|
};
|
|
const updateRemainingTimes = () => {
|
|
task_list.value.forEach((task) => {
|
|
remainingTimes.value[task.time] = calculateRemainingTime(task.time);
|
|
});
|
|
requestAnimationFrame(updateRemainingTimes);
|
|
};
|
|
return (_ctx, _cache) => {
|
|
const _component_n_image = __unplugin_components_4$2;
|
|
const _component_n_timeline_item = __unplugin_components_1;
|
|
const _component_n_timeline = __unplugin_components_2;
|
|
const _component_n_scrollbar = Scrollbar$1;
|
|
const _component_n_log = __unplugin_components_4;
|
|
const _component_n_icon = NIcon;
|
|
const _component_n_button = Button;
|
|
const _component_drop_down = __unplugin_components_8;
|
|
const _component_n_checkbox = __unplugin_components_1$1;
|
|
const _component_task_dialog = __unplugin_components_1$2;
|
|
return openBlock(), createElementBlock("div", _hoisted_1, [
|
|
_cache[3] || (_cache[3] = createBaseVNode("div", { class: "log-bg" }, null, -1)),
|
|
unref(sc_preview) ? (openBlock(), createBlock(_component_n_image, {
|
|
key: 0,
|
|
"preview-disabled": "",
|
|
width: "100%",
|
|
class: "sc",
|
|
src: unref(sc_uri) == "" ? "/bg2.webp" : unref(sc_uri),
|
|
"object-fit": "scale-down"
|
|
}, null, 8, ["src"])) : createCommentVNode("", true),
|
|
createVNode(_component_n_scrollbar, {
|
|
"x-scrollable": "",
|
|
style: { "max-height": "100px" }
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_n_timeline, { horizontal: "" }, {
|
|
default: withCtx(() => [
|
|
(openBlock(true), createElementBlock(Fragment, null, renderList(unref(task_list), (task) => {
|
|
return openBlock(), createElementBlock(Fragment, {
|
|
key: task.time
|
|
}, [
|
|
Object.keys(task.plan).length ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(task.plan, (value, key) => {
|
|
return openBlock(), createBlock(_component_n_timeline_item, {
|
|
key,
|
|
title: key,
|
|
content: value.map((x) => x || "_").join(", "),
|
|
time: `${task.time.split("T")[1].split(".")[0]} (剩余时间: ${unref(remainingTimes)[task.time]})`
|
|
}, null, 8, ["title", "content", "time"]);
|
|
}), 128)) : (openBlock(), createBlock(_component_n_timeline_item, {
|
|
key: task.time,
|
|
content: task.meta_data + task.type.display_value,
|
|
time: `${task.time.split("T")[1].split(".")[0]} (剩余时间: ${unref(remainingTimes)[task.time]})`
|
|
}, null, 8, ["content", "time"]))
|
|
], 64);
|
|
}), 128))
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
_: 1
|
|
}),
|
|
createVNode(_component_n_log, {
|
|
class: normalizeClass(["log", { "auto-scroll": unref(auto_scroll) }]),
|
|
log: unref(mobile) ? unref(log_mobile) : unref(log),
|
|
language: "mower",
|
|
style: { "user-select": "text" }
|
|
}, null, 8, ["class", "log"]),
|
|
createBaseVNode("div", _hoisted_2, [
|
|
unref(running) ? (openBlock(), createBlock(_component_drop_down, {
|
|
key: 0,
|
|
select: stop_maa,
|
|
options: stop_options,
|
|
type: "error",
|
|
up: true
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(_component_n_button, {
|
|
type: "error",
|
|
onClick: stop,
|
|
loading: unref(waiting),
|
|
disabled: unref(waiting)
|
|
}, {
|
|
icon: withCtx(() => [
|
|
createVNode(_component_n_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(unref(StopIcon))
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
default: withCtx(() => [
|
|
!unref(mobile) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
createTextVNode("停止运行")
|
|
], 64)) : createCommentVNode("", true)
|
|
]),
|
|
_: 1
|
|
}, 8, ["loading", "disabled"])
|
|
]),
|
|
_: 1
|
|
})) : (openBlock(), createBlock(_component_n_button, {
|
|
key: 1,
|
|
type: "primary",
|
|
onClick: start,
|
|
loading: unref(waiting),
|
|
disabled: unref(waiting)
|
|
}, {
|
|
icon: withCtx(() => [
|
|
createVNode(_component_n_icon, null, {
|
|
default: withCtx(() => [
|
|
createVNode(unref(PlayIcon))
|
|
]),
|
|
_: 1
|
|
})
|
|
]),
|
|
default: withCtx(() => [
|
|
!unref(mobile) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
createTextVNode("开始运行")
|
|
], 64)) : createCommentVNode("", true)
|
|
]),
|
|
_: 1
|
|
}, 8, ["loading", "disabled"])),
|
|
createVNode(_component_n_checkbox, {
|
|
checked: unref(conf).start_automatically,
|
|
"onUpdate:checked": _cache[0] || (_cache[0] = ($event) => unref(conf).start_automatically = $event)
|
|
}, {
|
|
default: withCtx(() => [
|
|
unref(mobile) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
createTextVNode("自动运行")
|
|
], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
|
|
createTextVNode("启动后自动运行")
|
|
], 64))
|
|
]),
|
|
_: 1
|
|
}, 8, ["checked"]),
|
|
createVNode(_component_n_checkbox, {
|
|
checked: unref(sc_preview),
|
|
"onUpdate:checked": _cache[1] || (_cache[1] = ($event) => isRef(sc_preview) ? sc_preview.value = $event : null)
|
|
}, {
|
|
default: withCtx(() => [
|
|
unref(mobile) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
createTextVNode("截图")
|
|
], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
|
|
createTextVNode("预览截图")
|
|
], 64))
|
|
]),
|
|
_: 1
|
|
}, 8, ["checked"]),
|
|
createVNode(_component_n_checkbox, {
|
|
checked: unref(auto_scroll),
|
|
"onUpdate:checked": _cache[2] || (_cache[2] = ($event) => isRef(auto_scroll) ? auto_scroll.value = $event : null)
|
|
}, {
|
|
default: withCtx(() => [
|
|
unref(mobile) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
|
|
createTextVNode("滚动")
|
|
], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
|
|
createTextVNode("自动滚动日志")
|
|
], 64))
|
|
]),
|
|
_: 1
|
|
}, 8, ["checked"]),
|
|
createVNode(_component_task_dialog)
|
|
])
|
|
]);
|
|
};
|
|
}
|
|
};
|
|
const Log = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-af2dccc2"]]);
|
|
export {
|
|
Log as default
|
|
};
|