56 lines
1.3 KiB
Vue
56 lines
1.3 KiB
Vue
<script setup lang="ts">
|
|
import promptSplitter from 'chatgpt-prompt-splitter';
|
|
import { useValidation } from '@/composable/validation';
|
|
|
|
const prompt = ref('');
|
|
const splitLength = ref(1024);
|
|
|
|
const splittedPrompts = computed(() => {
|
|
try {
|
|
return promptSplitter({
|
|
prompt: prompt.value,
|
|
splitLength: splitLength.value,
|
|
newLine: true,
|
|
});
|
|
}
|
|
catch (e: any) {
|
|
return [e.toString()];
|
|
}
|
|
});
|
|
|
|
const promptValidation = useValidation({
|
|
source: prompt,
|
|
rules: [
|
|
{
|
|
validator: v => v !== '',
|
|
message: 'Prompt must not be empty',
|
|
},
|
|
],
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div style="max-width: 600px;">
|
|
<c-card title="Prompt and options" mb-2>
|
|
<c-input-text
|
|
v-model:value="prompt"
|
|
label="Full Prompt"
|
|
multiline
|
|
placeholder="Put your full prompt here..."
|
|
rows="10"
|
|
:validation="promptValidation"
|
|
mb-2
|
|
/>
|
|
<n-form-item label="Character length for each chunk">
|
|
<n-input-number v-model:value="splitLength" :min="1" />
|
|
</n-form-item>
|
|
</c-card>
|
|
|
|
<c-card title="Divided prompts">
|
|
<div v-for="(splittedPrompt, index) in splittedPrompts" :key="index">
|
|
<TextareaCopyable :value="splittedPrompt" />
|
|
</div>
|
|
</c-card>
|
|
</div>
|
|
</template>
|