|
@@ -3,6 +3,7 @@
|
|
|
placement="bottom"
|
|
|
v-if="current.length"
|
|
|
v-model:open="visible"
|
|
|
+ overlayClassName="style-float-select-overlay"
|
|
|
:trigger="['click']"
|
|
|
>
|
|
|
<div class="fsd">
|
|
@@ -56,7 +57,7 @@
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
import { styleTypes } from "@/api";
|
|
|
-import { computed, ref, watchEffect } from "vue";
|
|
|
+import { computed, nextTick, ref, watch, watchEffect } from "vue";
|
|
|
import { Menu, Dropdown } from "ant-design-vue";
|
|
|
import { DownOutlined } from "@ant-design/icons-vue";
|
|
|
import { taggings, getTaggingStyle } from "@/store";
|
|
@@ -125,6 +126,29 @@ const visible = ref(false);
|
|
|
const items = computed(() => getItems(types.value));
|
|
|
const current = computed(() => getCurrentItem(props.value));
|
|
|
|
|
|
+const oldValue = ref(props.value);
|
|
|
+watchEffect(() => {
|
|
|
+ if (!current.value[current.value.length - 1].children?.length) {
|
|
|
+ oldValue.value = props.value;
|
|
|
+ }
|
|
|
+});
|
|
|
+watch(visible, (visible) => {
|
|
|
+ nextTick(() => {
|
|
|
+ if (visible) {
|
|
|
+ document
|
|
|
+ .querySelector(".style-float-select-overlay")
|
|
|
+ ?.parentElement?.classList.add("style-float-select-overlay-parent");
|
|
|
+ } else {
|
|
|
+ document
|
|
|
+ .querySelector(".style-float-select-overlay")
|
|
|
+ ?.parentElement?.classList.remove("style-float-select-overlay-parent");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (!visible && current.value[current.value.length - 1].children?.length) {
|
|
|
+ emit("update:value", oldValue.value);
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
if (props.count && props.all) {
|
|
|
watchEffect(() => {
|
|
|
if (
|
|
@@ -222,4 +246,9 @@ span {
|
|
|
.ant-dropdown-menu {
|
|
|
border-radius: 2px !important;
|
|
|
}
|
|
|
+.style-float-select-overlay-parent {
|
|
|
+ position: absolute;
|
|
|
+ inset: 0;
|
|
|
+ z-index: 1050;
|
|
|
+}
|
|
|
</style>
|