<template>
  <div class="table-box">
    <ProTable
      ref="proTable"
      :config="config"
      :api="getloginLogPage"
      :paramCallback="paramCallback"
    >
    </ProTable>
  </div>
</template>

<script setup lang="jsx" name="ManageOrg">
  import { ref, reactive, onMounted } from 'vue';
  import { Plus, Delete, Edit, Setting } from '@element-plus/icons-vue';
  import { getloginLogPage } from '@/api/systemlog';
  import { ElMessageBox, ElMessage, ElButton, ElTag } from 'element-plus';

  const proTable = ref(null);
  const ManageOrgModalRef = ref(null);
  const allocationUserModalRef = ref(null);
  const config = reactive({
    columns: [
      { field: 'loginName', title: '登录用户名称', showOverflow: 'tooltip', search: {
            el: 'input',
            labelWidth: 105,
            props: { clearable: true }
          } },
      { field: 'loginTime', title: '登录时间', showOverflow: 'tooltip', search: {
        labelWidth: 105,
        el: 'date-picker',
        props: { type: 'date', valueFormat: 'YYYY-MM-DD' },
        labelWidth: 105,
      } },
      { field: 'ip', title: '登录IP', showOverflow: 'tooltip', search: {
        labelWidth: 105,
        el: 'input',
        props: { clearable: true }
      } },
      { field: 'device', title: '登录设备', showOverflow: 'tooltip', search: {
        el: 'input',
        labelWidth: 105,
        props: { clearable: true }
      } },
      { field: 'mac', title: 'MAC地址', showOverflow: 'tooltip', search: {
        labelWidth: 105,
        el: 'input',
        props: { clearable: true }
      } },
    ],
  });
  const paramCallback = (param) => {
    const obj = JSON.parse(JSON.stringify(param));
    return obj;
  };
  const query = () => proTable.value?.search();

  onMounted(() => {
    query();
  });
</script>
