<template>
  <div>
    <el-row :gutter="10">
      <el-col :span="12">
        <el-card shadow="never">
          <template #header>
            <CardTitle title="企业用户详情" />
          </template>
          <User :id="id"/>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card shadow="never">
          <template #header>
            <CardTitle title="账户信息" />
          </template>
          <Account :user-id="userId" :enterprise-id="enterpriseId" />
        </el-card>
      </el-col>
    </el-row>

    <el-row class="m-t-20px">
      <el-col :span="24">
        <el-card shadow="never">
          <el-tabs>
            <el-tab-pane label="交易订单">
              <TradeOrder :user-id="userId" :enterprise-id="enterpriseId" />
            </el-tab-pane>
            <el-tab-pane label="充值订单">
              <RechargeOrder :user-id="userId" :enterprise-id="enterpriseId" />
            </el-tab-pane>
          </el-tabs>
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>

<script setup>
defineOptions({ name: 'EnterpriseDetails'})
import { useTagsViewStore } from '@/store/modules/tagsView'
import { ElMessage } from 'element-plus'
import User from './components/user.vue'
import Account from './components/account.vue'
import TradeOrder from './components/tradingOrder.vue'
import RechargeOrder from './components/rechargeOrder.vue'

/** 初始化 */
const { currentRoute } = useRouter() // 路由
const { delView } = useTagsViewStore() // 视图操作
const route = useRoute()
const { id, enterpriseId, userId } = route.query
onMounted(() => {
  if (!id || !enterpriseId || !userId) {
    ElMessage.warning('参数错误，用户编号不能为空！')
    delView(unref(currentRoute))
    return
  }
})
</script>
