qgb-process 0.1.52 → 0.1.53

package/src/views/formBuilder/components/menuConfig.vue

@@ -1,1752 +0,0 @@
-
-<template>
-  <el-tabs @tab-click="handleClick">
-    <el-tab-pane label="菜单">
-
-      <span slot="label">
-        <!-- <span class="span-box"> -->
-        <i class="el-icon-document span-box-icon"></i>
-        菜单
-        <!-- </span> -->
-      </span>
-      <div class="menu-list">
-        <div class="menu-config">
-          <div class="config-title">
-            <!-- <h4>菜单配置</h4><i
-          class="el-icon-circle-plus-outline"
-          @click.stop="addMenu()"
-        ></i> -->
-            <el-button
-              type="primary"
-              class='addgroup'
-              @click.stop="addMenu()"
-              style="margin-right:50px"
-            >新增分组</el-button>
-            <el-button
-              class='addform'
-              plain
-              @click.stop="addForm()"
-            >新增表单</el-button>
-          </div>
-          <div class="collapse"></div>
-        </div>
-        <!-- 配置菜单 -->
-
-        <el-menu
-          default-active="2"
-          class="el-menu-vertical-demo"
-          @select="handleSelect"
-          @open="handleOpen"
-          @close="handleClose"
-        >
-          <el-submenu
-            :index="item.id"
-            v-for="(item,ind) in menu"
-            :key="'pre'+ind"
-            :class="{'is-open': item.open}"
-          >
-            <template
-              slot="title"
-              class='mTitle'
-            >
-              <!-- <i class="el-icon-location"></i> -->
-              <img
-                :src="item.icon"
-                v-if="getIcon(item.icon).isOss"
-                alt=""
-                srcset=""
-                style="width: 40px;height:40px;margin-right:10px;"
-              >
-              <span
-                :class="['icon-menu-'+(item.icon),'iconMenu']"
-                v-else-if="!getIcon(item.icon).isOss"
-              >
-                <span class="path1"></span>
-                <span class="path2"></span>
-                <span class="path3"></span>
-                <span class="path4"></span>
-              </span>
-              <div
-                v-else
-                style="width: 79px;height:40px;margin-right:10px;"
-              ></div>
-              <span class="menu-item-name"><span>{{item.name}}</span></span>
-              <div
-                class="menu-item-option"
-                v-if="item.operateStatus"
-                @click.stop
-              >
-                <!-- <i class="el-icon-edit" @click.stop="editMenuName(index,senindex)"></i>
-            <i :class="[senitem.isShow == 1 ? 'el-icon-view' : 'el-icon-no-view']" @click.stop="changeMenu(index,senindex)"></i> -->
-                <el-dropdown
-                  trigger="click"
-                  @command="handleCommand"
-                >
-                  <span class="el-dropdown-link">
-                    <i class="el-icon-setting el-icon--right"></i>
-                  </span>
-                  <el-dropdown-menu slot="dropdown">
-                    <el-dropdown-item :command="`edit-${ind}`">编辑</el-dropdown-item>
-                    <!-- <el-dropdown-item :command="`change-${index}-${senindex}`">
-                      {{senitem.isShow == 1 ? '隐藏' : '启用'}}</el-dropdown-item>-->
-                    <el-dropdown-item :command="`delete-${ind}`">删除</el-dropdown-item>
-                  </el-dropdown-menu>
-                </el-dropdown>
-              </div>
-            </template>
-            <template v-for="(item1,ind1) in item.subMenu">
-              <el-submenu
-                :index="item.id+'-'+item1.id"
-                :key="item1.id"
-                v-if="item1.type"
-              >
-                <template slot="title"> <span class="menu-item-name"><span>{{item1.name}}</span></span>
-                  <div
-                    class="menu-item-option"
-                    v-if="item1.operateStatus"
-                    @click.stop
-                  >
-                    <!-- <i class="el-icon-edit" @click.stop="editMenuName(index,senindex)"></i>
-            <i :class="[senitem.isShow == 1 ? 'el-icon-view' : 'el-icon-no-view']" @click.stop="changeMenu(index,senindex)"></i> -->
-                    <el-dropdown
-                      trigger="click"
-                      @command="handleCommand"
-                    >
-                      <span class="el-dropdown-link">
-                        <i class="el-icon-setting el-icon--right"></i>
-                      </span>
-                      <el-dropdown-menu slot="dropdown">
-                        <el-dropdown-item :command="`edit-${ind}-${ind1}`">编辑</el-dropdown-item>
-                        <!-- <el-dropdown-item :command="`change-${index}-${senindex}`">
-                      {{senitem.isShow == 1 ? '隐藏' : '启用'}}</el-dropdown-item>-->
-                        <el-dropdown-item :command="`delete-${ind}-${ind1}`">删除</el-dropdown-item>
-                      </el-dropdown-menu>
-                    </el-dropdown>
-                  </div>
-                </template>
-                <el-menu-item
-                  :index="item1.id+'-'+item2.id"
-                  :key="item2.id"
-                  v-for="(item2,ind2) in item1.subMenu"
-                  @click="getFormDes(item2.id,item2.name,'blank',item2.pid)"
-                >
-                  <img
-                    :src="item2.icon"
-                    v-if="getIcon(item2.icon).isOss"
-                    alt=""
-                    srcset=""
-                    style="width: 40px;height:40px;margin-right:10px;"
-                  >
-                  <span
-                    :class="['icon-menu-'+(item2.icon),'iconMenu']"
-                    v-else-if="!getIcon(item2.icon).isOss"
-                  >
-                    <span class="path1"></span>
-                    <span class="path2"></span>
-                    <span class="path3"></span>
-                    <span class="path4"></span>
-                  </span>
-                  <div
-                    v-else
-                    style="width: 79px;height:40px;margin-right:10px;"
-                  ></div>
-                  <span class="menu-item-name"><span>{{item2.name}}</span></span>
-                  <div
-                    class="menu-item-option"
-                    @click.stop
-                  >
-                    <!-- <i class="el-icon-edit" @click.stop="editMenuName(index,senindex)"></i>
-            <i :class="[senitem.isShow == 1 ? 'el-icon-view' : 'el-icon-no-view']" @click.stop="changeMenu(index,senindex)"></i> -->
-                    <el-dropdown
-                      trigger="click"
-                      @command="handleCommand"
-                    >
-                      <span class="el-dropdown-link">
-                        <i class="el-icon-setting el-icon--right"></i>
-                      </span>
-                      <el-dropdown-menu slot="dropdown">
-                        <el-dropdown-item :command="`edit-${ind}-${ind1}-${ind2}`">编辑</el-dropdown-item>
-                        <el-dropdown-item :command="`delete-${ind}-${ind1}-${ind2}`">删除</el-dropdown-item>
-                      </el-dropdown-menu>
-                    </el-dropdown>
-                  </div>
-
-                </el-menu-item>
-              </el-submenu>
-
-              <el-menu-item
-                :index="item.id+'-'+item1.id"
-                :key="item1.id"
-                @click="getFormDes(item1.id,item1.name,'blank',item1.pid)"
-                v-else
-              >
-                <img
-                  :src="item1.icon"
-                  v-if="getIcon(item1.icon).isOss"
-                  alt=""
-                  srcset=""
-                  style="width: 40px;height:40px;margin-right:10px;"
-                >
-                <span
-                  :class="['icon-menu-'+(item1.icon),'iconMenu']"
-                  v-else-if="!getIcon(item1.icon).isOss"
-                >
-                  <span class="path1"></span>
-                  <span class="path2"></span>
-                  <span class="path3"></span>
-                  <span class="path4"></span>
-                </span>
-                <div
-                  v-else
-                  style="width: 79px;height:40px;margin-right:10px;"
-                ></div>
-                <span class="menu-item-name"><span>{{item1.name}}</span></span>
-                <div
-                  class="menu-item-option"
-                  @click.stop
-                >
-                  <!-- <i class="el-icon-edit" @click.stop="editMenuName(index,senindex)"></i>
-            <i :class="[senitem.isShow == 1 ? 'el-icon-view' : 'el-icon-no-view']" @click.stop="changeMenu(index,senindex)"></i> -->
-                  <el-dropdown
-                    trigger="click"
-                    @command="handleCommand"
-                  >
-                    <span class="el-dropdown-link">
-                      <i class="el-icon-setting el-icon--right"></i>
-                    </span>
-                    <el-dropdown-menu slot="dropdown">
-                      <el-dropdown-item :command="`edit-${ind}-${ind1}`">编辑</el-dropdown-item>
-                      <el-dropdown-item :command="`delete-${ind}-${ind1}`">删除</el-dropdown-item>
-                    </el-dropdown-menu>
-                  </el-dropdown>
-                </div>
-
-              </el-menu-item>
-            </template>
-
-          </el-submenu>
-
-        </el-menu>
-
-        <el-dialog
-          :title="getTitle"
-          :visible.sync="dialogFormVisible"
-          :close-on-click-modal="false"
-          width="500px"
-        >
-          <el-dialog
-            width="30%"
-            title="图标选择"
-            :visible.sync="innerVisible"
-            append-to-body
-          >
-            <div>
-
-              <el-row>
-                <el-col
-                  :span="3"
-                  v-for="(e,i) in 40"
-                  :key='i'
-                  class='menuIconBox'
-                >
-                  <span
-                    :class="['icon-menu-'+(i+1),'iconMenu',{ bgc: menuIconInnerIndex == (i+1) }]"
-                    @dblclick="innerVisible = false;
-                    menuIconIndex = menuIconInnerIndex = (i+1);
-                    $nextTick(()=>{form.icon = menuIconIndex})
-
-                     "
-                    @click="menuIconInnerIndex = (i+1)"
-                  >
-                    <span class="path1"></span>
-                    <span class="path2"></span>
-                    <span class="path3"></span>
-                    <span class="path4"></span>
-                  </span>
-                </el-col>
-              </el-row>
-            </div>
-            <div
-              slot="footer"
-              class="dialog-footer"
-            >
-              <el-button @click="innerVisible = false">取 消</el-button>
-              <el-button
-                type="primary"
-                @click="innerVisible = false;
-                menuIconIndex = menuIconInnerIndex
-                 $nextTick(()=>{form.icon = menuIconIndex})
-                 "
-              >确定</el-button>
-            </div>
-          </el-dialog>
-          <el-form
-            ref="form"
-            :rules="ruleForm"
-            :model="form"
-            label-width="100px"
-            label-position="right"
-          >
-            <el-form-item
-              label="上级菜单："
-              v-if="form.pName"
-              prop="pName"
-            >
-              <el-input
-                v-model="form.pName"
-                disabled
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-            <el-form-item
-              :label="'所属分组：'"
-              v-if="getTitle !=='编辑表单' && curLevel != 1 ||(getTitle =='新增分组'&&curLevel == 1) ||(getTitle =='新增表单'&&curLevel == 1)"
-              prop="group"
-              :rules="type=='addForm'?{required: true, message: '所属分组不能为空', trigger: 'blur'}:null"
-            >
-              <el-cascader
-                :disabled="getTitle =='编辑分组' && curLevel != 1"
-                ref="cascader"
-                v-model="form.group"
-                :options="type!=='addForm'?menuOneLevel:menuTwoLevel"
-                :props="cascaderProps"
-                clearable
-                @change="handleChange"
-              ></el-cascader>
-            </el-form-item>
-            <el-form-item
-              :label="getTitle =='新增表单' || getTitle =='编辑表单'? '表单名称：':'分组名称：'"
-              prop="name"
-            >
-              <el-input
-                v-model="form.name"
-                maxlength
-                autocomplete="off"
-              ></el-input>
-            </el-form-item>
-            <el-form-item
-              v-if="isShowIconItem"
-              :label="'图标：'"
-              prop="icon"
-            >
-              <span
-                v-if="menuIconIndex==0"
-                :class="['iconMenu']"
-                style="background-color:#ccc;color:#fff"
-                @click="innerVisible=true"
-              >
-                ICON
-              </span>
-              <span
-                :class="['icon-menu-'+menuIconIndex,'iconMenu']"
-                @click="innerVisible=true;$nextTick(()=>{form.icon = menuIconIndex})
-                 "
-              >
-                <span class="path1"></span>
-                <span class="path2"></span>
-                <span class="path3"></span>
-                <span class="path4"></span>
-              </span>
-            </el-form-item>
-          </el-form>
-          <div
-            slot="footer"
-            class="dialog-footer"
-          >
-            <el-button @click="dialogFormVisible = false;form.group=''">取 消</el-button>
-            <el-button
-              type="primary"
-              @click="operation"
-            >确 定</el-button>
-          </div>
-        </el-dialog>
-      </div>
-
-    </el-tab-pane>
-    <el-tab-pane label="组件">
-      <span slot="label">
-        <!-- <span class="span-box"> -->
-        <i class="el-icon-set-up span-box-icon"></i>
-        组件
-        <!-- </span> -->
-      </span>
-      <app-main-left class="app-main-left" />
-    </el-tab-pane>
-
-  </el-tabs>
-
-</template>
-<script>
-import _ from "lodash-es";
-import formAttrDefault from "@/store/formBuilder/formAttrDefault";
-import dd from "@/assets/icon_warning.png";
-import AppMainLeft from "@/formBuilder/components/app-main/components/main-left";
-import AppMainRight from "@/formBuilder/components/app-main/components/main-right/index";
-import configList from "@/formBuilder/config";
-import apiAuth from "@/api/apiAuth";
-import * as api from "@/api/apiFormBuilder/menu";
-import { mapMutations } from "vuex";
-import { getMenuRouter } from "@/formBuilder/menuConfig";
-export default {
-  components: {
-    AppMainLeft
-  },
-  data() {
-    return {
-      curType: 1,
-      curOperateStatus: 0,
-      curLevel: 0,
-      menuIconIndex: 0,
-      menuIconInnerIndex: 0,
-      innerVisible: false,
-      menuTwoLevelRes: [],
-      menuOneLevelRes: [],
-      cascaderProps: {
-        value: "id",
-        label: "name",
-        checkStrictly: true,
-        children: "subMenu"
-      },
-      currentMIndex: null,
-      currentMkeyPath: null,
-      dialogFormVisible: false,
-      type: "add",
-      form: {
-        id: "",
-        pName: "",
-        name: "",
-        oneName: "",
-        twoName: "",
-        thrName: "",
-        index: "",
-        icon: 1,
-        secIndex: "",
-        group: "",
-        thrIndex: "",
-        pid: "",
-        menuLevel: undefined
-      },
-      menu: [],
-      precutMenu: [],
-      step: 0,
-      oldMenu: {},
-      ruleForm: {
-        name: [
-          { required: true, message: "请输入菜单名称", trigger: "blur" },
-          { min: 1, max: 12, message: "长度在 1 到 12 个字符", trigger: "blur" }
-        ],
-
-        icon: [{ required: true, message: "请选择图标", trigger: "blur" }]
-      }
-    };
-  },
-  watch: {},
-  computed: {
-    getIcon() {
-      return function(icon) {
-        if (_.includes(icon, "http")) {
-          return { icon, isOss: true };
-        } else {
-          return { icon, isOss: false };
-        }
-      };
-    },
-    isShowIconItem: function() {
-      if (this.type == "add") {
-        if (
-          (this.curOperateStatus == 1 && this.curLevel == 2) ||
-          this.form.group == "" ||
-          this.curLevel == 0
-        ) {
-          return true;
-        }
-      }
-      if (this.type == "addForm") {
-        // if (this.curOperateStatus == 1) {
-        return true;
-        // }
-      }
-      if (this.type == "edit") {
-        if (
-          (this.curOperateStatus == 1 && this.curLevel == 2) ||
-          (this.curOperateStatus == 1 && this.curLevel == 1) ||
-          this.curType == 0
-        ) {
-          return true;
-        }
-      }
-      return false;
-    },
-    companyNo: function() {
-      return this.$store.state.user.cno;
-    },
-    menuOneLevel: function() {
-      const arr = _.cloneDeep(this.menu);
-      arr.forEach((e, i) => {
-        e.curLevel = 1;
-        if (e.type == 0) {
-          e.subMenu.splice(i, 1);
-        }
-        delete e.subMenu;
-      });
-      return arr;
-    },
-    menuTwoLevel: function() {
-      const arr = _.cloneDeep(this.menu);
-
-      for (let index = 0; index < arr.length; index++) {
-        const e = arr[index];
-        e.curLevel = 1;
-        if (e.type == 0) {
-          e.subMenu.splice(index, 1);
-          index--;
-        }
-        for (let index2 = 0; index2 < e.subMenu.length; index2++) {
-          const e2 = e.subMenu[index2];
-          e2.curLevel = 2;
-          if (e2.type == 0) {
-            e.subMenu.splice(index2, 1);
-            index2--;
-          }
-          delete e2.subMenu;
-        }
-      }
-      //   arr.forEach((e, i) => {
-      //     e.curLevel = 1;
-      //     if (e.type == 0) {
-      //       e.subMenu.splice(i, 1);
-      //       i--;
-      //     }
-      //     e.subMenu.forEach((e2, i2) => {
-      //       e2.curLevel = 2;
-      //       if (e2.type == 0) {
-      //         e.subMenu.splice(i2, 1);
-      //         i2--;
-      //       }
-      //       delete e2.subMenu;
-      //     });
-      //   });
-      //   arr.forEach((e, i) => {
-      //     const iterator = data => {
-      //       if (e.type == 0) {
-      //         data.subMenu.splice(i, 1);
-      //       }
-      //       if (data.subMenu && data.subMenu.length > 0) {
-      //         data.subMenu.forEach((item, i2) => {
-      //           if (item.type == 0) {
-      //             data.subMenu.splice(i, 1);
-      //           }
-      //           if (item.subMenu && item.subMenu.length > 0) {
-      //             iterator(item);
-      //           } else {
-      //             delete item.subMenu;
-      //           }
-      //         });
-      //       } else {
-      //         delete data.subMenu;
-      //       }
-      //     };
-      //     iterator(e);
-      //   });
-      console.log("@@@@@@@@@@@@@@@@@");
-      return arr;
-    },
-    menuClone: function() {
-      const arr = _.cloneDeep(this.menu);
-      arr.forEach((e, i) => {
-        e.curLevel = 1;
-        e.subMenu.forEach((e2, i2) => {
-          e2.curLevel = 2;
-          e.subMenu.forEach((e3, i3) => {
-            e3.curLevel = 3;
-          });
-        });
-      });
-      return arr;
-    },
-    getTitle: function() {
-      if (this.type == "add") {
-        return "新增分组";
-      } else if (this.type == "addForm") {
-        return "新增表单";
-      } else if (this.type == "edit" && this.curType == 0) {
-        return "编辑表单";
-      } else if (this.type == "edit" && this.curType == 1) {
-        return "编辑分组";
-      }
-      return this.$store.state.user.cno;
-    },
-    menuId: function() {
-      return this.$store.state.formBuilder.menuId;
-    }
-  },
-  methods: {
-    ...mapMutations([
-      "updateFormBuilder",
-      "updateList",
-      "updateFormAttr",
-      "clearForm",
-      "updateSelectIndex"
-    ]),
-
-    handleChange(res) {
-      const vm = this;
-      this.curOperateStatus =
-        this.$refs.cascader.getCheckedNodes()[0].data.operateStatus;
-      this.curLevel = this.$refs.cascader.getCheckedNodes()[0].data.curLevel;
-      this.form.menuLevel =
-        this.$refs.cascader.getCheckedNodes()[0].data.menuLevel;
-      this.form.pid = this.$refs.cascader.getCheckedNodes()[0].data.pid;
-      this.form.id = this.$refs.cascader.getCheckedNodes()[0].data.id;
-      this.form.index = _.findIndex(
-        this.menu,
-        this.$refs.cascader.getCheckedNodes()[0].data
-      );
-      // this.form.oneName = this.menu[index].name;
-      //  this.form.twoName = this.menu[index]?.subMenu[secIndex]?.name;
-      //  this.form.thrName =
-      //    this.menu[index]?.subMenu[secIndex]?.subMenu[thrIndex]?.name;
-    },
-    handleClick(res) {
-      const vm = this;
-      if (res.paneName == 1) {
-        vm.$parent.$refs.MainRight.$refs.FormItemTabs.$children[0].$refs.tabs[0].click();
-      }
-    },
-    handleOpen(key, keyPath) {
-      this.currentMIndex = key;
-      this.currentMkeyPath = keyPath;
-      console.log(key, keyPath);
-    },
-    handleSelect(key, keyPath) {
-      let oneIndex, twoIndex, thrIndex;
-      const arr = [];
-      keyPath.forEach(e => {
-        arr.push(e.split("-")[e.split("-").length - 1]);
-      });
-
-      arr.forEach((e, i) => {
-        if (i == 0) {
-          oneIndex = _.findIndex(this.menu, function(r) {
-            return r.id == e;
-          });
-        }
-        if (i == 1) {
-          twoIndex = _.findIndex(this.menu[oneIndex].subMenu, function(r) {
-            return r.id == e;
-          });
-        }
-        if (i == 2) {
-          thrIndex = _.findIndex(
-            this.menu[oneIndex].subMenu[twoIndex].subMenu,
-            function(r) {
-              return r.id == e;
-            }
-          );
-        }
-      });
-      this.form.oneIndex = oneIndex;
-      this.form.twoIndex = twoIndex;
-      this.form.thrIndex = thrIndex;
-      if (thrIndex != -1 && thrIndex != undefined) {
-        this.form.title = `${this.menu[oneIndex].name}/${this.menu[oneIndex].subMenu[twoIndex].name}/${this.menu[oneIndex].subMenu[twoIndex].subMenu[thrIndex].name}`;
-      } else if (twoIndex != -1 && twoIndex != undefined) {
-        this.form.title = `${this.menu[oneIndex].name}/${this.menu[oneIndex].subMenu[twoIndex].name}`;
-      } else if (oneIndex != -1 && oneIndex != undefined) {
-        this.form.title = `${this.menu[oneIndex].name}`;
-      }
-    },
-
-    handleClose(key, keyPath) {
-      this.currentMIndex = key;
-      this.currentMkeyPath = keyPath;
-      console.log(key, keyPath);
-    },
-    // 获取自定义菜单
-    async getConfigList() {
-      const vm = this;
-      const params = { companyNo: this.companyNo };
-      //   const data2 = await api.gitMenuConfig(params);
-      const { data } = await api.gitMenuConfig(params);
-      if (data.state == "ok") {
-        const menuList = _.sortBy(data.data, function(item) {
-          return item.sort;
-        });
-
-        menuList.forEach(async(item, i) => {
-          if (
-            i == 0 &&
-            item.subMenu.length > 0 &&
-            item.subMenu[0].subMenu.length > 0
-          ) {
-            item.open = true;
-            await vm.getFormDes(
-              item.subMenu[0].subMenu[0].id,
-              item.subMenu[0].subMenu[0].name,
-              "blank",
-              item.subMenu[0].subMenu[0].pid,
-              "frist"
-            );
-          } else {
-            item.open = false;
-          }
-          if (item.subMenu.length > 0) {
-            item.subMenu = _.sortBy(item.subMenu, function(secItem) {
-              return secItem.sort;
-            });
-          }
-          item.subMenu.forEach((e, i) => {
-            e["open"] = false;
-          });
-        });
-
-        this.menu = menuList;
-        console.log("我获取了");
-        this.$store.commit("SET_MENULIST", this.menu);
-        // this.changeOpen(0)
-      }
-      //  ;
-    },
-    editMenuName(index, secIndex, thrIndex) {
-      this.type = "edit";
-      this.form.index = index;
-      this.form.secIndex = secIndex;
-      this.form.thrIndex = thrIndex;
-      this.menuIconIndex = this.form.menuIconIndex = thrIndex
-        ? this.menu[index].subMenu[secIndex].subMenu[thrIndex].icon
-        : secIndex
-          ? this.menu[index].subMenu[secIndex].icon
-          : this.menu[index].icon;
-      this.form.icon = thrIndex
-        ? this.menu[index].subMenu[secIndex].subMenu[thrIndex].icon
-        : secIndex
-          ? this.menu[index].subMenu[secIndex].icon
-          : this.menu[index].icon;
-      this.form.pName = thrIndex ? this.menu[index].subMenu[secIndex].name : "";
-      this.form.group = secIndex ? this.menu[index].subMenu[secIndex].pid : "";
-      this.form.name = thrIndex
-        ? this.menu[index].subMenu[secIndex].subMenu[thrIndex].name
-        : secIndex
-          ? this.menu[index].subMenu[secIndex].name
-          : this.menu[index].name;
-      this.dialogFormVisible = true;
-      this.curOperateStatus = thrIndex
-        ? this.menu[index].subMenu[secIndex].subMenu[thrIndex].operateStatus
-        : secIndex
-          ? this.menu[index].subMenu[secIndex].operateStatus
-          : this.menu[index].operateStatus;
-      this.curLevel = thrIndex
-        ? this.menuClone[index].subMenu[secIndex].subMenu[thrIndex].curLevel
-        : secIndex
-          ? this.menuClone[index].subMenu[secIndex].curLevel
-          : this.menuClone[index].curLevel;
-      this.curType = thrIndex
-        ? this.menu[index].subMenu[secIndex].subMenu[thrIndex].type
-        : secIndex
-          ? this.menu[index].subMenu[secIndex].type
-          : this.menu[index].type;
-
-      //    this.$store.commit("SET_MENULIST", this.menu);
-
-      this.$store.commit("SET_MENULIST", this.menu);
-    },
-    addMenu(index) {
-      this.type = "add";
-      //   if (indexPath.length == 1) {
-      //     // 新增2级菜单
-      //   }
-      this.form.index = index != undefined ? index : "";
-      this.form.pName = index != undefined ? this.menu[index].name : "";
-      this.form.name = "";
-      this.form.group = "";
-      this.form.icon = 1;
-      this.menuIconIndex = 1;
-      this.menuIconInnerIndex = 1;
-      this.form.pid = "";
-      this.dialogFormVisible = true;
-
-      this.$store.commit("SET_MENULIST", this.menu);
-      this.$refs.form.clearValidate();
-    },
-    addForm(index) {
-      this.type = "addForm";
-      this.form.pid = "";
-      this.form.name = "";
-      this.form.group = "";
-      this.form.pName = "";
-      this.form.icon = 1;
-      this.menuIconIndex = 1;
-      this.menuIconInnerIndex = 1;
-      this.dialogFormVisible = true;
-      this.getConfigList();
-      this.$refs.form.clearValidate();
-    },
-    async changeMenu(index, secIndex) {
-      let params = {};
-      let item = null;
-      if (secIndex == undefined) {
-        params = { id: this.menu[index].id };
-        item = this.menu[index];
-      } else {
-        params = { id: this.menu[index]["subMenu"][secIndex].id };
-        item = this.menu[index]["subMenu"][secIndex];
-      }
-      const tip = item.isShow == 1 ? "隐藏菜单" : "开启菜单";
-      this.$confirm(`确定要${tip}吗？`, `${tip}`, {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning"
-      })
-        .then(async() => {
-          const { data } = await api.changeShow(params);
-          if (data.state == "ok") {
-            item.isShow = item.isShow == 1 ? 0 : 1;
-            this.$message.success(data.msg ? data.msg : "更改成功");
-          } else {
-            this.$message.error(data.msg ? data.msg : "修改失败，请重试");
-          }
-        })
-        .catch(() => {});
-    },
-    async deleteMenu(index, secIndex, thrIndex) {
-      let params = {};
-      const item = null;
-      const vm = this;
-      if (secIndex == undefined) {
-        params = { id: vm.menu[index].id };
-      } else if (thrIndex == undefined) {
-        params = { id: vm.menu[index]["subMenu"][secIndex].id };
-      } else {
-        debugger;
-        params = {
-          id: vm.menu[index]["subMenu"][secIndex]["subMenu"][thrIndex].id
-        };
-      }
-      const h = vm.$createElement;
-      vm.$msgbox({
-        title: "删除提示",
-        message: h(
-          "div",
-          {
-            class: {
-              msgboxDiv: true
-            }
-          },
-          [
-            h(
-              "img",
-              {
-                domProps: {
-                  src: dd
-                }
-              },
-              "VNode"
-            ),
-            //   h("img", { "src": "../../../assets/icon_warning.png" }, "VNode"),
-            h(
-              "div",
-              null,
-              "删除表单后，将删除表单控件及业务数据，是否确认删除？"
-            )
-          ]
-        ),
-        showCancelButton: true,
-        closeOnClickModal: false,
-        closeOnPressEscape: false,
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        cancelButtonClass: "cancelBtn1",
-        confirmButtonClass: "confirmBtn1"
-      }).then(async() => {
-        const { data } = await api.deleteMenu(params);
-        if (data.state == "ok") {
-          vm.getConfigList();
-        } else {
-          this.$message.error(data.msg ? data.msg : "删除失败，请重试");
-        }
-      });
-
-      //   this.$confirm(
-      //     "删除表单后，将删除表单控件及业务数据，是否确认删除？",
-      //     "删除提示",
-      //     {
-      //       confirmButtonText: "确定",
-      //       cancelButtonText: "取消",
-      //       type: "warning"
-      //       // center: true
-      //     }
-      //   )
-      //     .then(async() => {
-      //       const { data } = await api.deleteMenu(params);
-      //       if (data.state == "ok") {
-      //         if (secIndex == undefined) {
-      //           this.menu.splice(index, 1);
-      //           this.$store.commit("SET_MENULIST", this.menu);
-      //         } else {
-      //           this.menu[index]["subMenu"].splice(secIndex, 1);
-      //           this.$store.commit("SET_MENULIST", this.menu);
-      //         }
-      //       } else {
-      //         this.$message.error(data.msg ? data.msg : "删除失败，请重试");
-      //       }
-      //     })
-      //     .catch(() => {});
-    },
-    handleCommand(val) {
-      const option = val.split("-");
-      switch (option[0]) {
-        case "add":
-          this.addMenu(option[1]);
-          break;
-        case "edit":
-          this.editMenuName(option[1], option[2], option[3]);
-          break;
-        case "delete":
-          this.deleteMenu(option[1], option[2], option[3]);
-          break;
-        case "change":
-          this.changeMenu(option[1], option[2]);
-          break;
-        default:
-          break;
-      }
-    },
-    resetForm() {
-      this.form = {
-        pName: "",
-        name: "",
-        index: "",
-        secIndex: ""
-      };
-    },
-    changeOpen(index, type, item) {
-      const vm = this;
-      debugger;
-      this.currentMIndex = index;
-      //   if (type) {
-      //     this.precutMenu[index].open = !this.precutMenu[index].open;
-      //   } else
-      if (type == 3) {
-      } else {
-        this.menu[index].open = !this.menu[index].open;
-        this.menu.map((e, i) => {
-          e.active = false;
-        });
-        this.menu[index].active = true;
-        // this.$store.state.formBuilder.currentMenu = this.menu[index];
-      }
-    },
-    // 添加分组
-    addMenuFunc() {
-      const vm = this;
-      vm.$refs.form.validate(async valid => {
-        if (valid) {
-          const params = {
-            name: vm.form.name,
-            companyNo: vm.companyNo,
-            icon: vm.form.icon.toString(),
-            pid: vm.form.pid ? vm.form.pid : vm.form.id
-          };
-          const { data } = await api.addMenu(params);
-          if (data.state == "ok") {
-            const sort = vm.menu.length;
-            vm.getConfigList();
-            // vm.menu[vm.form.index]["subMenu"].push({
-            //   subMenu: [],
-            //   name: vm.form.name,
-            //   id: data.id,
-            //   sort: sort,
-            //   isShow: 1,
-            //   type: 1,
-            //   operateStatus: 1,
-            //   open: false
-            // });
-            vm.dialogFormVisible = false;
-            vm.form.pid = "";
-            vm.form.icon = 1;
-            vm.$store.commit("SET_MENULIST", vm.menu);
-            vm.resetForm();
-          } else {
-            vm.$message.error(data.msg ? data.msg : "添加菜单失败");
-          }
-        }
-      });
-    },
-    addFormFunc() {
-      const vm = this;
-      vm.$refs.form.validate(async valid => {
-        if (valid) {
-          const params = {
-            pid: vm.form.id,
-            name: vm.form.name,
-            companyNo: vm.companyNo,
-            icon: vm.form.icon.toString()
-          };
-          const { data } = await api.addForm(params);
-          if (data.state == "ok") {
-            vm.$message.success("添加表单成功");
-            vm.getConfigList();
-            vm.dialogFormVisible = false;
-            vm.form.icon = 1;
-            vm.resetForm();
-          } else {
-            vm.$message.error(data.msg ? data.msg : "添加菜单失败");
-          }
-        }
-      });
-    },
-    // 编辑菜单名称
-    async editMenuFunc() {
-      const vm = this;
-      vm.$refs.form.validate(async valid => {
-        if (valid) {
-          let params = {};
-          let item = null;
-          if (vm.form.thrIndex) {
-            params = {
-              id: vm.menu[vm.form.index].subMenu[vm.form.secIndex].subMenu[
-                vm.form.thrIndex
-              ].id,
-              name: vm.form.name,
-              icon: vm.form.icon.toString()
-            };
-            item =
-              vm.menu[vm.form.index].subMenu[vm.form.secIndex].subMenu[
-                vm.form.thrIndex
-              ];
-          } else if (!vm.form.thrIndex && vm.form.secIndex) {
-            params = {
-              id: vm.menu[vm.form.index].subMenu[vm.form.secIndex].id,
-              name: vm.form.name,
-              icon: vm.form.icon.toString()
-            };
-            item = vm.menu[vm.form.index].subMenu[vm.form.secIndex];
-          } else {
-            params = {
-              id: vm.menu[vm.form.index].id,
-              name: vm.form.name,
-              icon: vm.form.icon.toString()
-            };
-            item = vm.menu[vm.form.index];
-            vm.$store.state.menuList = vm.menu;
-          }
-          //   debugger;
-          const { data } = await api.changeMenuName(params);
-          if (data.state == "ok") {
-            item.name = vm.form.name;
-            this.updateFormBuilder({
-              name: vm.form.name,
-              menuId: this.$store.state.formBuilder.menuId,
-              formDesId: this.$store.state.formBuilder.formDesId,
-              type: this.$store.state.formBuilder.type,
-              currentMenu: this.$store.state.formBuilder.currentMenu
-            });
-            this.getConfigList();
-            vm.dialogFormVisible = false;
-            vm.resetForm();
-          } else {
-            vm.$message.error(data.msg ? data.msg : "修改名称失败，请重试");
-          }
-        }
-      });
-    },
-    // 操作按钮
-    async operation() {
-      if (this.type == "add") {
-        this.addMenuFunc();
-      } else if (this.type == "addForm") {
-        this.addFormFunc();
-      } else {
-        this.editMenuFunc();
-      }
-    },
-    // 获取表单json数据
-    async getFormDes(id, name, type, pid, flg) {
-      const vm = this;
-      const h = this.$createElement;
-      const isSingleArr = [];
-      let isSingle = false;
-      vm.menu.forEach((e, i) => {
-        e.subMenu.forEach(e2 => {
-          isSingleArr.push(e2);
-        });
-      });
-      if (isSingleArr.length <= 1) {
-        isSingle = true;
-      } else {
-        isSingle = false;
-      }
-      if (!flg && !isSingle) {
-        vm.$msgbox({
-          title: "保存提示",
-          message: h(
-            "div",
-            {
-              class: {
-                msgboxDiv: true
-              }
-            },
-            [
-              h(
-                "img",
-                {
-                  domProps: {
-                    src: dd
-                  }
-                },
-                "VNode"
-              ),
-              //   h("img", { "src": "../../../assets/icon_warning.png" }, "VNode"),
-              h("div", null, "表单设计修改但未保存，是否保存后继续？")
-            ]
-          ),
-          confirmButtonText: "保存并继续",
-          cancelButtonText: "不保存",
-          closeOnClickModal: false,
-          closeOnPressEscape: false,
-          showCancelButton: true,
-          cancelButtonClass: "cancelBtn",
-          confirmButtonClass: "confirmBtn"
-        })
-          .then(async() => {
-            const res =
-              await vm.$parent.$refs.AppMain.$refs.mainHeader.saveDate();
-            vm.$store.state.formBuilder.currentMenu = id;
-            vm.$nextTick(() => {
-              vm.menu.map((e, i) => {
-                e.active = false;
-                if (e.subMenu) {
-                  e.subMenu.map((e2, i) => {
-                    if (e2.id == id) {
-                      e2.active = true;
-                    }
-                  });
-                }
-              });
-            });
-
-            const views = getMenuRouter(id);
-            if ((type == "precut" && views == "") || vm.menuId == id) return;
-            //   this.updateFormBuilder({
-            //     menuId: id,
-            //     name: name,
-            //     formDesId: "",
-            //     type: type,
-            //     currentMenu: id
-            //   });
-            const { data } = await api.queryFormByMenu({
-              menuId: id,
-              companyNo: vm.companyNo
-            });
-            let pName = {};
-            if (vm.$store.state.menuList) {
-              pName = _.find(vm.$store.state.menuList, function(o) {
-                return o.id == pid;
-              })?.name;
-            }
-
-            if (data.state == "ok" && JSON.stringify(data.data) == "{}") {
-              vm.clearForm();
-              vm.updateFormAttr(_.cloneDeep(formAttrDefault));
-              vm.updateFormBuilder({
-                menuId: id,
-                name: vm.form.title,
-                formDesId: data.data.id,
-                type: type,
-                currentMenu: id
-              });
-            } else if (data.state == "ok" && data.data) {
-              const keys = Object.keys(formAttrDefault);
-              var formAttr = Object.assign(
-                _.cloneDeep(formAttrDefault),
-                _.pick(data.data.content.formAttr, keys)
-              );
-              formAttr = Object.assign(formAttr, data.data.content.formAttr);
-
-              vm.json2Form(data.data.content.formDesc, type);
-              vm.updateFormAttr(formAttr);
-
-              vm.updateFormBuilder({
-                menuId: id,
-                name: vm.form.title,
-                formDesId: data.data.id,
-                type: type,
-                currentMenu: id
-              });
-            } else {
-              vm.$message.error(data.msg ? data.msg : "获取信息失败");
-            }
-          })
-          .catch(async() => {
-            vm.$store.state.formBuilder.currentMenu = id;
-            vm.$nextTick(() => {
-              vm.menu.map((e, i) => {
-                e.active = false;
-                if (e.subMenu) {
-                  e.subMenu.map((e2, i) => {
-                    if (e2.id == id) {
-                      e2.active = true;
-                    }
-                  });
-                }
-              });
-            });
-
-            const views = getMenuRouter(id);
-            if ((type == "precut" && views == "") || vm.menuId == id) return;
-            //   this.updateFormBuilder({
-            //     menuId: id,
-            //     name: name,
-            //     formDesId: "",
-            //     type: type,
-            //     currentMenu: id
-            //   });
-            const { data } = await api.queryFormByMenu({
-              menuId: id,
-              companyNo: vm.companyNo
-            });
-            let pName = {};
-            if (vm.$store.state.menuList) {
-              pName = _.find(vm.$store.state.menuList, function(o) {
-                return o.id == pid;
-              })?.name;
-            }
-
-            if (data.state == "ok" && JSON.stringify(data.data) == "{}") {
-              vm.clearForm();
-              vm.updateFormAttr(_.cloneDeep(formAttrDefault));
-              vm.updateFormBuilder({
-                menuId: id,
-                name: vm.form.title,
-                formDesId: data.data.id,
-                type: type,
-                currentMenu: id
-              });
-            } else if (data.state == "ok" && data.data) {
-              const keys = Object.keys(formAttrDefault);
-              var formAttr = Object.assign(
-                _.cloneDeep(formAttrDefault),
-                _.pick(data.data.content.formAttr, keys)
-              );
-              formAttr = Object.assign(formAttr, data.data.content.formAttr);
-
-              vm.json2Form(data.data.content.formDesc, type);
-              vm.updateFormAttr(formAttr);
-
-              vm.updateFormBuilder({
-                menuId: id,
-                name: vm.form.title,
-                formDesId: data.data.id,
-                type: type,
-                currentMenu: id
-              });
-            } else {
-              vm.$message.error(data.msg ? data.msg : "获取信息失败");
-            }
-            vm.$message({
-              type: "info",
-              message: "已取消保存"
-            });
-          });
-      } else {
-        vm.$store.state.formBuilder.currentMenu = id;
-
-        vm.$nextTick(() => {
-          vm.menu.map((e, i) => {
-            e.active = false;
-            if (e.subMenu) {
-              e.subMenu.map((e2, i) => {
-                if (e2.id == id) {
-                  e2.active = true;
-                }
-              });
-            }
-          });
-        });
-
-        const views = getMenuRouter(id);
-        if ((type == "precut" && views == "") || vm.menuId == id) return;
-        //   this.updateFormBuilder({
-        //     menuId: id,
-        //     name: name,
-        //     formDesId: "",
-        //     type: type,
-        //     currentMenu: id
-        //   });
-        const { data } = await api.queryFormByMenu({
-          menuId: id,
-          companyNo: vm.companyNo
-        });
-        let pName = {};
-        if (vm.$store.state.menuList) {
-          pName = _.find(vm.$store.state.menuList, function(o) {
-            return o.id == pid;
-          })?.name;
-        }
-
-        if (data.state == "ok" && JSON.stringify(data.data) == "{}") {
-          vm.clearForm();
-          vm.updateFormAttr(_.cloneDeep(formAttrDefault));
-          debugger;
-          vm.updateFormBuilder({
-            menuId: id,
-            name: vm.form.title,
-            formDesId: data.data.id,
-            type: type,
-            currentMenu: id
-          });
-        } else if (data.state == "ok" && data.data) {
-          const keys = Object.keys(formAttrDefault);
-          var formAttr = Object.assign(
-            _.cloneDeep(formAttrDefault),
-            _.pick(data.data.content.formAttr, keys)
-          );
-          formAttr = Object.assign(formAttr, data.data.content.formAttr);
-
-          vm.json2Form(data.data.content.formDesc, type);
-          vm.updateFormAttr(formAttr);
-
-          vm.form.title = `${vm.menu[0].name}/${vm.menu[0].subMenu[0].name}/${vm.menu[0].subMenu[0].subMenu[0].name}`;
-          vm.updateFormBuilder({
-            menuId: id,
-            name: vm.form.title,
-            formDesId: data.data.id,
-            type: type,
-            currentMenu: id
-          });
-        } else {
-          vm.$message.error(data.msg ? data.msg : "获取信息失败");
-        }
-      }
-    },
-    json2Form(formDesc, type) {
-      // 清空原有list （待优化）
-      this.clearForm(); // 2.更新 formDesc（组件通用配置数据） // 3.处理 formDesc.attr（组件属性配置数据）
-      if (type == "blank") {
-        const list = Object.entries(formDesc).map(([key, val]) => {
-          const attrsDefaultData = configList[val.type]
-            ? _.cloneDeep(configList[val.type].attrsDefaultData)
-            : {};
-          const attrs = val.attrs
-            ? Object.assign(attrsDefaultData, val.attrs)
-            : attrsDefaultData;
-          return {
-            ...val,
-            attrs,
-            field: key
-          };
-        }); // 更新 list
-        this.updateList({ name: "default", newList: list });
-      } else {
-        for (const name in formDesc) {
-          const list = Object.entries(formDesc[name]).map(([key, val]) => {
-            const attrsDefaultData = configList[val.type]
-              ? _.cloneDeep(configList[val.type].attrsDefaultData)
-              : {};
-            const attrs = val.attrs
-              ? Object.assign(attrsDefaultData, val.attrs)
-              : attrsDefaultData;
-            return {
-              attrs: val.attrs || {},
-              field: key,
-              ...val
-            };
-          }); // 更新 list
-          this.updateList({ name: name, newList: list });
-        }
-      } // 更新 selectIndex
-      this.updateSelectIndex(0);
-    },
-    // 获取预制菜单
-    async getPrecutMenu() {
-      //   const { data } = await api.getPrecutMenu();
-      const { data } = await apiAuth.getMenus();
-      console.log(data);
-      if (data.state == "ok") {
-        const menuList = _.sortBy(data.data, function(item) {
-          return item.sort;
-        });
-        menuList.forEach(item => {
-          item.open = false;
-          item.icon = item.icon
-            ? require(`@/assets/center/menuIcon/${item.icon}.png`)
-            : "";
-          if (item.list.length > 0) {
-            item.subMenu = _.sortBy(item.list, function(secItem) {
-              return secItem.sort;
-            });
-          }
-        });
-        this.precutMenu = menuList;
-      }
-    }
-  },
-  mounted() {
-    const _this = this;
-    // this.getPrecutMenu();
-    this.getConfigList();
-    this.$dragging.$on("dragged", ({ value }) => {
-      console.log(value);
-      if (this.step == 0) {
-        this.oldMenu = this.menu;
-      }
-      this.step++;
-    });
-    this.$dragging.$on("dragend", async val => {
-      if (this.step < 1) return;
-      console.log(val);
-      console.log(_this.menu, "end");
-      const group = val.group.split("-");
-      let params = {};
-      if (group[0] == "item") {
-        const id = this.menu.map(item => item.id);
-        params = { ids: id };
-        console.log(id);
-      } else {
-        const index = group[1];
-        const id = this.menu[index].subMenu.map(item => item.id);
-        params = { ids: id };
-      }
-      const { data } = await api.sortMenu(params);
-      if (data.state == "ok") {
-        this.step = 0;
-      } else {
-        this.menu = this.oldMenu;
-        this.$message.error(data.msg ? data.msg : "保存失败");
-      }
-    });
-  }
-};
-</script>
-
-<style lang="scss" scoped>
-[class^="icon-"],
-[class*=" icon-"] {
-  /* use !important to prevent issues with browser extensions that change fonts */
-  font-size: 40px;
-}
-.menuIconBox {
-  margin-bottom: 5px;
-}
-.iconMenuBox {
-  text-align: center;
-  width: 56px;
-  height: 19px;
-  font-size: 14px;
-  font-family: "Microsoft YaHei";
-  color: #333333;
-  line-height: 19px;
-}
-.iconMenu {
-  text-align: center;
-  display: inline-block;
-  width: 40px;
-  margin-right: 12px;
-  border-radius: 5px;
-}
-.el-dialog__body {
-  .iconMenu {
-    text-align: center;
-    display: inline-block;
-    width: 40px;
-    margin-right: 12px;
-    border-radius: 5px;
-    padding: 5px;
-    &:hover {
-      background-color: rgb(233, 233, 233);
-    }
-    &:active {
-      background-color: rgb(210, 234, 249);
-    }
-  }
-}
-.bgc {
-  background-color: rgb(210, 234, 249);
-}
-
-/deep/ .el-cascader {
-  width: 100%;
-}
-.msgboxDiv {
-  text-align: center !important;
-  div {
-    margin-top: 20px;
-    margin-bottom: 10px;
-  }
-}
-.msgboxDiv .el-message-box__btns {
-  text-align: center !important;
-  margin-bottom: 20px;
-}
-.msgboxDiv .el-message-box__btns button:nth-child(2) {
-  margin-left: 20px !important;
-}
-.el-message-box__btns {
-  text-align: center !important;
-}
-.dialog-footer {
-  text-align: center;
-}
-.el-icon-setting {
-  color: #ccc !important;
-  font-size: 18px !important;
-}
-.el-icon-setting:hover {
-  color: #0286df !important;
-}
-.addgroup {
-  background: #0286df;
-  border-radius: 4px;
-  padding: 10px 13px;
-}
-.addform {
-  // background: #0286DF;
-  border-radius: 4px;
-  padding: 10px 13px;
-  background: #fff;
-  border-color: #409eff;
-  color: #409eff;
-}
-/deep/ .el-tabs__nav-scroll {
-  // padding: 5px;
-}
-/deep/ .el-tabs__header {
-  margin: 0 0 5px !important;
-}
-/deep/ .el-tabs__nav {
-  width: 100% !important;
-  padding-top: 5px !important;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-/deep/ .el-tabs__nav .el-tabs__item {
-  //   height: 80px !important;
-  text-align: center;
-  width: 50% !important;
-  .span-box {
-    position: relative;
-    bottom: -10px;
-  }
-  span {
-    //   line-height: 20px;
-  }
-}
-//   border-bottom: 1px solid #ccc;
-.span-box {
-  text-align: center;
-  display: block;
-}
-.span-box-icon {
-  text-align: center;
-  font-size: 19px;
-  //   display: block;
-}
-.is-active {
-  background-color: #ecf5ff;
-  color: #0286df;
-}
-
-/deep/ .el-tabs__content {
-  //   height: 100% !important;
-  //   overflow: auto !important;
-}
-.el-tabs--left {
-  //   height: 100% !important;
-}
-.el-tab-pane {
-}
-.menu-list {
-  //   overflow: auto;
-  width: 100%;
-  background-color: #ffffff;
-
-  height: 100%;
-  .menu-config {
-    display: flex;
-    margin-bottom: 10px;
-    justify-content: space-between;
-    align-items: center;
-    // height: 32px;
-    overflow: hidden;
-    padding-top: 10px;
-    .config-title {
-      width: 100%;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      h4 {
-        font-size: 18px;
-        margin: 0;
-        display: inline-block;
-      }
-      i {
-        margin-left: 8px;
-        font-size: 18px;
-        cursor: pointer;
-        color: #666666;
-      }
-    }
-  }
-  .menu-item {
-    padding: 0 10px 0 20px;
-    position: relative;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    height: 56px;
-    color: #333;
-    line-height: 56px;
-    font-size: 16px;
-    cursor: pointer;
-    &:hover {
-      i {
-        display: inline-block;
-      }
-    }
-    i {
-      color: #909399;
-    }
-  }
-  .menu-item-name {
-    width: 155% !important;
-  }
-  .menu-item-child {
-    transition: 0.5s all ease;
-    height: 0;
-    overflow: hidden;
-    padding-left: 0;
-    margin: 0;
-    font-size: 14px;
-    color: #666;
-    li {
-      padding-left: 30px;
-      .menu-item-name {
-        font-size: 14px;
-        span {
-          max-width: 200px;
-        }
-      }
-      .menu-item-option {
-        width: 46px;
-      }
-    }
-    li.active {
-      background-color: #ecf5ff;
-      color: #0286df;
-    }
-  }
-  .menu-item-name {
-    display: flex;
-    align-items: center;
-    color: #303133;
-    img {
-      height: 16px;
-      width: 16px;
-      margin-right: 6px;
-    }
-    .no-img {
-      visibility: hidden;
-    }
-    span {
-      max-width: 180px;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
-  }
-  .el-icon-arrow-down {
-    position: absolute;
-    right: 6px;
-    top: 10px;
-    transition: 0.5s all ease;
-    transform: rotate(0deg);
-    -ms-transform: rotate(0deg); /* IE 9 */
-    -webkit-transform: rotate(0deg); /* Safari and Chrome */
-  }
-  .menu-item-option {
-    width: 60px;
-    i {
-      margin-left: 3px;
-      font-size: 14px;
-      cursor: pointer;
-      color: #666666;
-    }
-    .el-icon-no-view {
-      height: 14px;
-      width: 14px;
-      background: url("../../../assets/login/close-eye.png") center center
-        no-repeat;
-      background-size: 100%;
-    }
-    .active {
-      color: #ccc;
-    }
-    .el-dropdown-link {
-      color: #0286df;
-      font-size: 12px;
-      i {
-        color: #0286df;
-        font-size: 12px;
-      }
-    }
-  }
-  .hover-col {
-    &:hover {
-      background-color: #ecf5ff;
-    }
-  }
-  .active {
-    background-color: #ecf5ff;
-  }
-  .is-open {
-    .el-icon-arrow-down {
-      transform: rotate(180deg);
-      -ms-transform: rotate(180deg); /* IE 9 */
-      -webkit-transform: rotate(180deg); /* Safari and Chrome */
-    }
-    .menu-item-child {
-      height: auto;
-    }
-  }
-}
-.el-menu-item {
-  display: flex;
-}
-.el-menu-item.is-active {
-  color: #303133 !important;
-}
-/deep/ .el-submenu__title {
-  display: flex !important;
-  align-items: center !important;
-  //   padding: 0 10px 0 10px !important;
-}
-.el-submenu__icon-arrow {
-  position: absolute !important;
-  top: 50% !important;
-  right: 8px !important;
-  margin-top: -7px !important;
-  -webkit-transition: -webkit-transform 0.3s !important;
-  transition: -webkit-transform 0.3s !important;
-  transition: transform 0.3s !important;
-  transition: transform 0.3s, -webkit-transform 0.3s !important;
-  font-size: 12px !important;
-}
-.menu-item-option {
-  span {
-    height: 50px;
-    display: inline-block;
-    i {
-      vertical-align: revert;
-    }
-  }
-}
-
-/deep/ .el-submenu .el-menu-item {
-  height: 50px;
-  line-height: 50px;
-  //   padding: 0 20px 0 60px !important;
-  padding: 0 20px 0 24px !important;
-  min-width: 200px;
-}
-</style>