feat: 🚀 省略

src/components.d.ts

@@ -7,12 +7,16 @@ export {}
 
 declare module "vue" {
     export interface GlobalComponents {
-        Css: typeof import("./components/SearchForm/components/css.vue")["default"];
         ElAside: typeof import("element-plus/es")["ElAside"];
         ElAutocomplete: typeof import("element-plus/es")["ElAutocomplete"];
         ElBreadcrumb: typeof import("element-plus/es")["ElBreadcrumb"];
         ElBreadcrumbItem: typeof import("element-plus/es")["ElBreadcrumbItem"];
         ElButton: typeof import("element-plus/es")["ElButton"];
+        ElCarousel: typeof import("element-plus/es")["ElCarousel"];
+        ElCarouselItem: typeof import("element-plus/es")["ElCarouselItem"];
+        ElCheckbox: typeof import("element-plus/es")["ElCheckbox"];
+        ElCheckboxGroup: typeof import("element-plus/es")["ElCheckboxGroup"];
+        ElColorPicker: typeof import("element-plus/es")["ElColorPicker"];
         ElContainer: typeof import("element-plus/es")["ElContainer"];
         ElDatePicker: typeof import("element-plus/es")["ElDatePicker"];
         ElDialog: typeof import("element-plus/es")["ElDialog"];
@@ -34,6 +38,7 @@ declare module "vue" {
         ElOption: typeof import("element-plus/es")["ElOption"];
         ElPagination: typeof import("element-plus/es")["ElPagination"];
         ElRadio: typeof import("element-plus/es")["ElRadio"];
+        ElRadioButton: typeof import("element-plus/es")["ElRadioButton"];
         ElRadioGroup: typeof import("element-plus/es")["ElRadioGroup"];
         ElScrollbar: typeof import("element-plus/es")["ElScrollbar"];
         ElSelect: typeof import("element-plus/es")["ElSelect"];
@@ -44,6 +49,8 @@ declare module "vue" {
         ElTabPane: typeof import("element-plus/es")["ElTabPane"];
         ElTabs: typeof import("element-plus/es")["ElTabs"];
         ElTag: typeof import("element-plus/es")["ElTag"];
+        ElTooltip: typeof import("element-plus/es")["ElTooltip"];
+        ElTree: typeof import("element-plus/es")["ElTree"];
         ElTreeSelect: typeof import("element-plus/es")["ElTreeSelect"];
         ElUpload: typeof import("element-plus/es")["ElUpload"];
         IEpArrowDown: typeof import("~icons/ep/arrow-down")["default"];

src/components/SearchForm/components/SearchFormItem.vue

@@ -77,7 +77,7 @@
                 :check-strictly="false"
                 show-checkbox
                 style="width: 224px"
-                :collapse-tags="false"
+                :collapse-tags="true"
                 ref="treeSelectRef"
                 @change="handleTreeSelectChange(item)"
                 @remove-tag="handleRemoveTag(item, $event)"
@@ -117,7 +117,7 @@
             />
         </template>
 
-        <template v-if="item.type === 'selectInputs'">
+        <!-- <template v-if="item.type === 'selectInputs'">
             <div></div>
             <el-select
                 v-model="selectInputValue"
@@ -152,7 +152,7 @@
                 style="width: 106px !important"
                 @input="handleInput(item)"
             />
-        </template>
+        </template> -->
     </div>
 </template>
 
@@ -172,7 +172,7 @@ interface SearchFormItem {
     search: (params: any) => void; // 搜索方法
     handleEmitClear?: (item: any) => void;
 }
-// let selectInputValue = ref(1);
+// let selectInputValue = ref();
 
 // const treeSelectValue = ref(null);
 const props = defineProps<SearchFormItem>();
@@ -340,16 +340,16 @@ const handleClear = (item: any) => {
 const handleInput = (item: any) => {
     console.log(item, "=====item=====");
     //验证
-    verificationInput(item, _searchParam, selectInputValue.value);
+    // verificationInput(item, _searchParam, selectInputValue.value);
-};
-const handleChange = (item: any) => {
-    _searchParam.value[item.endProp] = "";
-    _searchParam.value[item.startProp] = "";
-    _searchParam.value["serialNumberBegin"] = "";
-    _searchParam.value["numberCodeBegin"] = "";
-    _searchParam.value["serialNumberEnd"] = "";
-    _searchParam.value["numberCodeEnd"] = "";
 };
+// const handleChange = (item: any) => {
+//     _searchParam.value[item.endProp] = "";
+//     _searchParam.value[item.startProp] = "";
+//     _searchParam.value["serialNumberBegin"] = "";
+//     _searchParam.value["numberCodeBegin"] = "";
+//     _searchParam.value["serialNumberEnd"] = "";
+//     _searchParam.value["numberCodeEnd"] = "";
+// };
 
 const handleEmitClear = (item: any) => {
     console.log(item);

src/components/SearchForm/components/css.vue

@@ -1,299 +0,0 @@
-<template>
-    <div>
-        <!-- 输入框 -->
-        <template v-if="item.type === 'input'">
-            <el-input
-                :placeholder="item.placeholder"
-                :maxlength="item.maxlength || 255"
-                v-model="_searchParam[`${item.prop}`]"
-                style="width: 224px"
-                @input="handleInput(item)"
-                @keyup.enter="search"
-                clearable
-                @clear="handleEmitClear(item)"
-            />
-        </template>
-        <!-- 下拉框 -->
-        <template v-if="item.type === 'select'">
-            <el-select
-                v-model="_searchParam[`${item.prop}`]"
-                :placeholder="item.placeholder"
-                clearable
-                ref="selectRef"
-                style="width: 224px"
-            >
-                <el-option v-for="option in item.options" :label="option.label" :value="option.value" :key="option.label" />
-            </el-select>
-        </template>
-        <!-- 开始-结束-日期选择器 -->
-        <template v-if="item.type === 'daterange'">
-            <el-date-picker
-                v-model="_searchParam[`${item.prop}`]"
-                :type="item.type"
-                :start-placeholder="item.startPlaceholder"
-                :end-placeholder="item.endPlaceholder"
-                :defaultTime="item.value"
-                format="YYYY-MM-DD"
-                value-format="YYYY-MM-DD"
-                style="width: 205px"
-                @change="handlePicker(item)"
-            />
-        </template>
-        <!-- 远程搜索 -->
-        <template v-if="item.type === 'selectRemote'">
-            <el-select
-                v-model="_searchParam[`${item.prop}`]"
-                :placeholder="item.placeholder"
-                clearable
-                remote
-                filterable
-                @clear="handleClear(item)"
-                :loading="loading"
-                class="m-2 select"
-                remote-show-suffix
-                :remote-method="
-                            (query:any) => {
-                              remoteMethod(
-                                query,
-                                item
-                              );
-                            }
-                          "
-                :disabled="item.disabled"
-                style="width: 224px"
-            >
-                <el-option :label="option.name" :value="option.id" v-for="option in item.options" :key="option.id" />
-            </el-select>
-            <!--item.prop -->
-        </template>
-        <!-- el-tree-select -->
-        <template v-if="item.type === 'treeSelect'">
-            <el-tree-select
-                v-model="_searchParam[`${item.prop}`]"
-                :data="item.options"
-                :placeholder="item.placeholder"
-                multiple
-                :render-after-expand="false"
-                :check-strictly="false"
-                show-checkbox
-                style="width: 224px"
-                clearable
-                :collapse-tags="true"
-                ref="treeSelectRef"
-                @change="handleTreeSelectChange(item)"
-                @remove-tag="handleRemoveTag(item)"
-            />
-        </template>
-        <!-- 双 -->
-        <template v-if="item.type === 'inputs'">
-            <el-input
-                v-model="_searchParam[`${item.startProp}`]"
-                :placeholder="item.startPlaceholder"
-                :disabled="item.disabled"
-                maxlength="255"
-                style="width: 105px !important"
-                @input="handleInput(item)"
-            >
-            </el-input>
-            <span style="margin: 0 3px">-</span>
-            <el-input
-                v-model="_searchParam[`${item.endProp}`]"
-                :placeholder="item.endPlaceholder"
-                :disabled="item.disabled"
-                maxlength="255"
-                style="width: 106px !important"
-                @input="handleInput(item)"
-            />
-        </template>
-        <template v-if="item.type === 'dateTimerange'">
-            <el-date-picker
-                v-model="_searchParam[`${item.prop}`]"
-                type="datetimerange"
-                range-separator="至"
-                :start-placeholder="item.startPlaceholder"
-                :end-placeholder="item.endPlaceholder"
-                format="YYYY-MM-DD"
-                value-format="YYYY-MM-DD"
-                style="width: 205px"
-            />
-        </template>
-
-        <template v-if="item.type === 'selectInputs'">
-            <div></div>
-            <el-select
-                v-model="selectInputValue"
-                placeholder="Select"
-                style="width: 102px; height: 30px; margin-right: 6px"
-                class="selectInputs-box"
-                @change="handleChange(item)"
-            >
-                <el-option
-                    v-for="optionsItem in options"
-                    :key="optionsItem.value"
-                    :label="optionsItem.label"
-                    :value="optionsItem.value"
-                />
-            </el-select>
-
-            <el-input
-                v-model="_searchParam[`${item.startProp}`]"
-                :placeholder="item.startPlaceholder"
-                :disabled="item.disabled"
-                maxlength="255"
-                style="width: 105px !important"
-                @input="handleInput(item)"
-            >
-            </el-input>
-            <span style="margin: 0 3px">-</span>
-            <el-input
-                v-model="_searchParam[`${item.endProp}`]"
-                :placeholder="item.endPlaceholder"
-                :disabled="item.disabled"
-                maxlength="255"
-                style="width: 106px !important"
-                @input="handleInput(item)"
-            />
-        </template>
-    </div>
-</template>
-
-<script lang="ts" setup name="SearchFormItem">
-// import { verificationInput } from "./utils/verificationInput";
-import { getCountryListApi } from "@/api/modules/global";
-import $Bus from "@/utils/mittBus";
-import { cloneDeep } from "lodash-es";
-// import { ref } from "vue";
-const $router = useRouter();
-
-const routeName: any = ref($router.currentRoute.value.name);
-const treeSelectRef = ref<any>(null);
-// const userStore: any = useUserStore();
-interface SearchFormItem {
-    item: { [key: string]: any };
-    searchParam: { [key: string]: any };
-    search: (params: any) => void; // 搜索方法
-    handleEmitClear?: (item: any) => void;
-}
-let selectInputValue = ref(1);
-const options = [
-    {
-        value: 1,
-        label: "序号"
-    },
-    {
-        value: 2,
-        label: "数字序列号"
-    }
-];
-// const treeSelectValue = ref(null);
-const props = defineProps<SearchFormItem>();
-const _searchParam = computed(() => props.searchParam);
-
-let loading = ref(false);
-//日期选择后重选赋值
-const handlePicker = (item: any) => {
-    const { prop } = item;
-    if (Array.isArray(_searchParam.value[prop]) && _searchParam.value[prop].length > 0) {
-        let _date: any = cloneDeep(_searchParam.value[prop]);
-        _date[0] = _date[0] + " " + "00:00:00";
-        _date[1] = _date[1] + " " + "23:59:59";
-        _searchParam.value[item.startDate] = _date.join(",");
-    } else {
-        _searchParam.value[item.startDate] = "";
-    }
-};
-//远程搜索(供应商)
-const remoteMethod = async (query: any, item: any) => {
-    console.log(query, item);
-    loading.value = true;
-    if (!query) {
-        loading.value = false;
-        return;
-    }
-    let valClone = query.replace(/^\s*|\s*$/g, "");
-    if (!valClone.length) {
-        loading.value = false;
-        return;
-    }
-    const result = await getCountryListApi({ name: valClone });
-    if (result?.code === 0) {
-        const { data } = result;
-        console.log(data, "=======data=======");
-        item.options = data;
-    }
-    loading.value = false;
-};
-
-// 关闭标签时同步
-const handleRemoveTag = item => {
-    console.log("触发了吗");
-    nextTick(() => {
-        syncCheckedIds(item);
-    });
-
-    return;
-};
-
-// 统一同步选中ID的方法
-const syncCheckedIds = (item: any) => {
-    // 获取所有全选中的节点（包括父节点）
-    const allCheckedNodes = treeSelectRef.value.getCheckedNodes(false, false);
-    const allCheckedIds = allCheckedNodes.map((node: any) => node.id);
-    _searchParam.value[item.prop] = allCheckedIds;
-    // 同步到搜索参数
-    _searchParam.value[item.prop1] = allCheckedIds.length ? allCheckedIds.join(",") : null;
-};
-
-const handleTreeSelectChange = (item: any) => {
-    console.log(routeName.value);
-    if (routeName.value === "articleListIndex") {
-        // 通过ref获取组件实例
-        if (treeSelectRef.value) {
-            syncCheckedIds(item);
-            return;
-        }
-    }
-
-    if (_searchParam.value[item.prop].length) {
-        let values = cloneDeep(_searchParam.value[item.prop]);
-        _searchParam.value[item.prop1] = values.join(",");
-    } else {
-        _searchParam.value[item.prop1] = "";
-    }
-};
-const handleClear = (item: any) => {
-    item.options = [];
-};
-
-//input输入监听
-const handleInput = (item: any) => {
-    console.log(item, "=====item=====");
-    //验证
-    // verificationInput(item, _searchParam, selectInputValue.value);
-};
-const handleChange = (item: any) => {
-    _searchParam.value[item.endProp] = "";
-    _searchParam.value[item.startProp] = "";
-    _searchParam.value["serialNumberBegin"] = "";
-    _searchParam.value["numberCodeBegin"] = "";
-    _searchParam.value["serialNumberEnd"] = "";
-    _searchParam.value["numberCodeEnd"] = "";
-};
-
-const handleEmitClear = (item: any) => {
-    console.log(item);
-
-    if (routeName.value === "barCode") {
-        $Bus.emit("clearBarCodeCreateUser");
-    }
-    if (routeName.value === "boxCode") {
-        $Bus.emit("clearBoxCodeCreateUser");
-    }
-    if (routeName.value === "boxMarkIndex") {
-        $Bus.emit("clearBoxMarkIndexCreator");
-    }
-};
-</script>
-<style lang="scss" scope>
-@import "../index.scss";
-</style>