前端和后端源码，合并到一个git仓库中，方便用户下载，避免前后端不匹配的问题

2026-02-04 01:25:34 +08:00 · 2024-06-23 10:39:52 +08:00
parent bb918b742e
commit 0325e34dcb
1439 changed files with 171106 additions and 0 deletions
--- a/jeecgboot-vue3/src/components/jeecg/UserAvatar.vue
+++ b/jeecgboot-vue3/src/components/jeecg/UserAvatar.vue
@ -0,0 +1,142 @@
+<template>
+  <div class="user-avatar-info">
+      <a-popover title="" :overlayStyle="{width: '250px'}">
+          <template #content>
+             <div style="display: flex;flex-direction: row;align-items: center">
+                 <div style="width: 60px;text-align: center">
+                     <a-avatar v-if="userAvatar" :src="userAvatar" :size="47"/>
+                     <a-avatar v-else :size="47">{{ getAvatarText() }}</a-avatar>
+                 </div>
+                 <div style="flex: 1;display: flex;flex-direction: column;margin-left: 12px">
+                     <div style="color: #000;display: inline-block;font-size: 15px;font-weight: 700;margin-top: 3px;vertical-align: top;width: 170px;">
+                         {{ userLabel }}
+                     </div>
+                     <div style="color: #757575;display: block;margin-top: 4px;">
+                         {{ phone }}
+                     </div>
+                 </div>
+             </div>
+          </template>
+          <span style="cursor: pointer">
+              <a-avatar v-if="userAvatar" :src="userAvatar" :loadError="loadError"/>
+              <a-avatar v-else>{{ getAvatarText() }}</a-avatar>
+          </span>
+      </a-popover>
+      <span class="realname-ellipsis">
+          {{ userLabel }}
+      </span>
+  </div>
+</template>
+
+<script lang="ts">
+  import { ref, watchEffect, defineComponent } from 'vue';
+  import { defHttp } from '/@/utils/http/axios';
+  import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
+  
+  export default defineComponent({
+    name: 'UserAvatar',
+    props: {
+      username: {
+        type: String,
+        default: '',
+      },
+      detail:{
+        type: Object,
+        default: ()=>{},
+      }
+    },
+    setup(props) {
+      const userAvatar = ref('');
+      const userLabel = ref('');
+      const phone = ref('');
+
+      watchEffect(async ()=>{
+        userAvatar.value = '';
+        userLabel.value = '';
+        phone.value = '';
+        let username = props.username;
+        if(username){
+          await initUserInfo(username);
+        }
+        let userInfo = props.detail;
+        if(userInfo){
+          if(userInfo.avatar){
+            userAvatar.value = getFileAccessHttpUrl(userInfo.avatar);
+          }
+          if(userInfo.realname){
+            userLabel.value = userInfo.realname;
+          }
+          if(userInfo.phone){
+            phone.value = userInfo.phone;
+          }
+        }
+      });
+
+      async function initUserInfo(val) {
+        const params = {
+          username: val,
+        };
+        const url = '/sys/user/getMultiUser';
+        const data = await defHttp.get({ url, params }, {isTransformResponse: false});
+        if(data && data.length > 0){
+          let temp = data[0].avatar;
+          if (temp) {
+            userAvatar.value = getFileAccessHttpUrl(temp)
+          }
+          userLabel.value = data[0].realname;
+          phone.value = data[0].phone;
+        }else{
+          console.log(data)
+        }
+      }
+
+      function getAvatarText() {
+        let text = userLabel.value;
+        if (!text) {
+          text = props.username;
+        }
+        if (text) {
+          if (text.length > 2) {
+            return text.substr(0, 2);
+          } else {
+            return text;
+          }
+        }
+        return '';
+      }
+      
+      function loadError() {
+        userAvatar.value = '';
+        return true;
+      }
+      
+
+      return {
+        userAvatar,
+        userLabel,
+        getAvatarText,
+        phone,
+        loadError
+      };
+    },
+  });
+</script>
+
+<style scoped lang="less">
+    .user-avatar-info{
+        .ant-avatar-image{
+            cursor: pointer;
+        }
+        .realname-ellipsis {
+            overflow: hidden;
+            text-overflow: ellipsis;
+            vertical-align: top;
+            white-space: nowrap;
+            height: 32px;
+            line-height: 32px;
+            display: inline-block;
+            margin-left: 10px;
+        }
+    }
+    
+</style>