55 lines
1.3 KiB
Vue
55 lines
1.3 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
import { DefaultOptionType } from "ant-design-vue/es/select";
|
||
|
|
import { RuleExpression, useField } from "vee-validate";
|
||
|
|
import { cs } from "~/lib/client/storyFormSchema";
|
||
|
|
import { IBand } from "~/models/band";
|
||
|
|
import { log } from "~/lib/server/logger";
|
||
|
|
|
||
|
|
import iconEl from "../icon.vue";
|
||
|
|
|
||
|
|
const bandlist = inject<IBand[]>("bandlist");
|
||
|
|
const fname = inject<string>("curName");
|
||
|
|
const { updateBands, sb } = inject<any>("selectedBands");
|
||
|
|
|
||
|
|
const bl = ref(bandlist || []);
|
||
|
|
const options: DefaultOptionType[] = bl.value
|
||
|
|
.filter((a) => a.name != "")
|
||
|
|
.map((a) => ({
|
||
|
|
value: a._id,
|
||
|
|
label: a.name,
|
||
|
|
disabled: a.locked || false,
|
||
|
|
}));
|
||
|
|
let bandField = useField(
|
||
|
|
fname + "bands",
|
||
|
|
cs.fields.bands as unknown as MaybeRef<RuleExpression<number[]>>,
|
||
|
|
);
|
||
|
|
const { value, errorMessage, name, setValue } = bandField;
|
||
|
|
// setValue(sb)
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<a-form-item
|
||
|
|
:validate-status="!!errorMessage ? 'error' : undefined"
|
||
|
|
:help="errorMessage"
|
||
|
|
label="Bands"
|
||
|
|
>
|
||
|
|
<a-select
|
||
|
|
:allow-clear="true"
|
||
|
|
mode="multiple"
|
||
|
|
@change="
|
||
|
|
(val) => {
|
||
|
|
// log.debug(val);
|
||
|
|
updateBands(val);
|
||
|
|
setValue(val as number[]);
|
||
|
|
}
|
||
|
|
"
|
||
|
|
v-model:value="value"
|
||
|
|
:options="options"
|
||
|
|
>
|
||
|
|
<template #removeIcon>
|
||
|
|
<i class="far fa-circle-x" />
|
||
|
|
</template>
|
||
|
|
</a-select>
|
||
|
|
</a-form-item>
|
||
|
|
</template>
|