<!--
/**
 * author: vformAdmin
 * email: vdpadmin@163.com
 * website: https://www.vform666.com
 * date: 2021.08.18
 * remark: 如果要分发VForm源码，需在本文件顶部保留此文件头信息！！
 */
-->

<template>
  <container-item-wrapper :widget="widget">
    <div
      class="detail-wrap grid-container"
      :class="[customClass]"
      :ref="widget.id"
    >
      <div class="d-header clearfix">
        <div class="fl">
          <i class="el-icon-info" />
          {{ getI18nLabel(widget.options.label) }}
        </div>
        <!--        <div class="fr">
          <el-button type="primary" plain class="button-sty" icon="el-icon-refresh-right" @click="reload">重置
          </el-button>
          <el-button type="primary" class="button-sty" icon="el-icon-check" @click="saveData" v-if="!wfInfo.id">保存
          </el-button>
        </div>-->
        <div class="fr">
          <template v-for="(subWidget, swIdx) in widget.widgetList">
            <template v-if="'container' === subWidget.category">
              <component
                :is="subWidget.type + '-item'"
                :widget="subWidget"
                :key="swIdx"
                :parent-list="widget.widgetList"
                :index-of-parent-list="swIdx"
                :parent-widget="widget"
              >
                <!-- 递归传递插槽！！！ -->
                <template
                  v-for="slot in Object.keys($scopedSlots)"
                  v-slot:[slot]="scope"
                >
                  <slot :name="slot" v-bind="scope" />
                </template>
              </component>
            </template>
            <template v-else>
              <component
                :is="subWidget.type + '-widget'"
                :field="subWidget"
                :designer="null"
                :key="swIdx"
                :parent-list="widget.widgetList"
                :index-of-parent-list="swIdx"
                :parent-widget="widget"
              >
                <!-- 递归传递插槽！！！ -->
                <template
                  v-for="slot in Object.keys($scopedSlots)"
                  v-slot:[slot]="scope"
                >
                  <slot :name="slot" v-bind="scope" />
                </template>
              </component>
            </template>
          </template>
        </div>
      </div>
      <baseTabs :showNav="!widget.options.hideNav">
        <detail-pane-widget
          v-for="(paneWidget, index) in widget.panes"
          :key="index"
          :widget="paneWidget"
          :parent-list="widget.panes"
          :index-of-parent-list="index"
          :parent-widget="widget"
          :col-height="widget.options.colHeight"
          tabRef="baseTabRef"
          :tabPaneGrade="2"
        ></detail-pane-widget>
      </baseTabs>
    </div>
  </container-item-wrapper>
</template>

<script>
import emitter from "../../../../components/xform/utils/emitter";
import i18n from "../../../../components/xform/utils/i18n";
import refMixin from "../../../../components/xform/form-render/refMixin";
import ContainerItemWrapper from "./container-item-wrapper";
import containerItemMixin from "./containerItemMixin";
import detailPaneWidget from "../../../../components/xform/form-render/container-item/detail-pane-item";
import FieldComponents from "../../../../components/xform/form-designer/form-widget/field-widget/index";

import { initWf } from "../../../../components/wf/wfUtil";

export default {
  name: "detail-item",
  componentName: "ContainerItem",
  mixins: [emitter, i18n, refMixin, containerItemMixin],
  components: {
    ContainerItemWrapper,
    detailPaneWidget,
    ...FieldComponents,
  },
  props: {
    widget: Object,
  },
  inject: ["refList", "sfRefList", "globalModel", "previewState"],
  created() {
    this.initRefList();
    this.handleOnCreated();
  },
  mounted() {
    this.handleOnMounted();
    this.$nextTick(() => {
      this.createWf();
    });
  },
  beforeDestroy() {
    this.unregisterFromRefList();
  },
  data() {
    return {
      wfInfo: {},
    };
  },
  methods: {
    reload() {
      this.getFormRef().$parent.$baseReload();
    },
    saveData() {
      if (!!this.previewState) return;
      this.getFormRef().saveForm();
    },
    createWf() {
      if (!!this.previewState || !this.widget.options.wfEnabled) return;
      let formTarget = this.getFormRef();
      let formData = formTarget.formData;
      if (formData && formData.object_foreign_id) {
        let reportTemplate = formTarget.reportTemplate;
        let formCode = reportTemplate.formCode;
        let option = {
          objId: formData.object_foreign_id, //单据ID
          wfCode: formCode, //流程编码
          showStartBtn: true, //是否放出启动按钮,流程已启动时此参数失效
          serviceId: "user",
          callback: ({ wfInfo }) => {
            this.wfInfo = wfInfo;
          },
        };
        initWf.call(formTarget.$parent, option);
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.grid-container {
  min-height: 50px;
  //line-height: 48px;
  //padding: 6px;
  outline: 1px dashed #336699;

  > div {
    height: 100%;
  }

  .form-widget-list {
    // min-height: 28px;
    height: 100%;
  }
}

.grid-container.selected,
.grid-cell.selected {
  outline: 2px solid $--color-primary !important;
}
</style>
