<template>
  <div v-show="title != '' && title != null" style="overflow: hidden">
    <div class="tree-box tree-annex fl">
      <div class="tit">
        <b>{{ title }}</b>
      </div>
      <div class="tree-form" v-if="option.showCategoryFilterArea !== false">
        <el-input
          :placeholder="
            $t2('请输入文件夹名称', 'components.fileLibrary.categoryPlaceholder')
          "
          v-model="filterText"
          class="txt"
        >
          <el-button slot="append" icon="el-icon-search"></el-button>
        </el-input>
      </div>
      <div class="tree-btns" v-if="isCategoryEdit">
        <el-button
          type="primary"
          plain
          icon="el-icon-circle-plus-outline"
          class="btn"
          @click="addFileCategory()"
          v-if="fileObjAuth.addAuth"
          >{{ $t2("新增", "components.fileLibrary.addCategory") }}
        </el-button>
        <el-button
          type="primary"
          plain
          icon="el-icon-edit-outline"
          class="btn"
          @click="editFileCategory()"
          :disabled="currentFileCategory === null || !currentFileCategory.id"
          v-if="fileObjAuth.editAuth"
        >
          {{ $t2("编辑", "components.fileLibrary.editCategory") }}
        </el-button>
        <el-button
          type="primary"
          plain
          class="btn"
          icon="el-icon-edit"
          @click="showFileObjAuthDialog = true"
          v-if="isEdit && fileObjAuth.authAuth"
          >{{ $t2("权限", "components.fileLibrary.authAuth") }}
        </el-button>
      </div>
      <el-tree
        v-if="treeFlag"
        :props="defaultProps"
        :load="loadNode"
        node-key="id"
        ref="tree"
        lazy
        :filter-node-method="filterNode"
        :expand-on-click-node="false"
        @node-click="handleNodeClick"
        class="tree-list"
        icon-class="el-icon-arrow-down"
        :style="
          option.showCategoryFilterArea === false ? 'height: calc(100vh - 113px)' : ''
        "
      >
        <span class="el-tree-node__label" slot-scope="{ node }" v-if="!node.data.moreBtn">
          <i class="ico-wenjian"></i>
          <span>{{ node.label }}</span>
        </span>
        <span v-else class="el-tree-node__label">
          <el-button type="primary" plain class="button-sty">{{ node.label }}</el-button>
        </span>
      </el-tree>
    </div>
    <label id="labBtn">
      <div class="icon">
        <i class="el-icon-more"></i>
        <i class="el-icon-more"></i>
      </div>
    </label>
    <div class="main-right file-library fr" style="overflow: hidden">
      <div class="pop-annex-filter" v-if="popAnnexFilter">
        <div class="item" v-for="(checkBillData, index) in checkBillDatas" :key="index">
          <span>{{ getBillLabel(checkBillData) }}</span
          ><i class="el-icon-close" @click="deleteBillData(index)"></i>
        </div>
      </div>
      <div class="annex-filter" v-if="isBillEnabled">
        <el-button
          slot="append"
          icon="el-icon-search"
          @click="openBillDialog"
          size="mini"
          class="an-btn-search"
          type="success"
        >
          {{
            $t2("选择" + billConfig.name, "components.fileLibrary.selectBill", {
              billName: billConfig.name,
            })
          }}
        </el-button>
        <div class="abox">
          <div class="item" v-for="(checkBillData, index) in checkBillDatas" :key="index">
            <span>{{ getBillLabel(checkBillData) }}</span
            ><i class="el-icon-close" @click="deleteBillData(index)"></i>
          </div>
        </div>

        <el-button
          slot="append"
          icon="iconfont icon-gengduo1"
          size="mini"
          class="an-btn-more"
          type="primary"
          @click="popAnnexFilter = false"
          v-if="popAnnexFilter"
        >
        </el-button>
        <el-button
          slot="append"
          icon="iconfont icon-gengduo1"
          size="mini"
          class="an-btn-more"
          @click="popAnnexFilter = true"
          v-else
        >
        </el-button>
        <el-button
          slot="append"
          icon="el-icon-delete"
          size="mini"
          class="an-btn-del"
          @click="clearBill"
        >
          {{ $t2("取消选择", "components.fileLibrary.cancelSelect") }}
        </el-button>
      </div>

      <div class="annex-screen">
        <el-button
          type="warning"
          class="button-sty"
          icon="el-icon-plus"
          @click="addFile"
          v-if="isEdit && fileObjAuth.uploadAuth"
          >{{ $t2("上传", "components.fileLibrary.upload") }}
        </el-button>
        <el-button
          type="primary"
          class="button-sty"
          icon="el-icon-download"
          @click.native="mulDownload2"
          v-if="fileObjAuth.downloadAuth"
          >{{ $t2("下载", "components.fileLibrary.download") }}
        </el-button>
        <el-button
          type="danger"
          class="button-sty"
          icon="el-icon-takeaway-box"
          @click="showRecycleBinDialog = true"
          v-if="isEdit && (fileObjAuth.deleteAuth || fileObjAuth.deleteDirAuth)"
        >
          {{ $t2("回收站", "components.fileLibrary.recycleBin") }}
        </el-button>
        <el-button
          type="primary"
          plain
          class="button-sty"
          icon="el-icon-rank"
          @click.native="openCategoryMoveDialog(1)"
          v-if="isEdit && fileObjAuth.moveAuth"
        >
          {{ $t2("移动到", "components.fileLibrary.moveTo") }}
        </el-button>
        <el-button
          type="primary"
          plain
          class="button-sty"
          icon="el-icon-copy-document"
          @click.native="openCategoryMoveDialog(2)"
          v-if="isEdit && fileObjAuth.copyAuth"
        >
          {{ $t2("复制到", "components.fileLibrary.copyTo") }}
        </el-button>
        <el-button
          type="primary"
          plain
          class="button-sty"
          icon="el-icon-refresh"
          @click.native="batchReplace"
          v-if="isEdit && fileObjAuth.replaceAuth"
        >
          {{ $t2("替换", "components.fileLibrary.replace") }}
        </el-button>
        <el-button
          type="primary"
          plain
          class="button-sty"
          icon="el-icon-delete"
          @click.native="deleteAttach()"
          v-if="isEdit && (fileObjAuth.deleteAuth || fileObjAuth.deleteDirAuth)"
        >
          {{ $t2("删除", "components.fileLibrary.delete") }}
        </el-button>
        <el-button
          icon="iconfont icon-shaixuan"
          class="button-sty"
          @click="showFilterDialog = true"
        >
          {{ $t1("搜索") }}
        </el-button>

        <template v-for="(fileButton, customToobarButtonIndex) in customToobarButtons">
          <template
            v-if="
              fileButton.dirs === null ||
              fileButton.dirs === undefined ||
              attachment.dirs === fileButton.dirs
            "
          >
            <template v-if="customFileButtonVisable(fileButton, attachment)">
              <el-button
                type="primary"
                plain
                class="button-sty"
                :icon="fileButton.icon"
                :key="customToobarButtonIndex"
                @click="customToobarButtonEvent(fileButton)"
                >{{ fileButton.label }}
              </el-button>
            </template>
          </template>
        </template>
      </div>
      <div
        class="line"
        v-if="
          fileObjAuth.uploadAuth ||
          fileObjAuth.downloadAuth ||
          fileObjAuth.deleteAuth ||
          fileObjAuth.moveAuth ||
          fileObjAuth.copyAuth ||
          fileObjAuth.replaceAuth ||
          fileObjAuth.deleteDirAuth
        "
      ></div>
      <div class="annex-crumbs">
        <span class="tit"><i class="iconfont icon-wenjianjia"></i>文件区</span>
        <span class="tit" style="padding-right: 0"
          >{{ $t2("指定路径", "components.fileLibrary.assignPath") }}：</span
        >
        <el-breadcrumb separator-class="el-icon-arrow-right">
          <el-breadcrumb-item
            v-for="treeNode in treeNodeArr"
            :key="treeNode.id"
            @click.native="doNav(treeNode)"
            >{{ treeNode.label }}
          </el-breadcrumb-item>
        </el-breadcrumb>
      </div>
      <div class="grid-height viewBox">
        <div class="annex-searchBox">
          <div class="fl">
            <div class="oper">
              <el-checkbox
                v-model="checkAll"
                @change="changeCheckAll"
                :disabled="checkAllDisabled"
                :indeterminate="checkAllIndeterminate"
                >已选中 {{ checkList.length }} 项{{
                  $t2("", "components.fileLibrary.aa")
                }}
              </el-checkbox>
            </div>
            <div class="search-box">
              <template v-if="currentFileCategory && currentFileCategory.id">
                <el-input
                  :placeholder="
                    $t2('请输入文件名', 'components.fileLibrary.filePlaceholder')
                  "
                  v-model="formData.fileName"
                  clearable
                >
                  <el-button
                    slot="append"
                    icon="el-icon-search"
                    @click="searchEvent"
                  ></el-button>
                </el-input>
                <el-button
                  icon="iconfont icon-shaixuan"
                  class="button-sty"
                  @click="showAdvancedSearch = true"
                >
                  {{ $t2("筛选", "components.fileLibrary.screen") }}
                </el-button>
              </template>
            </div>
          </div>
          <div class="fr">
            <el-button
              type="primary"
              icon="iconfont icon-icmenu2"
              @click="changeShowType()"
              class="button-sty icon-btn"
              v-show="showType === 1"
              >{{ $t2("列表", "components.fileLibrary.tableList") }}
            </el-button>
            <el-button
              type="primary"
              style="margin-left: 0"
              icon="el-icon-menu"
              @click="changeShowType()"
              class="button-sty icon-btn"
              v-show="showType === 2"
              >{{ $t2("图示", "components.fileLibrary.imageList") }}
            </el-button>
          </div>
        </div>
        <div class="mask" v-show="is_show_mask"></div>
        <div
          class="containter1"
          ref="containter1"
          v-show="showType === 1"
          style="overflow: auto"
        >
          <div class="annex-piclist">
            <div class="clearfix">
              <el-checkbox-group
                v-model="checkList"
                @change="checkChange"
                class="f-group"
              >
                <template v-for="(attachment, index) in page.records">
                  <li
                    :key="index"
                    class="item"
                    :class="checkList.includes(attachment.id) ? 'on' : ''"
                  >
                    <el-checkbox :label="attachment.id"><span></span></el-checkbox>
                    <div class="oper">
                      <el-tooltip
                        effect="dark"
                        content="详情"
                        placement="top"
                        v-if="!attachment.dirs && isEdit && fileObjAuth.editAuth"
                        ><i
                          class="el-tooltip iconfont icon-shuxing ico"
                          @click="openPropertiesDialog(attachment)"
                        ></i>
                      </el-tooltip>
                      <el-tooltip
                        effect="dark"
                        content="详情"
                        placement="top"
                        v-if="attachment.dirs && isEdit && fileObjAuth.editAuth"
                        ><i
                          class="el-tooltip iconfont icon-shuxing ico"
                          @click="editFileCategory(attachment)"
                        ></i>
                      </el-tooltip>
                      <a
                        href="javascript:void(0);"
                        class="a-link ico"
                        v-if="!attachment.dirs && fileObjAuth.downloadAuth"
                        @click="downloadSingerFile(attachment)"
                      >
                        <el-tooltip
                          effect="dark"
                          content="下载"
                          placement="top"
                          popper-class="tooltip-skin"
                        >
                          <i class="el-icon-download" />
                        </el-tooltip>
                      </a>
                      <el-dropdown trigger="click" v-if="isEdit">
                        <span class="ico"><i class="el-icon-more"></i> </span>
                        <el-dropdown-menu slot="dropdown">
                          <el-dropdown-item
                            @click.native="openShareDialog(attachment)"
                            v-if="!attachment.dirs && fileObjAuth.shareAuth"
                            ><i class="el-icon-share"></i>分享
                          </el-dropdown-item>
                          <el-dropdown-item
                            @click.native="replaceFile(attachment, index, page.records)"
                            v-if="
                              !attachment.dirs &&
                              isEdit &&
                              attachment.status != 1 &&
                              fileObjAuth.replaceAuth
                            "
                          >
                            <i class="el-icon-refresh"></i>替换
                          </el-dropdown-item>
                          <el-dropdown-item
                            @click.native="openFileHistoryDialog(attachment)"
                            v-if="
                              !attachment.dirs &&
                              isEdit &&
                              attachment.status != 1 &&
                              fileObjAuth.historyAuth
                            "
                          >
                            <i class="el-icon-s-order"></i>历史
                          </el-dropdown-item>
                          <el-dropdown-item
                            @click.native="deleteAttach(attachment)"
                            v-if="
                              !attachment.dirs &&
                              isEdit &&
                              attachment.status != 1 &&
                              fileObjAuth.deleteAuth
                            "
                          >
                            <i class="el-icon-delete"></i>删除
                          </el-dropdown-item>
                          <el-dropdown-item
                            @click.native="deleteCategory(attachment)"
                            v-if="attachment.dirs && isEdit && fileObjAuth.deleteDirAuth"
                          >
                            <i class="el-icon-delete"></i>删除
                          </el-dropdown-item>
                          <template
                            v-for="(fileButton, fileButtonIndex) in customFileButtons"
                          >
                            <template
                              v-if="
                                fileButton.dirs === null ||
                                fileButton.dirs === undefined ||
                                attachment.dirs === fileButton.dirs
                              "
                            >
                              <template
                                v-if="customFileButtonVisable(fileButton, attachment)"
                              >
                                <el-dropdown-item
                                  @click.native="
                                    customFileButtonEvent(fileButton, attachment)
                                  "
                                  :key="fileButtonIndex"
                                >
                                  <i :class="fileButton.icon"></i>{{ fileButton.label }}
                                </el-dropdown-item>
                              </template>
                            </template>
                          </template>
                        </el-dropdown-menu>
                      </el-dropdown>
                    </div>
                    <div class="custom-slot">
                      <slot name="custom" v-bind="{ row: attachment }"></slot>
                    </div>
                    <!-- <div class="status s-1" v-if="!attachment.dirs && attachment.status==1">
                      <el-tooltip effect="dark" content="已归档" placement="top" popper-class="tooltip-skin"><i
                        class="iconfont icon-file"></i>
                      </el-tooltip>
                    </div> -->
                    <div
                      class="status s-1"
                      v-if="!attachment.dirs && attachment.status === 1"
                    ></div>
                    <div
                      class="img"
                      @click="openPreview(attachment)"
                      v-if="!attachment.dirs"
                    >
                      <div class="show-video" v-if="hasPreview(attachment)">
                        <i class="icon-chakan"></i>
                      </div>
                      <div class="show-video" v-if="false">
                        <i class="el-icon-video-play"></i>
                      </div>
                      <p><img :src="getShowUrl(attachment)" /></p>
                    </div>
                    <div
                      class="img"
                      @click="changeCategory(attachment)"
                      v-if="attachment.dirs"
                    >
                      <svg-icon icon-class="ico-wenjianjia" />
                    </div>
                    <el-tooltip
                      :enterable="false"
                      effect="dark"
                      :content="attachment.fileName"
                      placement="top"
                    >
                      <div class="txt-box">
                        <div class="tb-left"></div>
                        <div class="tb-mid">
                          <div class="txt">
                            <span class="name">{{ getFileName(attachment) }}</span
                            ><span v-if="attachment.extension"
                              >.{{ attachment.extension }}</span
                            >
                          </div>
                        </div>
                        <div class="format">... .{{ attachment.extension }}</div>
                      </div>
                    </el-tooltip>
                  </li>
                </template>
              </el-checkbox-group>
              <!--              <div class="item more" v-if="page.total>page.records.length"
                                 @click="changePage(page.current+1, pageSize)">
                              <div class="img">
                                <svg-icon icon-class="ico-more"/>
                              </div>
                              <div class="name">更多</div>
                            </div>-->
            </div>
            <div class="vxe-grid">
              <div class="vxe-grid&#45;&#45;pager-wrapper">
                <vxe-pager
                  class="pages-box"
                  :current-page.sync="page.current"
                  :page-size.sync="page.size"
                  :total="page.total"
                  :layouts="['PrevPage', 'Number', 'NextPage']"
                  @page-change="changePageNew"
                >
                  <template #right>
                    <span>
                      <span>当前记录</span>
                      <span class="f-red"> {{ page.records.length }} </span>
                      <span>/</span>
                      <span class="f-red"> {{ page.total }}</span>
                    </span>
                  </template>
                </vxe-pager>
              </div>
            </div>
          </div>
        </div>
        <div class="annex-grid-height">
          <vxe-grid
            v-show="showType === 2"
            ref="table-m1"
            v-bind="vxeOption"
            :data="page.records"
            @resizable-change="$vxeTableUtil.onColumnWitchChange"
            @custom="$vxeTableUtil.customHandle"
            @checkbox-change="tableCheckChange"
            @checkbox-all="tableCheckAll"
          >
            <!--          <template #bottom v-if="page.total>page.records.length">
                        <div class="vxe-annex-more" @click="changePage(page.current+1, pageSize)">
                          <span>更多</span>
                          <i class="el-icon-d-arrow-right"></i>
                        </div>
                      </template>-->
            <template #pager>
              <vxe-pager
                class="pages-box"
                :current-page.sync="page.current"
                :page-size.sync="page.size"
                :total="page.total"
                :layouts="['PrevPage', 'Number', 'NextPage']"
                @page-change="changePageNew"
              >
                <template #right>
                  <span>
                    <span>{{ $t2("当前记录", "components.table.pageInfo") }}</span>
                    <span class="f-red"> {{ page.records.length }} </span>
                    <span>/</span>
                    <span class="f-red"> {{ page.total }}</span>
                  </span>
                </template>
              </vxe-pager>
            </template>
            <template #operate="{ row, rowIndex, items }">
              <template v-if="!row.dirs">
                <a
                  href="javascript:void(0);"
                  class="a-link"
                  v-if="isEdit && fileObjAuth.editAuth === 1"
                  @click="openPropertiesDialog(row)"
                >
                  <el-tooltip
                    :enterable="false"
                    effect="dark"
                    :content="$t2('详情', 'components.fileLibrary.detail')"
                    placement="top"
                    popper-class="tooltip-skin"
                  >
                    <i class="iconfont icon-shuxing" />
                  </el-tooltip>
                </a>
                <a
                  href="javascript:void(0);"
                  class="a-link"
                  v-if="fileObjAuth.downloadAuth === 1"
                  @click="downloadSingerFile(row)"
                >
                  <el-tooltip
                    :enterable="false"
                    effect="dark"
                    :content="$t2('下载', 'components.fileLibrary.download')"
                    placement="top"
                    popper-class="tooltip-skin"
                  >
                    <i class="el-icon-download" />
                  </el-tooltip>
                </a>
                <a
                  href="javascript:void(0);"
                  class="a-link"
                  v-if="fileObjAuth.shareAuth === 1"
                  @click="openShareDialog(row)"
                >
                  <el-tooltip
                    :enterable="false"
                    effect="dark"
                    :content="$t2('分享', 'components.fileLibrary.share')"
                    placement="top"
                    popper-class="tooltip-skin"
                  >
                    <i class="el-icon-share" />
                  </el-tooltip>
                </a>
                <a
                  href="javascript:void(0);"
                  class="a-link"
                  v-if="isEdit && row.status != 1 && fileObjAuth.replaceAuth === 1"
                  @click="replaceFile(row, rowIndex, items)"
                >
                  <el-tooltip
                    :enterable="false"
                    effect="dark"
                    :content="$t2('替换', 'components.fileLibrary.replace')"
                    placement="top"
                    popper-class="tooltip-skin"
                  >
                    <i class="el-icon-refresh" />
                  </el-tooltip>
                </a>
                <a
                  href="javascript:void(0);"
                  class="a-link"
                  v-if="isEdit && row.status != 1 && fileObjAuth.historyAuth === 1"
                  @click="openFileHistoryDialog(row)"
                >
                  <el-tooltip
                    :enterable="false"
                    effect="dark"
                    :content="$t2('历史', 'components.fileLibrary.history')"
                    placement="top"
                    popper-class="tooltip-skin"
                  >
                    <i class="el-icon-s-order" />
                  </el-tooltip>
                </a>
                <a
                  href="javascript:void(0);"
                  class="a-link"
                  v-if="isEdit && row.status != 1 && fileObjAuth.deleteAuth === 1"
                  @click="deleteAttach(row)"
                >
                  <el-tooltip
                    :enterable="false"
                    effect="dark"
                    :content="$t2('删除', 'components.fileLibrary.delete')"
                    placement="top"
                    popper-class="tooltip-skin"
                  >
                    <i class="el-icon-delete" />
                  </el-tooltip>
                </a>
              </template>
              <template v-else>
                <a
                  href="javascript:void(0);"
                  class="a-link"
                  v-if="isEdit && isCategoryEdit && fileObjAuth.editAuth === 1"
                  @click="editFileCategory(row)"
                >
                  <el-tooltip
                    :enterable="false"
                    effect="dark"
                    :content="$t2('详情', 'components.fileLibrary.detail')"
                    placement="top"
                    popper-class="tooltip-skin"
                  >
                    <i class="iconfont icon-shuxing" />
                  </el-tooltip>
                </a>
                <a
                  href="javascript:void(0);"
                  class="a-link"
                  v-if="isEdit && isCategoryEdit && fileObjAuth.deleteDirAuth === 1"
                  @click="deleteAttach(row)"
                >
                  <el-tooltip
                    :enterable="false"
                    effect="dark"
                    :content="$t2('删除', 'components.fileLibrary.delete')"
                    placement="top"
                    popper-class="tooltip-skin"
                  >
                    <i class="el-icon-delete" />
                  </el-tooltip>
                </a>
              </template>
              <template v-for="(fileButton, index) in customFileButtons">
                <template
                  v-if="
                    fileButton.dirs === null ||
                    fileButton.dirs === undefined ||
                    row.dirs === fileButton.dirs
                  "
                >
                  <a
                    :key="index"
                    href="javascript:void(0);"
                    class="a-link"
                    v-if="customFileButtonVisable(fileButton, row)"
                    @click="customFileButtonEvent(fileButton, row)"
                  >
                    <el-tooltip
                      :enterable="false"
                      effect="dark"
                      :content="fileButton.label"
                      placement="top"
                      popper-class="tooltip-skin"
                    >
                      <i :class="fileButton.icon" />
                    </el-tooltip>
                  </a>
                </template>
              </template>
            </template>
          </vxe-grid>
        </div>
      </div>
      <el-dialog
        :title="
          editCategory.id
            ? $t2('编辑文件夹', 'components.fileLibrary.editCategoryTitle')
            : $t2('新增文件夹', 'components.fileLibrary.addCategoryTitle')
        "
        :append-to-body="true"
        :modal-append-to-body="true"
        :close-on-click-modal="false"
        v-if="showEditCategoryDialog"
        :visible.sync="showEditCategoryDialog"
        :modal="false"
        custom-class="dialog-style list-dialog dialog-checkbox pd_8"
        width="562px"
        v-el-drag-dialog
        v-el-dialog-center
      >
        <div class="cont">
          <el-form
            ref="editCategoryForm"
            :model="editCategory"
            label-width="102px"
            class="adSearchForm"
          >
            <el-form-item
              :label="$t2('文件夹路径', 'components.fileLibrary.fileCategoryPath')"
            >
              <el-breadcrumb separator-class="el-icon-arrow-right">
                <el-breadcrumb-item v-for="(treeNode, index) in treeNodeArr" :key="index"
                  >{{ treeNode.label }}
                </el-breadcrumb-item>
              </el-breadcrumb>
            </el-form-item>
            <el-form-item
              :label="$t2('文件夹编码', 'components.fileLibrary.fileCategorySn')"
            >
              <span>{{ editCategory.fileSn }}</span>
            </el-form-item>
            <el-form-item
              :label="$t2('文件夹名称', 'components.fileLibrary.fileCategoryName')"
            >
              <el-input v-model="editCategory.fileName" clearable class="all-width" />
            </el-form-item>
            <el-form-item :label="$t1('关联编码')">
              <el-input v-model="editCategory.relationCode" clearable class="all-width" />
            </el-form-item>
          </el-form>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            plain
            class="button-sty"
            @click="showEditCategoryDialog = false"
          >
            <i class="el-icon-close el-icon"></i>
            {{ $t2("取 消", "system.button.cancel2") }}
          </el-button>
          <el-button type="primary" @click="confirmEditCategoryDialog" class="button-sty">
            <i class="el-icon-check el-icon"></i>
            {{ $t2("确 定", "system.button.confirm2") }}
          </el-button>
        </span>
      </el-dialog>
    </div>
    <propertiesDialog
      v-if="showPropertiesDialog"
      :visiable.sync="showPropertiesDialog"
      :editAttachment.sync="editAttachment"
      :isEdit="isEdit"
      :treeNodeArr.sync="treeNodeArr"
      :option="option"
    ></propertiesDialog>
    <el-image-viewer
      v-if="showViewer"
      :on-close="
        () => {
          showViewer = false;
        }
      "
      :initial-index.sync="chooseIndex"
      :url-list="imageDTOs"
    />
    <categoryMoveDialog
      :checkRows.sync="checkRows"
      v-if="showCategoryMoveDialog"
      :visiable.sync="showCategoryMoveDialog"
      @confirm="confirmMoveDialog"
      :handleType.sync="handleType"
    ></categoryMoveDialog>
    <fileHistoryDialog
      v-if="showFileHistoryDialog"
      :visiable.sync="showFileHistoryDialog"
      :currentFile.sync="operateFileHistory"
      @confirm="confirmFileHistoryDialog"
      :multi="false"
    />

    <shareDialog
      v-if="showShareDialog"
      :visiable.sync="showShareDialog"
      :attachment.sync="shareAttachment"
    ></shareDialog>
    <recycleBinDialog
      v-if="showRecycleBinDialog"
      :visiable.sync="showRecycleBinDialog"
      :option.sync="option"
      :treeNodeArr="treeNodeArr"
      :currentFileCategory="currentFileCategory"
      @confirm="confirmRecycleBinDialog"
    ></recycleBinDialog>
    <advancedSearchDialog
      v-if="showAdvancedSearch"
      :visiable.sync="showAdvancedSearch"
      :formData.sync="advancedFormData"
      @confirm="searchEvent"
    >
      <template #form>
        <vxe-form
          :model="advancedFormData"
          title-width="102px"
          :inline="true"
          class="adSearchForm"
        >
          <!--          <vxe-form-item title="属性名称:">
                      <template v-slot>
                        <el-input v-model="advancedFormData.attributeName" clearable/>
                      </template>
                    </vxe-form-item>
                    <vxe-form-item title="属性值:">
                      <template v-slot>
                        <el-input v-model="advancedFormData.attributeValue" clearable/>
                      </template>
                    </vxe-form-item>-->
          <!--          <vxe-form-item title="状态:">
                      <template v-slot>
                        <el-select v-model="advancedFormData.status" clearable>
                          <el-option :value="0" label="未归档"></el-option>
                          <el-option :value="1" label="已归档"></el-option>
                        </el-select>
                      </template>
                    </vxe-form-item>-->
          <vxe-form-item title="所属对象描述:" class-name="block">
            <template v-slot>
              <el-input v-model="advancedFormData.note" clearable />
            </template>
          </vxe-form-item>
          <vxe-form-item title="创建时间:">
            <template v-slot>
              <el-date-picker
                v-model="advancedFormData.startTime"
                type="date"
                placeholder=""
                size="small"
                clearable
                value-format="yyyy-MM-dd"
                :picker-options="$baseStartPickerOptions(advancedFormData.endTime)"
              ></el-date-picker>
              <span>-</span>
              <el-date-picker
                v-model="advancedFormData.endTime"
                type="date"
                placeholder=""
                size="small"
                clearable
                value-format="yyyy-MM-dd"
                :picker-options="$baseEndPickerOptions(advancedFormData.startTime)"
              ></el-date-picker>
            </template>
          </vxe-form-item>
        </vxe-form>
      </template>
    </advancedSearchDialog>
    <component
      v-if="isBillEnabled && showBillDialog && billDialogContent"
      :visiable.sync="showBillDialog"
      :is="billDialogContent"
      v-bind="billDialogParam"
      @confirm="confirmBillDialog"
    ></component>
    <videoDialog
      v-if="showVideoDialog"
      :visiable.sync="showVideoDialog"
      :option="videoOption"
    ></videoDialog>
    <fileObjAuthDialog
      v-if="showFileObjAuthDialog"
      :visiable.sync="showFileObjAuthDialog"
      :fileObjId="currentFileCategory ? currentFileCategory.id : 0"
      :treeNodeArr="treeNodeArr"
    />

    <filterDialog
      v-if="showFilterDialog"
      :visiable.sync="showFilterDialog"
      queryType="pcp"
      :treeNodeArr="treeNodeArr"
      :currentFileCategory="currentFileCategory"
      @openFileDirs="openFileDirs"
    ></filterDialog>
  </div>
</template>

<script>
import mixins from "./mixins/indexMixins";
export default {
  name: "ledgerLibrary",
  mixins: [mixins],
};
</script>
<style lang="scss" scoped>
#labBtn {
  height: calc(100vh - 32px);
}

#containt {
  overflow: hidden;

  .main-right {
    margin-left: -1%;
    padding-left: 18px !important;
    padding-top: 8px;
    padding-right: 8px;
    overflow: hidden;
  }
}

.upload-list .upload-box {
  display: inline-block;
}

.vxe-grid .vxe-gird-block {
  height: calc(100vh - 161px);
}

.grid-height.viewBox {
  height: calc(100vh - 84px);

  .containter1 {
    .annex-piclist > .clearfix {
      height: calc(100vh - 159px);
    }
  }

  .annex-grid-height {
    height: calc(100vh - 126px);
  }
}

.annex-screen + .line + .annex-crumbs + .grid-height.viewBox {
  height: calc(100vh - 133px);

  .containter1 {
    .annex-piclist > .clearfix {
      height: calc(100vh - 208px);
    }
  }

  .annex-grid-height {
    height: calc(100vh - 175px);
  }
}

.annex-filter + .annex-crumbs + .grid-height.viewBox {
  height: calc(100vh - 125px);

  .containter1 {
    .annex-piclist > .clearfix {
      height: calc(100vh - 200px);
    }
  }

  .annex-grid-height {
    height: calc(100vh - 167px);
  }
}

.annex-filter + .annex-screen + .line + .annex-crumbs + .grid-height.viewBox {
  height: calc(100vh - 173px);

  .containter1 {
    .annex-piclist > .clearfix {
      height: calc(100vh - 248px);
    }
  }

  .annex-grid-height {
    height: calc(100vh - 215px);
  }
}

#labBtn {
  height: calc(100vh - 34px);
}
</style>
