VIEW-BASE.vue.ftl

<#ibizinclude>
../@MACRO/LAYOUTPANEL_VIEW.template.ftl
</#ibizinclude>

<#assign import_block>
import { appConfig } from '@/config/appConfig';
</#assign>

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

<#assign mounted_block>
        this.viewState.next({ tag: 'appmenu', action: 'load', data: {} });
        this.$viewTool.setIndexParameters([{ pathName: '${view.getCodeName()?lower_case}', parameterName: '${view.getCodeName()?lower_case}' }]);
        this.$viewTool.setIndexViewParam(this.context);
        this.mouse_move();
        <#--  let loader:any = document.getElementById('app-loader');
        loader.parentNode.removeChild(loader);  -->
</#assign>

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

    /**
     * 菜单位置
     *
     * @public
     * @type {string}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    public mode: string ='<#if view.getMainMenuAlign()=="TOP">horizontal</#if><#if view.getMainMenuAlign()=="LEFT" || view.getMainMenuAlign() =="">vertical</#if>';

    /**
     * 导航模式(route:面包屑模式、tab:分页导航模式)
     *
     * @type {string}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    @Provide()
    public navModel:string = "<#if view.getViewStyle() == "STYLE2">route<#else>tab</#if>";

    /**
     * 抽屉状态
     *
     * @type {boolean}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    public contextMenuDragVisiable: boolean = false;

    /**
     * 是否支持应用切换
     *
     * @type {boolean}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    public isEnableAppSwitch: boolean = <#if view.isEnableAppSwitch?? && view.isEnableAppSwitch()??>${view.isEnableAppSwitch()?c}<#else>false</#if>;

    <#if view.getViewStyle() != "STYLE2">
    /**
     * 初始化之前
     *
     * @memberof ${srfclassname('${view.name}')}Base
     */
    public beforeCreate(){
        let navDataService = NavDataService.getInstance();
        navDataService.removeAllNavData();
    }
    </#if>

    /**
     * 当前主题
     *
     * @readonly
     * @memberof ${srfclassname('${view.name}')}Base
     */
    get selectTheme() {
        if (this.$router.app.$store.state.selectTheme) {
            return this.$router.app.$store.state.selectTheme;
        } else if (localStorage.getItem('theme-class')) {
            return localStorage.getItem('theme-class');
        } else {
            return appConfig.defaultTheme;
        }
    }

    /**
     * 当前字体
     *
     * @readonly
     * @memberof ${srfclassname('${view.name}')}Base
     */
    get selectFont() {
        if (this.$router.app.$store.state.selectFont) {
            return this.$router.app.$store.state.selectFont;
        } else if (localStorage.getItem('font-family')) {
            return localStorage.getItem('font-family');
        } else {
            return appConfig.defaultFont;
        }
    }

    /**
     * 菜单收缩变化
     *
     * @type {boolean}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    public collapseChange: boolean = false;

    /**
     * 菜单收缩点击
     *
     * @memberof ${srfclassname('${view.name}')}Base
     */
    public handleClick(): void {
        this.collapseChange = !this.collapseChange;
    }

    /**
     * 默认打开的视图
     *
     * @type {*}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    public defPSAppView: any = {
        <#if view.getDefPSAppView()??>
        <#assign dataview = view.getDefPSAppView()>
        codename: '${dataview.getCodeName()?lower_case}',
        viewtitle: '${dataview.getTitle()}',
        openmode: '${dataview.getOpenMode()}',
        width: ${dataview.getWidth()?c},
        height: ${dataview.getHeight()?c},
        deResParameters: [],
        <#--  BEGIN：是否应用实体视图  -->
        <#if dataview.isPSDEView()>
        <#assign appDataEntity = dataview.getPSAppDataEntity()/>
        routepath: '/${view.getCodeName()?lower_case}/:${view.getCodeName()?lower_case}?/${srfpluralize(appDataEntity.codeName)?lower_case}/:${appDataEntity.getCodeName()?lower_case}?/${dataview.getPSDEViewCodeName()?lower_case}/:${dataview.getPSDEViewCodeName()?lower_case}?',
        parameters: [
            { pathName: '${srfpluralize(appDataEntity.codeName)?lower_case}', parameterName: '${appDataEntity.getCodeName()?lower_case}' },
            { pathName: '${dataview.getPSDEViewCodeName()?lower_case}', parameterName: '${dataview.getPSDEViewCodeName()?lower_case}' },
        ],
        <#else>
        routepath: '/${view.getCodeName()?lower_case}/:${view.getCodeName()?lower_case}?/${dataview.getCodeName()?lower_case}/:${dataview.getCodeName()?lower_case}?',
        parameters: [
            { pathName: '${dataview.getCodeName()?lower_case}', parameterName: '${dataview.getCodeName()?lower_case}' },
        ],
        </#if>
        <#--  END：是否应用实体视图  -->
        </#if>
    };

    /**
     * 应用起始页面
     *
     * @type {boolean}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    public isDefaultPage: boolean = ${view.isDefaultPage()?c};

    /**
     * 空白视图模式
     *
     * @type {boolean}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    public isBlankMode:boolean = ${view.isBlankMode()?c};

    /**
     * 获取样式
     *
     * @readonly
     * @type {string[]}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    get themeClasses(): string {
        return this.selectTheme;
    }

    /**
     * 主题字体
     *
     * @readonly
     * @type {*}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    get themeStyle(): any {
        return {
            'height': '100vh',
            'font-family': this.selectFont,
        }
    }

    /**
     * 获取路由列表
     *
     * @readonly
     * @type {any[]}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    get getRouterList(): any[] {
        return this.$store.state.historyPathList;
    }

    /**
     * 获取路由键值
     *
     * @readonly
     * @type {string}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    get getRouterViewKey(): string {
        return this.$route.fullPath;
    }

    /**
     * 鼠标拖动事件
     *
     * @param {*} val
     * @returns {*}
     * @memberof ${srfclassname('${view.name}')}Base
     */
    public mouse_move(){
        let move_axis:any = document.getElementById("move_axis");
        let left_move :any= document.getElementById("left_move");
        let right_move :any= document.getElementById("right_move");
        let movebox :any= document.getElementById("movebox");
        if(left_move && right_move && move_axis && movebox){
            let leftWidth :number = parseInt(left_move.style.width);
            move_axis.onmousedown = (e:any) =>{
                let startX = e.clientX;
                move_axis.left = move_axis.offsetLeft;
                document.onmousemove =  (e:any) =>{
                    let endX = e.clientX; 
                    let moveLen = move_axis.left + (endX - startX);
                    let maxT = movebox.clientWidth - move_axis.offsetWidth;
                    if (moveLen < 150) moveLen = 150;
                    if (moveLen > maxT - 150) moveLen = maxT - 150; 
                    move_axis.style.left = moveLen;
                    left_move.style.width = moveLen + "px";
                    right_move.style.width = (movebox.clientWidth - moveLen - 5) + "px";
                    if (moveLen>500) {
                        left_move.style.width = 500 + 'px';
                    }

                    let left_width : number = parseInt(left_move.style.width);
                    move_axis.style.left = left_width - 5 + 'px';
                    if (left_width < leftWidth){
                        move_axis.style.left = leftWidth - 5 + 'px';
                    }
                }
                document.onmouseup = (evt) =>{
                    document.onmousemove = null;
                    document.onmouseup = null;
                    move_axis.releaseCapture && move_axis.releaseCapture();
                }
                move_axis.setCapture && move_axis.setCapture();
                return false;
            }
        }
    }

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

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