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

<template>
  <div class='tabviewpanel' style="height:100%;">
4
        <tabs :value="tabValue" :animated="false" class='tabexppanel' name='${ctrl.getCodeName()?lower_case}' @on-click="tabPanelClick">
5
        <#list ctrl.getPSControls() as tabviewpanel>
tony001's avatar
tony001 committed
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
                    h('span', '${tabviewpanel.getCaption()}'),
                    h('Badge', {
                        props: {
tony001's avatar
tony001 committed
30
                            count: <#if tabviewpanel.getPSSysCounterRef?? && tabviewpanel.getPSSysCounterRef()?? && tabviewpanel.getPSSysCounterRef().getPSAppCounter()??><#assign appCounter = tabviewpanel.getPSSysCounterRef().getPSAppCounter()/>${srfclassname('${appCounter.getCodeName()}')}counterservice.counterData.<#if tabviewpanel.getCounterId()??>${tabviewpanel.getCounterId()}</#if><#else>undefined</#if>,
31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48
                            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}
KK's avatar
KK committed
49
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
50
     */
51
    public isInit: any = {
52 53 54 55 56 57 58 59 60
<#list ctrl.getPSControls() as tabviewpanel>
        ${tabviewpanel.name}: <#if tabviewpanel_index == 0> true <#else> false </#if>,
</#list>
    }

    /**
     * 获取多项数据
     *
     * @returns {any[]}
KK's avatar
KK committed
61
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
62 63 64 65 66 67 68 69 70
     */
    public getDatas(): any[] {
        return [];
    }

    /**
     * 获取单项树
     *
     * @returns {*}
KK's avatar
KK committed
71
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
72 73 74 75 76
     */
    public getData(): any {
        return null;
    }

77 78 79 80
    /**
     * 从父传入的当前分页面板panel值
     *
     * @type {string}
KK's avatar
KK committed
81
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
82 83 84 85
     */
    @Prop() public tabValue?: string;

    /**
86
     * 值变化
87
     *
88 89
     * @param {*} newVal
     * @param {*} oldVal
KK's avatar
KK committed
90
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
91
     */
92 93 94
    @Watch('tabValue')
    public onValueChange(newVal: any, oldVal: any) {
        this.tabPanelClick(newVal);
95 96
    }

97 98 99
    /**
     * 行为参数
     *
100
     * @public
101
     * @type {*}
KK's avatar
KK committed
102
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
103
     */
104
    public action:any = '';
105 106 107 108 109

    /**
     * 被激活的分页面板
     *
     * @type {string}
KK's avatar
KK committed
110
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
111
     */
112
    public activiedTabViewPanel: string = '<#list ctrl.getPSControls() as tabviewpanel><#if tabviewpanel_index==0>${tabviewpanel.name}</#if></#list>';
113 114 115 116

    /**
     * 分页视图面板数据变更
     *
KK's avatar
KK committed
117
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
118 119 120 121 122 123 124 125 126
     */
    public tabViewPanelDatasChange(){
        this.counterRefresh();
    }

    /**
     * vue 生命周期
     *
     * @returns
KK's avatar
KK committed
127
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
128
     */
129
    public created() {
130 131 132 133 134 135
        this.afterCreated();
    }

    /**
     * 执行created后的逻辑
     *
KK's avatar
KK committed
136
     *  @memberof ${srfclassname('${ctrl.codeName}')}Base
137
     */    
138
    public afterCreated(){
139 140 141 142 143 144 145
        //设置分页导航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>
146 147 148 149 150 151 152
        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 });
tony001's avatar
tony001 committed
153
                this.$forceUpdate();
154 155 156 157 158 159 160
            });
        }
    }    

    /**
     * vue 生命周期
     *
KK's avatar
KK committed
161
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
162
     */
163
    public destroyed() {
164 165 166 167 168 169
        this.afterDestroy();
    }

    /**
     * 执行destroyed后的逻辑
     *
KK's avatar
KK committed
170
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
171
     */
172
    public afterDestroy() {
173 174 175 176 177 178 179 180 181 182 183 184 185
        if (this.viewStateEvent) {
            this.viewStateEvent.unsubscribe();
        }
        <#if destroyed_block??>
        ${destroyed_block}
        </#if>
    }

    /**
     * 分页面板选中
     *
     * @param {*} $event
     * @returns
KK's avatar
KK committed
186
     * @memberof ${srfclassname('${ctrl.codeName}')}Base
187
     */
188
    public tabPanelClick($event: any) {
189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208
        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>