This commit is contained in:
2024-09-24 17:04:44 +08:00
parent 6cd84e0021
commit 30528311c1
77 changed files with 2251 additions and 1361 deletions

View File

@@ -21,35 +21,38 @@ const _sfc_main = defineComponent({
onMounted(() => {
const boxWidth = target.value.offsetWidth;
const boxHeight = target.value.offsetHeight;
target.value.addEventListener("mousemove", (event) => {
if (domStatus.value && domEvent.value) {
const prevDom = domEvent.value.target.previousElementSibling;
const nextDom = domEvent.value.target.nextElementSibling;
if (!props.vertical) {
const prevDomLeft = domEvent.value.target.previousElementSibling.offsetLeft;
const prevDomWidth = domEvent.value.target.previousElementSibling.offsetWidth;
const nextDomWidth = domEvent.value.target.nextElementSibling.offsetWidth;
const otherWidth = boxWidth - (prevDomWidth + nextDomWidth + 5);
const otherWidthPercentage = (prevDomWidth + nextDomWidth + 5) / boxWidth * 100;
if (event.layerX - prevDomLeft < props.minSize || boxWidth - (event.layerX - prevDomLeft) - otherWidth < props.minSize) {
return false;
target.value.addEventListener(
"mousemove",
(event) => {
if (domStatus.value && domEvent.value) {
const prevDom = domEvent.value.target.previousElementSibling;
const nextDom = domEvent.value.target.nextElementSibling;
if (!props.vertical) {
const prevDomLeft = domEvent.value.target.previousElementSibling.offsetLeft;
const prevDomWidth = domEvent.value.target.previousElementSibling.offsetWidth;
const nextDomWidth = domEvent.value.target.nextElementSibling.offsetWidth;
const otherWidth = boxWidth - (prevDomWidth + nextDomWidth + 5);
const otherWidthPercentage = (prevDomWidth + nextDomWidth + 5) / boxWidth * 100;
if (event.layerX - prevDomLeft < props.minSize || boxWidth - (event.layerX - prevDomLeft) - otherWidth < props.minSize) {
return false;
}
prevDom.style.flexBasis = (event.layerX - prevDomLeft) / (prevDomWidth + nextDomWidth + 5) * otherWidthPercentage + "%";
nextDom.style.flexBasis = (boxWidth - (event.layerX - prevDomLeft) - otherWidth) / (prevDomWidth + nextDomWidth + 5) * otherWidthPercentage + "%";
} else {
const prevDomTop = domEvent.value.target.previousElementSibling.offsetTop;
const prevDomHeight = domEvent.value.target.previousElementSibling.offsetHeight;
const nextDomHeight = domEvent.value.target.nextElementSibling.offsetHeight;
const otherHeight = boxHeight - (prevDomHeight + nextDomHeight + 5);
const otherHeightPercentage = (prevDomHeight + nextDomHeight + 5) / boxHeight * 100;
if (event.layerY - prevDomTop < props.minSize || boxHeight - (event.layerY - prevDomTop) - otherHeight < props.minSize) {
return false;
}
prevDom.style.flexBasis = (event.layerY - prevDomTop) / (prevDomHeight + nextDomHeight + 5) * otherHeightPercentage + "%";
nextDom.style.flexBasis = (boxHeight - (event.layerY - prevDomTop) - otherHeight) / (prevDomHeight + nextDomHeight + 5) * otherHeightPercentage + "%";
}
prevDom.style.flexBasis = (event.layerX - prevDomLeft) / (prevDomWidth + nextDomWidth + 5) * otherWidthPercentage + "%";
nextDom.style.flexBasis = (boxWidth - (event.layerX - prevDomLeft) - otherWidth) / (prevDomWidth + nextDomWidth + 5) * otherWidthPercentage + "%";
} else {
const prevDomTop = domEvent.value.target.previousElementSibling.offsetTop;
const prevDomHeight = domEvent.value.target.previousElementSibling.offsetHeight;
const nextDomHeight = domEvent.value.target.nextElementSibling.offsetHeight;
const otherHeight = boxHeight - (prevDomHeight + nextDomHeight + 5);
const otherHeightPercentage = (prevDomHeight + nextDomHeight + 5) / boxHeight * 100;
if (event.layerY - prevDomTop < props.minSize || boxHeight - (event.layerY - prevDomTop) - otherHeight < props.minSize) {
return false;
}
prevDom.style.flexBasis = (event.layerY - prevDomTop) / (prevDomHeight + nextDomHeight + 5) * otherHeightPercentage + "%";
nextDom.style.flexBasis = (boxHeight - (event.layerY - prevDomTop) - otherHeight) / (prevDomHeight + nextDomHeight + 5) * otherHeightPercentage + "%";
}
}
});
);
});
const moveChange = (event, status, isVertical) => {
domEvent.value = event;
@@ -63,9 +66,11 @@ const _sfc_main = defineComponent({
};
const steps = ref([]);
watch(steps, () => {
steps.value.forEach((instance, index2) => {
instance.setIndex(index2);
});
steps.value.forEach(
(instance, index2) => {
instance.setIndex(index2);
}
);
});
provide("laySplitPanel", {
props,