CONTROL-BASE.vue.ftl 5.5 KB
Newer Older
1 2 3

<template>
  <div class='tabviewpanel' style="height:100%;">
4
        <tabs :animated="false" class='tabexppanel' name='${ctrl.getCodeName()?lower_case}' @on-click="tabPanelClick">
5
        <#list ctrl.getPSControls() as tabviewpanel>
6
        <tab-pane :index="${tabviewpanel_index}" name='${tabviewpanel.name}' tab='${ctrl.getCodeName()?lower_case}' class='<#if tabviewpanel.getPSSysCss?? && tabviewpanel.getPSSysCss()??>${tabviewpanel.getPSSysCss().getCssName()}</#if>'  
7 8
            :label="(h) =>{
                return h('div', [
9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
                    <#if tabviewpanel.getPSSysImage()??>
                    <#assign sysimage = tabviewpanel.getPSSysImage()/>
                    <#if sysimage.getImagePath() ==  "">
                    h('i',{
                        class:'${sysimage.getCssClass()}',
                        style:{
                            'margin-right' : '2px'
                        }
                    }),
                    <#else>
                    h('img',{
                        src:'${sysimage.getImagePath()}',
                        style:{
                            'margin-right' : '2px'
                        }
                    }),
                    </#if>
                    </#if>
27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50
                    h('span', '${tabviewpanel.getCaption()}'),
                    h('Badge', {
                        props: {
                            count: <#if tabviewpanel.getPSSysCounterRef()?? && tabviewpanel.getPSSysCounterRef().getPSAppCounter()??><#assign appCounter = tabviewpanel.getPSSysCounterRef().getPSAppCounter()/>${srfclassname('${appCounter.getCodeName()}')}counterservice.counterData.<#if tabviewpanel.getCounterId()??>${tabviewpanel.getCounterId()}</#if><#else>undefined</#if>,
                            type: 'primary'
                        }
                    })
                ])
            }" >
            ${P.getCtrlCode(tabviewpanel, 'CONTROL.html').code}
        </tab-pane>
        </#list>
    </tabs>
  </div>
</template>
<#ibizinclude>
../@MACRO/CONTROL/CONTROL_HEADER-BASE.vue.ftl
</#ibizinclude>
    /**
     * 是否初始化
     *
     * @returns {any}
     * @memberof ${srfclassname('${ctrl.codeName}')}
     */
51
    public isInit: any = {
52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79
<#list ctrl.getPSControls() as tabviewpanel>
        ${tabviewpanel.name}: <#if tabviewpanel_index == 0> true <#else> false </#if>,
</#list>
    }

    /**
     * 获取多项数据
     *
     * @returns {any[]}
     * @memberof ${srfclassname('${ctrl.codeName}')}
     */
    public getDatas(): any[] {
        return [];
    }

    /**
     * 获取单项树
     *
     * @returns {*}
     * @memberof ${srfclassname('${ctrl.codeName}')}
     */
    public getData(): any {
        return null;
    }

    /**
     * 行为参数
     *
80
     * @public
81 82 83
     * @type {*}
     * @memberof ${srfclassname('${ctrl.codeName}')}
     */
84
    public action:any = '';
85 86 87 88 89 90 91

    /**
     * 被激活的分页面板
     *
     * @type {string}
     * @memberof ${srfclassname('${ctrl.codeName}')}
     */
92
    public activiedTabViewPanel: string = '<#list ctrl.getPSControls() as tabviewpanel><#if tabviewpanel_index==0>${tabviewpanel.name}</#if></#list>';
93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108

    /**
     * 分页视图面板数据变更
     *
     * @memberof ${srfclassname('${ctrl.codeName}')}
     */
    public tabViewPanelDatasChange(){
        this.counterRefresh();
    }

    /**
     * vue 生命周期
     *
     * @returns
     * @memberof ${srfclassname('${ctrl.codeName}')}
     */
109
    public created() {
110 111 112 113 114 115 116 117
        this.afterCreated();
    }

    /**
     * 执行created后的逻辑
     *
     *  @memberof ${srfclassname('${ctrl.codeName}')}
     */    
118
    public afterCreated(){
119 120 121 122 123 124 125
        //设置分页导航srfparentdename和srfparentkey
        <#if ctrl.getPSAppDataEntity()??>
        <#assign appDataEntity = ctrl.getPSAppDataEntity()/>
        if(this.context.${appDataEntity.getCodeName()?lower_case}){
            Object.assign(this.context,{srfparentdename:'${appDataEntity.getCodeName()}',srfparentkey:this.context.${appDataEntity.getCodeName()?lower_case}})
        }
        </#if>
126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141
        if (this.viewState) {
            this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => {
                if (!Object.is(tag, this.name)) {
                    return;
                }
                this.action = action;
                this.viewState.next({ tag: this.activiedTabViewPanel, action: action, data: data });
            });
        }
    }    

    /**
     * vue 生命周期
     *
     * @memberof ${srfclassname('${ctrl.codeName}')}
     */
142
    public destroyed() {
143 144 145 146 147 148 149 150
        this.afterDestroy();
    }

    /**
     * 执行destroyed后的逻辑
     *
     * @memberof ${srfclassname('${ctrl.codeName}')}
     */
151
    public afterDestroy() {
152 153 154 155 156 157 158 159 160 161 162 163 164 165 166
        if (this.viewStateEvent) {
            this.viewStateEvent.unsubscribe();
        }
        <#if destroyed_block??>
        ${destroyed_block}
        </#if>
    }

    /**
     * 分页面板选中
     *
     * @param {*} $event
     * @returns
     * @memberof ${srfclassname('${ctrl.codeName}')}
     */
167
    public tabPanelClick($event: any) {
168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187
        if (!$event) {
            return;
        }
        this.isInit[$event] = true;
        if (!this.viewState) {
            return;
        }
        this.activiedTabViewPanel = $event;
        this.viewState.next({ tag: this.activiedTabViewPanel, action: this.action, data: {}});
    }



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

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