1

lzhe

2024-06-05 dcf9c9e0410fe1186239e3f8d6f7bdc789c08010

 src/views/tpm/MachineGroup.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-04-27 20:02:44
 * @LastEditors: Sneed
 * @LastEditTime: 2024-04-27 20:49:52
 * @LastEditTime: 2024-04-27 22:21:36
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/tpm/MachineGroup.vue
-->
<template>
@@ -9,8 +9,9 @@
        <el-aside width="200px" v-loading="showGrouploading">
            <el-container>
                <el-main class="nopadding">
                    <el-tree ref="group" node-key="id" :data="group" :current-node-key="treeCheckKey"
                        :highlight-current="true" default-expand-all @node-click="groupClick"></el-tree>
                    <el-tree ref="group" node-key="id" :data="group" :current-node-key="form.id"
                        :highlight-current="true" :expand-on-click-node="false" default-expand-all
                        @node-click="groupClick"></el-tree>
                </el-main>
            </el-container>
        </el-aside>
@@ -18,19 +19,21 @@
            <el-header>
                <div class="left-panel">
                    <el-button @click="addChild" type="primary" plain>新增下级</el-button>
                    <el-button @click="del" type="danger" plain>删除</el-button>
                    <el-button :disabled="!form.id" @click="del" type="danger" plain>删除</el-button>
                </div>
            </el-header>
            <el-main class="">
                <el-form :model="form" :rules="rules" ref="dialogForm" label-width="200px" label-position="left">
                    <el-form-item label="上级目录" prop="parentName">
                        <el-input style="width: 240px" v-model="form.parentName"></el-input>
                        <el-input disabled style="width: 240px" v-model="form.parentName"></el-input>
                    </el-form-item>
                    <el-form-item label="机器组名称" prop="name">
                        <el-input style="width: 240px" v-model="form.name" clearable></el-input>
                        <el-input :disabled="(form.id === '102' || form.id === '2')" style="width: 240px"
                            v-model="form.name" clearable></el-input>
                    </el-form-item>
                </el-form>
                <el-button @click="save" style="width: 100px" type="primary" plain>保存</el-button>
                <el-button @click="save" v-show="!(form.id === '102' || form.id === '2')" style="width: 100px"
                    type="primary" plain>保存</el-button>
            </el-main>
        </el-container>
    </el-container>
@@ -41,16 +44,16 @@
    data() {
        return {
            group: [],
            treeCheckKey: '',
            form: {
                code: '',
                name: '',
                id: '',
                groupType: '',
                groupCategory: '',
                parentName: '',
                parentId: '',
                id: '',
                groupType: 'group_machine',
                groupCategory: '1',
                code: ''
            },
            disabled: false,
        }
    },
    created() {
@@ -61,17 +64,65 @@
            this.$HTTP.get('/api/blade-cps/group/tree?groupCategory=1&groupType=group_machine').then(res => {
                if (res.code === 200) {
                    this.group = res.data
                    this.treeCheckKey = res.data[0].id
                    this.groupClick(res.data[0])
                }
            })
        },
        groupClick() {
        groupClick(node, node1) {
            console.log(node, node1?.parent?.data?.name)
            this.disabled = false
            Object.keys(this.form).forEach(item => {
                this.form[item] = node[item]
            })
            if (node1?.parent?.data?.name) {
                this.form.parentName = node1?.parent?.data?.name
            }
            if (node.id === '102' || node.id === '2') {
                this.form.parentName = node.name
                this.disabled = true
            }
        },
        addChild() {
            if (!this.form.id) {
                return
            }
            let { name, id, groupType, groupCategory } = this.form
            this.form.id = ''
            this.form.name = ''
            this.form.code = ''
            this.form.groupType = groupType
            this.form.groupCategory = groupCategory
            this.form.parentName = name
            this.form.parentId = id
        },
        del() {
            this.$confirm(
                '确认删除该机器组？',
                {
                    distinguishCancelAndClose: true,
                    confirmButtonText: '删除',
                    cancelButtonText: '取消',
                }
            )
                .then(() => {
                    this.$HTTP.delete('/api/blade-cps/group/deleteGroup', {}, { params: { groupId: this.form.id } }).then(res => {
                        if (res.code === 200) {
                            this.$message.success("操作成功");
                            this.getTreeData()
                        }
                    })
                }).catch(() => {
                    this.$message.success("取消操作");
                })

        },
        addChild() { },
        del() { },
        save() {

            this.group = []
            this.$HTTP.post('/api/blade-cps/group', this.form).then(res => {
                if (res.code === 200) {
                    this.getTreeData()
                }
            })
        }
    }
}