|
@@ -54,14 +54,14 @@ |
|
|
aria-label="Queue Selection" |
|
|
aria-label="Queue Selection" |
|
|
ref="queueOptions" |
|
|
ref="queueOptions" |
|
|
> |
|
|
> |
|
|
|
|
|
<option :value="-2">None</option> |
|
|
<option :value="-1">New Queue</option> |
|
|
<option :value="-1">New Queue</option> |
|
|
<option :value="queue.id" v-for="(queue, i) in queues" v-bind:key="i"> |
|
|
<option :value="queue.id" v-for="(queue, i) in queues" v-bind:key="i"> |
|
|
{{ queue.name }} |
|
|
{{ queue.name }} |
|
|
</option> |
|
|
</option> |
|
|
</select> |
|
|
</select> |
|
|
</div> |
|
|
</div> |
|
|
<div class="is-flex is-flex-direction-row is-flex-grow-1 ml-1" |
|
|
|
|
|
v-if="queueSelection === -1"> |
|
|
|
|
|
|
|
|
<div class="is-flex is-flex-direction-row is-flex-grow-1 ml-1" v-if="queueSelection === -1"> |
|
|
<input |
|
|
<input |
|
|
class="input mr-1" |
|
|
class="input mr-1" |
|
|
type="text" |
|
|
type="text" |
|
@@ -70,6 +70,20 @@ |
|
|
aria-label="Queue Name" |
|
|
aria-label="Queue Name" |
|
|
> |
|
|
> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="is-flex-grow-1 ml-1" v-else-if="queueSelection >= 0"> |
|
|
|
|
|
<Draggable |
|
|
|
|
|
v-model="queueMembers" |
|
|
|
|
|
group="people" |
|
|
|
|
|
@start="drag=true" |
|
|
|
|
|
@end="drag=false" |
|
|
|
|
|
item-key="id"> |
|
|
|
|
|
> |
|
|
|
|
|
<template #item="{ queue }"> |
|
|
|
|
|
{{ queue.title }} |
|
|
|
|
|
</template> |
|
|
|
|
|
<div>{{ queue.title }}</div> |
|
|
|
|
|
</Draggable> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
</section> |
|
|
</section> |
|
|
</section> |
|
@@ -91,15 +105,22 @@ import { |
|
|
CreateQueueRequest, |
|
|
CreateQueueRequest, |
|
|
CreateQueueResponse, |
|
|
CreateQueueResponse, |
|
|
FundInfo, |
|
|
FundInfo, |
|
|
|
|
|
GetQueueMembersRequest, |
|
|
|
|
|
GetQueueMembersResponse, |
|
|
GetQueuesResponse, |
|
|
GetQueuesResponse, |
|
|
Queue, |
|
|
Queue, |
|
|
|
|
|
RewardFund, |
|
|
SuccessResponse, |
|
|
SuccessResponse, |
|
|
} from '@/api/types'; |
|
|
} from '@/api/types'; |
|
|
import { ref } from 'vue'; |
|
|
|
|
|
|
|
|
import { |
|
|
|
|
|
ref, |
|
|
|
|
|
watch, |
|
|
|
|
|
} from 'vue'; |
|
|
import store from '@/store'; |
|
|
import store from '@/store'; |
|
|
import { useRouter } from 'vue-router'; |
|
|
import { useRouter } from 'vue-router'; |
|
|
import FundTierInput from '@/components/FundTierInput.vue'; |
|
|
import FundTierInput from '@/components/FundTierInput.vue'; |
|
|
import { sanitize } from '@/lib/helpers'; |
|
|
import { sanitize } from '@/lib/helpers'; |
|
|
|
|
|
import Draggable from 'vuedraggable'; |
|
|
|
|
|
|
|
|
const router = useRouter(); |
|
|
const router = useRouter(); |
|
|
|
|
|
|
|
@@ -119,6 +140,8 @@ const minContribution = ref(undefined as number | undefined); |
|
|
|
|
|
|
|
|
const queueSelection = ref(undefined as number | undefined); |
|
|
const queueSelection = ref(undefined as number | undefined); |
|
|
const queueName = ref(undefined as string | undefined); |
|
|
const queueName = ref(undefined as string | undefined); |
|
|
|
|
|
const queueMembers = ref(undefined as RewardFund[] | undefined); |
|
|
|
|
|
const drag = ref(false); |
|
|
|
|
|
|
|
|
const queues = ref([] as Queue[]); |
|
|
const queues = ref([] as Queue[]); |
|
|
const fetchQueues = async () => { |
|
|
const fetchQueues = async () => { |
|
@@ -177,6 +200,13 @@ const submit = async () => { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
watch(queueSelection, async (newValue) => { |
|
|
|
|
|
if (newValue !== undefined && newValue >= 0) { |
|
|
|
|
|
const resp = await controller.post<GetQueueMembersResponse, GetQueueMembersRequest>('GetQueueMembers', { id: newValue }); |
|
|
|
|
|
queueMembers.value = resp?.members; |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
<style scoped lang="stylus"> |
|
|
<style scoped lang="stylus"> |
|
|