洋浦学校八大中心 德育管理前端

src/views/screenAdaptation/common/imgPreview.vue

@@ -1,6 +1,7 @@
 <template>
     <div class="img-preview-box-style">
-        <img :src="getImgURL()" style="width: 100%;height: 100%" @click="previewData">
+        <!--:style="{fontSize: '16px', color: '#31a8fa',marginLeft:'0.5rem'}"-->
+        <img :src="getImgURL()" :style="{width: '100%',height: '100%',borderRadius:isBorderRadius?'5px':''}" @click="previewData">
         <preview-box ref="previewBox"/>
     </div>
 </template>
@@ -16,6 +17,10 @@
                 type: Object,
                 default: () => {
                 }
+            },
+            isBorderRadius:{
+                type:Boolean,
+                default:true
             }
         },
         data(){
@@ -34,6 +39,7 @@
                     return this.BaseConfig.url_path_down + this.img.key;
                 } else {
                     //暂无图片
+                    return require("../assets/images/noImg.png");
                 }
             },
             previewData: function () {

src/views/screenAdaptation/pages/partyCenter/brandCreation.vue

@@ -59,12 +59,8 @@
      * */
     import {List, Icon, Avatar, Row, Col, Modal,Spin} from 'ant-design-vue';
     import CommonBox from '../secondPages/commonBox.vue';
-    import axios from 'axios';
-    const querystring = require('querystring');
     import Upload from '../../../../components/common/uploader/Upload.vue';
     import ImgPreview from '../../common/imgPreview.vue';
-    import PreviewBox from '../../../../components/common/preview/PreviewBox';
-    import PreviewManager from '../../../../components/common/preview/previewManager';
     export default{
         data(){
             return {
@@ -133,7 +129,6 @@
         },
         methods: {
             getDataexReport: function () {
-                let url = "http://10.10.14.186:9009/dataex/report/QuerySimpleGP";
                 let param = {
                     "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
                     "query": {
@@ -179,8 +174,6 @@
                             }
                             this.dataList.push(info);
                         }
-                        console.log("imgList:",this.imgList);
-                        console.log("dataList:",this.dataList);
                     }
                 })
             },
@@ -189,10 +182,6 @@
                     return this.BaseConfig.url_path_down + img.key;
                 }
             },
-            previewData: function (item) {
-                console.log("item",item)
-                PreviewManager.analysisPreview(item,this.$refs.previewBox)
-            },
         },
         components: {
             CommonBox,
@@ -205,7 +194,6 @@
             AModal: Modal,
             ASpin:Spin,
             Upload,
-            PreviewBox,
             ImgPreview
         },
     }

src/views/screenAdaptation/pages/partyCenter/teamBuildingStyle.vue

@@ -2,18 +2,25 @@
     <CommonBox title="队建风采" class="party-center-team-building-style">
         <div class="teamBuild">
             <div class="topPic">
-                <div class="swiperBox">
+                <!--<div class="swiperBox">-->
-                    <img class="swiperImg" v-for="(item,i) in imgArr" :src="item.src" :key="i" alt="">
+                    <!--<img class="swiperImg" v-for="(item,i) in imgArr" :src="item.src" :key="i" alt="">-->
+                <!--</div>-->
+                <div class="swiperBox" v-if="imgList.length > 3">
+                    <!--<img class="swiperImg" v-for="(item,i) in imgArr" :src="item.src" :key="i">-->
+                    <img-preview class="swiperImg" v-for="(item,i) in imgList" :key="'team-building-'+i" :imgObj="item" />
+                </div>
+                <div class="img-no-swiper-box" v-else>
+                    <img-preview class="swiperImg" v-for="(item,i) in imgList" :key="'team-building-'+i" :imgObj="item" />
                 </div>
             </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-layout="horizontal" :data-source="dataList">
                         <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>
+                                {{item.info_title}}</p>
                         </a-list-item>
                     </a-list>
                 </vue-scroll>
@@ -27,9 +34,12 @@
      * */
     import CommonBox from '../secondPages/commonBox.vue';
     import {List, Icon, Avatar, Row, Col} from 'ant-design-vue';
+    import ImgPreview from '../../common/imgPreview.vue';
     export default{
         data(){
             return {
+                dataList:[],
+                imgList:[],
                 //轮播图图片
                 imgArr: [
                     {src: require("./images/listPic1.png")},
@@ -59,6 +69,9 @@
                 ]
             }
         },
+        mounted(){
+            this.getDataexReport();
+        },
         components: {
             CommonBox,
             ARow: Row,
@@ -66,8 +79,48 @@
             AList: List,
             AListItem: List.Item,
             AAvatar: Avatar,
+            ImgPreview
         },
-        methods: {}
+        methods: {
+            getDataexReport: function () {
+                let param = {
+                    "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
+                    "query": {
+                        "query_id": "query_dangjian_duijian",
+                        "query_param": [
+                            this.BaseConfig.person_info_my.bureau_id + ""
+                        ]
+                    },
+                    "query_cache": 0,
+                    "query_count": [],
+                    "query_format": "json",
+                    "query_group": []
+                }
+                this.spinning = true;
+                this.DataexReportInterface.callInterface([{
+                    params: param,
+                    method: "post",
+                }], (result) => {
+                    this.spinning = false;
+                    if (result[0].data.success) {
+                        this.dataList = [];
+                        this.imgList = [];
+                        let dataList = JSON.parse(result[0].data.result);
+                        console.log("队建数据：",dataList);
+                        this.dataList.push(...dataList);
+                        for (let i = 0, len = dataList.length; i < len; i++) {
+                            let item = dataList[i];
+                            let coverJson = JSON.parse(item.cover_json);
+                            if (coverJson && coverJson.length > 0) {
+                                for (let j = 0, jLen = coverJson.length; j < jLen; j++) {
+                                    this.imgList.push(coverJson[j])
+                                }
+                            }
+                        }
+                    }
+                })
+            },
+        }
     }
 </script>
 <style scoped lang="scss" type="text/scss">
@@ -96,11 +149,21 @@
                     width: 100%;
                     height: 100%;
                     animation: mySwiper 6s ease infinite;
+                    .swiperImg {
+                        height: 100%;
+                        width: 30%;
+                        margin-right: 38px;
+                    }
                 }
-                .swiperImg {
+                .img-no-swiper-box {
+                    display: inherit;
+                    width: 100%;
                     height: 100%;
-                    width: 30%;
+                    .swiperImg {
-                    margin-right: 38px;
+                        height: 100%;
+                        width: 30%;
+                        margin-right: 38px;
+                    }
                 }
             }
             /*文字*/

src/views/screenAdaptation/pages/partyCenter/teamHelp.vue

@@ -4,18 +4,22 @@
             <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-layout="horizontal" :data-source="dataList">
                         <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>
+                                {{item.info_title}}</p>
                         </a-list-item>
                     </a-list>
                 </vue-scroll>
             </div>
             <div class="rightAnimate">
-                <div class="swiperBox">
+                <div class="swiperBox" v-if="imgList.length > 3">
-                    <img class="swiperImg" v-for="(item,i) in imgArr" :src="item.src" :key="i">
+                    <!--<img class="swiperImg" v-for="(item,i) in imgArr" :src="item.src" :key="i">-->
+                    <img-preview class="swiperImg" v-for="(item,i) in imgList" :key="'team-help-'+i" :imgObj="item" />
+                </div>
+                <div class="img-no-swiper-box" v-else>
+                    <img-preview class="swiperImg" v-for="(item,i) in imgList" :key="'team-help-'+i" :imgObj="item" />
                 </div>
             </div>
         </div>
@@ -27,6 +31,7 @@
      * */
     import {Carousel, List, Icon, Avatar, Row, Col} from 'ant-design-vue';
     import CommonBox from '../secondPages/commonBox.vue';
+    import ImgPreview from '../../common/imgPreview.vue';
     export default{
         data(){
             return {
@@ -56,10 +61,15 @@
                     }, {
                         content: '【和谐经开·智慧洋浦】凝聚青春力量  筑牢青春底色 --洋浦学校团支部成立大会纪实'
                     },
-                ]
+                ],
+                dataList:[],
+                imgList:[],
             }
         },
         watch: {},
+        mounted(){
+            this.getDataexReport();
+        },
         components: {
             CommonBox,
             ACarousel: Carousel,
@@ -68,10 +78,46 @@
             AList: List,
             AListItem: List.Item,
             AAvatar: Avatar,
+            ImgPreview
         },
         methods: {
-            imgChange: function (index) {
+            getDataexReport: function () {
-                this.currentIndex = index;
+                let param = {
+                    "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
+                    "query": {
+                        "query_id": "query_dangjian_tuandui",
+                        "query_param": [
+                            this.BaseConfig.person_info_my.bureau_id + ""
+                        ]
+                    },
+                    "query_cache": 0,
+                    "query_count": [],
+                    "query_format": "json",
+                    "query_group": []
+                }
+                this.spinning = true;
+                this.DataexReportInterface.callInterface([{
+                    params: param,
+                    method: "post",
+                }], (result) => {
+                    this.spinning = false;
+                    if (result[0].data.success) {
+                        this.dataList = [];
+                        this.imgList = [];
+                        let dataList = JSON.parse(result[0].data.result);
+                        console.log(dataList);
+                        this.dataList.push(...dataList);
+                        for (let i = 0, len = dataList.length; i < len; i++) {
+                            let item = dataList[i];
+                            let coverJson = JSON.parse(item.cover_json);
+                            if (coverJson && coverJson.length > 0) {
+                                for (let j = 0, jLen = coverJson.length; j < jLen; j++) {
+                                    this.imgList.push(coverJson[j])
+                                }
+                            }
+                        }
+                    }
+                })
             },
         }
     }
@@ -80,15 +126,14 @@
     .party-center-team-help-style {
         width: 605px !important;
         height: 400px !important;
-
         .teamBoost {
             width: 100%;
             height: 100%;
             display: flex;
             justify-content: space-between;
             .leftList {
-                margin-right: 23px;
+                /*margin-right: 23px;*/
-                width: 66%;
+                width: calc(70% - 5px);
                 .ant-list-split .ant-list-item {
                     border-bottom: none;
                     padding: 0;
@@ -110,7 +155,7 @@
                 }
             }
             .rightAnimate {
-                width: 30%;
+                width: calc(30% - 5px);
                 margin: 0 auto;
                 overflow: hidden;
                 @keyframes mySwiper {
@@ -132,7 +177,16 @@
                         margin-bottom: 15px;
                     }
                 }
-
+                .img-no-swiper-box {
+                    display: inherit;
+                    width: 100%;
+                    height: 100%;
+                    .swiperImg {
+                        height: 30%;
+                        width: 100%;
+                        margin-bottom: 15px;
+                    }
+                }
             }
         }