<template>
  <div class="functionDiv">
    <div class="MainLeft" ref="mainLeft">
      <!-- 下拉选择公司 -->
      <div class="app-select">
        <el-select
          v-model="appCodeValue"
          placeholder="请选择应用"
          @change="selectAppCode"
        >
          <el-option
            v-for="item in options"
            :key="item.appId"
            :label="item.appName"
            :value="item.appId"
          >
          </el-option>
        </el-select>
      </div>
      <div class="public-function-div">
        导航树
        <el-button
          type="success"
          @click="setCheckedNodes"
          size="small"
          class="refresh"
          >展开</el-button
        >
        <el-button
          type="success"
          @click="setCheckedKeys"
          size="small"
          class="refresh2"
          >收起</el-button
        >
        <el-button
          type="primary"
          @click="handleReset('formItem')"
          size="small"
          class="_refresh3"
          v-privilege="activeMenu + 'ADD'"
          :disabled="appCodeValue === ''"
          >新增顶级菜单</el-button
        >
      </div>
      <el-input
        placeholder="输入关键字进行过滤"
        class="filterTree"
        v-model="filterText"
      >
      </el-input>
      <el-tree
        ref="menuTree"
        :data="menuTree"
        :props="defaultProps"
        node-key="id"
        v-loading="treeLoading"
        :default-expanded-keys="expandedKeys"
        @node-expand="expandNode"
        @node-collapse="expandCollapse"
        @node-drag-start="handleDragStart"
        @node-drag-end="handleDragEnd"
        :expand-on-click-node="true"
        @node-click="nodeClick"
        :style="{ height: treeHeight + 'px' }"
        :filter-node-method="filterOrgTree"
      >
        <span class="custom-tree-node" slot-scope="{ node, data }">
          <span
            :style="
              data.status === '0' || node.parent.data.status === '0'
                ? 'color: #a09e9e;'
                : ''
            "
            >{{ node.label }}</span
          >
          <span class="nodeOperate">
            <el-dropdown @command="handleCommand" :hide-on-click="false">
              <span class="el-dropdown-link">
                <i
                  class="el-icon-arrow-down icore-icon-size"
                  style="color: #111; background-color: #61f06e"
                ></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-row>
                  <el-dropdown-item
                    :command="{ str: 'add', node: node, data: data }"
                    v-if="data.menuType === '1'"
                    class="el-icon-plus addMenuPr"
                    >添加</el-dropdown-item
                  >
                </el-row>
                <el-row>
                  <el-dropdown-item
                    :command="{ str: 'delete', node: node, data: data }"
                    class="el-icon-delete delMenuPr"
                    >删除</el-dropdown-item
                  >
                </el-row>
                <el-row>
                  <el-dropdown-item
                    :command="{ str: 'up', node: node, data: data }"
                    class="el-icon-upload2 upMenuPr"
                    >上移</el-dropdown-item
                  >
                </el-row>
                <el-row>
                  <el-dropdown-item
                    :command="{ str: 'down', node: node, data: data }"
                    class="el-icon-download downMenuPr"
                    >下移</el-dropdown-item
                  >
                </el-row>
                <el-row>
                  <el-dropdown-item
                    :command="{ str: 'left', node: node, data: data }"
                    v-if="node.level > 1"
                    class="el-icon-d-arrow-left leftMenuPr"
                    >左移</el-dropdown-item
                  >
                </el-row>
                <el-row>
                  <el-dropdown-item
                    :command="{ str: 'right', node: node, data: data }"
                    v-if="
                      node.level === 1 && node === node.parent.childNodes[0]
                        ? false
                        : true
                    "
                    class="el-icon-d-arrow-right rightMenuPr"
                    >右移</el-dropdown-item
                  >
                </el-row>
              </el-dropdown-menu>
            </el-dropdown>
          </span>
        </span>
      </el-tree>
    </div>

    <div class="MainRight">
      <el-button
        type="primary"
        @click="menuExport"
        size="small"
        class="exportButton"
        v-privilege="activeMenu + 'EXPORT'"
        >导出菜单详情</el-button
      >
      <el-tabs v-model="activeName">
        <el-tab-pane label="编辑区" name="editForm">
          <el-form
            ref="formItem"
            :model="formItem"
            :rules="ruleValidate_formItem"
            label-width="100px"
            class="FormMain"
            v-if="appCodeValue !== ''"
          >
            <el-row>
              <el-col :span="24">
                <el-form-item label="父菜单" prop="pName">
                  <el-input
                    v-model="formItem.pName"
                    disabled
                    size="small"
                    style="vertical-align: top"
                  >
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="功能类型">
                  <el-select
                    v-model="formItem.menuType"
                    prop="menuType"
                    style="width: 100%"
                    @change="changeType"
                    size="small"
                  >
                    <el-option
                      v-for="item in formItem_type_data"
                      :value="item.value"
                      :key="item.value"
                      :label="item.label"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="状态" prop="status">
                  <el-select
                    v-model="formItem.status"
                    prop="menuType"
                    style="width: 100%"
                    size="small"
                  >
                    <el-option
                      v-for="item in menuStatus"
                      :value="item.value"
                      :key="item.value"
                      :label="item.label"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12" v-if="formItem.menuType === '5'">
                <el-form-item label="服务路径" prop="connName">
                  <el-input
                    v-model="formItem.connName"
                    placeholder="请输入"
                    size="small"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12" v-if="formItem.menuType === '5'">
                <el-form-item label="程序集" prop="menuUrl">
                  <el-input
                    v-model="formItem.menuUrl"
                    placeholder="请输入"
                    size="small"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="菜单名称" prop="menuLabel">
                  <el-input
                    v-model="formItem.menuLabel"
                    placeholder="请输入"
                    size="small"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12" v-if="formItem.menuType === '5'">
                <el-form-item label="窗口类" prop="menuCode">
                  <el-input
                    v-model="formItem.menuCode"
                    placeholder="请输入"
                    size="small"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24" v-if="formItem.menuType === '5'">
                <el-form-item label="自定义参数" prop="customInfo">
                  <el-input
                    v-model="formItem.customInfo"
                    placeholder="请输入"
                    size="small"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  label="主页"
                  prop="loginDispaly"
                  v-if="formItem.menuType === '4'"
                >
                  <el-checkbox v-model="formItem.mainPage"></el-checkbox>
                  <!-- <el-select
                                        v-model="formItem.loginDispaly"
                                        placeholder="请选择"
                                        size="small"
                                    >
                                        <el-option
                                            key="1"
                                            label="是"
                                            value="1"
                                        ></el-option>
                                        <el-option
                                            key="0"
                                            label="否"
                                            value="0"
                                        ></el-option>
                                    </el-select> -->
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  label="菜单图标"
                  v-if="formItem.menuType === '1' && !formItem.pId"
                  prop="menuIcon"
                >
                  <!-- <el-input v-model="formItem.menuIcon"
                                        placeholder="请输入"
                                        size="small"></el-input> -->
                  <el-select
                    v-model="formItem.menuIcon"
                    placeholder="请选择"
                    size="small"
                  >
                    <el-option
                      v-for="item in icons"
                      :key="item.icon"
                      :label="item.value"
                      :value="item.value"
                    >
                      <span style="float: left"
                        ><i class="xs-menu-icons" :class="item.value"></i
                      ></span>
                      <span style="float: left; margin-left: 20px">{{
                        item.value
                      }}</span>
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <!--
                        <el-col :span="12">
                            <el-form-item label="控件编号"
                                        prop="privilege">
                            <el-input v-model="formItem.privilege"
                                        :disabled="Number(formItem.menuType) !== 2"
                                        placeholder="请输入"
                                        size="small"></el-input>
                            </el-form-item>
                        </el-col>                         -->
              <!-- <el-col :span="12">
                            <el-form-item label="同级排序"
                                        prop="seq">
                            <el-input v-model="formItem.seq"
                                        placeholder="请输入"
                                        size="small"></el-input>
                            </el-form-item>
                        </el-col> -->
            </el-row>
            <el-form-item
              label="URL"
              v-if="formItem.menuType === '4'"
              prop="menuUrl"
            >
              <el-input
                v-model="formItem.menuUrl"
                type="textarea"
                :autosize="{ minRows: 3, maxRows: 5 }"
                placeholder="请输入"
                style="width: 100%"
              ></el-input>
            </el-form-item>

            <!-- <el-form-item label="备注"
                                    prop="menuTip">
                        <el-input v-model="formItem.menuTip"
                                    type="textarea"
                                    :autosize="{minRows: 3,maxRows: 5}"
                                    placeholder="请输入"
                                    style="width:100%"></el-input>
                        </el-form-item> -->
            <!-- <el-tag
                            :key="index"
                            v-for="(item, index) in functionTable"
                            closable
                            :disable-transitions="false"
                            @click.native="editFncMenu(item,index)"
                            @close="handleClose(item.id, index)">
                            {{item.menuLabel}}
                        </el-tag>
                        <el-button class="button-new-tag" size="small" @click="functionVis = true">+ 添加功能</el-button> -->
            <el-form-item v-show="operateStatus === 'edit'">
              <el-button
                style="float: right"
                :loading="addLoading1"
                type="primary"
                size="small"
                v-privilege="activeMenu + 'EDIT'"
                @click="handleSubmit('formItem')"
                >保存</el-button
              >
            </el-form-item>
            <el-form-item v-show="operateStatus !== 'edit'">
              <el-button
                style="float: right"
                :loading="addLoading2"
                type="primary"
                size="small"
                v-privilege="activeMenu + 'ADD'"
                @click="handleSubmit('formItem')"
                >添加</el-button
              >
            </el-form-item>
          </el-form>
          <el-form>
            <el-button
              @click="addNewFunc"
              v-if="formItem.menuType === '4' || formItem.menuType === '5'"
              size="small"
              type="primary"
              style="margin: 0 0 10px 20px"
              v-privilege="activeMenu + 'FUNADD'"
              >新增功能</el-button
            >
            <el-button
              type="danger"
              v-if="formItem.menuType === '4' || formItem.menuType === '5'"
              size="small"
              style="margin: 0 10px"
              @click="handleClose"
              v-privilege="activeMenu + 'FUNDELETE'"
              >功能删除</el-button
            >
            <!-- <el-checkbox
                            v-model="icoreFilterFlag"
                            @change="changeVal"
                            v-if="formItem.menuType === '4'"
                        >过滤</el-checkbox> -->
            <el-table
              ref="funTable"
              v-if="formItem.menuType === '4' || formItem.menuType === '5'"
              style="
                margin: 0 0 0 20px;
                min-height: 300px;
                width: calc(100% - 40px);
              "
              border
              @icoreFilterChange="icoreFilterChange"
              :icore-filter-flag="icoreFilterFlag"
              :height="funHeight"
              :highlight-current="true"
              :data="functionTable"
              @selection-change="handleSelectionChange"
            >
              <el-table-column type="selection" align="center" width="30">
              </el-table-column>
              <el-table-column
                prop="menuLabel"
                :label="formItem.menuType === '5' ? '名称' : '功能名称'"
                :show-overflow-tooltip="true"
                :key="Math.random()"
                fixed="left"
                align="center"
              >
                <template slot-scope="scope">
                  <span v-if="!scope.row.addEdit">{{
                    scope.row.menuLabel
                  }}</span>
                  <el-input
                    v-else
                    size="mini"
                    v-model="scope.row.menuLabel"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                prop="privilege"
                :show-overflow-tooltip="true"
                :label="formItem.menuType === '5' ? '关键字' : '控件编号'"
                fixed="left"
                :key="Math.random()"
                align="center"
              >
                <template slot-scope="scope">
                  <span v-if="!scope.row.addEdit">{{
                    scope.row.menuCode
                  }}</span>
                  <el-input
                    v-else
                    size="mini"
                    v-model="scope.row.menuCode"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                prop="privilege"
                :show-overflow-tooltip="true"
                :label="formItem.menuType === '5' ? '事件函数' : '后端资源控制'"
                fixed="left"
                :key="Math.random()"
                align="center"
              >
                <template slot-scope="scope">
                  <span v-if="!scope.row.addEdit">{{
                    scope.row.privilege
                  }}</span>
                  <el-input
                    v-else
                    size="mini"
                    v-model="scope.row.privilege"
                    placeholder="由后端提供的资源标识"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                v-if="formItem.menuType === '5'"
                prop="privilege"
                :show-overflow-tooltip="true"
                label="图标"
                fixed="left"
                :key="Math.random()"
                align="center"
              >
                <template slot-scope="scope">
                  <span v-if="!scope.row.addEdit">{{
                    scope.row.menuIcon
                  }}</span>
                  <el-input
                    v-else
                    size="mini"
                    v-model="scope.row.menuIcon"
                    readonly
                    placeholder="请添加图标"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                :label="formItem.menuType === '5' ? '位置' : '操作'"
                type="noFilter"
                :key="Math.random()"
                align="center"
                width="200px"
              >
                <template slot-scope="scope">
                  <el-button
                    type="primary"
                    size="small"
                    v-if="!scope.row.addEdit"
                    @click="editTableRow(scope.row)"
                    style="margin: 0 10px"
                    v-show="editPr"
                    >编辑</el-button
                  >
                  <input
                    type="file"
                    v-if="formItem.menuType === '5'"
                    name="file"
                    :id="'file_headerpic' + scope.$index"
                    @change="getFileName(scope.row, scope.$index, $event)"
                  />
                  <label
                    :for="'file_headerpic' + scope.$index"
                    v-if="formItem.menuType === '5' && scope.row.addEdit"
                    class="el-button el-button--primary el-button--small"
                    >选择图标</label
                  >
                  <el-button
                    type="primary"
                    size="small"
                    style="margin: 0 10px"
                    :loading="buttonLoading"
                    v-if="scope.row.addEdit"
                    @click="addFncMenu(scope.row)"
                    >保存</el-button
                  >
                  <!-- <el-button
                                        type="warning"
                                        size="small"
                                        style="margin:0 10px;"
                                        @click="handleClose(scope.row)"
                                        v-show="delPr"
                                    >删除</el-button> -->
                </template>
              </el-table-column>
            </el-table>
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="用户列表" name="userList">
          <el-table
            ref="userTable"
            v-loading="userTable.loading"
            @filter-change="filterChange"
            border
            :height="treeHeight"
            highlight-current-row
            :data="userTable.list"
          >
            <el-table-column
              :show-overflow-tooltip="true"
              prop="userCode"
              label="账户"
              :filter-method="filterColumn"
              min-width="150"
            ></el-table-column>
            <el-table-column
              :show-overflow-tooltip="true"
              prop="userName"
              label="用户姓名"
              :filter-method="filterColumn"
              min-width="150"
            ></el-table-column>
            <el-table-column
              :show-overflow-tooltip="true"
              prop="orgName"
              label="机构"
              :filter-method="filterColumn"
              min-width="150"
            >
            </el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </div>
    <el-dialog
      title="是否重置菜单顺序"
      :visible.sync="showDelet"
      width="30%"
      center
    >
      <span slot="footer" class="dialog-footer">
        <el-button @click="showDelet = false">取 消</el-button>
        <el-button type="danger" @click="resetSeq">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import store from "@/store/index.js";
import { dgTree, objAssign } from "@/utils/util.js";
import {
  checkCharLength,
  checkCharLength2,
  checkCharNoChinese,
  checkCharNoChinese2,
  checkChar,
  checkChinese,
} from "@/utils/validator.js";
export default {
  data() {
    return {
      companys: [], // 用户公司列表
      companyId: "", // 选择公司Id
      companyName: "", // 选择公司名称
      icoreFilterFlag: false,
      filterText: "",
      store,
      //  操作状态
      operateStatus: "add",
      funHeight: 300,
      treeHeight: 600,
      treeLoading: false,
      addLoading1: false,
      addLoading2: false,
      showDelet: false,
      formItem: {
        id: "",
        pId: "",
        pName: "",
        menuType: "1",
        menuCode: "",
        loginDispaly: "0",
        mainPage: false,
        menuUrl: "",
        menuName: "",
        menuLabel: "",
        status: "1",
        seq: "",
        menuTip: "",
        menuIcon: "",
        privilege: "",
        companyId: "",
        connName: "",
        customInfo: "",
      },
      menuStatus: [
        {
          label: "停用",
          value: "0",
        },
        {
          label: "启用",
          value: "1",
        },
      ],
      icons: [
        {
          icon: "",
          value: "无",
        },
        {
          icon: "icore-icons-menu1",
          value: "icore-icons-menu1",
        },
        {
          icon: "icore-icons-menu2",
          value: "icore-icons-menu2",
        },
        {
          icon: "icore-icons-menu3",
          value: "icore-icons-menu3",
        },
        {
          icon: "icore-icons-menu4",
          value: "icore-icons-menu4",
        },
        {
          icon: "icore-icons-menu5",
          value: "icore-icons-menu5",
        },
        {
          icon: "icore-icons-menu6",
          value: "icore-icons-menu6",
        },
        {
          icon: "icore-icons-menu7",
          value: "icore-icons-menu7",
        },
        {
          icon: "icore-icons-menu8",
          value: "icore-icons-menu8",
        },
      ],
      ruleValidate_formItem: {
        menuCode: [
          { required: true, message: "关键字不能为空", trigger: "change" },
          // { validator: checkCharNoChinese, trigger: "change" },
          // { validator: checkCharLength2, max: 36, trigger: "change" },
        ],
        menuType: [
          { required: true, message: "功能类型不能为空", trigger: "change" },
        ],
        menuName: [
          { required: true, message: "名称不能为空", trigger: "change" },
          { validator: checkCharLength, max: 100, trigger: "change" },
        ],
        menuLabel: [
          { required: true, message: "菜单名称不能为空", trigger: "change" },
          { validator: checkCharLength, max: 240, trigger: "change" },
          { validator: checkChar, trigger: "change" },
        ],
        menuTip: [{ validator: checkCharLength, max: 300, trigger: "change" }],
        menuUrl: [
          { required: true, message: "URL不能为空", trigger: "change" },
          { validator: checkCharLength, max: 255, trigger: "change" },
        ],
        menuIcon: [{ validator: checkCharLength, max: 100, trigger: "change" }],
        status: [
          { required: true, message: "请选择菜单状态", trigger: "change" },
        ],
        privilege: [{ validator: checkCharNoChinese, trigger: "change" }],
        connName: [
          { required: true, message: "系统服务不能为空", trigger: "blur" },
        ],
      },
      fncRule: {
        privilege: [{ validator: checkCharNoChinese, trigger: "change" }],
        menuLabel: [
          { required: true, message: "功能名称不能为空", trigger: "change" },
          { validator: checkCharLength, max: 40, trigger: "change" },
        ],
      },
      formLenMessage: {},
      formItem_type_data: [
        {
          value: "1",
          label: "菜单",
        },
        // {
        //   value: "5",
        //   label: "winForm页面",
        // }
        // {
        //     value: '3',
        //     label: '分割线'
        // }
      ],
      formItem_type_data_nopage: [
        {
          value: "1",
          label: "菜单",
        },
        // {
        //   value: "4",
        //   label: "页面",
        // },
        // {
        //     value: '3',
        //     label: '分割线'
        // }
      ],
      formItem_type_data_havePage: [
        {
          value: "1",
          label: "菜单",
        },
        {
          value: "4",
          label: "web页面",
        },
      ],
      formItem_type_data_noMenu: [
        // {
        //     value: '3',
        //     label: '分割线'
        // },
        {
          value: "4",
          label: "web页面",
        },
      ],
      // el tabs
      activeName: "editForm",
      //  机构树
      orgTree: {
        tree: [],
        items: [],
        item: {},
        //  默认配置数据对应项
        defaultProps: {
          children: "children",
          label: "orgName",
        },
        //  默认展开的ID数组
        expandedKeys: [],
      },
      // 用户列表
      userTable: {
        height: 600,
        loading: false,
        list: [],
        listBack: [],
        //  选中项
        items: [],
        item: {},
        tableParams: JSON.parse(JSON.stringify(store.state.tableParams)),
        menuTreeBack: [],
      },
      functionTable: [],
      defaultFuncTable: [
        {
          pId: "",
          menuType: "2",
          menuLabel: "新增",
          privilege: "ADD",
          status: "1",
          addEdit: false,
        },
        {
          pId: "",
          menuType: "2",
          menuLabel: "查询",
          privilege: "QUERY",
          status: "1",
          addEdit: false,
        },
        {
          pId: "",
          menuType: "2",
          menuLabel: "修改",
          privilege: "PUT",
          status: "1",
          addEdit: false,
        },
        {
          pId: "",
          menuType: "2",
          menuLabel: "删除",
          privilege: "DELETE",
          status: "1",
          addEdit: false,
        },
      ],
      fncFrom: {
        id: "",
        pId: "",
        menuType: "2",
        menuLabel: "",
        privilege: "",
        status: "1",
      },
      multipleSelection: [],
      activeMenu: "",
      activeTree: [],
      buttonLoading: false,
      editPr: false,
      delPr: false,
      expandList: [],
      menuTableData: [],
      options: [],
      appCodeValue: "",
      _formItem: "",
      _formItem_type_data: null,
      winformSelectData: null,
    };
  },
  created() {
    this.activeMenu = window.top.localStorage.getItem("activeMenu");
    this._formItem_type_data = JSON.parse(
      JSON.stringify(this.formItem_type_data)
    );
    this.getEntryListData();
  },
  mounted() {
    // 获取公司信息
    this.companys = JSON.parse(window.top.localStorage.getItem("companys"));
    this.companyId = window.top.localStorage.getItem("companyId");
    if (this.companyId !== "" && this.companyId !== null) {
      this.companyName = this.companys.find(
        (x) => x.id === this.companyId
      ).companyName;
    }
    this.initData();
    //  设置树区域高度
    this.$nextTick(() => {
      this.treeHeight = this.getTreeHeight(this.$refs["menuTree"].$el);
    });
  },
  watch: {
    filterText(val) {
      console.log(val);
      this.$refs.menuTree.filter(val);
    },
    "formItem.mainPage"(n, o) {
      if (n === true) {
        this.formItem.loginDispaly = "1";
      } else {
        this.formItem.loginDispaly = "0";
      }
    },
  },
  computed: {
    //  菜单树数据
    menuTree() {
      let menuTree = this.store.state.system.functionMain.menuTree;
      // 后台接口已根据companyId筛选，页面筛选暂时注释
      // let menuTree = this.companyId !== '' ? this.getTreeAll(_menuTree, this.companyId) : _menuTree;
      return menuTree;
    },
    //  树配置
    defaultProps() {
      return this.store.state.system.functionMain.defaultProps;
    },
    //  展开数组
    expandedKeys: {
      get: function () {
        return this.store.state.system.functionMain.expandedKeys;
      },
      set: function (data) {
        this.store.commit("system/functionMain/expandedKeys", data);
      },
    },
    //  选中节点数据
    menuItem() {
      return this.store.state.system.functionMain.item;
    },
  },
  methods: {
    expandNode(data, node, item) {
      if (this.expandList.indexOf(data.id) === -1) {
        this.expandList.push(data.id);
      }
      this.$nextTick(() => {
        $(".delMenuPr").css(
          "display",
          this.checkPrivilege(this.activeMenu + "MENUDELET")
            ? "inline-block"
            : "none"
        );
        $(".addMenuPr").css(
          "display",
          this.checkPrivilege(this.activeMenu + "MENUADD")
            ? "inline-block"
            : "none"
        );
        $(".upMenuPr").css(
          "display",
          this.checkPrivilege(this.activeMenu + "EDIT")
            ? "inline-block"
            : "none"
        );
        $(".downMenuPr").css(
          "display",
          this.checkPrivilege(this.activeMenu + "EDIT")
            ? "inline-block"
            : "none"
        );
        $(".rightMenuPr").css(
          "display",
          this.checkPrivilege(this.activeMenu + "EDIT")
            ? "inline-block"
            : "none"
        );
        $(".leftMenuPr").css(
          "display",
          this.checkPrivilege(this.activeMenu + "EDIT")
            ? "inline-block"
            : "none"
        );
        $(".nodeOperate").css(
          "display",
          this.checkPrivilege(this.activeMenu + "MENUDELET") ||
            this.checkPrivilege(this.activeMenu + "MENUADD") ||
            this.checkPrivilege(this.activeMenu + "EDIT")
            ? "inline-block"
            : "none"
        );
      });
    },
    expandCollapse(data, node, item) {
      let index = this.expandList.indexOf(data.id);
      if (index !== -1) {
        this.expandList.splice(index, 1);
      }
    },
    handleDragEnd(draggingNode, dropNode, dropType, ev) {
      let that = this;
      console.log("tree drag end: ", dropNode && dropNode.label, dropType);
      console.log("tree draggingNode: ", draggingNode);
      console.log("tree dropNode: ", dropNode);
      console.log("tree dropType: ", dropType);
      console.log("tree ev: ", ev);
      let a = dropNode.data && dropNode.data.menuType === "4";
      let b = draggingNode.data && draggingNode.menuType !== "1";
      let c = draggingNode.data && draggingNode.menuType === "4";
      if (draggingNode.data.children) {
        that.$message.error("含有子菜单的节点不允许直接拖动");
        that.initData();
      } else if (draggingNode.data.menuType === "2") {
        that.$message.error("功能菜单不允许拖拽");
        that.initData();
      } else if (dropType === "inner" && a) {
        that.$message.error("菜单不能移动到页面下");
        that.initData();
      } else if (
        c &&
        dropNode.level === 1 &&
        (dropType === "after" || dropType === "before")
      ) {
        that.$message.error("页面不允许移动到顶层");
        that.initData();
      } else {
        let changeList = [draggingNode.data, dropNode.data];
        this.store
          .dispatch("system/functionMain/dragMenu", {
            dropType: dropType,
            changeList: changeList,
          })
          .then((res) => {
            if (res.code === "0") {
              this.$message.success("移动成功");
            } else {
              this.$message({ message: res.message, type: "error" });
            }
          });
      }
    },
    handleDragStart(draggingNode, dropNode, dropType, ev) {
      this.menuTreeBack = this.menuTree;
    },
    // 下拉选择公司
    selectComPany(command) {
      this.companyId = command.id;
      this.companyName = command.companyName;
      this.expandList = [];
      // 刷新获取对应菜单
      this.initData();
    },
    // 遍历树获取相应公司菜单
    getTreeAll(tree, id) {
      let arr = [];
      if (!!tree && tree.length !== 0) {
        tree.forEach((item) => {
          let obj = {};
          obj = { ...item };
          if (obj.hasOwnProperty("companyId") && obj.companyId === id) {
            obj.children = this.getTreeAll(item.children);
            arr.push(obj);
          }
        });
      }
      return arr;
    },
    // 节点上移
    nodeUp(node, data) {
      let that = this;
      let children = node.parent.childNodes;
      if (node === children[0]) {
        that.$message.error("已移至当前顶级，无法继续上移");
      } else {
        let node2 = {};
        for (let i = 0; i < children.length; i++) {
          if (node === children[i]) {
            node2 = children[i - 1];
          }
        }
        let changeList = [node.data, node2.data];
        this.store
          .dispatch("system/functionMain/dragMenu", {
            dropType: "before",
            changeList: changeList,
          })
          .then((res) => {
            if (res.code === "0") {
              this.$refs["menuTree"].remove(node.data.id);
              this.$refs["menuTree"].insertBefore(node.data, node2.data);
              this.$message.success("上移成功");
            } else {
              this.$message({ message: res.message, type: "error" });
            }
          });
      }
    },
    // 节点下移
    nodeDown(node, data) {
      let that = this;
      let children = node.parent.childNodes;
      let index = children.length;
      if (node === children[index - 1]) {
        that.$message.error("已移至当前底级，无法继续下移");
      } else {
        let node2 = {};
        for (let i = 0; i < children.length; i++) {
          if (node === children[i]) {
            node2 = children[i + 1];
          }
        }
        let changeList = [node.data, node2.data];
        this.store
          .dispatch("system/functionMain/dragMenu", {
            dropType: "after",
            changeList: changeList,
          })
          .then((res) => {
            if (res.code === "0") {
              this.$refs["menuTree"].remove(node.data.id);
              this.$refs["menuTree"].insertAfter(node.data, node2.data);
              this.$message.success("下移成功");
            } else {
              this.$message({ message: res.message, type: "error" });
            }
          });
      }
    },
    // 节点右移
    nodeRight(node, data) {
      let that = this;
      let children = node.parent.childNodes;
      if (node.level === 1 && node === children[0]) {
        that.$message.error("顶级第一个菜单不可降级！");
      } else if (children.length <= 1) {
        that.$message.error("此节点无同级节点以供降级！");
      } else if (children.length > 1) {
        let node2 = {};
        if (node === children[0]) {
          that.$message.error(
            "此节点位于同级中第一个，若要降级请先调整此节点顺序!"
          );
        } else {
          for (let i = 0; i < children.length; i++) {
            if (node === children[i]) {
              if (children[i - 1].data.menuType === "4") {
                that.$message.error("此菜单前为页面，无法将菜单降至页面中！");
              } else {
                node2 = children[i - 1];
                if (node2.hasOwnProperty("data")) {
                  // for (let j = 0; j < node2.data.children.length; j++){
                  //     if (node.data.menuLabel === node2.data.children[j].menuLabel) {
                  //         that.$message.error(node2.data.menuLabel + '中已有同名菜单！')
                  //     } else {
                  let changeList = [node.data, node2.data];
                  this.store
                    .dispatch("system/functionMain/dragMenu", {
                      dropType: "right",
                      changeList: changeList,
                    })
                    .then((res) => {
                      if (res.code === "0") {
                        this.$refs["menuTree"].remove(node.data.id);
                        this.$refs["menuTree"].append(node.data, node2.data);
                        this.$message.success("已降至前一个同级菜单中");
                      } else {
                        this.$message({ message: res.message, type: "error" });
                      }
                    });
                  //     }
                  // }
                } else {
                  that.$message.error(
                    "未定义情景，请联系管理员添加前端右移逻辑代码！"
                  );
                }
              }
            }
          }
        }
      }
    },
    // 节点左移
    nodeLeft(node, data) {
      let that = this;
      if (node.data.menuType === "4" && node.parent.level === 1) {
        that.$message.error("页面不允许升至顶层");
      } else {
        let node2 = {};
        node2 = node.parent;
        if (node2.hasOwnProperty("data")) {
          // for (let i = 0; i < node2.parent.childNodes.length; i++) {
          //     if (node.data.menuLabel === node2.parent.childNodes[i].data.menuLabel) {
          //         that.$message.error(node.data.menuLabel + '同级中已有同名菜单');
          //     } else {
          let changeList = [node.data, node2.data];
          this.store
            .dispatch("system/functionMain/dragMenu", {
              dropType: "left",
              changeList: changeList,
            })
            .then((res) => {
              if (res.code === "0") {
                this.$refs["menuTree"].remove(node.data.id);
                this.$refs["menuTree"].insertAfter(node.data, node2.data);
                this.$message.success("已升至当前父菜单同级");
              } else {
                this.$message({ message: res.message, type: "error" });
              }
            });
          //     }
          // }
        } else {
          that.$message.error("未定义情景，请联系管理员添加前端左移逻辑代码！");
        }
      }
    },
    handleCommand(command) {
      let that = this,
        str = command.str,
        node = command.node,
        data = command.data;
      switch (str) {
        case "add":
          that.addTreeNode(node, data);
          break;
        case "delete":
          that.delTreeNode(node, data);
          break;
        case "up":
          that.nodeUp(node, data);
          break;
        case "down":
          that.nodeDown(node, data);
          break;
        case "left":
          that.nodeLeft(node, data);
          break;
        case "right":
          that.nodeRight(node, data);
          break;
      }
    },
    initData() {
      //  查询列表
      this.treeLoading = true;
      this.store
        .dispatch("system/functionMain/menuTree", {
          companyId: this.companyId,
          appId: this.appCodeValue,
        })
        .then((res) => {
          if (res.code === "0") {
            new Promise((resolve, reject) => {
              this.store.commit("system/functionMain/menuTree", res.data);
              resolve();
            }).then((res) => {
              if (this.operateStatus === "add" && this.functionTable.length) {
                this.menuTree.forEach((item) => {
                  if (item.children) {
                    item.children.forEach((itemChildren) => {
                      if (itemChildren.funChildren) {
                        itemChildren.funChildren.forEach((itemChildrenStep) => {
                          this.functionTable.forEach((functionTableItem) => {
                            if (
                              itemChildrenStep.pId === functionTableItem.pId &&
                              itemChildrenStep.privilege ===
                                functionTableItem.privilege
                            ) {
                              functionTableItem.id = itemChildrenStep.id;
                            }
                          });
                        });
                      }
                    });
                  }
                });
              } else {
                console.log(this.functionTable);
              }
            });
            this.store.commit(
              "system/functionMain/expandedKeys",
              this.expandList
            );
            this.menuTableData = this.upToTableData(res.data, "", []);
            this.$nextTick(() => {
              $(".delMenuPr").css(
                "display",
                this.checkPrivilege(this.activeMenu + "MENUDELET")
                  ? "inline-block"
                  : "none"
              );
              $(".addMenuPr").css(
                "display",
                this.checkPrivilege(this.activeMenu + "MENUADD")
                  ? "inline-block"
                  : "none"
              );
              $(".upMenuPr").css(
                "display",
                this.checkPrivilege(this.activeMenu + "EDIT")
                  ? "inline-block"
                  : "none"
              );
              $(".downMenuPr").css(
                "display",
                this.checkPrivilege(this.activeMenu + "EDIT")
                  ? "inline-block"
                  : "none"
              );
              $(".rightMenuPr").css(
                "display",
                this.checkPrivilege(this.activeMenu + "EDIT")
                  ? "inline-block"
                  : "none"
              );
              $(".leftMenuPr").css(
                "display",
                this.checkPrivilege(this.activeMenu + "EDIT")
                  ? "inline-block"
                  : "none"
              );
              $(".nodeOperate").css(
                "display",
                this.checkPrivilege(this.activeMenu + "MENUDELET") ||
                  this.checkPrivilege(this.activeMenu + "MENUADD") ||
                  this.checkPrivilege(this.activeMenu + "EDIT")
                  ? "inline-block"
                  : "none"
              );
            });
            this.treeLoading = false;
          } else {
            this.$message({ message: res.message, type: "error" });
            this.treeLoading = false;
          }
        });
      this.getOrg();
    },
    //  点击树事件
    nodeClick(item, el) {
      let that = this;
      this.icoreFilterFlag = false;
      //  放入
      this.store.commit("system/functionMain/item", item);
      //  加入
      this.formItem = objAssign(this.formItem, item);
      this._formItem = objAssign(this.formItem, item);
      this.formItem.pName = el.parent.label;

      //  点击时为编辑状态
      this.operateStatus = "edit";
      if (this.activeName === "userList") {
        this.getMenuUser(item);
      }
      if (item.menuType === "4") {
        this.$nextTick(() => {
          this.funHeight = this.getTreeHeight(this.$refs["funTable"].$el) - 70;
          this.icoreFilterFlag = true;
        });
      }
      // 判断菜单下是否有页面
      let havPage = this.checkHavePage(item);
      if (item.funChildren) {
        let arr = [];
        for (let i = 0; i < item.funChildren.length; i++) {
          item.funChildren[i].addEdit = false;
          arr.push(item.funChildren[i]);
        }
        this.functionTable = arr;
        this.$nextTick(() => {
          this.editPr = this.checkPrivilege(this.activeMenu + "FUNEDIT");
          this.delPr = this.checkPrivilege(this.activeMenu + "FUNDELETE");
        });
      } else {
        this.functionTable = [];
      }
      if (item.menuType === "1" && havPage) {
        this.formItem_type_data = this.formItem_type_data_nopage;
      } else if (item.menuType === "4") {
        this.formItem_type_data = this.formItem_type_data_noMenu;
      } else {
        if (this.operateStatus === "edit") {
          this.formItem_type_data = [
            {
              value: "5",
              label: "winForm页面",
            },
          ];
        } else {
          this.formItem_type_data = this.formItem_type_data_havePage;
        }
      }
      if (this.formItem.loginDispaly === "1") {
        this.formItem.mainPage = true;
      } else {
        this.formItem.mainPage = false;
      }
    },
    //  清空 清空为添加，添加直接添加顶级目录
    handleReset(name) {
      this.$refs[name].resetFields();
      this.operateStatus = "add";
      this.formItem.loginDispaly = "0";
      this.formItem.mainPage = false;
      this.formItem.pId = "";
      this.formItem_type_data = [
        {
          value: "1",
          label: "菜单",
        },
        // {
        //   value: "5",
        //   label: "winForm页面",
        // }
        // {
        //     value: '3',
        //     label: '分割线'
        // }
      ];
      // 默认为菜单
      this.formItem.menuType = "1";
    },
    //  添加点击
    addTreeNode(node, item) {
      this.operateStatus = "add";
      this.$refs["formItem"].resetFields();
      this.formItem_type_data = [
        {
          value: "1",
          label: "菜单",
        },
        {
          value: "5",
          label: "winForm页面",
        },
        {
          value: "4",
          label: "web页面",
        },
      ];
      //  设置pId为当前ID
      this.formItem.pId = item.menuId;
      this.formItem.pName = item.menuLabel;
      //  清空ID
      this.formItem.id = "";
      this.formItem.menuUrl = "";
      this.formItem.menuLabel = "";
      this.formItem.loginDispaly = "0";
      this.formItem.mainPage = false;
      this.formItem.menuCode = "";
      // 添加默认功能菜单
      let arr = [];
      for (let i = 0; i < this.defaultFuncTable.length; i++) {
        arr.push(this.defaultFuncTable[i]);
      }
      this.functionTable = arr;
    },
    //  计算树区域高度
    getTreeHeight(dom) {
      return window.innerHeight - dom.offsetTop;
    },
    // renderContent (h, { node, data, store }) {
    //     let render = [];
    //     //   let prl = this.$store.state.ownPrivilege;
    //     //   while (prl.length === 0) {
    //     //     continue;
    //     //   }
    //     if (data.menuType === '1') {
    //         render = [
    //             h('span', {
    //                 class: 'el-icon-delete icore-icon-size delMenuPr',
    //                 attrs: {
    //                     title: '删除'
    //                 },
    //                 on: {
    //                     click: (event) => {
    //                         this.delTreeNode(node, data);
    //                         event.stopPropagation();
    //                     }
    //                 }
    //             })
    //         ];
    //         //  如果是菜单增加 添加按钮
    //         render = [h('span', {
    //             class: 'el-icon-plus icore-icon-size addMenuPr',
    //             attrs: {
    //                 title: '添加'
    //             },
    //             on: {
    //                 click: (event) => {
    //                     this.addTreeNode(node, data);
    //                     event.stopPropagation();
    //                     this.formItem_type_data = this.formItem_type_data_havePage;
    //                 }
    //             }
    //         })].concat(render);
    //         //  如果是菜单下移 下箭头按钮
    //         render = [h('span', {
    //             class: 'el-icon-download icore-icon-size downMenuPr',
    //             attrs: {
    //                 title: '下移'
    //             },
    //             on: {
    //                 click: (event) => {
    //                     this.nodeDown(node, data);
    //                     event.stopPropagation();
    //                 }
    //             }
    //         })].concat(render);
    //         //  如果是菜单上移 上箭头按钮
    //         render = [h('span', {
    //             class: 'el-icon-upload2 icore-icon-size upMenuPr',
    //             attrs: {
    //                 title: '上移'
    //             },
    //             on: {
    //                 click: (event) => {
    //                     this.nodeUp(node, data);
    //                     event.stopPropagation();
    //                 }
    //             }
    //         })].concat(render);
    //         if (node.level > 1) {
    //             //  降到下一级
    //             render = [h('span', {
    //                 class: 'el-icon-right icore-icon-size rightMenuPr',
    //                 attrs: {
    //                     title: '降至后一级菜单'
    //                 },
    //                 on: {
    //                     click: (event) => {
    //                         this.nodeRight(node, data);
    //                         event.stopPropagation();
    //                     }
    //                 }
    //             })].concat(render);
    //             //  升到上一级
    //             render = [h('span', {
    //                 class: 'el-icon-back icore-icon-size leftMenuPr',
    //                 style: "font-size: 16px;",
    //                 attrs: {
    //                     title: '升至前一级菜单'
    //                 },
    //                 on: {
    //                     click: (event) => {
    //                         this.nodeLeft(node, data);
    //                         event.stopPropagation();
    //                     }
    //                 }
    //             })].concat(render);
    //         }
    //     } else {
    //         render = [
    //             h('span', {
    //                 class: 'el-icon-delete icore-icon-size delMenuPr',
    //                 attrs: {
    //                     title: '删除'
    //                 },
    //                 on: {
    //                     click: (event) => {
    //                         this.delTreeNode(node, data);
    //                         event.stopPropagation();
    //                     }
    //                 }
    //             })
    //         ].concat(render);
    //         //  页面下移 下箭头按钮
    //         render = [h('span', {
    //             class: 'el-icon-download icore-icon-size downMenuPr',
    //             attrs: {
    //                 title: '下移'
    //             },
    //             on: {
    //                 click: (event) => {
    //                     this.nodeDown(node, data);
    //                     event.stopPropagation();
    //                 }
    //             }
    //         })].concat(render);
    //         //  页面上移 上箭头按钮
    //         render = [h('span', {
    //             class: 'el-icon-upload2 icore-icon-size upMenuPr',
    //             attrs: {
    //                 title: '上移'
    //             },
    //             on: {
    //                 click: (event) => {
    //                     this.nodeUp(node, data);
    //                     event.stopPropagation();
    //                 }
    //             }
    //         })].concat(render);
    //         if (node.level > 1) {
    //             //  降到下一级
    //             render = [h('span', {
    //                 class: 'el-icon-right icore-icon-size rightMenuPr',
    //                 attrs: {
    //                     title: '降至后一级菜单'
    //                 },
    //                 on: {
    //                     click: (event) => {
    //                         this.nodeRight(node, data);
    //                         event.stopPropagation();
    //                     }
    //                 }
    //             })].concat(render);
    //             //  升到上一级
    //             render = [h('span', {
    //                 class: 'el-icon-back icore-icon-size leftMenuPr',
    //                 style: "font-size: 16px;",
    //                 attrs: {
    //                     title: '升至前一级菜单'
    //                 },
    //                 on: {
    //                     click: (event) => {
    //                         this.nodeLeft(node, data);
    //                         event.stopPropagation();
    //                     }
    //                 }
    //             })].concat(render);
    //         }
    //     }
    //     return h('span',
    //         {
    //             style: {
    //                 position: 'relative',
    //                 width: '100%',
    //                 fontSize: '14px'
    //             },
    //             class: 'fun-st-ellipsis'
    //         },
    //         [
    //             h('span', node.label),
    //             h('span', {
    //                 style: {
    //                     position: 'absolute',
    //                     right: '0px'
    //                 }
    //             }, render)
    //         ]);
    // },
    /**
     * 删除树节点元素
     */
    delTreeNode(node, data) {
      if (
        (data.children && data.children.length > 0) ||
        (node.childNodes && node.childNodes.length > 0) ||
        (data.funChildren && data.funChildren.length > 0) ||
        (node.funChildren && node.funChildren.length > 0)
      ) {
        this.$message.error("此节点有子节点或者功能，不允许直接删除");
        return false;
      }
      //
      this.$confirm("确定要删除已选择的记录吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.store
            .dispatch("system/functionMain/delMenu", data.id)
            .then((res) => {
              if (res.code === "0") {
                this.$message.success("删除成功");
                //  更新树
                this.handleReset("formItem");
                this.$refs["menuTree"].remove(data.id);
                this.initData();
              } else {
                this.$message.error(res.message);
              }
            });
        })
        .catch(() => {
          this.$message.info("已取消操作");
        });
    },
    /**
     * 保存数据
     * */
    handleSubmit(name) {
      for (let k in this.formItem) {
        let re = (re =
          /(select\s)|(update\s)|(delete\s)|(exec\s)|(count\s)|(or\s)|'|"|;|>|<|%/i);
        if (re.test(this.formItem[k])) {
          this.$message.error("输入内容中包含sql指令, 请重新输入");
          return false;
        }
      }
      this.$refs[name].validate((valid) => {
        if (valid) {
          if (this.formItem.menuIcon === "无") {
            this.formItem.menuIcon = "";
          }
          this.formItem.companyId = this.companyId;
          this.formItem.appId = this.appCodeValue;
          if (this.operateStatus === "edit") {
            if (!this.formItem.id) {
              this.$message.error("请选择数据再来操作");
              return;
            }
            this.$confirm("确定要修改已选择的记录吗？", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            })
              .then(() => {
                //  修改数据
                this.addLoading1 = true;
                //
                this.store
                  .dispatch("system/functionMain/editMenu", {
                    id: this.menuItem.id,
                    form: this.formItem,
                  })
                  .then((res) => {
                    //
                    this.addLoading1 = false;
                    //
                    if (res.code === "0") {
                      this.$message.success("保存成功");
                      //
                      this.formItem = objAssign(this.formItem, res.data);
                      //  更新菜单项
                      dgTree(this.menuTree, "children", (item) => {
                        if (item.id === this.formItem.id) {
                          item.id = this.formItem.id;
                          item.pId = this.formItem.pId;
                          item.menuType = this.formItem.menuType;
                          item.menuCode = this.formItem.menuCode;
                          item.menuUrl = this.formItem.menuUrl;
                          item.menuName = this.formItem.menuName;
                          item.menuLabel = this.formItem.menuLabel;
                          item.status = this.formItem.status;
                          item.menuTip = this.formItem.menuTip;
                          item.menuIcon = this.formItem.menuIcon;
                        }
                      });
                      this.initData();
                      this.$refs["menuTree"].setCurrentKey(res.data.id);
                    } else {
                      this.$message({ message: res.message, type: "error" });
                    }
                  });
              })
              .catch(() => {
                this.$message({
                  type: "info",
                  message: "已取消操作",
                });
              });
          } else if (this.operateStatus === "add") {
            //   添加
            this.addLoading2 = true;
            //
            this.store
              .dispatch("system/functionMain/addMenu", this.formItem)
              .then((res) => {
                //
                this.addLoading2 = false;
                //
                if (res.code === "0") {
                  this.$message.success("添加成功");
                  //  更新树
                  this.$refs["menuTree"].append(res.data, this.formItem.pId);
                  this.$refs["menuTree"].setCurrentKey(res.data.id);
                  this.$nextTick(() => {
                    $(".delMenuPr").css(
                      "display",
                      this.checkPrivilege(this.activeMenu + "MENUDELET")
                        ? "inline-block"
                        : "none"
                    );
                    $(".addMenuPr").css(
                      "display",
                      this.checkPrivilege(this.activeMenu + "MENUADD")
                        ? "inline-block"
                        : "none"
                    );
                    $(".upMenuPr").css(
                      "display",
                      this.checkPrivilege(this.activeMenu + "EDIT")
                        ? "inline-block"
                        : "none"
                    );
                    $(".downMenuPr").css(
                      "display",
                      this.checkPrivilege(this.activeMenu + "EDIT")
                        ? "inline-block"
                        : "none"
                    );
                    $(".rightMenuPr").css(
                      "display",
                      this.checkPrivilege(this.activeMenu + "EDIT")
                        ? "inline-block"
                        : "none"
                    );
                    $(".leftMenuPr").css(
                      "display",
                      this.checkPrivilege(this.activeMenu + "EDIT")
                        ? "inline-block"
                        : "none"
                    );
                    $(".nodeOperate").css(
                      "display",
                      this.checkPrivilege(this.activeMenu + "MENUDELET") ||
                        this.checkPrivilege(this.activeMenu + "MENUADD") ||
                        this.checkPrivilege(this.activeMenu + "EDIT")
                        ? "inline-block"
                        : "none"
                    );
                  });
                  this.initData();
                  if (res.data.menuType === "4" || res.data.menuType === "5") {
                    this.addNewFunctionMain(res.data.id);
                  }
                } else {
                  this.$message({ message: res.message, type: "error" });
                }
              });
          }
        }
      });
    },
    // 树形控件过滤数据
    filterOrgTree(value, data) {
      if (!value) return true;
      return data.menuLabel.indexOf(value) !== -1;
    },
    // 重置菜单顺序
    resetSeq() {
      let that = this;
      that.axios
        .get("/pass/v1/sysmenus/resetSeq")
        .then(function (res) {
          if (res.code === "0") {
            that.$message.success("重置菜单排序成功");
            that.initData();
            that.showDelet = false;
          } else {
            that.$message.error(res.message);
            that.showDelet = false;
          }
        })
        .catch(function () {
          // do some thing
        });
    },
    // 用户过滤
    filterChange(filters) {
      var _this = this;
      _this.setFilterDatas(
        _this.$refs.userTable.columns,
        _this.$refs.userTable.tableData,
        ["userCode", "userName", "orgName"]
      );
      //   _this.tableParams.page.total = _this.$refs.userTable.tableData.length;
    },
    // 查询机构名称
    getOrgName(list, code) {
      var name = "";
      for (let i = 0; i < list.length; i++) {
        try {
          if (list[i].orgCode === code) {
            name = list[i].orgName;
            return name;
          } else if (list[i].children && list[i].children.length >= 1) {
            name = this.getOrgName(list[i].children, code);
            if (name) {
              return name;
            }
          }
        } catch (error) {
          console.log(error);
        }
      }
      return name;
    },
    getOrg() {
      //  查询机构树
      this.store.dispatch("system/organizManage/tree").then((res) => {
        if (res.code === "0") {
          dgTree(res.data, "children", (item) => {
            if ("children" in item && item.children.length < 1) {
              delete item.children;
            }
          });
          this.orgTree.tree = res.data;
          this.getUser(this.userTable.tableParams.form);
        } else {
          this.$message.error(res.message);
        }
      });
    },
    // 获取用户列表
    getUser(form) {
      let _this = this;
      form.pageSize = "1000000";
      this.store.dispatch("system/usersManage/list", form).then((res) => {
        if (res.code === "0") {
          this.userTable.list = res.data.list;
          this.userTable.listBack = res.data.list;
          this.userTable.tableParams.form.pageNum = res.data.pageNum;
          this.userTable.tableParams.form.pageSize = res.data.pageSize;
          this.userTable.tableParams.page.total = res.data.total;
          for (let a = 0; a < this.userTable.list.length; a++) {
            this.userTable.list[a].orgName = this.getOrgName(
              this.orgTree.tree,
              this.userTable.list[a].orgCode
            );
            this.userTable.listBack[a].orgName = this.getOrgName(
              this.orgTree.tree,
              this.userTable.list[a].orgCode
            );
          }
          // 设置过滤数据 setFilterDatas(列数组对象, 数据, 需要过滤的字段, 列名转义对象)
          _this.setFilterDatas(
            _this.$refs.userTable.columns,
            _this.userTable.list,
            ["userCode", "userName", "orgName"]
          );
        } else {
          this.$message.error(res.message);
          this.userTable.tableParams.form.pageNum = 1;
          this.userTable.tableParams.page.total = 0;
        }
      });
    },
    // 获取指定菜单下用户列表
    getMenuUser(item) {
      let that = this;
      that.axios
        .get(
          "pass/v1/sysuserroles/selectByMenuId/" +
            item.id +
            "?companyId=" +
            this.companyId +
            "&pageNum=1&pageSize=10000"
        )
        .then((res) => {
          if (res.code === "0") {
            that.userTable.list = res.data.list;
            for (let i = 0; i < that.userTable.listBack.length; i++) {
              for (let j = 0; j < that.userTable.list.length; j++) {
                if (
                  that.userTable.listBack[i].userCode ===
                  that.userTable.list[j].userCode
                ) {
                  that.userTable.list[j].userName =
                    that.userTable.listBack[i].userName;
                  that.userTable.list[j].orgName =
                    that.userTable.listBack[i].orgName;
                }
              }
            }
            if (res.data.length === 0) {
              that.$refs.userTable.columns[0].filters = [];
              that.$refs.userTable.columns[1].filters = [];
              that.$refs.userTable.columns[2].filters = [];
            }
            that.setFilterDatas(that.$refs.userTable.columns, res.data, [
              "userCode",
              "userName",
              "orgName",
            ]);
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((error) => {
          console.log(error);
        });
    },
    changeType(val) {
      if (val !== 2) {
        this.formItem.privilege = "";
      }
      if (val === "4") {
        this.$nextTick(() => {
          this.funHeight = this.getTreeHeight(this.$refs["funTable"].$el) - 70;
        });
      }
      if (val === "5") {
        if (this.operateStatus === "add") {
          this.formItem.menuUrl = "";
          this.formItem.menuName = "";
          this.formItem.menuLabel = "";
          this.formItem.menuCode = "";
        } else {
          this.formItem = objAssign(this.formItem, this._formItem);
        }
      }
    },
    // 新增多个功能菜单
    addNewFunctionMain(id) {
      let that = this;
      for (let i = 0; i < this.functionTable.length; i++) {
        this.functionTable[i].pId = id;
        this.functionTable[i].appId = this.appCodeValue;
        this.functionTable[i]["companyId"] = this.companyId;
      }
      that.axios
        .put("pass/v1/sysmenus/bathInsert", JSON.stringify(that.functionTable))
        .then((res) => {
          if (res.code === "0") {
            // do some thing
            that.initData();
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((error) => {
          that.$message.error(error);
        });
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    // 删除菜单
    handleClose() {
      let that = this;
      if (this.multipleSelection.length > 0) {
        this.$confirm("确定要删除已选择的记录吗？", "提示", {
          customClass: "org-Manage-changeprimaryforbutton",
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            for (let row of this.multipleSelection) {
              let index = that.getRowIndex(row.privilege, 2);
              if (row.id && row.id !== "") {
                this.store
                  .dispatch("system/functionMain/delMenu", row.id)
                  .then((res) => {
                    if (res.code === "0") {
                      // 异步获取index
                      index = that.getRowIndex(row.privilege, 2);
                      that.functionTable.splice(index, 1);
                      if (index === this.multipleSelection.length - 1) {
                        this.$message.success("删除成功");
                        this.initData();
                      }
                    } else {
                      this.$message.error(res.message);
                    }
                  });
              } else {
                that.functionTable.splice(index, 1);
                if (index === this.multipleSelection.length - 1) {
                  this.$message.success("删除成功");
                  this.initData();
                }
              }
            }
          })
          .catch(() => {
            this.$message.info("已取消操作");
          });
        this.$nextTick(() => {
          document
            .getElementsByClassName("org-Manage-changeprimaryforbutton")[0]
            .getElementsByClassName("el-message-box__btns")[0]
            .getElementsByTagName("button")[0]
            .classList.add("el-button--primary");
          document
            .getElementsByClassName("org-Manage-changeprimaryforbutton")[0]
            .getElementsByClassName("el-message-box__btns")[0]
            .getElementsByTagName("button")[1]
            .classList.remove("el-button--primary");
        });
      } else {
        this.$message.warning("当前未选中任何功能控件！");
      }
    },
    addFncMenu(row) {
      row["companyId"] = this.companyId;
      this.buttonLoading = true;
      try {
        let rule = {
          max: 40,
          required: true,
          errName: "功能名称",
        };
        let rule2 = {
          max: 36,
          required: true,
          errName: "控件编号",
        };
        this.checkCharLength(rule, row.menuLabel, "功能名称不能为空");
        this.checkCharLength(rule2, row.privilege, "控件编号不能为空");
        this.checkCharNoChinese(row.privilege);
        if (this.formItem.id) {
          if (!row.id) {
            row.appId = this.appCodeValue;
            this.store
              .dispatch("system/functionMain/addMenu", row)
              .then((res) => {
                this.addLoading2 = false;
                if (res.code === "0") {
                  this.$message.success("添加成功");
                  res.data.addEdit = false;
                  this.functionTable[this.getRowIndex(res.data.privilege, 2)] =
                    res.data;
                  this.initData();
                } else {
                  this.$message({ message: res.message, type: "error" });
                }
              });
          } else {
            this.store
              .dispatch("system/functionMain/editMenu", {
                id: row.id,
                form: row,
              })
              .then((res) => {
                this.addLoading1 = false;
                if (res.code === "0") {
                  this.$message.success("保存成功");
                  this.getRowIndex(res.data);
                  this.initData();
                } else {
                  this.$message({ message: res.message, type: "error" });
                }
              });
          }
        } else {
          let arr = row;
          let idx = this.getRowIndex(row.privilege, 1);
          arr.menuType = "2";
          arr.status = "1";
          arr.addEdit = false;
          this.functionTable[idx] = arr;
        }
      } catch (err) {
        this.$message.error(err.message);
      }
      this.buttonLoading = false;
    },
    editTableRow(row) {
      let that = this;
      if (row.menuId) {
        for (let i = 0; i < that.functionTable.length; i++) {
          if (that.functionTable[i].menuId === row.menuId) {
            that.functionTable[i].addEdit = true;
            that.winformSelectData = that.functionTable[i];
          }
        }
      } else {
        for (let i = 0; i < that.functionTable.length; i++) {
          if (that.functionTable[i].menuLabel === row.menuLabel) {
            that.functionTable[i].addEdit = true;
            that.winformSelectData = that.functionTable[i];
          }
        }
      }
    },
    // 新增一条空数据
    addNewFunc() {
      let obj = {
        id: "",
        pId: this.formItem.id || "",
        menuType: "2",
        menuLabel: "",
        privilege: "",
        status: "1",
        addEdit: true,
      };
      this.functionTable.push(obj);
    },
    // 获取当前编辑行的index
    getRowIndex(data, type) {
      let that = this;
      let index = 0;
      if (!type) {
        for (let i = 0; i < that.functionTable.length; i++) {
          if (that.functionTable[i].id === data.id) {
            data.addEdit = false;
            that.functionTable[i] = data;
            break;
          }
        }
      } else {
        for (let i = 0; i < that.functionTable.length; i++) {
          if (that.functionTable[i].privilege === data) {
            index = i;
            break;
          }
        }
      }
      return index;
    },
    // 校验方法
    checkCharLength(rule, value, msg) {
      if (value) {
        let chineseLen = 3;
        let iLen =
          chineseLen > 1 ? this._charLength(value, chineseLen) : value.length;
        if (rule.min && rule.min > 0 && iLen < rule.min) {
          throw new Error(
            rule.errName +
              "最少输入" +
              rule.min +
              "个字符（一个中文占" +
              chineseLen +
              "个字符）"
          );
        }
        if (rule.max && rule.max > 0 && iLen > rule.max) {
          throw new Error(
            rule.errName +
              "最多输入" +
              rule.max +
              "个字符（一个中文占" +
              chineseLen +
              "个字符）"
          );
        }
      } else {
        if (rule.required) {
          throw new Error(rule.errName + "不能为空");
        }
      }
    },
    checkCharNoChinese(value) {
      let reg = /^[-_a-zA-Z0-9]+$/;
      if (value && !reg.test(value) && this.formItem.menuType !== 5) {
        throw new Error("请输入英文字母、数字、下划线（_）或横线（-）的组合");
      }
    },
    _charLength(str, chineseLen) {
      if (!str || str.length <= 0) {
        return 0;
      }
      // str = mytrim(str);
      let chineseLength = 3; // utf-8编码，中文长度
      if (chineseLen && chineseLen > 0) {
        chineseLength = chineseLen;
      }
      let objValue = str;
      let objLength = 0;
      let compareChar = "";
      let regExp = new RegExp("^[A-Za-z0-9 -_`~!@#$%^&*()-+=|,<.>/?;:'\\\"]$");
      for (let count = 0; count < objValue.length; count++) {
        compareChar = objValue.substring(count, count + 1);
        if (regExp.test(compareChar)) {
          objLength += 1;
        } else if (compareChar === "\\") {
          objLength += 1;
        } else {
          objLength += chineseLength;
        }
      }
      return objLength;
    },
    icoreFilterChange(item) {
      // do something
    },
    checkHavePage(item) {
      let status = false;
      if (item.children) {
        try {
          for (let i = 0; i < item.children.length; i++) {
            if (item.children[i].children && !item.children[i].funChildren) {
              for (let b = 0; b < item.children[i].children.length; b++) {
                status = this.checkHavePage(item.children[i].children);
              }
            } else if (item.children[i].funChildren) {
              status = true;
              break;
            }
          }
        } catch (err) {
          console.log(err);
        }
      } else {
        status = false;
      }
      return status;
    },
    setCheckedKeys() {
      this.defaultExpand = false;
      for (
        var i = 0;
        i < this.$refs.menuTree.store._getAllNodes().length;
        i++
      ) {
        this.$refs.menuTree.store._getAllNodes()[i].expanded =
          this.defaultExpand;
      }
    },
    setCheckedNodes() {
      this.defaultExpand = true; // 展开所有节点
      for (
        var i = 0;
        i < this.$refs.menuTree.store._getAllNodes().length;
        i++
      ) {
        this.$refs.menuTree.store._getAllNodes()[i].expanded =
          this.defaultExpand;
      }
    },
    changeVal(val) {
      this.$nextTick(() => {
        if (!val) {
          let temp = [];
          for (let i = 0; i < this.functionTable.length; i++) {
            temp.push(this.functionTable[i]);
          }
          this.functionTable = temp;
        }
      });
    },
    // 将树形数据转为列表
    upToTableData(tree, pName, arr) {
      if (!!tree && tree.length !== 0) {
        tree.forEach((item) => {
          let obj = {};
          obj["菜单名称"] = item.menuLabel;
          if (item.menuType === "1") {
            obj["功能类型"] = "菜单";
          } else {
            obj["功能类型"] = "页面";
          }
          obj["父菜单"] = pName ? pName : "";
          if (item.status === "1") {
            obj["状态"] = "启用";
          } else {
            obj["状态"] = "停用";
          }
          obj["菜单图标"] = item.menuIcon ? item.menuIcon : "";
          obj["URL"] = item.menuUrl === null ? "" : item.menuUrl;
          if (item.funChildren && item.funChildren.length > 0) {
            let str = "";
            for (let funObj of item.funChildren) {
              if (str === "") {
                str += funObj.menuLabel + "-" + funObj.privilege;
              } else {
                str += "、" + funObj.menuLabel + "-" + funObj.privilege;
              }
            }
            obj["功能控件"] = str;
          } else {
            obj["功能控件"] = "";
          }
          arr.push(obj);
          if (item.children && item.children.length > 0) {
            this.upToTableData(item.children, item.menuLabel, arr);
          }
        });
      }
      return arr;
    },
    // 菜单导出
    menuExport() {
      // if (this.menuTableData.length > 0) {
      //     let et = XLSX.utils.table_to_book(document.getElementById('menuExcel'));
      //     let etout = XLSX.write(et, {
      //         bookType: 'xlsx',
      //         bookSST: true,
      //         type: 'array',
      //         cellStyles: true
      //     });
      //     try {
      //         FileSaver.saveAs(new Blob([etout], {
      //         type: 'application/octet-stream'
      //         }), '系统菜单详情.xlsx');   //导出的文件名
      //         this.$message({
      //             type: 'success',
      //             message: '正在为您导出...'
      //         });
      //     } catch (e) {
      //         console.log(e, etout) ;
      //     }
      //     return etout;
      // } else {
      //     this.$message.error('当前无数据可供导出!');
      // }
      let data = this.menuTableData;
      if (data.length < 1) {
        this.$message.error("当前无数据可供导出!");
        return false;
      }
      // 表格标题
      var dataTitle = "系统菜单详情";
      // 配置文件类型
      const wopts = {
        bookType: "xlsx",
        bookSST: true,
        type: "binary",
        cellStyles: true,
      };
      this.downloadExl(data, wopts, dataTitle);
    },
    downloadExl(json, type, dataTitle) {
      // 设置表格中cell默认的字体，居中，颜色等
      var defaultCellStyle = {
        // font: {
        //     name: "宋体", sz: 11, color: { auto: 1 } ,
        // },
        // border: {
        //     color: { auto: 1 },
        //     top: { style: 'thin' },
        //     bottom: { style: 'thin'},
        //     left: { style: 'thin' },
        //     right: { style: 'thin' }
        // },
        alignment: {
          /// 自动换行
          wrapText: 1,
          // 居中
          // horizontal: "center",
          // vertical: "center",
          // indent: 0
        },
      };
      var tmpdata = json[0];
      json.unshift({});
      var keyMap = []; // 获取keys
      for (var k in tmpdata) {
        keyMap.push(k);
        json[0][k] = k;
      }
      var tmpdata = []; // 用来保存转换好的json
      json
        .map((v, i) => {
          let data = keyMap.map((k, j) => {
            return Object.assign(
              {},
              {
                v: v[k],
                position:
                  (j > 25 ? this.getCharCol(j) : String.fromCharCode(65 + j)) +
                  (i + 2),
              }
            );
          });
          return data;
        })
        .reduce((prev, next) => prev.concat(next))
        .forEach(
          (v, i) =>
            (tmpdata[v.position] = {
              v: v.v,
              s: defaultCellStyle,
            })
        );
      var outputPos = Object.keys(tmpdata); // 设置区域,比如表格从A1到D10
      tmpdata["A1"] = { v: dataTitle };
      outputPos = ["A1"].concat(outputPos);
      tmpdata["A1"].s = {
        font: { sz: 14, bold: true, vertAlign: true },
        alignment: { vertical: "center", horizontal: "center" },
      }; // <====设置xlsx单元格样式  fill: { bgColor: { rgb: "E8E8E8"}, fgColor: { rgb: "E8E8E8" } }
      tmpdata["!merges"] = [
        {
          s: { c: 0, r: 0 },
          e: { c: 6, r: 0 },
        },
      ]; // <====合并单元格
      tmpdata["!cols"] = [
        { wpx: 150 },
        { wpx: 100 },
        { wpx: 150 },
        { wpx: 100 },
        { wpx: 150 },
        { wpx: 400 },
        { wpx: 400 },
      ]; // <====设置一列宽度

      var tmpWB = {
        SheetNames: ["mySheet"], // 保存的表标题
        Sheets: {
          mySheet: Object.assign(
            {},
            tmpdata, // 内容
            {
              "!ref": outputPos[0] + ":" + outputPos[outputPos.length - 1], // 设置填充区域
            }
          ),
        },
      };
      var tmpDown = new Blob(
        [
          this.s2ab(
            XLSX.write(
              tmpWB,
              // 这里的数据是用来定义导出的格式类型
              {
                bookType: type == undefined ? "xlsx" : type.bookType,
                bookSST: false,
                type: "binary",
              },
              { defaultCellStyle: this.defaultCellStyle }
            )
          ),
        ],
        {
          type: "",
        }
      );
      this.saveAs(
        tmpDown,
        "系统菜单详情" +
          "." +
          (type.bookType == "biff2" ? "xls" : type.bookType)
      );
    },
    // 下载功能
    saveAs(obj, fileName) {
      var tmpa = document.createElement("a");
      tmpa.download = fileName || "未命名";
      // 兼容ie
      if ("msSaveOrOpenBlob" in navigator) {
        window.navigator.msSaveOrOpenBlob(obj, "系统菜单详情" + ".xlsx");
      } else {
        tmpa.href = URL.createObjectURL(obj);
      }
      tmpa.click();
      setTimeout(function () {
        URL.revokeObjectURL(obj);
      }, 100);
    },
    // 获取26个英文字母用来表示excel的列
    getCharCol(n) {
      let temCol = "",
        s = "",
        m = 0;
      while (n > 0) {
        m = (n % 26) + 1;
        s = String.fromCharCode(m + 64) + s;
        n = (n - m) / 26;
      }
      return s;
    },
    s2ab(s) {
      if (typeof ArrayBuffer !== "undefined") {
        var buf = new ArrayBuffer(s.length);
        var view = new Uint8Array(buf);
        for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff;
        return buf;
      } else {
        var buf = new Array(s.length);
        for (var i = 0; i != s.length; ++i) buf[i] = s.charCodeAt(i) & 0xff;
        return buf;
      }
    },
    getEntryListData() {
      return this.axios
        .get("pass/v1/sysappclients/like/", { companyId: this.companyId })
        .then((response) => {
          let res = response.data;
          if (response.succeed) {
            this.options = res.list;
          } else {
            this.$message.error(response.message);
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    selectAppCode() {
      this.initData();
    },
    getFileName(row, index, e) {
      let arr = e.target.files[0].name.split("."),
        str = "",
        newArr = [];
      for (let k = 0; k < arr.length - 1; k++) {
        newArr.push(arr[k]);
      }
      str = newArr.join(".");
      this.$set(this.functionTable[index], "menuIcon", str);
    },
  },
};
</script>
<style scoped>
.functionDiv {
  position: relative;
  min-width: 1050px;
}
.MainLeft {
  width: 30%;
  border-right: 1px solid #e0e0e0;
  float: left;
  overflow: hidden;
  height: inherit;
}

.el-tree {
  overflow-x: hidden !important;
}

.el-icon-back:before {
  content: "\E6EA";
}

.custom-tree-node {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  padding-right: 8px;
}

.MainRight {
  width: 70%;
  float: left;
}

.exportButton {
  position: absolute;
  right: 20px;
  top: 10px;
  z-index: 1999;
}

.FormMain {
  margin: 20px 20px;
}

.searchContent {
  margin: 20px 0px 0px 20px;
  text-align: left;
  width: 100%;
}
.public-function-div {
  height: 45px;
  font-size: 16px;
  padding: 10px 15px;
  border-bottom: 1px solid #d5d5d5;
  position: relative;
}
.public-function-div .refresh {
  position: absolute;
  right: 15px;
}
.public-function-div .refresh2 {
  position: absolute;
  right: 80px;
}
.public-function-div ._refresh3 {
  position: absolute;
  right: 145px;
}
.fun-st-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: keep-all;
  padding-right: 60px;
}
.company-select {
  padding: 10px 15px;
  border-bottom: 1px solid #d5d5d5;
}

.el-dropdown {
  font-weight: bold;
  font-size: 14px;
  cursor: pointer;
}
.el-dropdown-menu {
  overflow-y: scroll;
  max-height: 200px;
}
.filterTree {
  width: 95%;
  margin: 10px 2.5%;
}
/** el-tabs **/
/deep/ .el-tabs__item {
  font-size: 16px;
  height: 46px;
  line-height: 46px;
}
/deep/ .el-tabs__nav-scroll {
  padding-left: 20px;
}
#pane-userList {
  padding: 10px;
}
/deep/ .el-select {
  width: 100%;
}
.xs-menu-icons {
  display: inline-block;
  width: 26px;
  height: 26px;
  cursor: pointer;
  transform: scale(0.8);
  background: url(../../../assets/img/menu/menu_b.png) 0 0 no-repeat;
  -webkit-transition: background-position 0.3s;
  transition: background-position 0.3s;
}

.icore-icons-menu1 {
  background-position: -25px -24px;
}

.icore-icons-menu2 {
  background-position: -73px -24px;
}

.icore-icons-menu3 {
  background-position: -120px -24px;
}

.icore-icons-menu4 {
  background-position: -168px -24px;
}

.icore-icons-menu5 {
  background-position: -25px -70px;
}

.icore-icons-menu6 {
  background-position: -73px -70px;
}

.icore-icons-menu7 {
  background-position: -120px -70px;
}

.icore-icons-menu8 {
  background-position: -168px -70px;
}
.icore-icons-menu9 {
  background-position: -25px -119px;
}

.icore-icons-menu10 {
  background-position: -73px -119px;
}

.icore-icons-menu11 {
  background-position: -120px -119px;
}

.icore-icons-menu12 {
  background-position: -168px -119px;
}

.icore-icons-menu13 {
  background-position: -25px -168px;
}

.icore-icons-menu14 {
  background-position: -73px -168px;
}

.icore-icons-menu15 {
  background-position: -120px -168px;
}

.icore-icons-menu16 {
  background-position: -168px -168px;
}

.icore-icons-menu17 {
  background-position: -25px -217px;
}

.icore-icons-menu18 {
  background-position: -73px -217px;
}

.icore-icons-menu19 {
  background-position: -120px -217px;
}

.el-tree-node__content .el-icon-plus {
  /*margin-right: 20px;*/
}
.el-tag {
  margin: 0 0 10px 10px;
  cursor: pointer;
}
.danger {
  color: #f00;
}
.roleForm .el-form-item__content {
  margin-top: 13px;
}
.delMenuPr,
.upMenuPr,
.downMenuPr,
.rightMenuPr,
.leftMenuPr,
.addMenuPr {
  display: none;
}
.el-tree-node__content:hover {
  background-color: #bbdffb;
}
.el-tree-node:focus .el-tree-node__content {
  background-color: #bbdffb;
}
.el-tree .is-current .el-tree-node__content {
  background-color: #bbdffb;
}
.is-current .el-tree-node__children .el-tree-node .el-tree-node__content {
  background-color: #fff;
}
.app-select {
  padding: 10px 15px 0px 15px;
}

input[type="file"] {
  display: none;
  opacity: 0;
}
/* label {
  width: 90px;
  height: 32px;
  background: #ffffff;
  border: 1px solid #2da7e0;
  border-radius: 6px;
} */
</style>