94 lines
2.0 KiB
Vue
94 lines
2.0 KiB
Vue
<template>
|
|
<Card title="员工关怀">
|
|
<div class="bottom-left">
|
|
<!-- <div class="list-content">
|
|
<div class="list-detail" v-for="item in list" :key="item.id">
|
|
<div class="detail-pic">
|
|
<img src="@/assets/images/smartPartyBuilding/testPic.png" alt="" />
|
|
</div>
|
|
<div class="detail-text">
|
|
<div class="title">{{ item.title }}</div>
|
|
<div class="time">{{ item.grossTime }}</div>
|
|
</div>
|
|
</div>
|
|
</div> -->
|
|
</div>
|
|
</Card>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
import Card from "@/components/card.vue";
|
|
import symbolIcon from "@/assets/images/lineSymbol.png";
|
|
import { onMounted, reactive, ref, onBeforeUnmount } from "vue";
|
|
const list = reactive([
|
|
{
|
|
id: 1,
|
|
title: "学习贯彻习近平新时代有中国特色的社会主义思想主题教育深入",
|
|
grossTime: "2023-01-01 12:00:00"
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "学习贯彻习近平新时代中国特色社会主义",
|
|
grossTime: "2023-01-01 12:00:00"
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "新时代中国特色社会主义思想主题教育深入",
|
|
grossTime: "2023-01-01 12:00:00"
|
|
},
|
|
{
|
|
id: 4,
|
|
title: "中国特色社会主义思想主题教育深入",
|
|
grossTime: "2023-01-01 12:00:00"
|
|
},
|
|
{
|
|
id: 5,
|
|
title: "中国特色社会主义思想主题教育深入",
|
|
grossTime: "2023-01-01 12:00:00"
|
|
}
|
|
]);
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.bottom-left {
|
|
width: 100%;
|
|
height: 100%;
|
|
.list-content {
|
|
width: 95%;
|
|
height: 100%;
|
|
margin: 0 2% 0 5%;
|
|
overflow: scroll;
|
|
.list-detail {
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 20%;
|
|
padding-top: 4%;
|
|
.detail-pic {
|
|
width: 13%;
|
|
height: 100%;
|
|
img {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
.detail-text {
|
|
width: 100%;
|
|
margin-left: 2%;
|
|
.title {
|
|
width: 94%;
|
|
white-space: nowrap; //单行
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
font-size: 14px;
|
|
color: #ffffff;
|
|
}
|
|
.time {
|
|
margin-top: 2%;
|
|
font-size:12px;
|
|
color: #a1accb;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|