update：更新

src/components/layout-element/interactive/app-preset-button/app-preset-button.vue

 <template>
     <i-button 
-        :class="className"
+        :class="curClassName"
+        :style="curStyle"
         :type="buttonType"
         :disabled="disabled"
         :title="tooltip"
@@ -45,67 +46,91 @@ export default class AppPresetButton extends Vue {
     @Prop() public caption?: string;
 
     /**
-     * 显示标题
-     *
-     * @memberof AppPresetButton
-     */
-    @Prop({ default: true }) public showCaption!: boolean;
-
-    /**
-     * 禁用状态
+     * 加载状态
      *
      * @memberof AppPresetButton
      */
-    @Prop({ default: false }) public disabled?: boolean;
+    @Prop({ default: false }) public loading?: boolean;
 
     /**
-     * 加载状态
+     * 布局模型详情
      *
+     * @type {*}
      * @memberof AppPresetButton
      */
-    @Prop({ default: false }) public loading?: boolean;
+    @Prop() public layoutModelDetails: any;
 
     /**
-     * 传入数据
+     * 显示标题
      *
      * @memberof AppPresetButton
      */
-    @Prop() public data: any;
+    get showCaption() {
+        const layoutModel = this.layoutModelDetails[this.name];
+        return layoutModel.showCaption;
+    }
 
     /**
-     * 图标
+     * 类名
      *
      * @memberof AppPresetButton
      */
-    @Prop() public cssClass?: string;
+    get curClassName(){
+        const layoutModel = this.layoutModelDetails[this.name];
+        return `app-preset-button ${this.name} ${layoutModel.sysCss}`;
+    }
 
     /**
      * 图片路径
      *
      * @memberof AppPresetButton
      */
-    @Prop() public imagePath?: string;
+    get imagePath() {
+        const layoutModel = this.layoutModelDetails[this.name];
+        let imagePath = '';
+        if (layoutModel.sysImage) {
+            imagePath = layoutModel.sysImage.imagePath;
+        } else if (layoutModel.uiAction) {
+            imagePath = layoutModel.uiAction.imagePath;
+        }
+        return imagePath;
+    }
 
     /**
-     * 按钮绘制模式
+     * 图标
      *
      * @memberof AppPresetButton
      */
-    @Prop({ default: 'BUTTON' }) public renderMode!: 'BUTTON' | 'LINK';
+    get cssClass() {
+        const layoutModel = this.layoutModelDetails[this.name];
+        let cssClass = '';
+        if (layoutModel.sysImage) {
+            cssClass = layoutModel.sysImage.iconcls;
+        } else if (layoutModel.uiAction) {
+            cssClass = layoutModel.uiAction.iconcls;
+        }
+        return cssClass;
+    }
 
     /**
-     * 按钮样式
+     * 当前容器样式
      * 
      * @memberof AppPresetButton
      */
-    @Prop({ default: 'DEFAULT' }) public buttonStyle!: 'DEFAULT' | 'INVERSE' | 'PRIMARY' | 'INFO' | 'SUCCESS' | 'WARNING' | 'DANGER' | 'STYLE2' | 'STYLE3' | 'STYLE4';
+    get curStyle(){
+        const layoutModel = this.layoutModelDetails[this.name];
+        return layoutModel.getElementStyle();
+    }
 
     /**
-     * 按钮图标方向
+     * 禁用
      * 
      * @memberof AppPresetButton
      */
-    @Prop({ default: 'LEFT' }) public iconAlign!: 'LEFT' | 'TOP' | 'RIGHT' | 'BOTTOM';
+    get disabled(){
+        const layoutModel = this.layoutModelDetails[this.name];
+        return layoutModel.disabled;
+    }
 
     /**
      * 按钮类型
@@ -113,42 +138,45 @@ export default class AppPresetButton extends Vue {
      * @memberof AppPresetButton
      */
     get buttonType() {
-        if (Object.is(this.renderMode, 'LINK')) {
+        const layoutModel = this.layoutModelDetails[this.name];
+        if (Object.is(layoutModel.renderMode, 'LINK')) {
             return 'text';
         } else {
             if (
-                Object.is(this.buttonStyle, 'DEFAULT') ||
-                Object.is(this.buttonStyle, 'STYLE2') ||
-                Object.is(this.buttonStyle, 'STYLE3') ||
-                Object.is(this.buttonStyle, 'STYLE4')
+                Object.is(layoutModel.buttonStyle, 'DEFAULT') ||
+                Object.is(layoutModel.buttonStyle, 'STYLE2') ||
+                Object.is(layoutModel.buttonStyle, 'STYLE3') ||
+                Object.is(layoutModel.buttonStyle, 'STYLE4')
             ) {
                 return 'default';
-            } else if (Object.is(this.buttonStyle, 'DANGER')) {
+            } else if (Object.is(layoutModel.buttonStyle, 'DANGER')) {
                 return 'error';
-            } else if (Object.is(this.buttonStyle, 'INVERSE')) {
+            } else if (Object.is(layoutModel.buttonStyle, 'INVERSE')) {
                 return 'primary';
             } else {
-                return this.buttonStyle.toLowerCase();
+                return layoutModel.buttonStyle.toLowerCase();
             }
         }
     }
 
     /**
-     * 按钮幽灵属性，使按钮背景透明
+     * 图标方向
      *
      * @memberof AppPresetButton
      */
-    get buttonGhost() {
-        return Object.is(this.buttonStyle, 'INVERSE');
+    get iconAlign() {
+        const layoutModel = this.layoutModelDetails[this.name];
+        return layoutModel.iconAlign || 'LEFT';
     }
 
     /**
-     * 类名
+     * 按钮幽灵属性，使按钮背景透明
      *
      * @memberof AppPresetButton
      */
-    get className(): string {
-        return `app-preset-button ${this.name}`;
+    get buttonGhost() {
+        const layoutModel = this.layoutModelDetails[this.name];
+        return Object.is(layoutModel.buttonStyle, 'INVERSE');
     }
 
     /**

src/model/panel-detail/panel-button.ts

@@ -11,9 +11,12 @@ export class PanelButtonModel extends PanelDetailModel {
 
     constructor(opts: any = {}) {
         super(opts);
-        this.uiaction = opts.uiaction;
+        this.uiAction = opts.uiAction;
         this.buttonStyle = opts.buttonStyle;
         this.renderMode = opts.renderMode;
+        this.iconAlign = opts.iconAlign || 'LEFT';
+        this.showCaption = opts.showCaption ? true : false;
+        this.disabled = opts.disabled ? true : false;
     }
 
     /**
@@ -22,8 +25,31 @@ export class PanelButtonModel extends PanelDetailModel {
      * @type {*}
      * @memberof PanelButtonModel
      */
-    public uiaction:any;
+    public uiAction:any;
 
+    /**
+     * 图标方向
+     *
+     * @type {('LEFT' | 'TOP' | 'RIGHT' | 'BOTTOM')}
+     * @memberof PanelButtonModel
+     */
+    public iconAlign: 'LEFT' | 'TOP' | 'RIGHT' | 'BOTTOM';
+
+    /**
+     * 是否禁用
+     *
+     * @type {boolean}
+     * @memberof PanelButtonModel
+     */
+    public disabled: boolean = false;
+
+    /**
+     * 显示标题
+     *
+     * @type {boolean}
+     * @memberof PanelButtonModel
+     */
+    public showCaption: boolean = true;
 
     /**
      * @description 按钮类型