From fa433eb612159f92aa09a66860ddce6385a8ba7a Mon Sep 17 00:00:00 2001
From: zhusiyu <410827992@qq.com>
Date: Tue, 14 Jun 2022 17:41:19 +0800
Subject: [PATCH] =?UTF-8?q?=E5=85=9A=E5=BB=BA=E5=BC=95=E9=A2=86=E4=B8=AD?=
 =?UTF-8?q?=E5=BF=83=E9=9D=99=E6=80=81=E9=A1=B5=E9=9D=A2=EF=BC=88=E6=97=A0?=
 =?UTF-8?q?=E8=BD=AE=E6=92=AD=E5=9B=BE=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../pages/partyCenter/brandCreation.vue       | 168 +++++++++++++++++-
 .../pages/partyCenter/studyPower.vue          |  86 ++++++++-
 .../pages/partyCenter/teamBuildingStyle.vue   |  79 +++++++-
 .../pages/partyCenter/teamHelp.vue            | 120 ++++++++++++-
 4 files changed, 435 insertions(+), 18 deletions(-)

diff --git a/src/views/screenAdaptation/pages/partyCenter/brandCreation.vue b/src/views/screenAdaptation/pages/partyCenter/brandCreation.vue
index 8ed9dd4..2ed85bf 100644
--- a/src/views/screenAdaptation/pages/partyCenter/brandCreation.vue
+++ b/src/views/screenAdaptation/pages/partyCenter/brandCreation.vue
@@ -1,23 +1,181 @@
 <template>
-    <CommonBox title="品牌创建" class="party-center-brand-creation-style"></CommonBox>
+    <CommonBox title="品牌创建" class="party-center-brand-creation-style">
+        <div class="brandCreat">
+            <a-row type="flex" justify="space-between" style="margin-bottom: 13px;">
+                <a-col style="width: 48.8%;">
+                    <img src="./images/topBigPic1.png" class="rowImg">
+                </a-col>
+                <a-col style="width: 48.8%;">
+                    <img src="./images/topBigPic2.png" class="rowImg">
+                </a-col>
+            </a-row>
+            <a-row type="flex" justify="space-between" style="margin-bottom: 30px;">
+                <a-col style="width: 23.1%">
+                    <img src="./images/topSmallPic1.png" class="rowImg">
+                </a-col>
+                <a-col style="width: 23.1%">
+                    <img src="./images/topSmallPic2.png" class="rowImg">
+                </a-col>
+                <a-col style="width: 23.1%">
+                    <img src="./images/topSmallPic3.png" class="rowImg">
+                </a-col>
+                <a-col style="width: 23.1%">
+                    <img src="./images/topSmallPic4.png" class="rowImg">
+                </a-col>
+            </a-row>
+            <div class="brandList">
+                <vue-scroll :ops="listScroll" :style="showPage?'height:35rem':'height:35rem'"  class="score-list-div">
+                    <a-list item-layout="horizontal" :data-source="brandList">
+                        <a-list-item slot="renderItem" slot-scope="item" class="listItem">
+                            <a-avatar :src="item.avatar"/>
+                            <p class="p1">
+                                <span style="width: 7px;height: 7px;border-radius: 50%;background: #fff;margin-left: -5px;display: inline-block;"></span>
+                                {{item.title}}</p>
+                            <br>
+                            <p class="p2">{{item.time}}</p>
+                        </a-list-item>
+                    </a-list>
+                </vue-scroll>
+            </div>
+        </div>
+    </CommonBox>
 </template>
 <script>
     /*
-    * 品牌创建
-    * */
+     * 品牌创建
+     * */
+    import {List, Icon, Avatar, Row, Col} from 'ant-design-vue';
     import CommonBox from '../secondPages/commonBox.vue';
     export default{
         data(){
-            return {}
+            return {
+                listScroll: this.StaticParams.scrollOption,
+                showPage: true,
+                brandList: [
+                    {
+                        avatar: require("./images/listPic1.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic2.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic3.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic4.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic5.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic6.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic6.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic6.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic6.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic6.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic6.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    }, {
+                        avatar: require("./images/listPic6.png"),
+                        title: '【红心向党·凝聚动力】洋浦学校党支部深入学习“十严禁”换届纪律会议',
+                        time: '2021-09-17 14:41'
+                    },
+                ]
+            }
         },
         components: {
             CommonBox,
+            ARow: Row,
+            ACol: Col,
+            AList: List,
+            AListItem: List.Item,
+            AAvatar: Avatar,
+            AIcon: Icon,
         }
     }
 </script>
-<style scoped lang="scss">
+<style scoped lang="scss" type="text/scss">
     .party-center-brand-creation-style {
         width: 100%;
         height: 880px !important;
+        .brandCreat {
+            width: 100%;
+            height: 100%;
+            img {
+                cursor: pointer;
+            }
+            .rowImg {
+                width: 100%;
+            }
+            .brandList {
+                width: 100%;
+                height: 600px;
+                .score-list-div {
+                    width: 100%;
+                    height: 23rem;
+                    display: flex;
+                    flex-direction: column;
+                    margin-top: 15px;
+                    overflow: hidden;
+                }
+
+                .ant-list-items {
+                    cursor: pointer;
+                }
+                .listItem {
+                    width: 100%;
+                    height: 80px;
+                    border-radius: 8px;
+                    background: rgba(255, 255, 255, 0.5);
+                    margin-bottom: 15px;
+                    position: relative;
+                    cursor: pointer;
+                    .ant-avatar {
+                        border-radius: 0 !important;
+                        height: 80px;
+                        width: 21%;
+                        position: absolute;
+                        top: 0;
+                        left: 0;
+                    }
+                    .p1 {
+                        position: absolute;
+                        top: 10px;
+                        left: 25%;
+                        color: #fff;
+                        font-size: 14px;
+                    }
+                    .p2 {
+                        position: absolute;
+                        right: 10px;
+                        bottom: -8px;
+                        color: #FFFF80;
+                    }
+                }
+            }
+
+        }
+
     }
 </style>
\ No newline at end of file
diff --git a/src/views/screenAdaptation/pages/partyCenter/studyPower.vue b/src/views/screenAdaptation/pages/partyCenter/studyPower.vue
index 8c66b77..10bd008 100644
--- a/src/views/screenAdaptation/pages/partyCenter/studyPower.vue
+++ b/src/views/screenAdaptation/pages/partyCenter/studyPower.vue
@@ -1,23 +1,99 @@
 <template>
-    <CommonBox title="学习强国" class="party-center-study-power-style"></CommonBox>
+    <CommonBox title="学习强国" class="party-center-study-power-style">
+        <div class="studyStrong">
+            <a-row type="flex" justify="space-between" class="row" wrap>
+                <a-col class="aCol" v-for="(item,i) in colList" :key="i">
+                    <img :src="item.src" alt="">
+                    <span class="colSpan"></span>
+                    <p>{{item.title}}</p>
+                </a-col>
+            </a-row>
+        </div>
+    </CommonBox>
 </template>
 <script>
     /*
-    * 品牌创建
-    * */
+     * 品牌创建
+     * */
     import CommonBox from '../secondPages/commonBox.vue';
+    import {Row, Col} from 'ant-design-vue';
     export default{
         data(){
-            return {}
+            return {
+                colList: [
+                    {title: '学习新思想', src: './images/icon1.png'},
+                    {title: '十九大时间', src: './images/icon2.png'},
+                    {title: '学习理论', src: './images/icon3.png'},
+                    {title: '红色中国', src: './images/icon4.png'},
+                    {title: '学习科学', src: './images/icon5.png'},
+                    {title: '环球视野', src: './images/icon6.png'},
+                    {title: '习近平交汇', src: './images/icon7.png'},
+                    {title: '学习电视台', src: './images/icon8.png'},
+                    {title: '学习电台', src: './images/icon9.png'},
+                    {title: '学习慕课', src: './images/icon10.png'},
+                    {title: '学习文化', src: './images/icon11.png'},
+                    {title: '强军兴军', src: './images/icon12.png'},
+                ]
+            }
         },
         components: {
             CommonBox,
+            ARow: Row,
+            ACol: Col,
         }
     }
 </script>
-<style scoped lang="scss">
+<style scoped lang="scss" type="text/scss">
     .party-center-study-power-style {
         width: 100%;
         height: 440px !important;
+        .studyStrong {
+            width: 94%;
+            height: 100%;
+            margin: 0 auto;
+            .row {
+                display: flex;
+                flex-wrap: wrap;
+                align-content: space-around;
+            }
+            .aCol {
+                display: inline-block;
+                background: rgba(255, 255, 255, .5);
+                width: 14%;
+                position: relative;
+                border-radius: 8px;
+                color: #fff;
+                font-size: 18px;
+                height: 170px;
+                text-align: center !important;
+                margin: 25px 8px 1px 8px;
+                cursor: pointer;
+                img{
+                    position: absolute;
+                    width: 46px;
+                    height: 46px;
+                    left: 50%;
+                    top: 40px;
+                    margin-left: -23px;
+                    z-index: 5;
+                }
+                .colSpan {
+                    display: inline-block;
+                    position: absolute;
+                    width: 96px;
+                    height: 96px;
+                    border-radius: 50%;
+                    box-shadow: 10px 8px 10px rgba(0, 0, 0, 0.7);
+                    top: 15px;
+                    left: 50%;
+                    margin-left: -48px;
+                    background-color: #9B0D02;
+                }
+                p {
+                    position: absolute;
+                    bottom: -4px !important;
+                }
+            }
+        }
     }
 </style>
\ No newline at end of file
diff --git a/src/views/screenAdaptation/pages/partyCenter/teamBuildingStyle.vue b/src/views/screenAdaptation/pages/partyCenter/teamBuildingStyle.vue
index d1350da..051fa28 100644
--- a/src/views/screenAdaptation/pages/partyCenter/teamBuildingStyle.vue
+++ b/src/views/screenAdaptation/pages/partyCenter/teamBuildingStyle.vue
@@ -1,23 +1,96 @@
 <template>
-    <CommonBox title="队建风采" class="party-center-team-building-style"></CommonBox>
+    <CommonBox title="队建风采" class="party-center-team-building-style">
+        <div class="teamBuild">
+            <div class="topPic"></div>
+            <div class="botText">
+                <vue-scroll :ops="listScroll" :style="showPage?'height:14rem':'height:14rem'"
+                            class="score-list-div">
+                    <a-list item-layout="horizontal" :data-source="teamBuildList">
+                        <a-list-item slot="renderItem" slot-scope="item" class="teamListLi">
+                            <p class="contentText">
+                                <span style="width: 7px;height: 7px;margin-right:5px;border-radius: 50%;background: #fff;margin-left: -5px;display: inline-block;"></span>
+                                {{item.content}}</p>
+                        </a-list-item>
+                    </a-list>
+                </vue-scroll>
+            </div>
+        </div>
+    </CommonBox>
 </template>
 <script>
     /*
     * 品牌创建
     * */
     import CommonBox from '../secondPages/commonBox.vue';
+    import {List, Icon, Avatar, Row, Col} from 'ant-design-vue';
     export default{
         data(){
-            return {}
+            return {
+                //滚动条
+                showPage: true,
+                listScroll: this.StaticParams.scrollOption,
+                teamBuildList: [
+                    {
+                        content: '【红心向党·凝聚动力】“青春向党·奋斗强国” ——洋浦学校2021（下）入团仪式暨“青年之家”揭牌仪式纪实'
+                    }, {
+                        content: '【和谐经开·智慧洋浦】凝聚青春力量  筑牢青春底色 --洋浦学校团支部成立大会纪实'
+                    }, {
+                        content: '【和谐经开·智慧洋浦】 “童年再见·青春你好” ——洋浦学校团委、少工委庆祝建党百年系列活动（五）暨2019级离队仪式'
+                    }, {
+                        content: '【和谐经开·智慧洋浦】凝聚青春力量  筑牢青春底色 --洋浦学校团支部成立大会纪实'
+                    }, {
+                        content: '【红心向党·凝聚动力】“青春向党·奋斗强国” ——洋浦学校2021（下）入团仪式暨“青年之家”揭牌仪式纪实'
+                    }, {
+                        content: '【和谐经开·智慧洋浦】凝聚青春力量  筑牢青春底色 --洋浦学校团支部成立大会纪实'
+                    },
+                ]
+            }
         },
         components: {
             CommonBox,
+            ARow: Row,
+            ACol: Col,
+            AList: List,
+            AListItem: List.Item,
+            AAvatar: Avatar,
         }
     }
 </script>
-<style scoped lang="scss">
+<style scoped lang="scss" type="text/scss">
     .party-center-team-building-style {
         width: 605px !important;
         height: 400px !important;
+        .teamBuild{
+            width: 100%;
+            height: 100%;
+            /*图片*/
+            .topPic{
+                height: 30%;
+                border: 3px solid #e9f2fd;
+            }
+            /*文字*/
+            .botText{
+                height:60%;
+                .ant-list-split .ant-list-item {
+                    border-bottom: none;
+                    padding: 0;
+                    margin-left: 5px !important;
+                    color: #fff;
+                    cursor: pointer;
+                    >>>p {
+                        font-size: 16px;
+                        margin-bottom: 18px !important;
+                    }
+                }
+                .score-list-div {
+                    width: 100%;
+                    height: 23rem;
+                    display: flex;
+                    flex-direction: column;
+                    margin-top: 15px;
+                    overflow: hidden;
+                }
+            }
+        }
     }
 </style>
\ No newline at end of file
diff --git a/src/views/screenAdaptation/pages/partyCenter/teamHelp.vue b/src/views/screenAdaptation/pages/partyCenter/teamHelp.vue
index ce0d70e..27ab170 100644
--- a/src/views/screenAdaptation/pages/partyCenter/teamHelp.vue
+++ b/src/views/screenAdaptation/pages/partyCenter/teamHelp.vue
@@ -1,23 +1,133 @@
 <template>
-    <CommonBox title="团队推助" class="party-center-team-help-style"></CommonBox>
+    <CommonBox title="团队推助" class="party-center-team-help-style">
+        <div class="teamBoost">
+            <div class="leftList">
+                <vue-scroll :ops="listScroll" :style="showPage?'height:21rem':'height:22rem'"
+                            class="score-list-div">
+                    <a-list item-layout="horizontal" :data-source="teamList">
+                        <a-list-item slot="renderItem" slot-scope="item" class="teamListLi">
+                            <p class="contentText">
+                                <span style="width: 7px;height: 7px;margin-right:5px;border-radius: 50%;background: #fff;margin-left: -5px;display: inline-block;"></span>
+                                {{item.content}}</p>
+                        </a-list-item>
+                    </a-list>
+                </vue-scroll>
+            </div>
+            <div class="rightAnimate">
+                <div class="swiper-container" id="mySwiper">
+                    <div class="swiper-wrapper">
+                        <div class="swiper-slide" v-for="(item,i) in banner" :key="i">
+                            <img :src="item.src" alt="">
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </CommonBox>
 </template>
 <script>
     /*
-    * 品牌创建
-    * */
+     * 品牌创建
+     * */
+    import {List, Icon, Avatar, Row, Col} from 'ant-design-vue';
     import CommonBox from '../secondPages/commonBox.vue';
     export default{
         data(){
-            return {}
+            return {
+                //轮播图配置项
+                swiperOption: {
+                    //autoplay: true,
+                    speed: 300,
+                    loop: true,
+                    pagination: {
+                        el: ".swiper-pagination",
+                        clickable: true
+                    }
+                },
+                //轮播图图片
+                banner: [
+                    {src: './images/listPic1.png'},
+                    {src: './images/listPic2.png'},
+                    {src: './images/listPic3.png'},
+                ],
+                showPage: true,
+                listScroll: this.StaticParams.scrollOption,
+                teamList: [
+                    {
+                        content: '【红心向党·凝聚动力】“青春向党·奋斗强国” ——洋浦学校2021（下）入团仪式暨“青年之家”揭牌仪式纪实'
+                    }, {
+                        content: '【和谐经开·智慧洋浦】凝聚青春力量  筑牢青春底色 --洋浦学校团支部成立大会纪实'
+                    }, {
+                        content: '【和谐经开·智慧洋浦】 “童年再见·青春你好” ——洋浦学校团委、少工委庆祝建党百年系列活动（五）暨2019级离队仪式'
+                    }, {
+                        content: '【和谐经开·智慧洋浦】凝聚青春力量  筑牢青春底色 --洋浦学校团支部成立大会纪实'
+                    }, {
+                        content: '【红心向党·凝聚动力】“青春向党·奋斗强国” ——洋浦学校2021（下）入团仪式暨“青年之家”揭牌仪式纪实'
+                    }, {
+                        content: '【和谐经开·智慧洋浦】凝聚青春力量  筑牢青春底色 --洋浦学校团支部成立大会纪实'
+                    },
+                ]
+            }
+        },
+        watch: {
+            banner(xin, old){
+                this.$nextTick(() => {
+                    let mySwiper = new Swiper('.swiper-container', {
+                        loop: true,
+                    })
+                })
+                immediate:true
+            }
         },
         components: {
             CommonBox,
+            ARow: Row,
+            ACol: Col,
+            AList: List,
+            AListItem: List.Item,
+            AAvatar: Avatar,
         }
     }
 </script>
-<style scoped lang="scss">
+<style scoped lang="scss" type="text/scss">
     .party-center-team-help-style {
         width: 605px !important;
         height: 400px !important;
+
+        .teamBoost {
+            width: 100%;
+            height: 100%;
+            .leftList {
+                width: 66%;
+                .ant-list-split .ant-list-item {
+                    border-bottom: none;
+                    padding: 0;
+                    margin-left: 5px !important;
+                    margin-bottom: 5px;
+                    color: #fff;
+                    cursor: pointer;
+                    p {
+                        font-size: 16px;
+                    }
+                }
+                .score-list-div {
+                    width: 100%;
+                    height: 23rem;
+                    display: flex;
+                    flex-direction: column;
+                    margin-top: 15px;
+                    overflow: hidden;
+                }
+            }
+            .rightAnimate {
+                width: 30%;
+                margin: 0 auto;
+                border: 1px solid darkmagenta;
+                .banner {
+                    width: 100%;
+                }
+            }
+        }
+
     }
 </style>
\ No newline at end of file