pms-app/pages/swh/summary.vue

<template>
  <view class="swh-page">
    <view class="hero-card">
      <view class="title">数据汇总</view>
      <view class="subtitle">按期次查看各专业公司的运营会议汇总</view>
    </view>
    <view v-if="loading" class="state"><uni-load-more status="loading" /></view>
    <view v-else-if="!list.length" class="state">暂无汇总数据</view>
    <view v-else class="list">
      <view v-for="item in list" :key="`${item.id}-${item.meetingSeries}`" class="card" @click="viewDetail(item)">
        <view class="card-icon"><uni-icons type="calendar-filled" size="24" color="#fff" /></view>
        <view class="card-main">
          <view class="series">{{ item.meetingSeries || "-" }}</view>
          <view class="meta">{{ item.companyName || "生产运营汇总" }}</view>
          <view class="meta">会议日期：{{ formatDate(item.meetingDate) }}</view>
        </view>
        <uni-icons type="right" size="18" color="#94a3b8" />
      </view>
    </view>
  </view>
</template>

<script setup>
import { ref } from "vue";
import { onShow } from "@dcloudio/uni-app";
import dayjs from "dayjs";
import { getIntegratedMeetingList } from "@/api/operationMeeting";

const loading = ref(false);
const list = ref([]);

const loadList = async () => {
  loading.value = true;
  try {
    const res = await getIntegratedMeetingList();
    list.value = Array.isArray(res?.data) ? res.data : [];
  } finally {
    loading.value = false;
  }
};

const formatDate = (value) => (value ? dayjs(value).format("YYYY-MM-DD") : "-");
const viewDetail = (item) => {
  const year = item.meetingDate ? dayjs(item.meetingDate).format("YYYY") : "";
  uni.navigateTo({
    url: `/pages/swh/summary-detail?meetingSeries=${encodeURIComponent(item.meetingSeries || "")}&year=${year}`,
  });
};

onShow(loadList);
</script>

<style lang="scss" scoped>
.swh-page { min-height: 100vh; padding: 24rpx; box-sizing: border-box; background: #f4f7fb; }
.hero-card { padding: 34rpx 30rpx; border-radius: 22rpx; color: #fff; background: linear-gradient(135deg, #246bff, #4f8ff7); box-shadow: 0 14rpx 34rpx rgba(36, 107, 255, .2); }
.title { font-size: 38rpx; font-weight: 700; }
.subtitle { margin-top: 10rpx; font-size: 24rpx; opacity: .82; }
.list { margin-top: 26rpx; padding-bottom: calc(24rpx + env(safe-area-inset-bottom)); }
.card + .card { margin-top: 20rpx; }
.card { display: flex; align-items: center; padding: 28rpx 24rpx; border-radius: 20rpx; background: #fff; box-shadow: 0 8rpx 28rpx rgba(30, 64, 175, .05); }
.card-icon { width: 76rpx; height: 76rpx; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-right: 22rpx; border-radius: 20rpx; background: #f59e0b; }
.card-main { flex: 1; min-width: 0; margin-right: 12rpx; }
.series { color: #172033; font-size: 32rpx; font-weight: 700; }
.meta { margin-top: 8rpx; overflow: hidden; color: #64748b; font-size: 24rpx; text-overflow: ellipsis; white-space: nowrap; }
.state { padding: 140rpx 0; color: #94a3b8; text-align: center; }
</style>