✨(component): 整理代码
This commit is contained in:
		
							parent
							
								
									e732e8ed17
								
							
						
					
					
						commit
						d9116dc47e
					
				@ -8,11 +8,11 @@ export default {
 | 
			
		||||
import { inject, Ref } from "vue";
 | 
			
		||||
import { DropdownContext, dropdownInjectionKey } from "../dropdown/interface";
 | 
			
		||||
 | 
			
		||||
export interface LayDropdownMenuItemProps {
 | 
			
		||||
export interface DropdownMenuItemProps {
 | 
			
		||||
  disabled?: boolean;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayDropdownMenuItemProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<DropdownMenuItemProps>(), {
 | 
			
		||||
  disabled: false,
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -14,14 +14,14 @@ import { DropdownPlacement } from "../dropdown/interface";
 | 
			
		||||
 | 
			
		||||
export type DropdownTrigger = "click" | "hover" | "focus" | "contextMenu";
 | 
			
		||||
 | 
			
		||||
export interface LayDropdownSubMenuProps {
 | 
			
		||||
export interface DropdownSubMenuProps {
 | 
			
		||||
  trigger?: DropdownTrigger | DropdownTrigger[];
 | 
			
		||||
  placement?: DropdownPlacement;
 | 
			
		||||
  disabled?: boolean;
 | 
			
		||||
  contentOffset?: number;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayDropdownSubMenuProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<DropdownSubMenuProps>(), {
 | 
			
		||||
  trigger: "hover",
 | 
			
		||||
  disabled: false,
 | 
			
		||||
  placement: "right-start",
 | 
			
		||||
 | 
			
		||||
@ -8,12 +8,12 @@ export default {
 | 
			
		||||
import "./index.less";
 | 
			
		||||
import { useSlots, withDefaults } from "vue";
 | 
			
		||||
 | 
			
		||||
export interface LayEmptyProps {
 | 
			
		||||
export interface EmptyProps {
 | 
			
		||||
  description?: string;
 | 
			
		||||
  image?: string;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayEmptyProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<EmptyProps>(), {
 | 
			
		||||
  description: "暂无数据",
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -7,7 +7,7 @@ export default {
 | 
			
		||||
import { useSlots } from "vue";
 | 
			
		||||
import "./index.less";
 | 
			
		||||
 | 
			
		||||
export interface LayDropdownProps {
 | 
			
		||||
export interface DropdownProps {
 | 
			
		||||
  title?: string;
 | 
			
		||||
  status?: "401" | "403" | "404" | "500";
 | 
			
		||||
  describe?: string;
 | 
			
		||||
@ -15,8 +15,8 @@ export interface LayDropdownProps {
 | 
			
		||||
 | 
			
		||||
const slots = useSlots();
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayDropdownProps>(), {
 | 
			
		||||
  title: "Exception",
 | 
			
		||||
const props = withDefaults(defineProps<DropdownProps>(), {
 | 
			
		||||
  title: "exception",
 | 
			
		||||
  describe: "describe",
 | 
			
		||||
});
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
@ -8,12 +8,12 @@ export default {
 | 
			
		||||
import "./index.less";
 | 
			
		||||
import { useSlots } from "vue";
 | 
			
		||||
 | 
			
		||||
export interface LayFieldProps {
 | 
			
		||||
export interface FieldProps {
 | 
			
		||||
  title?: string;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const slot = useSlots();
 | 
			
		||||
const props = defineProps<LayFieldProps>();
 | 
			
		||||
const props = defineProps<FieldProps>();
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
 | 
			
		||||
@ -10,7 +10,7 @@ import { toRefs, provide, reactive, onMounted } from "vue";
 | 
			
		||||
import { Rule, ValidateError, ValidateMessages } from "async-validator";
 | 
			
		||||
import { LayFormItemContext, FormCallback, modelType } from "../../types/form";
 | 
			
		||||
 | 
			
		||||
export interface LayFormProps {
 | 
			
		||||
export interface FormProps {
 | 
			
		||||
  model?: modelType;
 | 
			
		||||
  required?: boolean;
 | 
			
		||||
  rules?: Rule;
 | 
			
		||||
@ -21,7 +21,7 @@ export interface LayFormProps {
 | 
			
		||||
  useCN?: boolean;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayFormProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<FormProps>(), {
 | 
			
		||||
  model: function () {
 | 
			
		||||
    return {};
 | 
			
		||||
  },
 | 
			
		||||
 | 
			
		||||
@ -28,7 +28,7 @@ import Schema, {
 | 
			
		||||
} from "async-validator";
 | 
			
		||||
import cnValidateMessage from "./cnValidateMessage";
 | 
			
		||||
 | 
			
		||||
export interface LayFormItemProps {
 | 
			
		||||
export interface FormItemProps {
 | 
			
		||||
  prop?: string;
 | 
			
		||||
  mode?: string;
 | 
			
		||||
  label?: string;
 | 
			
		||||
@ -40,7 +40,7 @@ export interface LayFormItemProps {
 | 
			
		||||
  requiredErrorMessage?: string;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayFormItemProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<FormItemProps>(), {
 | 
			
		||||
  mode: "block",
 | 
			
		||||
  labelPosition: "right",
 | 
			
		||||
  labelWidth: 95,
 | 
			
		||||
 | 
			
		||||
@ -15,14 +15,14 @@ import {
 | 
			
		||||
} from "vue";
 | 
			
		||||
import "./index.less";
 | 
			
		||||
 | 
			
		||||
export interface LayFullscreenProps {
 | 
			
		||||
export interface FullscreenProps {
 | 
			
		||||
  target?: HTMLElement;
 | 
			
		||||
  immersive?: boolean;
 | 
			
		||||
  position?: string;
 | 
			
		||||
  zIndex?: string;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayFullscreenProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<FullscreenProps>(), {
 | 
			
		||||
  immersive: true,
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
@ -36,7 +36,7 @@ type MethodMap = [
 | 
			
		||||
  "fullscreenerror"
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
const methodMap: MethodMap[] = [
 | 
			
		||||
const methodMap: any[] = [
 | 
			
		||||
  [
 | 
			
		||||
    "requestFullscreen",
 | 
			
		||||
    "exitFullscreen",
 | 
			
		||||
@ -45,7 +45,6 @@ const methodMap: MethodMap[] = [
 | 
			
		||||
    "fullscreenchange",
 | 
			
		||||
    "fullscreenerror",
 | 
			
		||||
  ],
 | 
			
		||||
  // New WebKit
 | 
			
		||||
  [
 | 
			
		||||
    "webkitRequestFullscreen",
 | 
			
		||||
    "webkitExitFullscreen",
 | 
			
		||||
@ -54,7 +53,6 @@ const methodMap: MethodMap[] = [
 | 
			
		||||
    "webkitfullscreenchange",
 | 
			
		||||
    "webkitfullscreenerror",
 | 
			
		||||
  ],
 | 
			
		||||
  // Old WebKit
 | 
			
		||||
  [
 | 
			
		||||
    "webkitRequestFullScreen",
 | 
			
		||||
    "webkitCancelFullScreen",
 | 
			
		||||
 | 
			
		||||
@ -12,13 +12,13 @@ import LayDropdown from "../dropdown/index.vue";
 | 
			
		||||
import LayInput from "../input/index.vue";
 | 
			
		||||
import LayScroll from "../scroll/index.vue";
 | 
			
		||||
 | 
			
		||||
export interface LayIconPickerProps {
 | 
			
		||||
export interface IconPickerProps {
 | 
			
		||||
  page?: boolean;
 | 
			
		||||
  modelValue?: string;
 | 
			
		||||
  showSearch?: boolean;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayIconPickerProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<IconPickerProps>(), {
 | 
			
		||||
  modelValue: "layui-icon-face-smile",
 | 
			
		||||
  page: false,
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
@ -12,7 +12,7 @@ import layButton from "../button/index.vue";
 | 
			
		||||
import { ref, watch, withDefaults, computed, Ref } from "vue";
 | 
			
		||||
import { InputNumberSize } from "./interface";
 | 
			
		||||
 | 
			
		||||
export interface LayInputNumberProps {
 | 
			
		||||
export interface InputNumberProps {
 | 
			
		||||
  modelValue?: number;
 | 
			
		||||
  name?: string;
 | 
			
		||||
  disabled?: boolean;
 | 
			
		||||
@ -24,7 +24,7 @@ export interface LayInputNumberProps {
 | 
			
		||||
  size?: InputNumberSize;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayInputNumberProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<InputNumberProps>(), {
 | 
			
		||||
  disabled: false,
 | 
			
		||||
  disabledInput: false,
 | 
			
		||||
  modelValue: 0,
 | 
			
		||||
 | 
			
		||||
@ -10,13 +10,13 @@ import Header from "../header/index.vue";
 | 
			
		||||
import Footer from "../footer/index.vue";
 | 
			
		||||
import "./index.less";
 | 
			
		||||
 | 
			
		||||
export interface LayLayoutProps {
 | 
			
		||||
export interface LayoutProps {
 | 
			
		||||
  isVertical?: boolean;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const slots = useSlots();
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayLayoutProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<LayoutProps>(), {
 | 
			
		||||
  isVertical: false,
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -7,7 +7,7 @@ export default {
 | 
			
		||||
<script setup lang="ts">
 | 
			
		||||
import { computed, useSlots } from "vue";
 | 
			
		||||
import "./index.less";
 | 
			
		||||
export interface LayLineProps {
 | 
			
		||||
export interface LineProps {
 | 
			
		||||
  direction?: "horizontal" | "vertical";
 | 
			
		||||
  contentPosition?: "center" | "left" | "right";
 | 
			
		||||
  borderWidth?: string;
 | 
			
		||||
@ -17,7 +17,7 @@ export interface LayLineProps {
 | 
			
		||||
  margin?: string;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayLineProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<LineProps>(), {
 | 
			
		||||
  direction: "horizontal",
 | 
			
		||||
  contentPosition: "center",
 | 
			
		||||
  borderWidth: "1px",
 | 
			
		||||
 | 
			
		||||
@ -9,7 +9,7 @@ import { computed, ComputedRef, provide, Ref, ref, watch } from "vue";
 | 
			
		||||
import { provideLevel } from "./useLevel";
 | 
			
		||||
import "./index.less";
 | 
			
		||||
 | 
			
		||||
export interface LayMenuProps {
 | 
			
		||||
export interface MenuProps {
 | 
			
		||||
  selectedKey?: string;
 | 
			
		||||
  openKeys?: string[];
 | 
			
		||||
  tree?: boolean;
 | 
			
		||||
@ -28,7 +28,7 @@ const emit = defineEmits([
 | 
			
		||||
  "changeOpenKeys",
 | 
			
		||||
]);
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayMenuProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<MenuProps>(), {
 | 
			
		||||
  selectedKey: "",
 | 
			
		||||
  openKeys: () => [],
 | 
			
		||||
  tree: false,
 | 
			
		||||
@ -70,14 +70,9 @@ const selectedKey = computed({
 | 
			
		||||
  },
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
const indent = computed({
 | 
			
		||||
  get() {
 | 
			
		||||
    return props.indent;
 | 
			
		||||
  },
 | 
			
		||||
  set(val) {
 | 
			
		||||
    // emit("update:indent", val);
 | 
			
		||||
  },
 | 
			
		||||
});
 | 
			
		||||
const indent = computed(() => {
 | 
			
		||||
  return props.indent;
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
watch(
 | 
			
		||||
  () => props.collapse,
 | 
			
		||||
 | 
			
		||||
@ -11,13 +11,13 @@ import useLevel from "../menu/useLevel";
 | 
			
		||||
import { indentHandle } from "../menu/utils";
 | 
			
		||||
import LayTooltip from "../tooltip/index.vue";
 | 
			
		||||
 | 
			
		||||
export interface LayMenuItemProps {
 | 
			
		||||
export interface MenuItemProps {
 | 
			
		||||
  id: string;
 | 
			
		||||
  title?: string;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const slots = useSlots();
 | 
			
		||||
const props = defineProps<LayMenuItemProps>();
 | 
			
		||||
const props = defineProps<MenuItemProps>();
 | 
			
		||||
const { level } = useLevel();
 | 
			
		||||
const selectedKey: Ref<string> = inject("selectedKey") as Ref<string>;
 | 
			
		||||
const isTree = inject("isTree") as ComputedRef<boolean>;
 | 
			
		||||
 | 
			
		||||
@ -11,13 +11,13 @@ import SubMenuPopup from "./SubMenuPopup.vue";
 | 
			
		||||
import { indentHandle } from "../menu/utils";
 | 
			
		||||
import { provideLevel, default as useLevel } from "../menu/useLevel";
 | 
			
		||||
 | 
			
		||||
export interface LaySubMenuProps {
 | 
			
		||||
export interface SubMenuProps {
 | 
			
		||||
  id: string;
 | 
			
		||||
  title?: string;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const slots = useSlots();
 | 
			
		||||
const props = defineProps<LaySubMenuProps>();
 | 
			
		||||
const props = defineProps<SubMenuProps>();
 | 
			
		||||
 | 
			
		||||
const { level } = useLevel();
 | 
			
		||||
const isTree: Ref<boolean> = inject("isTree") as Ref<boolean>;
 | 
			
		||||
@ -45,7 +45,6 @@ watchEffect(() => {
 | 
			
		||||
    const _isCollapse =
 | 
			
		||||
      isCollapse.value === true || isCollapse.value === "true";
 | 
			
		||||
    if (_isCollapse && level.value === 1) {
 | 
			
		||||
      // 动画结束后改变
 | 
			
		||||
      setTimeout(() => {
 | 
			
		||||
        needPopup.value = isTree.value && _isCollapse;
 | 
			
		||||
      }, 200);
 | 
			
		||||
 | 
			
		||||
@ -7,8 +7,9 @@ export default {
 | 
			
		||||
<script setup lang="ts">
 | 
			
		||||
import { computed } from "vue";
 | 
			
		||||
import "./index.less";
 | 
			
		||||
import { SwitchSize } from "./interface";
 | 
			
		||||
 | 
			
		||||
export interface LaySwitchProps {
 | 
			
		||||
export interface SwitchProps {
 | 
			
		||||
  name?: string;
 | 
			
		||||
  disabled?: boolean;
 | 
			
		||||
  modelValue?: string | number | boolean;
 | 
			
		||||
@ -18,12 +19,12 @@ export interface LaySwitchProps {
 | 
			
		||||
  unswitchColor?: string;
 | 
			
		||||
  onswitchValue?: string | number | boolean;
 | 
			
		||||
  unswitchValue?: string | number | boolean;
 | 
			
		||||
  size?: "lg" | "md" | "sm" | "xs";
 | 
			
		||||
  size?: SwitchSize;
 | 
			
		||||
  loadingIcon?: string;
 | 
			
		||||
  loading?: boolean;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LaySwitchProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<SwitchProps>(), {
 | 
			
		||||
  disabled: false,
 | 
			
		||||
  onswitchValue: true,
 | 
			
		||||
  unswitchValue: false,
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										1
									
								
								package/component/src/component/switch/interface.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										1
									
								
								package/component/src/component/switch/interface.ts
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1 @@
 | 
			
		||||
export type SwitchSize = "lg" | "md" | "sm" | "xs";
 | 
			
		||||
@ -29,15 +29,13 @@ import {
 | 
			
		||||
  Fragment,
 | 
			
		||||
} from "vue";
 | 
			
		||||
import { useResizeObserver } from "@vueuse/core";
 | 
			
		||||
import { TabData, TabInjectKey } from "./interface";
 | 
			
		||||
import { TabData, TabInjectKey, TabPosition } from "./interface";
 | 
			
		||||
 | 
			
		||||
export type tabPositionType = "top" | "bottom" | "left" | "right";
 | 
			
		||||
 | 
			
		||||
export interface LayTabProps {
 | 
			
		||||
export interface TabProps {
 | 
			
		||||
  type?: string;
 | 
			
		||||
  modelValue: string;
 | 
			
		||||
  allowClose?: boolean;
 | 
			
		||||
  tabPosition?: tabPositionType;
 | 
			
		||||
  tabPosition?: TabPosition;
 | 
			
		||||
  beforeClose?: Function;
 | 
			
		||||
  beforeLeave?: Function;
 | 
			
		||||
  activeBarTransition?: boolean;
 | 
			
		||||
@ -58,7 +56,7 @@ const setItemInstanceBySlot = function (nodeList: VNode[]) {
 | 
			
		||||
  });
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayTabProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<TabProps>(), {
 | 
			
		||||
  tabPosition: "top",
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -15,3 +15,5 @@ export interface TabsContext {
 | 
			
		||||
  addItem: (id: string, data: TabData) => void;
 | 
			
		||||
  removeItem: (id: string) => void;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export type TabPosition = "top" | "bottom" | "left" | "right";
 | 
			
		||||
@ -8,24 +8,21 @@ export default {
 | 
			
		||||
import {
 | 
			
		||||
  withDefaults,
 | 
			
		||||
  inject,
 | 
			
		||||
  Ref,
 | 
			
		||||
  useSlots,
 | 
			
		||||
  getCurrentInstance,
 | 
			
		||||
  computed,
 | 
			
		||||
  reactive,
 | 
			
		||||
  onBeforeUnmount,
 | 
			
		||||
  toRefs,
 | 
			
		||||
} from "vue";
 | 
			
		||||
import { TabInjectKey, TabsContext } from "../tab/interface";
 | 
			
		||||
 | 
			
		||||
export interface LayTabItemProps {
 | 
			
		||||
export interface TabItemProps {
 | 
			
		||||
  id: string;
 | 
			
		||||
  title?: string | Function;
 | 
			
		||||
  icon?: string | Function;
 | 
			
		||||
  closable?: boolean | string;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayTabItemProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<TabItemProps>(), {
 | 
			
		||||
  closable: true,
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -25,7 +25,7 @@ import TableRow from "./TableRow.vue";
 | 
			
		||||
import TablePage from "./TablePage.vue";
 | 
			
		||||
import { nextTick } from "vue";
 | 
			
		||||
 | 
			
		||||
export interface LayTableProps {
 | 
			
		||||
export interface TableProps {
 | 
			
		||||
  id?: string;
 | 
			
		||||
  skin?: string;
 | 
			
		||||
  size?: string;
 | 
			
		||||
@ -53,7 +53,7 @@ export interface LayTableProps {
 | 
			
		||||
  getRadioProps?: Function;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(defineProps<LayTableProps>(), {
 | 
			
		||||
const props = withDefaults(defineProps<TableProps>(), {
 | 
			
		||||
  id: "id",
 | 
			
		||||
  size: "md",
 | 
			
		||||
  indentSize: 30,
 | 
			
		||||
@ -909,4 +909,4 @@ onBeforeUnmount(() => {
 | 
			
		||||
      </div>
 | 
			
		||||
    </div>
 | 
			
		||||
  </div>
 | 
			
		||||
</template>
 | 
			
		||||
</template>
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user