feat(manager): support bot create settings

packages/core/src/bot.ts

@@ -1,4 +1,4 @@
-import { Logger, sleep } from '@koishijs/utils'
+import { Logger, Random, sleep } from '@koishijs/utils'
 import { Adapter } from './adapter'
 import { App } from './app'
 import { Session } from './session'
@@ -14,6 +14,7 @@ export abstract class Bot<T extends Bot.BaseConfig = Bot.BaseConfig> {
   public internal?: any
   public selfId?: string
   public logger: Logger
+  public id = Random.id()
 
   private _status: Bot.Status
 

plugins/frontend/console/client/client.ts

@@ -146,8 +146,7 @@ const initTask = new Promise<void>((resolve) => {
       delete extensions[path]
     }
 
-    const { redirect } = router.currentRoute.value.query
-    const tasks = newValue.map(async (path) => {
+    async function loadExtension(path: string) {
       if (extensions[path]) return
       extensions[path] = new Context()
 
@@ -170,9 +169,13 @@ const initTask = new Promise<void>((resolve) => {
           router.replace(location)
         }
       }
-    })
+    }
+
+    const { redirect } = router.currentRoute.value.query
+    await Promise.all(newValue.map((path) => {
+      return loadExtension(path).catch(console.error)
+    }))
 
-    await Promise.allSettled(tasks)
     if (!oldValue) resolve()
   }, { deep: true })
 })

plugins/frontend/console/client/components/form/index.ts

@@ -4,7 +4,7 @@ import Input from './input.vue'
 import TabItem from './tab-item.vue'
 import TabGroup from './tab-group.vue'
 import Radio from './radio.vue'
-import Schema from './schema.vue'
+import Schema from './schema/index.vue'
 import { App } from 'vue'
 
 export default function (app: App) {

plugins/frontend/console/client/components/form/schema.vue → plugins/frontend/console/client/components/form/schema/index.vue

@@ -1,30 +1,9 @@
 <template>
   <template v-if="!schema || schema.meta.hidden"/>
 
-  <div class="schema-item" v-else-if="['string', 'number', 'boolean'].includes(schema.type)">
-    <div class="schema-header">
-      <div class="left">
-        <slot></slot>
-      </div>
-      <div class="right">
-        <el-switch v-if="schema.type === 'boolean'" v-model="config"></el-switch>
-        <template v-else>
-          <k-input v-model="config"
-            :style="{ width: schema.meta.role === 'url' ? '18rem' : '12rem' }"
-            :type="schema.type === 'number' ? 'number' : schema.meta.role === 'secret' && !showPass ? 'password' : 'text'">
-            <template #suffix v-if="schema.meta.role === 'url'">
-              <a :href="config" target="_blank" rel="noopener noreferrer">
-                <k-icon name="external"></k-icon>
-              </a>
-            </template>
-            <template #suffix v-else-if="schema.meta.role === 'secret'">
-              <k-icon :name="showPass ? 'eye' : 'eye-slash'" @click="showPass = !showPass"></k-icon>
-            </template>
-          </k-input>
-        </template>
-      </div>
-    </div>
-  </div>
+  <schema-primitive v-else-if="['string', 'number', 'boolean'].includes(schema.type)" :schema="schema" v-model="config">
+    <slot></slot>
+  </schema-primitive>
 
   <div class="schema-item" v-else-if="schema.type === 'array'">
     <div class="schema-header">
@@ -43,22 +22,23 @@
     </ul>
   </div>
 
-  <schema-group v-else-if="schema.type === 'object'" :desc="!noDesc && schema.meta.description">
+  <template v-else-if="schema.type === 'object'">
+    <h2 v-if="!noDesc && schema.meta.description">{{ schema.meta.description }}</h2>
     <k-schema v-for="(item, key) in schema.dict" :key="key" :schema="item" v-model="config[key]" :prefix="prefix + key + '.'">
       <h3 :class="{ required: item.meta.required }">
         <span>{{ prefix + key }}</span>
       </h3>
       <p>{{ item.meta.description }}</p>
     </k-schema>
-  </schema-group>
+  </template>
 
   <template v-else-if="schema.type === 'const'"></template>
 
   <template v-else-if="schema.type === 'intersect'">
     <k-schema v-for="item in schema.list" :schema="item" v-model="config" :prefix="prefix"/>
   </template>
 
-  <schema-union v-else-if="schema.type === 'union'" :schema="schema" v-model="config">
+  <schema-union v-else-if="schema.type === 'union'" :schema="schema" :prefix="prefix" v-model="config">
     <slot></slot>
   </schema-union>
 
@@ -72,8 +52,8 @@
 import { watch, ref } from 'vue'
 import type { PropType } from 'vue'
 import Schema from 'schemastery'
-import SchemaGroup from './schema-group.vue'
-import SchemaUnion from './schema-union.vue'
+import SchemaPrimitive from './primitive.vue'
+import SchemaUnion from './union.vue'
 
 const props = defineProps({
   schema: {} as PropType<Schema>,
@@ -93,13 +73,20 @@ function getFallback() {
   }
 }
 
-const showPass = ref(false)
+const config = ref<any>()
 
-const config = ref<any>(props.modelValue ?? getFallback())
+watch(() => props.modelValue, (value) => {
+  if (value !== null && value !== undefined) {
+    config.value = value
+  } else {
+    config.value = getFallback()
+    emit('update:modelValue', config.value)
+  }
+}, { immediate: true })
 
 watch(config, (value) => {
   emit('update:modelValue', value)
-}, { deep: true, immediate: true })
+}, { deep: true })
 
 </script>
 
@@ -108,7 +95,7 @@ watch(config, (value) => {
 .schema-item {
   padding: 0.5rem 1rem;
   border-bottom: 1px solid var(--border);
-  transition: 0.3s ease;
+  transition: border-color 0.3s ease;
 
   &:first-child, :not(.schema-item) + & {
     border-top: 1px solid var(--border);
@@ -166,7 +153,7 @@ watch(config, (value) => {
   .k-input .k-icon {
     height: 0.75rem;
     color: var(--fg3);
-    transition: 0.3s ease;
+    transition: color 0.3s ease;
 
     &:hover {
       color: var(--fg1);
@@ -192,7 +179,7 @@ watch(config, (value) => {
     .remove {
       color: var(--fg3);
       opacity: 0.4;
-      transition: 0.3s ease;
+      transition: opacity 0.3s ease;
       height: 0.875rem;
       margin-right: 0.25rem;
       cursor: pointer;

plugins/frontend/console/client/components/form/schema/primitive.vue

@@ -0,0 +1,47 @@
+<template>
+  <div class="schema-item">
+    <div class="schema-header">
+      <div class="left">
+        <slot></slot>
+      </div>
+      <div class="right">
+        <el-switch v-if="schema.type === 'boolean'" v-model="config"></el-switch>
+        <template v-else>
+          <k-input v-model="config"
+            :style="{ width: schema.meta.role === 'url' ? '18rem' : '12rem' }"
+            :type="schema.type === 'number' ? 'number' : schema.meta.role === 'secret' && !showPass ? 'password' : 'text'">
+            <template #suffix v-if="schema.meta.role === 'url'">
+              <a :href="config" target="_blank" rel="noopener noreferrer">
+                <k-icon name="external"></k-icon>
+              </a>
+            </template>
+            <template #suffix v-else-if="schema.meta.role === 'secret'">
+              <k-icon :name="showPass ? 'eye' : 'eye-slash'" @click="showPass = !showPass"></k-icon>
+            </template>
+          </k-input>
+        </template>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+
+import { computed, PropType, ref } from 'vue'
+import Schema from 'schemastery'
+
+const emit = defineEmits(['update:modelValue'])
+
+const props = defineProps({
+  schema: {} as PropType<Schema>,
+  modelValue: {},
+})
+
+const showPass = ref(false)
+
+const config = computed({
+  get: () => props.modelValue,
+  set: emit.bind(null, 'update:modelValue'),
+})
+
+</script>

plugins/frontend/console/client/components/form/schema/union.vue

@@ -0,0 +1,64 @@
+<template>
+  <k-schema v-if="choices.length === 1" :schema="choices[0]" :prefix="prefix" v-model="config">
+    <slot></slot>
+  </k-schema>
+
+  <div class="schema-item" v-else-if="isSelect">
+    <div class="schema-header">
+      <div class="left">
+        <slot></slot>
+      </div>
+      <div class="right">
+        <el-select v-model="config">
+          <el-option
+            v-for="item in choices"
+            :key="item.value"
+            :label="item.value"
+            :value="item.value"
+          ></el-option>
+        </el-select>
+      </div>
+    </div>
+  </div>
+
+  <div class="schema-item" v-else>
+    <slot></slot>
+    <ul v-if="choices.every(item => item.type === 'const')">
+      <li v-for="item in choices" :key="item.value">
+        <k-radio :label="item.value" v-model="selected">{{ item.meta.description || item.value }}</k-radio>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script lang="ts" setup>
+
+import { computed, ref } from 'vue'
+import type { PropType } from 'vue'
+import Schema from 'schemastery'
+
+const emit = defineEmits(['update:modelValue'])
+
+const props = defineProps({
+  schema: {} as PropType<Schema>,
+  modelValue: {},
+  prefix: String,
+})
+
+const config = computed({
+  get: () => props.modelValue,
+  set: emit.bind(null, 'update:modelValue'),
+})
+
+const choices = computed(() => {
+  return props.schema.list.filter(item => item.type !== 'transform')
+})
+
+const isSelect = computed(() => {
+  return choices.value.every(item => item.type === 'const')
+    && choices.value.some(item => !item.meta.description)
+})
+
+const selected = ref(props.schema.meta.default)
+
+</script>