36 lines
1.1 KiB
Vue
36 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
import { RuleExpression, useField } from "vee-validate";
|
|
import { cs } from "@client/storyFormSchema";
|
|
import { IBand } from "@models/band";
|
|
const fname = inject<string>("curName");
|
|
const { sb: selectedBands } = inject<any>("selectedBands");
|
|
const allBands = inject<Ref<IBand[]>>("bandlist");
|
|
const opts = computed(() => {
|
|
const unflattened: any[] = [];
|
|
selectedBands?.value?.forEach((v: number) => {
|
|
unflattened.push(allBands?.value.find((a) => a._id == v)?.characters);
|
|
});
|
|
return unflattened.flat(Infinity).map((a) => ({ value: a, label: a }));
|
|
});
|
|
const charField = useField<string[]>(
|
|
fname + "characters",
|
|
cs.fields.characters as unknown as MaybeRef<RuleExpression<string[]>>,
|
|
);
|
|
const { value, errorMessage, name: bandName, setValue } = charField;
|
|
// setValue([]);
|
|
</script>
|
|
<template>
|
|
<a-form-item
|
|
:help="errorMessage"
|
|
label="Characters"
|
|
:name="bandName as string"
|
|
:validate-status="!!errorMessage ? 'error' : undefined"
|
|
>
|
|
<a-select mode="multiple" :options="opts" v-model:value="value">
|
|
<template #removeIcon>
|
|
<i class="far fa-circle-x" />
|
|
</template>
|
|
</a-select>
|
|
</a-form-item>
|
|
</template>
|