feat(projects): theme store完成

src/hooks/common/index.ts

@@ -3,5 +3,6 @@ import useBoolean from './useBoolean';
 import useLoading from './useLoading';
 import useLoadingEmpty from './useLoadingEmpty';
 import useReload from './useReload';
+import useModalVisible from './useModalVisible';
 
-export { useContext, useBoolean, useLoading, useLoadingEmpty, useReload };
+export { useContext, useBoolean, useLoading, useLoadingEmpty, useReload, useModalVisible };

src/hooks/common/useModalVisible.ts

@@ -0,0 +1,34 @@
+import { watch, onUnmounted } from 'vue';
+import useBoolean from './useBoolean';
+
+/**
+ * 使用弹窗
+ * @param hide - 关闭html滚动条
+ */
+export default function useModalVisible(hideScroll = true) {
+  const { bool: visible, setTrue: openModal, setFalse: closeModal, toggle: toggleModal } = useBoolean();
+
+  const stopHandle = watch(visible, async newValue => {
+    if (hideScroll) {
+      const className = 'overflow-hidden';
+      if (newValue) {
+        document.body.classList.add(className);
+      } else {
+        setTimeout(() => {
+          document.body.classList.remove(className);
+        }, 300);
+      }
+    }
+  });
+
+  onUnmounted(() => {
+    stopHandle();
+  });
+
+  return {
+    visible,
+    openModal,
+    closeModal,
+    toggleModal
+  };
+}