Merge branch 'master' of http://172.16.20.1:3000/duanhao/SocialNetworks_duan
This commit is contained in:
commit
e049c76b9a
|
|
@ -455,7 +455,6 @@ export const useSocialGroupsStore = defineStore("socialGroups", {
|
||||||
...item,
|
...item,
|
||||||
count: res.data.communityStatistics[item.key]
|
count: res.data.communityStatistics[item.key]
|
||||||
}))
|
}))
|
||||||
this.timeList = res.data.timeList || []
|
|
||||||
this.communityDetailNodeList = res.data.userRelation
|
this.communityDetailNodeList = res.data.userRelation
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,32 +1,31 @@
|
||||||
import dayjs from "dayjs"
|
import dayjs from "dayjs";
|
||||||
import defaultAvatar from "@/assets/images/avatar/default.png"
|
|
||||||
|
|
||||||
// 将图片裁剪为圆形并在四周添加透明padding后返回 base64
|
// 将图片裁剪为圆形并在四周添加透明padding后返回 base64
|
||||||
export function cropImageToCircle(url, size = 100, paddingRatio = 0.25) {
|
export function cropImageToCircle(url, size = 100, paddingRatio = 0.25) {
|
||||||
return new Promise((resolve) => {
|
return new Promise((resolve) => {
|
||||||
const img = new window.Image()
|
const img = new window.Image();
|
||||||
img.crossOrigin = "anonymous"
|
img.crossOrigin = "anonymous";
|
||||||
img.onload = function () {
|
img.onload = function () {
|
||||||
const padding = size * paddingRatio
|
const padding = size * paddingRatio;
|
||||||
const canvasSize = size + padding * 2
|
const canvasSize = size + padding * 2;
|
||||||
const canvas = document.createElement("canvas")
|
const canvas = document.createElement("canvas");
|
||||||
canvas.width = canvasSize
|
canvas.width = canvasSize;
|
||||||
canvas.height = canvasSize
|
canvas.height = canvasSize;
|
||||||
const ctx = canvas.getContext("2d")
|
const ctx = canvas.getContext("2d");
|
||||||
ctx.clearRect(0, 0, canvasSize, canvasSize)
|
ctx.clearRect(0, 0, canvasSize, canvasSize);
|
||||||
ctx.save()
|
ctx.save();
|
||||||
ctx.beginPath()
|
ctx.beginPath();
|
||||||
ctx.strokeStyle = "#efa7a7" // 边框颜色
|
ctx.strokeStyle = "#efa7a7"; // 边框颜色
|
||||||
context.lineWidth = 10 // 边框宽度
|
context.lineWidth = 10; // 边框宽度
|
||||||
ctx.arc(canvasSize / 2, canvasSize / 2, size / 2, 0, Math.PI * 2, false)
|
ctx.arc(canvasSize / 2, canvasSize / 2, size / 2, 0, Math.PI * 2, false);
|
||||||
ctx.closePath()
|
ctx.closePath();
|
||||||
ctx.clip()
|
ctx.clip();
|
||||||
ctx.drawImage(img, padding, padding, size, size)
|
ctx.drawImage(img, padding, padding, size, size);
|
||||||
ctx.restore()
|
ctx.restore();
|
||||||
resolve(canvas.toDataURL("image/png"))
|
resolve(canvas.toDataURL("image/png"));
|
||||||
}
|
};
|
||||||
img.src = url
|
img.src = url;
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -37,32 +36,32 @@ export function cropImageToCircle(url, size = 100, paddingRatio = 0.25) {
|
||||||
*/
|
*/
|
||||||
export async function cropToCircleAsync(imageSrc, diameter = 50) {
|
export async function cropToCircleAsync(imageSrc, diameter = 50) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
const img = new window.Image()
|
const img = new window.Image();
|
||||||
img.crossOrigin = "anonymous"
|
img.crossOrigin = "anonymous";
|
||||||
img.onload = function () {
|
img.onload = function () {
|
||||||
const canvas = document.createElement("canvas")
|
const canvas = document.createElement("canvas");
|
||||||
canvas.width = diameter
|
canvas.width = diameter;
|
||||||
canvas.height = diameter
|
canvas.height = diameter;
|
||||||
const ctx = canvas.getContext("2d")
|
const ctx = canvas.getContext("2d");
|
||||||
|
|
||||||
ctx.beginPath()
|
ctx.beginPath();
|
||||||
ctx.arc(diameter / 2, diameter / 2, diameter / 2, 0, Math.PI * 2)
|
ctx.arc(diameter / 2, diameter / 2, diameter / 2, 0, Math.PI * 2);
|
||||||
ctx.closePath()
|
ctx.closePath();
|
||||||
ctx.clip()
|
ctx.clip();
|
||||||
|
|
||||||
ctx.drawImage(img, 0, 0, diameter, diameter)
|
ctx.drawImage(img, 0, 0, diameter, diameter);
|
||||||
resolve(canvas.toDataURL("image/png"))
|
resolve(canvas.toDataURL("image/png"));
|
||||||
}
|
};
|
||||||
img.onerror = reject
|
img.onerror = reject;
|
||||||
img.src = imageSrc
|
img.src = imageSrc;
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
//转换时间戳
|
//转换时间戳
|
||||||
export function TansTimestamp(timestamp, format = "YYYY-MM-DD HH:mm:ss") {
|
export function TansTimestamp(timestamp, format = "YYYY-MM-DD HH:mm:ss") {
|
||||||
if (!timestamp) return
|
if (!timestamp) return;
|
||||||
const ts = timestamp.toString().length === 10 ? timestamp * 1000 : timestamp
|
const ts = timestamp.toString().length === 10 ? timestamp * 1000 : timestamp;
|
||||||
return dayjs(ts).format(format)
|
return dayjs(ts).format(format);
|
||||||
}
|
}
|
||||||
|
|
||||||
//将后端返回的二进制数据转换成所需的头像格式
|
//将后端返回的二进制数据转换成所需的头像格式
|
||||||
|
|
|
||||||
|
|
@ -16,7 +16,7 @@
|
||||||
<div class="group-type-content">TOP{{ index+1 }}</div>
|
<div class="group-type-content">TOP{{ index+1 }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="user-list-item" v-for="child in group.list" :key="child.id">
|
<div class="user-list-item" v-for="child in group.list" :key="child.id">
|
||||||
<img :src="defaultAvatar" alt="" class="avatar" />
|
<img :src="child.avatarData ? getAvatarUrl(child.avatarData) : defaultAvatar" alt="" class="avatar" />
|
||||||
<div class="user-info">
|
<div class="user-info">
|
||||||
<div class="username">{{ child.userName }}</div>
|
<div class="username">{{ child.userName }}</div>
|
||||||
<div class="userState">
|
<div class="userState">
|
||||||
|
|
@ -41,6 +41,7 @@
|
||||||
import { defineProps, defineEmits, ref } from "vue";
|
import { defineProps, defineEmits, ref } from "vue";
|
||||||
import defaultAvatar from "@/assets/images/avatar/default.png";
|
import defaultAvatar from "@/assets/images/avatar/default.png";
|
||||||
import { useSocialGroupsStore } from "@/store/llinkPrediction/index";
|
import { useSocialGroupsStore } from "@/store/llinkPrediction/index";
|
||||||
|
import { getAvatarUrl } from "@/utils/transform"
|
||||||
const socialGroupsStore = useSocialGroupsStore()
|
const socialGroupsStore = useSocialGroupsStore()
|
||||||
const curUserGroupIndex = ref(0);
|
const curUserGroupIndex = ref(0);
|
||||||
const emit = defineEmits(["click:selectedGroup"]);
|
const emit = defineEmits(["click:selectedGroup"]);
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user