eoss-ui 0.4.51 → 0.4.52

package/packages/login/src/main.vue

@@ -326,6 +326,8 @@ import {
   doQrLogin,
   getLoginCode,
   doCodeLogin,
+  getTwoFactorLoginCode,
+  doTwoFactorLogin,
   doWechatQrLogin,
   doCaLogin
 } from 'eoss-ui/src/config/api.js';
@@ -447,6 +449,14 @@ export default {
       type: String,
       default: doCodeLogin
     },
+    getTwoFactorLoginCode: {
+      type: String,
+      default: getTwoFactorLoginCode
+    },
+    doTwoFactorLogin: {
+      type: String,
+      default: doTwoFactorLogin
+    },
     doWechatQrLogin: {
       type: String,
       default: doWechatQrLogin
@@ -903,6 +913,7 @@ export default {
       this.app = res.appName || res.subsystemName;
       this.qrimg = res.qrimg || res.qrImg;
       this.loginModel = res.loginModel;
+      // this.loginModel = '0,3,11,6,9,2';
       this.loginBackgroundImg = res.loginBackgroundUrl
         ? res.loginBackgroundUrl.split(',')
         : null;
@@ -979,8 +990,9 @@ export default {
           return false;
         }
         data = {
-          target: this.formData.username,
+          username: this.formData.username,
           targetType: this.passModifyModel.indexOf('11') > -1 ? 'EMAIL' : 'SMS'
+          // targetType: 'SMS'
         };
       } else {
         if (!this.formData.target) {
@@ -1012,7 +1024,8 @@ export default {
       util
         .ajax({
           method: 'post',
-          url: this.getLoginCode,
+          url:
+            this.active == 2 ? this.getTwoFactorLoginCode : this.getLoginCode,
           data: data
         })
         .then((res) => {
@@ -1056,6 +1069,19 @@ export default {
                   identifyingCode: this.formData.identifyingCode,
                   identifyingId: this.identifyingId
                 }
+              : this.active == '2'
+              ? {
+                username: this.formData.username,
+                  password:
+                    this.secret && this.isEncrypt
+                      ? util.esmEncrypt({
+                          data: this.formData.password,
+                          key: this.secret
+                        })
+                      : this.formData.password,
+                      targetType: this.passModifyModel.indexOf('11') > -1 ? 'EMAIL' : 'SMS',
+                      verificationCode:this.formData.identifyingCode
+              }
               : {
                   target: this.formData.target,
                   verificationCode: this.formData.verificationCode,
@@ -1091,7 +1117,12 @@ export default {
       util
         .ajax({
           method: 'post',
-          url: this.active == '0' ? this.actionUrl : this.doCodeLogin,
+          url:
+            this.active == '0'
+              ? this.actionUrl
+              : this.active == '2'
+              ? this.doTwoFactorLogin
+              : this.doCodeLogin,
           data: extUserBindHandleId
             ? { ...data, extUserBindHandleId: extUserBindHandleId }
             : data

package/packages/main/src/main.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="es-main" :class="{ 'es-main-topside': modal === 'topside' }">
+  <div class="es-main" :class="{ 'es-main-topside': layout === 'topside' }">
     <div
       v-if="showHeader"
       class="es-main-header"
@@ -15,7 +15,7 @@
       <img
         class="es-main-logo"
         :src="logoUrl"
-        v-if="modal !== 'topside' && logoUrl && showDefault"
+        v-if="layout !== 'topside' && logoUrl && showDefault"
       />
       <div class="es-main-top-nav">
         <es-menu
@@ -23,9 +23,9 @@
           class="es-fourth-tabs"
           mode="horizontal"
           :icons="icons"
-          :popperClass="`el-menu--popup-${modal}`"
+          :popperClass="`el-menu--popup-${layout}`"
           :data="navs"
-          :deep="modal === 'topnav'"
+          :deep="layout === 'topnav'"
           :default-active="topActive"
           @select="
             (res) => {
@@ -73,8 +73,8 @@
       ></es-handler>
     </div>
     <div class="es-main-box" v-if="reset">
-      <div class="es-main-left" v-if="modal !== 'topnav' && showSide">
-        <div class="es-main-side" v-if="modal === 'topside'">
+      <div class="es-main-left" v-if="layout !== 'topnav' && showSide">
+        <div class="es-main-side" v-if="layout === 'topside'">
           <div class="es-main-side-logo">
             <img class="es-main-logo" :src="logoUrl" v-if="logoUrl" />
           </div>
@@ -110,6 +110,7 @@
         />
         <es-nav
           v-if="showMenu && showDefault"
+          :is-top="layout == 'topside'"
           :data="menu"
           :default-active="active"
           :width="navWidth"
@@ -121,7 +122,7 @@
           :is-default="isDefault"
           @open="
             (res) => {
-              handleSelect(res, 'menu');
+              handleSelect(res, 'menu', true);
             }
           "
           @trigger="
@@ -220,7 +221,9 @@
       :theme="color"
       :predefine="themes"
       :visible.sync="showSet"
+      :layout.sync="layout"
       @change="handleChange"
+      @layout="handleLayout"
     ></settings>
     <es-dialog
       v-if="showUserInfo"
@@ -389,10 +392,6 @@ export default {
     }
   },
   computed: {
-    //菜单类型
-    modal() {
-      return this.scene.toLowerCase();
-    },
     showHeader() {
       return this.isHeader == 0 ? false : this.header;
     },
@@ -416,10 +415,11 @@ export default {
       return true;
     },
     navWidth() {
-      return this.modal === 'topside' ? '230px' : undefined;
+      console.log(this.layout === 'topside' ? '230px' : undefined, 9000);
+      return this.layout === 'topside' ? '230px' : undefined;
     },
     showNavTitle() {
-      return this.modal !== 'topside';
+      return this.layout !== 'topside';
     },
     //tabs菜单
     fourthTabs() {
@@ -438,8 +438,8 @@ export default {
     //是否双列右侧菜单
     biserial() {
       if (
-        this.modal === 'subsystem' ||
-        this.modal === 'topside' ||
+        this.layout === 'subsystem' ||
+        this.layout === 'topside' ||
         this.application
       ) {
         return false;
@@ -449,13 +449,13 @@ export default {
     },
     //隐藏操作按键
     hide() {
-      if (this.modal === 'subsystem' || this.application) {
+      if (this.layout === 'subsystem' || this.application) {
         if (this.hides && Object.keys(this.hides).length) {
           return { ...this.hides, set: !this.set, system: false };
         } else {
           return { set: !this.set, system: false };
         }
-      } else if (this.modal === 'topside') {
+      } else if (this.layout === 'topside') {
         if (this.hides && Object.keys(this.hides).length) {
           return {
             ...this.hides,
@@ -517,6 +517,7 @@ export default {
   },
   data() {
     return {
+      layout: this.scene.toLowerCase(),
       showDefault: false,
       themeJSON: {
         logo: { comp: '', data: {} },
@@ -600,7 +601,8 @@ export default {
       defaultwjprops: {},
       isTabs: false,
       isHeader: '',
-      isSide: null
+      isSide: null,
+      navIds: null
     };
   },
   created() {
@@ -894,11 +896,22 @@ export default {
           }
         });
     },
-    jumpMenu(res) {
+    jumpMenu(res, flag) {
+      let ids;
       if (typeof res === 'string') {
-        res = res.split(',');
+        if (flag) {
+          ids = this.getId(this.menus, res, true);
+          if (!ids) {
+            this.$message.error('未在菜单栏中找到此地址');
+            return;
+          }
+        } else {
+          ids = res.split(',');
+        }
+      } else {
+        ids = res;
       }
-      this.setDefault(this.menus, res);
+      this.setDefault(this.menus, ids);
     },
     getId(arry, res, path) {
       if (!res) {
@@ -1012,6 +1025,7 @@ export default {
     },
     //设置默认左侧导航
     setMenu(res) {
+      console.log(9000);
       if (this.defaultActive && this.defaultActive.length) {
         this.isDefault = false;
         this.setDefault(res, this.defaultActive);
@@ -1035,14 +1049,16 @@ export default {
         } else {
           this.isDefault = false;
         }
-        if (this.modal === 'subsystem' || this.modal === 'topside') {
-          if (this.modal === 'subsystem') {
+        if (this.layout === 'subsystem' || this.layout === 'topside') {
+          if (this.layout === 'subsystem') {
+            this.navs = [];
             if (this.menuType === 'custom') {
               this.subsystem = this.customMenu;
             } else {
               this.subsystem = res;
             }
-          } else if (this.modal === 'topside') {
+          } else if (this.layout === 'topside') {
+            this.subsystem = [];
             if (this.menuType === 'custom') {
               this.navs = this.customMenu;
               this.topActive = res[0].id;
@@ -1064,21 +1080,23 @@ export default {
             this.title = res[0].text;
           }
           if (!this.isDefault) {
-            this.active = this.getFirst(this.menu[0]);
+            this.active = this.getFirst(this.menu[0]).id;
           }
-        } else if (this.modal === 'topnav') {
+        } else if (this.layout === 'topnav') {
           if (this.menuType === 'custom') {
             this.navs = this.customMenu;
-            this.topActive = this.getFirst(res[0]);
+            this.topActive = this.getFirst(res[0]).id;
           } else {
             this.navs = res;
-            this.topActive = this.getFirst(res[0]);
+            this.topActive = this.getFirst(res[0]).id;
           }
         } else {
+          this.nav = [];
+          this.subsystem = [];
           this.menu = res;
           if (!this.isDefault) {
             this.active = [this.menu[0].id];
-            let id = this.getFirst(this.menu[0]);
+            let id = this.getFirst(this.menu[0]).id;
             if (id && this.menu[0].id !== id) {
               this.active.push(id);
             } else {
@@ -1100,7 +1118,7 @@ export default {
       if (obj.children && obj.children.length) {
         return this.getFirst(obj.children[0]);
       } else if (obj.fourthTabs && obj.fourthTabs.length) {
-        if (this.modal === 'topnav') {
+        if (this.layout === 'topnav') {
           return this.getFirst(obj.fourthTabs[0]);
         } else {
           this.tabs = obj.fourthTabs;
@@ -1120,12 +1138,11 @@ export default {
               this.tabs[0]
             );
           }
-          return obj.id;
         }
       } else {
         this.handleJump(obj.url, obj.urlopenmode, obj);
       }
-      return obj.id;
+      return obj;
     },
     //遍历设置菜单气泡提醒
     setTips(obj) {
@@ -1175,14 +1192,15 @@ export default {
       this.active = '';
       this.getUrl(res, active);
       if (
-        this.modal === 'subsystem' ||
-        this.modal === 'subSystem' ||
-        this.modal === 'topnav' ||
-        this.modal === 'topNav' ||
-        this.modal === 'topside' ||
-        this.modal === 'topSide'
+        this.layout === 'subsystem' ||
+        this.layout === 'subSystem' ||
+        this.layout === 'topnav' ||
+        this.layout === 'topNav' ||
+        this.layout === 'topside' ||
+        this.layout === 'topSide'
       ) {
-        if (this.modal === 'subsystem' || this.modal === 'subSystem') {
+        if (this.layout === 'subsystem' || this.layout === 'subSystem') {
+          this.navs = [];
           if (this.menuType === 'custom') {
             this.subsystem = this.customMenu;
             this.sysId = active[0];
@@ -1191,11 +1209,12 @@ export default {
             this.sysId = active[0];
           }
         } else if (
-          this.modal === 'topnav' ||
-          this.modal === 'topNav' ||
-          this.modal === 'topside' ||
-          this.modal === 'topSide'
+          this.layout === 'topnav' ||
+          this.layout === 'topNav' ||
+          this.layout === 'topside' ||
+          this.layout === 'topSide'
         ) {
+          this.subsystem = [];
           if (this.menuType === 'custom') {
             this.navs = this.customMenu;
             this.topActive = active[0];
@@ -1218,6 +1237,8 @@ export default {
           }
         }
       } else {
+        this.navs = [];
+        this.subsystem = [];
         this.menu = res;
         if (this.biserial) {
           this.active = active.slice(
@@ -1275,30 +1296,42 @@ export default {
       let _url = params._baseUrl ? params._baseUrl : './primary.html';
       return util.urlJoinParams({ url: _url, param: obj });
     },
+    handleOpenNav(res) {
+      console.log(res, 777);
+    },
     //应用导航交互
-    handleSelect(res, type) {
+    handleSelect(res, type, open) {
+      console.log(type);
       const { node } = res;
-      if (
-        node.extendData &&
-        node.extendData.businessStatus == 0 &&
-        node.extendData.businessWarnMsg
-      ) {
-        this.$alert(node.extendData.businessWarnMsg, '提示', {
-          type: 'warning'
-        });
-        return;
+      if (!open) {
+        if (
+          node.extendData &&
+          node.extendData.businessStatus == 0 &&
+          node.extendData.businessWarnMsg
+        ) {
+          this.$alert(node.extendData.businessWarnMsg, '提示', {
+            type: 'warning'
+          });
+          return;
+        }
+        this.isDefault = false;
+        this.tabsId = '';
       }
-      this.isDefault = false;
-      this.tabsId = '';
       switch (type) {
         case 'nav':
           this.tabs = [];
           this.active = '';
-          if (this.modal === 'topside') {
+          if (this.layout === 'topside') {
+            this.navIds = [node.id];
             this.menu = node.children;
             this.title = node.text;
-            this.active = this.getFirst(node.children[0]);
+            let subNode = this.getFirst(node.children[0]);
+            if (subNode) {
+              this.active = subNode.id;
+              this.navIds = [node.id, ...this.getId(subNode.url)];
+            }
           } else {
+            this.navIds = this.getId(this.menus, node.url, true);
             if (node.url) {
               let tab = node.fourthTabs.filter((item) => {
                 return item.url === node.url;
@@ -1321,31 +1354,37 @@ export default {
           }
           break;
         case 'sys':
+          this.navIds = [node.id];
           this.tabs = [];
           this.menu = node.children;
           this.title = node.text;
-          this.active = this.getFirst(node.children[0]);
+          this.active = this.getFirst(node.children[0]).id;
           this.isSide = true;
           break;
         case 'sub':
+          this.navIds = [node.id];
           if (node.url) {
             this.tabs = [];
           }
           if (this.setFirstAsDefault) {
-            let id = this.getFirst(node);
-            if (node.id !== id) {
-              this.$set(this.active, 0, node.id);
-              this.$set(this.active, 1, id);
+            let subNode = this.getFirst(node);
+            this.$set(this.active, 0, node.id);
+            if (subNode && node.id !== subNode.id) {
+              console.log(subNode, subNode.url);
+              console.log(this.getId(this.menus, subNode.url, true));
+              this.$set(this.active, 1, subNode.id);
             }
           }
           break;
         case 'menu':
-          this.tabs = [];
-          if (this.setFirstAsDefault) {
-            if (this.biserial) {
-              this.$set(this.active, 1, node.id);
-            } else {
-              this.active = node.id;
+          if (!open) {
+            this.tabs = [];
+            if (this.setFirstAsDefault) {
+              if (this.biserial) {
+                this.$set(this.active, 1, node.id);
+              } else {
+                this.active = node.id;
+              }
             }
           }
           if (node.url) {
@@ -1575,6 +1614,27 @@ export default {
           break;
       }
     },
+    handleLayout(res, old) {
+      switch (res) {
+        case 'topnav':
+          this.navs = this.menus;
+          this.tabs = [];
+          this.subsystem = [];
+          switch (old) {
+            case 'subsystem':
+              break;
+            default:
+              this.topActive = this.active.length
+                ? this.active[this.active.length - 1]
+                : '';
+              console.log(this.active, this.topActive, 666);
+          }
+          break;
+      }
+      console.log(this.sysId, this.topActive, this.active, this.tabsId);
+      //this.setMenu(this.menus);
+      console.log(this.layout, old, this.hide);
+    },
     //监听改变菜单
     handleListener() {
       util.win.addEventListener(

package/packages/main/src/settings.vue

@@ -42,16 +42,51 @@
           content="顶部菜单布局"
           placement="bottom"
         >
-          <div class="es-setting-navs es-setting-top-nav"></div>
+          <div
+            class="es-setting-navs es-setting-top-nav"
+            @click.stop="handleLayout('topnav')"
+          >
+            <i class="es-icon-gou" v-show="activeName == 'topnav'"></i>
+          </div>
         </el-tooltip>
         <el-tooltip
           class="es-setting-navs-item"
           effect="dark"
-          content="侧边菜单布局"
+          content="侧边双列菜单布局"
           placement="bottom"
         >
-          <div class="es-setting-navs es-setting-side-nav">
+          <div
+            class="es-setting-navs es-setting-side-nav"
+            @click.stop="handleLayout('default')"
+          >
             <div class="es-setting-side-sub-nav"></div>
+            <i class="es-icon-gou" v-show="activeName == 'default'"></i>
+          </div>
+        </el-tooltip>
+        <el-tooltip
+          class="es-setting-navs-item"
+          effect="dark"
+          content="子系统+侧边菜单布局"
+          placement="bottom"
+        >
+          <div
+            class="es-setting-navs es-setting-subsystem-nav"
+            @click.stop="handleLayout('subsystem')"
+          >
+            <i class="es-icon-gou" v-show="activeName == 'subsystem'"></i>
+          </div>
+        </el-tooltip>
+        <el-tooltip
+          class="es-setting-navs-item"
+          effect="dark"
+          content="顶部+侧边菜单布局"
+          placement="bottom"
+        >
+          <div
+            class="es-setting-navs es-setting-top-side-nav"
+            @click.stop="handleLayout('topside')"
+          >
+            <i class="es-icon-gou" v-show="activeName == 'topside'"></i>
           </div>
         </el-tooltip>
       </div>
@@ -74,6 +109,10 @@ export default {
       default() {
         return ['#a60006', '#409eff'];
       }
+    },
+    layout: {
+      type: String,
+      default: 'default'
     }
   },
   computed: {
@@ -110,7 +149,8 @@ export default {
   },
   data() {
     return {
-      color: ''
+      color: '',
+      activeName: this.layout
     };
   },
   mounted() {},
@@ -124,6 +164,13 @@ export default {
       this.color = res;
       this.$emit('change', { type: 'theme', value: res });
       //this.setTheme(res);
+    },
+    //选择菜单布局
+    handleLayout(res) {
+      let old = this.activeName;
+      this.activeName = res;
+      this.$emit('update:layout', res);
+      this.$emit('layout', res, old);
     }
   }
 };

package/packages/nav/src/main.vue

@@ -19,7 +19,7 @@
     </div>
     <div
       class="es-nav-main"
-      :style="{ width: biserial ? width : '' }"
+      :style="{ width: biserial ? width : boxWidth }"
       v-show="biserial ? subMenu.length : menu.length"
     >
       <div class="es-nav-title" v-if="showTitle">
@@ -43,7 +43,7 @@
         :data="biserial ? subMenu : menu"
         :collapse="isCollapse"
         :default-active="menuActive"
-        :width="menuWidth"
+        :width="isTop ? boxWidth : menuWidth"
         :style="{ height: menuHeight }"
         :is-default="isDefault"
         :biserial="biserial"
@@ -60,6 +60,7 @@ export default {
   name: 'EsNav',
   inheritAttrs: false,
   props: {
+    isTop: Boolean,
     data: {
       type: Array,
       default: []
@@ -96,17 +97,23 @@ export default {
       return true;
     },
     subActive() {
-      return this.biserial && this.defaultActive && this.defaultActive[0]
-        ? this.defaultActive[0]
-        : '';
+      let active =
+        this.biserial &&
+        Array.isArray(this.defaultActive) &&
+        this.defaultActive.length
+          ? this.defaultActive[0]
+          : undefined;
+      console.log(active, 555);
+      return active;
     },
     menuActive() {
-      let active = '';
-      active =
-        typeof this.defaultActive === 'string'
+      let active =
+        this.defaultActive === 'string'
           ? this.defaultActive
-          : this.defaultActive &&
-            this.defaultActive[this.defaultActive.length - 1];
+          : this.defaultActive.length
+          ? this.defaultActive[this.defaultActive.length - 1]
+          : undefined;
+      console.log(active, 444);
       return active;
     },
     boxWidth() {
@@ -132,6 +139,11 @@ export default {
         this.headline = val;
       }
     },
+    biserial: {
+      handler(val) {
+        this.isShow = !val;
+      }
+    },
     defaultActive: {
       immediate: true,
       deep: true,