迁移党史教育

This commit is contained in:
aixianling
2021-12-20 10:22:24 +08:00
parent e563bd7588
commit 350119e783
9 changed files with 149 additions and 99 deletions

View File

@@ -1,5 +1,5 @@
<template> <template>
<section class="home"> <section class="AppPartyHistoryEducation">
<div class="page"> <div class="page">
<div class="title"> <div class="title">
<div class="left"> <div class="left">
@@ -10,12 +10,13 @@
<img src="https://cdn.cunwuyun.cn/img/down.svg" class="right-icon"> <img src="https://cdn.cunwuyun.cn/img/down.svg" class="right-icon">
</div> </div>
</div> </div>
<div class="header" v-for="(item, index) in todayList" :key="index" @click="handleGoto(`./todayDetail?id=${item.id}`)"> <div class="header" v-for="(item, index) in todayList" :key="index"
@click="handleGoto(`./todayDetail?id=${item.id}`)">
<img :src="item.thumbUrl[0].url" alt="" v-if="item.thumbUrl && item.thumbUrl.length"> <img :src="item.thumbUrl[0].url" alt="" v-if="item.thumbUrl && item.thumbUrl.length">
<p class="text">{{item.title}}</p> <p class="text">{{ item.title }}</p>
<p class="time">{{item.organizationName}} {{item.publishDate || ''}}</p> <p class="time">{{ item.organizationName }} {{ item.publishDate || '' }}</p>
</div> </div>
<AiEmpty v-if="todayList.length == 0" /> <AiEmpty v-if="todayList.length == 0"/>
<div class="line-bg"></div> <div class="line-bg"></div>
<div class="title"> <div class="title">
<div class="left"> <div class="left">
@@ -27,12 +28,13 @@
</div> </div>
</div> </div>
<div class="tab-content"> <div class="tab-content">
<div class="tab-item" v-for="(item, index) in classList" :key="index" @click="handleGoto(`./videoDetail?id=${item.id}`)"> <div class="tab-item" v-for="(item, index) in classList" :key="index"
@click="handleGoto(`./videoDetail?id=${item.id}`)">
<img :src="item.thumbUrl[0].url" alt="" v-if="item.thumbUrl && item.thumbUrl.length"> <img :src="item.thumbUrl[0].url" alt="" v-if="item.thumbUrl && item.thumbUrl.length">
<p>{{item.title}}</p> <p>{{ item.title }}</p>
</div> </div>
</div> </div>
<AiEmpty v-if="classList.length == 0" /> <AiEmpty v-if="classList.length == 0"/>
<div class="line-bg"></div> <div class="line-bg"></div>
<div class="title"> <div class="title">
<div class="left"> <div class="left">
@@ -45,25 +47,28 @@
</div> </div>
<div class="new-list"> <div class="new-list">
<div class="list-content"> <div class="list-content">
<div class="bg-fff" v-for="(item, index) in knowledgeList" :key="index" @click="handleGoto(`./todayDetail?type=know&id=${item.id}`)"> <div class="bg-fff" v-for="(item, index) in knowledgeList" :key="index"
@click="handleGoto(`./todayDetail?type=know&id=${item.id}`)">
<div class="item"> <div class="item">
<div class="info"> <div class="info">
<p>{{ item.title }}</p> <p>{{ item.title }}</p>
<span>{{ item.organizationName }} {{ item.createDate }}</span> <span>{{ item.organizationName }} {{ item.createDate }}</span>
</div> </div>
<img :src="item.thumbUrl[0].url" alt="" v-if="item.thumbUrl && item.thumbUrl.length" /> <img :src="item.thumbUrl[0].url" alt="" v-if="item.thumbUrl && item.thumbUrl.length"/>
</div> </div>
</div> </div>
<AiEmpty v-if="knowledgeList.length == 0" /> <AiEmpty v-if="knowledgeList.length == 0"/>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
</template> </template>
<script> <script>
import { mapState } from "vuex"; import {mapState} from "vuex";
export default { export default {
name: "home", name: "AppPartyHistoryEducation",
appName: "党史教育",
computed: { computed: {
...mapState(["user", "token"]), ...mapState(["user", "token"]),
}, },
@@ -74,7 +79,7 @@ export default {
knowledgeList: [] knowledgeList: []
}; };
}, },
onLoad(options) { onLoad() {
this.getTodayList() this.getTodayList()
this.getClassList() this.getClassList()
this.getKnowledgeList() this.getKnowledgeList()
@@ -85,10 +90,10 @@ export default {
if (res.code == 0) { if (res.code == 0) {
if (res.data && res.data.records) { if (res.data && res.data.records) {
res.data.records.map((item) => { res.data.records.map((item) => {
if(item.thumbUrl) { if (item.thumbUrl) {
item.thumbUrl = JSON.parse(item.thumbUrl) item.thumbUrl = JSON.parse(item.thumbUrl)
} }
if(item.publishDate) { if (item.publishDate) {
item.publishDate = item.publishDate.substring(0, 10) item.publishDate = item.publishDate.substring(0, 10)
} }
}) })
@@ -114,10 +119,10 @@ export default {
if (res.code == 0) { if (res.code == 0) {
if (res.data && res.data.records) { if (res.data && res.data.records) {
res.data.records.map((item) => { res.data.records.map((item) => {
if(item.thumbUrl) { if (item.thumbUrl) {
item.thumbUrl = JSON.parse(item.thumbUrl) item.thumbUrl = JSON.parse(item.thumbUrl)
} }
if(item.createDate) { if (item.createDate) {
item.createDate = item.createDate.substring(0, 10) item.createDate = item.createDate.substring(0, 10)
} }
}) })
@@ -127,7 +132,7 @@ export default {
}); });
}, },
handleGoto(url) { handleGoto(url) {
uni.navigateTo({ url }); uni.navigateTo({url});
}, },
toNewDetail(id) { toNewDetail(id) {
this.handleGoto(`/pages/party/partyHistory/detail?id=${id}`); this.handleGoto(`/pages/party/partyHistory/detail?id=${id}`);
@@ -137,20 +142,24 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
@import "../../../common/common.css"; @import "../../../common/common.css";
.home {
.AppPartyHistoryEducation {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.page { .page {
width: 100%; width: 100%;
overflow-x: hidden; overflow-x: hidden;
background-color: #fff; background-color: #fff;
.title{
.title {
padding: 28px 16px 28px 28px; padding: 28px 16px 28px 28px;
background-color: #fff; background-color: #fff;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.tips{
.tips {
display: inline-block; display: inline-block;
width: 8px; width: 8px;
height: 32px; height: 32px;
@@ -158,22 +167,25 @@ export default {
vertical-align: middle; vertical-align: middle;
margin-right: 18px; margin-right: 18px;
} }
.right-icon{
.right-icon {
width: 32px; width: 32px;
height: 32px; height: 32px;
float: right; float: right;
vertical-align: middle; vertical-align: middle;
transform:rotate(270deg); transform: rotate(270deg);
padding: 0px 8px 0 0; padding: 0 8px 0 0;
} }
.left{
.left {
font-size: 34px; font-size: 34px;
font-family: PingFang-SC-Heavy, PingFang-SC; font-family: PingFang-SC-Heavy, PingFang-SC;
font-weight: 800; font-weight: 800;
color: #333; color: #333;
line-height: 48px; line-height: 48px;
} }
.right{
.right {
font-size: 28px; font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
@@ -181,14 +193,17 @@ export default {
line-height: 40px; line-height: 40px;
} }
} }
.header{
.header {
padding: 0 34px 40px 34px; padding: 0 34px 40px 34px;
img{
img {
width: 684px; width: 684px;
height: 252px; height: 252px;
margin-bottom: 32px; margin-bottom: 32px;
} }
.text{
.text {
font-size: 32px; font-size: 32px;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
@@ -205,7 +220,8 @@ export default {
line-clamp: 2; line-clamp: 2;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
} }
.time{
.time {
font-size: 24px; font-size: 24px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400; font-weight: 400;
@@ -213,29 +229,34 @@ export default {
line-height: 30px; line-height: 30px;
} }
} }
.line-bg{
.line-bg {
width: 100%; width: 100%;
height: 12px; height: 12px;
background: #F2F2F2; background: #F2F2F2;
} }
.tab-content{
.tab-content {
padding: 0 0 40px 30px; padding: 0 0 40px 30px;
overflow-x: hidden; overflow-x: hidden;
height: 236px; height: 236px;
width: 800px; width: 800px;
.tab-item{
.tab-item {
float: left; float: left;
width: 236px; width: 236px;
height: 236px; height: 236px;
background: #FFF; background: #FFF;
box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.12); box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.12);
border-radius: 8px; border-radius: 8px;
margin-right: 16px; margin-right: 16px;
img{
img {
width: 236px; width: 236px;
height: 160px; height: 160px;
} }
p{
p {
padding: 12px 8px 0; padding: 12px 8px 0;
font-size: 26px; font-size: 26px;
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
@@ -243,17 +264,20 @@ export default {
color: #333; color: #333;
line-height: 36px; line-height: 36px;
overflow: hidden; overflow: hidden;
text-overflow:ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
} }
} }
.new-list { .new-list {
background-color: #fff; background-color: #fff;
.list-content { .list-content {
.bg-fff { .bg-fff {
padding: 0 30px; padding: 0 30px;
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
.item { .item {
padding: 24px 0 32px 0; padding: 24px 0 32px 0;
border-bottom: 2px solid #eee; border-bottom: 2px solid #eee;
@@ -278,6 +302,7 @@ export default {
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
margin-bottom: 52px; margin-bottom: 52px;
} }
span { span {
font-size: 24px; font-size: 24px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
@@ -286,6 +311,7 @@ export default {
line-height: 30px; line-height: 30px;
} }
} }
img { img {
width: 224px; width: 224px;
height: 168px; height: 168px;
@@ -293,6 +319,7 @@ export default {
} }
} }
} }
.view-more { .view-more {
background-color: #fff; background-color: #fff;
font-size: 28px; font-size: 28px;

View File

@@ -25,7 +25,7 @@ export default {
classList: [] classList: []
}; };
}, },
onLoad(options) { onLoad() {
this.getClassList() this.getClassList()
}, },
methods: { methods: {

View File

@@ -188,33 +188,33 @@ export default {
.page { .page {
.search-box { .search-box {
width: 100%; width: 100%;
height: 112rpx; height: 112px;
background-color: #e60012; background-color: #e60012;
padding: 24rpx 32rpx; padding: 24px 32px;
box-sizing: border-box; box-sizing: border-box;
} }
.slect { .slect {
width: 100%; width: 100%;
height: 96rpx; height: 96px;
background-color: #fff; background-color: #fff;
color: #666; color: #666;
.type-slect { .type-slect {
width: 50%; width: 50%;
border-right: 1rpx solid #f7f7f7; border-right: 1px solid #f7f7f7;
margin: 30rpx 0; margin: 30px 0;
box-sizing: border-box; box-sizing: border-box;
text-align: center; text-align: center;
font-size: 26rpx; font-size: 26px;
.uni-input { .uni-input {
display: inline-block; display: inline-block;
} }
image { image {
width: 32rpx; width: 32px;
height: 32rpx; height: 32px;
display: inline-block; display: inline-block;
position: relative; position: relative;
top: 6rpx; top: 6px;
margin-left: 8srpx; margin-left: 8spx;
} }
} }
.type-slect:nth-child(2) { .type-slect:nth-child(2) {
@@ -222,12 +222,12 @@ export default {
} }
} }
.session-list { .session-list {
padding-top: 112rpx; padding-top: 112px;
.session-item { .session-item {
width: 686rpx; width: 686px;
padding: 32px; padding: 32px;
box-sizing: border-box; box-sizing: border-box;
margin: 0 auto 32rpx auto; margin: 0 auto 32px auto;
background-color: #fff; background-color: #fff;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
@@ -286,7 +286,7 @@ export default {
} }
.no-affairs { .no-affairs {
width: 100%; width: 100%;
height: calc(100% - 210rpx); height: calc(100% - 210px);
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;

View File

@@ -9,11 +9,11 @@
<div class="uni-list-cell"> <div class="uni-list-cell">
<div class="uni-list-cell-db"> <div class="uni-list-cell-db">
<picker <picker
@change="bindPickerChange" @change="bindPickerChange"
:range="array" :range="array"
range-key="dictName" range-key="dictName"
> >
<div class="uni-input">{{styleText}}</div> <div class="uni-input">{{ styleText }}</div>
<image src="https://cdn.cunwuyun.cn/img/down.svg"></image> <image src="https://cdn.cunwuyun.cn/img/down.svg"></image>
</picker> </picker>
</div> </div>
@@ -24,12 +24,12 @@
<div class="uni-list-cell"> <div class="uni-list-cell">
<div class="uni-list-cell-db"> <div class="uni-list-cell-db">
<picker <picker
mode="date" mode="date"
:value="date" :value="date"
:start="startDate" :start="startDate"
:end="endDate" :end="endDate"
@change="bindDateChange" @change="bindDateChange"
fields="month" fields="month"
> >
<div class="uni-input">{{ day }}</div> <div class="uni-input">{{ day }}</div>
<image src="https://cdn.cunwuyun.cn/img/down.svg"></image> <image src="https://cdn.cunwuyun.cn/img/down.svg"></image>
@@ -42,16 +42,20 @@
<div class="session-list"> <div class="session-list">
<div class="session-item" v-for="(item, index) in meetList" :key="index" @click="toDetail(item.id)"> <div class="session-item" v-for="(item, index) in meetList" :key="index" @click="toDetail(item.id)">
<div class="info"> <div class="info">
<p v-if="fromType != 'style'"><span :class="item.style == 0 ? 'status0' : 'status1'">{{item.style == 0 ? '党史知识' : '党史图书馆'}}</span>{{item.title}}</p> <p v-if="fromType != 'style'"><span
<p v-else><span class="status0">{{ $dict.getLabel(`partyHistoryType${optionStyle}`, item.type) }}</span>{{item.title}}</p> :class="item.style == 0 ? 'status0' : 'status1'">{{ item.style == 0 ? '党史知识' : '党史图书馆' }}</span>{{ item.title }}
<span class="time">{{item.organizationName}} {{item.createDate}}</span> </p>
<p v-else><span class="status0">{{
$dict.getLabel(`partyHistoryType${optionStyle}`, item.type)
}}</span>{{ item.title }}</p>
<span class="time">{{ item.organizationName }} {{ item.createDate }}</span>
</div> </div>
<div class="img" v-if="item.thumbUrl && item.thumbUrl.length"> <div class="img" v-if="item.thumbUrl && item.thumbUrl.length">
<img :src="item.thumbUrl[0].url" alt=""> <img :src="item.thumbUrl[0].url" alt="">
</div> </div>
</div> </div>
</div> </div>
<AiEmpty v-if="meetList.length == 0" /> <AiEmpty v-if="meetList.length == 0"/>
</div> </div>
</div> </div>
</template> </template>
@@ -87,10 +91,13 @@ export default {
}, },
onLoad(options) { onLoad(options) {
console.log(options) console.log(options)
if(options.type == 'knowledge'){ if (options.type == 'knowledge') {
this.array = [{dictName: "全部类型", dictValue: "0|1"}, {dictName: "党史知识 ", dictValue: 0}, {dictName: "党史图书馆", dictValue: 1}] this.array = [{dictName: "全部类型", dictValue: "0|1"}, {dictName: "党史知识 ", dictValue: 0}, {
dictName: "党史图书馆",
dictValue: 1
}]
} }
if(options.type == 'style'){ if (options.type == 'style') {
this.style = '' this.style = ''
this.optionStyle = options.style this.optionStyle = options.style
this.$dict.load("partyHistoryType0", "partyHistoryType1").then(() => { this.$dict.load("partyHistoryType0", "partyHistoryType1").then(() => {
@@ -106,9 +113,9 @@ export default {
bindPickerChange(e) { bindPickerChange(e) {
console.log(e) console.log(e)
this.style = this.array[e.detail.value].dictValue this.style = this.array[e.detail.value].dictValue
if(this.style === ''){ if (this.style === '') {
this.styleText = '类型' this.styleText = '类型'
}else { } else {
this.styleText = this.array[e.detail.value].dictName this.styleText = this.array[e.detail.value].dictName
} }
@@ -117,7 +124,7 @@ export default {
this.pageSize = 10; this.pageSize = 10;
this.getList(); this.getList();
}, },
bindDateChange (e) { bindDateChange(e) {
this.day = e.target.value; this.day = e.target.value;
this.createDate = e.target.value; this.createDate = e.target.value;
this.pageNum = 1; this.pageNum = 1;
@@ -152,7 +159,7 @@ export default {
if (this.pageNum > this.pages) return; if (this.pageNum > this.pages) return;
var createDate = '' var createDate = ''
if(this.createDate) { if (this.createDate) {
createDate = this.createDate + '-01 00:00:00' createDate = this.createDate + '-01 00:00:00'
} }
this.$http.post(`/app/apppartyhistory/listWechat`, { this.$http.post(`/app/apppartyhistory/listWechat`, {
@@ -165,14 +172,14 @@ export default {
}).then((res) => { }).then((res) => {
if (res.code == 0) { if (res.code == 0) {
res.data.records.map((item) => { res.data.records.map((item) => {
if(item.thumbUrl) { if (item.thumbUrl) {
item.thumbUrl = JSON.parse(item.thumbUrl) item.thumbUrl = JSON.parse(item.thumbUrl)
} }
if(item.createDate) { if (item.createDate) {
item.createDate = item.createDate.substring(0, 10) item.createDate = item.createDate.substring(0, 10)
} }
}) })
const meetList = this.pageNum > 1 ? [...this.meetList, ...res.data.records]: res.data.records const meetList = this.pageNum > 1 ? [...this.meetList, ...res.data.records] : res.data.records
this.pages = Math.ceil(res.data.total / 10) this.pages = Math.ceil(res.data.total / 10)
this.meetList = meetList this.meetList = meetList
// this.meetList.map((item) => { // this.meetList.map((item) => {
@@ -195,57 +202,66 @@ export default {
</script> </script>
<style lang="scss" scope> <style lang="scss" scope>
@import "../../../common/common.css"; @import "../../../common/common.css";
.page { .page {
.search-box { .search-box {
width: 100%; width: 100%;
height: 112rpx; height: 112px;
background-color: #e60012; background-color: #e60012;
padding: 24rpx 32rpx; padding: 24px 32px;
box-sizing: border-box; box-sizing: border-box;
} }
.slect { .slect {
width: 100%; width: 100%;
height: 96rpx; height: 96px;
background-color: #fff; background-color: #fff;
color: #666; color: #666;
.type-slect { .type-slect {
width: 50%; width: 50%;
border-right: 1rpx solid #f7f7f7; border-right: 1px solid #f7f7f7;
margin: 30rpx 0; margin: 30px 0;
box-sizing: border-box; box-sizing: border-box;
text-align: center; text-align: center;
font-size: 26rpx; font-size: 26px;
.uni-input { .uni-input {
display: inline-block; display: inline-block;
} }
image { image {
width: 32rpx; width: 32px;
height: 32rpx; height: 32px;
display: inline-block; display: inline-block;
position: relative; position: relative;
top: 6rpx; top: 6px;
margin-left: 8srpx; margin-left: 8 spx;
} }
} }
.type-slect:nth-child(2) { .type-slect:nth-child(2) {
border: none; border: none;
} }
} }
.session-list { .session-list {
padding-top: 112rpx; padding-top: 112px;
.session-item { .session-item {
width: 686rpx; width: 686px;
padding: 32px; padding: 32px;
box-sizing: border-box; box-sizing: border-box;
margin: 0 auto 32rpx auto; margin: 0 auto 32px auto;
background-color: #fff; background-color: #fff;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
border-radius: 8px; border-radius: 8px;
.info{
p{ .info {
p {
height: 88px; height: 88px;
font-size: 32px; font-size: 32px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
@@ -259,7 +275,8 @@ export default {
line-clamp: 2; line-clamp: 2;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
margin-bottom: 24px; margin-bottom: 24px;
span{
span {
display: inline-block; display: inline-block;
padding: 0 8px; padding: 0 8px;
font-size: 26px; font-size: 26px;
@@ -268,15 +285,18 @@ export default {
margin-right: 16px; margin-right: 16px;
border-radius: 8px; border-radius: 8px;
} }
.status0{
.status0 {
color: #2266FF; color: #2266FF;
background-color: #E8EFFF; background-color: #E8EFFF;
} }
.status1{
.status1 {
color: #FF8822; color: #FF8822;
background-color: #FFF3E9; background-color: #FFF3E9;
} }
} }
.time { .time {
font-size: 28px; font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
@@ -285,18 +305,21 @@ export default {
line-height: 22px; line-height: 22px;
} }
} }
.img{
.img {
padding-left: 24px; padding-left: 24px;
img{
img {
width: 192px; width: 192px;
height: 144px; height: 144px;
} }
} }
} }
} }
.no-affairs { .no-affairs {
width: 100%; width: 100%;
height: calc(100% - 210rpx); height: calc(100% - 210px);
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;

View File

@@ -33,7 +33,7 @@ export default {
pages: 2 pages: 2
}; };
}, },
onLoad(options) { onLoad() {
this.getTodayList(); this.getTodayList();
}, },
onShow() { onShow() {