import { Vue, Component, Prop, Provide, Emit, Watch } from 'vue-property-decorator';
import { Subject } from 'rxjs';
import { CreateElement } from 'vue';
import './${srffilepath2(view.name)}.less';

<#if view.getPSAppViewEngines()??>
<#list view.getPSAppViewEngines() as engine>
import ${engine.getEngineType()}Engine from '@engine/${engine.getEngineCat()?lower_case}/${srffilepath2(engine.getEngineType())}-engine';
</#list>
</#if>

<#if view.getPSControls()??>
<#list view.getPSControls() as ctrl>
<#if ctrl.getControlType() != 'TOOLBAR' && ctrl.getControlType() != 'CONTEXTMENU'>
<#if ctrl.getPSDataEntity?? && ctrl.getPSDataEntity()??>
import view_${ctrl.getName()} from '@widget/${srffilepath2(ctrl.getPSDataEntity().getCodeName())}/${srffilepath2(ctrl.getCodeName())}-${ctrl.getControlType()?lower_case}/${srffilepath2(ctrl.getCodeName())}-${ctrl.getControlType()?lower_case}';
<#else>
import view_${ctrl.getName()} from '@widget/app/${srffilepath2(ctrl.getCodeName())}-${ctrl.getControlType()?lower_case}/${srffilepath2(ctrl.getCodeName())}-${ctrl.getControlType()?lower_case}';
</#if>
</#if>
</#list>
</#if>
<#if import_block??>
${import_block}
</#if>

@Component({
    components: {
    <#if view.getPSControls()??>
    <#list view.getPSControls() as ctrl>
    <#if ctrl.getControlType() != "TOOLBAR">
        view_${ctrl.getName()}, 
    </#if>
    </#list>
    </#if>
    },
    beforeRouteEnter: (to: any, from: any, next: any) => {
        next((vm: any) => {
            vm.$store.commit('addCurPageViewtag', { fullPath: to.fullPath, viewtag: vm.viewtag });
        });
    },
})
export default class ${srfclassname('${view.name}')} extends Vue {

    /**
     * 数据变化
     *
     * @param {*} val
     * @returns {*}
     * @memberof ${srfclassname('${view.name}')}
     */
    @Emit() 
    public viewDatasChange(val: any):any {
        return val;
    }

    /**
     * 数据视图
     *
     * @type {string}
     * @memberof ${srfclassname('${view.name}')}
     */
    @Prop() public viewdata!: string;

    /**
     * 该视图是否为模态方式打开
     *
     * @type {boolean}
     * @memberof ${srfclassname('${view.name}')}
     */
    @Prop({default:false}) public isModal?:boolean;

	/**
	 * 视图标识
	 *
	 * @type {string}
	 * @memberof AppDashboardView
	 */
	public viewtag: string = '${view.getId()}';

    /**
     * 父数据对象
     *
     * @protected
     * @type {*}
     * @memberof ${srfclassname('${view.name}')}
     */
    protected srfparentdata: any = {};

    /**
     * 视图模型数据
     *
     * @type {*}
     * @memberof ${srfclassname('${view.name}')}
     */
    public model: any = {
        srfTitle: '<#if view.getTitle()??>${view.getTitle()}</#if>',
        srfCaption: '<#if view.isPSDEView()>${de.getCodeName()?lower_case}.views.${view.getPSDEViewCodeName()?lower_case}.caption<#else>app.views.${view.getCodeName()?lower_case}.caption</#if>',
        srfSubCaption: '<#if view.getSubCaption()??>${view.getSubCaption()}</#if>',
        dataInfo: ''
    }

    /**
     * 处理值变化
     *
     * @param {*} newVal
     * @param {*} oldVal
     * @memberof ${srfclassname('${view.name}')}
     */
    @Watch('viewdata')
    onViewData(newVal: any, oldVal: any) {
        const _this: any = this;
        if (!Object.is(newVal, oldVal) && _this.engine) {
            _this.engine.setViewData(newVal);
            _this.engine.load();
        }
    }

    /**
     * 容器模型
     *
     * @type {*}
     * @memberof ${srfclassname('${view.name}')}
     */
    public containerModel: any = {
        <#if view.getPSControls()??>
        <#list view.getPSControls() as ctrl>
        view_${ctrl.name}: { name: '${ctrl.name}', type: '${ctrl.getControlType()}' },
        </#list>
        </#if>
        <#if view.isPickupView() || (view.getViewType?? && (view.getViewType() == 'DEOPTVIEW' || view.getViewType() == 'DEWFSTARTVIEW' || view.getViewType() == 'DEWFACTIONVIEW'))>
        view_okbtn: { name: 'okbtn', type: 'button', text: '确定', disabled: true },
        view_cancelbtn: { name: 'cancelbtn', type: 'button', text: '取消', disabled: false },
        view_leftbtn: { name: 'leftbtn', type: 'button', text: '左移', disabled: true },
        view_rightbtn: { name: 'rightbtn', type: 'button', text: '右移', disabled: true },
        view_allleftbtn: { name: 'allleftbtn', type: 'button', text: '全部左移', disabled: true },
        view_allrightbtn: { name: 'allrightbtn', type: 'button', text: '全部右移', disabled: true },
        </#if>
        <#if view.getPSWorkflow?? && view.getPSWorkflow()??>
        wflinks: [],
        </#if>
    };

    /**
     * 视图状态订阅对象
     *
     * @private
     * @type {Subject<{action: string, data: any}>}
     * @memberof ${srfclassname('${view.name}')}
     */
    public viewState: Subject<ViewState> = new Subject();
<#if view.hasPSControl('toolbar')>

${P.getCtrlCode('toolbar', 'CONTROL.tsx').code}
</#if>