<template>
    ${P.getPartCode(item,'PANEL').code}
</template>
<#assign import_block>
import { PanelDetailModel,PanelRawitemModel,PanelTabPanelModel,PanelTabPageModel,PanelFieldModel,PanelContainerModel,PanelControlModel,PanelUserControlModel,PanelButtonModel } from '@/model/panel-detail';
import ${srfclassname('${ctrl.codeName}')}Model from './${srffilepath2(ctrl.codeName)}-${ctrl.getControlType()?lower_case}-model';
import CodeListService from "@/codelist/codelist-service";
import UIService from '@/uiservice/ui-service';
</#assign>
<#ibizinclude>
../@MACRO/CONTROL/CONTROL_HEADER-BASE.vue.ftl
</#ibizinclude>
<#ibizinclude>
../../@VIEW/@MACRO/VIEW_LAYOUTPANEL/VIEW_LAYOUTPANEL_LOGIC.ftl
</#ibizinclude>
    /**
     * 接口实现
     *
     * @returns {any[]}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    getDatas(): any[] {
        if (!this.layoutData) {
            return [];
        }
        return [this.layoutData];
    }

    /**
     * 接口实现
     *
     * @returns {*}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    getData() {
        return this.layoutData;
    }

    /**
     * 父级部件引用
     *
     * @type {*}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    @Prop() public parentRef?: any;

    /**
     * 面板数据对象
     *
     * @type {*}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    @Prop() public inputData?: any;

    /**
     * 操作栏模型数据
     *
     * @type {*}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    @Prop() public actionModel?: any;

    /**
     * UI数据对象
     *
     * @type {*}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public data:any = {};

    /**
     * 数据模型对象
     *
     * @type {${srfclassname('${ctrl.codeName}')}Model}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public dataModel:${srfclassname('${ctrl.codeName}')}Model = new ${srfclassname('${ctrl.codeName}')}Model();

    /**
     * 代码表服务对象
     *
     * @type {CodeListService}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public codeListService:CodeListService = new CodeListService();

    <#if appde??>
    /**
     * 界面UI服务对象
     *
     * @type {${srfclassname('${appde.getCodeName()}')}UIService}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */  
    public appUIService:${srfclassname('${appde.getCodeName()}')}UIService = new ${srfclassname('${appde.getCodeName()}')}UIService();
    <#else>
    /**
     * 界面UI服务对象
     *
     * @type {UIService}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */  
    public appUIService:UIService = new UIService();
    </#if>

    /**
     * 视图布局是否加载
     *
     * @public
     * @memberof ${srfclassname('${ctrl.name}')}Base
     */
    public isLayoutLoadding: boolean = false;

    /**
     * 视图布局数据
     *
     * @public
     * @memberof ${srfclassname('${ctrl.name}')}Base
     */
    public layoutData:any = {};

    /**
     * 视图布局面板模型对象
     *
     * @public
     * @memberof ${srfclassname('${ctrl.name}')}Base
     */
    public layoutModelDetails:any = {};

    /**
     * 视图布局顶级成员名称
     *
     * @public
     * @memberof ${srfclassname('${ctrl.name}')}Base
     */
    public rootLayoutDetailNames: string[] = <@compress  single_line=true>[
        <#if ctrl.getRootPSPanelItems?? && ctrl.getRootPSPanelItems()??>
        <#list ctrl.getRootPSPanelItems() as panelItem>
        '${panelItem.name}'<#if panelItem_has_next>,</#if>
        </#list>
        </#if>
        ];</@compress>

    /**
     *  初始化布局
     *
     *  @public
     *  @memberof ${srfclassname('${ctrl.name}')}Base
     */
    public async initLayout() {
        if (this.rootLayoutDetailNames.length > 0) {
            for (let i = 0; i < this.rootLayoutDetailNames.length; i++) {
                const name = this.rootLayoutDetailNames[i];
                const rootItem = this.layoutItems[name];
                if (!rootItem) {
                    return;
                }
                await this.initLayoutItem(rootItem);
            }
        }
        return true;
    }

    /**
     *  初始化布局项
     *
     *  @public
     *  @memberof ${srfclassname('${ctrl.name}')}Base
     */
    public async initLayoutItem(layoutModelItem: any, index: number = 0) {
        const { name } = layoutModelItem;
        const layoutModelDetail = Util.getLayoutItemInstance(layoutModelItem);
        if (!index) {
            await layoutModelDetail.load(this.context, this.viewparams);
            this.$set(this.layoutModelDetails, name, layoutModelDetail);
            this.$set(this.layoutData, name, layoutModelDetail.getData());
        } else {
            layoutModelDetail.setIndex(index);
            await layoutModelDetail.load(this.context, this.viewparams);
            <#noparse>this.$set(this.layoutModelDetails, `${name}_${index}`, layoutModelDetail);</#noparse>
            <#noparse>this.$set(this.layoutData, `${name}_${index}`, layoutModelDetail.getData());</#noparse>
        }
        if (layoutModelDetail && layoutModelDetail.details) {
            if (layoutModelDetail.dataRegionType === 'MULTIDATA') {
                const multiData = layoutModelDetail.getData();
                if (multiData && multiData.length > 0) {
                    for (let i = 0; i < multiData.length; i++) {
                        for (let j = 0; j < layoutModelDetail.details.length; j++) {
                            const key = layoutModelDetail.details[j];
                            if (this.layoutItems[key]) {
                                await this.initLayoutItem(this.layoutItems[key], i);
                            }
                        }
                    }
                }
            } else {
                for (let i = 0; i < layoutModelDetail.details.length; i++) {
                    const key = layoutModelDetail.details[i];
                    if (this.layoutItems[key]) {
                        await this.initLayoutItem(this.layoutItems[key],index);
                    }
                }
            }
        }
    }

    /**
     * 视图布局面板项模型对象
     *
     * @public
     * @memberof ${srfclassname('${ctrl.name}')}Base
     */
    public layoutItems:any = {
    <#list ctrl.getAllPSPanelItems() as panelItem>
        <#assign detail>
        name: '${panelItem.getName()}',
        type: 'ITEMLAYOUT',
        caption: '${panelItem.getCaption()}',
        <#if panelItem.getTitleBarCloseMode?? && panelItem.getTitleBarCloseMode()??>titleBarCloseMode: ${panelItem.getTitleBarCloseMode()},</#if>
        isShowCaption: <#if panelItem.isShowCaption?? && panelItem.isShowCaption()??>${panelItem.isShowCaption()?c}</#if>,
        sysCss: '<#if panelItem.getPSSysCss?? && panelItem.getPSSysCss()??>${panelItem.getPSSysCss().getCssName()}</#if>',
        itemType: '${panelItem.getItemType()}',
        itemStyle: '${panelItem.getItemStyle()}',
        <#if panelItem.getPSSysImage?? && panelItem.getPSSysImage()??>sysImage:{
        iconcls: '<#if panelItem.getPSSysImage().getCssClass?? && panelItem.getPSSysImage().getCssClass()??>${panelItem.getPSSysImage().getCssClass()}</#if>',
        imagePath:'<#if panelItem.getPSSysImage().getImagePath?? && panelItem.getPSSysImage().getImagePath()??>${panelItem.getPSSysImage().getImagePath()}</#if>',
        rawContent: '<#if panelItem.getPSSysImage().getRawContent?? && panelItem.getPSSysImage().getRawContent()??>${panelItem.getPSSysImage().getRawContent()}</#if>'
        },</#if> 
        visible: <#if panelItem.getPSPanelItemGroupLogic('PANELVISIBLE')??>false<#else>true</#if>,
        disabled: false,
        layout:'<#if panelItem.getPSLayout?? && panelItem.getPSLayout()?? && panelItem.getPSLayout().getLayout?? && panelItem.getPSLayout().getLayout()??>${panelItem.getPSLayout().getLayout()}</#if>',
        layoutPos:'<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getLayoutPos?? && panelItem.getPSLayoutPos().getLayoutPos()??>${panelItem.getPSLayoutPos().getLayoutPos()}</#if>',
        layoutHeight:<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getHeight?? && panelItem.getPSLayoutPos().getHeight()??>${panelItem.getPSLayoutPos().getHeight()}<#else>0</#if>,
        heightMode:'<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getHeightMode?? && panelItem.getPSLayoutPos().getHeightMode()??>${panelItem.getPSLayoutPos().getHeightMode()}</#if>',
        layoutWidth:<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getWidth?? && panelItem.getPSLayoutPos().getWidth()??>${panelItem.getPSLayoutPos().getWidth()}<#else>0</#if>,
        widthMode:'<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getWidthMode?? && panelItem.getPSLayoutPos().getWidthMode()??>${panelItem.getPSLayoutPos().getWidthMode()}</#if>',
        spacingBottom:'<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getSpacingBottom?? && panelItem.getPSLayoutPos().getSpacingBottom()??>${panelItem.getPSLayoutPos().getSpacingBottom()}</#if>',
        spacingLeft:'<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getSpacingLeft?? && panelItem.getPSLayoutPos().getSpacingLeft()??>${panelItem.getPSLayoutPos().getSpacingLeft()}</#if>',
        spacingRight:'<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getSpacingRight?? && panelItem.getPSLayoutPos().getSpacingRight()??>${panelItem.getPSLayoutPos().getSpacingRight()}</#if>',
        spacingTop:'<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getSpacingTop?? && panelItem.getPSLayoutPos().getSpacingTop()??>${panelItem.getPSLayoutPos().getSpacingTop()}</#if>',
        hAlignSelf:'<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getHAlignSelf?? && panelItem.getPSLayoutPos().getHAlignSelf()??>${panelItem.getPSLayoutPos().getHAlignSelf()}</#if>',
        vAlignSelf:'<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getVAlignSelf?? && panelItem.getPSLayoutPos().getVAlignSelf()??>${panelItem.getPSLayoutPos().getVAlignSelf()}</#if>',
        flexGrow:<#if panelItem.getPSLayoutPos?? && panelItem.getPSLayoutPos()?? && panelItem.getPSLayoutPos().getGrow?? && panelItem.getPSLayoutPos().getGrow()??>${panelItem.getPSLayoutPos().getGrow()}<#else>0</#if>,
        flexParams:{align:'<#if panelItem.getFlexAlign?? && panelItem.getFlexAlign()??>${panelItem.getFlexAlign()}</#if>',dir:'<#if panelItem.getFlexDir?? && panelItem.getFlexDir()??>${panelItem.getFlexDir()}</#if>',vAlign:'<#if panelItem.getFlexVAlign?? && panelItem.getFlexVAlign()??>${panelItem.getFlexVAlign()}</#if>'},
        <#if panelItem.getParentPSPanelItem?? && panelItem.getParentPSPanelItem()??>
        parentName: '${panelItem.getParentPSPanelItem().getName()}',
        </#if>
        panel: this
        </#assign>
        <#if panelItem.getItemType()  == 'CONTAINER'>
        <@compress  single_line=true>${panelItem.name}:{ ${detail}
        <#if panelItem.getPSPanelItems()??>, 
        details:[<#list panelItem.getPSPanelItems() as childPanelItem>'${childPanelItem.getName()}'<#if childPanelItem_has_next>,</#if></#list>]
        </#if>
        <#if panelItem.getDataRegionType()??>,
        dataRegionType: '${panelItem.getDataRegionType()}'
        </#if>
        <#if panelItem.getDataSourceType()??>,
        dataSourceType: '${panelItem.getDataSourceType()}'
        </#if>
        <#if panelItem.getPSAppDataEntity?? && panelItem.getPSAppDataEntity()??>,
        appDataEntityCodeName: '${panelItem.getPSAppDataEntity().getCodeName()?lower_case}'
        </#if>
        <#if panelItem.getPSAppDEMethod?? && panelItem.getPSAppDEMethod()??>,
        appDEMethodCodeName: '${panelItem.getPSAppDEMethod().getCodeName()}'
        </#if>
        }<#if panelItem_has_next>,</#if></@compress>
        <#elseif panelItem.getItemType()  == 'RAWITEM'>
        <#assign rawItem>
        viewType: '${view.getViewType()}',
        predefinedType: '${panelItem.getPSRawItem().getPredefinedType()}',
        contentType: '${panelItem.getPSRawItem().getContentType()}',
        contentStyle: '${panelItem.getPSRawItem().getCssStyle()}',
        rawContent: '<#if panelItem.getRawContent?? && panelItem.getRawContent()??>${panelItem.getRawContent()}</#if>',
        htmlContent: '<#if panelItem.getHtmlContent?? && panelItem.getHtmlContent()??>${panelItem.getHtmlContent()}</#if>',
        <#if panelItem.getPSRawItem().getRenderMode?? && panelItem.getPSRawItem().getRenderMode()??>
        renderMode: '${panelItem.getPSRawItem().getRenderMode()}',
        </#if>
        <#if panelItem.getPSRawItem()?? && panelItem.getPSRawItem().getWrapMode?? && panelItem.getPSRawItem().getWrapMode()??>
        wrapMode:'${panelItem.getPSRawItem().getWrapMode()}',
        </#if>
        <#if panelItem.getPSRawItem()?? && panelItem.getPSRawItem().getVAlign?? && panelItem.getPSRawItem().getVAlign()??>
        vAlign:'${panelItem.getPSRawItem().getVAlign()}',
        </#if>
        <#if panelItem.getPSRawItem()?? && panelItem.getPSRawItem().getHAlign?? && panelItem.getPSRawItem().getHAlign()??>
        hAlign:'${panelItem.getPSRawItem().getHAlign()}',
        </#if>
        </#assign>
        <@compress  single_line=true>${panelItem.name}:{ ${detail}, ${rawItem} }<#if panelItem_has_next>,</#if></@compress>
        <#elseif panelItem.getItemType()  == 'FIELD'>
        <#assign field>
        required: <#if panelItem.isAllowEmpty()>false<#else>true</#if>,
        <#if panelItem.getFieldStates?? && panelItem.getFieldStates()??>
        fieldState: '${panelItem.getFieldStates()}',
        </#if>
        <#if panelItem.getPSEditor?? && panelItem.getPSEditor()??>
        <#if panelItem.getPSEditor().getPredefinedType?? && panelItem.getPSEditor().getPredefinedType()??>
        predefinedType: '${panelItem.getPSEditor().getPredefinedType()}',
        </#if>
        <#if panelItem.getPSEditor().getRenderMode?? && panelItem.getPSEditor().getRenderMode()??>
        renderMode: '${panelItem.getPSEditor().getRenderMode()}',
        </#if>
        </#if>
        <#if panelItem.getViewFieldName?? && panelItem.getViewFieldName()??>
        dataItemName:'${panelItem.getViewFieldName()}',
        </#if>
        <#if panelItem.getEditorType?? && panelItem.getEditorType()?? && (panelItem.getEditorType() == "SPAN")>
        <#if panelItem.getPSEditor?? && panelItem.getPSEditor()??>
        <#assign panelEditor = panelItem.getPSEditor() />
        <#if panelEditor.getWrapMode?? && panelEditor.getWrapMode()??>
        wrapMode:'${panelEditor.getWrapMode()}',
        </#if>
        <#if panelEditor.getVAlign?? && panelEditor.getVAlign()??>
        vAlign:'${panelEditor.getVAlign()}',
        </#if>
        <#if panelEditor.getHAlign?? && panelEditor.getHAlign()??>
        hAlign:'${panelEditor.getHAlign()}',
        </#if>
        </#if>
        </#if>
        </#assign>
        <@compress  single_line=true>${panelItem.name}:{ ${detail}, ${field} }<#if panelItem_has_next>,</#if></@compress>
        <#elseif panelItem.getItemType()  == 'CONTROL'>
        <@compress  single_line=true>${panelItem.name}:{ ${detail} }<#if panelItem_has_next>,</#if></@compress>
        <#elseif panelItem.getItemType()  == 'BUTTON'>
        <#assign button>
        <#if panelItem.getButtonStyle?? && panelItem.getButtonStyle()??>
        buttonStyle: '${panelItem.getButtonStyle()}',
        </#if>
        <#if panelItem.getBorderStyle?? && panelItem.getBorderStyle()??>
        borderStyle: '${panelItem.getBorderStyle()}',
        </#if>
        iconAlign: '${panelItem.getIconAlign()}',
        <#if panelItem.getPSUIAction?? && panelItem.getPSUIAction()??>
        <#assign uiAction = panelItem.getPSUIAction()/>
        uiAction: { actiontarget: '<#if uiAction.getActionTarget()??>${uiAction.getActionTarget()}</#if>', noprivdisplaymode: '<#if uiAction.getAppNoPrivDisplayMode()??>${uiAction.getAppNoPrivDisplayMode()}</#if>', dataaccaction: '<#if uiAction.getDataAccessAction()??>${uiAction.getDataAccessAction()}</#if>', visabled: true, disabled: false },
        <#if uiAction.getPredefinedType?? && uiAction.getPredefinedType()??>
        predefinedType: '${uiAction.getPredefinedType()}',
        </#if>
        </#if>
        <#if panelItem.getRenderMode?? && panelItem.getRenderMode()??>
        renderMode: '${panelItem.getRenderMode()}',
        </#if>
        </#assign>
        <@compress  single_line=true>${panelItem.name}:{ ${detail}, ${button} }<#if panelItem_has_next>,</#if></@compress>
        <#elseif panelItem.getItemType()  == 'USERCONTROL'>
        <@compress  single_line=true>${panelItem.name}:{ ${detail} }<#if panelItem_has_next>,</#if></@compress>
        <#elseif panelItem.getItemType()  == 'TABPANEL'>
        <@compress  single_line=true>${panelItem.name}:{ ${detail}<#if panelItem.getPSPanelTabPages()??>, 
        details:[<#list panelItem.getPSPanelTabPages() as tabpage>'${tabpage.getName()}'<#if tabpage_has_next>,</#if></#list>]</#if> }<#if panelItem_has_next>,</#if></@compress>
        <#elseif panelItem.getItemType()  == 'CTRLPOS'>
        <@compress  single_line=true>${panelItem.name}:{ ${detail} }<#if panelItem_has_next>,</#if></@compress>
        <#elseif panelItem.getItemType()  == 'TABPAGE'>
        <@compress  single_line=true>${panelItem.name}:{ ${detail}<#if panelItem.getPSPanelItems()??>, 
        details:[<#list panelItem.getPSPanelItems() as childPanelItem>'${childPanelItem.getName()}'<#if childPanelItem_has_next>,</#if></#list>]</#if>}<#if panelItem_has_next>,</#if></@compress>
        </#if>
    </#list>
    };

    /**
     * 监听数据对象
     *
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    @Watch('inputData', { deep: true } )
    public onInputDataChange(newVal: any, oldVal: any){
        if(newVal){
            this.computedUIData(newVal);
            this.layoutData = Util.deepCopy(newVal);
            this.computeButtonState(newVal);
            this.panelLogic('');
        }
    }

    /**
     * 生命周期
     *
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public mounted () {
        this.afterMounted();
    }

    /**
     * 执行mounted后的逻辑
     *
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public afterMounted () {
        const _this: any = this;
        _this.initLayout().then((result: any) => {
            _this.onInputDataChange(this.inputData);
            _this.isLayoutLoadding = false;
        });
    }

    /**
     * 计算UI展示数据
     * 
     * @param codelistArray 代码表模型数组
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public computedUIData(newVal:any){
        if((this.dataModel.getDataItems instanceof Function) && this.dataModel.getDataItems().length >0){
            this.dataModel.getDataItems().forEach((item:any) =>{
                this.data[item.name] = newVal[item.prop];
            })
        }
    }

    /**
     * 计算面板按钮权限状态
     *
     * @param {*} [data] 传入数据
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public computeButtonState(data:any){
        // 若为项布局面板，存在parentRef
        if(this.parentRef){
            let targetData:any = this.parentRef.transformData(data);
            if(this.layoutModelDetails && Object.keys(this.layoutModelDetails).length >0){
                Object.keys(this.layoutModelDetails).forEach((name:any) =>{
                    if(this.layoutModelDetails[name] && this.layoutModelDetails[name].uiAction && this.layoutModelDetails[name].uiAction.dataaccaction && Object.is(this.layoutModelDetails[name].itemType,"BUTTON")){
                        let tempUIAction:any = JSON.parse(JSON.stringify(this.layoutModelDetails[name].uiAction));
                        let result: any[] = ViewTool.calcActionItemAuthState(targetData, [tempUIAction], this.appUIService ? this.appUIService : null);
                        this.layoutModelDetails[name].visible = tempUIAction.visabled;
                        this.layoutModelDetails[name].disabled = tempUIAction.disabled;
                    }
                })
            }
        }
    }

    /**
     * 打开编辑数据视图
     *
     * @type {any}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public opendata(args: any[],fullargs?:any[],params?: any, $event?: any, xData?: any){
        if (this.parentRef.opendata && this.parentRef.opendata instanceof Function) {
            this.parentRef.opendata(args,fullargs,params, $event, xData);
        }
    }

    /**
     * 打开新建数据视图
     *
     * @type {any}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public newdata(args: any[],fullargs?:any[], params?: any, $event?: any, xData?: any) {
        if (this.parentRef.newdata && this.parentRef.newdata instanceof Function) {
            this.parentRef.newdata(args,fullargs,params, $event, xData);
        }
    }
    
    /**
     * 删除
     *
     * @param {any[]} datas
     * @returns {Promise<any>}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public async remove(datas: any[]): Promise<any> {
        if (this.parentRef.remove && this.parentRef.remove instanceof Function) {
            return this.parentRef.remove(datas);
        }
    }

    /**
     * 刷新
     *
     * @param {*} [args={}]
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public refresh(args: any = {}) {
        if (this.parentRef.refresh && this.parentRef.refresh instanceof Function) {
            this.parentRef.refresh(args);
        }
    }

    /**
     * 处理值改变
     *
     * @public
     * @params args 改变数据
     * @params index 多数据容器下标
     * @memberof ${srfclassname('${ctrl.name}')}Base
     */
    public handleValueChange(args: { name: string, value: any }, index?: number) {
        if (!args || !args.name || Object.is(args.name, '') || !this.layoutData.hasOwnProperty(args.name)) {
            return;
        }
        const { name, value } = args;
        this.data[name] = value;
        this.layoutData[name] = value;
        this.layoutModelDetails[name].setData(value);
        this.panelLogic(name, index);
        this.panelEditItemChange(this.data, name, value);
    }

    /**
     * 面板编辑项值变化后续操作
     *
     * @public
     * @param data 面板数据
     * @param property 编辑项名
     * @param value 编辑项值
     * @returns {void}
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public panelEditItemChange(data: any, property: string, value: any){
        // 面板数据变化事件
        if((this.dataModel.getDataItems instanceof Function) && this.dataModel.getDataItems().length >0){
            let modelitem =this.dataModel.getDataItems().find((item:any) =>{
                return item.name === property;
            }) 
            if(modelitem){
                this.$emit('panelDataChange',{[modelitem.prop]: value});
            }
        }
    }

    /**
     * 面板逻辑
     *
     * @public
     * @params name 改变项名称
     * @params index 多数据容器下标
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
     */
    public panelLogic(name: string, index?: number): void {
        if (name && (index || index === 0)) {
            <#noparse>name = name.replace(`_${index}`,"");</#noparse>
        }
    <#list ctrl.getAllPSPanelItems() as panelItem>
        <#if panelItem.getPSPanelItemGroupLogic('ITEMBLANK')??>
        <#assign ITEMBLANK = panelItem.getPSPanelItemGroupLogic('ITEMBLANK')/>
        if (Object.is(name, '')<#if ITEMBLANK.getRelatedItemNames()??><#list ITEMBLANK.getRelatedItemNames() as detailName> || Object.is(name, '${detailName}')</#list></#if>) {
            let ret = true;
            <#if ITEMBLANK.getRelatedItemNames()??>
            <#list ITEMBLANK.getRelatedItemNames() as detailName>
            let _${detailName} = '';
            if (index || index === 0) {
                _${detailName} = this.layoutData[`${detailName}<#noparse>_${index}</#noparse>`];
            } else {
                _${detailName} = this.layoutData['${detailName}'];
            }
            </#list>
            </#if>
            if (<@panelLogic ITEMBLANK/>) {
                ret = false;
            }
            if (index || index === 0) {
                this.layoutModelDetails[`${panelItem.name}<#noparse>_${index}</#noparse>`].required = ret;
            } else {
                this.layoutModelDetails['${panelItem.name}'].required = ret;
            }
        }
        </#if>
        <#if panelItem.getPSPanelItemGroupLogic('ITEMENABLE')??>
        <#assign ITEMENABLE = panelItem.getPSPanelItemGroupLogic('ITEMENABLE')/>
        if (Object.is(name, '')<#if ITEMENABLE.getRelatedItemNames()??><#list ITEMENABLE.getRelatedItemNames() as detailName> || Object.is(name, '${detailName}')</#list></#if>) {
            let ret = false;
            <#if ITEMENABLE.getRelatedItemNames()??>
            <#list ITEMENABLE.getRelatedItemNames() as detailName>
            let _${detailName} = '';
            if (index || index === 0) {
                _${detailName} = this.layoutData[`${detailName}<#noparse>_${index}</#noparse>`];
            } else {
                _${detailName} = this.layoutData['${detailName}'];
            }
            </#list>
            </#if>
            if (<@panelLogic ITEMENABLE/>) {
                ret = true;
            }
            if (index || index === 0) {
                this.layoutModelDetails[`${panelItem.name}<#noparse>_${index}</#noparse>`].disabled = !ret;
            } else {
                this.layoutModelDetails['${panelItem.name}'].disabled = !ret;
            }
        }
        </#if>
        <#if panelItem.getPSPanelItemGroupLogic('PANELVISIBLE')??>
        <#assign PANELVISIBLE = panelItem.getPSPanelItemGroupLogic('PANELVISIBLE')/>
        if (Object.is(name, '')<#if PANELVISIBLE.getRelatedItemNames()??><#list PANELVISIBLE.getRelatedItemNames() as detailName> || Object.is(name, '${detailName}')</#list></#if>) {
            let ret = false;
            <#if PANELVISIBLE.getRelatedItemNames()??>
            <#list PANELVISIBLE.getRelatedItemNames() as detailName>
            let _${detailName} = '';
            if (index || index === 0) {
                _${detailName} = this.layoutData[`${detailName}<#noparse>_${index}</#noparse>`];
            } else {
                _${detailName} = this.layoutData['${detailName}'];
            }
            </#list>
            </#if>
            if (<@panelLogic PANELVISIBLE/>) {
                ret = true;
            }
            if (index || index === 0) {
                this.layoutModelDetails[`${panelItem.name}<#noparse>_${index}</#noparse>`].visible = ret;
            } else {
                this.layoutModelDetails['${panelItem.name}'].visible = ret;
            }
        }
        </#if>
    </#list>
    }

    /**
     * 获取按钮行为xData
     *
     * @public
     * @memberof ${srfclassname('${ctrl.name}')}Base
     */
    public getButtonXData(name: string): any {
        let xData = null;
        let curLayoutModel = null;
        Object.values(this.layoutModelDetails).forEach((layoutModel: any) => {
            if (layoutModel.name == name) {
                curLayoutModel = layoutModel;
            }
        })
        // 获取数据容器
        if (curLayoutModel) {
            const getDataArea = (cLayoutModel: any): any => {
                let dataArea = null;
                let parentLayoutModel = null;
                Object.values(this.layoutModelDetails).forEach((pLayoutModel: any) => {
                    if (pLayoutModel.name == cLayoutModel.parentName) {
                        parentLayoutModel = pLayoutModel;
                        if (parentLayoutModel.dataRegionType == 'SINGLEDATA' || parentLayoutModel.dataRegionType == 'MULTIDATA') {
                            dataArea = parentLayoutModel;
                        }
                    }
                })
                if (!dataArea && parentLayoutModel) {
                    dataArea = getDataArea(parentLayoutModel);
                }
                return dataArea;
            }
            xData = getDataArea(curLayoutModel);
        }
        // 获取当前视图
        if (!xData) {
            xData = this;
        }
        return xData;
    }

    /**
     * 处理按钮点击
     *
     * @public
     * @memberof ${srfclassname('${ctrl.name}')}Base
     */
    public handleButtonClick(name: string, $event?: any) {
        const datas: any[] = [this.layoutData];
        const xData: any = this.getButtonXData(name);
        const paramJO: any = {};
        const contextJO: any = {};
        const _this: any = this;
        <#list ctrl.getAllPSPanelItems() as panelItem>
        <#if panelItem.getItemType()  == 'BUTTON' && panelItem.getPSUIAction?? && panelItem.getPSUIAction()??>
        if (Object.is(name, '${panelItem.name}')) {
            <#if panelItem.getPSUIAction().getPSAppDataEntity?? && panelItem.getPSUIAction().getPSAppDataEntity()?? && panelItem.getPSUIAction().getUIActionMode()?? && (panelItem.getPSUIAction().getUIActionMode() == "FRONT" || panelItem.getPSUIAction().getUIActionMode() == "BACKEND" || panelItem.getPSUIAction().getUIActionMode() == "WFFRONT" || panelItem.getPSUIAction().getUIActionMode() == "WFBACKEND")>
            <#assign curAppEntity = panelItem.getPSUIAction().getPSAppDataEntity() />
            window.uiServiceRegister.getService('${curAppEntity.getCodeName()?lower_case}').then((UIService: any) => {
                if (UIService && UIService[`${panelItem.getPSUIAction().getFullCodeName()}`] && UIService[`${panelItem.getPSUIAction().getFullCodeName()}`] instanceof Function) {
                    UIService[`${panelItem.getPSUIAction().getFullCodeName()}`](datas, contextJO, paramJO,  $event, xData, this, undefined);
                }
            })
            <#else>
            _this.${panelItem.getPSUIAction().getFullCodeName()}(datas, contextJO, paramJO,  $event, xData, this, undefined);
            </#if>
        }
        </#if>
        </#list>
    }

    <#if ctrl.getPSUIActions?? && ctrl.getPSUIActions()??>
    <#list ctrl.getPSUIActions() as uiAction>
    <#if !P.exists("importService", uiAction.getFullCodeName(), "")>
    <#if !(uiAction.getPSAppDataEntity?? && uiAction.getPSAppDataEntity()??) || (uiAction.getPSAppDataEntity?? && uiAction.getPSAppDataEntity()?? && uiAction.getUIActionMode?? && (uiAction.getUIActionMode() == 'SYS' || uiAction.getUIActionMode() == 'CUSTOM'))>
    <@viewLayoutPanelUIAction item=uiAction />
    </#if>
    </#if>
    </#list>
    </#if>

<#ibizinclude>
../@MACRO/CONTROL/CONTROL_BOTTOM-BASE.vue.ftl
</#ibizinclude>

<#ibizinclude>
../@MACRO/CONTROL/CONTROL-BASE.style.ftl
</#ibizinclude>