zhgh_whcp/target/classes/views/platform/sys/union/index.html

<!--#
layout("/layouts/platform.html"){
#-->

<div id="app" v-cloak>
	<guava ref="guava">
		<template>
			<el-row type="flex" :gutter="20" style="height: calc(100vh - 126px)">
				<el-col :span="5">
					<el-card shadow="never" style="height: 100%" body-style="{ height: '100%' }">
						<el-input placeholder="输入关键字进行查找" v-model="filterText" clearable></el-input>
						<div style="max-height: calc(100vh - 200px); overflow-y: auto">
							<el-tree
									:data="treeData"
									ref="treeRef"
									:expand-on-click-node="false"
									:props="{
				                        children: 'children',
				                        label: 'name'
				                     }"
									default-expand-all
									@node-click="treeNodeClick"
									:filter-node-method="filterNode"
									highlight-current
							>
								<template slot-scope="{ node, data }">
                    <span class="el-tree-node__label">
                        <i class="el-icon-folder-opened" v-if="node.level===1"></i>
                        <i class="el-icon-folder" v-else></i>
                        {{node.label}}
                    </span>
								</template>
							</el-tree>
						</div>
					</el-card>
				</el-col>
				<el-col :span="19">
					<el-card shadow="never">
						<el-tabs v-model="schoolUnionTabActive" type="card" v-if="currentTreeNode==null || currentTreeNode.level===1">
							<el-tab-pane name="branchUnionManage">
		                        <span slot="label">
		                            <i class="el-icon-school"></i>
		                            分工会信息
		                        </span>
								<sys-union-branch-union-manage @refresh="getTreeData()" @union-cadre="unionCadreInit"></sys-union-branch-union-manage>
							</el-tab-pane>
							<el-tab-pane name="schoolUnionInfo" v-if="$auth.hasPermission('sys.manager.union.schoolOfficer')">
		                        <span slot="label">
		                            <i class="el-icon-office-building"></i>
		                            校工会信息
		                        </span>
								<sys-union-school-union-user-manage></sys-union-school-union-user-manage>
							</el-tab-pane>
							<el-tab-pane name="unionCommitteeMemberManage" v-if="$auth.hasPermission('sys.manager.union.committeeMember')">
                        <span slot="label">
                            <i class="el-icon-office-building"></i>
                            工会委员信息
                        </span>
								<sys-union-committee-member-manage></sys-union-committee-member-manage>
							</el-tab-pane>
						</el-tabs>

						<el-tabs v-model="branchUnionTabActive" @tab-click="branchTabChange" type="card" v-if="currentTreeNode && currentTreeNode.level===2">
							<el-tab-pane name="branchUnionUserManage">
                        <span slot="label">
                            <i class="el-icon-school"></i>
                            分工会干部
                        </span>
								<sys-union-branch-union-user-manage
										ref="branchUnionUserManageRef"
										:union_id="currentTreeData.id"
								></sys-union-branch-union-user-manage>
							</el-tab-pane>
							<el-tab-pane name="branchUnionPartUnitManage">
                        <span slot="label">
                            <i class="el-icon-school"></i>
                            组成单位
                        </span>
								<sys-union-branch-union-part-unit-manage
										ref="branchUnionPartUnitManageRef"
										:union_id="currentTreeData.id"
								></sys-union-branch-union-part-unit-manage>
							</el-tab-pane>
							<el-tab-pane name="branchUnionGroup">
                        <span slot="label">
                            <i class="el-icon-school"></i>
                            工会小组
                        </span>
								<sys-union-branch-union-group-manage
										ref="branchUnionGroupRef"
										:union_id="currentTreeData.id"
								></sys-union-branch-union-group-manage>
							</el-tab-pane>
						</el-tabs>
					</el-card>
				</el-col>
			</el-row>
		</template>

		<template #edit>
			<sys-union-branch-union-cadre-audit ref="unionCadreAuditRef">
			</sys-union-branch-union-cadre-audit>
		</template>
	</guava>
</div>

<script nonce="${cspNonce!}">
    <!--#include("branchUnionManage.js"){}#-->
    <!--#include("schoolUnionUserManage.js"){}#-->
    <!--#include("branchUnionUserManage.js"){}#-->
    <!--#include("branchUnionPartUnitManage.js"){}#-->
    <!--#include("branchUnionGroupManage.js"){}#-->
    <!--#include("branchUnionCadreAudit.js"){}#-->
	<!--#include("branchUnionCommitteeMemberManage.js"){}#-->

    new Vue({
        el: "#app",
        components: {
            "sys-union-branch-union-manage": branchUnionManage,
            "sys-union-school-union-user-manage": schoolUnionUserManage,
            "sys-union-branch-union-user-manage": branchUnionUserManage,
            "sys-union-branch-union-part-unit-manage": branchUnionPartUnitManage,
            "sys-union-branch-union-group-manage": branchUnionGroupManage,
	        "sys-union-branch-union-cadre-audit": branchUnionCadreAudit,
			"sys-union-committee-member-manage": branchUnionCommitteeMemberManage,
        },
        data() {
            return {
                filterText: null,
                treeData: [],

                currentTreeNode: null,
                currentTreeData: null,

                schoolUnionTabActive: "branchUnionManage",
                branchUnionTabActive: "branchUnionUserManage"
            }
        },
        watch: {
            filterText(val) {
                this.$refs.treeRef.filter(val)
            }
        },
        methods: {
            treeNodeClick(data, node) {
                this.currentTreeData = data
                this.currentTreeNode = node
                if (node.level === 2) {
                    this.$nextTick(() => {
                        this.$refs[this.branchUnionTabActive + "Ref"].doSearch()
                    })
                }
            },
            filterNode(value, data) {
                if (!value) return true
                return data.name.indexOf(value) !== -1
            },
            getTreeData() {
                $.get(loc() + "/tree").then((res) => {
                    this.treeData = res.data
                })
            },
            branchTabChange(val) {
                this.$nextTick(() => {
                    this.$refs[val.name + "Ref"].doSearch()
                })
            },

	        // 基层干部审核初始化
	        unionCadreInit() {
				this.$refs.guava.edit(() => {
					this.$refs.unionCadreAuditRef.pageData()
				})
	        }
        },
        created() {
            this.getTreeData()
        }
    })
</script>

<!--#
}
#-->