feat: admin tabs

components/aigc/NavItem.vue

@@ -12,6 +12,14 @@ const props = defineProps({
     type: String,
     required: true,
   },
+  admin: {
+    type: Boolean,
+    default: false,
+  },
+  hide: {
+    type: Boolean,
+    default: false,
+  },
 })
 
 const route = useRoute()
@@ -19,13 +27,21 @@ const route = useRoute()
 const active = computed(() => {
   return route.path === props.to
 })
+
+const activeClass = computed(() => {
+  return props.admin ? 'bg-amber-500 text-white' : 'bg-primary text-white'
+})
 </script>
 
 <template>
   <NuxtLink
-      class="px-4 py-3 flex items-center gap-2 rounded-lg transition cursor-pointer"
-      :class="active ? 'bg-primary text-white' : 'hover:bg-neutral-200'"
+    v-if="!hide"
+    :class="{
+      [activeClass]: active,
+      'hover:bg-neutral-200': !active,
+    }"
     :to="to"
+    class="px-4 py-3 flex items-center gap-2 rounded-lg transition cursor-pointer"
   >
     <Icon :name="icon" class="text-xl inline"/>
     <h1 class="text-[14px] font-medium">{{ label }}</h1>

layouts/default.vue

@@ -78,9 +78,20 @@ const open_login_modal = () => {
           />
           <UButton v-if="!loginState.is_logged_in" label="登录或注册" size="xs" class="font-bold" color="indigo"
                    @click="open_login_modal"/>
-          <UDropdown v-if="loginState.is_logged_in" :items="items" :popper="{ placement: 'bottom-start' }"
-                     :ui="{ item: { disabled: 'cursor-text select-text' } }">
-            <UAvatar :src="void 0" icon="i-tabler-user" size="md"/>
+          <UDropdown
+            v-if="loginState.is_logged_in"
+            :items="items"
+            :popper="{ placement: 'bottom-start' }"
+            :ui="{ item: { disabled: 'cursor-text select-text' } }"
+          >
+            <UAvatar
+              :alt="loginState.user.username.toUpperCase()"
+              :src="loginState.user.avatar"
+              chip-color="amber"
+              chip-position="bottom-right"
+              chip-text="OP"
+              size="md"
+            />
             <template #account="{ item }">
               <div class="text-left">
                 <p class="flex items-center gap-1">
@@ -136,6 +147,7 @@ body {
   background-clip: content-box;
   border: 1px solid transparent
 }
+
 /*
 *::-webkit-scrollbar {
   @apply w-1.5 h-1.5;

pages/aigc/generation.vue

@@ -5,7 +5,12 @@ useSeoMeta({
   title: '智能生成',
 })
 
-const navList = [
+const navList: {
+  label: string
+  icon: string
+  to: string
+  admin?: boolean
+}[] = [
   {
     label: '微课视频生成',
     icon: 'tabler:presentation-analytics',
@@ -16,10 +21,17 @@ const navList = [
     icon: 'i-tabler-video',
     to: '/aigc/generation/green-screen',
   },
+  {
+    label: '数字人管理',
+    icon: 'i-tabler-video',
+    to: '/aigc/generation/green-screen',
+    admin: true,
+  },
 ]
 
 const route = useRoute()
 const router = useRouter()
+const loginState = useLoginState()
 
 onMounted(() => {
   if (route.fullPath === '/aigc/generation') {
@@ -42,6 +54,8 @@ onMounted(() => {
               :icon="item.icon"
               :label="item.label"
               :to="item.to"
+              :admin="item.admin"
+              :hide="item.admin && loginState.user.auth_code !== 2"
             />
           </ClientOnly>
         </div>