update 修改组件 去除无用引用和代码缩进

src/components/BuildCode/index.vue

@@ -1,8 +1,6 @@
 <!-- 代码构建 -->
 <script setup lang="ts">
 
-import { ComponentInternalInstance } from "vue";
-
 const props = defineProps({
   showBtn: {
     type: Boolean,

src/components/DictTag/index.vue

@@ -24,7 +24,7 @@
 </template>
 
 <script setup lang="ts">
-import { PropType } from 'vue';
+import { propTypes } from '@/utils/propTypes';
 
 
 const props = defineProps({
@@ -36,10 +36,7 @@ const props = defineProps({
   // 当前的值
   value: [Number, String, Array] as PropType<number | string | Array<number | string>>,
   // 当未找到匹配的数据时，显示value
-  showValue: {
-    type: Boolean as PropType<boolean>,
-    default: true,
-  },
+  showValue: propTypes.bool.def(true),
 });
 
 const values = computed(() => {

src/components/Editor/index.vue

@@ -30,38 +30,21 @@
 import { QuillEditor, Quill } from '@vueup/vue-quill';
 import '@vueup/vue-quill/dist/vue-quill.snow.css';
 import { getToken } from "@/utils/auth";
-import { ComponentInternalInstance } from "vue";
+import { propTypes } from '@/utils/propTypes';
 
 const props = defineProps({
   /* 编辑器的内容 */
-    modelValue: {
-        type: String,
-    },
+  modelValue: propTypes.string,
   /* 高度 */
-    height: {
-        type: Number,
-        default: null,
-    },
+  height: propTypes.number.def(400),
   /* 最小高度 */
-    minHeight: {
-        type: Number,
-        default: null,
-    },
+  minHeight: propTypes.number.def(400),
   /* 只读 */
-    readOnly: {
-        type: Boolean,
-        default: false,
-    },
+  readOnly: propTypes.bool.def(false),
   /* 上传文件大小限制(MB) */
-    fileSize: {
-        type: Number,
-        default: 5,
-    },
+  fileSize: propTypes.number.def(5),
   /* 类型（base64格式、url格式） */
-    type: {
-        type: String,
-        default: "url",
-    }
+  type: propTypes.string.def('url')
 });
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -166,16 +149,20 @@ const handleUploadError = (err: any) => {
 </script>
 
 <style>
-.editor, .ql-toolbar {
+.editor,
+.ql-toolbar {
   white-space: pre-wrap !important;
   line-height: normal !important;
 }
+
 .quill-img {
   display: none;
 }
+
 .ql-snow .ql-tooltip[data-mode="link"]::before {
   content: "请输入链接地址:";
 }
+
 .ql-snow .ql-tooltip.ql-editing a.ql-action::after {
   border-right: 0;
   content: "保存";
@@ -190,14 +177,17 @@ const handleUploadError = (err: any) => {
 .ql-snow .ql-picker.ql-size .ql-picker-item::before {
   content: "14px";
 }
+
 .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
 .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
   content: "10px";
 }
+
 .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
 .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
   content: "18px";
 }
+
 .ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before,
 .ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
   content: "32px";
@@ -207,26 +197,32 @@ const handleUploadError = (err: any) => {
 .ql-snow .ql-picker.ql-header .ql-picker-item::before {
   content: "文本";
 }
+
 .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
 .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
   content: "标题1";
 }
+
 .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
 .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
   content: "标题2";
 }
+
 .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
 .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
   content: "标题3";
 }
+
 .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
 .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
   content: "标题4";
 }
+
 .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
 .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
   content: "标题5";
 }
+
 .ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
 .ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
   content: "标题6";
@@ -236,10 +232,12 @@ const handleUploadError = (err: any) => {
 .ql-snow .ql-picker.ql-font .ql-picker-item::before {
   content: "标准字体";
 }
+
 .ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before,
 .ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
   content: "衬线字体";
 }
+
 .ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before,
 .ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
   content: "等宽字体";

src/components/FileUpload/index.vue

@@ -45,31 +45,18 @@
 <script setup lang="ts">
 import { getToken } from "@/utils/auth";
 import { listByIds, delOss } from "@/api/system/oss";
-import { ComponentInternalInstance } from "vue";
-import { ElUpload, UploadFile } from "element-plus";
+import { propTypes } from '@/utils/propTypes';
 
 const props = defineProps({
     modelValue: [String, Object, Array],
     // 数量限制
-    limit: {
-        type: Number,
-        default: 5,
-    },
+    limit: propTypes.number.def(5),
     // 大小限制(MB)
-    fileSize: {
-        type: Number,
-        default: 5,
-    },
+    fileSize: propTypes.number.def(5),
     // 文件类型, 例如['png', 'jpg', 'jpeg']
-    fileType: {
-        type: Array,
-        default: () => ["doc", "xls", "ppt", "txt", "pdf"],
-    },
+    fileType: propTypes.array.def(["doc", "xls", "ppt", "txt", "pdf"]),
     // 是否显示提示
-    isShowTip: {
-        type: Boolean,
-        default: true
-    }
+    isShowTip: propTypes.bool.def(true),
 });
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -86,7 +73,7 @@ const showTip = computed(
     () => props.isShowTip && (props.fileType || props.fileSize)
 );
 
-const fileUploadRef = ref(ElUpload);
+const fileUploadRef = ref<ElUploadInstance>();
 
 watch(() => props.modelValue, async val => {
     if (val) {
@@ -158,7 +145,7 @@ const handleUploadSuccess = (res:any, file: UploadFile) => {
         number.value--;
         proxy?.$modal.closeLoading();
         proxy?.$modal.msgError(res.msg);
-        fileUploadRef.value.handleRemove(file);
+        fileUploadRef.value?.handleRemove(file);
         uploadedSuccessfully();
     }
 }
@@ -209,18 +196,21 @@ const listToString = (list: any[], separator?: string) => {
 .upload-file-uploader {
     margin-bottom: 5px;
 }
+
 .upload-file-list .el-upload-list__item {
     border: 1px solid #e4e7ed;
     line-height: 2;
     margin-bottom: 10px;
     position: relative;
 }
+
 .upload-file-list .ele-upload-list__item-content {
     display: flex;
     justify-content: space-between;
     align-items: center;
     color: inherit;
 }
+
 .ele-upload-list__item-content-action .el-link {
     margin-right: 10px;
 }

src/components/Hamburger/index.vue

@@ -9,11 +9,10 @@
 </template>
 
 <script setup lang="ts">
+import { propTypes } from '@/utils/propTypes';
+
 defineProps({
-    isActive: {
-        type: Boolean,
-        default: false
-    }
+  isActive: propTypes.bool.def(false)
 })
 
 const emit = defineEmits(['toggleClick'])

src/components/HeaderSearch/index.vue

@@ -23,7 +23,6 @@ import { getNormalPath } from '@/utils/ruoyi';
 import { isHttp } from '@/utils/validate';
 import usePermissionStore from '@/store/modules/permission';
 import { RouteOption } from 'vue-router';
-import { ElSelect } from 'element-plus';
 
 type Router = Array<{
     path: string;
@@ -35,7 +34,7 @@ const options = ref<any>([]);
 const searchPool = ref<Router>([]);
 const show = ref(false);
 const fuse = ref();
-const headerSearchSelectRef = ref(ElSelect);
+const headerSearchSelectRef = ref<ElSelectInstance>();
 const router = useRouter();
 const routes = computed(() => usePermissionStore().routes);
 

src/components/IconSelect/index.vue

@@ -31,17 +31,11 @@
 
 <script setup lang="ts">
 import icons from '@/components/IconSelect/requireIcons';
+import { propTypes } from '@/utils/propTypes';
 
 const props = defineProps({
-  modelValue: {
-    type: String,
-    require: true
-  },
-  width: {
-    type: String,
-    require: false,
-    default: '400px'
-  }
+  modelValue: propTypes.string.isRequired,
+  width: propTypes.string.def('400px')
 });
 
 const emit = defineEmits(['update:modelValue']);

src/components/ImagePreview/index.vue

@@ -9,11 +9,10 @@
 </template>
 
 <script setup lang="ts">
+import { propTypes } from '@/utils/propTypes';
+
 const props = defineProps({
-    src: {
-        type: String,
-        default: ""
-    },
+  src: propTypes.string.def(''),
   width: {
     type: [Number, String],
     default: ""
@@ -58,13 +57,16 @@ const realHeight = computed(() =>
   border-radius: 5px;
   background-color: #ebeef5;
   box-shadow: 0 0 5px 1px #ccc;
+
   :deep(.el-image__inner) {
     transition: all 0.3s;
     cursor: pointer;
+
     &:hover {
       transform: scale(1.2);
     }
   }
+
   :deep(.image-slot) {
     display: flex;
     justify-content: center;

src/components/ImageUpload/index.vue

@@ -17,7 +17,9 @@
       :on-preview="handlePictureCardPreview"
       :class="{ hide: fileList.length >= limit }"
     >
-      <el-icon class="avatar-uploader-icon"><plus /></el-icon>
+      <el-icon class="avatar-uploader-icon">
+        <plus />
+      </el-icon>
     </el-upload>
     <!-- 上传提示 -->
     <div class="el-upload__tip" v-if="showTip">
@@ -42,25 +44,16 @@ import { getToken } from "@/utils/auth";
 import { listByIds, delOss } from "@/api/system/oss";
 import { ComponentInternalInstance, PropType } from "vue";
 import { OssVO } from "@/api/system/oss/types";
-import { ElUpload, UploadFile } from "element-plus";
+import { propTypes } from '@/utils/propTypes';
 
 const props = defineProps({
     modelValue: [String, Object, Array],
     // 图片数量限制
-    limit: {
-        type: Number,
-        default: 5,
-    },
+    limit: propTypes.number.def(5),
     // 大小限制(MB)
-    fileSize: {
-        type: Number,
-        default: 5,
-    },
+    fileSize: propTypes.number.def(5),
     // 文件类型, 例如['png', 'jpg', 'jpeg']
-    fileType: {
-        type: Array as PropType<string[]>,
-        default: () => ["png", "jpg", "jpeg"],
-    },
+    fileType: propTypes.array.def(["png", "jpg", "jpeg"]),
     // 是否显示提示
     isShowTip: {
         type: Boolean,
@@ -84,7 +77,7 @@ const showTip = computed(
     () => props.isShowTip && (props.fileType || props.fileSize)
 );
 
-const imageUploadRef = ref(ElUpload);
+const imageUploadRef = ref<ElUploadInstance>();
 
 watch(() => props.modelValue, async val => {
     if (val) {
@@ -122,7 +115,7 @@ const handleBeforeUpload = (file: any) => {
         if (file.name.lastIndexOf(".") > -1) {
             fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
         }
-        isImg = props.fileType.some((type) => {
+        isImg = props.fileType.some((type: any) => {
             if (file.type.indexOf(type) > -1) return true;
             if (fileExtension && fileExtension.indexOf(type) > -1) return true;
             return false;
@@ -161,7 +154,7 @@ const handleUploadSuccess = (res: any, file: UploadFile) => {
         number.value--;
         proxy?.$modal.closeLoading();
         proxy?.$modal.msgError(res.msg);
-        imageUploadRef.value.handleRemove(file);
+        imageUploadRef.value?.handleRemove(file);
         uploadedSuccessfully();
     }
 }

src/components/RightToolbar/index.vue

@@ -18,25 +18,15 @@
 </template>
 
 <script setup lang="ts">
-import { TransferKey } from "element-plus";
-import { PropType } from "vue";
+import { propTypes } from '@/utils/propTypes';
 
 const props = defineProps({
-    showSearch: {
-        type: Boolean,
-        default: true,
-    },
+    showSearch: propTypes.bool.def(true),
     columns: {
         type: Array as PropType<FieldOption[]>,
     },
-    search: {
-        type: Boolean,
-        default: true,
-    },
-    gutter: {
-        type: Number,
-        default: 10,
-    },
+    search: propTypes.bool.def(true),
+    gutter: propTypes.number.def(10),
 })
 
 const emits = defineEmits(['update:showSearch', 'queryTable']);

src/components/SvgIcon/index.vue

@@ -5,19 +5,12 @@
 </template>
 
 <script setup lang="ts">
+import { propTypes } from '@/utils/propTypes';
+
 const props = defineProps({
-    iconClass: {
-        type: String,
-        required: true
-    },
-    className: {
-        type: String,
-        default: ''
-    },
-    color: {
-        type: String,
-        default: ''
-    },
+    iconClass: propTypes.string.isRequired,
+    className: propTypes.string.def(''),
+    color: propTypes.string.def(''),
 })
 const iconName =  computed(() => `#icon-${props.iconClass}`);
 const svgClass = computed(() => {

src/components/TreeSelect/index.vue

@@ -29,7 +29,6 @@
 </template>
 
 <script setup lang="ts">
-import { ElTreeSelect } from 'element-plus'
 
 const props = defineProps({
   /* 配置项 */
@@ -68,7 +67,7 @@ const props = defineProps({
 })
 
 
-const selectTree = ref(ElTreeSelect);
+const selectTree = ref<ElTreeSelectInstance>();
 
 const emit = defineEmits(['update:value']);
 
@@ -81,14 +80,14 @@ const valueId = computed({
 const valueTitle = ref('');
 const defaultExpandedKey = ref<any[]>([]);
 
-function initHandle() {
+const initHandle = () => {
   nextTick(() => {
     const selectedValue = valueId.value;
     if (selectedValue !== null && typeof (selectedValue) !== 'undefined') {
-    const node = selectTree.value.getNode(selectedValue)
+      const node = selectTree.value?.getNode(selectedValue)
       if (node) {
         valueTitle.value = node.data[props.objMap.label]
-    selectTree.value.setCurrentKey(selectedValue) // 设置默认选中
+        selectTree.value?.setCurrentKey(selectedValue) // 设置默认选中
         defaultExpandedKey.value = [selectedValue] // 设置默认展开
       }
     } else {
@@ -96,27 +95,27 @@ function initHandle() {
     }
   })
 }
-function handleNodeClick(node: any) {
+const handleNodeClick = (node: any) => {
   valueTitle.value = node[props.objMap.label]
   valueId.value = node[props.objMap.value];
   defaultExpandedKey.value = [];
-  selectTree.value.blur()
+  selectTree.value?.blur()
   selectFilterData('')
 }
-function selectFilterData(val: any) {
-  selectTree.value.filter(val)
+const selectFilterData = (val: any) => {
+  selectTree.value?.filter(val)
 }
-function filterNode(value: any, data: any) {
+const filterNode = (value: any, data: any) => {
   if (!value) return true
   return data[props.objMap['label']].indexOf(value) !== -1
 }
-function clearHandle() {
+const clearHandle = () => {
   valueTitle.value = ''
   valueId.value = ''
   defaultExpandedKey.value = [];
   clearSelected()
 }
-function clearSelected() {
+const clearSelected = () => {
   const allNode = document.querySelectorAll('#tree-option .el-tree-node')
   allNode.forEach((element) => element.classList.remove('is-current'))
 }
@@ -132,6 +131,7 @@ watch(valueId, () => {
 
 <style lang="scss" scoped>
 @import "@/assets/styles/variables.module.scss";
+
 .el-scrollbar .el-scrollbar__view .el-select-dropdown__item {
   padding: 0;
   background-color: #fff;

src/components/iFrame/index.vue

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