Friend invitation auto complete

This commit is contained in:
LittleSheep 2024-04-06 15:10:06 +08:00
parent 79cd1129fd
commit 8eb28f0115
2 changed files with 34 additions and 6 deletions

View File

@ -2,11 +2,13 @@
<v-card prepend-icon="mdi-account-plus" title="Invite someone"> <v-card prepend-icon="mdi-account-plus" title="Invite someone">
<v-form @submit.prevent="inviteMember"> <v-form @submit.prevent="inviteMember">
<v-card-text> <v-card-text>
<v-text-field <v-autocomplete
label="Username" label="Username"
variant="outlined" variant="outlined"
density="comfortable" density="comfortable"
hint="Require username not the nickname" autocomplete="off"
hide-selected
:items="friends.available.map(x => getOtherside(x).name)"
v-model="targetName" v-model="targetName"
/> />
</v-card-text> </v-card-text>
@ -23,11 +25,15 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref } from "vue" import { ref } from "vue"
import { request } from "@/scripts/request" import { request } from "@/scripts/request"
import { getAtk } from "@/stores/userinfo" import { getAtk, useUserinfo } from "@/stores/userinfo"
import { useFriends } from "@/stores/friends"
const props = defineProps<{ item: any }>() const props = defineProps<{ item: any }>()
const emits = defineEmits(["close", "error", "relist"]) const emits = defineEmits(["close", "error", "relist"])
const id = useUserinfo()
const friends = useFriends()
const loading = ref(false) const loading = ref(false)
const targetName = ref("") const targetName = ref("")
@ -51,4 +57,12 @@ async function inviteMember(evt: SubmitEvent) {
} }
loading.value = false loading.value = false
} }
function getOtherside(item: any) {
if (item.account_id === id.userinfo.data?.id) {
return item.related
} else {
return item.account
}
}
</script> </script>

View File

@ -2,11 +2,13 @@
<v-card prepend-icon="mdi-account-plus" title="Invite someone"> <v-card prepend-icon="mdi-account-plus" title="Invite someone">
<v-form @submit.prevent="inviteMember"> <v-form @submit.prevent="inviteMember">
<v-card-text> <v-card-text>
<v-text-field <v-autocomplete
label="Username" label="Username"
variant="outlined" variant="outlined"
density="comfortable" density="comfortable"
hint="Require username not the nickname" autocomplete="off"
hide-selected
:items="friends.available.map(x => getOtherside(x).name)"
v-model="targetName" v-model="targetName"
/> />
</v-card-text> </v-card-text>
@ -23,11 +25,15 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref } from "vue" import { ref } from "vue"
import { request } from "@/scripts/request" import { request } from "@/scripts/request"
import { getAtk } from "@/stores/userinfo" import { getAtk, useUserinfo } from "@/stores/userinfo"
import { useFriends } from "@/stores/friends"
const props = defineProps<{ item: any }>() const props = defineProps<{ item: any }>()
const emits = defineEmits(["close", "error", "relist"]) const emits = defineEmits(["close", "error", "relist"])
const id = useUserinfo()
const friends = useFriends()
const loading = ref(false) const loading = ref(false)
const targetName = ref("") const targetName = ref("")
@ -51,4 +57,12 @@ async function inviteMember(evt: SubmitEvent) {
} }
loading.value = false loading.value = false
} }
function getOtherside(item: any) {
if (item.account_id === id.userinfo.data?.id) {
return item.related
} else {
return item.account
}
}
</script> </script>