<template>
  <a-modal :open="open" @update:open="$emit('update:open', $event)">
    <template #title>
      <a-page-header
        style="padding: 0 20px 0 0"
        :title="Language.getNameTrl($i18n.locale, curdWindow)"
        :sub-title="subTitle()"
      >
        <template #extra>
          <a-button key="1" title="上一页" @click="pre">
            <template #icon>
              <CaretLeftOutlined />
            </template>
          </a-button>

          <a-button key="2"> {{ currIndex }}/{{ totalCount }} </a-button>

          <a-button key="3" title="下一页" @click="next">
            <template #icon>
              <CaretRightOutlined />
            </template>
          </a-button>

          <a-button key="4" title="历史记录" @click="auditData">
            <template #icon>
              <SmallDashOutlined />
            </template>
          </a-button>

          <a-tooltip
            v-if="
              !(curdWindow.htmlHelpUrl != null && curdWindow.htmlHelpUrl != '')
            "
            title="帮助"
          >
            <QuestionCircleOutlined
              style="font-size: 2rem"
              @click="openHtmlHelp(curdWindow.htmlHelpUrl)"
            />
          </a-tooltip>
        </template>
      </a-page-header>
    </template>

    <template #footer />

    <a-space :wrap="true" size="middle" style="flex-wrap: wrap; row-gap: 12px;gap: 8px">
      <a-button
        v-if="showCreateButton && windowDisplayType == 'Grid'"
        class="m-btn-space"
        @click="createRecord"
      >
        {{ $t("lang.tabFormView.create") }}
      </a-button>
      <a-button
        v-if="showEditButton && windowDisplayType == 'Grid'"
        class="m-btn-space"
        @click="editRecord"
      >
        {{ $t("lang.tabFormView.edit") }}
      </a-button>
      <a-button class="m-btn-space" @click="refresh">
        {{ $t("lang.tabFormView.refresh") }}
      </a-button>
      <a-button
        v-if="isView == true && windowDisplayType == 'Grid'"
        class="m-btn-space"
        @click="changeWindowDisplayType"
      >
        {{ $t("lang.tabFormView.reportView") }}
      </a-button>
      <a-button
        v-if="isView == true && windowDisplayType == 'Report'"
        class="m-btn-space"
        @click="changeWindowDisplayType"
      >
        {{ $t("lang.tabFormView.formView") }}
      </a-button>

      <a-button
        v-if="showDeleteButton && windowDisplayType == 'Grid'"
        class="m-btn-space"
        @click="deleteRecord(true)"
      >
        {{ $t("lang.tabFormView.remove") }}
      </a-button>

      <a-button
        v-if="showRedrawButton"
        class="m-btn-space"
        @click="abandonWorkflow"
      >
        {{ $t("lang.tabFormView.redraw") }}
      </a-button>

      <TabButton
        :show-tab-dto="tab"
        :model-data="modelData"
        :uuid="uuid"
        :view-type="'Form'"
        :tab-buttons="tab.tabFormView ? tab.tabFormView.tabButtons : null"
        :curd-window-function-access="curdWindowFunctionAccess"
        @save-view="backupView"
        @process-execute-finish="refresh"
        @model-data-changed="modelDataChanged"
      />

      <FormFieldDef
        :tab-form-fields="tabFormFields"
        :window-no="windowNo"
        :tab-index="tabIndex"
        @tab-form-field-property-changed="tabFormFieldPropertyChanged($event)"
      />
    </a-space>

    <div>
      <!-- header -->
      <div style="position: relative">
        <div v-show="showSpaceRow" class="row">
          <div class="col-md-12">
            <div class="m-space-btn-group" />
          </div>
        </div>

        <div ref="fixedButtonGroup" />
        <img
          v-if="processInstanceId != undefined"
          style="
            position: absolute;
            right: 0px;
            top: 118px;
            z-index: 2;
            width: 100px;
          "
          :src="getWorkFlowImageUrl()"
        />
      </div>
      <div v-if="windowDisplayType == 'Grid'">
        <!-- eslint-disable-next-line -->
        <div v-html="headerHtml" />

        <div
          v-if="tab != null && tab.tabFormView != null"
          class="m-row clearfix"
        >
          <TabFormFieldView
            :file-groups="tabFormFields"
            :class-name="tab.tabDataSource.className"
            :model-data="modelData"
            :multiple-column="tab.tabFormView.multipleColumn"
            :js-url="jsUrl"
            :is-chinese-english="curdWindow.isChineseEnglish"
            @execute-callout="executeCallout"
            @refresh-datas="refresh"
            @get-model-data="getModelData"
            @abandon-workflow="abandonWorkflow"
          />
        </div>

        <div
          v-if="
            tab != null &&
              tab.tabFormView != null &&
              tab.tabFormView.fieldGroups != null &&
              tab.tabFormView.fieldGroups.length > 0
          "
          class="row clearfix"
        >
          <a-tabs v-model:activeKey="selectedTabIndex" :animated="false">
            <a-tab-pane
              v-for="(fieldGroup, fieldGroupIndex) in tab.tabFormView
                .fieldGroups"
              :key="fieldGroupIndex"
              :tab="Language.getGroupNameTrl($i18n.locale, fieldGroup)"
            >
              <div v-if="fieldGroup.show">
                <TabFormFieldView
                  ref="fieldItem2"
                  :file-groups="fieldGroup.fields"
                  :class-name="tab.tabDataSource.className"
                  :model-data="modelData"
                  :multiple-column="tab.tabFormView.multipleColumn"
                  :js-url="jsUrl"
                  :is-chinese-english="curdWindow.isChineseEnglish"
                  @execute-callout="executeCallout"
                  @refresh-datas="refresh"
                  @get-model-data="getModelData"
                  @abandon-workflow="abandonWorkflow"
                />
              </div>
            </a-tab-pane>
          </a-tabs>

          <!-- <div id="myTabContent" class="tab-content">
            <div
              v-for="fieldGroup in tab.tabFormView.fieldGroups"
              id="home"
              :key="fieldGroup.groupName"
            >
              <a-page-header
                :title="Language.getGroupNameTrl($i18n.locale, fieldGroup)"
                style="
                  border-bottom: 1px solid rgb(235, 237, 240);
                  padding: 0px;
                "
              />

              <div v-if="fieldGroup.show">
                <TabFormFieldView
                  :file-groups="fieldGroup.fields"
                  :class-name="tab.tabDataSource.className"
                  :model-data="modelData"
                  :multiple-column="tab.tabFormView.multipleColumn"
                  :js-url="jsUrl"
                  :is-chinese-english="curdWindow.isChineseEnglish"
                  @execute-callout="executeCallout"
                  @refresh-datas="refresh"
                  @get-model-data="getModelData"
                  @abandon-workflow="abandonWorkflow"
                />
              </div>
            </div>
          </div> -->
        </div>

        <!-- eslint-disable-next-line -->
        <div v-html="footerHtml" />

        <template
          v-if="
            modelData && tab.subOneToOneTabs && tab.subOneToOneTabs.length > 0
          "
        >
          <div
            v-for="oneToOneTab in tab.subOneToOneTabs"
            :key="
              'SubOneToOneTabView-' +
                windowNo +
                '-' +
                tabIndex +
                '-' +
                oneToOneTab.tabIndex +
                '-' +
                modelData.id
            "
          >
            <SubOneToOneTabView
              :tab="oneToOneTab"
              :parent-model-data="modelData"
              :window-no="windowNo"
              :js-url="jsUrl"
              :curd-window="curdWindow"
              :is-chinese-english="curdWindow.isChineseEnglish"
            />
          </div>
        </template>

        <template v-if="modelData != null">
          <div
            v-for="subTab in tab.subTabs"
            :id="
              'SubTabGridEdit-' +
                windowNo +
                '-' +
                tabIndex +
                '-' +
                modelData.id +
                '-subTab-' +
                subTab.tabIndex
            "
            :key="
              'SubTabGridEdit-' +
                windowNo +
                '-' +
                tabIndex +
                '-' +
                modelData.id +
                '-subTab-' +
                subTab.tabIndex
            "
            class="m-row clearfix"
          >
            <div class="col-md-12">
              <SubTabGridEdit
                :ref="'subTab' + subTab.tabIndex"
                :window-no="windowNo"
                :tab-index="subTab.tabIndex"
                :fixed-button-group-height="fixedButtonGroupHeight"
                :is-show-edit="false"
                :tab="subTab"
                :parent-model-data="modelData"
                :parent-tab="tab"
                :js-url="jsUrl"
                :is-chinese-english="curdWindow.isChineseEnglish"
                @save-view="backupView"
                @process-execute-finish="refresh"
              />
            </div>
          </div>
        </template>

        <!-- <div v-if="attributeKey != null && attributeKey === true" class="row clearfix">
          <div class="col-md-12">
            <AttributeViewPanel
              ref="attributePanel" :attribute-key="attributeKey"
              :attribute-value-key="attributeValueKey" :window-no="windowNo"
            />
          </div>
        </div> -->
      </div>
      <div v-else style="height: 400px; overflow: scroll; margin-top: 8px">
        <ProcessReportResultPreview
          v-if="
            processReportResult != null &&
              (processReportResult.reportResults != null ||
                processReportResult.processResult != null)
          "
          :process-report-result="processReportResult"
          :pdf-only="false"
          :excel-only="false"
        />
      </div>

      <div v-if="showApply" class="row clearfix">
        <div
          v-if="curdWindow.workflow.workflowType === 'UserDefine'"
          class="col-md-12"
        >
          <WorkflowUserDefine
            ref="workflowUserDefine"
            :work-flow="curdWindow.workflow"
            :process-definition-id="processDefinitionId"
            :model-data="modelData"
            @apply="apply"
          />
        </div>
        <div
          v-else-if="curdWindow.workflow.workflowType === 'OTHER'"
          class="col-md-12"
        >
          <WorkflowStart
            :work-flow="curdWindow.workflow"
            :process-definition-id="processDefinitionId"
            @apply="apply"
          />
        </div>
        <div v-else class="col-md-12">
          <WorkflowSelectUser
            ref="workflow"
            :work-flow="curdWindow.workflow"
            :window-no="windowNo"
            :process-definition-id="processDefinitionId"
            :model-data="modelData"
            :record-id="recordId"
            @apply="apply"
          />
        </div>
      </div>

      <div v-if="showApproveComment" class="row clearfix">
        <div class="col-md-12">
          <ApproveComment
            ref="approveComment"
            :parent-widget="'TabFormView'"
            :workflow-type="workflowType"
            :work-flow="curdWindow.workflow"
            :window-no="windowNo"
            :process-definition-id="processDefinitionId"
            :show-choice-button="showChoiceButton"
            :process-instance-id="processInstanceId"
            :task-info-id="taskInfoId"
            :record-id="modelData.id"
            :show-tab-dto="tab"
            :model-data="modelData"
            :uuid="uuid"
            :workflow-class-name="tab.tabDataSource.className"
            @save-view="backupView"
          />
        </div>
      </div>

      <!-- 历史审批记录 -->
      <div v-if="showHistoryApproveComment" class="row clearfix">
        <div class="col-md-12">
          <HistoryApproveComment
            :record-id="modelData.id"
            :process-instance-id="processInstanceId"
          />
        </div>
      </div>

      <div
        v-if="
          curdWindow != null &&
            tab != null &&
            tab.tabDataSource != null &&
            !curdWindow.hideCreateRecordButton &&
            showAttachmentPanel == true
        "
        class="padding-lr"
      >
        <AttachmentPanel
          v-if="type == 'view'"
          :is-show-edit="true"
          :class-name="tab.tabDataSource.className"
          :record-id="recordId"
          :tab-index="tabIndex"
          :window-no="windowNo"
          :curd-window-function-access="curdWindowFunctionAccess"
        />
      </div>

      <a-modal
        v-model:open="modal2"
        width="100%"
        @ok="
          showAuditPanel = false;
          modal2 = false;
        "
        @cancel="showAuditPanel = false"
      >
        <template #title>
          {{ $t("lang.tabFormView.recordInformation") }}{{ currIndex }}/{{
            totalCount
          }}
          - {{ tab.name }}
        </template>
        <TabAudit
          v-if="showAuditPanel"
          :window-no="windowNo"
          :tab-index="tabIndex"
          :tab="tab"
          :model-data="modelData"
        />
      </a-modal>

      <a-modal v-model:open="modal3" width="100%" title="创建评论">
        <CurdWindowCommentCreate
          v-if="modal3"
          ref="curdCommentCreate"
          :record-id="modelData.id"
          :window-no="modelData.windowNo"
        />
        <template #footer>
          <a-button type="primary" @click="saveAndSendNotification">
            确认
          </a-button>
          <a-button @click="modal3 = false"> 取消 </a-button>
        </template>
      </a-modal>

      <div class="padding-lr">
        <a-space class="attachment-header">
          <a-page-header title="评论信息" :back-icon="false" style="padding: 0">
            <template #extra>
              <a-button
                type="link"
                style="padding: 0"
                @click="openCurdWindowComment()"
              >
                发表评论
              </a-button>
            </template>
          </a-page-header>
        </a-space>
        <CurdWindowComment ref="curdComment" :record-id="modelData.id" />
      </div>

      <Loading v-if="loading" />
    </div>
  </a-modal>
</template>

<script>
import Common from '../../common/Common.js';

import WindowServerUtil from '../../resource/dictionary/WindowServerUtil.js';
import WindowClientUtil from '../../resource/dictionary/WindowClientUtil.js';
import TabFormView from './TabFormView.js';
import FieldUtil from '../../resource/dictionary/FieldUtil.js';
import ProcessReportResource from '../../api/dic/ProcessReportResource.js';
import UserStorageResource from '../../api/base/UserStorageResource.js';
import UserReadDocumentResource from '../../api/base/UserReadDocumentResource.js';
import Language from '../../common/Language.js';
import Context from '../common/Context.js';
import CurdWindowResource from '../../api/dic/CurdWindowResource.js';

import SubTabGridEdit from '../tabGridView/SubTabGridEdit.vue';
import TabFormFieldView from './TabFormFieldView.vue';
import TabButton from '../tabView/TabButton.vue';
import FormFieldDef from '../tab-form-common/FormFieldDef.vue';
import AttachmentPanel from '../attachment/AttachmentPanel.vue';

import AttributeViewPanel from '../attribute/AttributeViewPanel.vue';
import WorkflowSelectUser from '../../workflow/WorkflowSelectUser.vue';
import WorkflowStart from '../../workflow/WorkflowStart.vue';
import WorkflowUserDefine from '../../workflow/WorkflowUserDefine.vue';
import TabAudit from '../tabView/TabAudit.vue';
import ApproveComment from '../../workflow/ApproveComment.vue';

import CurdWindowResourceV2 from '../../api/dic/CurdWindowResourceV2.js';
import CurdWindowEditResource from '../../api/dic/CurdWindowEditResource.js';
import JsUtil from '../../common/JsUtil.js';
import { Notify, Uuid } from 'pc-component-v3';

import CurdWindowComment from './CurdWindowComment.vue';
import CurdWindowCommentCreate from './CurdWindowCommentCreate.vue';
import NotificationPanel from '../../customer/NotificationPanel.vue';
import HistoryApproveComment from '../../workflow/HistoryApproveComment.vue';

import {
  CaretRightOutlined,
  CaretLeftOutlined,
  SmallDashOutlined,
  ExclamationCircleOutlined,
  QuestionCircleOutlined,
} from '@ant-design/icons-vue';
import { createVNode } from 'vue';
import { Modal } from 'ant-design-vue';
import SubOneToOneTabView from './SubOneToOneTabView.vue';

export default {
  components: {
    SubTabGridEdit,
    TabFormFieldView,
    TabButton,
    FormFieldDef,
    AttachmentPanel,
    AttributeViewPanel,
    WorkflowSelectUser,
    WorkflowStart,
    ApproveComment,
    TabAudit,
    WorkflowUserDefine,
    CurdWindowComment,
    CurdWindowCommentCreate,
    NotificationPanel,
    HistoryApproveComment,
    CaretRightOutlined,
    CaretLeftOutlined,
    SmallDashOutlined,
    ExclamationCircleOutlined,
    Modal,
    QuestionCircleOutlined,
    SubOneToOneTabView,
  },

  props: {
    open: {
      type: Boolean,
      default: false,
    },
    // CURD窗口Id
    windowNo: {
      type: String,
      default: '',
    },
    // 页签编号
    tabIndex: {
      type: Number,
      default: 0,
    },
    // 数据记录Id
    modelDataId: {
      type: Number,
      default: null,
    },
    // 窗口类型(view:视图数据,viewRestore:恢复数据)
    type: {
      type: String,
      default: '',
    },
    // 当前记录所在的页码
    currentPage: {
      type: Number,
      default: 0,
    },
    // 当前记录的排序
    currentIndex: {
      type: Number,
      default: 0,
    },
    // 记录的总数量
    totalRecords: {
      type: Number,
      default: 0,
    },
    // // 窗口唯一Id(必须是唯一的)
    // uuid: {
    //   type: String,
    //   default: '',
    // },
    // 工作流任务Id(taskId)
    taskInfoId: {
      type: String,
      default: null,
    },
    // 工作流任务类型(approve:审批任务,copyTask:抄送任务)
    workflowType: {
      type: String,
      default: null,
    },
    sortStr: {
      type: String,
      default: null,
    },
    simpleFilterParams: {
      type: String,
      default: null,
    },
    complexFilterParams: {
      type: Object,
      default: null,
    },
  },

  emits: ['update:open', 'OpenTabEditView'],

  data: function () {
    this.Language = Language;
    return {
      curdWindow: {}, // 窗口数据
      tab: {}, // 父页签
      tabFormFields: [],
      multipeColumnFields: [],
      modelData: {},
      errorCount: 0, // 校验错误数量
      errorMsg: '', // 校验错误信息
      error: 0,
      headerHtml: '', // Tab头HTML
      footerHtml: '', // Tab尾HTML
      headerApiUrl: '', // Tab头API URL
      footerApiUrl: '', // Tab尾API URL
      currPage: 1,
      attributeKey: undefined,
      attributeValueKey: undefined,
      processInstanceId: undefined,
      currIndex: 0,
      totalCount: 0,
      buttonGroupInitLeft: 0,
      buttonGroupInitTop: 0,
      showSpaceRow: false,

      // 工作流定义Id
      processDefinitionId: '',
      showAuditPanel: false,
      fixedButtonGroupHeight: 0,
      selectedTabIndex: 0, // 选择的页签序号
      windowDisplayType: 'Grid', //显示类型
      processReportResult: undefined,
      isView: true, //是否显示模式切换按钮
      curdWindowFunctionAccess: null, //权限
      jsUrl: null,
      loading: false,
      modal2: false,
      modal3: false,
      notificationModal: false,
    };
  },

  computed: {
    /**
     * 是否显示审批按钮
     */
    showApply: function () {
      // 判断是否显示审批按钮
      if (this.curdWindow == undefined) {
        return false;
      }

      if (this.curdWindow.workflow == undefined) {
        return false;
      }

      // 已经审批的单据，不显示审批按钮。
      if (
        this.modelData != undefined &&
        this.modelData.data != undefined &&
        this.modelData.data.processInstanceId != undefined &&
        this.modelData.data.processInstanceId.displayValue != undefined &&
        this.modelData.data.processInstanceId.displayValue[0] != undefined &&
        this.modelData.data.processInstanceId.displayValue[0].length > 0
      ) {
        return false;
      }

      if (this.modelData == undefined || this.modelData.data == undefined) {
        return false;
      }

      return true;
    },

    /**
     * 是否显示审批面板
     * 处于审批中的单据，显示审批面板
     */
    showApproveComment: function () {
      // 判断是否显示审批按钮
      if (
        this.curdWindow != undefined &&
        this.curdWindow.hasWorkflow != undefined &&
        this.modelData != undefined &&
        this.modelData.data != undefined &&
        this.modelData.data.processInstanceId != undefined &&
        this.modelData.data.processInstanceId.displayValue != undefined &&
        this.modelData.data.processInstanceId.displayValue[0] != undefined &&
        this.modelData.data.processInstanceId.displayValue[0].length > 0
      ) {
        return true;
      }
      return false;
    },

    /**
     * 是否显示历史审批记录面板
     * 处于审批中的单据，显示审批面板
     */
    showHistoryApproveComment: function () {
      if (
        this.curdWindow != null &&
        this.curdWindow.workflow != null &&
        this.modelData != null
      ) {
        return true;
      }
      return false;
    },

    /**
     * 是否显示审批评论面板
     * 审批完成的单据，显示审批评论面板
     */
    showChoiceButton: function () {
      if (
        this.curdWindow != undefined &&
        this.curdWindow.workflow != undefined &&
        this.modelData != undefined &&
        this.modelData.data != undefined &&
        this.modelData.data.processInstanceId != undefined &&
        this.modelData.data.processInstanceId.displayValue != undefined &&
        this.modelData.data.processInstanceId.displayValue[0] != undefined &&
        this.modelData.data.processInstanceId.displayValue[0].length > 0 &&
        this.modelData.data.documentStatus != undefined &&
        this.modelData.data.documentStatus.displayValue != undefined &&
        this.modelData.data.documentStatus.displayValue[0] != undefined &&
        this.modelData.data.documentStatus.displayValue[0].length > 0 &&
        this.modelData.data.documentStatus.displayValue[0] == 'PROCESSING' &&
        this.taskInfoId != undefined &&
        this.workflowType != 'copyTask'
      ) {
        return true;
      }
      return false;
    },

    /**
     * 是否显示编辑
     * 审批完成的单据，显示审批评论面板
     */
    showEditButton: function () {
      if (this.curdWindow == undefined || this.curdWindow.tabs == undefined) {
        return false;
      } else if (this.curdWindow.readOnly) {
        return false;
      }

      if (
        this.curdWindowFunctionAccess == undefined ||
        this.curdWindowFunctionAccess.allowUpdate == undefined ||
        this.curdWindowFunctionAccess.allowUpdate == false
      ) {
        return false;
      }

      if (
        this.curdWindow != undefined &&
        this.curdWindow.workflow != undefined &&
        this.modelData != undefined &&
        this.modelData.data != undefined &&
        this.modelData.data.documentStatus != undefined &&
        this.modelData.data.documentStatus.displayValue != undefined &&
        this.modelData.data.documentStatus.displayValue[0] != undefined &&
        this.modelData.data.documentStatus.displayValue[0].length > 0 &&
        (this.modelData.data.documentStatus.displayValue[0] == 'APPROVED' ||
          this.modelData.data.documentStatus.displayValue[0] == 'REJECTED' ||
          this.modelData.data.documentStatus.displayValue[0] == 'PROCESSING')
      ) {
        return false;
      }
      return true;
    },

    /**
     * 是否显示附件上传按钮
     */
    showAttachmentPanel: function () {
      if (
        this.curdWindowFunctionAccess == undefined ||
        this.curdWindowFunctionAccess.allowUploadAttachment == undefined ||
        this.curdWindowFunctionAccess.allowUploadAttachment == false
      ) {
        return false;
      }
      return true;
    },

    /**
     * 是否显示新建按钮
     */
    showCreateButton: function () {
      if (this.curdWindow == undefined || this.curdWindow.tabs == undefined) {
        return false;
      } else if (this.curdWindow.readOnly) {
        return false;
      }

      if (
        this.curdWindowFunctionAccess == undefined ||
        this.curdWindowFunctionAccess.allowCreate == undefined ||
        this.curdWindowFunctionAccess.allowCreate == false
      ) {
        return false;
      }

      var _self = this;

      if (_self.tab.isReadOnly == true) {
        return false;
      }

      // 处于审批界面
      if (_self.$route.query.workflowType === 'approve') {
        return false;
      }

      return true;
    },

    /**
     * 是否显示删除按钮
     */
    showDeleteButton: function () {
      if (this.curdWindow == undefined || this.curdWindow.tabs == undefined) {
        return false;
      } else if (this.curdWindow.readOnly) {
        return false;
      }

      if (
        this.curdWindowFunctionAccess == undefined ||
        this.curdWindowFunctionAccess.allowDelete == undefined ||
        this.curdWindowFunctionAccess.allowDelete == false
      ) {
        return false;
      }

      var _self = this;

      if (_self.tab.isReadOnly == true) {
        return false;
      }

      // 处于审批界面
      if (_self.$route.query.workflowType === 'approve') {
        return false;
      }

      return true;
    },

    /**
     * 是否显示弃审按钮
     */
    showRedrawButton: function () {
      if (this.curdWindow == undefined || this.curdWindow.tabs == undefined) {
        return false;
      } else if (this.curdWindow.readOnly) {
        return false;
      }

      var _self = this;

      if (_self.tab.isReadOnly == true) {
        return false;
      }

      // 处于审批界面
      if (_self.$route.query.workflowType === 'approve') {
        return false;
      }
      // 处于抄送界面
      if (_self.$route.query.workflowType === 'copyTask') {
        return false;
      }

      if (
        _self.modelData != undefined &&
        _self.modelData.data != undefined &&
        _self.modelData.data.documentStatus != undefined
      ) {
        let documentStatus =
          _self.modelData.data.documentStatus.displayValue[0];
        if (documentStatus == 'REJECTED' || documentStatus == 'APPROVED') {
          return false;
        }
      }

      if (
        _self.curdWindow.workflow != undefined &&
        _self.processInstanceId != undefined &&
        _self.processInstanceId != ''
      ) {
        return true;
      }

      return false;
    },
  },

  watch: {
    open: function (currentValue, oldValue) {
      if (currentValue === true) {
        this.initView();
      }
    },

    modelData: {
      deep: true,
      handler(curVal, oldVal) {
        this.tabButtonsShowLogical();
        this.reportViewsShowLogical();
      },
    },

    /**
     * 显示界面发生改变的时候，重新执行显示逻辑
     */
    windowDisplayType: function (newValue, oldValue) {
      this.reportViewsShowLogical();
    },
  },

  mounted: function () {
    console.log('WindowView mounted.');
    var _self = this;
    _self.uuid = _self.$route.query.uuid;
    // 按钮栏实现滚动
    // _self.$nextTick(function () {
    // var fixedButtonGroup = $(_self.$refs.fixedButtonGroup);
    // _self.computerButtonGroupLeftTop();
    // $(curdWindow).scroll(function (){
    //     if ($(curdWindow).scrollTop() > _self.buttonGroupInitTop) {
    //         _self.showSpaceRow = true;
    //         _self.$nextTick(function (){
    //         	fixedButtonGroup.addClass('btn-group-fixed');
    //         	fixedButtonGroup.css('left', _self.buttonGroupInitLeft + 'px');
    //         });
    //     } else {
    //         _self.showSpaceRow = false;
    //         _self.$nextTick(function (){
    //         	fixedButtonGroup.removeClass('btn-group-fixed');
    //         	fixedButtonGroup.css('left', '');
    //         });
    //     }

    //     if ($(curdWindow).scrollTop() <= 10){
    // 		_self.computerButtonGroupLeftTop();
    //     }
    // });

    // var fixedButtonGroup = $(_self.$refs.fixedButtonGroup);
    // var buttonInitTop = fixedButtonGroup.offset().top;

    // _self.fixedButtonGroupHeight = fixedButtonGroup.outerHeight();

    // // 按钮组实现悬浮
    // $(curdWindow).scroll(function () {
    //   var windowTop = $(curdWindow).scrollTop();
    //   if (windowTop > buttonInitTop + fixedButtonGroup.outerHeight()) {
    //     fixedButtonGroup.offset({
    //       top: windowTop,
    //       left: fixedButtonGroup.offset().left,
    //     });
    //   } else {
    //     fixedButtonGroup.offset({
    //       top: buttonInitTop,
    //     });
    //   }
    // });
    // });

    // $(curdWindow).resize(function () {
    //   _self.$nextTick(function () {
    //     _self.computerButtonGroupLeftTop();
    //   });
    // });

    // 获取待审阅的数据
    let userReadDocumentId = this.$route.query.userReadDocumentId;
    if (userReadDocumentId != null && userReadDocumentId != '') {
      UserReadDocumentResource.setProcessed(userReadDocumentId).then(
        successData => {
          if (successData.errorCode === 1) {
            Notify.error(
              _self.$t('lang.tabFormView.dataException'),
              _self.$t('lang.tabFormView.reviewDataHasBeenDeleted'),
              false,
            );
          } else if (successData.errorCode === 2) {
            console.log('单据已经审阅');
            _self.initView();
          } else if (successData.errorCode === 3) {
            Notify.error(
              _self.$t('lang.tabFormView.dataException'),
              _self.$t('lang.tabFormView.describe1'),
              false,
            );
          } else if (successData.errorCode === 0) {
            console.log('设置单据已经审阅成功。');
            _self.initView();
          }
        },
        errorData => {
          Common.processException(errorData);
        },
      );
    } else {
      console.debug('call init view method.');
      _self.initView();
    }
  },
  methods: {
    /**
     * 打开评论界面进行评论
     * @author GuoZhiBo 20171201
     */
    openCurdWindowComment: function () {
      var _self = this;
      _self.modal3 = true;
    },

    saveAndSendNotification: function () {
      var _self = this;
      _self.$refs.curdCommentCreate.photograph();
      _self.sendNotification();
    },

    // 发送通知
    sendNotification: function () {
      var _self = this;
      var notification = _self.$refs.curdCommentCreate.getNotification();
      var recordIds = [];
      recordIds.push(_self.modelData.id);
      if (recordIds.length == 0) {
        Notify.error(
          _self.$t('lang.Notify.error'),
          _self.$t('lang.tabButton.describe7'),
          true,
        );
        return;
      }
      // if (notification.userIds == null || notification.userIds.length == 0) {
      //   Notify.error(_self.$t('lang.Notify.error'), _self.$t('lang.tabButton.describe8'), true);
      //   _self.modal3 = false;
      //   return;
      // }
      if (notification.theme == null || notification.theme.trim() == '') {
        Notify.error(
          _self.$t('lang.Notify.error'),
          _self.$t('lang.tabButton.describe9'),
          true,
        );
        return;
      }
      if (
        notification.contentText == null ||
        notification.contentText.trim() == ''
      ) {
        Notify.error(
          _self.$t('lang.Notify.error'),
          _self.$t('lang.tabButton.describe10'),
          true,
        );
        return;
      }
      notification.windowNo = _self.modelData.windowNo;
      notification.tabIndex = _self.tabIndex;
      notification.recordIds = recordIds;
      notification.className = _self.tab.tabDataSource.className;
      notification.category = 'CurdWindow';
      notification.documentName = 'view';
      if (
        _self.modelData.data.processInstanceId != undefined ||
        _self.modelData.data.processInstanceId != null
      ) {
        notification.processInstanceId =
          _self.modelData.data.processInstanceId.displayValue[0];
      }
      if (
        _self.modelData.data.documentNo != undefined ||
        _self.modelData.data.documentNo != null
      ) {
        notification.documentNo =
          _self.modelData.data.documentNo.displayValue[0];
      }
      if (
        _self.modelData.data.documentCreateUser != undefined ||
        _self.modelData.data.documentCreateUser != null
      ) {
        notification.documentUserNickName =
          _self.modelData.data.documentCreateUser.displayValue[0];
      }

      _self.loading = true;
      $.ajax({
        url: Common.getApiURL('notificationResource/send'),
        type: 'post',
        beforeSend: function (request) {
          Common.addTokenToRequest(request);
        },
        contentType: 'application/json',
        data: JSON.stringify(notification),
        success: function (data) {
          _self.loading = false;
          Notify.success(
            _self.$t('lang.tabButton.describe11'),
            '操作成功',
            true,
          );
          _self.modal3 = false;
          _self.$refs.curdComment.getCurdComment();
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
          _self.loading = false;
          Common.processException(XMLHttpRequest, textStatus, errorThrown);
        },
      });
    },

    /**
     * 获取审批图片
     */
    getWorkFlowImageUrl: function () {
      var _self = this;
      if (
        _self.modelData != undefined &&
        _self.modelData.data != undefined &&
        _self.modelData.data.documentStatus != undefined
      ) {
        var documentStatus =
          _self.modelData.data.documentStatus.displayValue[0];
        if (documentStatus == undefined || documentStatus == 'EDIT') {
          return '/static/assets/client-base-v4/image-workflow/edit.png';
        } else if (documentStatus == 'APPROVED') {
          return '/static/assets/client-base-v4/image-workflow/approved.png';
        } else if (documentStatus == 'REJECTED') {
          return '/static/assets/client-base-v4/image-workflow/rejected.png';
        } else if (documentStatus == 'PROCESSING') {
          return '/static/assets/client-base-v4/image-workflow/processing.png';
        } else if (documentStatus == 'WITHDRAW') {
          return '/static/assets/client-base-v4/image-workflow/withdraw.png';
        }
      }
    },
    /**
     * 切换显示模式
     * @author GuoZhiBo 20210419
     */
    changeWindowDisplayType: function () {
      var _self = this;
      if (_self.windowDisplayType == 'Grid') {
        _self.windowDisplayType = 'Report';
      } else {
        _self.windowDisplayType = 'Grid';
        _self.$nextTick(function () {
          for (var index = 0; index < _self.tab.subTabs.length; index++) {
            var subTabId = 'subTab' + this.tab.subTabs[index].tabIndex;
            _self.$refs[subTabId][0].queryGridData();
          }
        });
      }
    },
    // 执行流程
    executeProcess: function (processReportNo) {
      var _self = this;
      var ids = [];
      if (_self.modelDatas) {
        _self.modelDatas.forEach(function (modelData) {
          if (modelData.select == true) {
            ids.push(modelData.id);
          }
        });
      } else if (_self.modelData) {
        ids.push(_self.modelData.id);
      }
      ProcessReportResource.runProcessByIds(processReportNo, ids).then(
        successData => {
          var processReportResult = successData;
          if (_self.processReportResult == undefined) {
            if (
              processReportResult.reportResults != undefined &&
              processReportResult.reportResults.length > 0
            ) {
              processReportResult.reportResults.forEach(function (item, index) {
                if (item.reportDefinitionType !== 'ExcelReport') {
                  item.previewIndex = 1;
                } else {
                  item.previewIndex = 2;
                }
                if (index == 0) {
                  item.showPreview = true;
                } else {
                  item.showPreview = false;
                }
              });
            }
            _self.processReportResult = processReportResult;
          } else {
            if (
              processReportResult.reportResults != undefined &&
              processReportResult.reportResults.length > 0
            ) {
              processReportResult.reportResults.forEach(function (item, index) {
                item.previewIndex = 1;
                if (index == 0) {
                  item.showPreview = true;
                } else {
                  item.showPreview = false;
                }
                _self.processReportResult.reportResults.push(item);
              });
            }
          }
        },
        errorData => {
          Common.processException(errorData);
        },
      );
    },
    getContext: Context,
    /**
     * 弃审
     */
    abandonWorkflow: function () {
      var _self = this;
      _self.loading = true;
      var obj = {
        className: _self.tab.tabDataSource.className,
        tabIndex: _self.tabIndex,
        windowNo: _self.curdWindow.no,
        recordId: _self.modelData.id,
      };
      $.ajax({
        url: Common.getApiURL('WorkflowResource/abandonWorkflow'),
        type: 'post',
        contentType: 'application/json',
        beforeSend: function (request) {
          Common.addTokenToRequest(request);
        },
        data: JSON.stringify(obj),
        success: function (data) {
          _self.loading = false;
          _self.refresh();
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
          _self.loading = false;
          Common.processException(XMLHttpRequest, textStatus, errorThrown);
        },
      });
    },
    /**
     * 打开帮助页面
     */
    openHtmlHelp: function (htmlHelpUrl) {
      window.open(htmlHelpUrl);
    },
    auditData: function () {
      var _self = this;
      _self.showAuditPanel = true;
      _self.modal2 = true;
    },

    // 初始化界面
    initView: function () {
      this.recordId = this.modelDataId;
      this.currPage = this.currentPage;
      this.currIndex = this.currentIndex;
      this.totalCount = this.totalRecords;

      if (this.type == 'view') {
        this.initReadView();
      } else if (this.type == 'viewRestore') {
        // 恢复视图
        this.restoreView();
      }
      if (this.workflowType == 'copyTask') {
        $.ajax({
          url: Common.getApiURL('WorkflowResource/processTaskInfo'),
          type: 'get',
          dataType: 'json',
          contentType: 'application/json',
          beforeSend: function (request) {
            Common.addTokenToRequest(request);
          },
          data: {
            taskInfoId: this.taskInfoId,
          },
          success: function (data) {},
          error: function (XMLHttpRequest, textStatus, errorThrown) {
            Common.processException(XMLHttpRequest, textStatus, errorThrown);
          },
        });
      }
    },

    // 初始化编辑界面
    initReadView: function () {
      var _self = this;
      _self.loading = true;

      if (_self.taskInfoId) {
        CurdWindowResource.uniqueByNoWithWorkflow(
          null,
          _self.taskInfoId,
          _self.windowNo,
        ).then(
          successData => {
            _self.loading = false;
            if (successData.errorCode == 0) {
              initWindowAfterLoaded(successData.data);
              _self.uniqueByNoAccessControl();
            } else {
              Notify.error(
                _self.$t('lang.Notify.error'),
                successData.errorMessage,
                true,
              );
            }
          },
          errorData => {
            _self.loading = false;
            Common.processException(errorData);
          },
        );
      } else {
        WindowServerUtil.getWindowById(
          _self.windowNo,
          function (curdWindow) {
            _self.loading = false;
            if (curdWindow.errorCode != 0) {
              Notify.error('Error', curdWindow.errorMessage, false);
              return;
            }
            initWindowAfterLoaded(curdWindow.data);
            _self.uniqueByNoAccessControl();
          },
          function () {
            _self.loading = false;
          },
        );
      }

      function initWindowAfterLoaded(curdWindow) {
        WindowClientUtil.parseFilterSchema(curdWindow);
        var tab = WindowClientUtil.getTab(curdWindow, _self.tabIndex);
        WindowClientUtil.parseSubTab(curdWindow, tab);
        WindowClientUtil.parseOneToOneTab(curdWindow, tab);
        WindowClientUtil.parseFieldGroup(tab);
        WindowClientUtil.restoreWindowTabFieldGroupsVisible(curdWindow);
        _self.tabFormFields = WindowClientUtil.getDetailField(tab);
        _self.curdWindow = curdWindow;
        _self.jsUrl = curdWindow.jsUrl;
        _self.tab = tab;
        TabFormView.restoreTabFormFieldDef(
          _self.windowNo,
          _self.tabIndex,
          _self.tabFormFields,
        );
        _self.loadData();

        if (_self.curdWindow.workflow != undefined) {
          _self.processDefinitionId = _self.curdWindow.workflow.deploymentId;
        }
        _self.initHeaderAndFooterApiUrl();
        _self.loadHeaderAndFooterContent(_self.recordId);
        _self.loading = false;
        if (
          _self.curdWindow.reportViewDto != null &&
          _self.curdWindow.reportViewDto.reportViewItemDtos != null &&
          _self.curdWindow.reportViewDto.reportViewItemDtos.length > 0
        ) {
          var isflag = false;
          _self.curdWindow.reportViewDto.reportViewItemDtos.forEach(function (
            item,
          ) {
            if (item.defaultDisplayReport) {
              isflag = true;
            }
          });
          if (isflag) {
            _self.windowDisplayType = 'Report';
          } else {
            _self.windowDisplayType = 'Grid';
          }
        } else {
          _self.windowDisplayType = 'Grid';
          _self.isView = false;
        }
      }
    },

    // 恢复视图
    restoreView: function () {
      var _self = this;
      _self.uuid = this.$route.query.uuid;

      _self.loading = true;
      WindowServerUtil.getWindowById(
        _self.windowNo,
        function (curdWindow) {
          _self.loading = false;
          if (curdWindow.errorCode != 0) {
            Notify.error('Error', curdWindow.errorMessage, false);
            return;
          }
          WindowClientUtil.parseFilterSchema(curdWindow.data);
          var tab = WindowClientUtil.getTab(curdWindow.data, _self.tabIndex);
          WindowClientUtil.parseSubTab(curdWindow.data, tab);
          WindowClientUtil.parseOneToOneTab(curdWindow.data, tab);
          WindowClientUtil.parseFieldGroup(tab);
          WindowClientUtil.restoreWindowTabFieldGroupsVisible(curdWindow.data);
          _self.tabFormFields = WindowClientUtil.getDetailField(tab);
          _self.curdWindow = curdWindow.data;
          _self.jsUrl = curdWindow.data.jsUrl;
          _self.tab = tab;
          TabFormView.restoreTabFormFieldDef(
            _self.windowNo,
            _self.tabIndex,
            _self.tabFormFields,
          );

          _self.uniqueByNoAccessControl();

          let key = _self.$route.query.uuid + '_modelData';
          UserStorageResource.uniqueByKey(key).then(
            successData => {
              // if(successData.errorCode != 0) {
              //   Notify.error('提示', successData.errorMessage, false);
              //   return;
              // }
              if (successData.data != null && successData.data != '') {
                let cacheModelData = JSON.parse(successData.data);
                _self.$nextTick(function () {
                  if (
                    cacheModelData.saveDatas != undefined &&
                    cacheModelData.saveDatas.length > 0
                  ) {
                    cacheModelData.saveDatas.forEach(function (saveData) {
                      // 恢复子页签的数据
                      var subTabId = 'subTab' + saveData.tabIndex;
                      _self.$refs[subTabId][0].addModelData(saveData);
                    });
                  } else {
                    // BUG描述：父子页签，编辑以后撤销，子页签数据不显示
                    // BUG修复：刷新子页签的数据
                    // bug fixed by jack 20180203

                    for (
                      var index = 0;
                      index < _self.tab.subTabs.length;
                      index++
                    ) {
                      var subTabId =
                        'subTab' + this.tab.subTabs[index].tabIndex;
                      _self.$refs[subTabId][0].queryGridData();
                    }
                  }
                });

                _self.initHeaderAndFooterApiUrl();
                _self.loadHeaderAndFooterContent(_self.recordId);
              }
            },
            errorData => {
              Common.processException(errorData);
            },
          );

          if (_self.curdWindow.workflow != undefined) {
            _self.processDefinitionId = _self.curdWindow.workflow.deploymentId;
          }
          _self.loading = false;
        },
        function () {
          _self.loading = false;
        },
      );
    },

    // 备份视图
    backupView: function () {
      var _self = this;
      var subTabChangedData = _self.getSubTabChangedData();
      if (subTabChangedData.length > 0) {
        _self.modelData.saveDatas = subTabChangedData;
      } else {
        _self.modelData.saveDatas = null;
      }

      let key = _self.$route.query.uuid + '_modelData';
      let userStorageDtos = [
        {
          key: key,
          value: JSON.stringify(_self.modelData),
        },
      ];

      // 组装查询条件，然后放到后台数据库当中
      UserStorageResource.uploadUserStorage(userStorageDtos).then(
        successData => {},
        errorData => {
          Common.processException(errorData);
        },
      );
    },

    uniqueByNoAccessControl: function () {
      // 权限
      CurdWindowResourceV2.uniqueByNoAccessControl(this.windowNo).then(
        successData => {
          if (successData.errorCode === 0) {
            this.curdWindowFunctionAccess = successData.data;
            if (
              this.curdWindowFunctionAccess.readOnly != null &&
              this.curdWindowFunctionAccess.readOnly === true
            ) {
              this.curdWindow.readOnly = true;
            }
          }
        },
        errorData => {
          Common.processException(errorData);
        },
      );
    },

    /**
     * 数据发生改变
     * eg:生单界面回传了新的modelData数据
     */
    modelDataChanged: function (newModelData) {
      this.refresh();
    },

    /**
     * 获取界面的数据
     * eg:生单界面获取modelData数据
     */
    getModelData: function (isViewEdit, type) {
      var _self = this;
      var subTabChangedData = _self.getSubTabChangedData();
      if (subTabChangedData.length > 0) {
        _self.modelData.saveDatas = subTabChangedData;
      } else {
        _self.modelData.saveDatas = null;
      }
      if (type == 'view') _self.modelData.type = 'view';
      if (isViewEdit) {
        window.viewEditDatas = _self.modelData;
      } else {
        return _self.modelData;
      }
    },

    /**
     * 初始化表头和表尾API方法
     * @return {[type]} [description]
     */
    initHeaderAndFooterApiUrl: function () {
      if (this.tab != undefined && this.tab.tabFormView != undefined) {
        this.headerApiUrl = this.tab.tabFormView.headerApiUrl;
        this.footerApiUrl = this.tab.tabFormView.footerApiUrl;
      }
    },

    /**
     * 加载表头和表位的方法
     * @return {[type]} [description]
     */
    loadHeaderAndFooterContent: function (recordId) {
      var _self = this;
      if (this.headerApiUrl != undefined && this.headerApiUrl.length > 0) {
        $.ajax({
          url: Common.getApiURL(_self.headerApiUrl),
          type: 'post',
          contentType: 'application/json',
          beforeSend: function (request) {
            Common.addTokenToRequest(request);
          },
          data: JSON.stringify({
            recordId: recordId,
          }),
          dataType: 'text',
          success: function (data) {
            _self.headerHtml = data;
          },
          error: function (XMLHttpRequest, textStatus, errorThrown) {
            Common.processException(XMLHttpRequest, textStatus, errorThrown);
          },
        });
      } else {
        _self.headerHtml = '';
      }
      if (this.footerApiUrl != undefined && this.footerApiUrl.length > 0) {
        $.ajax({
          url: Common.getApiURL(_self.footerApiUrl),
          type: 'post',
          contentType: 'application/json',
          beforeSend: function (request) {
            Common.addTokenToRequest(request);
          },
          data: JSON.stringify({
            recordId: recordId,
          }),
          dataType: 'text',
          success: function (data) {
            _self.footerHtml = data;
          },
          error: function (XMLHttpRequest, textStatus, errorThrown) {
            Common.processException(XMLHttpRequest, textStatus, errorThrown);
          },
        });
      } else {
        _self.footerHtml = '';
      }
    },

    /**
     * 刷新数据
     */
    refresh: function () {
      var _self = this;
      _self.loadData();
      // add by jack 2018-03-22
      if (_self.recordId != null) {
        _self.loadHeaderAndFooterContent(_self.recordId);
      }
    },

    loadData: function () {
      var _self = this;

      if (_self.recordId == undefined) {
        return;
      }

      var tabLoadParam = {
        windowNo: _self.windowNo,
        tabIndex: _self.tabIndex,
        recordId: _self.recordId,
      };

      _self.processInstanceId = '';

      _self.loading = true;

      WindowServerUtil.loadTabSingleData(
        tabLoadParam,
        function (modelData) {
          _self.loading = false;
          _self.modelData = modelData;

          // 判断是否显示审批状态
          if (
            _self.modelData != null &&
            _self.modelData.data != null &&
            _self.modelData.data.processInstanceId != null
          ) {
            let displayValue =
              _self.modelData.data.processInstanceId.displayValue;
            if (displayValue != null && displayValue.length > 0) {
              _self.processInstanceId = displayValue[0];
            } else {
              _self.processInstanceId = '';
            }
          } else {
            _self.processInstanceId = '';
          }

          // 判断是否有属性
          if (
            _self.modelData != null &&
            _self.modelData.data != null &&
            _self.modelData.data.attributeKey != null &&
            _self.modelData.data.attributeKey.displayValue != null
          ) {
            let displayValue = _self.modelData.data.attributeKey.displayValue;
            if (displayValue.length > 0) {
              _self.attributeKey = displayValue[0];
            }
          }

          // 判断是否有属性值
          if (
            _self.modelData != null &&
            _self.modelData.data != null &&
            _self.modelData.data.attributeKey != null &&
            _self.modelData.data.attributeValueKey != undefined &&
            _self.modelData.data.attributeValueKey.displayValue != undefined
          ) {
            var displayValue1 =
              _self.modelData.data.attributeValueKey.displayValue;
            if (displayValue1.length > 0) {
              _self.attributeValueKey = displayValue1[0];
            }
          }
        },
        function () {
          _self.loading = false;
        },
      );
    },

    // 改变字段分组的显示和隐藏
    changeFieldGroupStatus: function (fieldGroup) {
      fieldGroup.show = !fieldGroup.show;
      var index = this.tab.tabFormView.fieldGroups.indexOf(fieldGroup);
      if (index != -1) {
        this.tab.tabFormView.fieldGroups[index] = fieldGroup;
        localStorage.setItem(
          'FieldGroupStatus_' +
            this.windowNo +
            '_' +
            this.tabIndex +
            '_' +
            fieldGroup.groupName,
          fieldGroup.show,
        );
      }
    },

    // 获取子页签发生改变的数据
    getSubTabChangedData: function () {
      var subTabChangedRecords = [];
      if (this.tab.subTabs != undefined) {
        for (var index = 0; index < this.tab.subTabs.length; index++) {
          var subTabId = 'subTab' + this.tab.subTabs[index].tabIndex;
          var modelDatas = this.$refs[subTabId][0].getChangedModelData();
          if (modelDatas != undefined && modelDatas.length > 0) {
            modelDatas.forEach(function (modelData) {
              subTabChangedRecords.push(modelData);
            });
          }
        }
      }
      return subTabChangedRecords;
    },
    // 获取子页签数据校验的Promise
    getSubTabValidatePromise: function () {
      var _self = this;

      var validatePromises = [];
      if (this.tab.subTabs != undefined) {
        for (var index = 0; index < this.tab.subTabs.length; index++) {
          var subTabId = 'subTab' + this.tab.subTabs[index].tabIndex;
          var subTabValidates = this.$refs[subTabId][0].performValidate();
          validatePromises = validatePromises.concat(subTabValidates);
        }
      }
      return validatePromises;
    },

    /**
     * 表单字段的属性（显示）属性发生改变事件
     */
    tabFormFieldPropertyChanged: function () {
      TabFormView.restoreTabFormFieldDef(
        this.windowNo,
        this.tabIndex,
        this.tabFormFields,
      );
    },

    // 新建数据
    createRecord: function () {
      let _self = this;
      var currIndex = this.currIndex;
      var totalCount = this.totalCount;
      if (
        this.curdWindowFunctionAccess.allowCreate != null &&
        this.curdWindowFunctionAccess.allowCreate === true
      ) {
        let data = {
          type: 'create',
          windowNo: _self.windowNo,
          tabIndex: _self.tabIndex,
          modelDataId: _self.modelData.id,
          currentPage: _self.currPage,
          currentIndex: currIndex,
          totalRecords: totalCount,
          isRestoreData: true,
          uuid: _self.uuid,
          sortStr: _self.sortStr,
          simpleFilterParams: _self.simpleFilterParams,
          complexFilterParams: _self.complexFilterParams,
        };
        _self.$emit('OpenTabEditView', data);
      } else {
        Notify.error(
          this.$t('lang.tabFormView.clickNewError'),
          this.$t('lang.tabFormView.describe3'),
          false,
        );
      }
    },

    /**
     * 编辑数据
     * @return {void}
     */
    editRecord: function () {
      var _self = this;
      if (
        this.curdWindowFunctionAccess.allowUpdate != null &&
        this.curdWindowFunctionAccess.allowUpdate === true
      ) {
        this.backupView();

        let data = {
          type: 'edit',
          windowNo: _self.windowNo,
          tabIndex: _self.tabIndex,
          modelDataId: _self.modelData.id,
          currentPage: _self.currPage,
          currentIndex: _self.currIndex,
          totalRecords: _self.totalCount,
          isRestoreData: false,
          uuid: _self.uuid,
          sortStr: _self.sortStr,
          simpleFilterParams: _self.simpleFilterParams,
          complexFilterParams: _self.complexFilterParams,
        };
        _self.$emit('OpenTabEditView', data);
      } else {
        Notify.error(
          _self.$t('lang.tabFormView.clickEditError'),
          _self.$t('lang.tabFormView.describe4'),
          false,
        );
      }
    },

    /**
     * 删除当前的数据
     * @return {[type]} [description]
     */
    deleteRecord: function (isAlert) {
      var _self = this;
      if (this.modelData == undefined || this.modelData.id == undefined) {
        return;
      }

      if (
        this.curdWindowFunctionAccess.allowDelete != null &&
        this.curdWindowFunctionAccess.allowDelete === true
      ) {
        if (isAlert) {
          Modal.confirm({
            title: _self.$t('lang.tabFormView.deleteConfirmation'),
            icon: createVNode(ExclamationCircleOutlined),
            content: _self.$t('lang.tabFormView.someWhat'),
            okText: _self.$t('lang.tabFormView.determine'),
            okType: 'danger',
            cancelText: _self.$t('lang.tabFormView.cancel'),
            onOk() {
              _self.deleteRecord(false);
            },
            onCancel() {
              console.log('Cancel');
            },
          });
          return;
        }

        if (this.modelData.id < 0) {
          _self.$emit('update:open', false);
          return;
        }

        var tabDeleteData = {
          windowNo: _self.windowNo,
          tabIndex: _self.tabIndex,
          modelDatas: [_self.modelData],
        };

        WindowServerUtil.deleteTabData(tabDeleteData, function (result) {
          _self.$emit('update:open', false);
        });
      } else {
        Notify.error(
          _self.$t('lang.tabFormView.clickDeleteError'),
          _self.$t('lang.tabFormView.describe5'),
          false,
        );
      }
    },

    /**
     * 子标题
     * @return {String} 子标题
     */
    subTitle: function () {
      var _self = this;
      var subTitle = '';
      if (_self.modelData == null || _self.modelData.data == undefined) {
        return subTitle;
      }
      if (_self.modelData.data.documentNo != undefined) {
        subTitle =
          _self.modelData.data.documentNo.displayValue == undefined
            ? ''
            : _self.modelData.data.documentNo.displayValue[0];
      } else if (_self.modelData.data.no != undefined) {
        subTitle =
          _self.modelData.data.no.displayValue == undefined
            ? ''
            : _self.modelData.data.no.displayValue[0];
      } else if (_self.modelData.data.name != undefined) {
        subTitle =
          _self.modelData.data.name.displayValue == undefined
            ? ''
            : _self.modelData.data.name.displayValue[0];
      }
      return subTitle;
    },

    /**
     * 审批
     * @return {void}
     */
    apply: function () {
      var _self = this;

      if (
        _self.processInstanceId != null &&
        _self.processInstanceId.length > 0
      ) {
        return;
      }

      var userData = null;
      var approveUsers = null;
      var copyUsers = null;
      var userTaskDtos = null;
      let userSelectDtos = null;
      if (this.curdWindow.workflow.workflowType === 'UserDefine') {
        try {
          let param = this.$refs.workflowUserDefine.getData();
          userSelectDtos = param.userSelectDtos;
          copyUsers = param.copyUsers;
        } catch (exception) {
          Notify.error(
            _self.$t('lang.tabFormView.describe6'),
            exception.message,
            false,
          );
          return;
        }
      } else if (this.curdWindow.workflow.workflowType === 'OTHER') {
        userSelectDtos = null;
        copyUsers = null;
      } else {
        userData = _self.$refs.workflow.getUserData();
        approveUsers = userData.applyUsers;
        copyUsers = userData.copyUsers;
        userTaskDtos = userData.userTaskDtos;

        // 检查结点数据是否完整
        for (var i = 0; i < userTaskDtos.length; i++) {
          if (
            userTaskDtos[i].assignees.length == undefined ||
            userTaskDtos[i].assignees.length == 0
          ) {
            Notify.error(
              _self.$t('lang.tabFormView.submitFailed'),
              _self.$t('lang.tabFormView.describe7', {
                userTaskDtoName: userTaskDtos[i].name,
              }),
              false,
            );
            return;
          }
        }
      }

      var deploymentId = _self.curdWindow.workflow.deploymentId;
      var recordId = _self.recordId;
      var windowNo = _self.windowNo;

      var workflowStartParam = {
        deploymentId: deploymentId,
        recordId: recordId,
        windowNo: windowNo,
        approveUsers: approveUsers,
        copyUsers: copyUsers,
        userTaskDtos: userTaskDtos,
        tabIndex: _self.tab.tabIndex,
        className: _self.tab.tabDataSource
          ? _self.tab.tabDataSource.className
          : null,
        userSelectDtos: userSelectDtos,
      };

      _self.loading = true;
      $.ajax({
        url: Common.getApiURL('WorkflowExtResource/startWorkflow'),
        type: 'post',
        dataType: 'json',
        beforeSend: function (request) {
          Common.addTokenToRequest(request);
        },
        contentType: 'application/json',
        data: JSON.stringify(workflowStartParam),
        success: function (data) {
          _self.loading = false;

          if (data.errorCode == 0) {
            Notify.success(
              _self.$t('lang.tabFormView.notice'),
              _self.$t('lang.tabFormView.describe8'),
              true,
            );
            _self.finishTask();
            _self.refresh();
          } else {
            Notify.error('Error', data.errorMessage, 0);
          }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
          _self.loading = false;
          Common.processException(XMLHttpRequest, textStatus, errorThrown);
        },
      });
    },

    /**
     * 完成任务
     */
    finishTask: function () {
      let _self = this;
      let taskId = this.$route.query.taskId;
      if (taskId == null) {
        return;
      }
      $.ajax({
        url: Common.getApiURL('WorkflowResource/finishTask'),
        type: 'get',
        dataType: 'json',
        beforeSend: function (request) {
          Common.addTokenToRequest(request);
        },
        contentType: 'application/json',
        data: { taskId: taskId },
        success: function (data) {},
        error: function (XMLHttpRequest, textStatus, errorThrown) {
          Common.processException(XMLHttpRequest, textStatus, errorThrown);
        },
      });
    },

    /**
     * 上一条数据
     * @return {void}
     */
    pre: function () {
      var _self = this;
      if (_self.currIndex <= 1) {
        return;
      }
      _self.currIndex--;
      var tabQueryParam = {
        range: {
          start: _self.currIndex - 1,
          length: 1,
        },
        windowNo: _self.windowNo,
        tabIndex: _self.tabIndex,
        sortStr: _self.sortStr,
        simpleFilterCondition: _self.simpleFilterParams,
        filterParams: _self.complexFilterParams,
      };

      _self.loadTabData(tabQueryParam);

      // 接口存在问题，查询参数结果异常，暂时注释掉,使用前端数据
      // UserStorageResource.uniqueByKey(_self.uuid).then(
      //   successData => {
      //     // if(successData.errorCode != 0) {
      //     //   Notify.error('提示', successData.errorMessage, false);
      //     //   return;
      //     // }
      //     let simpleFilterParams = null;

      //     let complexFilterParams = null;

      //     if (successData.data != null && successData.data != '') {
      //       let temp = JSON.parse(successData.data);
      //       // 分页数据

      //       // 简单过滤条件
      //       tabQueryParam.simpleFilterCondition = temp.simpleFilterParams;
      //       // 复杂过滤条件
      //       tabQueryParam.filterParams = temp.complexFilterParams;
      //       // 排序
      //       tabQueryParam.sortStr = temp.sortStr;
      //     }

      //     _self.loadTabData(tabQueryParam);
      //   },
      //   errorData => {
      //     Common.processException(errorData);
      //   },
      // );
    },

    /**
     * 下一条数据
     * @return {void}
     */
    next: function () {
      var _self = this;
      var totalCount = _self.totalCount;
      if (_self.currIndex >= totalCount) {
        return;
      }
      _self.currIndex++;
      var tabQueryParam = {
        range: {
          start: _self.currIndex - 1,
          length: 1,
        },
        windowNo: _self.windowNo,
        tabIndex: _self.tabIndex,
        simpleFilterCondition: _self.simpleFilterParams,
        filterParams: _self.complexFilterParams,
        sortStr: _self.sortStr,
      };
      _self.loadTabData(tabQueryParam); 

      // 接口存在问题，查询参数结果异常，暂时注释掉,使用前端数据
      // UserStorageResource.uniqueByKey(_self.uuid).then(
      //   successData => {
      //     // if(successData.errorCode != 0) {
      //     //   Notify.error('提示', successData.errorMessage, false);
      //     //   return;
      //     // }
      //     if (successData.data != null && successData.data != '') {
      //       let temp = JSON.parse(successData.data);
      //       // 分页数据

      //       // 简单过滤条件
      //       tabQueryParam.simpleFilterCondition = temp.simpleFilterParams;
      //       // 复杂过滤条件
      //       tabQueryParam.filterParams = temp.complexFilterParams;
      //       // 排序
      //       tabQueryParam.sortStr = temp.sortStr;
      //     }

      //     _self.loadTabData(tabQueryParam);
      //   },
      //   errorData => {
      //     Common.processException(errorData);
      //   },
      // );
    },

    /**
     * 加载一条数据
     * @param  {Object} tabQueryParam 查询条件
     * @return {void}
     */
    loadTabData: function (tabQueryParam) {
      var _self = this;

      _self.processInstanceId = '';

      _self.loading = true;
      WindowServerUtil.queryTabData(
        tabQueryParam,
        function (response) {
          _self.loading = false;

          if (response.errorCode != 0) {
            Notify.error('Error', response.errorMessage, false);
            return;
          }
          const gridData = response.data;
          var dataLists = gridData.dataList;
          if (dataLists != undefined && dataLists.length > 0) {
            _self.modelData = dataLists[0];
            if (_self.modelData) {
              _self.recordId = _self.modelData.id;
              _self.loadHeaderAndFooterContent(_self.recordId);

              if (_self.modelData.data.processInstanceId != undefined) {
                var displayValue =
                  _self.modelData.data.processInstanceId.displayValue;
                if (displayValue != undefined && displayValue.length > 0) {
                  _self.processInstanceId = displayValue[0];
                }
              }
            }
          }
        },
        function () {
          _self.loading = false;
        },
      );
    },

    /**
     * 计算按钮坐标
     *
     */
    computerButtonGroupLeftTop: function () {
      var _self = this;
      var fixedButtonGroup = $(_self.$refs.fixedButtonGroup);
      if (fixedButtonGroup != undefined) {
        var offset = fixedButtonGroup.offset();
        if (offset != undefined) {
          _self.buttonGroupInitLeft = offset.left;
          _self.buttonGroupInitTop = offset.top;
        }
      }
    },

    /**
     * 执行Callout
     */
    executeCallout: function (fieldItem) {
      var _self = this;
      if (fieldItem.calloutProcessReportNo != null) {
        _self.callout(fieldItem.calloutProcessReportNo);
      }
    },

    /**
     * callout
     * @param  {[type]} calloutProcessReportNo [description]
     * @return {[type]}                  [description]
     */
    callout: function (calloutProcessReportNo) {
      var _self = this;

      // 查询流程和报表的定义
      ProcessReportResource.uniqueByNo(calloutProcessReportNo).then(
        response => {
          if (response.errorCode != 0) {
            Notify.error('流程和报表获取错误', response.errorMessage, true);
            return;
          }
          const successData = response.data;
          if (successData == null) {
            return;
          }

          // 执行服务端的脚本
          ProcessReportResource.runCallout(
            calloutProcessReportNo,
            _self.modelData,
          ).then(
            successData => {
              if (successData && successData.modelData) {
                _self.modelData = successData.modelData;
              }
            },
            errorData => {
              Common.processException(errorData);
            },
          );
        },
        errorData => {
          Common.processException(errorData);
        },
      );
    },

    /**
     * 页签按钮的显示逻辑
     */
    tabButtonsShowLogical: function () {
      let _self = this;
      if (
        this.tab.tabFormView != null &&
        this.tab.tabFormView.tabButtons != null
      ) {
        for (
          let index = 0;
          index < this.tab.tabFormView.tabButtons.length;
          index++
        ) {
          let tabButton = this.tab.tabFormView.tabButtons[index];
          if (tabButton.editMode != true) {
            var logic = tabButton.showLogical;

            if (logic == null || logic == '') {
              tabButton.invisible = false;
              continue;
            }

            let functionName = 'form_view_show_logical_' + index;

            let executeFunction = function () {
              try {
                let context = new _self.getContext(_self.modelData);
                tabButton.invisible = !_self[functionName](context);
              } catch (error) {
                console.error(error);
                Notify.error(
                  '数据字典定义异常',
                  '【' +
                    tabButton.name +
                    '】页签按钮显示逻辑定义异常,请联系管理员检查数据字典的定义。',
                  false,
                );
              }
            };

            if (_self[functionName] == null) {
              const jsUrl = _self.jsUrl;
              if (jsUrl == null || jsUrl == undefined) {
                Notify.error(
                  '数据字典定义异常',
                  '【' +
                    tabButton.name +
                    '】页签按钮显示逻辑的JS文件不存在,请联系管理员检查数据字典是否存在JS文件。',
                  false,
                );
                return;
              }
              let promise = JsUtil.dynamicLoadJsFunction(jsUrl, logic);
              promise.then(
                targetFunction => {
                  if (targetFunction == null) {
                    Notify.error(
                      '数据字典定义异常',
                      '【' +
                        tabButton.name +
                        '】页签按钮显示逻辑不存在,请联系管理员检查数据字典的定义。',
                      false,
                    );
                    return;
                  }

                  _self[functionName] = targetFunction;

                  executeFunction();
                },
                errorData => {
                  console.error(errorData);
                },
              );
            } else {
              executeFunction();
            }
          }
        }
      }
    },

    /**
     * 报表视图显示逻辑
     */
    reportViewsShowLogical: function () {
      var _self = this;

      if (_self.windowDisplayType != 'Report') {
        // add by jack 2023-12-05
        // 如果不处于报表界面，那么不执行下述业务逻辑
        return;
      }

      if (
        _self.curdWindow.reportViewDto != null &&
        _self.curdWindow.reportViewDto.reportViewItemDtos != null
      ) {
        _self.processReportResult = undefined;
        for (
          let index = 0;
          index < _self.curdWindow.reportViewDto.reportViewItemDtos.length;
          index++
        ) {
          let reportViewItemDto =
            _self.curdWindow.reportViewDto.reportViewItemDtos[index];
          var logic = reportViewItemDto.showLogical;
          if (logic == null || logic == '') {
            reportViewItemDto.invisible = false;
            _self.executeProcess(reportViewItemDto.processReportNo);
            return;
          }

          let executeFunction = function () {
            let context = new _self.getContext(_self.modelData);

            reportViewItemDto.invisible = !_self[functionName](context);

            if (reportViewItemDto.invisible == false) {
              _self.executeProcess(reportViewItemDto.processReportNo);
            }
          };

          let functionName = 'form_view_showlogical_' + index;

          if (this[functionName] == null) {
            const jsUrl = _self.jsUrl;
            if (jsUrl == null || jsUrl == undefined) {
              Notify.error(
                '数据字典定义异常',
                '【' +
                  reportViewItemDto.processReportName +
                  '】CURD报表显示逻辑的JS文件不存在,请联系管理员检查数据字典是否存在JS文件。',
                false,
              );
              return;
            }
            let promise = JsUtil.dynamicLoadJsFunction(jsUrl, logic);
            promise.then(targetFunction => {
              if (targetFunction == null) {
                Notify.error(
                  '数据字典定义异常',
                  '【' +
                    reportViewItemDto.processReportName +
                    '】CURD报表显示逻辑不存在,请联系管理员检查数据字典的定义。',
                  false,
                );
                return;
              }
              _self[functionName] = targetFunction;

              executeFunction();
            });
          } else {
            executeFunction();
          }
        }
      }
    },
  },
};
</script>

<style scoped>
.field-group {
  padding-left: 30px;
  padding-right: 30px;
}

.fieldGroup-head {
  cursor: pointer;
}

.a-back {
  cursor: pointer;
  text-decoration: none;
}

h3 {
  line-height: inherit !important;
}

.m-space-btn-group {
  height: 34px;
}

.m-btn-space {
  flex-shrink: 0; min-width: 80px
}

.m-row {
  margin-top: 12px;
  margin-bottom: 0px !important;
}

.fixed-btn-group {
  z-index: 3;
  background-color: #f7f7f7;
}

.attachment-header {
  padding: 8px 0;
}

.padding-lr {
  padding-left: 15px;
  padding-right: 15px;
}

:deep(.attachment-header .ant-page-header .ant-page-header-heading-title) {
  font-size: 16px !important;
  font-weight: 500 !important;
}
</style>

<style>
.btn-group-fixed {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 3;
}

.m-image {
  height: 50px;
  cursor: pointer;
}
</style>