1
dengjunjie
9 天以前 72390e0230b64cd43fedf0ba8e17aba097568a4a
´úÂë¹ÜÀí/WMS/WIDESEA_WMSClient/src/views/system/Sys_Menu.vue
@@ -1,14 +1,32 @@
<template>
  <div class="menu-container">
    <!-- <el-input/> -->
    <vol-box :width="940" :mask="true" :height="500" title="图标列表" v-model="model">
    <vol-box
      :width="940"
      :mask="true"
      :height="500"
      title="图标列表"
      v-model="model"
    >
      <Icons :onSelect="onSelect"></Icons>
      <template #footer>
        <el-button type="primary" size="mini" @click="model = false">ç¡® è®¤</el-button>
        <el-button type="primary" size="mini" @click="model = false"
          >ç¡® è®¤</el-button
        >
      </template>
    </vol-box>
    <vol-box :width="600" :mask="true" :height="270" title="其他权限" v-model="actionModel">
      <vol-form ref="actionForm" :formRules="actionOptions" :formFields="actionFields">
    <vol-box
      :width="600"
      :mask="true"
      :height="270"
      title="其他权限"
      v-model="actionModel"
    >
      <vol-form
        ref="actionForm"
        :formRules="actionOptions"
        :formFields="actionFields"
      >
        <template #header>
          <div>
            <el-alert show-icon type="success">
@@ -20,7 +38,9 @@
        </template>
      </vol-form>
      <template #footer>
        <el-button type="primary" size="mini" @click="otherAction">ç¡® è®¤</el-button>
        <el-button type="primary" size="mini" @click="otherAction"
          >ç¡® è®¤</el-button
        >
      </template>
    </vol-box>
@@ -28,12 +48,21 @@
    <div class="menu-left">
      <div class="m-title"><i class="el-icon-warning-outline"></i>菜单列表</div>
      <el-scrollbar style="height: 100%; width: 200px">
        <VolMenu :onSelect="getTreeItem" :list="tree" :isCollapse="false"></VolMenu>
        <VolMenu
          :onSelect="getTreeItem"
          :list="tree"
          :isCollapse="false"
        ></VolMenu>
      </el-scrollbar>
    </div>
    <div class="menu-right">
      <el-scrollbar style="height: 100%">
        <el-alert title="菜单配置说明" type="warning" :closable="false" show-icon>
        <el-alert
          title="菜单配置说明"
          type="warning"
          :closable="false"
          show-icon
        >
          <div>
            1、如果是用代码生器生成的Vue页面,Url为Vue项目中src->router->viewGrid.js对应表名的path属性
          </div>
@@ -42,31 +71,56 @@
          </div>
        </el-alert>
        <div style="padding: 0px 30px 0 20px">
          <vol-form class="form-content" ref="form" :formRules="options" :formFields="fields">
          <vol-form
            class="form-content"
            ref="form"
            :formRules="options"
            :formFields="fields"
          >
          </vol-form>
          <div>
            <div class="auth-group">
              <label style="width: 100px">权限按钮:</label>
              <div class="ck">
                <el-checkbox-group v-model="actions">
                  <el-checkbox v-for="(item, index) in action" :key="index" :label="item.value">{{ item.text + "(" +
                    item.value + ")" }}</el-checkbox>
                  <el-checkbox
                    v-for="(item, index) in action"
                    :key="index"
                    :label="item.value"
                    >{{ item.text + "(" + item.value + ")" }}</el-checkbox
                  >
                </el-checkbox-group>
              </div>
            </div>
          </div>
          <div style="padding-left: 100px">
            <el-button @click="handleCheckAll" size="mini" type="success" plain><i class="el-icon-check"></i>全
              é€‰</el-button>
            <el-button @click="actionModel = true" size="mini" type="primary" plain><i
                class="el-icon-plus"></i>其他权限</el-button>
            <el-button @click="handleCheckAll" size="mini" type="success" plain
              ><i class="el-icon-check"></i>全 é€‰</el-button
            >
            <el-button
              @click="actionModel = true"
              size="mini"
              type="primary"
              plain
              ><i class="el-icon-plus"></i>其他权限</el-button
            >
          </div>
          <div class="m-btn">
            <el-button type="primary" @click="save"><i class="el-icon-check"></i>保存</el-button>
            <el-button type="success" @click="add"><i class="el-icon-plus"></i>新建</el-button>
            <el-button type="warning" @click="addChild"><i class="el-icon-plus"></i>添加子级</el-button>
            <el-button type="primary" plain @click="addBrother"><i class="el-icon-circle-plus"></i> æ·»åŠ åŒçº§</el-button>
            <el-button type="warning" plain @click="delMenu"><i class="el-icon-delete"></i> åˆ é™¤èœå•</el-button>
            <el-button type="primary" @click="save"
              ><i class="el-icon-check"></i>保存</el-button
            >
            <el-button type="success" @click="add"
              ><i class="el-icon-plus"></i>新建</el-button
            >
            <el-button type="warning" @click="addChild"
              ><i class="el-icon-plus"></i>添加子级</el-button
            >
            <el-button type="primary" plain @click="addBrother"
              ><i class="el-icon-circle-plus"></i> æ·»åŠ åŒçº§</el-button
            >
            <el-button type="warning" plain @click="delMenu"
              ><i class="el-icon-delete"></i> åˆ é™¤èœå•</el-button
            >
          </div>
        </div>
      </el-scrollbar>
@@ -176,7 +230,11 @@
        tigger = true;
        let menuId = this.fields.menuId;
        this.http
          .post("/api/Sys_Menu/delMenu?menuId=" + menuId, {}, "正在删除数据....")
          .post(
            "/api/Sys_Menu/delMenu?menuId=" + menuId,
            {},
            "正在删除数据...."
          )
          .then((x) => {
            if (!x.status) return this.$Message.error(x.message);
            this.$refs.form.reset();
@@ -227,7 +285,7 @@
            orderNo: this.fields.orderNo,
            parentId: this.fields.parentId,
          });
          console.log(this.tree)
          console.log(this.tree);
        });
      });
    },
@@ -246,11 +304,9 @@
    onOpenChange(node) {
      if (node.length == 0) return;
      this.getTreeItem(node[node.length > 1 ? node.length - 1 : 0]);
    }
    },
  },
  created(){
  },
  created() {},
  setup() {
    const tree = ref([]);
    const actionValues = ref([]);
@@ -270,10 +326,10 @@
    });
    const initTree = () => {
      http.post("/api/Sys_Menu/getMenu", {}, true).then((x) => {
        x.forEach(item => {
          item.icon = 'el-icon-menu';
        })
        x.forEach((item) => {
          item.icon = "el-icon-menu";
        });
        tree.value = x;
      });
    };
@@ -294,9 +350,7 @@
      icon: "",
      orderNo: "",
      enable: 1,
      createDate: "",
      creator: "",
      modifyDate: "",
      menuType: 0,
    });
    const actionFields = ref({
@@ -379,19 +433,17 @@
            { key: 0, value: "禁用" },
          ],
        },
        // {
        //   // 2022.03.26增移动端加菜单类型
        //   title: "菜单类型",
        //   field: "menuType",
        //   required: true,
        //   type: "select",
        //   colSize: 4,
        //   data: [
        //     { key: 1, value: "WCS菜单" },
        //     { key: 0, value: "WMS菜单" },
        //     { key: 99, value: "共用" }
        //   ],
        // },
        {
          title: "菜单类型",
          field: "menuType",
          required: true,
          type: "select",
          colSize: 4,
          data: [
            { key: 0, value: "PC端菜单" },
            { key: 1, value: "移动端菜单" },
          ],
        },
        {
          title: "图标Icon",
          field: "icon",
@@ -426,33 +478,35 @@
    ]);
    const refForm = ref();
    const getTreeItem = (node) => {
      http.post("api/Sys_Menu/getTreeItem?menuId=" + node, {}, true).then((x) => {
        try {
          fields.value.icon = x.icon;
          if (x.auth) {
            x.auth = JSON.parse(x.auth);
            action.value.splice(8, action.value.length);
      http
        .post("api/Sys_Menu/getTreeItem?menuId=" + node, {}, true)
        .then((x) => {
          try {
            fields.value.icon = x.icon;
            if (x.auth) {
              x.auth = JSON.parse(x.auth);
              action.value.splice(8, action.value.length);
            actions.value = x.auth.map((element) => {
              if (actionValues.value.indexOf(element.value) == -1) {
                action.value.push(element);
              }
              return element.value;
            });
          } else {
            action.value.splice(8, action.value.length);
              actions.value = x.auth.map((element) => {
                if (actionValues.value.indexOf(element.value) == -1) {
                  action.value.push(element);
                }
                return element.value;
              });
            } else {
              action.value.splice(8, action.value.length);
              x.auth = [];
              fields.value.icon = "";
              actions.value = [];
            }
          } catch (error) {
            console.log("菜单功能权限转换成JSON失败:" + x.auth);
            x.auth = [];
            fields.value.icon = "";
            //   this.icon = "";
            actions.value = [];
          }
        } catch (error) {
          console.log("菜单功能权限转换成JSON失败:" + x.auth);
          x.auth = [];
          //   this.icon = "";
          actions.value = [];
        }
        refForm.value.reset(x);
      });
          refForm.value.reset(x);
        });
    };
    return {
      tree,
@@ -468,7 +522,7 @@
      actionOptions,
      options,
      form: refForm,
      getTreeItem
      getTreeItem,
    };
  },
  data() {
@@ -521,7 +575,7 @@
      margin-top: 1px;
    }
    >div {
    > div {
      float: left;
    }
  }