Merge branch 'abp' of https://gitee.com/ccnetcore/Yi into abp
This commit is contained in:
22
Yi.Bbs.Vue3/src/components/Skeleton/index.vue
Normal file
22
Yi.Bbs.Vue3/src/components/Skeleton/index.vue
Normal file
@@ -0,0 +1,22 @@
|
|||||||
|
<template>
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-card shadow="never" class="card-box"> <el-skeleton /> </el-card>
|
||||||
|
</el-col>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, defineProps } from "vue";
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
isBorder: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.card-box {
|
||||||
|
--el-card-border-color: v-bind(isBorder ? "#e4e7ed": "transparent");
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -28,7 +28,7 @@ export default function useAuths(opt) {
|
|||||||
|
|
||||||
// 获取token
|
// 获取token
|
||||||
const getToken = () => {
|
const getToken = () => {
|
||||||
return Session.get(TokenKey);
|
return Local.get(TokenKey);
|
||||||
};
|
};
|
||||||
|
|
||||||
// 存储token到cookies
|
// 存储token到cookies
|
||||||
@@ -36,13 +36,13 @@ export default function useAuths(opt) {
|
|||||||
if (token == null) {
|
if (token == null) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
Session.set(TokenKey, token);
|
Local.set(TokenKey, token);
|
||||||
return true;
|
return true;
|
||||||
};
|
};
|
||||||
|
|
||||||
// 删除token
|
// 删除token
|
||||||
const removeToken = () => {
|
const removeToken = () => {
|
||||||
Session.remove(TokenKey);
|
Local.remove(TokenKey);
|
||||||
return true;
|
return true;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -69,10 +69,14 @@
|
|||||||
</el-collapse-item>
|
</el-collapse-item>
|
||||||
</el-collapse>
|
</el-collapse>
|
||||||
<el-divider v-show="topDiscussList.length > 0" />
|
<el-divider v-show="topDiscussList.length > 0" />
|
||||||
|
<template v-if="discussList.length > 0">
|
||||||
<div class="div-item" v-for="i in discussList">
|
<div class="div-item" v-for="i in discussList">
|
||||||
<DisscussCard :discuss="i" />
|
<DisscussCard :discuss="i" />
|
||||||
</div>
|
</div>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<Skeleton :isBorder="true" />
|
||||||
|
</template>
|
||||||
<div>
|
<div>
|
||||||
<el-pagination
|
<el-pagination
|
||||||
v-model:current-page="query.skipCount"
|
v-model:current-page="query.skipCount"
|
||||||
@@ -108,6 +112,7 @@ import BottomInfo from "@/components/BottomInfo.vue";
|
|||||||
import { getPermission } from "@/utils/auth";
|
import { getPermission } from "@/utils/auth";
|
||||||
import useAuths from "@/hooks/useAuths";
|
import useAuths from "@/hooks/useAuths";
|
||||||
import { Session } from "@/utils/storage";
|
import { Session } from "@/utils/storage";
|
||||||
|
import Skeleton from "@/components/Skeleton/index.vue";
|
||||||
|
|
||||||
const { getToken, clearStorage } = useAuths();
|
const { getToken, clearStorage } = useAuths();
|
||||||
//数据定义
|
//数据定义
|
||||||
|
|||||||
@@ -22,19 +22,24 @@
|
|||||||
:isPublish="i.isDisableCreateDiscuss"
|
:isPublish="i.isDisableCreateDiscuss"
|
||||||
/>
|
/>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
<template v-if="discussList.length > 0">
|
||||||
<el-col :span="24" v-for="i in discussList">
|
<el-col :span="24" v-for="i in discussList">
|
||||||
<DisscussCard :discuss="i" />
|
<DisscussCard :discuss="i" />
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24">
|
</template>
|
||||||
<el-empty
|
<template v-else>
|
||||||
v-show="discussList.length <= 0"
|
<Skeleton :isBorder="true" />
|
||||||
description="推荐位置,空空如也"
|
</template>
|
||||||
/>
|
<template v-if="allDiscussList.length > 0">
|
||||||
</el-col>
|
<el-col :span="24" v-for="i in allDiscussList">
|
||||||
|
<DisscussCard :discuss="i" />
|
||||||
|
</el-col>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<Skeleton :isBorder="true" />
|
||||||
|
</template>
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="7">
|
<el-col :span="7">
|
||||||
<el-row class="right-div">
|
<el-row class="right-div">
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
@@ -71,43 +76,63 @@
|
|||||||
</template>
|
</template>
|
||||||
</InfoCard>
|
</InfoCard>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
<InfoCard
|
<template v-if="pointList.length > 0">
|
||||||
:items="pointList"
|
<InfoCard
|
||||||
header="本月排行"
|
:items="pointList"
|
||||||
text="更多"
|
header="本月排行"
|
||||||
height="400"
|
text="更多"
|
||||||
>
|
height="400"
|
||||||
<template #item="temp">
|
>
|
||||||
<PointsRanking :pointsData="temp" />
|
<template #item="temp">
|
||||||
</template>
|
<PointsRanking :pointsData="temp" />
|
||||||
</InfoCard>
|
</template>
|
||||||
|
</InfoCard>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<InfoCard header="本月排行" text="更多">
|
||||||
|
<template #content> <Skeleton /></template>
|
||||||
|
</InfoCard>
|
||||||
|
</template>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
<InfoCard
|
<template v-if="friendList.length > 0">
|
||||||
:items="friendList"
|
<InfoCard
|
||||||
header="推荐好友"
|
:items="friendList"
|
||||||
text="更多"
|
header="推荐好友"
|
||||||
height="400"
|
text="更多"
|
||||||
>
|
height="400"
|
||||||
<template #item="temp">
|
>
|
||||||
<RecommendFriend :friendData="temp" />
|
<template #item="temp">
|
||||||
</template>
|
<RecommendFriend :friendData="temp" />
|
||||||
</InfoCard>
|
</template>
|
||||||
|
</InfoCard>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<InfoCard header="推荐好友" text="更多">
|
||||||
|
<template #content> <Skeleton /></template>
|
||||||
|
</InfoCard>
|
||||||
|
</template>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
<InfoCard
|
<template v-if="themeList.length > 0">
|
||||||
:items="themeList"
|
<InfoCard
|
||||||
header="推荐主题"
|
:items="themeList"
|
||||||
text="更多"
|
header="推荐主题"
|
||||||
height="400"
|
text="更多"
|
||||||
>
|
height="400"
|
||||||
<template #item="temp">
|
>
|
||||||
<ThemeData :themeData="temp" />
|
<template #item="temp">
|
||||||
</template>
|
<ThemeData :themeData="temp" />
|
||||||
</InfoCard>
|
</template>
|
||||||
|
</InfoCard>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<InfoCard header="推荐主题" text="更多">
|
||||||
|
<template #content> <Skeleton /></template>
|
||||||
|
</InfoCard>
|
||||||
|
</template>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="24" style="background: transparent">
|
<el-col :span="24" style="background: transparent">
|
||||||
@@ -125,7 +150,6 @@ import DisscussCard from "@/components/DisscussCard.vue";
|
|||||||
import InfoCard from "@/components/InfoCard.vue";
|
import InfoCard from "@/components/InfoCard.vue";
|
||||||
import PlateCard from "@/components/PlateCard.vue";
|
import PlateCard from "@/components/PlateCard.vue";
|
||||||
import ScrollbarInfo from "@/components/ScrollbarInfo.vue";
|
import ScrollbarInfo from "@/components/ScrollbarInfo.vue";
|
||||||
import AvatarInfo from "@/components/AvatarInfo.vue";
|
|
||||||
import BottomInfo from "@/components/BottomInfo.vue";
|
import BottomInfo from "@/components/BottomInfo.vue";
|
||||||
import VisitsLineChart from "./components/VisitsLineChart/index.vue";
|
import VisitsLineChart from "./components/VisitsLineChart/index.vue";
|
||||||
import { access } from "@/apis/accessApi.js";
|
import { access } from "@/apis/accessApi.js";
|
||||||
@@ -138,9 +162,11 @@ import {
|
|||||||
getRecommendedFriend,
|
getRecommendedFriend,
|
||||||
getRankingPoints,
|
getRankingPoints,
|
||||||
} from "@/apis/analyseApi.js";
|
} from "@/apis/analyseApi.js";
|
||||||
|
import { getList as getAllDiscussList } from "@/apis/discussApi.js";
|
||||||
import PointsRanking from "./components/PointsRanking/index.vue";
|
import PointsRanking from "./components/PointsRanking/index.vue";
|
||||||
import RecommendFriend from "./components/RecommendFriend/index.vue";
|
import RecommendFriend from "./components/RecommendFriend/index.vue";
|
||||||
import ThemeData from "./components/RecommendTheme/index.vue";
|
import ThemeData from "./components/RecommendTheme/index.vue";
|
||||||
|
import Skeleton from "@/components/Skeleton/index.vue";
|
||||||
|
|
||||||
const plateList = ref([]);
|
const plateList = ref([]);
|
||||||
const discussList = ref([]);
|
const discussList = ref([]);
|
||||||
@@ -149,6 +175,7 @@ const weekList = ref([]);
|
|||||||
const pointList = ref([]);
|
const pointList = ref([]);
|
||||||
const friendList = ref([]);
|
const friendList = ref([]);
|
||||||
const themeList = ref([]);
|
const themeList = ref([]);
|
||||||
|
const allDiscussList = ref([]);
|
||||||
|
|
||||||
const items = [{ user: "用户1" }, { user: "用户2" }, { user: "用户3" }];
|
const items = [{ user: "用户1" }, { user: "用户2" }, { user: "用户3" }];
|
||||||
//主题查询参数
|
//主题查询参数
|
||||||
@@ -175,6 +202,12 @@ onMounted(async () => {
|
|||||||
friendList.value = friendData;
|
friendList.value = friendData;
|
||||||
const { data: themeData } = await getRecommendedTopic();
|
const { data: themeData } = await getRecommendedTopic();
|
||||||
themeList.value = themeData;
|
themeList.value = themeData;
|
||||||
|
const { data: allDiscussData } = await getAllDiscussList({
|
||||||
|
Type: 0,
|
||||||
|
skipCount: 1,
|
||||||
|
maxResultCount: 5,
|
||||||
|
});
|
||||||
|
allDiscussList.value = allDiscussData.items;
|
||||||
});
|
});
|
||||||
|
|
||||||
const weekXAxis = ["周一", "周二", "周三", "周四", "周五", "周六", "周日"];
|
const weekXAxis = ["周一", "周二", "周三", "周四", "周五", "周六", "周日"];
|
||||||
|
|||||||
@@ -8,7 +8,9 @@
|
|||||||
<el-tag effect="light" :type="userLimit.type">
|
<el-tag effect="light" :type="userLimit.type">
|
||||||
{{ userLimit.label }}
|
{{ userLimit.label }}
|
||||||
</el-tag>
|
</el-tag>
|
||||||
<el-tag effect="light" type="success">{{ pointsData.level }}</el-tag>
|
<el-tag effect="light" type="success"
|
||||||
|
>等级{{ pointsData.level }}</el-tag
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="bottom">
|
<div class="bottom">
|
||||||
<div class="name">
|
<div class="name">
|
||||||
|
|||||||
@@ -18,7 +18,9 @@
|
|||||||
<el-tag effect="light" :type="userLimit.type">
|
<el-tag effect="light" :type="userLimit.type">
|
||||||
{{ userLimit.label }}
|
{{ userLimit.label }}
|
||||||
</el-tag>
|
</el-tag>
|
||||||
<el-tag effect="light" type="success">{{ friendData.level }}</el-tag>
|
<el-tag effect="light" type="success"
|
||||||
|
>等级{{ friendData.level }}</el-tag
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
<div class="right">
|
||||||
|
|||||||
Reference in New Issue
Block a user