eoss-ui 0.5.81-beta2 → 0.5.81-beta20

package/packages/main/src/simplicity/menu-list.vue

@@ -1,45 +1,81 @@
 <template>
-  <el-scrollbar>
+  <el-scrollbar class="es-simplicity-menus-scrollbar">
     <div
-      class="es-simplicity-menus-item"
-      v-for="(item, index) in data"
-      :key="item.id"
-      :class="{ 'is-active': active === item.id }"
-      @click="handleClick(item)"
+      class="es-simplicity-menus-lists"
+      :class="{ 'is-fold': fold }"
+      @mouseleave="handleOut(true)"
+      @mouseenter="handleOut(false)"
     >
-      <es-icon
-        class="es-simplicity_apps-icon"
-        :style="setStyle(index)"
-        :contents="item.icons || item.icon || menuIcon"
-      ></es-icon>
-      <div class="es-simplicity-menus-tips" v-if="item.tips">
-        {{ item.tips > 99 ? '99+' : item.tips }}
-      </div>
-      <div class="es-simplicity_apps-text">
-        {{ item.text || item.name }}
+      <div
+        v-for="(item, index) in data"
+        class="es-simplicity-menus-item"
+        :key="item.id"
+        :class="{ 'is-fold': fold, 'is-active': active == item.id }"
+        :title="fold ? item.text || item.name : ''"
+        @click="handleClick(item)"
+        @mouseenter="handleEnter(item)"
+        @mouseleave="handleLeave(item)"
+      >
+        <template v-if="fold">
+          <el-badge is-dot :hidden="!item.tips">
+            <es-icon
+              class="es-simplicity_apps-icon"
+              :style="setStyle(index)"
+              :contents="item.icons || item.icon || menuIcon"
+            ></es-icon>
+          </el-badge>
+        </template>
+        <template v-else>
+          <es-icon
+            class="es-simplicity_apps-icon"
+            :style="setStyle(index)"
+            :contents="item.icons || item.icon || menuIcon"
+          ></es-icon>
+          <div class="es-simplicity-menus-tips" v-if="item.tips">
+            {{ item.tips > 99 ? '99+' : item.tips }}
+          </div>
+        </template>
+        <div class="es-simplicity_apps-text" v-show="!fold">
+          {{ item.text || item.name }}
+        </div>
       </div>
     </div>
   </el-scrollbar>
 </template>
 
 <script>
+import util from 'eoss-ui/src/utils/util';
 export default {
   name: 'MenuList',
   components: {},
   props: {
-    index: [Number, String],
+    active: String,
     menuIcon: String,
     color: [String, Array],
     backgroundColor: [String, Array],
-    data: Array
+    data: Array,
+    fold: Boolean,
+    width: Number,
+    popover: Boolean,
+    parent: Object
   },
   data() {
     return {
-      active: ''
+      defaultActive: this.active,
+      show: false,
+      height: document.body.offsetHeight - 44
     };
   },
   computed: {},
-  watch: {},
+  watch: {
+    popover() {
+      if (this.$el.offsetHeight > this.height) {
+        this.$el.style.height = this.height + 'px';
+      } else {
+        this.$el.style.height = '';
+      }
+    }
+  },
   created() {},
   mounted() {},
   methods: {
@@ -64,11 +100,26 @@ export default {
       return obj;
     },
     handleClick(res) {
-      this.active = res.id;
-      this.$emit('command', res, this.index);
+      this.defaultActive = res.id;
+      if (res.url) {
+        if (res.urlopenmode == 1) {
+          util.win.open(res.url);
+          return;
+        } else if (res.urlopenmode == 2) {
+          util.win.open(res.url, '_self');
+          return;
+        }
+        this.$emit('command', res);
+      }
+    },
+    handleEnter(res) {
+      this.$emit('menter', res);
+    },
+    handleLeave(res) {
+      this.$emit('mleave', res);
     },
-    clearActive() {
-      this.active = '';
+    handleOut(res) {
+      this.$emit('mout', res);
     }
   }
 };

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

@@ -1,49 +1,59 @@
 <template>
   <el-drawer
-    class="es-msgs-box"
-    custom-class="es-msgs-main"
+    class="es-simplicity-message"
+    modal-class="es-simplicity-message-modal"
     direction="rtl"
-    size="200px"
-    :modal="false"
+    size="648px"
     :withHeader="false"
     :visible.sync="show"
+    :modal-append-to-body="false"
   >
-    <div class="es-msg-header">
-      <span class="es-msg-title">消息提示</span>
-      <span class="es-overlook" @click="handleIgnoreAll">全部忽略</span>
+    <div class="es-simplicity-message-header">
+      <span class="es-simplicity-message-title">消息提示</span>
+      <span class="es-simplicity-message-overlook" @click="handleIgnoreAll"
+        >全部忽略</span
+      >
     </div>
-    <div class="es-msg-lists-box">
-      <div class="es-msg-lists">
+    <div class="es-simplicity-message-lists-box">
+      <div class="es-simplicity-message-lists">
         <el-scrollbar class="es-scrollbar">
           <div v-infinite-scroll="getMsg" :infinite-scroll-disabled="disabled">
-            <el-card
+            <div
               v-for="(item, index) in msgs"
               :key="item.id"
-              class="es-msg-item"
+              class="es-simplicity-message-item"
             >
-              <i
-                class="el-icon-circle-close"
-                title="忽略"
-                @click="handleIgnore(item, index)"
-              ></i>
-              <div class="es-msg-item-title">{{ item.title }}</div>
+              <div class="es-simplicity-message-item-title">
+                {{ item.title }}
+              </div>
               <div>
-                <span class="es-msg-item-time">{{ item.time }}</span>
+                <span class="es-simplicity-message-item-time">
+                  {{ item.time }}
+                </span>
                 <span
-                  class="es-overlook"
+                  class="es-simplicity-message-handler"
                   v-show="item.handlerUrl"
                   @click="handleMessage(item, index)"
-                  >处理</span
                 >
+                  处理
+                </span>
+                <span
+                  class="es-simplicity-message-overlook"
+                  @click="handleIgnore(item, index)"
+                >
+                  忽略
+                </span>
               </div>
-            </el-card>
-            <p class="es-msg-tips" v-if="loading">加载中...</p>
-            <p class="es-msg-tips" v-if="noMore && count > 0">没有更多了</p>
+            </div>
+            <p class="es-simplicity-message-tips" v-if="loading">加载中...</p>
+            <p class="es-simplicity-message-tips" v-if="noMore && count > 0">
+              没有更多了
+            </p>
           </div>
         </el-scrollbar>
       </div>
     </div>
-    <div class="es-msg-total">当前共有{{ count }}条消息记录</div>
+    <div class="es-simplicity-message-total">共有 {{ count }} 条消息记录</div>
     <es-dialog
       title="处理"
       name="manage"
@@ -63,7 +73,7 @@ import {
 } from 'eoss-ui/src/config/api.js';
 import util from 'eoss-ui/src/utils/util';
 export default {
-  name: 'message',
+  name: 'Message',
   provide() {
     return {
       deleteMessage: this.handleRemove

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

@@ -1,44 +1,53 @@
 <template>
   <transition name="el-drawer-fade" @after-enter="handleMouse(false)">
     <div
-      class="es-notice-box"
-      v-show="data.length"
+      class="es-simplicity-notice-box"
+      :class="{ 'es-in': msgs.length }"
+      v-show="msgs.length"
       @mouseover="handleMouse(true)"
       @mouseout="handleMouse(false)"
     >
-      <div class="es-msgs-box" :class="{ 'es-in': data.length }">
-        <div class="es-msg-header">
-          <span class="es-notice-title">通知消息</span>
-        </div>
-        <div class="es-msg-lists-box">
-          <div class="es-msg-lists">
-            <el-scrollbar class="es-scrollbar">
-              <el-card
-                v-for="(item, index) in data"
-                :key="item.id"
-                class="es-msg-item"
-              >
-                <div class="es-msg-item-title">{{ item.title }}</div>
-                <div>
-                  <span class="es-msg-item-time">{{ item.time }}</span>
-                  <span
-                    class="es-overlook"
-                    v-show="item.handlerUrl"
-                    @click="handleMessage(item, index)"
-                    >处理</span
-                  >
-                </div>
-              </el-card>
-            </el-scrollbar>
-          </div>
-        </div>
+      <div class="es-simplicity-notice-header">
+        <span class="es-notice-title">通知消息</span>
+      </div>
+      <el-scrollbar
+        class="es-simplicity-notice-lists es-simplicity-message-lists"
+      >
         <div
-          class="es-notice-footer"
-          style="display:flex;justify-content: space-between;"
+          v-for="(item, index) in msgs"
+          :key="item.id"
+          class="es-simplicity-message-item"
         >
-          <span @click="handleIgnoreAll">忽略全部</span
-          ><span @click="afterEnter">我知道了</span>
+          <div class="es-simplicity-message-item-title">
+            {{ item.title }}
+          </div>
+          <div>
+            <span class="es-simplicity-message-item-time">
+              {{ item.time }}
+            </span>
+            <span
+              class="es-simplicity-message-handler"
+              v-show="item.handlerUrl"
+              @click="handleMessage(item, index)"
+            >
+              处理
+            </span>
+            <span
+              class="es-simplicity-message-overlook"
+              @click="handleIgnore(item, index)"
+            >
+              忽略
+            </span>
+          </div>
         </div>
+      </el-scrollbar>
+      <div class="es-notice-footer">
+        <span class="es-simplicity-message-overlook" @click="handleIgnoreAll"
+          >忽略全部</span
+        >
+        <span class="es-simplicity-message-handler" @click="afterEnter"
+          >我知道了</span
+        >
       </div>
       <es-dialog
         title="处理"
@@ -53,10 +62,10 @@
   </transition>
 </template>
 <script>
-import { ignoreAllSysMsg } from 'eoss-ui/src/config/api.js';
+import { ignoreSysMsg, ignoreAllSysMsg } from 'eoss-ui/src/config/api.js';
 import util from 'eoss-ui/src/utils/util';
 export default {
-  name: 'notice',
+  name: 'Notice',
   provide() {
     return {
       deleteNotice: this.handleRemove
@@ -73,12 +82,19 @@ export default {
     }
   },
   computed: {},
+  watch: {
+    data: {
+      immediate: true,
+      deep: true,
+      handler(val) {
+        this.msgs = val;
+      }
+    }
+  },
   data() {
     return {
       //加载数据
       loading: false,
-      //消息页码
-      pageNum: 1,
       //消息数据,
       msgs: [],
       //即时消息
@@ -98,19 +114,36 @@ export default {
     handleMouse(flag) {
       this.$emit('opened', flag);
     },
+    //忽略
+    handleIgnore(res, i) {
+      util
+        .ajax({
+          url: ignoreSysMsg,
+          params: {
+            id: res.id
+          }
+        })
+        .then((res) => {
+          if (res.rCode == 0) {
+            this.msgs.splice(i, 1);
+          } else {
+            let msg = res.msg || '系统错误，请联系管理员！';
+            this.$message.error(msg);
+          }
+        });
+    },
     //全部忽略
     handleIgnoreAll() {
       util
         .ajax({
           url: ignoreAllSysMsg
         })
-        .then(res => {
-          this.count = 0;
+        .then((res) => {
           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);
           }

package/packages/main/src/simplicity/router-page.vue

@@ -0,0 +1,53 @@
+<template>
+  <keep-alive>
+    <router-view :name="appCode" />
+  </keep-alive>
+</template>
+
+<script>
+import util from 'eoss-ui/src/utils/util';
+export default {
+  name: 'RouterPage',
+  components: {},
+  props: {
+    appCode: String,
+    path: String,
+    url: String,
+    query: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    show: Boolean
+  },
+  data() {
+    return {
+      params: {}
+    };
+  },
+  computed: {},
+  watch: {
+    show(val) {
+      if (val) {
+        this.jump();
+      }
+    }
+  },
+  created() {},
+  mounted() {
+    this.params = util.getParams({ url: this.url });
+    this.jump();
+  },
+  methods: {
+    jump() {
+      this.$router.push({
+        path: this.path,
+        query: { ...this.query, ...this.params }
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

package/packages/main/src/simplicity/settings.vue

@@ -38,7 +38,7 @@
 <script>
 import util from 'eoss-ui/src/utils/util';
 export default {
-  name: 'message',
+  name: 'Message',
   props: {
     visible: Boolean,
     //主题颜色选择颜色集合