eoss-ui 0.6.0 → 0.6.10

package/packages/login/src/main.vue

@@ -28,54 +28,100 @@
         class="es-login-main"
         :style="getBackground(loginMainImg)"
         :class="{
-          'es-switchs': switchs > 2
+          'es-models': modelLength > 2 && mode !== 'complex',
+          'es-complex': mode == 'complex'
         }"
       >
+        <div class="es-login-complex-title" v-if="mode == 'complex'">
+          欢迎登录
+        </div>
         <div
-          v-if="switchs > 1"
+          v-if="modelLength > 1 || mode == 'complex'"
           :class="{
-            'es-login-switch': switchs == 2,
-            'es-login-switchs': switchs > 2 || (switchs == 2 && loginTitleImg)
+            'es-login-models': modelLength > 2 && mode !== 'complex',
+            'es-login-model': modelLength == 2 || mode == 'complex'
           }"
         >
-          <i
-            v-for="(item, index) in icons"
-            v-show="switchs > 2 || active != item.type"
-            @click="switchLogin(item)"
-            :title="switchs > 2 ? item.name : ''"
-            :key="index"
-            :class="[
-              item.icon,
-              'es-icon',
-              { 'es-icon-active': active == item.type }
-            ]"
-          ></i>
+          <template v-if="this.mode == 'complex'">
+            <template v-for="item in switchs">
+              <div
+                v-if="item.tips"
+                v-show="active != item.type"
+                class="es-login-model-tips"
+                :key="item.type + '_0'"
+                :style="getBackground(item.background)"
+              >
+                {{ item.tips }}
+              </div>
+              <span
+                v-show="switchActive != item.type"
+                class="es-icon-box"
+                @click="switchLoginType(item)"
+                :title="modelLength > 2 ? item.name : ''"
+                :key="item.type + '_1'"
+              >
+                <i :class="[item.icon, 'es-icon']"></i>
+              </span>
+            </template>
+          </template>
+          <template v-else>
+            <span
+              v-for="(item, index) in icons"
+              v-show="modelLength > 2 || active != item.type"
+              class="es-icon-box"
+              @click="switchLogin(item)"
+              :title="modelLength > 2 ? item.name : ''"
+              :key="index"
+              :class="[{ 'es-icon-active': active == item.type }]"
+            >
+              <i :class="[item.icon, 'es-icon']"></i>
+            </span>
+          </template>
         </div>
         <div v-if="loginTitleImg" class="es-login-title-image">
           <img class="es-login-title-img" :src="loginTitleImg" />
         </div>
+        <template v-else-if="mode !== 'complex'">
+          <slot name="login-title" :type="active">
+            <div class="es-login-title">
+              <span class="es-login-title-content">{{ title }}</span>
+            </div>
+          </slot>
+        </template>
         <div class="es-login-form-box">
+          <div
+            v-if="mode == 'complex'"
+            class="es-login-complex-models"
+            :class="{ 'es-complex-title': active == '3' }"
+          >
+            <template v-if="active == '3'">
+              <div class="es-login-complex-models-item es-active">
+                {{ title }}
+              </div>
+            </template>
+            <template v-else>
+              <template v-for="item in icons">
+                <div
+                  v-if="item.type !== '3'"
+                  class="es-login-complex-models-item"
+                  :class="{ 'es-active': active == item.type }"
+                  :key="item.type"
+                  @click="switchLogin(item)"
+                >
+                  {{ item.name }}
+                </div>
+              </template>
+            </template>
+          </div>
           <template v-if="isShow(active) && (active == 0 || active == 12)">
             <el-form
               :ref="'login' + active"
               class="es-login-form"
               :model="formData"
             >
-              <template v-if="!loginTitleImg">
-                <slot name="login-title" :type="active">
-                  <div class="es-login-title">
-                    <span class="es-login-title-content">{{ title }}</span>
-                  </div>
-                </slot>
-              </template>
-              <el-form-item
-                size="large"
-                prop="username"
-                :rules="username.rules"
-              >
+              <el-form-item prop="username" :rules="username.rules">
                 <es-input
                   v-model="formData.username"
-                  size="large"
                   type="text"
                   name="username"
                   tabindex="1"
@@ -90,14 +136,9 @@
                   </template>
                 </es-input>
               </el-form-item>
-              <el-form-item
-                size="large"
-                prop="password"
-                :rules="password.rules"
-              >
+              <el-form-item prop="password" :rules="password.rules">
                 <el-input
                   v-model="formData.password"
-                  size="large"
                   name="password"
                   tabindex="2"
                   type="password"
@@ -113,7 +154,6 @@
                 </el-input>
               </el-form-item>
               <el-form-item
-                size="large"
                 prop="identifyingCode"
                 :rules="[
                   {
@@ -125,7 +165,6 @@
                 v-if="imgCode || showVerifyCode"
               >
                 <el-input
-                  size="large"
                   name="identifyingCode"
                   tabindex="3"
                   type="text"
@@ -138,14 +177,6 @@
                     <i class="es-icon-yanzheng es-label-code-image"></i>
                   </template>
                   <template slot="suffix">
-                    <el-button
-                      class="es-get-code"
-                      type="primary"
-                      v-show="active == 12 && showVerifyCode"
-                      :disabled="disabled"
-                      @click.stop="getCode"
-                      >{{ btnText }}</el-button
-                    >
                     <img
                       v-show="imgCode && (active == '0' || active == '12')"
                       class="es-img-code"
@@ -155,36 +186,34 @@
                   </template>
                 </el-input>
               </el-form-item>
-              <div class="es-password-handle" v-show="remember && forget">
-                <el-checkbox
-                  v-show="remember && (active == '0' || active == '12')"
-                  v-model="checked"
-                  >记住密码</el-checkbox
-                >
-                <div v-show="forget" class="es-password-forget">
-                  <span @click="handleForget">修改密码</span>
+              <div>
+                <div class="es-password-handle">
+                  <el-checkbox
+                    v-show="remember && (active == '0' || active == '12')"
+                    v-model="checked"
+                    >记住密码</el-checkbox
+                  >
+                  <div v-show="forget" class="es-password-forget">
+                    <span @click="handleForget">修改密码</span>
+                  </div>
                 </div>
+                <el-button
+                  class="es-button-submit"
+                  type="primary"
+                  @click="handleLogin"
+                  >登录</el-button
+                >
               </div>
-              <el-button
-                class="es-button-submit"
-                type="primary"
-                @click="handleLogin"
-                >登录</el-button
-              >
             </el-form>
           </template>
           <template
             v-if="isShow(active) && (active == 3 || active == 7 || active == 9)"
           >
-            <div class="es-login-qrcode">
-              <template v-if="!loginTitleImg">
-                <slot name="login-title" :type="active">
-                  <div class="es-login-title">
-                    <span class="es-login-title-content">{{ title }}</span>
-                  </div>
-                </slot>
-              </template>
-              <div class="es-login-down-app">
+            <div
+              class="es-login-qrcode"
+              :class="{ 'es-login-qrcode-complex': mode == 'complex' }"
+            >
+              <div class="es-login-down-app" v-if="mode !== 'complex'">
                 打开
                 <template v-if="active == 3">
                   <a
@@ -205,20 +234,53 @@
                   >{{ active == 7 ? '钉钉' : '微信' }}app </span
                 >，扫描二维码
               </div>
-              <es-qr-code
-                :content="identifyingId"
-                :logo="qrimg"
-                auto
-                v-if="active == 3 && identifyingId"
-              ></es-qr-code>
-              <div class="es-wx-qrcode-box" v-if="active == 9">
-                <es-wxlogin
-                  href="data:text/css;base64,LmltcG93ZXJCb3ggLnFyY29kZSB7CiAgICB3aWR0aDogMTAwJSAhaW1wb3J0YW50OwogICAgYm94LXNpemluZzogYm9yZGVyLWJveCAhaW1wb3J0YW50OwogICAgbWFyZ2luOiAwICFpbXBvcnRhbnQ7Cn0KCi5pbXBvd2VyQm94IC5pbmZvLAouaW1wb3dlckJveCAudGl0bGUgewogICAgZGlzcGxheTogbm9uZSAhaW1wb3J0YW50Owp9"
+              <div class="es-login-qrcode-box">
+                <es-qr-code
+                  :content="identifyingId"
+                  :logo="qrimg"
                   auto
-                  :appid="wechatAppid"
-                  :scope="wechatScope"
-                  :redirect_uri="redirectUri"
-                ></es-wxlogin>
+                  v-if="active == 3 && identifyingId"
+                ></es-qr-code>
+                <div class="es-wx-qrcode-box" v-if="active == 9">
+                  <es-wxlogin
+                    href="data:text/css;base64,LmltcG93ZXJCb3ggLnFyY29kZSB7CiAgICB3aWR0aDogMTAwJSAhaW1wb3J0YW50OwogICAgYm94LXNpemluZzogYm9yZGVyLWJveCAhaW1wb3J0YW50OwogICAgbWFyZ2luOiAwICFpbXBvcnRhbnQ7Cn0KCi5pbXBvd2VyQm94IC5pbmZvLAouaW1wb3dlckJveCAudGl0bGUgewogICAgZGlzcGxheTogbm9uZSAhaW1wb3J0YW50Owp9"
+                    auto
+                    :appid="wechatAppid"
+                    :scope="wechatScope"
+                    :redirect_uri="redirectUri"
+                  ></es-wxlogin>
+                </div>
+              </div>
+              <div
+                v-if="active == 3 && mode == 'complex'"
+                class="es-login-complex-app"
+              >
+                <div class="es-login-complex-scan">
+                  <i class="es-icon-scan"></i>
+                  <span class="es-login-complex-scan-tips"
+                    >打开app<br />扫一扫登录</span
+                  >
+                </div>
+                <div class="es-login-complex-download">
+                  <a
+                    class="es-login-app-name es-pointer"
+                    target="_blank"
+                    :href="downloadApp"
+                    v-if="downloadApp"
+                    >下载app</a
+                  >
+                  <span
+                    class="es-login-app-name es-pointer"
+                    v-else
+                    @click="handleDownLoadApp"
+                    >下载app
+                  </span>
+                </div>
+              </div>
+              <div v-if="active == 3 && mode == 'complex'" class="es-to-login">
+                <span class="es-pointer" @click="switchLoginType()"
+                  >账号登录<i class="es-icon-youbian"></i
+                ></span>
               </div>
             </div>
           </template>
@@ -228,21 +290,12 @@
               class="es-login-form es-login-verify"
               :model="formData"
             >
-              <template v-if="!loginTitleImg">
-                <slot name="login-title" :type="active">
-                  <div class="es-login-title">
-                    <span class="es-login-title-content">{{ title }}</span>
-                  </div>
-                </slot>
-              </template>
               <el-form-item
-                size="large"
                 prop="target"
                 :rules="active == 6 ? phone.rules : email.rules"
               >
                 <el-input
                   v-model="formData.target"
-                  size="large"
                   type="text"
                   name="target"
                   tabindex="4"
@@ -257,18 +310,16 @@
                 </el-input>
               </el-form-item>
               <el-form-item
-                size="large"
                 prop="verificationCode"
                 :rules="[{ required: true, message: '验证码不能为空' }]"
               >
                 <el-input
-                  size="large"
                   name="verificationCode"
                   type="text"
                   v-model="formData.verificationCode"
                   placeholder="请输入验证码"
                   autocomplete="off"
-                  class="es-label-image-code"
+                  class="es-label-image-code es-label-get-code"
                   tabindex="5"
                 >
                   <template slot="prefix">
@@ -285,31 +336,35 @@
                   </template>
                 </el-input>
               </el-form-item>
-              <div class="es-password-handle" v-show="remember || forget">
-                <el-checkbox
-                  v-show="remember && active == '0'"
-                  v-model="checked"
-                  >记住密码</el-checkbox
-                >
-                <div
-                  v-show="forget"
-                  class="es-password-forget"
-                  @click="handleForget"
-                >
-                  忘记密码？
+              <div>
+                <div class="es-password-handle">
+                  <el-checkbox
+                    v-show="remember && active == '0'"
+                    v-model="checked"
+                    >记住密码</el-checkbox
+                  >
+                  <div
+                    v-show="forget"
+                    class="es-password-forget"
+                    @click="handleForget"
+                  >
+                    修改密码
+                  </div>
                 </div>
+                <el-button
+                  class="es-button-submit"
+                  type="primary"
+                  @click="handleLogin"
+                  >登录</el-button
+                >
               </div>
-              <el-button
-                class="es-button-submit"
-                type="primary"
-                @click="handleLogin"
-                >登录</el-button
-              >
             </el-form>
           </template>
-          <div class="es-downloadSetup" v-if="downloadSetup">
+          <div class="es-downloadSetup" v-if="downloadSetup || $slots.button">
             <slot name="button"></slot>
-            <span @click="downloadExe">初次使用请下载一键安装包</span>
+            <span class="es-setup" @click="downloadExe"
+              >初次使用请下载一键安装包</span
+            >
           </div>
           <div class="es-warning" v-if="warnInfo">
             {{ warnInfo }}
@@ -419,6 +474,29 @@ export default {
       type: String,
       default: 'default'
     },
+    switchs: {
+      type: Array,
+      default() {
+        return [
+          {
+            type: '0',
+            icon: 'es-icon-zhuomian'
+          },
+          {
+            type: '3',
+            name: '手机扫码登录',
+            icon: 'es-icon-qrcode',
+            tips: '扫码登陆在这里',
+            background:
+              'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAAAoCAYAAAA2cfJIAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDA2IDc5LmRhYmFjYmIsIDIwMjEvMDQvMTQtMDA6Mzk6NDQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyMi40IChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjZFRTVERTUxQzRDMzExRUY4NkFGQ0U2RDY3NEFERkI0IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjZFRTVERTUyQzRDMzExRUY4NkFGQ0U2RDY3NEFERkI0Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NkVFNURFNEZDNEMzMTFFRjg2QUZDRTZENjc0QURGQjQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NkVFNURFNTBDNEMzMTFFRjg2QUZDRTZENjc0QURGQjQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz64XoEfAAAB/UlEQVR42uycOUsDQRiG99vdHJ4JHhFN1EhEQkBsRVACghBbKytBf4OiNrZipQHtRLASsbJIQDQGBVHBysIDAxIvPBCCGpO4ZvwWrCT+gZ33gWV2mam+95mZPWDpcGZYCYQjY4oQs0Y+lxDF4qcCLAFpWrVud/QqRJOpZHy55Jjn3dUODv/oJXU+krm9vkPZrIXL29JU2x5aIaIeluDyb7/KxyDP/C2Eb00yd+l7znfHzLlUvymAk5f9LEplXYRhPHHT8J8AQGIgAAQAEABAAAABAAQAEABAAAABAAQAEABYAiGKBW66A+FIGQSQkIfTk3UjnzM/+G2zBDUQQDK+C3kjfZic+cp+XPHlPkvQCgGk2waESB/vRfNvmdivBJ0QQEJuTw7Wsq/PS7/bQRgCSEjh4/2GlwTNXAAggGS4m9uaXT7/vEI0mkrGExBAIqoafZ6ato5FIprg8DdxDyAR5bUed317KEqqusDhr+ApQCLsFZXOhlDXPGnaBoc/h/cAkuEJdg2pmp7i0+m/fRBAAnjPt3FzxrNfQAAAAQAEABAAQAAAASAAgAAAAgAIAGQVIEeqWo5SWBfSdQ83j/8JENMdzgGXz+9FqayH+ZMozrefT+Ol+nXzz1GBcGS8LhBcdvv8iaJhPKJsFlnebTavbnf0KURTnPNFqTE/AgwAPZCY5D/YjJ4AAAAASUVORK5CYII='
+          }
+        ];
+      }
+    },
+    switchsActive: {
+      type: String,
+      default: '0'
+    },
     launch: Boolean,
     param: {
       type: Object,
@@ -676,7 +754,7 @@ export default {
       }
       return '本系统为非涉密系统，禁止上传和处理任何涉密文件';
     },
-    switchs() {
+    modelLength() {
       return Array.isArray(this.loginModel)
         ? this.loginModel.length
         : this.loginModel.split(',').length;
@@ -862,7 +940,8 @@ export default {
       showLaunch: false,
       launchImages: this.launchImage,
       launchKey: 'day',
-      launchTime: 3000
+      launchTime: 2000,
+      switchActive: this.switchsActive
     };
   },
   beforeCreate() {
@@ -1071,6 +1150,23 @@ export default {
         this.$refs[ref] && this.$refs[ref].clearValidate();
       });
     },
+    switchLoginType(res) {
+      this.countdown = 0;
+      if (res) {
+        this.active = res.type;
+        this.title = res.name || '';
+        this.switchActive = res.type;
+      } else {
+        this.active = this.switchs[0].type;
+        this.title = '';
+        this.switchActive = this.switchs[0].type;
+      }
+      this.$emit('change-type', res, this.identifyingId);
+      this.$nextTick(() => {
+        let ref = 'login' + this.active;
+        this.$refs[ref] && this.$refs[ref].clearValidate();
+      });
+    },
     isShow(res) {
       return this.loginModel.indexOf(res) > -1;
     },

package/packages/main/src/default/index.vue

@@ -654,16 +654,7 @@ export default {
       this.isLoadHomePage = false;
     }
     this.isHeader = params.header;
-    let sysLogoIco = sessionStorage.getItem('sysLogoIco');
-    sysLogoIco && util.setFavicon(sysLogoIco);
 
-    let mainConfig = util.getStorage('mainConfig');
-    if (mainConfig) {
-      const results = JSON.parse(mainConfig);
-      if (Object.keys(results).length) {
-        this.init(results);
-      }
-    }
     this.doorIndex = sessionStorage.getItem('doorIndex');
   },
   mounted() {
@@ -869,7 +860,7 @@ export default {
           util.setStorage('loginPage', results[i]);
         }
         if (i === 'sysLogoIco' && results[i]) {
-          sessionStorage.setItem('sysLogoIco', results[i]);
+          localStorage.setItem('sysLogoIco', results[i]);
           util.setFavicon(results[i]);
         }
         if (i === 'userStyle' && results[i] && results[i].color) {
@@ -1994,6 +1985,7 @@ export default {
                 this.notice = data[i];
                 if (this.showMsg) {
                   this.$refs.message.getMsg(true);
+                  this.$emit('bus-emit', 'waitdone');
                 }
               }
               if (i === 'menuTipsMap') {

package/packages/main/src/default/message.vue

@@ -52,6 +52,7 @@
       :visible.sync="dialog.show"
       :url="dialog.url"
       :param="dialog.params"
+      @close="handleClose"
     ></es-dialog>
   </el-drawer>
 </template>
@@ -207,7 +208,15 @@ export default {
       this.count -= 1;
       this.msgs.splice(index, 1);
       if (this.winopen) {
-        util.win.open(item.handlerUrl);
+        const mywin = util.win.open(item.handlerUrl);
+        if (mywin) {
+          let times = setInterval(() => {
+            if (mywin.closed) {
+              clearInterval(times);
+              this.$parent.$emit('bus-emit', 'waitdone');
+            }
+          }, 1000);
+        }
       } else {
         this.dialog = {
           show: true,
@@ -231,6 +240,9 @@ export default {
         this.$emit('handle', id);
       }
       this.dialog.show = false;
+    },
+    handleClose() {
+      this.$parent.$emit('bus-emit', 'waitdone');
     }
   }
 };

package/packages/main/src/default/notice.vue

@@ -34,7 +34,7 @@
         </div>
         <div
           class="es-notice-footer"
-          style="display:flex;justify-content: space-between;"
+          style="display: flex; justify-content: space-between"
         >
           <span @click="handleIgnoreAll">忽略全部</span
           ><span @click="afterEnter">我知道了</span>
@@ -48,6 +48,7 @@
         :visible.sync="dialog.show"
         :url="dialog.url"
         :param="dialog.params"
+        @close="handleClose"
       ></es-dialog>
     </div>
   </transition>
@@ -104,13 +105,13 @@ export default {
         .ajax({
           url: ignoreAllSysMsg
         })
-        .then(res => {
+        .then((res) => {
           this.count = 0;
           this.msgs = [];
           this.$emit('ignore', { type: 'ignore', value: 'all' });
           this.$emit('opened', false);
         })
-        .catch(err => {
+        .catch((err) => {
           if (err.message && err.message !== 'canceled') {
             this.$message.error(err.message);
           }
@@ -119,7 +120,15 @@ export default {
     //处理消息
     handleMessage(item, index) {
       if (item.urlopenmode === 1 || this.winopen) {
-        util.win.open(item.handlerUrl);
+        const mywin = util.win.open(item.handlerUrl);
+        if (mywin) {
+          let times = setInterval(() => {
+            if (mywin.closed) {
+              clearInterval(times);
+              this.$parent.$emit('bus-emit', 'waitdone');
+            }
+          }, 1000);
+        }
       } else {
         this.dialog = {
           show: true,
@@ -139,6 +148,9 @@ export default {
         this.msgs = this.msgs.splice(this.index, 1);
       }
       this.dialog.show = false;
+    },
+    handleClose() {
+      this.$parent.$emit('bus-emit', 'waitdone');
     }
   }
 };