update

gaoshp

2024-04-18 3a6168c78a6006a5b2e0cbea21f9d796b6646469

update

 src/views/mdc/MYTree.vue

对比新文件
@@ -0,0 +1,105 @@
<!--
 * @Date: 2024-04-18 19:53:35
 * @LastEditors: Sneed
 * @LastEditTime: 2024-04-18 20:56:37
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/MYTree.vue
-->
<template>
    <el-tree ref="treeRef" v-bind="$attrs" :show-checkbox="showCheckbox" :current-node-key="currentNodeKey"
        node-key="id" :props="defalutProps" :data="data" @check-change="checkChange" @node-click="handleNodeClick"
        highlight-current default-expand-all></el-tree>
</template>

<script>
export default {
    props: {
        showCheckbox: {
            type: Boolean,
            default: false
        }
    },
    data() {
        return {
            firstWorkKey: '',
            currentNodeKey: '',
            defalutProps: {
                label: 'title',
                children: 'children'
            },
            data: [],
            value: []
        }
    },
    watch: {
        currentNodeKey(val) {
            if (!this.showCheckbox) {
                this.value = [val]
            }
        },
        value(value) {
            this.$emit('update:modelValue', value)
        }
    },
    created() {
        this.getList()
    },
    methods: {
        getList() {
            this.$HTTP.post('/api/blade-cps/group/groupWorkstation/type', {
                groupCategory: 1,
                groupType: "group_workstation"
            }).then(({ code, data }) => {
                if (code === 200) {
                    this.data = this.formatData(data)
                    this.$nextTick(() => {
                        this.currentNodeKey = this.firstWorkKey
                    })
                }
            })
        },
        setCurrentKey(v) {
            if (this.firstWorkKey) return
            if (v.isWorkstation) {
                this.firstWorkKey = v.id
            }
        },
        formatData(data, current) {
            let newData = []
            if (!current) {
                newData = data.filter(item => item.parentId == 0).map(v => {
                    v.children = this.formatData(data, v).sort((a, b) => {
                        return b.sort - a.sort
                    })
                    this.setCurrentKey(v)
                    return v
                })
            } else {
                let res = data.filter(v => v.parentId == current.id)
                res = res.map(item => {
                    item.children = this.formatData(data, item).sort((a, b) => {
                        return b.sort - a.sort
                    })
                    this.setCurrentKey(item)
                    return item
                })
                return res
            }
            return newData
        },
        handleNodeClick(node) {
            console.log(node)
            this.$nextTick(() => {
                if (node.isWorkstation) {
                    this.currentNodeKey = node.id
                }
            })

        },
        checkChange(data, data1, data2) {
            this.value = this.$refs.treeRef.getCheckedNodes().filter(v => v.isWorkstation).map(item => item.id)
        },
    },
}
</script>

<style lang="scss" scoped></style>

 src/views/mdc/efficiency-analysis.vue

@@ -1,24 +1,58 @@
<!--
 * @Date: 2024-04-09 22:11:21
 * @LastEditors: Sneed
 * @LastEditTime: 2024-04-13 22:15:17
 * @LastEditTime: 2024-04-18 20:57:46
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/mdc/efficiency-analysis.vue
 * 鏁堢巼鍒嗘瀽
-->
<template>
    <el-main>
        <el-card shadow="never">
            鏁堢巼鍒嗘瀽
            <el-container>
                <el-aside width="200px" v-loading="showGrouploading">
                    <el-container>
                        <el-main class="nopadding">
                            <el-row>
                                <el-col>缁熻鏁版嵁</el-col>
                                <el-col>
                                    <el-select></el-select>
                                </el-col>
                                <el-col>鏃ユ湡</el-col>
                                <el-col>
                                    <el-select></el-select>
                                </el-col>
                            </el-row>
                            <MYTree v-model="treeChecked" show-checkbox></MYTree>
                        </el-main>
                    </el-container>
                </el-aside>
            </el-container>
        </el-card>
    </el-main>
</template>

<script>
    export default {
        
import MYTree from './MYTree.vue'
export default {
    components: {
        MYTree,
    },
    watch: {
        treeChecked(value) {
            this.query(value)
        }
    },
    data() {
        return {
            treeChecked: []
        }
    },
    methods: {
        query(vals) {
            console.log([...vals])
        }
    }
}
</script>

<style lang="scss" scoped>

</style>
<style lang="scss" scoped></style>