Gong-Ying-Lian-API/app/admin/view/auth/admin/index.html

<template>
    <el-row>
        <el-col :span="4" v-if="departdata[0].childlist.length>1">
            <el-card shadow="never" style="width: 95%;">
                <el-input placeholder="请输入部门名称" v-model="search" @input="handleSearch">
                    <template #prepend>
                        <i class="fa fa-search"></i>
                    </template>
                </el-input>
                <el-scrollbar height="calc(100vh)">
                <el-tree
                    style="margin-top: 15px"
                    ref="elTree"
                    :data='departdata'
                    :expand-on-click-node="false"
                    :default-expand-all="true"
                    :filter-node-method="filterNode"
                    :props='{label:"name",children:"childlist",value:"id"}'
                    @node-click="handleNodeClick"
                >
                </el-tree>
                </el-scrollbar>
            </el-card>
        </el-col>
        <el-col :span="departdata[0].childlist.length>1?20:24">
            <el-card shadow="never">
                <yun-table
                        :columns="columns"
                        toolbar="refresh,add,del"
                        ref="yuntable"
                        order="asc"
                        :auth="{
                            add:{:$auth->check('app\\admin\\controller\\auth\\Admin','add')},
                            edit:{:$auth->check('app\\admin\\controller\\auth\\Admin','edit')},
                            del:{:$auth->check('app\\admin\\controller\\auth\\Admin','del')},
                            multi:{:$auth->check('app\\admin\\controller\\auth\\Admin','multi')},
                        }"
                        :extend="extend">
                    <template #formatter="{field,rows}">
                        <div v-if="field=='groupids'">
                            <template v-for="item in rows.groupids">
                                <el-tag :type="item.status=='normal'?'primary':'info'" effect="dark" style="margin-right: 5px;">{{item.name}}</el-tag>
                            </template>
                        </div>
                        {if $thirdLogin}
                        <div v-if="field=='third'">
                            <el-tag effect="dark" v-if="rows.third" style="margin-right: 5px;">{{rows.third.openname}}</el-tag>
                        </div>
                        {/if}
                    </template>
                </yun-table>
            </el-card>
        </el-col>
    </el-row>
</template>
<script>
    import table from "@components/Table.js";
    import {inArray} from "@util.js";
    export default{
        components:{'YunTable':table},
        data:{
            search:'',
            departdata:Yunqi.data.departdata,
            extend:{
                index_url: 'auth/admin/index',
                add_url: 'auth/admin/add',
                edit_url: 'auth/admin/edit',
                del_url: 'auth/admin/del',
                multi_url: 'auth/admin/multi'
            },
            columns:[
                {checkbox: true,selectable:function (row,index){
                    let r=true;
                    for(let i in row.groupids){
                        if(inArray(Yunqi.data.groupids,row.groupids[i].id)){
                            r=false;
                        }
                    }
                    if(Yunqi.data.isSuperAdmin){
                        r=true;
                    }
                    if(row.id==1){
                        r=false;
                    }
                    return r;
                }},
                {field: 'id',title: __('ID'),width:80,operate:false},
                {field: 'username', title: __('用户名'),operate:'like'},
                {field: 'nickname', title: __('昵称'),operate:'like'},
                {field: 'third', title: __('绑定微信'),operate:false,visible:Yunqi.data.thirdLogin?true:'none',formatter: Yunqi.formatter.slot},
                {field: 'mobile', title: __('手机号')},
                {
                    field: 'groupids',
                    title: __('所属组别'),
                    formatter:Yunqi.formatter.slot,
                    operate:false
                },
                {
                    field: 'depart',
                    formatter: function (data){
                        return data?data.name:'';
                    },
                    title: __('所属部门'),
                    operate: {form:'input',type:'hidden',filter:false}
                },
                {field: 'status', title: __('状态'),operate:false, searchList: {'normal': __('正常'),'hidden': __('隐藏')},formatter:function(data,row){
                        let sw=Yunqi.formatter.switch;
                        sw.activeValue='normal';
                        sw.inactiveValue='hidden';
                        sw.value=row.status;
                        sw.disabled=false;
                        for(let i in row.groupids){
                            if(inArray(Yunqi.data.groupids,row.groupids[i].id)){
                                sw.disabled=true;
                            }
                        }
                        if(Yunqi.data.isSuperAdmin){
                            sw.disabled=false;
                        }
                        if(row.id==1){
                            sw.disabled=true;
                        }
                        return sw;
                    }},
                {
                    field: 'operate',
                    title: __('操作'),
                    width:100,
                    action:{
                        edit:function(row){
                            if(Yunqi.data.isSuperAdmin){
                                return true;
                            }
                            for(let i in row.groupids){
                                if(inArray(Yunqi.data.groupids,row.groupids[i].id)){
                                    return false;
                                }
                            }
                            return true;
                        },
                        del:function(row){
                            if(row.id==1){
                                return false;
                            }
                            if(Yunqi.data.isSuperAdmin){
                                return true;
                            }
                            for(let i in row.groupids){
                                if(inArray(Yunqi.data.groupids,row.groupids[i].id)){
                                    return false;
                                }
                            }
                            return true;
                        }
                    }
                }
            ]
        },
        methods: {
            handleSearch:function (e){
                this.$refs.elTree.filter();
            },
            filterNode:function (value,data){
                return data.name.indexOf(this.search) !== -1;
            },
            handleNodeClick:function (e){
                let columns=this.columns;
                for(let i in columns){
                    if(columns[i].field=='depart'){
                        columns[i].operate.value=e.id;
                    }
                }
                this.$refs.yuntable.reset();
            }
        }
    }
</script>
<style>

</style>