aiDrawInput.vue 1.0 KB

12345678910111213141516171819202122232425262728293031323334
  1. <script setup lang="ts">
  2. import { NTabs,NTabPane } from 'naive-ui';
  3. import aiDrawInputItem from './aiDrawInputItem.vue'
  4. import aiFace from './aiFace.vue'
  5. import aiBlend from './aiBlend.vue'
  6. import aiDall from './aiDall.vue'
  7. const $emit=defineEmits(['drawSent','close']);
  8. const drawSent=(d:any )=> $emit('drawSent',d);
  9. </script>
  10. <template>
  11. <div class="overflow-y-auto bg-[#fafbfc] pt-2 dark:bg-[#18181c] h-full draw-tabs">
  12. <n-tabs type="line" animated default-value="draw">
  13. <n-tab-pane name="start" tab="">
  14. </n-tab-pane>
  15. <n-tab-pane name="draw" :tab="$t('mjchat.draw')" >
  16. <aiDrawInputItem @draw-sent="drawSent" @close="$emit('close')"></aiDrawInputItem>
  17. </n-tab-pane>
  18. <n-tab-pane name="face" :tab="$t('mjchat.face')">
  19. <div class="p-4"><aiFace /></div>
  20. </n-tab-pane>
  21. <n-tab-pane name="blend" :tab="$t('mjchat.blend')">
  22. <div class="p-4"><aiBlend /></div>
  23. </n-tab-pane>
  24. <n-tab-pane name="dall3" tab="Dall.E">
  25. <div class="p-4"><aiDall /></div>
  26. </n-tab-pane>
  27. </n-tabs>
  28. </div>
  29. </template>