feat: 🚀 仓库关系

src/views/foundation/set/shop/index.vue

@@ -42,7 +42,7 @@
     </div>
 </template>
 
-<script setup lang="ts" name="foundationSetMaterial">
+<script setup lang="ts" name="foundationSetShop">
 import ProTable from "@/components/ProTable/index.vue";
 import SearchForm from "@/components/SearchForm/index.vue";
 import PermissionButton from "@/components/PermissionButton/index.vue";

src/views/foundation/set/warehouse/constant/list/button.ts

@@ -0,0 +1,16 @@
+export const BUTTON = [
+    {
+        text: "新增",
+        permission: "foundationSetWarehouseBtnAdd",
+        type: "add",
+        props: {
+            type: "primary"
+        }
+    },
+
+    {
+        text: "删除",
+        permission: "foundationSetWarehouseBtnDel",
+        type: "del"
+    }
+];

src/views/foundation/set/warehouse/constant/list/details.ts

@@ -0,0 +1,38 @@
+export const DETAILS_FORM_DATA: any[] = [
+    {
+        prop: "org_number",
+        placeholder: "请输入",
+        type: "select",
+        label: "金蝶仓库:",
+        disabled: false,
+        required: true,
+        class: "form-item1"
+    },
+    {
+        prop: "org_number",
+        placeholder: "请输入",
+        type: "select",
+        label: "金蝶子仓库:",
+        disabled: false,
+        class: "form-item1"
+    },
+    {
+        prop: "org_number",
+        placeholder: "请输入",
+        type: "select",
+        label: "对应聚水潭仓库:",
+        disabled: false,
+        required: true,
+        class: "form-item1"
+    },
+    {
+        prop: "org_number",
+        placeholder: "请输入",
+        type: "select",
+        label: "对应领星仓库:",
+        disabled: false,
+        required: true,
+        class: "form-item1"
+    }
+];
+export const DETAILS_RULE_FORM: any = {};

src/views/foundation/set/warehouse/constant/list/index.ts

@@ -0,0 +1,4 @@
+import { FORM_DATA, RULE_FORM } from "./search";
+import { COLUMNS } from "./table";
+import { BUTTON } from "./button";
+export { FORM_DATA, RULE_FORM, COLUMNS, BUTTON };

src/views/foundation/set/warehouse/constant/list/search.ts

@@ -0,0 +1,53 @@
+interface FormItem {
+    prop: string;
+    label?: string;
+    placeholder?: string;
+    type: string;
+    isCopy?: boolean;
+    optionProps?: any;
+    startPlaceholder?: string;
+    endPlaceholder?: string;
+    options?: any;
+    isArray?: boolean;
+    startDate?: string; //开始时间(传入后台需要的参数)
+    endDate?: string; //结束时间(传入后台需要的参数)
+    startProp?: string;
+    endProp?: string;
+    isInteger?: boolean;
+}
+export const FORM_DATA: FormItem[] = [
+    {
+        prop: "org_number",
+        placeholder: "请输入金蝶仓库",
+        type: "input",
+        label: "金蝶仓库: "
+    },
+    {
+        prop: "org_number",
+        placeholder: "请输入金蝶子仓库",
+        type: "input",
+        label: "金蝶子仓库: "
+    },
+    {
+        prop: "org_number",
+        placeholder: "请输入更新人",
+        type: "input",
+        label: "更新人: "
+    },
+
+    {
+        prop: "Time",
+        type: "daterange",
+        options: [],
+        startPlaceholder: "更新开始日期",
+        endPlaceholder: "更新结束日期",
+        startDate: "updated_at",
+        // endDate: "createEndDate",
+        label: "更新时间: "
+    }
+];
+
+export const RULE_FORM = {
+    page: 1,
+    size: 50
+};

src/views/foundation/set/warehouse/constant/list/table.ts

@@ -0,0 +1,41 @@
+// import { RenderScope } from "@/components/ProTable/interface";
+export const COLUMNS = [
+    { type: "selection", fixed: "left", width: 40 },
+    {
+        align: "left",
+        fixed: true,
+        label: "金蝶仓库",
+        prop: "material_number",
+        width: 200
+    },
+    {
+        align: "left",
+        label: "金蝶子仓库",
+        prop: "sku",
+        fixed: true,
+        width: 200
+    },
+    {
+        align: "left",
+        label: "对应聚水潭仓库",
+        prop: "material_name",
+        width: 200
+    },
+    {
+        align: "left",
+        label: "对应领星仓库",
+        prop: "org_name",
+        width: 200
+    },
+    {
+        align: "left",
+        label: "更新人",
+        prop: "product_line"
+    },
+
+    {
+        align: "left",
+        label: "更新时间",
+        prop: "bar_code"
+    }
+];

src/views/foundation/set/warehouse/index.vue

@@ -0,0 +1,154 @@
+<!-- 仓库关系 -->
+<template>
+    <div class="table-box">
+        <div style="padding-bottom: 16px">
+            <PermissionButton
+                :buttons="dataStore.buttons"
+                @handleButtonClickCallback="handleButtonClickCallback"
+            ></PermissionButton>
+        </div>
+        <el-dialog v-model="dataStore.dialogVisible" width="660" :before-close="handleClose" title="新增店铺">
+            <DetailsSearch
+                :formData="dataStore.detailsFormData"
+                :ruleForm="dataStore.detailsRuleForm"
+                :labelWidth="dataStore.labelWidth"
+                :inline="true"
+                :isSearch="true"
+                ref="detailsRef"
+            />
+            <template #footer>
+                <div class="dialog-footer">
+                    <el-button @click="handleClose">取消</el-button>
+                    <el-button type="primary" @click="handleCommit"> 确认 </el-button>
+                </div>
+            </template>
+        </el-dialog>
+        <ProTable
+            ref="proTableRef"
+            :columns="dataStore.columns"
+            :request-api="getMaterialListApi"
+            :init-param="dataStore.initParam"
+            @selectionChange="selectionChange"
+        >
+            <template v-slot:search>
+                <SearchForm
+                    @search="handleSearch"
+                    @reset="handleReset"
+                    :searchParams="dataStore.initParam"
+                    :formData="dataStore.formData"
+                />
+            </template>
+        </ProTable>
+    </div>
+</template>
+
+<script setup lang="ts" name="foundationSetWarehouse">
+import ProTable from "@/components/ProTable/index.vue";
+import SearchForm from "@/components/SearchForm/index.vue";
+import PermissionButton from "@/components/PermissionButton/index.vue";
+import { getMaterialListApi } from "@/api/modules/foundationMaterial";
+import { useMsg } from "@/hooks/useMsg";
+import { RULE_FORM, FORM_DATA, COLUMNS, BUTTON } from "./constant/list/index";
+import { DETAILS_RULE_FORM, DETAILS_FORM_DATA } from "./constant/list/details";
+//表格TS
+import { ProTableInstance } from "@/components/ProTable/interface";
+
+//深拷贝方法
+import { cloneDeep } from "lodash-es";
+// 获取 ProTable 元素，调用其获取刷新数据方法（还能获取到当前查询参数，方便导出携带参数）
+const proTableRef = ref<ProTableInstance>();
+const detailsRef = ref<any>(null);
+// 数据源
+const dataStore = reactive<any>({
+    columns: COLUMNS, //列表配置项
+    initParam: cloneDeep(RULE_FORM), // 初始化搜索条件|重置搜索条件
+    formData: FORM_DATA, //搜索配置项
+    buttons: cloneDeep(BUTTON),
+    options: [], //规格型号
+    labelWidth: "120px",
+    detailsFormData: cloneDeep(DETAILS_FORM_DATA),
+    detailsRuleForm: cloneDeep(DETAILS_RULE_FORM),
+    dialogVisible: false, //弹窗
+    selectionList: [] //选中表格的行
+});
+
+// 表格选择事件
+const selectionChange = (selection: any) => {
+    dataStore.selectionList = selection;
+};
+//删除
+const handleDel = () => {
+    console.log();
+    if (!dataStore.selectionList.length) {
+        useMsg("warning", "请选择数据 ！");
+        return;
+    } else {
+        ElMessageBox.confirm("您确定进行删除操作吗?", "温馨提示", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning"
+        })
+            .then(async () => {
+                let ids: any = [];
+                selectionList.forEach((item: any) => {
+                    ids.push(item.id);
+                });
+                console.log(ids, "==========");
+                // const result = await getSubscribeDelApi(ids.join(","));
+                // if (result?.code === 0) {
+                //     proTable?.value!.getTableList();
+                //     useMsg("success", "删除成功 ！");
+                // }
+            })
+            .catch(() => {});
+    }
+};
+//顶部按钮点击事件
+const handleButtonClickCallback = (item: any) => {
+    const { type } = item;
+    if (type === "del") {
+        return handleDel();
+    }
+    if (type === "add") {
+        dataStore.dialogVisible = true;
+    }
+};
+//弹窗取消
+const handleClose = () => {
+    dataStore.detailsRuleForm = cloneDeep(DETAILS_RULE_FORM);
+    detailsRef?.value?.formElement?.resetFields();
+    dataStore.dialogVisible = false;
+};
+//弹窗确认
+const handleCommit = () => {
+    dataStore.dialogVisible = false;
+};
+//搜索
+const handleSearch = async (params: any) => {
+    dataStore.initParam = cloneDeep(params);
+    //这里需要等到表格刷新以后才去请求
+    nextTick(() => {
+        proTableRef?.value!.getTableList();
+    });
+};
+//重置
+const handleReset = () => {
+    dataStore.initParam = cloneDeep(RULE_FORM);
+    //这里需要等到表格刷新以后才去请求
+    nextTick(() => {
+        proTableRef?.value!.getTableList();
+    });
+};
+</script>
+
+<style scope lang="scss">
+.down-dialog-box {
+    .el-dialog__body {
+        padding: 0 16px 40px;
+    }
+}
+.el-dialog .el-dialog__header {
+    padding: 8px 0;
+    font-weight: bold;
+}
+</style>