<template>
{{#if page.psSysPFPlugin}}
  {{> @macro/plugins/view/view-use.hbs appPlugin=page.psSysPFPlugin}}
{{else}}
    <AppSDViewLayout :class="classNames" :openType="openType">
        <template v-if="!noViewCaption && model.showCaption" #viewHeaderContentLeft>
            <div class="view-header__caption">
                {{> @macro/view/view-caption.hbs}}
                {{> @macro/view/view-datainfo-bar.hbs}}
            </div>
        </template>
        <template #viewHeaderContentRight>
  {{#each page.ctrls as | ctrl |}}
    {{#eq ctrl.controlType 'TOOLBAR'}}
      {{#and ctrl.userTag (eq ctrl.userTag 'VIEW')}}
        <div class="view-header__toolbar" v-if="!store.editMode">
            <AppToolbar
                name="toolbar"
                mode="DEFAULT"
                :items="store.toolbarItems_view"
                :loading="store.loadingHelper.isLoading"
                @item-click="(name: string, event: MouseEvent, logic: any) => { toolbarItemClick(name, event, logic) }">
            </AppToolbar>
        </div>
      {{else}}
        <div class="view-header__toolbar" v-if="store.editMode">
            <AppToolbar
                name="toolbar"
                mode="DEFAULT"
                :items="store.toolbarItems_edit"
                :loading="store.loadingHelper.isLoading"
                @item-click="(name: string, event: MouseEvent, logic: any) => { toolbarItemClick(name, event, logic) }">
            </AppToolbar>
        </div>
      {{/and}}
    {{/eq}}
  {{/each}}
    </template>
    <template #default>
    {{#each page.ctrls as | ctrl |}}
        {{#eq ctrl.controlType 'FORM'}}
        {{#and ctrl.userTag (eq ctrl.userTag 'VIEW')}}
        {{> @macro/widgets/form-detail/form.hbs ctrl=ctrl props='v-show="!store.editMode"'}}
        {{else}}
        {{> @macro/widgets/form-detail/form.hbs ctrl=ctrl props='v-show="store.editMode"'}}
        {{/and}}
        {{/eq}}
    {{/each}}
    </template>
      {{> @macro/view/view-msg.hbs}}          
    </AppSDViewLayout>
{{/if}}
</template>

<script lang="ts" setup>
import { AppSDViewLayout } from "@components/layout/sd-view-layout";
import { AppToolbar } from '@components/widgets/toolbar';
{{#page.ctrls}}
  {{#eq controlType 'FORM'}}
import {{codeName}}Form from '@widgets/{{spinalCase psAppDataEntity.codeName}}/{{spinalCase codeName}}-form/{{spinalCase codeName}}-form.vue';
  {{/eq}}
{{/page.ctrls}}
{{!-- {{> @macro/widgets/ctrl/import-ctrl.hbs ctrls=page.ctrls}} --}}
import { model } from './{{spinalCase page.codeName}}-model';
import {
  useNavParamsBind,
  useEventBind,
  handleToolbarItemClick,
  handleCtrlAction,
  handleCtrlInit,
  handleCtrlDestroy,
  getViewClassNames,
} from "@/hooks/use-view";
import { 
  EditViewActionType,
  IContext,
  IParam,
  IEditViewAbility,
  IEditViewControllerParams,
  ViewAndEditStyleController,
  IEditViewStore,
  EditViewController,
  IEditViewController,
  ILoadingHelper,
  IEditFormAbility,
  IEvent
} from '@/core';
{{> @macro/view/view-props.hbs}}

{{> @macro/common/emit.hbs name="view" actionType="EditViewActionType" ability="IEditViewAbility"}}
//  样式名称
const classNames = computed(() => {
  return getViewClassNames(model, props);
});

const params: IEditViewControllerParams<EditViewActionType, IEditViewAbility> = {
  name: props.name,
  model,
  evt,
  isLoadDefault: props.isLoadDefault,
  openType: props.openType,
  pLoadingHelper: props.pLoadingHelper,
  handler: (data: IEditViewStore) => { return reactive(data)}
};
const controller = new ViewAndEditStyleController(params);

useNavParamsBind(controller, props);

const store = controller.getStore();

//  工具栏点击
const toolbarItemClick = (name: string, event: MouseEvent, logic: any) => {
  if (logic) {
    if (logic.predefinedType === 'EDITVIEW_OTHERACTION') {
      controller.changeEditMode();
      return;
    }
    if (logic.xDataCtrlName) {
      if (store.editMode) {
        const form = model.ctrls.find(
          (ctrl: IParam) => ctrl.controlType === 'FORM' && !ctrl.userTag
        );
        if (form) {
          logic.xDataCtrlName = form.name;
        }
      } else {
        const form = model.ctrls.find(
          (ctrl: IParam) =>
            ctrl.controlType === 'FORM' && ctrl.userTag === 'VIEW'
        );
        if (form) {
          logic.xDataCtrlName = form.name;
        }
      }
    }
  }
  handleToolbarItemClick(controller, name, event, logic);
};
onMounted(() => {
  controller.viewMounted();
})

onUnmounted(() => {
  controller.viewDestroy();
})
</script>
