成就等界面接口调整

2025-10-31 19:13:21 +08:00
parent 9ad9507a72
commit 16754b527e
61 changed files with 4748 additions and 592 deletions
--- a/schoolNewsWeb/src/views/public/article/card/HotArticleCard.vue
+++ b/schoolNewsWeb/src/views/public/article/card/HotArticleCard.vue
@@ -1,27 +1,56 @@
 <template>
-  <div class="article-card">
+  <div class="article-card" @click="handleClick">
    <div class="article-image">
-      <div class="image-placeholder"></div>
+      <img v-if="resource?.coverImage" :src="FILE_DOWNLOAD_URL + resource.coverImage" :alt="resource.title" />
+      <div v-else class="image-placeholder"></div>
      <div class="article-tag">精选文章</div>
    </div>
    <div class="article-content">
-      <h3 class="article-title">新时代中国特色社会主义发展历程</h3>
+      <h3 class="article-title">{{ resource?.title || '标题' }}</h3>
      <p class="article-desc">
-        习近平新时代中国特色社会主义思想是当代中国马克思主义、二十一世纪马克思主义，是中华文化和中国精神的时代精华，其核心要义与实践要求内涵丰富、意义深远。
+        {{ resource?.summary || '暂无简介' }}
      </p>
      <div class="article-footer">
        <div class="meta-tag">
          <el-icon><Document /></el-icon>
          <span>热门文章</span>
        </div>
-        <span class="view-count">2.1w次浏览</span>
+        <span class="view-count">{{ formatViewCount(resource?.viewCount || 0) }}</span>
      </div>
    </div>
  </div>
 </template>

 <script setup lang="ts">
+import { computed } from 'vue';
+import { useRouter } from 'vue-router';
 import { Document } from '@element-plus/icons-vue';
+import type { ResourceRecommendVO } from '@/types';
+import { FILE_DOWNLOAD_URL } from '@/config';
+
+const props = defineProps<{
+  resource?: ResourceRecommendVO;
+}>();
+
+const router = useRouter();
+
+// 格式化浏览量
+function formatViewCount(count: number): string {
+  if (count < 1000) {
+    return `${count}次浏览`;
+  } else if (count < 10000) {
+    return `${(count / 1000).toFixed(1)}k次浏览`;
+  } else {
+    return `${(count / 10000).toFixed(1)}w次浏览`;
+  }
+}
+
+// 点击卡片
+function handleClick() {
+  if (props.resource?.resourceID) {
+    router.push(`/article/show?articleId=${props.resource.resourceID}`);
+  }
+}
 </script>

 <style lang="scss" scoped>
@@ -47,6 +76,12 @@ import { Document } from '@element-plus/icons-vue';
    overflow: hidden;
    flex-shrink: 0;

+    img {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+
    .image-placeholder {
      width: 100%;
      height: 100%;
--- a/schoolNewsWeb/src/views/public/article/card/IdeologicalArticleCard.vue
+++ b/schoolNewsWeb/src/views/public/article/card/IdeologicalArticleCard.vue
@@ -1,22 +1,55 @@
 <template>
-  <div class="ideological-card">
+  <div class="ideological-card" @click="handleClick">
    <div class="card-image">
-      <div class="image-placeholder"></div>
+      <img v-if="resource?.coverImage" :src="FILE_DOWNLOAD_URL + resource.coverImage" :alt="resource.title" />
+      <div v-else class="image-placeholder"></div>
    </div>
-    <div class="date-box">
-      <div class="day">10</div>
-      <div class="month">2025.10</div>
+    <div class="date-box" v-if="publishDate">
+      <div class="day">{{ publishDate.day }}</div>
+      <div class="month">{{ publishDate.month }}</div>
    </div>
    <div class="card-content">
-      <h3 class="card-title">学校召开"习近平新时代中国特色社会主义思想概论"课程集体备课会</h3>
+      <h3 class="card-title">{{ resource?.title || '标题' }}</h3>
      <p class="card-desc">
-        深入贯彻习近平总书记关于思政课建设的重要论述，持续推进思政课教学改革创新。
+        {{ resource?.summary || '暂无简介' }}
      </p>
    </div>
  </div>
 </template>

 <script setup lang="ts">
+import { computed } from 'vue';
+import { useRouter } from 'vue-router';
+import type { ResourceRecommendVO } from '@/types';
+import { FILE_DOWNLOAD_URL } from '@/config';
+
+const props = defineProps<{
+  resource?: ResourceRecommendVO;
+}>();
+
+const router = useRouter();
+
+// 格式化发布日期
+const publishDate = computed(() => {
+  if (!props.resource?.publishTime) return null;
+  
+  const date = new Date(props.resource.publishTime);
+  const day = date.getDate();
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  
+  return {
+    day: day.toString(),
+    month: `${year}.${month.toString().padStart(2, '0')}`
+  };
+});
+
+// 点击卡片
+function handleClick() {
+  if (props.resource?.resourceID) {
+    router.push(`/article/show?articleId=${props.resource.resourceID}`);
+  }
+}
 </script>

 <style lang="scss" scoped>
@@ -42,6 +75,12 @@
    flex-shrink: 0;
    overflow: hidden;

+    img {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+
    .image-placeholder {
      width: 100%;
      height: 100%;
@@ -59,9 +98,8 @@
  }

  .date-box {
-    position: absolute;
-    top: calc(57.55% - 3.5em);
-    left: 5.7%;
+    margin: 0 5.7%;
+    transform: translateY(-50%);
    width: 18.75%;
    aspect-ratio: 1 / 1;
    background: #C62828;
@@ -73,7 +111,6 @@
    gap: 0.3em;
    padding: 0.4em 0.3em;
    box-sizing: border-box;
-    z-index: 10;

    .day {
      font-family: 'PingFang SC';
@@ -97,7 +134,7 @@
  }

  .card-content {
-    padding: 17.4% 5.7% 5.7% 5.7%;
+    padding: 0 5.7% 5.7% 5.7%;
    flex: 1;
    display: flex;
    flex-direction: column;
--- a/schoolNewsWeb/src/views/public/article/components/ArticleShow.vue
+++ b/schoolNewsWeb/src/views/public/article/components/ArticleShow.vue
@@ -645,8 +645,7 @@ defineExpose({
 <style lang="scss" scoped>
 // 路由页面模式样式
 .article-page-view {
-  min-height: 100vh;
-  background: #f5f7fa;
+  // background: #f5f7fa;
  padding-bottom: 60px;
 }

@@ -675,7 +674,7 @@ defineExpose({
  padding: 40px 24px;
  background: #fff;
  border-radius: 8px;
-  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
+  // box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
 }

 .error-container {
--- a/schoolNewsWeb/src/views/public/task/LearningTaskAdd.vue
+++ b/schoolNewsWeb/src/views/public/task/LearningTaskAdd.vue
@@ -60,6 +60,30 @@
            <span v-if="errors.endTime" class="error-msg">{{ errors.endTime }}</span>
          </div>
        </div>
+
+        <div class="form-group">
+          <label class="form-label">任务分类标签</label>
+          <select 
+            v-model="selectedTagID" 
+            class="form-input form-select"
+            @change="handleTagChange"
+          >
+            <option value="">请选择分类标签（可选）</option>
+            <option 
+              v-for="tag in availableTags" 
+              :key="tag.tagID"
+              :value="tag.tagID"
+            >
+              {{ tag.name }}
+            </option>
+          </select>
+          <div v-if="selectedTag" class="selected-tag-preview">
+            <div class="tag-badge" :style="{ backgroundColor: selectedTag.color || '#409eff' }">
+              {{ selectedTag.name }}
+            </div>
+            <span v-if="selectedTag.description" class="tag-hint">{{ selectedTag.description }}</span>
+          </div>
+        </div>
      </section>

      <!-- 选择课程 -->
@@ -273,6 +297,7 @@
      @confirm="handleUserSelectConfirm"
      @cancel="showUserSelector = false"
    />
+
  </div>
 </template>

@@ -283,9 +308,10 @@ import { courseApi } from '@/apis/study';
 import { resourceApi } from '@/apis/resource';
 import { userApi } from '@/apis/system';
 import { learningTaskApi } from '@/apis/study';
+import { resourceTagApi } from '@/apis/resource';
 import { GenericSelector } from '@/components/base';
 import type { TaskVO, Course, TaskItemVO } from '@/types/study';
-import type { Resource } from '@/types/resource';
+import type { Resource, Tag } from '@/types/resource';
 import type { SysUser } from '@/types/user';

 defineOptions({
@@ -331,11 +357,14 @@ const errors = ref({
 const selectedCourses = ref<Course[]>([]);
 const selectedResources = ref<Resource[]>([]);
 const selectedUsers = ref<SysUser[]>([]);
+const selectedTagID = ref<string>('');
+const selectedTag = ref<Tag | null>(null);

 // 可选数据
 const availableCourses = ref<Course[]>([]);
 const availableResources = ref<Resource[]>([]);
 const availableUsers = ref<SysUser[]>([]);
+const availableTags = ref<Tag[]>([]);

 // 弹窗控制
 const showCourseSelector = ref(false);
@@ -350,6 +379,7 @@ const resourceSearchKeyword = ref('');
 const courseLoading = ref(false);
 const resourceLoading = ref(false);
 const userLoading = ref(false);
+const tagLoading = ref(false);
 const submitting = ref(false);

 onMounted(async () => {
@@ -357,7 +387,8 @@ onMounted(async () => {
  await Promise.all([
    loadCourses(),
    loadResources(),
-    loadUsers()
+    loadUsers(),
+    loadTags()
  ]);
  
  // 如果是编辑模式，加载任务数据并恢复选择
@@ -398,6 +429,13 @@ async function loadTask() {
        const userIds = taskData.value.taskUsers.map(tu => tu.userID);
        selectedUsers.value = availableUsers.value.filter(u => userIds.includes(u.id));
      }
+      
+      // 恢复标签选择
+      if (taskData.value.taskTags && taskData.value.taskTags.length > 0) {
+        const firstTag = taskData.value.taskTags[0];
+        selectedTagID.value = firstTag.tagID || '';
+        selectedTag.value = firstTag;
+      }
    }
  } catch (error) {
    console.error('加载任务失败:', error);
@@ -671,6 +709,31 @@ function removeUser(index: number) {
  selectedUsers.value.splice(index, 1);
 }

+// 加载标签列表
+async function loadTags() {
+  tagLoading.value = true;
+  try {
+    const res = await resourceTagApi.getTagList({ tagType: 3 }); // 获取所有标签
+    if (res.success && res.dataList) {
+      // 只保留 tagType 为 3 的学习任务分类标签
+      availableTags.value = res.dataList.filter(tag => tag.tagType === 3);
+    }
+  } catch (error) {
+    console.error('加载标签失败:', error);
+  } finally {
+    tagLoading.value = false;
+  }
+}
+
+// 处理标签选择变化
+function handleTagChange() {
+  if (selectedTagID.value) {
+    selectedTag.value = availableTags.value.find(tag => tag.tagID === selectedTagID.value) || null;
+  } else {
+    selectedTag.value = null;
+  }
+}
+
 // 表单验证
 function validateTaskName() {
  if (!taskData.value.learningTask.name) {
@@ -750,6 +813,9 @@ async function handleSubmit() {
      status: 0
    } as TaskItemVO));
    
+    // 组装任务标签数据
+    taskData.value.taskTags = selectedTag.value ? [selectedTag.value] : [];
+    
    let res;
    if (props.taskId) {
      res = await learningTaskApi.updateTask(taskData.value);
@@ -890,6 +956,38 @@ function handleCancel() {
  }
 }

+.form-select {
+  cursor: pointer;
+  appearance: none;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 1024'%3E%3Cpath fill='%23606266' d='M831.872 340.864 512 652.672 192.128 340.864a30.592 30.592 0 0 0-42.752 0 29.12 29.12 0 0 0 0 41.6L489.664 714.24a32 32 0 0 0 44.672 0l340.288-331.712a29.12 29.12 0 0 0 0-41.728 30.592 30.592 0 0 0-42.752 0z'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 8px center;
+  background-size: 14px;
+  padding-right: 30px;
+}
+
+.selected-tag-preview {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-top: 8px;
+
+  .tag-badge {
+    display: inline-flex;
+    align-items: center;
+    padding: 4px 12px;
+    border-radius: 4px;
+    color: #fff;
+    font-size: 13px;
+    font-weight: 500;
+  }
+
+  .tag-hint {
+    font-size: 12px;
+    color: #909399;
+  }
+}
+
 .form-textarea {
  resize: vertical;
  font-family: inherit;
@@ -1185,5 +1283,6 @@ function handleCancel() {
  color: #909399;
  margin: 0;
 }
+
 </style>