<template>
  <div class="es-simplicitytop-handler">
    <template v-for="item in handlers">
      <div
        v-if="item.type === 'online' || item.type === 'onlineUser'"
        class="es-simplicitytop-handler-item no-hover"
        :key="item.type"
      >
        <i class="es-simplicitytop-handler-icon es-icon-solid-qunzuguanli"> </i
        >在线：
        <span
          class="es-simplicitytop-online-num"
          @click="isClick ? handleClick({ type: 'online' }) : ''"
          :class="{ 'es-pointer': isClick }"
        >
          {{ nums[item.type] }}
        </span>
        人
      </div>
      <div
        class="es-simplicitytop-handler-item no-hover"
        v-else-if="item.type === 'org'"
      >
        <i class="es-icon-qiehuangangwei"></i>
        <span class="es-simplicitytop-org-text">部门：</span>
        <es-select
          v-model="user.identityId"
          value-key="id"
          label-key="name"
          :data="user.identityList"
          value-type="object"
          @change="handleUserSelect"
        ></es-select>
      </div>
      <div
        class="es-simplicitytop-handler-item"
        v-else
        :key="item.type"
        @click.stop="handleClick(item)"
      >
        <es-icon
          class="es-simplicitytop-handler-icon es-simplicitytop"
          :contents="item.icon"
        ></es-icon>
        <span class="es-simplicitytop-handler-text">{{ item.text }}</span>
        <div
          v-if="item.type == 'notice' && nums[item.type] > 0"
          class="es-simplicitytop-handler-badge"
        >
          {{ nums[item.type] > 99 ? '99+' : nums[item.type] }}
        </div>
      </div>
    </template>
  </div>
</template>

<script>
import util from 'eoss-ui/src/utils/util';
import { switchUserTo } from 'eoss-ui/src/config/api.js';

export default {
  name: 'Handler',
  components: {},
  props: {
    data: {
      type: Array,
      default() {
        return [];
      }
    },
    nums: {
      type: Object,
      default() {
        return {};
      }
    },
    showTitleType: {
      type: String,
      default: 'tooltip',
      validator: (val) => {
        return val === 'text' || val === 'tooltip';
      }
    },
    user: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  data() {
    return {
      time: '',
      date: '',
      timer: null,
      handlers: [
        {
          type: 'index',
          icon: 'es-icon-zhuye',
          text: '首页'
        },
        {
          type: 'org'
        },
        {
          type: 'online'
        },
        {
          type: 'userinfo',
          text: '个人资料',
          icon: 'es-icon-yonghu'
        },
        {
          type: 'notice',
          icon: 'es-icon-xiaoxi1',
          text: '消息'
        },
        {
          type: 'set',
          icon: 'es-icon-shezhi',
          text: '设置'
        },
        {
          type: 'quit',
          icon: 'es-icon-tuichu1',
          text: '退出'
        }
      ]
    };
  },
  computed: {
    isClick() {
      let useCaseCodes = util.getStorage('useCaseCodes');
      return useCaseCodes && useCaseCodes.includes('sys_user_onlineList');
    }
  },
  watch: {
    data: {
      handler: 'deep',
      immediate: true,
      handler(newVal, oldVal) {}
    }
  },
  created() {
    //this.time = util.timeCycle() + '好!';
    this.date = util.formatDate('', 'yyyy年M月d日');
  },
  mounted() {
    this.getTime();
  },
  methods: {
    //切换职务
    handleUserSelect(res) {
      if (this.user.identityId !== res.id) {
        util
          .ajax({
            method: 'post',
            url: switchUserTo,
            data: { userId: res.value }
          })
          .then((res) => {
            if (res.rCode == 0) {
              this.$emit('close');
              util.setStorage({
                type: this.storage,
                key: 'userId',
                value: res.value
              });
              util.removeStorage(['mainConfig', 'jump']);
              this.$message({
                message: res.msg,
                type: 'success',
                duration: 500,
                onClose: () => {
                  if (
                    util.win.location.href.indexOf('#/main') > -1 ||
                    util.win.location.href.indexOf('/main.html') > -1
                  ) {
                    location.reload();
                  } else {
                    this.$router.replace('/main');
                  }
                }
              });
            } else {
              this.$message({
                message: res.msg || '系统错误，请联系管理员！',
                type: 'error'
              });
            }
          })
          .catch((err) => {
            if (err.message && err.message !== 'canceled') {
              this.$message.error(err.message);
            }
          });
      }
    },
    getTime() {
      this.timer && clearInterval(this.timer);
      this.timer = setInterval(() => {
        this.time = util.formatDate('', 'HH:mm:ss');
      });
    },
    handleClick(res) {
      this.$emit('click', res);
    }
  },
  beforeDestroy() {
    clearInterval(this.timer);
  }
};
</script>

<style lang="scss" scoped></style>
