<template>
  <div>
    <el-dialog
      :title="$t1('设置权限')"
      :append-to-body="true"
      :modal-append-to-body="true"
      :close-on-click-modal="false"
      :visible.sync="showDialog"
      :modal="false"
      custom-class="dialog-style list-dialog dialog-checkbox pd_0"
      width="1200px"
      @close="dialogClose"
      v-el-drag-dialog
      v-el-dialog-center
    >
      <div class="cont">
        <div id="containt">
          <el-tabs v-model="activeName" class="tab-box">
            <el-tab-pane :label="$t1('用户权限设置')" name="first">
              <div class="grid-height" style="height: 500px">
                <vxe-grid
                  class="is-pointer"
                  ref="table-m1"
                  :data="tableData"
                  v-bind="vxeOption"
                  @resizable-change="$vxeTableUtil.onColumnWitchChange"
                  @custom="$vxeTableUtil.customHandle"
                >
                  <template #form>
                    <div class="clearfix screen-btns">
                      <div class="fl">
                        <vxe-button
                          status="primary"
                          class="button-sty"
                          icon="el-icon-plus"
                          @click="openSaleOrgAddDialog"
                        >
                          {{ $t1("新增机构") }}
                        </vxe-button>
                        <vxe-button
                          status="primary"
                          class="button-sty"
                          icon="el-icon-plus"
                          @click="openPositionAddDialog"
                        >
                          {{ $t1("新增岗位") }}
                        </vxe-button>
                        <vxe-button
                          status="primary"
                          class="button-sty"
                          icon="el-icon-plus"
                          @click="openUserAddDialog"
                        >
                          {{ $t1("新增用户") }}
                        </vxe-button>
                        <vxe-button
                          status="primary"
                          class="button-sty"
                          icon="el-icon-plus"
                          @click="openRoleAddDialog"
                        >
                          {{ $t1("新增角色") }}
                        </vxe-button>
                        <!--                      <vxe-button type="text" status="primary" plain class="button-sty" icon="el-icon-delete"
                                                          @click="deleteRows()">{{ $t2('删除', 'components.fileLibrary.delete') }}
                                              </vxe-button>-->
                      </div>
                      <div class="fl screen-breadcrumb" style="margin-left: 30px">
                        <span style="font-size: 12px"
                          >{{
                            $t2("文件路径", "components.fileLibrary.filePath")
                          }}：</span
                        >
                        <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>
                      </div>
                    </div>
                  </template>
                  <template #saleOrg="{ row, rowIndex }">
                    <el-input
                      class="search-input"
                      v-model="row.saleOrgName"
                      clearable
                      @clear="row.saleOrgId = null"
                      v-if="!row._isParent"
                      v-el-readonly
                    >
                      <i
                        slot="suffix"
                        class="el-input__icon el-icon-search"
                        @click="openSaleOrgRowDialog(row, rowIndex)"
                      ></i>
                    </el-input>
                    <template v-else>{{ row.saleOrgName }}</template>
                  </template>
                  <template #position="{ row, rowIndex }">
                    <el-input
                      class="search-input"
                      v-model="row.positionName"
                      clearable
                      @clear="row.positionId = null"
                      v-if="!row._isParent"
                      v-el-readonly
                    >
                      <i
                        slot="suffix"
                        class="el-input__icon el-icon-search"
                        @click="openPositionRowDialog(row, rowIndex)"
                      ></i>
                    </el-input>
                    <template v-else>{{ row.positionName }}</template>
                  </template>
                  <template #role="{ row, rowIndex }">
                    <el-input
                      class="search-input"
                      v-model="row.roleName"
                      clearable
                      @clear="row.roleId = null"
                      v-if="!row._isParent"
                      v-el-readonly
                    >
                      <i
                        slot="suffix"
                        class="el-input__icon el-icon-search"
                        @click="openRoleRowDialog(row, rowIndex)"
                      ></i>
                    </el-input>
                    <template v-else>{{ row.roleName }}</template>
                  </template>
                  <template #user="{ row, rowIndex }">
                    <el-input
                      class="search-input"
                      v-model="row.nickName"
                      clearable
                      @clear="row.userId = null"
                      v-if="!row._isParent"
                      v-el-readonly
                    >
                      <i
                        slot="suffix"
                        class="el-input__icon el-icon-search"
                        @click="openUserRowDialog(row, rowIndex)"
                      ></i>
                    </el-input>
                    <template v-else>{{ row.nickName }}</template>
                  </template>
                  <template #operate="{ row }">
                    <a
                      href="javascript:void(0);"
                      class="a-link"
                      @click="openEditDialog(row.id)"
                    >
                      <el-tooltip
                        :enterable="false"
                        effect="dark"
                        :content="$t2('查看', 'common.view')"
                        placement="top"
                        popper-class="tooltip-skin"
                      >
                        <i class="el-icon-edit" />
                      </el-tooltip>
                    </a>
                  </template>
                </vxe-grid>
              </div>
            </el-tab-pane>
            <el-tab-pane
              :label="$t1('文件操作，发系统通知')"
              name="second"
              v-if="fileStoreArea.toNotify"
            >
              <div class="grid-height" style="height: 500px">
                <fileObjNotifyEdit
                  v-if="showFileObjNotifyEdit"
                  visible-key="showFileObjNotifyEdit"
                  :current_prefix="current_prefix"
                  :_dataId="fileObjId"
                  :parent-target="_self"
                  @reload="$reloadHandle"
                ></fileObjNotifyEdit>
              </div>
            </el-tab-pane>
          </el-tabs>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" plain class="button-sty" @click="dialogClose">
          <i class="el-icon-close el-icon"></i>
          {{ $t2("取 消", "system.button.cancel2") }}
        </el-button>
        <el-button
          type="primary"
          @click="saveData"
          class="button-sty"
          v-if="activeName == 'first'"
        >
          <i class="el-icon-check el-icon"></i>
          {{ $t2("确 定", "system.button.confirm2") }}
        </el-button>
      </span>
    </el-dialog>

    <fileObjAuthEditDialog
      v-if="showDetailDialog"
      :visiable.sync="showDetailDialog"
      @confirm="confirmDetailDialog"
      :treeNodeArr="treeNodeArr"
      :currentRow="currentRow"
    ></fileObjAuthEditDialog>

    <userDialog
      v-if="showUserDialog"
      :visiable.sync="showUserDialog"
      @confirm="confirmInsertUser"
      multi="false"
    />
    <saleOrgDialog
      v-if="showSaleOrgDialog"
      :visiable.sync="showSaleOrgDialog"
      @confirm="confirmInsertSaleOrg"
      multi="false"
    />
    <positionDialog
      v-if="showPositionDialog"
      :visiable.sync="showPositionDialog"
      @confirm="confirmInsertPosition"
      multi="false"
    />

    <userDialog
      v-if="showUserRowDialog"
      :visiable.sync="showUserRowDialog"
      @confirm="confirmtUserRow"
      multi="false"
    />
    <saleOrgDialog
      v-if="showSaleOrgRowDialog"
      :visiable.sync="showSaleOrgRowDialog"
      @confirm="confirmSaleOrgRow"
      multi="false"
    />
    <positionDialog
      v-if="showPositionRowDialog"
      :visiable.sync="showPositionRowDialog"
      @confirm="confirmPositionRow"
      multi="false"
    />

    <roleDialog
      v-if="showRoleRowDialog"
      :visiable.sync="showRoleRowDialog"
      @confirm="confirmRoleRow"
      multi="false"
    />

    <userDialog
      v-if="showUserAddDialog"
      :visiable.sync="showUserAddDialog"
      @confirm="confirmtUserAddDialog"
      multi="true"
    />
    <saleOrgDialog
      v-if="showSaleOrgAddDialog"
      :visiable.sync="showSaleOrgAddDialog"
      @confirm="confirmSaleOrgAddDialog"
      multi="true"
    />
    <positionDialog
      v-if="showPositionAddDialog"
      :visiable.sync="showPositionAddDialog"
      @confirm="confirmPositionAddDialog"
      multi="true"
    />

    <roleDialog
      v-if="showRoleAddDialog"
      :visiable.sync="showRoleAddDialog"
      @confirm="confirmRoleAddDialog"
      multi="true"
    />
  </div>
</template>

<script>
import mixin from "./mixins/fileObjAuthDialogMixin";

export default {
  name: "fileObjAuthDialog",
  mixins: [mixin],
};
</script>

<style scoped></style>
