eoss-ui 0.7.64 → 0.7.66

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

@@ -0,0 +1,222 @@
+<template>
+  <transition name="el-drawer-fade" @after-enter="handleMouse(false)">
+    <div
+      class="es-simplicity-notice-box"
+      :class="{ 'es-in': msgs.length }"
+      v-show="msgs.length"
+      @mouseover="handleMouse(true)"
+      @mouseout="handleMouse(false)"
+    >
+      <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
+          v-for="(item, index) in msgs"
+          :key="item.id"
+          class="es-simplicity-message-item"
+        >
+          <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="处理"
+        name="manage"
+        width="90%"
+        height="80%"
+        :visible.sync="dialog.show"
+        :url="dialog.url"
+        :param="dialog.params"
+        @close="handleClose"
+      ></es-dialog>
+    </div>
+  </transition>
+</template>
+<script>
+import { ignoreSysMsg, ignoreAllSysMsg } from 'eoss-ui/src/config/api.js';
+import util from 'eoss-ui/src/utils/util';
+export default {
+  name: 'Notice',
+  provide() {
+    return {
+      deleteNotice: this.handleRemove
+    };
+  },
+  props: {
+    visible: Boolean,
+    winopen: Boolean,
+    data: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  computed: {},
+  watch: {
+    data: {
+      immediate: true,
+      deep: true,
+      handler(val) {
+        this.msgs = val;
+      }
+    }
+  },
+  data() {
+    return {
+      //加载数据
+      loading: false,
+      //消息数据,
+      msgs: [],
+      //即时消息
+      sysMsg: '',
+      dialog: {
+        params: {},
+        url: '',
+        show: false
+      },
+      index: null
+    };
+  },
+  mounted() {
+    const bus = this.bus || this.$root.Bus;
+    bus && bus.$on('deleteNotice', this.handleRemove);
+  },
+  methods: {
+    afterEnter() {
+      this.$emit('opened');
+    },
+    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.msgs = [];
+          this.$emit('ignore', { type: 'ignore', value: 'all' });
+          this.$emit('opened', false);
+        })
+        .catch((err) => {
+          if (err.message && err.message !== 'canceled') {
+            this.$message.error(err.message);
+          }
+        });
+    },
+    //处理消息
+    handleMessage(item, index) {
+      const openModel = util.getStorage('openModel');
+      if (openModel && openModel == 'dialog') {
+        let { handlerUrl, title, id, metaData } = item;
+        metaData &&
+          (title =
+            metaData.title ||
+            metaData.pendtitle ||
+            metaData.meetName ||
+            title ||
+            '办理');
+        const jsonData =
+          metaData && metaData.jsonData ? JSON.parse(metaData.jsonData) : {};
+        util.busEmit(this, {
+          method: 'windowOpen',
+          args: {
+            url: handlerUrl,
+            title: title,
+            id: id,
+            ...jsonData,
+            callback: 'deleteNotice'
+          }
+        });
+        return;
+      }
+      if (item.urlopenmode === 1 || this.winopen) {
+        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,
+          url: item.handlerUrl,
+          params: {
+            id: item.id,
+            pendingId: item.pendingId,
+            userId: item.userId
+          }
+        };
+        this.index = index;
+      }
+    },
+    handleRemove() {
+      if (this.index === null) {
+        this.count -= 1;
+        this.msgs = this.msgs.splice(this.index, 1);
+      }
+      this.dialog.show = false;
+    },
+    handleClose() {
+      this.$parent.$emit('bus-emit', 'waitdone');
+    },
+    destroyed() {
+      const bus = this.bus || this.$root.Bus;
+      bus.$off('deleteNotice', this.handleRemove);
+    }
+  }
+};
+</script>

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

@@ -0,0 +1,45 @@
+<template>
+  <div style="height: 100%">
+    <router-view :key="keys || appCode" :name="appCode" />
+  </div>
+</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 {};
+      }
+    },
+    keys: String
+  },
+  data() {
+    return {};
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    this.jump();
+  },
+  methods: {
+    jump() {
+      let params = util.getParams({ url: this.url });
+      this.$router.push({
+        path: this.path,
+        query: { ...this.query, ...params }
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

package/packages/main/src/simplicityTop/sub-menu.vue

@@ -0,0 +1,274 @@
+<template>
+  <el-drawer
+    class="es-simplicity-subMenus"
+    direction="ltr"
+    modal-class="es-simplicity-apps-modal"
+    size="auto"
+    :modal-append-to-body="false"
+    :close-on-press-escape="false"
+    :modal="false"
+    :with-header="false"
+    :wrapperClosable="false"
+    :visible.sync="show"
+  >
+    <div
+      class="es-simplicity-menus"
+      :class="{ 'es-simplicity-menus-plus': mode == 'plus' }"
+    >
+      <div class="es-simplicity-menus-box" :style="{ width: width + 'px' }">
+        <div class="es-simplicity-menus-title">
+          <el-tooltip
+            class="item"
+            effect="dark"
+            placement="right"
+            :content="title || text"
+            :auto="true"
+          >
+            <span class="es-simplicity-menus-title-text" v-if="!fold">{{
+              title || text
+            }}</span>
+          </el-tooltip>
+          <i
+            class="es-icon-shouqi es-simplicity-menus-title-icon"
+            v-show="!fold"
+            @click="handleFold(true)"
+          ></i>
+          <i
+            class="es-icon-zhankai es-simplicity-menus-title-icon"
+            v-show="fold"
+            @click="handleFold(false)"
+          ></i>
+        </div>
+        <div v-if="collapse" class="es-simplicity-menus-scrollbar">
+          <es-menu
+            popperClass="es-simplicity_menus"
+            :menu-class="
+              fold
+                ? 'es-simplicity_menus es-simplicity_menus-fold'
+                : 'es-simplicity_menus'
+            "
+            :fourthTabs="true"
+            :data="menus"
+            :menuIcon="menuIcon"
+            :color="color"
+            :backgroundColor="backgroundColor"
+            :show-title="false"
+            :collapse="fold"
+            @select="handleSelect"
+          ></es-menu>
+        </div>
+        <menu-list
+          v-else
+          :active="actives[0]"
+          :data="menus"
+          :menuIcon="menuIcon"
+          :color="color"
+          :backgroundColor="backgroundColor"
+          :fold="fold"
+          :width="size"
+          @menter="
+            (res) => {
+              this.getData(res, 0, true);
+            }
+          "
+          @mleave="
+            (res) => {
+              this.getData(res, 0, false);
+            }
+          "
+          @hover="handleHover"
+          @command="handleCommand"
+        ></menu-list>
+      </div>
+      <div
+        class="es-simplicity-menus-view"
+        @mouseleave="handleLeave"
+        @mouseenter="handleEnter"
+        v-show="subMenus.length"
+      >
+        <div
+          class="es-simplicity-menus-box"
+          v-for="(item, index) in subMenus"
+          :key="item.id"
+        >
+          <div class="es-simplicity-menus-title">
+            <span class="es-simplicity-menus-title-text">{{
+              item.name || item.text || item.title
+            }}</span>
+          </div>
+          <menu-list
+            :active="actives[index + 1]"
+            :data="[...item.children, ...item.fourthTabs]"
+            :menuIcon="menuIcon"
+            :color="color"
+            :backgroundColor="backgroundColor"
+            :width="size"
+            @menter="
+              (res) => {
+                getData(res, index + 1, true);
+              }
+            "
+            @mleave="
+              (res) => {
+                getData(res, index + 1, false);
+              }
+            "
+            @command="handleCommand"
+          ></menu-list>
+        </div>
+      </div>
+    </div>
+  </el-drawer>
+</template>
+
+<script>
+import MenuList from './menu-list.vue';
+export default {
+  name: 'SubMenu',
+  components: { MenuList },
+  props: {
+    mode: String,
+    collapse: Boolean,
+    title: String,
+    closed: Boolean,
+    color: {
+      type: [String, Array],
+      default: '#fff'
+    },
+    backgroundColor: {
+      type: [String, Array],
+      default() {
+        return [
+          '#FF9C52',
+          '#2591F7',
+          '#17C27B',
+          '#1265D7',
+          '#FFC724',
+          '#E34D59'
+        ];
+      }
+    },
+    size: {
+      type: Number,
+      default: 220
+    },
+    visible: Boolean,
+    text: String,
+    menuIcon: String,
+    children: {
+      type: Array,
+      default() {
+        return [];
+      }
+    },
+    fourthTabs: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  data() {
+    return {
+      fold: this.closed,
+      width: this.size,
+      subMenus: [],
+      isEnter: false,
+      timer: null,
+      actives: []
+    };
+  },
+  computed: {
+    menus() {
+      return [...this.children, ...this.fourthTabs];
+    },
+    show: {
+      get() {
+        return this.visible;
+      },
+      set(val) {
+        this.$emit('update:visible', val);
+        return val;
+      }
+    }
+  },
+  watch: {
+    closed(val) {
+      this.fold = val;
+      if (val) {
+        this.width = 48;
+      } else {
+        this.width = this.size;
+      }
+    },
+    visible(val) {
+      val === false && (this.actives = []);
+    }
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    handleFold(res) {
+      this.fold = res;
+      if (res) {
+        this.width = 48;
+      } else {
+        this.width = this.size;
+      }
+      this.$emit('update:closed', res);
+    },
+    handleCommand(res) {
+      this.$emit('command', res);
+    },
+    handleSelect(res) {
+      this.$emit('command', res.node);
+    },
+    getData(res, n, is) {
+      this.isEnter = is;
+      if (is) {
+        this.actives.splice(n);
+        if (this.actives[n]) {
+          this.actives[n] = res.id;
+        } else {
+          this.actives.push(res.id);
+        }
+        this.subMenus.splice(n);
+        let { children, fourthTabs } = res;
+        if (
+          (children && children.length) ||
+          (fourthTabs && fourthTabs.length)
+        ) {
+          this.subMenus = this.subMenus.concat(res);
+        }
+      } else {
+        if (n == 0) {
+          clearTimeout(this.timer);
+          this.timer = setTimeout(() => {
+            if (res && !this.isEnter) {
+              this.subMenus = [];
+              this.actives = [];
+            }
+          }, 300);
+        }
+      }
+    },
+    handleHover(res) {
+      this.isEnter = res;
+      //if(this)
+    },
+    clearSubmenu() {
+      this.$refs.menus.clearActive();
+      this.subMenus = [];
+    },
+    handleLeave() {
+      this.subMenus = [];
+      this.actives = [];
+    },
+    handleEnter() {
+      this.isEnter = true;
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>