|
@@ -0,0 +1,107 @@
|
|
|
+<template>
|
|
|
+ <div class="user-view-inline">
|
|
|
+ <Tooltip :disabled="!nickname" :delay="delay" :transfer="transfer">
|
|
|
+ {{nickname || username}}
|
|
|
+ <div slot="content">
|
|
|
+ <div>用户名:{{username}}</div>
|
|
|
+ <div>职位/职称:{{profession || '-'}}</div>
|
|
|
+ </div>
|
|
|
+ </Tooltip>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .user-view-inline {
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ name: 'UserView',
|
|
|
+ props: {
|
|
|
+ username: {
|
|
|
+ default: ''
|
|
|
+ },
|
|
|
+ delay: {
|
|
|
+ type: Number,
|
|
|
+ default: 600
|
|
|
+ },
|
|
|
+ transfer: {
|
|
|
+ type: Boolean,
|
|
|
+ default: true
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ nickname: '',
|
|
|
+ profession: ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getUserData(0);
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ username() {
|
|
|
+ this.getUserData(0);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getUserData(num) {
|
|
|
+ let keyName = '__name:' + this.username.substring(0, 1) + '__';
|
|
|
+ let localData = $A.jsonParse(window.localStorage[keyName]);
|
|
|
+ if (localData.__loadIng === true) {
|
|
|
+ if (num < 100) {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.getUserData(num + 1)
|
|
|
+ }, 500);
|
|
|
+ }
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ //
|
|
|
+ if (typeof localData[this.username] !== "object") {
|
|
|
+ localData[this.username] = {};
|
|
|
+ }
|
|
|
+ //
|
|
|
+ if (localData[this.username].success === true
|
|
|
+ && localData[this.username].exptime > Math.round(new Date().getTime() / 1000)) {
|
|
|
+ this.nickname = localData[this.username].data.nickname;
|
|
|
+ this.profession = localData[this.username].data.profession;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ //
|
|
|
+ localData.__loadIng = true;
|
|
|
+ $A.aAjax({
|
|
|
+ url: 'users/basic',
|
|
|
+ data: {
|
|
|
+ username: this.username,
|
|
|
+ },
|
|
|
+ error: () => {
|
|
|
+ localData[this.username].success = false;
|
|
|
+ localData[this.username].exptime = 0;
|
|
|
+ localData[this.username].data = {};
|
|
|
+ localData.__loadIng = false;
|
|
|
+ window.localStorage[keyName] = $A.jsonStringify(localData);
|
|
|
+ },
|
|
|
+ success: (res) => {
|
|
|
+ if (res.ret === 1) {
|
|
|
+ this.nickname = res.data.nickname;
|
|
|
+ this.profession = res.data.profession;
|
|
|
+ localData[this.username].success = true;
|
|
|
+ localData[this.username].exptime = Math.round(new Date().getTime() / 1000) + 300;
|
|
|
+ localData[this.username].data = res.data;
|
|
|
+ } else {
|
|
|
+ this.nickname = '';
|
|
|
+ this.profession = '';
|
|
|
+ localData[this.username].success = false;
|
|
|
+ localData[this.username].exptime = 0;
|
|
|
+ localData[this.username].data = {};
|
|
|
+ }
|
|
|
+ localData.__loadIng = false;
|
|
|
+ window.localStorage[keyName] = $A.jsonStringify(localData);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|