|
@@ -50,7 +50,9 @@
|
|
|
<div class="tab-user-content">
|
|
|
<div class="user_info">
|
|
|
<div class="user_img">
|
|
|
- <b-image v-if="loadImage" :file-ref-id="user.userID" :readonly="true" :is-single="true"></b-image>
|
|
|
+ <img v-if="!avtImageUrl" class="img-user" src="@/assets/icon/icon-user-2x.png"
|
|
|
+ onerror="this.src='@/assets/icon/icon-user-2x.png'" alt=""/>
|
|
|
+ <img v-else :src="avtImageUrl" alt="" style="border-radius: 10px"/>
|
|
|
</div>
|
|
|
<div class="user_text">
|
|
|
<h2>{{user.name}}</h2>
|
|
@@ -98,6 +100,7 @@ import {getQRCodeUrlToBase64} from "@/api/wechat";
|
|
|
import {base64ToBlob} from "@/utils/imageUtils";
|
|
|
import BImage from "@/components/bImage.vue";
|
|
|
import {useRouter} from "vue-router";
|
|
|
+import {getFileBase64, getList} from "@/api/system/file";
|
|
|
|
|
|
const $router = useRouter();
|
|
|
|
|
@@ -118,7 +121,7 @@ const imgStyle = ref({
|
|
|
height: '0px',
|
|
|
margin: '0px 0px 0px 40px'
|
|
|
});
|
|
|
-const loadImage = ref(true);
|
|
|
+const avtImageUrl = ref<any>("")
|
|
|
|
|
|
const updateBrowserWidth = () => {
|
|
|
const browserWidth = window.innerWidth;
|
|
@@ -159,19 +162,32 @@ const presentAlert = async () => {
|
|
|
// 监听路由变化
|
|
|
watch(() => $router.currentRoute.value.path, (to, form) => {
|
|
|
if (form == "/tabs/tabUser/myInfo" && to == "/tabs/tabUser") {
|
|
|
- loadImage.value = false;
|
|
|
- setTimeout(() => {
|
|
|
- loadImage.value = true;
|
|
|
- }, 500)
|
|
|
+ getAvtImag(user.value.userID);
|
|
|
}
|
|
|
}, {immediate: true});
|
|
|
|
|
|
+function getAvtImag(fileRefID: any) {
|
|
|
+ getList({fileRefID}).then((res: any) => {
|
|
|
+ if (res.length <= 0) {
|
|
|
+ avtImageUrl.value = false;
|
|
|
+ } else {
|
|
|
+ // 获取图片
|
|
|
+ getFileBase64(res[0].fileId).then(data => {
|
|
|
+ if (data) {
|
|
|
+ avtImageUrl.value = URL.createObjectURL(base64ToBlob("data:image/png;base64," + data));
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
onMounted(() => {
|
|
|
getConfig().then((res: any) => {
|
|
|
isDev.value = res.isDev;
|
|
|
}, () => {
|
|
|
isDev.value = true;
|
|
|
- })
|
|
|
+ });
|
|
|
+ getAvtImag(user.value.userID);
|
|
|
})
|
|
|
|
|
|
</script>
|
|
@@ -277,12 +293,12 @@ onMounted(() => {
|
|
|
z-index: 2;
|
|
|
|
|
|
.user_img {
|
|
|
- width: 30%;
|
|
|
+ width: 25%;
|
|
|
}
|
|
|
|
|
|
.user_text{
|
|
|
- width: 44%;
|
|
|
- padding-left: 5px;
|
|
|
+ width: 49%;
|
|
|
+ padding-left: 10px;
|
|
|
|
|
|
h2 {
|
|
|
margin-top: 12px;
|