fix(Mys): 调整

This commit is contained in:
BTMuli
2023-03-29 17:37:07 +08:00
parent 54cccb37a5
commit de3ca7bd25
5 changed files with 63 additions and 45 deletions

View File

@@ -155,6 +155,8 @@ async function toPost(post_id: number) {
} }
.Home-pool-cover img { .Home-pool-cover img {
width: 100%;
height: auto;
transition: all 0.5s; transition: all 0.5s;
} }

View File

@@ -69,10 +69,10 @@
<v-btn <v-btn
class="ms-2" class="ms-2"
:style="{ :style="{
background: item.status_color + ' !important', background: item.status.colorCss,
color: '#faf7e8 !important', color: '#faf7e8 !important',
}" }"
>{{ item.status }}</v-btn >{{ item.status.status }}</v-btn
> >
</div> </div>
<v-btn @click="toJson(item.post_id)" class="ms-2 card-btn" v-show="appStore.devMode"> <v-btn @click="toJson(item.post_id)" class="ms-2 card-btn" v-show="appStore.devMode">

View File

@@ -111,8 +111,7 @@ export interface NewsMeta {
* @property {string} cover 封面图片 URL * @property {string} cover 封面图片 URL
* @property {number} post_id 帖子 ID * @property {number} post_id 帖子 ID
* @property {string} subtitle 副标题 * @property {string} subtitle 副标题
* @property {string} status 活动状态,仅活动咨讯有 * @property {ActivityStatus} status 活动状态,仅活动咨讯有
* @property {string} status_color 活动状态按钮背景色,仅活动咨讯有
* @return {NewsCard} * @return {NewsCard}
*/ */
export interface NewsCard { export interface NewsCard {
@@ -120,6 +119,17 @@ export interface NewsCard {
cover: string; cover: string;
post_id: number; post_id: number;
subtitle: string; subtitle: string;
status?: string; status?: ActivityStatus;
status_color?: string; }
/**
* @description 活动状态
* @since Alpha
* @property {string} status 活动状态
* @property {string} colorCss 活动状态按钮背景色
* @return {ActivityStatus}
*/
export interface ActivityStatus {
status: string;
colorCss: string;
} }

View File

@@ -5,22 +5,35 @@
* @since Alpha * @since Alpha
*/ */
import { NewsData, NewsItem, NewsCard } from "../interface/news"; import { NewsData, NewsItem, NewsCard, ActivityStatus } from "../interface/news";
/** /**
* @description 活动状态 * @description 活动状态
* @enum ActivityStatus
* @since Alpha * @since Alpha
* @property {string} STARTED 进行中 * @enum {ActivityStatus}
* @property {string} FINISHED 已结束 * @property {ActivityStatus} STARTED 进行中
* @property {string} SELECTION 评选中 * @property {ActivityStatus} FINISHED 已结束
* @return {ActivityStatus} * @property {ActivityStatus} SELECTION 评选中
* @return {EnumStatus}
*/ */
enum ActivityStatus { const EnumStatus = {
STARTED = "进行中", STARTED: {
FINISHED = "已结束", status: "进行中",
SELECTION = "评选中", colorCss: "#3c99aa !important",
} },
FINISHED: {
status: "已结束",
colorCss: "#c7674b !important",
},
SELECTION: {
status: "评选中",
colorCss: "#849cc7 !important",
},
UNKNOWN: {
status: "未知",
colorCss: "#3C3F41 !important",
},
};
/** /**
* @description 获取活动状态 * @description 获取活动状态
@@ -28,28 +41,16 @@ enum ActivityStatus {
* @param {number} status 活动状态码 * @param {number} status 活动状态码
* @return {string} * @return {string}
*/ */
export function getActivityStatus(status: number): { status: ActivityStatus; color: string } { export function getActivityStatus(status: number): ActivityStatus {
switch (status) { switch (status) {
case 1: case 1:
return { return EnumStatus.STARTED;
status: ActivityStatus.STARTED,
color: "#3c99aa",
};
case 2: case 2:
return { return EnumStatus.FINISHED;
status: ActivityStatus.FINISHED,
color: "#c7674b",
};
case 3: case 3:
return { return EnumStatus.SELECTION;
status: ActivityStatus.SELECTION,
color: "#849cc7",
};
default: default:
return { return EnumStatus.UNKNOWN;
status: ActivityStatus.FINISHED,
color: "#c7674b",
};
} }
} }
@@ -64,7 +65,7 @@ export function getNoticeCard(noticeData: NewsData): NewsCard[] {
noticeData.list.map((item: NewsItem) => { noticeData.list.map((item: NewsItem) => {
noticeCard.push({ noticeCard.push({
title: item.post.subject, title: item.post.subject,
cover: item.cover.url || item.post.cover || item.post.images[0], cover: item.cover?.url || item.post.cover || item.post.images[0],
post_id: Number(item.post.post_id), post_id: Number(item.post.post_id),
subtitle: item.post.post_id, subtitle: item.post.post_id,
}); });
@@ -86,11 +87,10 @@ export function getActivityCard(activityData: NewsData): NewsCard[] {
const status_info = getActivityStatus(item.news_meta.activity_status); const status_info = getActivityStatus(item.news_meta.activity_status);
activityCard.push({ activityCard.push({
title: item.post.subject, title: item.post.subject,
cover: item.cover.url || item.post.cover || item.post.images[0], cover: item.cover?.url || item.post.cover || item.post.images[0],
post_id: Number(item.post.post_id), post_id: Number(item.post.post_id),
subtitle: `${start_time} - ${end_time}`, subtitle: `${start_time} - ${end_time}`,
status: status_info.status, status: status_info,
status_color: status_info.color,
}); });
}); });
return activityCard; return activityCard;
@@ -107,7 +107,7 @@ export function getNewsCard(newsData: NewsData): NewsCard[] {
newsData.list.map((item: NewsItem) => { newsData.list.map((item: NewsItem) => {
newsCard.push({ newsCard.push({
title: item.post.subject, title: item.post.subject,
cover: item.cover.url || item.post.cover || item.post.images[0], cover: item.cover?.url || item.post.cover || item.post.images[0],
post_id: Number(item.post.post_id), post_id: Number(item.post.post_id),
subtitle: item.post.post_id, subtitle: item.post.post_id,
}); });

View File

@@ -17,14 +17,17 @@ export function PostParser(data: string): Document {
let jsonData: PostStructuredContent[] = JSON.parse(data); let jsonData: PostStructuredContent[] = JSON.parse(data);
// 创建 HTML 文档 // 创建 HTML 文档
const doc = document.implementation.createHTMLDocument(); const doc = document.implementation.createHTMLDocument();
// cover flag
let coverFlag = false;
// 遍历 Json 数据 // 遍历 Json 数据
jsonData.forEach((item: any) => { jsonData.forEach((item: any) => {
if (typeof item.insert === "string") { if (typeof item.insert === "string") {
const text = TextParser(item); const text = TextParser(item);
doc.body.appendChild(text); doc.body.appendChild(text);
} else if (item.insert.image) { } else if (item.insert.image) {
const img = ImageParser(item); const img = ImageParser(item, coverFlag);
doc.body.appendChild(img); coverFlag = img[1];
doc.body.appendChild(img[0]);
} else if (item.insert.vod) { } else if (item.insert.vod) {
// 创建 div // 创建 div
const video = VideoParser(item); const video = VideoParser(item);
@@ -77,9 +80,10 @@ function TextParser(data: PostStructuredContent): HTMLSpanElement {
* @description 解析图片 * @description 解析图片
* @since Alpha * @since Alpha
* @param {PostStructuredContent} data Mys数据 * @param {PostStructuredContent} data Mys数据
* @returns {HTMLDivElement} 解析后的图片 * @param {boolean} coverFlag cover 是否已经存在
* @returns {[HTMLDivElement, boolean]} 解析后的图片.第一个是图片,第二个是 coverFlag
*/ */
function ImageParser(data: PostStructuredContent): HTMLDivElement { function ImageParser(data: PostStructuredContent, coverFlag: boolean): [HTMLDivElement, boolean] {
// 检查数据 // 检查数据
if (typeof data.insert === "string") { if (typeof data.insert === "string") {
throw new Error("data.insert is a string"); throw new Error("data.insert is a string");
@@ -104,9 +108,11 @@ function ImageParser(data: PostStructuredContent): HTMLDivElement {
img.style.height = "auto"; // 高度自适应 img.style.height = "auto"; // 高度自适应
img.width = 800; // 设置宽度 img.width = 800; // 设置宽度
// 判断是否是 cover // 判断是否是 cover
if (data.attributes.width === 690 && data.attributes.height === 320) { if (!coverFlag) {
// 添加 border-radius // 添加 border-radius
img.style.borderRadius = "10px"; img.style.borderRadius = "10px";
// 设置 coverFlag
coverFlag = true;
} }
// 插入图片 // 插入图片
div.appendChild(img); div.appendChild(img);
@@ -114,7 +120,7 @@ function ImageParser(data: PostStructuredContent): HTMLDivElement {
div.style.display = "center"; // 居中 div.style.display = "center"; // 居中
div.style.margin = "20px auto"; // 设置 margin div.style.margin = "20px auto"; // 设置 margin
// 返回 div // 返回 div
return div; return [div, coverFlag];
} }
/** /**