feat: 数据源支持飞书

core/core-frontend/src/views/visualized/data/datasource/form/EditorDetail.vue

@@ -24,10 +24,9 @@ import { CustomPassword } from '@/components/custom-password'
 import { ElForm, ElMessage, ElMessageBox } from 'element-plus-secondary'
 import Cron from '@/components/cron/src/Cron.vue'
 import { ComponentPublicInstance } from 'vue'
-import {PluginComponent, XpackComponent} from '@/components/plugin'
+import { PluginComponent, XpackComponent } from '@/components/plugin'
 import { iconFieldMap } from '@/components/icon-group/field-list'
 import { boolean } from 'mathjs'
-import LarkItemDraw from '@/views/visualized/data/datasource/form/LarkItemDraw_bak.vue'
 const { t } = useI18n()
 const prop = defineProps({
   form: {
@@ -97,6 +96,11 @@ const rule = ref<FormRules>(cloneDeep(defaultRule))
 const api_table_title = ref('')
 const editApiItem = ref()
 const editLarkItem = ref()
+const pluginDs = ref([])
+const pluginIndex = ref('')
+const isPlugin = ref(false)
+const xpack = ref()
+const visible = ref(false)
 const defaultApiItem = {
   name: '',
   deTableName: '',
@@ -128,7 +132,10 @@ const defaultApiItem = {
   jsonPath: ''
 }
 
-const initForm = type => {
+const initForm = (type, pluginDsList, indexPlugin, isPluginDs) => {
+  pluginDs.value = pluginDsList
+  pluginIndex.value = indexPlugin
+  isPlugin.value = isPluginDs
   if (!type.startsWith('API')) {
     form.value.configuration = {
       dataBase: '',
@@ -165,14 +172,10 @@ const initForm = type => {
   if (type === 'oracle') {
     form.value.configuration.connectionType = 'sid'
   }
-
   form.value.type = type
-  setTimeout(() => {
-    dsForm?.value?.clearValidate()
-  }, 0)
 }
 
-const notapiexcelconfig = computed(() => !form.value.type.startsWith('API'))
+const notapiexcelconfig = computed(() => form.value && !form.value.type.startsWith('API'))
 
 const authMethodList = [
   {
@@ -453,14 +456,12 @@ const addLarkItem = item => {
         : 0
     apiItem.serialNumber = serialNumber1 + serialNumber2
   }
+  visible.value = true
   nextTick(() => {
-    editLarkItem.value.initApiItem(
-      apiItem,
-      form.value,
-      activeName.value,
-      editItem,
-      isSupportSetKey.value
-    )
+    xpack?.value?.invokeMethod({
+      methodName: 'initApiItem',
+      args: [apiItem, form.value, activeName.value, editItem, isSupportSetKey.value]
+    })
   })
 }
 
@@ -758,6 +759,17 @@ const editParams = data => {
   dialogEditParams.value = true
 }
 
+const getPluginStatic = () => {
+  const arr = pluginDs.value.filter(ele => {
+    return ele.type === form.value.type
+  })
+  return pluginIndex.value
+    ? pluginIndex.value
+    : arr && arr.length > 0
+    ? arr[0].staticMap?.index
+    : null
+}
+
 const delParams = data => {
   ElMessageBox.confirm(t('data_source.sure_to_delete'), {
     confirmButtonType: 'danger',
@@ -1006,7 +1018,7 @@ defineExpose({
             </div>
           </div>
         </template>
-        <template v-if="form.type === 'APILark'">
+        <template v-if="form.type !== 'API' && form.type.startsWith('API')">
           <div class="title-form_primary flex-space table-info-mr" v-show="activeStep !== 2">
             <el-tabs v-model="activeName" class="api-tabs">
               <el-tab-pane :label="t('datasource.data_table')" name="table"></el-tab-pane>
@@ -1024,7 +1036,7 @@ defineExpose({
             :description="t('datasource.no_data_table')"
             img-type="noneWhite"
           />
-          <template v-if="form.type === 'APILark' && activeStep === 1 && activeName === 'table'">
+          <template v-if="activeStep === 1 && activeName === 'table'">
             <div class="api-card-content">
               <div
                 v-for="(api, idx) in form.apiConfiguration"
@@ -1623,18 +1635,12 @@ defineExpose({
       </el-dialog>
       <api-http-request-draw @return-item="returnItem" ref="editApiItem"></api-http-request-draw>
       <plugin-component
-        :jsname="getPluginStatic(currentDsType)"
+        :jsname="getPluginStatic()"
         ref="xpack"
-        :form="form"
-        :editDs="editDs"
-        :active-step="activeApiStep"
-        @submitForm="handleSubmit"
-        v-if="
-              activeStep !== 0 && currentDsType && currentDsType !== 'Excel' && visible && isPlugin
-            "
+        @return-item="returnItem"
+        v-if="isPlugin && visible"
       >
       </plugin-component>
-<!--      <lark-item-draw @return-item="returnItem" ref="editLarkItem"></lark-item-draw>-->
     </div>
   </div>
 </template>

core/core-frontend/src/views/visualized/data/datasource/form/index.vue

@@ -86,7 +86,7 @@ const selectDsType = (type: string) => {
   activeStep.value = 1
   activeApiStep.value = 1
   nextTick(() => {
-    detail?.value?.initForm(type) ||
+    detail?.value?.initForm(type, pluginDs.value, pluginIndex.value, isPlugin.value) ||
       xpack?.value?.invokeMethod({
         methodName: 'initForm',
         args: type
@@ -339,7 +339,6 @@ const validateDS = () => {
     configuration: string
     apiConfiguration: string
   }
-  console.log(form)
   if (currentDsType.value.includes('API')) {
     if (form.apiConfiguration.length === 0) {
       ElMessage.error(t('data_source.add_data_table'))
@@ -421,7 +420,6 @@ const typeTitle = computed(() => {
 
 const saveDS = () => {
   isUpdate = false
-  console.log('1')
   const request = JSON.parse(JSON.stringify(form)) as unknown as Omit<
     Form,
     'configuration' | 'apiConfiguration'
@@ -429,7 +427,6 @@ const saveDS = () => {
     configuration: string
     apiConfiguration: string
   }
-  console.log('1')
   if (currentDsType.value === 'Excel') {
     excel.value.uploadStatus(false)
     if (!excel.value.sheetFile?.name) {
@@ -467,7 +464,6 @@ const saveDS = () => {
         request.apiConfiguration[i].fields[j].value = []
       }
     }
-    console.log('3')
     let apiItems = []
     apiItems = apiItems.concat(request.apiConfiguration)
     if (request.paramsConfiguration) {
@@ -479,7 +475,6 @@ const saveDS = () => {
   } else {
     request.configuration = Base64.encode(JSON.stringify(request.configuration))
   }
-  console.log('4')
   if (isPlugin.value) {
     xpack?.value?.invokeMethod({
       methodName: 'submitForm',
@@ -490,7 +485,6 @@ const saveDS = () => {
     request.apiConfiguration = ''
     validate(val => {
       if (val) {
-        console.log('5')
         doSaveDs(request)
       }
     })
@@ -506,7 +500,6 @@ const doSaveDs = request => {
       showClose: false,
       tip: ''
     }
-    console.log('6')
     checkRepeat(request).then(res => {
       let method = request.id === '' ? save : update
       if (res) {
@@ -812,7 +805,11 @@ defineExpose({
             :active-step="activeApiStep"
             :is-supportSetKey="isSupportSetKey"
             v-if="
-              activeStep !== 0 && currentDsType && currentDsType !== 'Excel' && visible && !isPlugin
+              activeStep !== 0 &&
+              currentDsType &&
+              currentDsType !== 'Excel' &&
+              visible &&
+              (!isPlugin || currentDsType.startsWith('API'))
             "
           ></editor-detail>
           <plugin-component
@@ -823,7 +820,12 @@ defineExpose({
             :active-step="activeApiStep"
             @submitForm="handleSubmit"
             v-if="
-              activeStep !== 0 && currentDsType && currentDsType !== 'Excel' && visible && isPlugin
+              activeStep !== 0 &&
+              currentDsType &&
+              currentDsType !== 'Excel' &&
+              visible &&
+              isPlugin &&
+              !currentDsType.startsWith('API')
             "
           >
           </plugin-component>