<template >
  <div>
    <div class="space-x-5 my-2 h-11">
      <Input v-model="search.keywords" class="w-80 " clearable placeholder="请输入nickname或account"></Input>
      <Button type="primary" icon="ios-search-outline" @click="searchEvent"  :loading="loading">搜索</Button>
    </div>
    <custom-page :data-list="users" :page.sync="search.page" :page-size.sync="search.size"
                 :total="total" :columns="columns">
      <template slot-scope="{row}" slot="operation">
        <div class="space-x-3">
          <Button  type="success" @click="initNodeData(row)">权限</Button>
          <Button type="primary" @click="initMenuData(row)">菜单</Button>
          <Button type="info" @click="addEmail(row)">邮箱</Button>
        </div>
      </template>

    </custom-page>

    <Modal v-model="showMenuDialog" title="分配菜单 "    @on-ok="allotMenu" @on-cancel="modalClose">
      <el-tree :data="allMenus" show-checkbox default-expand-all node-key="id"   ref="treeMenu" :default-checked-keys="checkMenuDefault" ></el-tree>
    </Modal>

    <Modal v-model="showNodeDialog" title="分配权限组" @on-ok="allotNodeGroup" @on-cancel="modalClose">
      <el-tree :data="allNodeGroup" show-checkbox default-expand-all node-key="id"      ref="treePower" :default-checked-keys="checkNodeDefault" ></el-tree>
    </Modal>
  </div>
</template>

<script lang="ts" src="./user.ts"></script>