初始化

easyflow-ui-admin/app/src/views/ai/bots/pages/setting/index.vue

@@ -0,0 +1,66 @@
+<script setup lang="ts">
+import type { BotInfo } from '@easyflow/types';
+
+import { computed, onMounted, ref } from 'vue';
+import { useRoute } from 'vue-router';
+
+import { tryit } from 'radash';
+
+import { getBotDetails } from '#/api';
+import { hasPermission } from '#/api/common/hasPermission';
+
+import Config from './config.vue';
+import Preview from './preview.vue';
+import Prompt from './prompt.vue';
+
+const route = useRoute();
+const hasSavePermission = computed(() =>
+  hasPermission(['/api/v1/bot/save', '/api/v1/bot/updateLlmId']),
+);
+const bot = ref<BotInfo>();
+
+onMounted(() => {
+  if (route.params.id) {
+    fetchBotDetail(route.params.id as string);
+  }
+});
+
+const fetchBotDetail = async (id: string) => {
+  const [, res] = await tryit(getBotDetails)(id);
+
+  if (res?.errorCode === 0) {
+    bot.value = res.data;
+  }
+};
+</script>
+
+<template>
+  <div class="settings-container">
+    <div class="row-container">
+      <div class="row-item">
+        <Prompt :bot="bot" :has-save-permission="hasSavePermission" />
+      </div>
+      <div class="row-item">
+        <Config :bot="bot" :has-save-permission="hasSavePermission" />
+      </div>
+      <div class="row-item">
+        <Preview :bot="bot" />
+      </div>
+    </div>
+  </div>
+</template>
+<style scoped>
+.settings-container {
+  height: calc(100vh - 90px);
+  padding: 20px;
+}
+.row-container {
+  height: 100%;
+  display: flex;
+  gap: 20px;
+}
+.row-item {
+  height: 100%;
+  flex: 1;
+}
+</style>