all
This commit is contained in:
@@ -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,
|
||||
|
||||
Reference in New Issue
Block a user