<script setup lang="ts">
import { reactive } from "vue";
import UserList from "./modules/user-list.vue";
defineOptions({
  name: "user"
});
const pageData: any = reactive({
  mode: "table",
  orgInfo: {}
});
const handleSwitchMode = (mode: String) => {
  pageData.mode = mode;
  if (pageData.mode === "table") {
    pageData.orgInfo = {};
  }
};
</script>

<template>
  <el-card :shadow="'never'">
    <template #default>
      <template v-if="pageData.mode !== 'table'">
        <el-col :span="19">
          <user-list
            :mode="pageData.mode"
            :org-info="pageData.orgInfo"
            @switch-mode="handleSwitchMode"
          />
        </el-col>
      </template>
      <template v-else>
        <user-list
          :mode="pageData.mode"
          :org-info="pageData.orgInfo"
          @switch-mode="handleSwitchMode"
        />
      </template>
    </template>
  </el-card>
</template>
