amis-saas-5329 [Feature] 「feat」服务调用配置升级

Change-Id: I24eb1b55ba3193651e07cbd2a2a5c98f8c270953

packages/amis-editor/src/plugin/CRUD.tsx

@@ -188,7 +188,7 @@ export class CRUDPlugin extends BasePlugin {
   scaffoldForm: ScaffoldForm = {
     title: '增删改查快速开始-CRUD',
     body: [
-      getSchemaTpl('api', {
+      getSchemaTpl('apiControl', {
         label: '接口地址',
         sampleBuilder: (schema: any) =>
           JSON.stringify(

packages/amis-editor/src/plugin/Form/Form.tsx

@@ -138,7 +138,7 @@ export class FormPlugin extends BasePlugin {
   scaffoldForm: ScaffoldForm = {
     title: '快速创建表单',
     body: [
-      getSchemaTpl('api', {
+      getSchemaTpl('apiControl', {
         label: '提交地址'
       }),
       {
@@ -534,7 +534,7 @@ export class FormPlugin extends BasePlugin {
           : {
               title: '接口',
               body: [
-                getSchemaTpl('api', {
+                getSchemaTpl('apiControl', {
                   label: '保存接口',
                   description: '用来保存表单数据',
                   sampleBuilder: () => `{
@@ -563,7 +563,7 @@ export class FormPlugin extends BasePlugin {
                   pipeOut: (value: any) => (value ? '' : undefined)
                 }),
 
-                getSchemaTpl('api', {
+                getSchemaTpl('apiControl', {
                   name: 'asyncApi',
                   label: '异步检测接口',
                   visibleOn: 'data.asyncApi != null',
@@ -575,7 +575,7 @@ export class FormPlugin extends BasePlugin {
                   type: 'divider'
                 },
 
-                getSchemaTpl('api', {
+                getSchemaTpl('apiControl', {
                   name: 'initApi',
                   label: '初始化接口',
                   description: '用来初始化表单数据',
@@ -657,7 +657,7 @@ export class FormPlugin extends BasePlugin {
                   pipeOut: (value: any) => (value ? '' : undefined)
                 }),
 
-                getSchemaTpl('api', {
+                getSchemaTpl('apiControl', {
                   name: 'initAsyncApi',
                   label: '异步检测接口',
                   visibleOn: 'data.initAsyncApi != null',

packages/amis-editor/src/plugin/Page.tsx

@@ -170,7 +170,7 @@ export class PagePlugin extends BasePlugin {
         {
           title: '接口',
           body: [
-            getSchemaTpl('api', {
+            getSchemaTpl('apiControl', {
               label: '数据初始化接口',
               name: 'initApi',
               sampleBuilder: () => `{
@@ -182,9 +182,24 @@ export class PagePlugin extends BasePlugin {
                   "id": 1,
                   "a": "sample"
                 }
-}`
+              }`
             }),
 
+            //             getSchemaTpl('api', {
+            //               label: '数据初始化接口',
+            //               name: 'initApi',
+            //               sampleBuilder: () => `{
+            //   "status": 0,
+            //   "msg": "",
+
+            //   data: {
+            //     // 示例数据
+            //     "id": 1,
+            //     "a": "sample"
+            //   }
+            // }`
+            //             }),
+
             getSchemaTpl('initFetch'),
 
             getSchemaTpl('switch', {

packages/amis-editor/src/renderer/APIControl.tsx

@@ -237,24 +237,43 @@ export default class APIControl extends React.Component<
     onPickerClose?.();
   }
 
+  @autobind
   renderHeader() {
-    const {render, actions, enablePickerMode} = this.props;
+    const {render, label, labelRemark, useMobileUI, popOverContainer, env} =
+      this.props;
+    const classPrefix = env?.theme?.classPrefix;
 
-    const actionsDom =
-      Array.isArray(actions) && actions.length > 0
-        ? actions.map((action, index) => {
-            return render(`action/${index}`, action, {
-              key: index,
-              onAction: this.handleAction.bind(this, action)
-            });
+    // const actionsDom =
+    //   Array.isArray(actions) && actions.length > 0
+    //     ? actions.map((action, index) => {
+    //         return render(`action/${index}`, action, {
+    //           key: index,
+    //           onAction: this.handleAction.bind(this, action)
+    //         });
+    //       })
+    //     : null;
+
+    return (
+      <header className="ApiControl-header" key="header">
+        <label className={cx(`${classPrefix}Form-label`)}>
+          {label || ''}
+          {labelRemark
+            ? render('label-remark', {
+                type: 'remark',
+                icon: labelRemark.icon || 'warning-mark',
+                tooltip: labelRemark,
+                className: cx(`Form-lableRemark`, labelRemark?.className),
+                useMobileUI,
+                container: popOverContainer
+                  ? popOverContainer
+                  : env && env.getModalContainer
+                  ? env.getModalContainer
+                  : undefined
               })
-        : null;
-
-    return actionsDom || enablePickerMode ? (
-      <header className="ae-ApiControl-header" key="header">
-        {enablePickerMode ? this.renderPickerSchema() : actionsDom}
+            : null}
+        </label>
       </header>
-    ) : null;
+    );
   }
 
   renderPickerSchema() {
@@ -953,6 +972,7 @@ export default class APIControl extends React.Component<
 }
 
 @FormItem({
-  type: 'ae-apiControl'
+  type: 'ae-apiControl',
+  renderLabel: false
 })
 export class APIControlRenderer extends APIControl {}

packages/amis-editor/src/renderer/OptionControl.tsx

@@ -47,7 +47,7 @@ export interface OptionControlState {
   api: SchemaApi;
   labelField: string;
   valueField: string;
-  source: 'custom' | 'api' | 'form';
+  source: 'custom' | 'api' | 'apicenter';
 }
 
 export default class OptionControl extends React.Component<
@@ -209,7 +209,7 @@ export default class OptionControl extends React.Component<
       data.value = defaultValue || undefined;
     }
 
-    if (source === 'api') {
+    if (source === 'api' || source === 'apicenter') {
       const {api, labelField, valueField} = this.state;
       data.source = api;
       data.labelField = labelField;
@@ -296,7 +296,7 @@ export default class OptionControl extends React.Component<
    * 切换选项类型
    */
   @autobind
-  handleSourceChange(source: 'custom' | 'api' | 'form') {
+  handleSourceChange(source: 'custom' | 'api' | 'apicenter') {
     this.setState({source: source}, this.onChange);
   }
 
@@ -396,8 +396,15 @@ export default class OptionControl extends React.Component<
   }
 
   renderHeader() {
-    const {render, label, labelRemark, useMobileUI, env, popOverContainer} =
-      this.props;
+    const {
+      render,
+      label,
+      labelRemark,
+      useMobileUI,
+      env,
+      popOverContainer,
+      hasApiCenter
+    } = this.props;
     const classPrefix = env?.theme?.classPrefix;
     const {source} = this.state;
     const optionSourceList = (
@@ -407,16 +414,17 @@ export default class OptionControl extends React.Component<
           value: 'custom'
         },
         {
-          label: '接口获取',
+          label: '外部接口',
           value: 'api'
-        }
+        },
+        ...(hasApiCenter ? [{label: 'API中心', value: 'apicenter'}] : [])
         // {
         //   label: '表单实体',
         //   value: 'form'
         // }
       ] as Array<{
         label: string;
-        value: 'custom' | 'api' | 'form';
+        value: 'custom' | 'api' | 'apicenter';
       }>
     ).map(item => ({
       ...item,
@@ -698,7 +706,7 @@ export default class OptionControl extends React.Component<
   renderApiPanel() {
     const {render} = this.props;
     const {source, api, labelField, valueField} = this.state;
-    if (source !== 'api') {
+    if (source === 'custom') {
       return null;
     }
 
@@ -711,6 +719,7 @@ export default class OptionControl extends React.Component<
         visibleOn: 'data.autoComplete !== false',
         value: api,
         onChange: this.handleAPIChange,
+        sourceType: source,
         footer: [
           {
             label: tipedLabel(