update: 封装按钮

modules/ibizlab-generator-core/src/main/resources/templ/r7/@macro/front-end/widgets/form-detail/form-button.hbs

 {{#eq item.psLayoutPos 'FLEX'}}
 <div style="flex-grow: {{#if item.psLayoutPos.grow}}{{item.psLayoutPos.grow}}{{else}}0{{/if}};">
-  <a-button 
-    type="primary"
-    v-show="state.detailsModel.{{item.codeName}}.visible"
-    class="app-form-button{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}"
-    style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}">
-      {{#if item.psSysImage}}
-      <template #icon>
-        <AppIconText {{#if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}"{{/if}} {{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}"{{/if}}/>
-      </template>
-      {{/if}}
-      {{#if item.showCaption}}
-      <span {{#if item.labelPSSysCss}}class="{{item.labelPSSysCss.cssName}}"{{/if}}>{{item.caption}}</span>
-      {{/if}}
-  </a-button>
+  <AppFormButton
+    :visible="state.detailsModel.{{item.codeName}}.visible"
+    className="app-form-button{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}"
+    style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}"
+    cssClass="{{#if item.psSysImage.cssClass}}{{item.psSysImage.cssClass}}{{/if}}"
+    imagePath="{{#if item.psSysImage.imagePath}}{{item.psSysImage.imagePath}}{{/if}}"
+    :showCaption="{{item.showCaption}}"
+    labelCssName="{{#if item.labelPSSysCss}}{{item.labelPSSysCss.cssName}}{{/if}}"
+    caption="{{#if item.caption}}{{item.caption}}{{/if}}"
+  />
 </div>
 {{else}}
 <a-col
 {{> @macro/front-end/widgets/common/layout-pos.hbs item=item.psLayoutPos}} >
-  <a-button 
-    type="primary"
-    v-show="state.detailsModel.{{item.codeName}}.visible"
-    class="app-form-button{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}"
-    style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}">
-      {{#if item.psSysImage}}
-      <template #icon>
-        <AppIconText {{#if item.psSysImage.cssClass}}iconClass="{{item.psSysImage.cssClass}}"{{/if}} {{#if item.psSysImage.imagePath}}imgPath="{{item.psSysImage.imagePath}}"{{/if}}/>
-      </template>
-      {{/if}}
-      {{#if item.showCaption}}
-      <span {{#if item.labelPSSysCss}}class="{{item.labelPSSysCss.cssName}}"{{/if}}>{{item.caption}}</span>
-      {{/if}}
-  </a-button>
+  <AppFormButton
+    :visible="state.detailsModel.{{item.codeName}}.visible"
+    className="app-form-button{{#if item.psSysCss}} {{item.psSysCss.cssName}}{{/if}}"
+    style="{{#if item.width}}width: {{item.width}}px;{{/if}}{{#if item.height}}height: {{item.height}}px;{{/if}}"
+    cssClass="{{#if item.psSysImage.cssClass}}{{item.psSysImage.cssClass}}{{else}}''{{/if}}"
+    imagePath="{{#if item.psSysImage.imagePath}}{{item.psSysImage.imagePath}}{{else}}''{{/if}}"
+    :showCaption="{{item.showCaption}}"
+    labelCssName="{{#if item.labelPSSysCss}}{{item.labelPSSysCss.cssName}}{{/if}}"
+    caption="{{#if item.caption}}{{item.caption}}{{/if}}"
+  />
 </a-col>
 {{/eq}}
\ No newline at end of file

modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/components/common/app-form-button.vue

+<script setup lang="ts">
+import { IActionParam, IParam } from "@core";
+
+interface FormGroupProps{
+  visible: boolean;
+  className: string;
+  style?: string;
+  cssClass?: string;
+  imagePath?: string;
+  showCaption?: boolean;
+  labelCssName?: string;
+  caption: string
+}
+const props = withDefaults(defineProps<FormGroupProps>(), {
+  visible: true,
+});
+
+</script>
+
+<template>
+    <a-button 
+      type="primary"
+      v-show="visible"
+      :class="className"
+      :style="style">
+        <template #icon v-if="cssClass || imagePath">
+          <AppIconText :iconClass="cssClass" :imgPath="imagePath"/>
+        </template>
+        <template v-if="showCaption && caption">
+        <span :class="labelCssName">{{caption}}</span>
+        </template>
+    </a-button>
+</template>
+
+<style lang="scss">
+</style>
\ No newline at end of file

modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/style/components/common/app-form-button.scss

+.app-form-button{
+  display: flex;
+  align-items: center;
+}
\ No newline at end of file

modules/ibizlab-generator-core/src/main/resources/templ/r7/app_{{apps}}/src/style/components/common/index.scss

@@ -7,3 +7,4 @@
 @use './lock.scss';
 @use './app-form-item.scss';
 @use './app-popover.scss';
+@use './app-form-button.scss';
\ No newline at end of file