update 优化props 使用propTypes

src/components/BuildCode/index.vue

@@ -11,15 +11,11 @@
 
 <script setup lang="ts">
 
+import { propTypes } from "@/utils/propTypes";
+
 const props = defineProps({
-  showBtn: {
+  showBtn: propTypes.bool.def(false),
-    type: Boolean,
+  formJson: propTypes.object.def({})
-    default: false
-  },
-  formJson: {
-    type: Object,
-    default: undefined
-  }
 })
 
 const designerConfig = reactive({
@@ -32,12 +28,9 @@ const designerConfig = reactive({
   formTemplates: true
 })
 
-const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const buildRef = ref();
 const emits = defineEmits(['reJson', 'saveDesign']);
 
-
-
 //获取表单json
 const getJson = () => {
   const formJson = JSON.stringify(buildRef.value.getFormJson())

src/components/BuildCode/render.vue

@@ -1,22 +1,15 @@
 <!-- 动态表单渲染 -->
 <script setup name="Render">
 
+import { propTypes } from "@/utils/propTypes";
+
 const props = defineProps({
-  formJson: {
+  formJson: propTypes.oneOfType([propTypes.object, propTypes.string]).def(''),
-    type: [String, Object],
+  formData: propTypes.oneOfType([propTypes.object, propTypes.string]).def(''),
-    default: ""
+  isView: propTypes.bool.def(false)
-  },
-  formData: {
-    type: [String, Object],
-    default: ""
-  },
-  isView: {
-    type: Boolean,
-    default: false
-  }
 })
 
-const vFormRef = ref(null)
+const vFormRef = ref()
 // 获取表单数据-异步
 const getFormData = () => {
   return vFormRef.value.getFormData()
@@ -24,7 +17,7 @@ const getFormData = () => {
 
 /**
  * 设置表单内容
- * @param {表单配置} formConf
+ * @param { * } formConf
  * formConfig：{ formTemplate：表单模板，formData：表单数据，hiddenField：需要隐藏的字段字符串集合，disabledField：需要禁用的自读字符串集合}
  */
 const initForm = (formConf) => {

src/components/DictTag/index.vue

@@ -25,16 +25,13 @@
 
 <script setup lang="ts">
 import { propTypes } from '@/utils/propTypes';
-
+import { array } from "vue-types";
 
 const props = defineProps({
   // 数据
-  options: {
+  options: array<DictDataOption>().def([]),
-    type: Array as PropType<DictDataOption[]>,
-    default: null,
-  },
   // 当前的值
-  value: [Number, String, Array] as PropType<number | string | Array<number | string>>,
+  value: propTypes.oneOfType([propTypes.string, propTypes.number, array<number | string>()]),
   // 当未找到匹配的数据时，显示value
   showValue: propTypes.bool.def(true),
 });

src/components/ImagePreview/index.vue

@@ -13,14 +13,8 @@ import { propTypes } from '@/utils/propTypes';
 
 const props = defineProps({
   src: propTypes.string.def(''),
-  width: {
+  width: propTypes.oneOfType([propTypes.string, propTypes.number]).def(''),
-    type: [Number, String],
+  height: propTypes.oneOfType([propTypes.string, propTypes.number]).def('')
-    default: ""
-  },
-  height: {
-    type: [Number, String],
-    default: ""
-  }
 });
 
 const realSrc = computed(() => {
@@ -33,7 +27,7 @@ const realSrc = computed(() => {
 
 const realSrcList = computed(() => {
   if (!props.src) {
-    return;
+    return [];
   }
   let real_src_list = props.src.split(",");
   let srcList: string[] = [];

src/components/ImageUpload/index.vue

@@ -55,10 +55,7 @@ const props = defineProps({
     // 文件类型, 例如['png', 'jpg', 'jpeg']
     fileType: propTypes.array.def(["png", "jpg", "jpeg"]),
     // 是否显示提示
-    isShowTip: {
+    isShowTip: propTypes.bool.def(true)
-        type: Boolean,
-        default: true
-    },
 });
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;

src/components/Pagination/index.vue

@@ -22,16 +22,14 @@ export default {
 
 <script setup lang="ts">
 import { scrollTo } from '@/utils/scroll-to'
-import { propTypes } from "@/utils/propTypes";
+import { propTypes } from '@/utils/propTypes';
+import { array } from 'vue-types';
 
 const props = defineProps({
     total: propTypes.number,
     page: propTypes.number.def(1),
     limit: propTypes.number.def(20),
-    pageSizes: {
+    pageSizes: array<number>().def([10, 20, 30, 50]),
-      type: Array as PropType<number[]>,
-      default: () => [10, 20, 30, 50]
-    },
     // 移动端页码按钮的数量端默认值5
     pagerCount: propTypes.number.def(document.body.clientWidth < 992 ? 5 : 7),
     layout: propTypes.string.def('total, sizes, prev, pager, next, jumper'),

src/components/RightToolbar/index.vue

@@ -19,12 +19,11 @@
 
 <script setup lang="ts">
 import { propTypes } from '@/utils/propTypes';
+import { array } from "vue-types";
 
 const props = defineProps({
     showSearch: propTypes.bool.def(true),
-    columns: {
+    columns: array<FieldOption>(),
-        type: Array as PropType<FieldOption[]>,
-    },
     search: propTypes.bool.def(true),
     gutter: propTypes.number.def(10),
 })

src/components/TreeSelect/index.vue

@@ -30,40 +30,23 @@
 
 <script setup lang="ts">
 
+import { propTypes } from "@/utils/propTypes";
+
 const props = defineProps({
   /* 配置项 */
-  objMap: {
+  objMap: propTypes.object.def({
-    type: Object,
-    default: () => {
-      return {
     value: 'id', // ID字段名
     label: 'label', // 显示名称
     children: 'children' // 子级字段名
-      }
+  }),
-    }
-  },
   /* 自动收起 */
-  accordion: {
+  accordion: propTypes.bool.def(false),
-    type: Boolean,
-    default: () => {
-      return false
-    }
-  },
   /**当前双向数据绑定的值 */
-  value: {
+  value: propTypes.oneOfType([propTypes.string, propTypes.number]),
-    type: [String, Number],
-    default: ''
-  },
   /**当前的数据 */
-  options: {
+  options: propTypes.array.def([]),
-    type: Array,
-    default: () => []
-  },
   /**输入框内部的文字 */
-  placeholder: {
+  placeholder: propTypes.string.def('')
-    type: String,
-    default: ''
-  }
 })
 
 

src/layout/components/InnerLink/index.vue

@@ -5,14 +5,11 @@
 </template>
 
 <script setup lang="ts">
+import { propTypes } from '@/utils/propTypes';
+
 const props = defineProps({
-    src: {
+    src: propTypes.string.def('/'),
-        type: String,
+    iframeId: propTypes.string
-        default: "/"
-    },
-    iframeId: {
-        type: String
-    }
 });
-const height = ref(document.documentElement.clientHeight - 94.5 + "px");
+const height = ref(document.documentElement.clientHeight - 94.5 + 'px');
 </script>

src/layout/components/Sidebar/Link.vue

@@ -6,12 +6,10 @@
 
 <script setup lang="ts">
 import { isExternal } from '@/utils/validate'
+import { propTypes } from "@/utils/propTypes";
 
 const props = defineProps({
-    to: {
+    to: propTypes.oneOfType([propTypes.string, propTypes.object]).isRequired
-        type: [String, Object],
-        required: true
-    }
 })
 
 const isExt = computed(() => {
@@ -25,7 +23,7 @@ const type = computed(() => {
     return 'router-link'
 })
 
-function linkProps() {
+const linkProps = () => {
     if (isExt.value) {
         return {
             href: props.to,

src/layout/components/Sidebar/Logo.vue

@@ -26,13 +26,11 @@ import variables from '@/assets/styles/variables.module.scss'
 import logo from '@/assets/logo/logo.png'
 import useSettingsStore from '@/store/modules/settings'
 import { ComponentInternalInstance } from "vue";
+import { propTypes } from "@/utils/propTypes";
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 
 defineProps({
-    collapse: {
+    collapse: propTypes.bool.def(true)
-        type: Boolean,
-        required: true
-    }
 })
 
 const title = ref('RuoYi-Vue-Plus');

src/layout/components/Sidebar/SidebarItem.vue

@@ -35,6 +35,7 @@ import AppLink from './Link.vue'
 import { getNormalPath } from '@/utils/ruoyi'
 import { RouteOption } from "vue-router";
 import { PropType } from "vue";
+import { propTypes } from "@/utils/propTypes";
 
 const props = defineProps({
     // route object
@@ -42,14 +43,8 @@ const props = defineProps({
         type: Object as PropType<RouteOption>,
         required: true
     },
-    isNest: {
+    isNest: propTypes.bool.def(false),
-        type: Boolean,
+    basePath: propTypes.string.def('')
-        default: false
-    },
-    basePath: {
-        type: String,
-        default: ''
-    }
 })
 
 const onlyOneChild = ref<any>({});