<!--
 * @Author: 曹捷
 * @Date: 2021-03-15 14:54:07
 * @LastEditors: 曹捷
 * @LastEditTime: 2021-06-04 17:26:11
 * @Description: 用户管理
-->
<template>
  <obitUniversalTable name="用户管理" :pagination="pagination">
    <template #search>
      <obit-search-form :params="params" :paramList="paramList" @search="pageQuery(true)">
      </obit-search-form>
    </template>
    <template #btn>
      <a-button type="primary" @click="addDialog">
        <i class="iconfont icon-add-bold p-r-5"></i> 新 增
      </a-button>
    </template>
    <a-table expandRowByClick :loading="pageLoading" rowKey="userId" :columns="tableColumns" :dataSource="pageDataList"
      :pagination="false" class="com-table" highlight-current-row style="width: 100%">
      <template #operation="{ record}" :key="record.userId">
        <a-button type="link" @click="editDialog(record)">编辑</a-button>
        <a-divider type="vertical" style="height: 16px;" />
        <a-button type="link" @click="remove(record)"> 删除</a-button>
        <!-- <a-tooltip class="hover-operator  ">
          <template #title>绑定角色</template>
          <span class="icon-zuhuguanli iconfont obit-link " @click.stop="openBindRole(record)"></span>
        </a-tooltip>  -->
      </template>
    </a-table>
  </obitUniversalTable>
  <userAdd :addType="pageType" v-model:open="pageVisable" :detailsInfo="detailsInfo" @reload="pageQuery(true)">
  </userAdd>
  <bindRoleVue v-model:open="roleVisable" :userId="userId" :name="name"></bindRoleVue>
</template>

<script>
import { getCurrentInstance, inject, onMounted, reactive, toRefs } from 'vue'
import page from './../../../hook/page.js'
import userAdd from './userAdd.vue'
import bindRoleVue from './bindRole.vue'
export default {
  components: { userAdd, bindRoleVue },
  setup (props, contenxt) {
    let { proxy } = getCurrentInstance()
    let http = inject('http')
    let pageIns = page({
      tableRequest: 'getSystemUserList',
      removeKey: 'removeSystemUser',
      beforeSuccess (data) {
        data.data && data.data.forEach(element => {
          element.roleNameAll = element.roleNames.join(', ')
        });
      }
    })
    let _data = reactive({
      roleVisable: false,
      userId: '',
      name: '',
      tableColumns: [
        { dataIndex: 'account', title: '账号' },
        { dataIndex: 'name', title: '用户名称' },
        { dataIndex: 'userTypeName', title: '用户类型' },
        { dataIndex: 'account', title: '用户编码' },
        { dataIndex: 'orgName', title: '所属机构' },
        { dataIndex: 'roleNameAll', title: '角色', width: '230px' },
        { title: '操作', slots: { customRender: 'operation' } },
      ],
      paramList: [
        { name: '账号', key: 'account' },
        { name: '用户名称', key: 'name' },
        {
          type: 'ajax',
          key: 'userTypeName',
          name: '用户类型',
          valuename: 'codeValue',
          labelname: 'valueDesc',
          ajaxurl: '/manager/sysCode/getValue?code=userType',
        },
      ],
    })
    let _methods = {
      openBindRole (item) {
        _data.userId = item.userId
        _data.roleVisable = true
        _data.name = item.name
      },
      // expandedRowsChange (status, item) {
      //   if (status && (!item.roleList || item.roleList.length === 0)) {
      //     http.getSystemUserRoles(item.userId).then(res => {
      //       item.roleList = res
      //     })
      //   }
      // }
    }
    onMounted(() => {
      pageIns._method.pageQuery()
    })
    return {
      ...toRefs(pageIns._data),
      ...pageIns._method,
      ...toRefs(_data),
      ..._methods,
    }
  },
}
</script>

<style>
</style>