102 lines
1.9 KiB
Vue
102 lines
1.9 KiB
Vue
|
<template>
|
|||
|
|
<div class="policy-speech">
|
|||
|
|
<h2 class="page-title">政策讲话</h2>
|
|||
|
|
<div class="speech-list">
|
|||
|
|
<div class="speech-item" v-for="speech in speeches" :key="speech.id" @click="viewSpeech(speech)">
|
|||
|
|
<div class="speech-header">
|
|||
|
|
<h3>{{ speech.title }}</h3>
|
|||
|
|
<span class="speech-date">{{ speech.date }}</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="speech-info">
|
|||
|
|
<span class="speaker">讲话人：{{ speech.speaker }}</span>
|
|||
|
|
<span class="occasion">场合：{{ speech.occasion }}</span>
|
|||
|
|
</div>
|
|||
|
|
<p class="speech-summary">{{ speech.summary }}</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup lang="ts">
|
|||
|
|
import { ref, onMounted } from 'vue';
|
|||
|
|
import { useRouter } from 'vue-router';
|
|||
|
|
|
|||
|
|
const router = useRouter();
|
|||
|
|
const speeches = ref<any[]>([]);
|
|||
|
|
|
|||
|
|
onMounted(() => {
|
|||
|
|
// TODO: 加载政策讲话数据
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
function viewSpeech(speech: any) {
|
|||
|
|
router.push(`/resource/speech/${speech.id}`);
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.policy-speech {
|
|||
|
|
background: white;
|
|||
|
|
padding: 40px;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.page-title {
|
|||
|
|
font-size: 28px;
|
|||
|
|
font-weight: 600;
|
|||
|
|
color: #141F38;
|
|||
|
|
margin-bottom: 32px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.speech-list {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
gap: 16px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.speech-item {
|
|||
|
|
padding: 24px;
|
|||
|
|
border: 1px solid #e0e0e0;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
cursor: pointer;
|
|||
|
|
transition: all 0.3s;
|
|||
|
|
|
|||
|
|
&:hover {
|
|||
|
|
border-color: #C62828;
|
|||
|
|
box-shadow: 0 2px 8px rgba(198, 40, 40, 0.1);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.speech-header {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
margin-bottom: 12px;
|
|||
|
|
|
|||
|
|
h3 {
|
|||
|
|
font-size: 18px;
|
|||
|
|
font-weight: 600;
|
|||
|
|
color: #141F38;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.speech-date {
|
|||
|
|
font-size: 14px;
|
|||
|
|
color: #999;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.speech-info {
|
|||
|
|
display: flex;
|
|||
|
|
gap: 24px;
|
|||
|
|
margin-bottom: 12px;
|
|||
|
|
font-size: 14px;
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.speech-summary {
|
|||
|
|
font-size: 14px;
|
|||
|
|
color: #666;
|
|||
|
|
line-height: 1.6;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
|