From c8bda7f95194246a6e4d324c18fdef5753276806 Mon Sep 17 00:00:00 2001
From: Timothy Yin <master@uniiem.com>
Date: Wed, 22 Jan 2025 18:54:40 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E7=94=A8=E6=88=B7?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=E9=9D=A2=E6=9D=BF=E6=97=A0=E6=B3=95=E6=BB=9A?=
 =?UTF-8?q?=E5=8A=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 layouts/default.vue              |   2 +-
 pages/generation/admin/users.vue | 568 +++++++++++++++----------------
 2 files changed, 281 insertions(+), 289 deletions(-)

diff --git a/layouts/default.vue b/layouts/default.vue
index 41add24..e87dde5 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -46,7 +46,7 @@ const items = [
     slot: 'account',
     disabled: true,
   }], [{
-    label: '账号资料',
+    label: '账号管理',
     icon: 'i-tabler-user-circle',
     to: '/profile'
   }], [{
diff --git a/pages/generation/admin/users.vue b/pages/generation/admin/users.vue
index 5aab1e5..a6016b7 100644
--- a/pages/generation/admin/users.vue
+++ b/pages/generation/admin/users.vue
@@ -517,11 +517,11 @@ const udpateBalance = (tag: ServiceTag, isActivate: boolean = false) => {
     >
       <UCard
         :ui="{
-          body: { base: 'flex-1' },
+          body: { base: 'flex-1 overflow-y-auto' },
           ring: '',
           divide: 'divide-y divide-gray-100 dark:divide-gray-800',
         }"
-        class="flex flex-col flex-1"
+        class="flex flex-col overflow-hidden"
       >
         <template #header>
           <UButton
@@ -540,142 +540,143 @@ const udpateBalance = (tag: ServiceTag, isActivate: boolean = false) => {
           </p>
         </template>
 
-        <UDivider
-          label="服务用量管理"
-          class="mb-4"
-          :ui="{ label: 'text-primary-500 dark:text-primary-400' }"
-        />
+        <div class="">
+          <UDivider
+            label="服务用量管理"
+            class="mb-4"
+            :ui="{ label: 'text-primary-500 dark:text-primary-400' }"
+          />
 
-        <div class="border dark:border-neutral-700 rounded-md">
-          <UTable
-            :columns="[
-              { key: 'service', label: '服务' },
-              { key: 'status', label: '状态' },
-              { key: 'create_time', label: '开通时间' },
-              { key: 'expire_time', label: '过期时间' },
-              { key: 'remain_count', label: '余量(秒)' },
-              { key: 'actions' },
-            ]"
-            :loading="userBalancesStatus === 'pending'"
-            :rows="[
-              ...systemServices,
-              // 如果 userBalances?.data.items 具有 systemServices 中没有的服务，则添加到列表中
-              ...(userBalances?.data.items
-                .filter(
-                  (row) =>
-                    !systemServices.find((s) => s.tag === row.request_type)
-                )
-                .map((row) => ({
-                  tag: row.request_type,
-                  name: row.request_type,
-                })) || []),
-            ]"
-          >
-            <template #service-data="{ row }: { row: ServiceType }">
-              {{
-                systemServices.find((s) => s.tag === row.tag)?.name || row.tag
-              }}
-            </template>
+          <div class="border dark:border-neutral-700 rounded-md">
+            <UTable
+              :columns="[
+                { key: 'service', label: '服务' },
+                { key: 'status', label: '状态' },
+                { key: 'create_time', label: '开通时间' },
+                { key: 'expire_time', label: '过期时间' },
+                { key: 'remain_count', label: '余量(秒)' },
+                { key: 'actions' },
+              ]"
+              :loading="userBalancesStatus === 'pending'"
+              :rows="[
+                ...systemServices,
+                // 如果 userBalances?.data.items 具有 systemServices 中没有的服务，则添加到列表中
+                ...(userBalances?.data.items
+                  .filter(
+                    (row) =>
+                      !systemServices.find((s) => s.tag === row.request_type)
+                  )
+                  .map((row) => ({
+                    tag: row.request_type,
+                    name: row.request_type,
+                  })) || []),
+              ]"
+            >
+              <template #service-data="{ row }: { row: ServiceType }">
+                {{
+                  systemServices.find((s) => s.tag === row.tag)?.name || row.tag
+                }}
+              </template>
 
-            <template #status-data="{ row }">
-              <UBadge
-                v-if="!getBalanceByTag(row.tag)"
-                color="gray"
-                variant="solid"
-                size="xs"
-              >
-                未开通
-              </UBadge>
-              <UBadge
-                v-else-if="
+              <template #status-data="{ row }">
+                <UBadge
+                  v-if="!getBalanceByTag(row.tag)"
+                  color="gray"
+                  variant="solid"
+                  size="xs"
+                >
+                  未开通
+                </UBadge>
+                <UBadge
+                  v-else-if="
                   getBalanceByTag(row.tag)!.expire_time < dayjs().unix()
                 "
-                color="red"
-                variant="subtle"
-                size="xs"
-              >
-                已过期
-              </UBadge>
-              <UBadge
-                v-else
-                color="green"
-                variant="subtle"
-                size="xs"
-              >
-                生效中
-              </UBadge>
-            </template>
+                  color="red"
+                  variant="subtle"
+                  size="xs"
+                >
+                  已过期
+                </UBadge>
+                <UBadge
+                  v-else
+                  color="green"
+                  variant="subtle"
+                  size="xs"
+                >
+                  生效中
+                </UBadge>
+              </template>
 
-            <template #create_time-data="{ row }">
-              <span class="text-xs">
-                {{
-                  !!getBalanceByTag(row.tag)
-                    ? dayjs(
-                        getBalanceByTag(row.tag)!.create_time * 1000
-                      ).format('YYYY-MM-DD HH:mm:ss')
-                    : '未开通'
-                }}
-              </span>
-            </template>
+              <template #create_time-data="{ row }">
+                <span class="text-xs">
+                  {{
+                    !!getBalanceByTag(row.tag)
+                      ? dayjs(
+                          getBalanceByTag(row.tag)!.create_time * 1000
+                        ).format('YYYY-MM-DD HH:mm:ss')
+                      : '未开通'
+                  }}
+                </span>
+              </template>
 
-            <template #expire_time-data="{ row }">
-              <span class="text-xs">
-                {{
-                  !!getBalanceByTag(row.tag)
-                    ? dayjs(
-                        getBalanceByTag(row.tag)!.expire_time * 1000
-                      ).format('YYYY-MM-DD HH:mm:ss')
-                    : '未开通'
-                }}
-              </span>
-            </template>
+              <template #expire_time-data="{ row }">
+                <span class="text-xs">
+                  {{
+                    !!getBalanceByTag(row.tag)
+                      ? dayjs(
+                          getBalanceByTag(row.tag)!.expire_time * 1000
+                        ).format('YYYY-MM-DD HH:mm:ss')
+                      : '未开通'
+                  }}
+                </span>
+              </template>
 
-            <template #remain_count-data="{ row }">
-              <span class="text-sm">
-                {{ getBalanceByTag(row.tag)?.remain_count || 0 }}
-              </span>
-            </template>
+              <template #remain_count-data="{ row }">
+                <span class="text-sm">
+                  {{ getBalanceByTag(row.tag)?.remain_count || 0 }}
+                </span>
+              </template>
 
-            <template #actions-data="{ row }">
-              <UButton
-                v-if="!getBalanceByTag(row.tag)"
-                color="green"
-                icon="tabler:clock-check"
-                size="xs"
-                variant="soft"
-                @click="
-                  () => {
-                    isActivateBalance = true
-                    userBalanceEditing = true
-                    userBalanceState.request_type = row.tag
-                  }
-                "
-              >
-                开通
-              </UButton>
-              <UButton
-                v-else-if="getBalanceByTag(row.tag)!.expire_time < dayjs().unix()"
-                color="teal"
-                icon="tabler:clock-plus"
-                size="xs"
-                variant="soft"
-                @click="
-                  () => {
-                    isActivateBalance = false
-                    userBalanceEditing = true
-                    userBalanceState.request_type = row.tag
-                  }
-                "
-              >
-                延续
-              </UButton>
-              <UButton
-                v-else
-                color="sky"
-                icon="tabler:rotate-clockwise"
-                size="xs"
-                variant="soft"
-                @click="
+              <template #actions-data="{ row }">
+                <UButton
+                  v-if="!getBalanceByTag(row.tag)"
+                  color="green"
+                  icon="tabler:clock-check"
+                  size="xs"
+                  variant="soft"
+                  @click="
+                    () => {
+                      isActivateBalance = true
+                      userBalanceEditing = true
+                      userBalanceState.request_type = row.tag
+                    }
+                  "
+                >
+                  开通
+                </UButton>
+                <UButton
+                  v-else-if="getBalanceByTag(row.tag)!.expire_time < dayjs().unix()"
+                  color="teal"
+                  icon="tabler:clock-plus"
+                  size="xs"
+                  variant="soft"
+                  @click="
+                    () => {
+                      isActivateBalance = false
+                      userBalanceEditing = true
+                      userBalanceState.request_type = row.tag
+                    }
+                  "
+                >
+                  延续
+                </UButton>
+                <UButton
+                  v-else
+                  color="sky"
+                  icon="tabler:rotate-clockwise"
+                  size="xs"
+                  variant="soft"
+                  @click="
                   () => {
                     isActivateBalance = false
                     userBalanceEditing = true
@@ -685,24 +686,24 @@ const udpateBalance = (tag: ServiceTag, isActivate: boolean = false) => {
                     userBalanceState.remain_count = getBalanceByTag(row.tag)!.remain_count
                   }
                 "
-              >
-                更新
-              </UButton>
-            </template>
-          </UTable>
+                >
+                  更新
+                </UButton>
+              </template>
+            </UTable>
 
-          <UModal
-            v-model="isBalanceEditModalOpen"
-            :ui="{ width: 'w-xl' }"
-          >
-            <UCard
-              :ui="{
-                ring: '',
-                divide: 'divide-y divide-gray-100 dark:divide-gray-800',
-              }"
+            <UModal
+              v-model="isBalanceEditModalOpen"
+              :ui="{ width: 'w-xl' }"
             >
-              <template #header>
-                <!-- 为 {{ viewingUser!.username }}
+              <UCard
+                :ui="{
+                  ring: '',
+                  divide: 'divide-y divide-gray-100 dark:divide-gray-800',
+                }"
+              >
+                <template #header>
+                  <!-- 为 {{ viewingUser!.username }}
                 <span class="text-primary">{{ isActivateBalance ? '开通' : '续期' }}</span>
                 服务：
                 {{
@@ -710,154 +711,145 @@ const udpateBalance = (tag: ServiceTag, isActivate: boolean = false) => {
                     (s) => s.tag === userBalanceState.request_type
                   )?.name || userBalanceState.request_type
                 }} -->
-                <div class="flex justify-between items-center gap-1">
-                  <h1 class="text-sm font-medium">
-                    {{ isActivateBalance ? '开通' : '续期' }}
-                    {{
-                      systemServices.find(
-                        (s) => s.tag === userBalanceState.request_type
-                      )?.name || userBalanceState.request_type
-                    }}
-                    服务
-                  </h1>
-                  <p
-                    class="text-xs text-indigo-500 inline-flex items-center gap-1"
-                  >
-                    <UIcon
-                      name="tabler:user-circle"
-                      class="text-base"
-                    />
-                    {{ viewingUser!.username }}
-                  </p>
-                </div>
-              </template>
+                  <div class="flex justify-between items-center gap-1">
+                    <h1 class="text-sm font-medium">
+                      {{ isActivateBalance ? '开通' : '续期' }}
+                      {{
+                        systemServices.find(
+                          (s) => s.tag === userBalanceState.request_type
+                        )?.name || userBalanceState.request_type
+                      }}
+                      服务
+                    </h1>
+                    <p
+                      class="text-xs text-indigo-500 inline-flex items-center gap-1"
+                    >
+                      <UIcon
+                        name="tabler:user-circle"
+                        class="text-base"
+                      />
+                      {{ viewingUser!.username }}
+                    </p>
+                  </div>
+                </template>
 
-              <div class="flex justify-between gap-4">
-                <UFormGroup
-                  label="到期时间"
-                  class="flex-1"
-                >
-                  <!-- <UInput
-                    v-model="userBalanceState.expire_time"
-                    type="datetime"
-                  /> -->
-                  <UPopover :popper="{ placement: 'bottom-start' }">
+                <div class="flex justify-between gap-4">
+                  <UFormGroup
+                    label="到期时间"
+                    class="flex-1"
+                  >
+                    <UPopover :popper="{ placement: 'bottom-start' }">
+                      <UButton
+                        block
+                        variant="soft"
+                        icon="i-heroicons-calendar-days-20-solid"
+                        :label="
+                          dayjs(userBalanceState.expire_time).format(
+                            'YYYY-MM-DD HH:mm'
+                          )
+                        "
+                      />
+
+                      <template #panel="{ close }">
+                        <DatePicker
+                          v-model="userBalanceState.expire_time"
+                          locale="cn"
+                          mode="dateTime"
+                          title-position="left"
+                          is-required
+                          is24hr
+                          @close="close"
+                        />
+                      </template>
+                    </UPopover>
+                  </UFormGroup>
+                  <UFormGroup
+                    label="服务时长(秒)"
+                    class="flex-1"
+                  >
+                    <UInput v-model="userBalanceState.remain_count" />
+                  </UFormGroup>
+                </div>
+
+                <template #footer>
+                  <div class="flex items-center justify-end gap-2">
                     <UButton
-                      block
-                      variant="soft"
-                      icon="i-heroicons-calendar-days-20-solid"
-                      :label="
-                        dayjs(userBalanceState.expire_time).format(
-                          'YYYY-MM-DD HH:mm'
+                      color="gray"
+                      size="sm"
+                      variant="ghost"
+                      @click="isBalanceEditModalOpen = false"
+                    >
+                      取消
+                    </UButton>
+                    <UButton
+                      color="primary"
+                      icon="tabler:check"
+                      size="sm"
+                      @click="
+                        udpateBalance(
+                          userBalanceState.request_type as ServiceTag,
+                          isActivateBalance
                         )
                       "
-                    />
+                    >
+                      {{ isActivateBalance ? '开通' : '续期' }}
+                    </UButton>
+                  </div>
+                </template>
+              </UCard>
+            </UModal>
+          </div>
 
-                    <template #panel="{ close }">
-                      <DatePicker
-                        v-model="userBalanceState.expire_time"
-                        locale="cn"
-                        mode="dateTime"
-                        title-position="left"
-                        is-required
-                        is24hr
-                        @close="close"
-                      />
-                    </template>
-                  </UPopover>
-                </UFormGroup>
-                <UFormGroup
-                  label="服务时长(秒)"
-                  class="flex-1"
-                >
-                  <UInput v-model="userBalanceState.remain_count" />
-                </UFormGroup>
-              </div>
-
-              <template #footer>
-                <div class="flex items-center justify-end gap-2">
-                  <UButton
-                    color="gray"
-                    size="sm"
-                    variant="ghost"
-                    @click="isBalanceEditModalOpen = false"
-                  >
-                    取消
-                  </UButton>
-                  <UButton
-                    color="primary"
-                    icon="tabler:check"
-                    size="sm"
-                    @click="
-                      udpateBalance(
-                        userBalanceState.request_type as ServiceTag,
-                        isActivateBalance
-                      )
-                    "
-                  >
-                    {{ isActivateBalance ? '开通' : '续期' }}
-                  </UButton>
-                </div>
-              </template>
-            </UCard>
-          </UModal>
-        </div>
-
-        <UDivider
-          label="数字人权限管理"
-          class="my-4"
-          :ui="{ label: 'text-primary-500 dark:text-primary-400' }"
-        />
-
-        <!-- <div class="flex w-full justify-end pb-4">
-          <UButton
-            icon="tabler:plus"
-            size="xs"
-            @click="isDigitalSelectorOpen = true"
-          >
-            新增授权
-          </UButton>
-        </div> -->
-        <div class="border dark:border-neutral-700 rounded-md">
-          <UTable
-            :columns="[
-              { key: 'name', label: '名称' },
-              { key: 'digital_human_id', label: '本地ID' },
-              { key: 'model_id', label: '上游ID' },
-              { key: 'actions' },
-            ]"
-            :loading="digitalHumansDataStatus === 'pending'"
-            :rows="digitalHumansData?.data.items"
-          >
-            <template #actions-data="{ row }">
-              <UButton
-                color="gray"
-                icon="tabler:cancel"
-                size="xs"
-                variant="ghost"
-                @click="
-                  revokeDigitalHuman(viewingUser?.id || 0, row.digital_human_id)
-                "
-              >
-                撤销授权
-              </UButton>
-            </template>
-          </UTable>
-        </div>
-        <div class="flex justify-between py-3.5">
-          <UButton
-            icon="tabler:plus"
-            size="xs"
-            @click="isDigitalSelectorOpen = true"
-          >
-            新增授权
-          </UButton>
-          <UPagination
-            v-if="(digitalHumansData?.data.total || -1) > 0"
-            v-model="dhPage"
-            :page-count="dhPageCount"
-            :total="digitalHumansData?.data.total || 0"
+          <UDivider
+            label="数字人权限管理"
+            class="my-4"
+            :ui="{ label: 'text-primary-500 dark:text-primary-400' }"
           />
+
+          <div class="border dark:border-neutral-700 rounded-md">
+            <UTable
+              :columns="[
+                { key: 'name', label: '名称' },
+                { key: 'digital_human_id', label: '本地ID' },
+                { key: 'model_id', label: '上游ID' },
+                { key: 'actions' },
+              ]"
+              :loading="digitalHumansDataStatus === 'pending'"
+              :rows="digitalHumansData?.data.items"
+            >
+              <template #actions-data="{ row }">
+                <UButton
+                  color="gray"
+                  icon="tabler:cancel"
+                  size="xs"
+                  variant="ghost"
+                  @click="
+                    revokeDigitalHuman(
+                      viewingUser?.id || 0,
+                      row.digital_human_id
+                    )
+                  "
+                >
+                  撤销授权
+                </UButton>
+              </template>
+            </UTable>
+          </div>
+          <div class="flex justify-between py-3.5">
+            <UButton
+              icon="tabler:plus"
+              size="xs"
+              @click="isDigitalSelectorOpen = true"
+            >
+              新增授权
+            </UButton>
+            <UPagination
+              v-if="(digitalHumansData?.data.total || -1) > 0"
+              v-model="dhPage"
+              :page-count="dhPageCount"
+              :total="digitalHumansData?.data.total || 0"
+            />
+          </div>
         </div>
       </UCard>
       <ModalDigitalHumanSelect