From de87c07c365fbead0cc170213d32980ab0e661d0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E6=B5=A9=E7=8E=AE?= <chen.haowei@iwhalecloud.com>
Date: Fri, 9 Jul 2021 11:03:20 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AE=BE=E5=A4=87=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/index.js                              |  14 ++
 src/api/oceanus.js                            |  20 +-
 src/pages/oceanus/equipment/Left/LeftTree.vue | 226 ++++++++++++++++++
 .../equipment/Left/OrganizationTree.vue       |  59 +++++
 .../oceanus/equipment/Left/TreeDrawer.vue     | 145 +++++++++++
 .../oceanus/equipment/Left/TreeModal.vue      |  61 +++++
 .../oceanus/equipment/Right/RightBox.vue      |  21 ++
 .../{components => Right}/RightTable.vue      |   0
 .../oceanus/equipment/components/LeftTree.vue | 167 -------------
 .../equipment/components/TreeDrawer.vue       |  54 -----
 src/pages/oceanus/equipment/index.vue         |  16 +-
 src/utils/index.js                            |   5 +
 src/utils/requestUtil.js                      |   4 +-
 13 files changed, 563 insertions(+), 229 deletions(-)
 create mode 100644 src/pages/oceanus/equipment/Left/LeftTree.vue
 create mode 100644 src/pages/oceanus/equipment/Left/OrganizationTree.vue
 create mode 100644 src/pages/oceanus/equipment/Left/TreeDrawer.vue
 create mode 100644 src/pages/oceanus/equipment/Left/TreeModal.vue
 create mode 100644 src/pages/oceanus/equipment/Right/RightBox.vue
 rename src/pages/oceanus/equipment/{components => Right}/RightTable.vue (100%)
 delete mode 100644 src/pages/oceanus/equipment/components/LeftTree.vue
 delete mode 100644 src/pages/oceanus/equipment/components/TreeDrawer.vue

diff --git a/src/api/index.js b/src/api/index.js
index 212ee85..97c5a80 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -1,4 +1,5 @@
 import { request, METHOD, formatObj } from '@/utils';
+import Lang from '@/utils/langUtils';
 export * from './menu';
 export * from './system';
 export * from './task';
@@ -18,3 +19,16 @@ export const getStaticParam = async staticKey => {
     });
     return newData;
 };
+
+export const getStaticDataApi = async data => {
+    const res = await request('/api/v1/parameters/business/list', METHOD.GET, {
+        ...data,
+        paramLocale: Lang.get(),
+    });
+    const newData = await formatObj(res || [], {
+        value: 'paramValue',
+        label: 'paramName',
+        key: 'paramId',
+    });
+    return newData;
+};
diff --git a/src/api/oceanus.js b/src/api/oceanus.js
index 603577e..b03b2e9 100644
--- a/src/api/oceanus.js
+++ b/src/api/oceanus.js
@@ -23,7 +23,21 @@ function movementAttributesApi(data) {
 }
 
 function getEquipmentsTreeApi(data) {
-    return getReq(`/oceanus/api/v1/equipments/catalogs/${data.catalogId}`, data);
+    return getReq(`/oceanus/api/v1/equipments/catalogs/${data.catalogId}`);
+}
+function addEquipmentsTreeApi(data) {
+    return postReq(`/oceanus/api/v1/equipments/catalogs`, data);
+}
+
+function updateEquipmentsTreeApi(data) {
+    return putReq(`/oceanus/api/v1/equipments/catalogs`, data);
+}
+function delEquipmentsTreeApi(data) {
+    return delReq(`/oceanus/api/v1/equipments/catalogs`, {}, { data });
+}
+
+function getEquipmentsInfoApi(data) {
+    return getReq(`/oceanus/api/v1/equipments/${data.catalogValue}`);
 }
 
 export default {
@@ -35,4 +49,8 @@ export default {
     updateAttributes: updateAttributesApi,
     movementAttributes: movementAttributesApi,
     getEquipmentsTree: getEquipmentsTreeApi,
+    addEquipmentsTree: addEquipmentsTreeApi,
+    updateEquipmentsTree: updateEquipmentsTreeApi,
+    delEquipmentsTree: delEquipmentsTreeApi,
+    getEquipmentsInfo: getEquipmentsInfoApi,
 };
diff --git a/src/pages/oceanus/equipment/Left/LeftTree.vue b/src/pages/oceanus/equipment/Left/LeftTree.vue
new file mode 100644
index 0000000..8c09151
--- /dev/null
+++ b/src/pages/oceanus/equipment/Left/LeftTree.vue
@@ -0,0 +1,226 @@
+<template>
+    <div>
+        <my-card>
+            <a-row :gutter="[16, 16]">
+                <a-col :span="24">
+                    <a-select
+                        show-search
+                        v-model="searchValue"
+                        placeholder="input search text"
+                        style="width: 100%"
+                        :default-active-first-option="false"
+                        :show-arrow="false"
+                        :filter-option="false"
+                        :not-found-content="null"
+                        :options="dataSource"
+                        @search="onSearch"
+                        @change="onChange"
+                    />
+                </a-col>
+                <a-col :span="24" class="tw-text-right">
+                    <a-button-group>
+                        <a-dropdown :disabled="selectedKeys.length === 0">
+                            <a-menu slot="overlay">
+                                <a-menu-item
+                                    key="1"
+                                    @click="addOrg"
+                                    :disabled="selectedObj.catalogType === 'EQUIPMENT'"
+                                    >新增组织
+                                </a-menu-item>
+                                <a-menu-item key="2" @click="addEqu">新增设备 </a-menu-item>
+                            </a-menu>
+                            <a-button type="primary" ghost>新增 <a-icon type="down" /></a-button>
+                        </a-dropdown>
+                        <a-button
+                            type="primary"
+                            ghost
+                            @click="edit"
+                            :disabled="
+                                selectedKeys.length === 0 || selectedObj.catalogType === 'ORGANIZATION'
+                            "
+                            >编辑</a-button
+                        >
+                        <a-button
+                            type="primary"
+                            ghost
+                            @click="del"
+                            :disabled="selectedKeys.length === 0 || selectedObj.catalogType === 'ROOTNODE'"
+                            >删除</a-button
+                        >
+                    </a-button-group>
+                </a-col>
+            </a-row>
+        </my-card>
+        <my-card class="tw-mt-2.5">
+            <a-row :gutter="[16, 16]">
+                <a-col :span="24">
+                    <a-tree
+                        ref="Tree"
+                        :treeData="treeData"
+                        :replaceFields="replaceFields"
+                        :selectedKeys="selectedKeys"
+                        @select="onSelect"
+                        :load-data="onLoadData"
+                    />
+                </a-col>
+            </a-row>
+            <TreeDrawer ref="TreeDrawer" :refresh="treeDrawerRefresh" />
+            <TreeModal ref="TreeModal" :parentNodeId="selectedKeys[0]" :afterSubmit="afterSubmit" />
+        </my-card>
+    </div>
+</template>
+
+<script>
+import moment from 'moment';
+import Api from '@/api/oceanus';
+import { formatObj, isObjEmpty } from '@/utils';
+import TreeDrawer from './TreeDrawer.vue';
+import TreeModal from './TreeModal.vue';
+
+export default {
+    components: { TreeDrawer, TreeModal },
+    data() {
+        return {
+            searchValue: undefined,
+            dataSource: [],
+            replaceFields: { title: 'catalogName', key: 'catalogId', children: 'children' },
+            treeData: [],
+            selectedKeys: [],
+            selectedObj: {},
+            allData: [],
+            treeNode: undefined,
+        };
+    },
+    model: {
+        prop: 'value',
+        event: 'change',
+    },
+    mounted() {
+        this.init();
+    },
+
+    methods: {
+        async init() {
+            this.treeData = [];
+            const parentNode = {
+                catalogId: -1,
+                catalogName: '根节点',
+                catalogType: 'ROOTNODE',
+                isLeaf: false,
+            };
+            this.treeData = [parentNode];
+            this.allData = [...this.allData, parentNode];
+            this.treeNode = undefined;
+            this.selectedKeys = [];
+            this.selectedObj = {};
+        },
+        onLoadData(treeNode) {
+            return new Promise((resolve) => {
+                Api.getEquipmentsTree({ catalogId: treeNode.dataRef.catalogId }).then((resp) => {
+                    if (resp.length === 0) {
+                        treeNode.dataRef.isLeaf = false;
+                    } else {
+                        this.allData = [...this.allData, ...resp];
+                        treeNode.dataRef.children = resp;
+                    }
+                    this.treeData = [...this.treeData];
+                    resolve();
+                });
+            });
+        },
+        async onSearch(searchText) {
+            const dataList = this.allData;
+            const newData = dataList.filter((i) => i.catalogName.indexOf(searchText) != -1);
+            this.dataSource = await formatObj(newData, { label: 'catalogName', value: 'catalogId' });
+        },
+        onChange(val) {
+            const data = this.allData.find((i) => i.catalogId === val);
+            this.selectedObj = data;
+            this.selectedKeys = [val];
+            this.searchValue = val;
+            this.$emit('change', data);
+        },
+        async onSelect(selectedKeys, { node }) {
+            console.log(node.dataRef);
+            this.treeNode = node;
+            this.selectedKeys = selectedKeys;
+            let data = {};
+            if (selectedKeys.length !== 0) {
+                const curData = node.dataRef;
+                this.selectedObj = curData;
+                this.searchValue = undefined;
+                if (curData.catalogType === 'EQUIPMENT') {
+                    data = await Api.getEquipmentsInfo(curData);
+                    this.selectedObj = {
+                        ...data,
+                        catalogId: curData.catalogId,
+                        catalogType: curData.catalogType,
+                    };
+                    data = this.selectedObj;
+                }
+            } else {
+                this.selectedObj = {};
+            }
+            this.$emit('change', data);
+        },
+        async view(data = {}, type = 0) {
+            this.$refs['TreeDrawer']?.open();
+            this.$nextTick(() => {
+                this.$refs['TreeDrawer'].setData({ ...data }, type);
+            });
+        },
+        addEqu() {
+            const { catalogId } = this.selectedObj;
+            this.view({ parentCatalogId: catalogId, catalogType: 'EQUIPMENT' }, 0);
+        },
+        addOrg() {
+            this.$refs.TreeModal.open();
+        },
+        afterSubmit() {
+            this.onLoadData(this.treeNode);
+        },
+        edit() {
+            const data = {
+                ...this.selectedObj,
+                installTime:
+                    this.selectedObj.installTime && moment(this.selectedObj.installTime, 'YYYY-MM-DD'),
+                runTime: this.selectedObj.runTime && moment(this.selectedObj.runTime, 'YYYY-MM-DD'),
+            };
+            delete data.children;
+            this.view(data, 1);
+        },
+        async del() {
+            if (isObjEmpty(this.selectedObj)) return;
+            try {
+                await Api.delEquipmentsTree(this.selectedObj);
+                this.$message.success('删除成功!');
+                this.onLoadData(this.treeNode.$parent);
+                this.treeNode = undefined;
+                this.selectedKeys = [];
+                this.selectedObj = {};
+            } catch (e) {
+                this.$message.warning('删除失败!');
+            }
+        },
+        treeDrawerRefresh(type, data) {
+            if (type === 0) {
+                this.onLoadData(this.treeNode);
+            }
+            if (type === 1) {
+                const { equipmentForm, catalogForm } = data;
+                const { equipmentName } = equipmentForm;
+                const { catalogId, catalogType } = catalogForm;
+                console.log(this.treeNode);
+                this.treeNode.dataRef.catalogName = equipmentName;
+                this.selectedObj = {
+                    ...equipmentForm,
+                    catalogId,
+                    catalogType,
+                };
+                this.treeData = [...this.treeData];
+                this.$emit('change', this.selectedObj);
+            }
+        },
+    },
+};
+</script>
diff --git a/src/pages/oceanus/equipment/Left/OrganizationTree.vue b/src/pages/oceanus/equipment/Left/OrganizationTree.vue
new file mode 100644
index 0000000..da83e55
--- /dev/null
+++ b/src/pages/oceanus/equipment/Left/OrganizationTree.vue
@@ -0,0 +1,59 @@
+<template>
+    <a-tree-select
+        :value="value"
+        show-search
+        style="width: 100%"
+        :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+        placeholder="Please select"
+        :tree-data="treeData"
+        allow-clear
+        tree-default-expand-all
+        :replaceFields="replaceFields"
+        @change="onChange"
+    />
+</template>
+  <!-- v-on="$listeners" -->
+<script>
+import api from '@/api/organization';
+import { arrayToTree } from '@/utils';
+export default {
+    model: {
+        prop: 'value',
+        event: 'change',
+    },
+    props: {
+        value: Number,
+        showMenu: Boolean,
+        getName: Function,
+    },
+    data() {
+        return {
+            treeData: [],
+            replaceFields: {
+                title: 'orgName',
+                key: 'orgId',
+                value: 'orgId',
+            },
+        };
+    },
+    async mounted() {
+        const rawData = await api.getOrganizationList();
+        const newData = rawData.map((i) => ({
+            ...i,
+        }));
+        const newArr = new arrayToTree({
+            data: newData,
+            rootValue: 0,
+            parentKey: 'parentOrgId',
+            key: 'orgId',
+        }).treeData;
+        this.treeData = [...newArr];
+    },
+    methods: {
+        onChange(value, label, extra) {
+            this.getName && this.getName(label);
+            this.$emit('change', value);
+        },
+    },
+};
+</script>
diff --git a/src/pages/oceanus/equipment/Left/TreeDrawer.vue b/src/pages/oceanus/equipment/Left/TreeDrawer.vue
new file mode 100644
index 0000000..91a5a19
--- /dev/null
+++ b/src/pages/oceanus/equipment/Left/TreeDrawer.vue
@@ -0,0 +1,145 @@
+<template>
+    <Drawer ref="drawerRef" v-model="visible" :title="title" :onOk="submit" :colesAfter="colesAfter">
+        <a-form-model layout="vertical" :model="form" :rules="rules" ref="DrawerForm">
+            <a-form-model-item label="设备编码" prop="equipmentCode">
+                <a-input v-model="form.equipmentCode" :disabled="isView" />
+            </a-form-model-item>
+            <a-form-model-item label="设备名称" prop="equipmentName">
+                <a-input v-model="form.equipmentName" :disabled="isView" />
+            </a-form-model-item>
+            <a-form-model-item label="类别" prop="categoryId">
+                <a-tree-select :treeData="oceanusTreeList" v-model="form.categoryId" :disabled="isView" />
+            </a-form-model-item>
+            <a-form-model-item label="等级" prop="equipmentGrade">
+                <Select v-model="form.equipmentGrade" :options="equipmentGradeList" :disabled="isView" />
+            </a-form-model-item>
+            <a-form-model-item label="安装日期" prop="installTime">
+                <a-date-picker class="tw-w-full" v-model="form.installTime" :disabled="isView" />
+            </a-form-model-item>
+            <a-form-model-item label="运行日期" prop="runTime">
+                <a-date-picker class="tw-w-full" v-model="form.runTime" :disabled="isView" />
+            </a-form-model-item>
+            <a-form-model-item label="供应商" prop="supplier">
+                <a-input v-model="form.supplier" :disabled="isView" />
+            </a-form-model-item>
+            <a-form-model-item label="制造商" prop="manufacturer">
+                <a-input v-model="form.manufacturer" :disabled="isView" />
+            </a-form-model-item>
+            <a-form-model-item label="专业" prop="specialtyCode">
+                <Select v-model="form.specialtyCode" :options="specialtyCodeList" :disabled="isView" />
+            </a-form-model-item>
+        </a-form-model>
+    </Drawer>
+</template>
+
+<script>
+import { getStaticDataApi } from '@/api';
+import Drawer from '@/components/table/drawer.vue';
+import FormMixin from '@/components/FormMixin';
+import Api from '@/api/oceanus';
+import Select from '@/components/MySelect/index.vue';
+import { arrayToTree, formatObj } from '@/utils';
+
+export default {
+    components: { Drawer, Select },
+    props: {
+        refresh: Function,
+    },
+    mixins: [FormMixin],
+    data() {
+        return {
+            visible: false,
+            form: {},
+            rules: {
+                equipmentCode: [
+                    { required: true, message: 'Please select Activity zone', trigger: 'change' },
+                ],
+                equipmentName: [
+                    { required: true, message: 'Please select Activity zone', trigger: 'change' },
+                ],
+                categoryId: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
+            },
+            equipmentGradeList: [],
+            specialtyCodeList: [],
+            oceanusTreeList: [],
+            Api,
+        };
+    },
+    async mounted() {
+        const oceanusTreeList = await formatObj(await Api.getOceanusTree(), {
+            label: 'categoryName',
+            value: 'categoryId',
+        });
+        const newOceanusTreeList = new arrayToTree({
+            data: oceanusTreeList,
+            rootValue: -1,
+            parentKey: 'parentCategoryId',
+            key: 'categoryId',
+        }).treeData;
+
+        const equipmentGradeList = await getStaticDataApi({
+            paramModule: 'oceanus_equipment',
+            paramCode: 'equipment_grade',
+        });
+
+        const specialtyCodeList = await getStaticDataApi({
+            paramModule: 'oceanus_equipment',
+            paramCode: 'specialty_code',
+        });
+        this.oceanusTreeList = newOceanusTreeList;
+        this.equipmentGradeList = equipmentGradeList;
+        this.specialtyCodeList = specialtyCodeList;
+    },
+    methods: {
+        open() {
+            this.form = {};
+            this.visible = true;
+        },
+        add() {
+            const { parentCatalogId, catalogType, installTime, runTime, ...rest } = this.form;
+            const data = {
+                catalogForm: {
+                    parentCatalogId,
+                    catalogType,
+                },
+                equipmentForm: {
+                    installTime: installTime && installTime.format('YYYY-MM-DD hh:mm:ss'),
+                    runTime: runTime && runTime.format('YYYY-MM-DD hh:mm:ss'),
+                    ...rest,
+                },
+            };
+            return Api.addEquipmentsTree(data);
+        },
+        edit() {
+            const { catalogId, catalogType, installTime, runTime, ...rest } = this.form;
+            const data = {
+                catalogForm: {
+                    catalogId,
+                    catalogType,
+                },
+                equipmentForm: {
+                    installTime: installTime && installTime.format('YYYY-MM-DD hh:mm:ss'),
+                    runTime: runTime && runTime.format('YYYY-MM-DD hh:mm:ss'),
+                    ...rest,
+                },
+            };
+            return Api.updateEquipmentsTree(data);
+        },
+        colesAfter() {
+            const { catalogId, catalogType, installTime, runTime, ...rest } = this.form;
+            const data = {
+                catalogForm: {
+                    catalogId,
+                    catalogType,
+                },
+                equipmentForm: {
+                    installTime: installTime && installTime.format('YYYY-MM-DD hh:mm:ss'),
+                    runTime: runTime && runTime.format('YYYY-MM-DD hh:mm:ss'),
+                    ...rest,
+                },
+            };
+            this.refresh(this.type, data);
+        },
+    },
+};
+</script>
diff --git a/src/pages/oceanus/equipment/Left/TreeModal.vue b/src/pages/oceanus/equipment/Left/TreeModal.vue
new file mode 100644
index 0000000..52ec689
--- /dev/null
+++ b/src/pages/oceanus/equipment/Left/TreeModal.vue
@@ -0,0 +1,61 @@
+<template>
+    <a-modal ref="drawerRef" :visible="visible" title="新增组织" @ok="submit" @cancel="close">
+        <a-form-model layout="vertical" :model="form" :rules="rules" ref="DrawerForm">
+            <a-form-model-item label="组织" prop="catalogValue">
+                <OrganizationTree v-model="form.catalogValue" :disabled="isView" />
+            </a-form-model-item>
+        </a-form-model>
+    </a-modal>
+</template>
+
+<script>
+import FormMixin from '@/components/FormMixin';
+import Api from '@/api/oceanus';
+import OrganizationTree from './OrganizationTree.vue';
+
+export default {
+    components: { OrganizationTree },
+    props: {
+        afterSubmit: Function,
+        parentNodeId: [String, Number],
+    },
+    watch: {
+        parentNodeId(val) {
+            this.parentId = val;
+        },
+    },
+    mixins: [FormMixin],
+    data() {
+        return {
+            visible: false,
+            parentId: undefined,
+            form: {},
+            rules: {
+                catalogValue: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
+            },
+            Api,
+        };
+    },
+    async mounted() {},
+    methods: {
+        open() {
+            this.form = {};
+            this.visible = true;
+        },
+        async add() {
+            const data = {
+                ...this.form,
+                catalogType: 'ORGANIZATION',
+                parentCatalogId: this.parentId + '',
+            };
+            await Api.addEquipmentsTree({ catalogForm: data });
+            this.close();
+            this.afterSubmit && this.afterSubmit();
+        },
+        close() {
+            this.form = {};
+            this.visible = false;
+        },
+    },
+};
+</script>
diff --git a/src/pages/oceanus/equipment/Right/RightBox.vue b/src/pages/oceanus/equipment/Right/RightBox.vue
new file mode 100644
index 0000000..cb60040
--- /dev/null
+++ b/src/pages/oceanus/equipment/Right/RightBox.vue
@@ -0,0 +1,21 @@
+<template>
+    <my-card>
+        <a-tabs default-active-key="1" @change="callback">
+            <a-tab-pane key="1" tab="Tab 1"> Content of Tab Pane 1 </a-tab-pane>
+            <a-tab-pane key="2" tab="Tab 2" force-render> Content of Tab Pane 2 </a-tab-pane>
+            <a-tab-pane key="3" tab="Tab 3"> Content of Tab Pane 3 </a-tab-pane>
+        </a-tabs>
+    </my-card>
+</template>
+<script>
+export default {
+    data() {
+        return {};
+    },
+    methods: {
+        callback(key) {
+            console.log(key);
+        },
+    },
+};
+</script>
diff --git a/src/pages/oceanus/equipment/components/RightTable.vue b/src/pages/oceanus/equipment/Right/RightTable.vue
similarity index 100%
rename from src/pages/oceanus/equipment/components/RightTable.vue
rename to src/pages/oceanus/equipment/Right/RightTable.vue
diff --git a/src/pages/oceanus/equipment/components/LeftTree.vue b/src/pages/oceanus/equipment/components/LeftTree.vue
deleted file mode 100644
index 2e18747..0000000
--- a/src/pages/oceanus/equipment/components/LeftTree.vue
+++ /dev/null
@@ -1,167 +0,0 @@
-<template>
-    <div>
-        <my-card>
-            <a-row :gutter="[16, 16]">
-                <a-col :span="24">
-                    <a-select
-                        show-search
-                        v-model="searchValue"
-                        placeholder="input search text"
-                        style="width: 100%"
-                        :default-active-first-option="false"
-                        :show-arrow="false"
-                        :filter-option="false"
-                        :not-found-content="null"
-                        :options="dataSource"
-                        @search="onSearch"
-                        @change="onChange"
-                    />
-                </a-col>
-                <a-col :span="24" class="tw-text-right">
-                    <a-button-group>
-                        <a-dropdown>
-                            <a-menu slot="overlay">
-                                <a-menu-item key="1" @click="addOrg">新增组织 </a-menu-item>
-                                <a-menu-item key="2" @click="addEqu">新增设备 </a-menu-item>
-                            </a-menu>
-                            <a-button type="primary" ghost>新增 <a-icon type="down" /></a-button>
-                        </a-dropdown>
-                        <a-button
-                            type="primary"
-                            ghost
-                            @click="edit"
-                            :disabled="selectedObj.catalogType !== 'ORGANIZATION'"
-                            >编辑</a-button
-                        >
-                        <a-button type="primary" ghost @click="del">删除</a-button>
-                    </a-button-group>
-                </a-col>
-            </a-row>
-        </my-card>
-        <my-card class="tw-mt-2.5">
-            <a-row :gutter="[16, 16]">
-                <a-col :span="24">
-                    <a-tree
-                        :treeData="treeData"
-                        :replaceFields="replaceFields"
-                        :selectedKeys="selectedKeys"
-                        @select="onSelect"
-                        :load-data="onLoadData"
-                    />
-                </a-col>
-            </a-row>
-            <TreeDrawer ref="TreeDrawer" :refresh="init" />
-        </my-card>
-    </div>
-</template>
-
-<script>
-import Api from '@/api/oceanus';
-import { formatObj } from '@/utils';
-import TreeDrawer from './TreeDrawer.vue';
-
-export default {
-    components: { TreeDrawer },
-    data() {
-        return {
-            catalogId: -1,
-            searchValue: undefined,
-            dataSource: [],
-            replaceFields: { title: 'catalogName', key: 'catalogId', children: 'children' },
-            treeData: [],
-            selectedKeys: [],
-            selectedObj: {},
-            allData: [],
-        };
-    },
-    model: {
-        prop: 'value',
-        event: 'change',
-    },
-    mounted() {
-        this.init(this.catalogId);
-    },
-    methods: {
-        async init(id) {
-            const data = await Api.getEquipmentsTree({ catalogId: id });
-            this.treeData = data;
-            this.selectedKeys = [data[0]?.catalogId];
-            this.selectedObj = data[0];
-            this.$emit('change', data[0]);
-            this.allData = [...this.allData, ...data];
-        },
-        onLoadData(treeNode) {
-            return new Promise((resolve) => {
-                if (treeNode.dataRef.children) {
-                    resolve();
-                    return;
-                }
-                Api.getEquipmentsTree({ catalogId: treeNode.dataRef.catalogId }).then((resp) => {
-                    if (resp.length === 0) {
-                        treeNode.dataRef.isLeaf = true;
-                    } else {
-                        this.allData = [...this.allData, ...resp];
-                        const newData = resp.map((i) => {
-                            return {
-                                ...i,
-                                isLeaf: i.catalogType !== 'ORGANIZATION',
-                            };
-                        });
-                        treeNode.dataRef.children = newData;
-                    }
-                    this.treeData = [...this.treeData];
-                    resolve();
-                });
-            });
-        },
-        async onSearch(searchText) {
-            const dataList = this.allData;
-            const newData = dataList.filter((i) => i.catalogName.indexOf(searchText) != -1);
-            this.dataSource = await formatObj(newData, { label: 'catalogName', value: 'catalogId' });
-        },
-        onChange(val) {
-            const data = this.allData.find((i) => i.catalogId === val);
-            this.selectedObj = data;
-            this.selectedKeys = [val];
-            this.searchValue = val;
-            this.$emit('change', data);
-        },
-        onSelect(selectedKeys, { node }) {
-            if (selectedKeys.length !== 0) {
-                this.selectedKeys = selectedKeys;
-                const cueData = node.$props.dataRef;
-                this.selectedObj = cueData;
-                this.searchValue = undefined;
-                this.$emit('change', cueData);
-            }
-        },
-        async view(data = {}, type = 0) {
-            this.$refs['TreeDrawer']?.open();
-            this.$nextTick(() => {
-                this.$refs['TreeDrawer'].setData({ ...data }, type);
-            });
-        },
-        addEqu() {
-            const { categoryId } = this.selectedObj;
-            this.view({ parentCategoryId: categoryId }, 0);
-        },
-        addOrg() {},
-        edit() {
-            const data = this.selectedObj;
-            delete data.children;
-            this.view(data, 1);
-        },
-        del() {
-            const categoryId = this.selectedObj?.categoryId;
-            if (categoryId) return;
-            try {
-                this.Api.delOceanusTree({ categoryId });
-                this.$message.success('删除成功!');
-                this.init();
-            } catch (e) {
-                this.$message.warning('删除失败!');
-            }
-        },
-    },
-};
-</script>
diff --git a/src/pages/oceanus/equipment/components/TreeDrawer.vue b/src/pages/oceanus/equipment/components/TreeDrawer.vue
deleted file mode 100644
index 24d1f4f..0000000
--- a/src/pages/oceanus/equipment/components/TreeDrawer.vue
+++ /dev/null
@@ -1,54 +0,0 @@
-<template>
-    <Drawer ref="drawerRef" v-model="visible" :title="title" :onOk="submit" :colesAfter="refresh">
-        <a-form-model layout="vertical" :model="form" :rules="rules" ref="DrawerForm">
-            <a-form-model-item label="编码" prop="categoryCode">
-                <a-input v-model="form.categoryCode" :disabled="isView" />
-            </a-form-model-item>
-            <a-form-model-item label="名称" prop="categoryName">
-                <a-input v-model="form.categoryName" :disabled="isView" />
-            </a-form-model-item>
-            <a-form-model-item label="说明" prop="remark">
-                <a-textarea v-model="form.remark" :disabled="isView" :rows="4" />
-            </a-form-model-item>
-        </a-form-model>
-    </Drawer>
-</template>
-
-<script>
-import Drawer from '@/components/table/drawer.vue';
-import FormMixin from '@/components/FormMixin';
-import Api from '@/api/oceanus';
-
-export default {
-    components: { Drawer },
-    props: {
-        refresh: Function,
-    },
-    mixins: [FormMixin],
-    data() {
-        return {
-            visible: false,
-            form: {},
-            rules: {
-                categoryCode: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
-                categoryName: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
-                remark: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
-            },
-            Api,
-        };
-    },
-    async mounted() {},
-    methods: {
-        open() {
-            this.form = {};
-            this.visible = true;
-        },
-        add() {
-            return Api.addOceanusTree(this.form);
-        },
-        edit() {
-            return Api.updateOceanusTree(this.form);
-        },
-    },
-};
-</script>
diff --git a/src/pages/oceanus/equipment/index.vue b/src/pages/oceanus/equipment/index.vue
index 7acdd35..b535b18 100644
--- a/src/pages/oceanus/equipment/index.vue
+++ b/src/pages/oceanus/equipment/index.vue
@@ -4,22 +4,28 @@
             <LeftTree v-model="treeVale" />
         </a-col>
         <a-col :span="16">
-            <RightTable />
+            <RightBox v-if="!isObjEmpty(treeVale)" :info="treeVale" />
         </a-col>
     </a-row>
 </template>
 
 <script>
-import RightTable from './components/RightTable.vue';
-import LeftTree from './components/LeftTree.vue';
+import RightBox from './Right/RightBox.vue';
+import LeftTree from './Left/LeftTree.vue';
+import { isObjEmpty } from '@/utils';
 
 export default {
-    components: { RightTable, LeftTree },
+    components: { RightBox, LeftTree },
     data() {
         return {
             treeVale: {},
+            isObjEmpty,
         };
     },
-    methods: {},
+    watch: {
+        treeVale(val) {
+            console.log(val);
+        },
+    },
 };
 </script>
diff --git a/src/utils/index.js b/src/utils/index.js
index 47c69e0..a6c1cdc 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -124,3 +124,8 @@ export const formatObj = async (ArrObj, obj) => {
     });
     return newDataOne;
 };
+
+export const isObjEmpty = (data = {}) => {
+    const arr = Object.keys(data);
+    return arr.length === 0;
+};
diff --git a/src/utils/requestUtil.js b/src/utils/requestUtil.js
index fca6e63..32065f4 100644
--- a/src/utils/requestUtil.js
+++ b/src/utils/requestUtil.js
@@ -135,8 +135,8 @@ function checkAuthorization() {
     return !!getToken();
 }
 
-function delReq(url, config) {
-    return request(url, METHOD.DELETE, config);
+function delReq(url, params, config) {
+    return request(url, METHOD.DELETE, params, config);
 }
 
 function getReq(url, params, config) {
-- 
GitLab