Commit 20bec89e by 吴春元

修改细节

parent 99469e05
......@@ -67,7 +67,7 @@
// 字体
fontSize: {
type: String,
default: '14px'
default: '16px'
},
// 是否滚动,默认是,否则是不滚动,按个数等分宽度
scroll: {
......@@ -248,6 +248,7 @@
.scroll-item {
position: relative;
padding: 0 10px;
margin-left: 10px;
display: inline-block;
text-align: center;
color: rgba(255, 255, 255, 0.7);
......
......@@ -2,13 +2,20 @@
<view class="app-container">
<!-- 顶部轮播图 -->
<view class="banner-container">
<view class="banner-title">
<!-- <view class="banner-title">
<image :src="logoUrl" mode="aspectFit" class="logo-image" />
<text class="title-text">太原市互联网应急指挥和举报中心</text>
</view>
<swiper class="swiper" :indicator-dots="true" :autoplay="true" :interval="3000" :duration="500">
</view> -->
<!-- <view class="banner-title1">
<text class="title-text">太原市互联网应急指挥和举报中心</text>
</view> -->
<swiper class="swiper" :indicator-dots="true" :autoplay="true" :interval="3000" :duration="500"
@change="onSlideChange">
<swiper-item v-for="(banner, index) in slides" :key="index" @click="goToDetails(banner)">
<image :src="banner.images" :alt="banner.contentTitle" mode="aspectFill" class="banner-image" />
<view class="banner-title1">
<text class="title-text">{{banner.contentTitle}}</text>
</view>
</swiper-item>
</swiper>
</view>
......@@ -32,6 +39,7 @@
<image :src="news.images" :alt="news.contentTitle" mode="aspectFill" class="news-image" />
<view class="news-content">
<text class="news-title">{{ news.contentTitle }}</text>
<text class="news-title1">{{ news.contentDescription }}</text>
<text class="news-date">{{ news.contentDatetime }}</text>
</view>
</view>
......@@ -45,9 +53,11 @@
</view>
<view class="news-list">
<view v-for="(news, index) in sxNews" :key="index" class="news-card" @click="goToDetails(news)">
<image :src="news.images" :alt="news.contentTitle" mode="aspectFill" class="news-image" />
<image v-if="news.images" :src="news.images" :alt="news.contentTitle" mode="aspectFill"
class="news-image" />
<view class="news-content">
<text class="news-title">{{ news.contentTitle }}</text>
<text class="news-title1">{{ news.contentDescription }}</text>
<text class="news-date">{{ news.contentDatetime }}</text>
</view>
</view>
......@@ -64,6 +74,7 @@
<image :src="news.images" :alt="news.contentTitle" mode="aspectFill" class="news-image" />
<view class="news-content">
<text class="news-title">{{ news.contentTitle }}</text>
<text class="news-title1">{{ news.contentDescription }}</text>
<text class="news-date">{{ news.contentDatetime }}</text>
</view>
</view>
......@@ -79,6 +90,11 @@
const rdNews = ref([]);
const sxNews = ref([]);
const tyNews = ref([]);
const bannerTitle = ref();
const onSlideChange = (value : any) => {
console.log(value);
}
getLbtList(5, 1);
......@@ -247,6 +263,20 @@
border-radius: 30rpx;
}
.banner-title1 {
max-width: 80%;
position: absolute;
left: 12rpx;
bottom: 0;
margin-bottom: 10rpx;
z-index: 10;
display: flex;
align-items: center;
background-color: rgba(0, 0, 0, 0.5);
padding: 5rpx 25rpx;
border-radius: 30rpx;
}
.logo-image {
width: 40rpx;
height: 40rpx;
......@@ -255,7 +285,14 @@
.title-text {
color: #ffffff;
font-size: 14px;
font-size: 16px;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.swiper {
......@@ -263,6 +300,20 @@
height: 440rpx;
}
.swiper .wx-swiper-dot {
background-color: #999999;
}
.swiper .wx-swiper-dot-active {
background-color: #ffffff;
}
/* 右下角 */
.wx-swiper-dots.wx-swiper-dots-horizontal {
width: 90%;
text-align: right;
}
.banner-image {
width: 100%;
height: 440rpx;
......@@ -310,7 +361,7 @@
.news-section {
padding: 0 32rpx;
margin-top: 32rpx;
margin-top: 25rpx;
}
.section-header {
......@@ -321,7 +372,7 @@
}
.section-title {
font-size: 18px;
font-size: 20px;
font-weight: 500;
}
......@@ -358,17 +409,28 @@
}
.news-title {
font-size: 16px;
margin-bottom: 10rpx;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.news-title1 {
font-size: 14px;
margin-bottom: 16rpx;
color: #999999;
margin-bottom: 10rpx;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.news-date {
font-size: 12px;
font-size: 13px;
color: #999999;
}
......
......@@ -9,6 +9,7 @@
<image v-if="news.image" class="news-image" :src="news.image" mode="aspectFill" />
<view class="news-info">
<text class="news-title">{{ news.contentTitle }}</text>
<text class="news-title1">{{ news.contentDescription }}</text>
<text class="news-date">{{ news.contentDatetime }}</text>
</view>
</view>
......@@ -188,17 +189,29 @@
}
.news-title {
font-size: 14px;
font-size: 16px;
color: #333333;
line-height: 1.4;
display: -webkit-box;
margin-bottom: 10rpx;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.news-title1 {
font-size: 14px;
color: #999999;
margin-bottom: 10rpx;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.news-date {
font-size: 12px;
font-size: 15px;
color: #999999;
margin-top: 10rpx;
}
......
......@@ -34,6 +34,7 @@
<view class="message-list">
<view v-for="item in hotList" :key="item.id" class="message-item" @click="goToDetails(item.id)">
<text class="title line-clamp-2">{{ item.title }}</text>
<text class="item-content">{{ item.content }}</text>
<view class="message-info">
<text class="date">{{ item.contentDatetime }}</text>
<text
......@@ -54,7 +55,7 @@
<view class="reply-header">
<text class="reply-title">{{ item.title }}</text>
</view>
<text class="reply-content">{{ item.content }}</text>
<text class="item-content">{{ item.content }}</text>
<view class="reply-footer">
<text class="reply-date">{{ item.contentDatetime }}</text>
<text
......@@ -197,7 +198,7 @@
border-radius: 12rpx;
padding: 8rpx 24rpx;
color: #ffffff;
font-size: 14px;
font-size: 18px;
margin-bottom: 16rpx;
margin-top: 70rpx;
}
......@@ -212,7 +213,7 @@
.slogan {
color: rgba(255, 255, 255, 0.9);
font-size: 14px;
font-size: 16px;
display: block;
}
......@@ -234,7 +235,7 @@
flex: 1;
height: 60rpx;
padding: 0 16rpx;
font-size: 14px;
font-size: 16px;
color: #333;
}
......@@ -320,9 +321,21 @@
}
.title {
font-size: 16px;
margin-bottom: 16rpx;
display: block;
}
.item-content{
font-size: 14px;
margin-bottom: 16rpx;
color: #999999;
display: block;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.reply-header {
......@@ -332,7 +345,7 @@
}
.reply-title {
font-size: 14px;
font-size: 16px;
font-weight: 500;
flex: 1;
-webkit-line-clamp: 2;
......@@ -359,7 +372,7 @@
}
.status-tag {
font-size: 12px;
font-size: 14px;
padding: 4rpx 16rpx;
border-radius: 32rpx;
display: inline-block;
......@@ -382,7 +395,7 @@
}
.reply-date {
font-size: 12px;
font-size: 13px;
color: #9ca3af;
}
</style>
\ No newline at end of file
......@@ -11,6 +11,7 @@
</view>
<view class="news-content">
<text class="news-title">{{ item.contentTitle }}</text>
<text class="news-title1">{{ item.contentDescription }}</text>
<text class="news-date">{{ item.contentDatetime }}</text>
</view>
</view>
......@@ -179,12 +180,25 @@
font-weight: 500;
display: -webkit-box;
-webkit-line-clamp: 2;
margin-bottom: 10rpx;
-webkit-box-orient: vertical;
overflow: hidden;
}
.news-title1 {
font-size: 14px;
color: #999999;
margin-bottom: 10rpx;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.news-date {
font-size: 12px;
font-size: 13px;
color: #999999;
}
</style>
\ No newline at end of file
......@@ -8,8 +8,6 @@
<view class="info-row">
<text
:class="['reply-status', detail.replyStatus === '1' ? 'replied' : 'pending']">{{ detail.replyStatus == "1" ? "已回复" : "未回复" }}</text>
<!-- <text :class="detail.replyStatus == '1'
?'status-tag':'status-tag-red'">{{ detail.replyStatus == "1" ? "已回复" : "未回复" }}</text> -->
<text class="info-text">留言人: ***{{'&nbsp;'}}</text>
<text class="divider">|</text>
<text class="info-text">{{detail.contentDatetime}}</text>
......@@ -18,7 +16,7 @@
<!-- 诉求内容 -->
<view class="content-section">
<text class="section-title">问题内容:</text>
<text class="description">{{detail.content}}</text>
<text class="description1">{{detail.content}}</text>
<!-- <textarea class="textarea" fixed disabled auto-height :value="detail.content"></textarea> -->
</view>
<!-- 附件列表 -->
......@@ -37,7 +35,7 @@
<!-- 官方回复 -->
<view class="reply-card" v-if="detail.reply != null">
<text class="section-title2">官方回复</text>
<text class="description" >{{detail.reply}}</text>
<text class="description">{{detail.reply}}</text>
<!-- <rich-text class="reply-text" :nodes="detail.reply"></rich-text> -->
<!-- <textarea class="textarea" fixed disabled auto-height :value="detail.reply"></textarea> -->
......@@ -163,8 +161,8 @@
}
.title {
font-size: 18px;
font-weight: 500;
font-size: 20px;
font-weight: 800;
color: #333333;
margin-bottom: 20rpx;
display: block;
......@@ -196,7 +194,7 @@
.info-text {
color: #999;
font-size: 25rpx;
font-size: 14px;
margin-left: 10rpx;
}
......@@ -213,7 +211,7 @@
.section-title {
color: black;
font-size: 14px;
font-size: 18px;
font-weight: 500;
margin-bottom: 20rpx;
display: block;
......@@ -221,15 +219,23 @@
.section-title2 {
color: red;
font-size: 14px;
font-size: 16px;
font-weight: 500;
margin-bottom: 20rpx;
display: block;
}
.description1 {
color: #777777;
font-size: 16px;
line-height: 1.8;
margin-bottom: 30rpx;
display: block;
}
.description {
color: #333333;
font-size: 14px;
font-size: 16px;
line-height: 1.8;
margin-bottom: 30rpx;
display: block;
......
......@@ -160,7 +160,7 @@
.message-content {
display: block;
font-size: 14px;
color: #666666;
color: #999999;
line-height: 1.6;
margin-bottom: 20rpx;
display: -webkit-box;
......@@ -180,12 +180,12 @@
}
.message-time {
font-size: 12px;
font-size: 13px;
color: #999999;
}
.reply-status {
font-size: 12px;
font-size: 14px;
padding: 4rpx 16rpx;
border-radius: 32rpx;
display: inline-block;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment