Browse Source

完全删除 setdialogtojs

xiaochan 5 months ago
parent
commit
cd4677ae18

+ 0 - 2
src/App.vue

@@ -2,7 +2,6 @@
   <router-view />
   <SocketDialog v-if="socketErrDialog" />
   <progress-bar />
-  <JsDialogComp />
   <CyDialogV2 />
 </template>
 
@@ -15,7 +14,6 @@ import router from "@/router";
 import ProgressBar from "@/components/xiao-chan/progress-bar/ProgressBar.vue";
 import { formatDateToStr } from "@/utils/moment-utils";
 import { ElLink } from "element-plus";
-import JsDialogComp from "@/components/js-dialog-comp/JsDialogComp.vue";
 import { CyMessageBox } from "@/utils/cy-message-box";
 import { useProgressBarStore } from "@/pinia/progress-bar-store";
 import { useUserStore } from "@/pinia/user-store";

+ 184 - 178
src/components/cy/dialog/src/useCyDialog.ts

@@ -1,193 +1,199 @@
-import {ExtractPropTypes, ref, reactive, computed} from 'vue'
-import {useCyNamespace} from "@/utils/xiaochan-element-plus";
-import {useResizeObserver} from "@vueuse/core";
-import {useDraggable} from "element-plus";
-import {ClosingMethod} from "@/components/js-dialog-comp/useDialogToJs";
-
-export const CyDialogProps = {
-    title: String,
-    fullScreen: {
-        type: Boolean,
-        default: false
-    },
-    confirmText: {
-        type: String,
-        default: '确认',
-    },
-    cancelText: {
-        type: String,
-        default: '取消',
-    },
-    confirmClick: {
-        type: Function,
-        default: null
-    },
-    cancelClick: {
-        type: Function,
-        default: null
-    },
-    bodyHeight: {
-        type: [Number, String],
-        default: 'max-content'
-    },
-    bodyWidth: {
-        type: [Number, String],
-        default: '500px'
-    },
-    ignoreError: {
-        type: Boolean,
-        default: false
-    },
-    bodyPadding: {
-        type: String,
-        default: '10px'
-    },
-    showCancelButton: {
-        type: Boolean,
-        default: true,
-    },
+import { ExtractPropTypes, ref, reactive, computed } from "vue";
+import { useCyNamespace } from "@/utils/xiaochan-element-plus";
+import { useResizeObserver } from "@vueuse/core";
+import { useDraggable } from "element-plus";
+
+export enum ClosingMethod {
+  CONFIRM = "confirm",
+  CANCEL = "cancel",
 }
 
-export type IsCyDialog = ExtractPropTypes<typeof CyDialogProps>
+export const CyDialogProps = {
+  title: String,
+  fullScreen: {
+    type: Boolean,
+    default: false,
+  },
+  confirmText: {
+    type: String,
+    default: "确认",
+  },
+  cancelText: {
+    type: String,
+    default: "取消",
+  },
+  confirmClick: {
+    type: Function,
+    default: null,
+  },
+  cancelClick: {
+    type: Function,
+    default: null,
+  },
+  bodyHeight: {
+    type: [Number, String],
+    default: "max-content",
+  },
+  bodyWidth: {
+    type: [Number, String],
+    default: "500px",
+  },
+  ignoreError: {
+    type: Boolean,
+    default: false,
+  },
+  bodyPadding: {
+    type: String,
+    default: "10px",
+  },
+  showCancelButton: {
+    type: Boolean,
+    default: true,
+  },
+};
+
+export type IsCyDialog = ExtractPropTypes<typeof CyDialogProps>;
 
 export function useCyDialog(props: IsCyDialog, emit: any) {
-    const ns = useCyNamespace('dialog')
-    const headerRef = ref()
-    const footerRef = ref()
-    const containerRef = ref()
-    const boxRef = ref()
-    const bodyRef = ref()
-
-    const state = reactive({
-        bodySize: {
-            height: 0,
-            width: 0
-        },
-        headerHeight: 0,
-        footerHeight: 0,
-        confirmLoading: false,
-        cancelLoading: false
-    })
-
-    const draggable = computed(() => {
-        return !props.fullScreen;
-    })
-
-    const bodyStyle = computed(() => {
-        if (props.fullScreen) {
-            return {
-                height: `calc(100% - ${state.headerHeight}px - ${state.footerHeight}px)`,
-                padding: props.bodyPadding,
-                overflowY: 'auto',
-            }
-        } else {
-            return {
-                height: props.bodyHeight,
-                padding: props.bodyPadding,
-                overflowY: 'auto',
-            }
-        }
-    })
-
-    const boxStyle = computed(() => {
-        return {
-            width: props.fullScreen ? "" : props.bodyWidth,
-        }
-    })
-
-    useResizeObserver(headerRef, (entries) => {
-        // @ts-ignore
-        state.headerHeight = entries[0].target.offsetHeight
-    })
-
-    useResizeObserver(footerRef, (entries) => {
-        // @ts-ignore
-        state.footerHeight = entries[0].target.offsetHeight
-    })
-
-    useResizeObserver(bodyRef, (entries) => {
-        state.bodySize = {
-            // @ts-ignore
-            height: entries[0].target.offsetHeight,
-            // @ts-ignore
-            width: entries[0].target.offsetWidth,
-        }
-    })
-
-    useDraggable(boxRef, headerRef, draggable)
-
-
-    function closed(closingMethod: ClosingMethod, val: any) {
-        emit('closed', closingMethod, val)
+  const ns = useCyNamespace("dialog");
+  const headerRef = ref();
+  const footerRef = ref();
+  const containerRef = ref();
+  const boxRef = ref();
+  const bodyRef = ref();
+
+  const state = reactive({
+    bodySize: {
+      height: 0,
+      width: 0,
+    },
+    headerHeight: 0,
+    footerHeight: 0,
+    confirmLoading: false,
+    cancelLoading: false,
+  });
+
+  const draggable = computed(() => {
+    return !props.fullScreen;
+  });
+
+  const bodyStyle = computed(() => {
+    if (props.fullScreen) {
+      return {
+        height: `calc(100% - ${state.headerHeight}px - ${state.footerHeight}px)`,
+        padding: props.bodyPadding,
+        overflowY: "auto",
+      };
+    } else {
+      return {
+        height: props.bodyHeight,
+        padding: props.bodyPadding,
+        overflowY: "auto",
+      };
     }
+  });
 
-    async function handleConfirm() {
-        state.confirmLoading = true;
-
-        function next(val: any) {
-            closed(ClosingMethod.CONFIRM, val)
-        }
-
-        if (props.confirmClick) {
-            try {
-                await props.confirmClick(next)
-            } catch (e) {
-                console.error(e)
-            } finally {
-                state.confirmLoading = false;
-            }
-            return
-        }
-        state.confirmLoading = false;
-        next(null)
+  const boxStyle = computed(() => {
+    return {
+      width: props.fullScreen ? "" : props.bodyWidth,
+    };
+  });
+
+  useResizeObserver(headerRef, entries => {
+    // @ts-ignore
+    state.headerHeight = entries[0].target.offsetHeight;
+  });
+
+  useResizeObserver(footerRef, entries => {
+    // @ts-ignore
+    state.footerHeight = entries[0].target.offsetHeight;
+  });
+
+  useResizeObserver(bodyRef, entries => {
+    state.bodySize = {
+      // @ts-ignore
+      height: entries[0].target.offsetHeight,
+      // @ts-ignore
+      width: entries[0].target.offsetWidth,
+    };
+  });
+
+  useDraggable(boxRef, headerRef, draggable);
+
+  function closed(closingMethod: ClosingMethod, val: any) {
+    emit("closed", closingMethod, val);
+  }
+
+  async function handleConfirm() {
+    state.confirmLoading = true;
+
+    function next(val: any) {
+      closed(ClosingMethod.CONFIRM, val);
     }
 
-    async function handleCancel() {
-        state.cancelLoading = true;
-
-        function next(val: any) {
-            closed(props.ignoreError ? ClosingMethod.CONFIRM : ClosingMethod.CANCEL, val)
-        }
-
-        if (props.cancelClick) {
-            try {
-                await props.cancelClick(next)
-            } catch (e) {
-                console.error(e)
-            } finally {
-                state.cancelLoading = false;
-            }
-            return
-        }
-
-        state.cancelLoading = false;
-        next(null)
+    if (props.confirmClick) {
+      try {
+        await props.confirmClick(next);
+      } catch (e) {
+        console.error(e);
+      } finally {
+        state.confirmLoading = false;
+      }
+      return;
     }
-
-    function onFocusoutPrevented(event: CustomEvent) {
-        if (event.detail?.focusReason === 'pointer') {
-            event.preventDefault()
-        }
+    state.confirmLoading = false;
+    next(null);
+  }
+
+  async function handleCancel() {
+    state.cancelLoading = true;
+
+    function next(val: any) {
+      closed(
+        props.ignoreError ? ClosingMethod.CONFIRM : ClosingMethod.CANCEL,
+        val
+      );
     }
 
-    function onCloseRequested() {
-        handleCancel()
+    if (props.cancelClick) {
+      try {
+        await props.cancelClick(next);
+      } catch (e) {
+        console.error(e);
+      } finally {
+        state.cancelLoading = false;
+      }
+      return;
     }
 
-    return {
-        ns,
-        headerRef,
-        footerRef,
-        bodyStyle,
-        containerRef,
-        boxRef,
-        bodyRef,
-        state,
-        handleConfirm,
-        handleCancel,
-        onFocusoutPrevented,
-        boxStyle,
-        onCloseRequested,
-        closed
+    state.cancelLoading = false;
+    next(null);
+  }
+
+  function onFocusoutPrevented(event: CustomEvent) {
+    if (event.detail?.focusReason === "pointer") {
+      event.preventDefault();
     }
+  }
+
+  function onCloseRequested() {
+    handleCancel();
+  }
+
+  return {
+    ns,
+    headerRef,
+    footerRef,
+    bodyStyle,
+    containerRef,
+    boxRef,
+    bodyRef,
+    state,
+    handleConfirm,
+    handleCancel,
+    onFocusoutPrevented,
+    boxStyle,
+    onCloseRequested,
+    closed,
+  };
 }

+ 0 - 23
src/components/js-dialog-comp/JsDialogComp.vue

@@ -1,23 +0,0 @@
-<template>
-  <div id="cy-js_dialog_comp">
-    <Component v-for="item in comp" :is="item"/>
-  </div>
-</template>
-
-<script setup lang="ts">
-import {compList} from "@/components/js-dialog-comp/useDialogToJs";
-import {computed} from "vue";
-
-const comp = computed(() => {
-  const temp = []
-  for (let key in compList.value) {
-    temp.push(compList.value[key].comp)
-  }
-  return temp
-})
-
-</script>
-
-<style scoped>
-
-</style>

+ 0 - 62
src/components/js-dialog-comp/useDialogToJs.ts

@@ -1,62 +0,0 @@
-import { h, ref } from "vue";
-import { generateRandomString } from "@/utils/getUuid";
-
-export enum ClosingMethod {
-  CONFIRM = "confirm",
-  CANCEL = "cancel",
-}
-
-export const dialogEmits = {
-  ["closed"]: (closingMethod: ClosingMethod, ...val: any[]) =>
-    closingMethod && val,
-};
-
-export const compList = ref<{
-  [key: string]: {
-    onClosed(closingMethod: ClosingMethod, val: any): unknown;
-    comp: any;
-  };
-}>({});
-
-/**
- * @deprecated 请使用 useDialog 方法
- * @see useDialog
- * @param comp 组件
- * @param data 数据
- */
-function setDialogToJs<T extends abstract new (...args: any) => any>(
-  comp: T | any,
-  data: InstanceType<T>["$props"]
-) {
-  return new Promise<any>((resolve, reject) => {
-    const id = "cy-dialog_js__" + generateRandomString(5);
-
-    function del() {
-      delete compList.value[id];
-    }
-
-    const props = {
-      onClosed: (closingMethod: ClosingMethod, val: any) => {
-        if (closingMethod === ClosingMethod.CONFIRM) {
-          resolve(val);
-        } else if (closingMethod === ClosingMethod.CANCEL) {
-          reject(val);
-        } else {
-          reject("使用该功能第一个参数需要为 ClosingMethod 枚举");
-          console.error("使用该功能第一个参数需要为 ClosingMethod 枚举");
-        }
-        del();
-      },
-      id,
-      ...data,
-    };
-    compList.value[id] = {
-      // @ts-ignore
-      comp: h(comp, props),
-      // @ts-ignore
-      onClosed: props.onClosed,
-    };
-  });
-}
-
-export default setDialogToJs;

+ 4 - 4
src/views/hospitalization/zhu-yuan-yi-sheng/electronic-medical-record/emr-editor/EmrMain.vue

@@ -1034,16 +1034,16 @@ function courseJump() {
 }
 
 function jumpById(id: string) {
-  const find = emrStore.store.editor?.view?.container?.find(`#${id}`);
+  const find = editor?.view?.container?.find(`#${id}`);
   if (XEUtils.isEmpty(find)) {
     return;
   }
   const element = find[0];
   if (element) {
     element.view.focusEnter();
-    emrStore.store.editor.scrollToCursor();
-    emrStore.store.editor.highlight(element.view, 1500);
-    emrStore.store.editor.scrollToCursor(true);
+    editor.scrollToCursor();
+    editor.highlight(element.view, 1500);
+    editor.scrollToCursor(true);
   }
 }
 

+ 2 - 2
src/views/hospitalization/zhu-yuan-yi-sheng/electronic-medical-record/emr-editor/plugins/index.ts

@@ -20,12 +20,12 @@ export type Install = {
   install?: (value: { e: EditType; r: any; s: EmrStore }) => void;
 } & ReturnPlugins;
 
-export type EventKey = "loaded" | "componentClick" | string;
+export type EventKey = "loaded" | "componentClick";
 
 export type ReturnPlugins = {
   categoryCode?: string[];
   event?: {
-    [K in EventKey]: any | void;
+    [K in EventKey]: (...arg: any[]) => any | void;
   };
   funcList?: FunctionList[];
   beforeSaving?: (value: BeforeSaving) => any;