-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
9adbdaa
commit b3a5fee
Showing
7 changed files
with
157 additions
and
36 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,40 @@ | ||
| <script lang="ts" setup> | ||
| import { User } from 'fanbook-api-node-sdk'; | ||
| export interface Props { | ||
| modelValue: User[]; | ||
| /** 所属服务器。 */ | ||
| guild?: bigint; | ||
| /** 最大选择人数。 @default 1 */ | ||
| max?: number; | ||
| /** 最大显示人数。 @default 1 */ | ||
| maxShow?: number; | ||
| } | ||
| export type Events = { | ||
| 'update:model-value': [value: User[]]; | ||
| }; | ||
| const props = withDefaults(defineProps<Props>(), { | ||
| max: 1, | ||
| maxShow: 1, | ||
| }); | ||
| const emit = defineEmits<Events>(); | ||
| const adding = ref(false); | ||
| </script> | ||
|
|
||
| <template> | ||
| <ASpace> | ||
| <AAvatarGroup :max-count='maxShow'> | ||
| <AAvatar v-for='item in modelValue'> | ||
| {{ item.first_name }} | ||
| </AAvatar> | ||
| </AAvatarGroup> | ||
| <AButton v-if='modelValue.length < max' shape='round' @click='() => adding = !adding'> | ||
| <template #icon><IconPlus /></template> | ||
| </AButton> | ||
| <AInputNumber v-if='adding' hide-button :min='0' :precision='0'> | ||
| <template #prefix>#</template> | ||
| </AInputNumber> | ||
| </ASpace> | ||
| </template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,35 +1,57 @@ | ||
| <script lang='ts' setup> | ||
| import { GuildCredit } from 'fanbook-api-node-sdk'; | ||
| import { ChatMember, Guild } from 'fanbook-api-node-sdk'; | ||
| import { selectUser } from '~/utils/biz/user-selector'; | ||
| definePageMeta({ | ||
| title: '成员荣誉', | ||
| middleware: ['require-bot'], | ||
| }); | ||
| const credit: Ref<GuildCredit> = ref({ | ||
| authority: { | ||
| icon: 'https://fb-cdn.fanbook.mobi/fanbook/app/files/chatroom/image/ddf60a18da9f51be0255af8a115007ea.png', | ||
| name: '机器人工具', | ||
| }, | ||
| slots: [ | ||
| [{ | ||
| img: 'https://fb-cdn.fanbook.mobi/fanbook/app/files/chatroom/image/643162c237f9fbe8c9c09a5a6b409b77.png', | ||
| value: 'Collaborator', | ||
| }], | ||
| [{ | ||
| label: '头衔介绍', | ||
| value: '为项目捉虫和引路的志愿者', | ||
| }], | ||
| ], | ||
| title: { | ||
| img: 'https://fb-cdn.fanbook.mobi/fanbook/app/files/chatroom/image/643162c237f9fbe8c9c09a5a6b409b77.png', | ||
| }, | ||
| const LAST_PAGE = 2; | ||
| const page = ref(1); | ||
| const title = computed(() => { | ||
| switch (page.value) { | ||
| case 1: return '输入用户信息'; | ||
| case 2: return `@${input.value.user?.user.first_name} 的荣誉列表`; | ||
| } | ||
| }); | ||
| interface Input { | ||
| guild?: Guild; | ||
| user?: ChatMember; | ||
| } | ||
| const input: Ref<Input> = ref({}); | ||
| const pickingGuild = ref(false); | ||
| </script> | ||
|
|
||
| <template> | ||
| <FbCredit :credit='credit' editable /> | ||
| <TechnologyInfo title='data'> | ||
| {{ credit }} | ||
| </TechnologyInfo> | ||
| <FbGuildPicker v-model:visible='pickingGuild' @ok='(v) => input.guild = v' /> | ||
| <FeatureWrapper> | ||
| <ACard class='card' :title='title'> | ||
| <AForm v-if='page === 1' :model='input' auto-label-width> | ||
| <AFormItem field='guild' label='所在服务器' required> | ||
| <ASpace direction='vertical'> | ||
| <AButton @click='() => pickingGuild = true'>选择服务器</AButton> | ||
| <template v-if='input.guild'>已选择：{{ input.guild.name }}</template> | ||
| </ASpace> | ||
| </AFormItem> | ||
| <AFormItem field='user' label='用户 ID' required> | ||
| <AButton @click='() => selectUser().then((v) => input.user = v)'>选择</AButton> | ||
| {{ input.user }} | ||
| </AFormItem> | ||
| </AForm> | ||
| <template v-else></template> | ||
| <ASpace> | ||
| <AButton v-if='page !== LAST_PAGE' type='primary' @click='() => ++page'>下一步</AButton> | ||
| <AButton v-if='page !== 1' @click='() => --page'>上一步</AButton> | ||
| </ASpace> | ||
| </ACard> | ||
| </FeatureWrapper> | ||
| </template> | ||
|
|
||
| <style lang="postcss" scoped> | ||
| .card:deep() > .arco-card-body { | ||
| @apply flex flex-col justify-items-end !important; | ||
| } | ||
| </style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,60 @@ | ||
| import { Button, FormItem, InputNumber, Modal } from '@arco-design/web-vue'; | ||
| import { ChatMember, Guild } from 'fanbook-api-node-sdk'; | ||
| import FbGuildPicker from '~/components/fb/guild-picker.vue'; | ||
|
|
||
| export interface SelectUserOptions { | ||
| /** 弹窗标题。 */ | ||
| title?: string; | ||
| /** 默认的服务器。 */ | ||
| defaultGuild?: Guild; | ||
| /** 是否隐藏服务器选择器。 */ | ||
| hideGuild?: boolean; | ||
| } | ||
|
|
||
| export function selectUser(options?: SelectUserOptions): Promise<ChatMember | undefined> { | ||
| return new Promise((resolve) => { | ||
| const guild = ref(options?.defaultGuild); | ||
| const selectingGuild = ref(false); | ||
| const id: Ref<number | undefined> = ref(); | ||
| const user: Ref<ChatMember | undefined> = ref(); | ||
|
|
||
| async function handleIdChange(value?: number) { | ||
| if (!value || !guild.value) { | ||
| user.value = undefined; | ||
| return; | ||
| } | ||
| [user.value] = await getCurrentBot().getMembersByShortIds( | ||
| BigInt(guild.value.guild_id), | ||
| [value], | ||
| ); | ||
| } | ||
|
|
||
| Modal.open({ | ||
| title: options?.title ?? '选择用户', | ||
| content: () => (<> | ||
| {!options?.hideGuild && <FormItem label='所在服务器' required v-slot={{ | ||
| help: () => guild ? `已选择：${guild.value?.name}` : '', | ||
| }}> | ||
| <FbGuildPicker visible={selectingGuild.value} onOk={(v: Guild) => guild.value = v} onClose={() => selectingGuild.value = false} /> | ||
| <Button type={guild.value ? 'secondary' : 'outline'} onClick={() => selectingGuild.value = true}> | ||
| 选择服务器 | ||
| </Button> | ||
| </FormItem>} | ||
| <FormItem label='用户 ID' required> | ||
| <InputNumber | ||
| v-model={id.value} | ||
| hideButton | ||
| min={0} | ||
| precision={0} | ||
| onChange={handleIdChange} | ||
| v-slot={{ | ||
| prefix: () => '#', | ||
| }} | ||
| /> | ||
| </FormItem> | ||
| </>), | ||
| onOk: () => resolve(user.value), | ||
| onCancel: () => resolve(undefined), | ||
| }); | ||
| }); | ||
| } |