From 5bc7fd546b5dcf8e3638ebee2c3ae00e1a52bc21 Mon Sep 17 00:00:00 2001
From: TS-QD1 <tskj_pc1@163.com>
Date: Thu, 9 Mar 2023 18:31:23 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E4=BB=A3=E7=A0=81=E7=BB=93?=
 =?UTF-8?q?=E6=9E=84=E5=92=8C=E5=A2=9E=E5=8A=A0=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/common/components/Footer.vue              |  64 ++++-----
 src/common/components/common.js               |   4 +-
 src/component/Loading.vue                     |  23 ++++
 src/component/Nav.vue                         |  58 +++++++++
 src/pages/Index/Index.vue                     |  27 ++--
 .../{NewsView1 => NewsView}/NewsView1.vue     |  62 +++++----
 .../{NewsView2 => NewsView}/NewsView2.vue     |   0
 .../{NewsView3 => NewsView}/NewsView3.vue     |   0
 .../NewsView3Sub.vue                          |   0
 .../NewsViewDetail/NewsViewDetailText.vue     | 121 ++++++++++++++++++
 src/router/index.js                           |  19 ++-
 11 files changed, 303 insertions(+), 75 deletions(-)
 create mode 100644 src/component/Loading.vue
 create mode 100644 src/component/Nav.vue
 rename src/pages/{NewsView1 => NewsView}/NewsView1.vue (91%)
 rename src/pages/{NewsView2 => NewsView}/NewsView2.vue (100%)
 rename src/pages/{NewsView3 => NewsView}/NewsView3.vue (100%)
 rename src/pages/{NewsView3Sub => NewsView}/NewsView3Sub.vue (100%)
 create mode 100644 src/pages/NewsViewDetail/NewsViewDetailText.vue

diff --git a/src/common/components/Footer.vue b/src/common/components/Footer.vue
index eddc286..13a5798 100644
--- a/src/common/components/Footer.vue
+++ b/src/common/components/Footer.vue
@@ -1,47 +1,47 @@
 <template>
-    <div class="footer">
-      <div class="footer-top">
-        <div class="footer-left">
-          <img :src="'static/logo/footer-logo-'+ area.areaId +'.png'" alt="" class="footer-logo">
-          <div class="footer-us">
-            <h4>{{area.areaName}}公共文化数字云平台</h4>
-            <!--<p>联系方式：18888888888</p>-->
-            <p>地址：{{area.areaName}}群众艺术馆</p>
-          </div>
-          <div class="footer-link">
-            <h4>友情链接</h4>
-            <a href="https://www.culturedc.cn/" target="_blank" class="link-item">国家公共文化云</a>
-            <a href="http://xzzzqqyg.com/" target="_blank" class="link-item">西藏群众艺术馆</a>
-          </div>
+  <div class="footer">
+    <div class="footer-top">
+      <div class="footer-left">
+        <img :src="'static/logo/footer-logo-' + area.areaId + '.png'" alt="" class="footer-logo">
+        <div class="footer-us">
+          <h4>{{ area.areaName }}公共文化数字云平台</h4>
+          <!--<p>联系方式：18888888888</p>-->
+          <p>地址：{{ area.areaName }}群众艺术馆</p>
         </div>
-        <div class="footer-right">
-          <ul>
-            <li>
-              <h4>{{area.areaName}}公共文化小程序</h4>
-              <img src="@/assets/images/qr-code-xcx.jpg" alt="">
-            </li>
-            <li>
-              <h4>{{area.areaName}}公共文化公众号</h4>
-              <img src="@/assets/images/qr-code-gzh.jpg" alt="">
-            </li>
-            <li>
-              <h4>{{area.areaName}}公共文化APP</h4>
-              <img src="@/assets/images/qr-code-app.jpg" alt="">
-            </li>
-          </ul>
+        <div class="footer-link">
+          <h4>友情链接</h4>
+          <a href="https://www.culturedc.cn/" target="_blank" class="link-item">国家公共文化云</a>
+          <a href="http://xzzzqqyg.com/" target="_blank" class="link-item">西藏群众艺术馆</a>
         </div>
       </div>
-      <div class="footer-bottom">
-        <p>版权所有：{{area.areaName}}群众艺术馆 Copyright©  2020 晋ICP备17001370号-2 技术支持：山西腾狮科技</p>
+      <div class="footer-right">
+        <ul>
+          <li>
+            <h4>{{ area.areaName }}公共文化小程序</h4>
+            <img src="@/assets/images/qr-code-xcx.jpg" alt="">
+          </li>
+          <li>
+            <h4>{{ area.areaName }}公共文化公众号</h4>
+            <img src="@/assets/images/qr-code-gzh.jpg" alt="">
+          </li>
+          <li>
+            <h4>{{ area.areaName }}公共文化APP</h4>
+            <img src="@/assets/images/qr-code-app.jpg" alt="">
+          </li>
+        </ul>
       </div>
     </div>
+    <div class="footer-bottom">
+      <p>版权所有：{{ area.areaName }}群众艺术馆 Copyright© 2020 晋ICP备17001370号-2 技术支持：山西腾狮科技</p>
+    </div>
+  </div>
 </template>
 
 <script>
 import common from './common'
 export default {
   name: 'Footer',
-  data () {
+  data() {
     return {
       area: common.area
     }
diff --git a/src/common/components/common.js b/src/common/components/common.js
index d8d27a4..4d1be86 100644
--- a/src/common/components/common.js
+++ b/src/common/components/common.js
@@ -1,5 +1,5 @@
-// const publishUrl = 'http://v3.xzszwhy.cn/'
-const publishUrl = 'http://192.168.0.120:80/'
+const publishUrl = 'http://v3.xzszwhy.cn/'
+// const publishUrl = 'http://192.168.0.120:80/'
 const url = `${publishUrl}xzszwhy/`
 const liveUrl = `${publishUrl}live/`
 const shopUrl = `${publishUrl}xzshop/`
diff --git a/src/component/Loading.vue b/src/component/Loading.vue
new file mode 100644
index 0000000..b27c5fb
--- /dev/null
+++ b/src/component/Loading.vue
@@ -0,0 +1,23 @@
+<template>
+    <div class="loading">
+        <img src="@/assets/images/loading.gif" alt="">
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'Loading'
+}
+</script>
+
+<style lang="stylus" scoped>
+.loading
+    position fixed
+    top 50%
+    left 50%
+    transform translate(-50%, -50%)
+    background rgba(255, 255, 255, 0.6)
+    padding 30px
+    border-radius 10px
+    box-shadow 0 0 17px #DEDEDE
+</style>
\ No newline at end of file
diff --git a/src/component/Nav.vue b/src/component/Nav.vue
new file mode 100644
index 0000000..1b9aadd
--- /dev/null
+++ b/src/component/Nav.vue
@@ -0,0 +1,58 @@
+<template>
+    <div class="location">
+        <div class="location-content">
+            您的位置：
+            <span class="nav" v-for="(nav, index) in navArray" :key="index">
+                <router-link :to="nav.to" v-if="nav.to">{{ nav.name }}</router-link>
+                <span v-else>{{ nav.name }}</span>
+            </span>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'Nav',
+    props: {
+        navs: {
+            type: Array,
+            require: false,
+            default() {
+                return []
+            }
+        }
+    },
+    data() {
+        return {
+            navArray: [
+                {to: '/', name: '首页'},
+                ...this.navs
+            ]
+        }
+    }
+}
+</script>
+
+<style lang="stylus" scoped>
+.location
+    background #e5e5e5
+    line-height 30px
+
+    .location-content
+        width 1200px
+        margin 0 auto
+        font-size 14px
+        color #565656
+        .nav::after
+            content '>'
+            margin  0 5px
+        .nav:last-child::after
+            content: ' '
+
+@media (min-width: 1200px)
+    .location-content 
+        width 1200px
+@media (max-width: 1200px)
+    .location-content
+        width 768px
+</style>
\ No newline at end of file
diff --git a/src/pages/Index/Index.vue b/src/pages/Index/Index.vue
index 96a7839..b1aa566 100644
--- a/src/pages/Index/Index.vue
+++ b/src/pages/Index/Index.vue
@@ -1,15 +1,18 @@
 <template>
-    <div>
-      <Header></Header>
-      <IndexSwiper :swiperList="swiperList" v-if="swiperList.length > 0"></IndexSwiper>
-      <div v-for="(newsType, index) in newsTypeList" :key="index">
-        <news-view1 :news-directories-parent-id="newsType.newsDirectoriesId" :nav-title="newsType.directoriesName" v-if="newsType.directoriesWebView === 'newsView1'"/>
-        <news-view2 :news-directories-parent-id="newsType.newsDirectoriesId" :nav-title="newsType.directoriesName" v-if="newsType.directoriesWebView === 'newsView2'"/>
-        <news-view3 :news-directories-parent-id="newsType.newsDirectoriesId" :nav-title="newsType.directoriesName" v-if="newsType.directoriesWebView === 'newsView3'"/>
-      </div>
-      <IndexService :activityList="activityList" v-if="activityList.length > 0"></IndexService>
-      <Footer></Footer>
+  <div>
+    <Header></Header>
+    <IndexSwiper :swiperList="swiperList" v-if="swiperList.length > 0"></IndexSwiper>
+    <div v-for="(newsType, index) in newsTypeList" :key="index">
+      <news-view1 :news-directories-parent-id="newsType.newsDirectoriesId" :nav-title="newsType.directoriesName"
+        v-if="newsType.directoriesWebView === 'newsView1'" />
+      <news-view2 :news-directories-parent-id="newsType.newsDirectoriesId" :nav-title="newsType.directoriesName"
+        v-if="newsType.directoriesWebView === 'newsView2'" />
+      <news-view3 :news-directories-parent-id="newsType.newsDirectoriesId" :nav-title="newsType.directoriesName"
+        v-if="newsType.directoriesWebView === 'newsView3'" />
     </div>
+    <IndexService :activityList="activityList" v-if="activityList.length > 0"></IndexService>
+    <Footer></Footer>
+  </div>
 </template>
 
 <script>
@@ -34,7 +37,7 @@ export default {
     NewsView3,
     Footer
   },
-  data () {
+  data() {
     return {
       bannerList: [],
       activityList: [],
@@ -79,7 +82,7 @@ export default {
       })
     }
   },
-  mounted () {
+  mounted() {
     this.getNewsTypeList()
     this.getActivityList()
     this.getSwiper()
diff --git a/src/pages/NewsView1/NewsView1.vue b/src/pages/NewsView/NewsView1.vue
similarity index 91%
rename from src/pages/NewsView1/NewsView1.vue
rename to src/pages/NewsView/NewsView1.vue
index 7d139d4..a6d6dc4 100644
--- a/src/pages/NewsView1/NewsView1.vue
+++ b/src/pages/NewsView/NewsView1.vue
@@ -1,13 +1,7 @@
 <template>
   <div>
     <Header></Header>
-    <div class="location">
-      <div class="location-content">
-        您的位置：
-        <router-link to="/">首页</router-link>
-        > {{ navTitle }}
-      </div>
-    </div>
+    <Nav :navs="navs"/>
     <div class="type">
       <div class="type-container">
         <span>区域：</span>
@@ -28,7 +22,7 @@
       <div class="dynamics-left">
         <div class="dynamics-list" v-if="!isLoading">
           <ul v-if="hasData">
-            <li v-for="(list,idx) in requestList" :key="idx" @click="goDetail(list.newsContentLink, list.templateRecordUrl)" :title="list.newsContentTitle">
+            <li v-for="(list,idx) in requestList" :key="idx" @click="goDetail(list)" :title="list.newsContentTitle">
               <div class="dynamics-list-left">
                 <img :src="url + 'route/file/download/false/' + list.newsContentCoverList" alt="">
               </div>
@@ -81,17 +75,25 @@
 import Header from '@/common/components/Header'
 import Footer from '@/common/components/Footer'
 import common from '@/common/components/common.js'
+import Nav from '../../component/Nav'
 import axios from 'axios'
 
 export default {
   name: 'NewsView1',
   components: {
     Header,
-    Footer
+    Footer,
+    Nav
   },
   data () {
+    let navTitle = this.$route.query.navTitle;
     return {
-      navTitle: this.$route.query.navTitle,
+      navTitle,
+      navs: [
+        {
+          name: navTitle
+        },
+      ],
       newsDirectoriesId: this.$route.query.newsDirectoriesId,
       areaList: [],
       changePage: 1,
@@ -156,11 +158,31 @@ export default {
       this.changePage = page
       this.getNews()
     },
-    goDetail: function (link, url) {
-      if (link) {
-        window.open(link)
-      } else {
-        window.location.href = this.publishUrl + url
+    goDetail: function (item, newsContentId, newsContentType) {
+      // 文章
+      if(item.newsContentType === '1') {
+        this.$router.push(`/newsViewDetailText/${item.newsContentId}?navTitle=${this.navTitle}&navPath=${this.$route.fullPath}`)
+        return;
+      }
+      // 图片
+      if(item.newsContentType === '2') {
+        return;
+      }
+      // 音频
+      if(item.newsContentType === '3') {
+        return;
+      }
+      // 视频
+      if(item.newsContentType === '4') {
+        return;
+      }
+      // PDF
+      if(item.newsContentType === '5') {
+        return;
+      }
+      // 链接
+      if(item.newsContentType === '6') {
+        return;
       }
     },
     getTypeList: function () {
@@ -206,16 +228,6 @@ export default {
 
 <style lang="stylus" rel="stylesheet/stylus" scoped>
 @import "~styles/public.styl"
-.location
-  background #e5e5e5
-  line-height 30px
-
-  .location-content
-    width 1200px
-    margin 0 auto
-    font-size 14px
-    color #565656
-
 .type
   padding 15px 0
   background #f0f0f0
diff --git a/src/pages/NewsView2/NewsView2.vue b/src/pages/NewsView/NewsView2.vue
similarity index 100%
rename from src/pages/NewsView2/NewsView2.vue
rename to src/pages/NewsView/NewsView2.vue
diff --git a/src/pages/NewsView3/NewsView3.vue b/src/pages/NewsView/NewsView3.vue
similarity index 100%
rename from src/pages/NewsView3/NewsView3.vue
rename to src/pages/NewsView/NewsView3.vue
diff --git a/src/pages/NewsView3Sub/NewsView3Sub.vue b/src/pages/NewsView/NewsView3Sub.vue
similarity index 100%
rename from src/pages/NewsView3Sub/NewsView3Sub.vue
rename to src/pages/NewsView/NewsView3Sub.vue
diff --git a/src/pages/NewsViewDetail/NewsViewDetailText.vue b/src/pages/NewsViewDetail/NewsViewDetailText.vue
new file mode 100644
index 0000000..c8ed9a0
--- /dev/null
+++ b/src/pages/NewsViewDetail/NewsViewDetailText.vue
@@ -0,0 +1,121 @@
+<template>
+    <div>
+        <Header />
+        <Nav :navs="navs"/>
+        <div class="container">
+            <div class="title" v-show="title">{{ title }}</div>
+            <div class="sub-title" v-show="author || publishDate">
+                <span class="source">
+                    <span>新闻来源：</span>
+                    <span>{{ author }}</span>
+                </span>
+                <span class="date">
+                    <span>发布时间：</span>
+                    <span>{{ publishDate }}</span>
+                </span>
+            </div>
+            <div class="content" v-html="content"></div>
+        </div>
+        <Footer />
+        <loading v-show="isLoading"/>
+    </div>
+</template>
+
+<script>
+import Header from '@/common/components/Header'
+import Footer from '@/common/components/Footer'
+import common from '@/common/components/common.js'
+import Loading from '../../component/Loading'
+import Nav from '../../component/Nav'
+import axios from 'axios'
+
+export default {
+    name: 'NewsViewDetailText',
+    components: {
+        Header,
+        Footer,
+        Loading,
+        Nav
+    },
+    data() {
+        return {
+            isLoading: false,
+            navs: [
+                {
+                    to: this.$route.query.navPath,
+                    name: this.$route.query.navTitle
+                },
+                {
+                    name: '详情'
+                }
+            ],
+            title: '',
+            author: '',
+            publishDate: '',
+            content: '',
+        }
+    },
+    methods: {
+        init() {
+            let vueSelf = this;
+            vueSelf.isLoading = true;
+            axios.get(`${common.url}app/newscontent/getnewscontentbyidrelease/${this.$route.params.newsContentId}`).then(resp => {
+                let data = resp.data;
+                vueSelf.title = data.newsContentTitle;
+                vueSelf.author = data.newsContentAuthor;
+                vueSelf.publishDate = data.newsContentPublishTime;
+                vueSelf.content = data.newsContentContent;
+            }).catch(resp => {
+                console.error(resp)
+            }).finally(() => {
+                vueSelf.isLoading = false
+            })
+        }
+    },
+    mounted() {
+        this.init();
+    }
+}
+</script>
+
+<style lang="stylus" scoped>
+.container
+    width 1200px
+    margin 0 auto
+    display flex
+    flex-direction column
+    align-items center
+    font-family '宋体'
+    div
+        margin-bottom 10px
+    .title  
+        margin-top 10px
+        font-size 24px
+        font-weight bold
+        text-align center
+        color #000
+    .sub-title
+        width 500px
+        text-align center
+        font-size 16px
+        height 35px
+        line-height 35px
+        display flex
+        justify-content space-between
+        color #a8a8a8
+    .content
+        min-height 600px
+        width 100%
+        font-size 18px
+        color #262626
+        line-height 35px
+        text-indent 36px
+    
+@media (min-width: 1200px)
+    .container 
+        width 1200px
+@media (max-width: 1200px)
+    .container
+        width 768px
+
+</style>
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index 4b85733..ef0de00 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -24,10 +24,11 @@ import CultureMap from '@/pages/CultureMap/CultureMap'
 import CultureSupermarket from '@/pages/CultureSupermarket/CultureSupermarket'
 import GoodsDetail from '@/pages/CultureSupermarket/GoodsDetail'
 import common from '../common/components/common'
-import NewsView1 from '../pages/NewsView1/NewsView1.vue'
-import NewsView2 from '../pages/NewsView2/NewsView2.vue'
-import NewsView3 from '../pages/NewsView3/NewsView3.vue'
-import NewsView3Sub from '../pages/NewsView3Sub/NewsView3Sub.vue'
+import NewsView1 from '../pages/NewsView/NewsView1'
+import NewsView2 from '../pages/NewsView/NewsView2'
+import NewsView3 from '../pages/NewsView/NewsView3'
+import NewsView3Sub from '../pages/NewsView/NewsView3Sub'
+import NewsViewDetailText from '../pages/NewsViewDetail/NewsViewDetailText'
 Vue.use(Router)
 
 export default new Router({
@@ -274,6 +275,16 @@ export default new Router({
         title: `${common.area.areaName}公共文化数字云平台`,
         keepAlive: false
       }
+    },
+    {
+      path: '/newsViewDetailText/:newsContentId',
+      name: 'newsViewDetailText',
+      component: NewsViewDetailText,
+      props: true,
+      meta: {
+        title: `${common.area.areaName}公共文化数字云平台`,
+        keepAlive: false
+      }
     }
   ]
 })