123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224 |
- <template>
- <div style="background: #f0f0f0;padding-bottom:50px">
- <div class="banner">
- <img src="~@/assets/images/yqtz.jpg" alt="">
- </div>
- <div class="bread">
- <div>
- <span>当前位置:首页-园区通知-通知详情</span>
- </div>
- </div>
- <div class="smart-device">
- <div class="smart-title">
- <span v-if="detail.active==1" style="font-size: 0.7rem;"><span>园区通知</span>PARK NOTICE</span>
- <span v-else style="font-size: 0.7rem;"><span>物业通知</span>PROPERTY NOTICE</span>
- </div>
- <div class="smart-device-content">
- <div class="titles">
- <h3>{{ detail.name }}</h3>
- </div>
- <div class="list-content" v-html="detail.detail" />
- <div v-for="(item,index) in file" :key="index" style="color: orangered;cursor: pointer" @click="downLoad(item)">
- {{ item.name }}
- </div>
- <!-- <div v-else class="list-content">-->
- <!-- <div>{{ detail.detail }}</div>-->
- <!-- </div>-->
- </div>
- </div>
- </div>
- </template>
- <script>
- export default {
- data() {
- return {
- active: 1,
- file: '',
- zsList: [
- {
- img: 'zs1.png',
- name: '专项扶持政策',
- eventIndex: 1,
- detail: ''
- },
- {
- img: 'zs2.png',
- name: '税收优惠',
- eventIndex: 2,
- detail: ''
- },
- {
- img: 'zs3.png',
- name: '奖励措施',
- eventIndex: 3,
- detail: ''
- }
- ],
- detail: {}
- }
- },
- mounted() {
- document.documentElement.scrollTop = document.body.scrollTop = 0 // 回到顶部
- this.detail = this.$route.query
- this.getFile()
- },
- methods: {
- getFile() {
- this.file = JSON.parse(this.$route.query.noticeFileId)
- console.log('file', this.file)
- },
- detail1(index) {
- switch (index) {
- case 1:
- this.$router.push({ path: '/zhaoshang/detail1' })
- break
- }
- },
- downLoad(item) {
- window.location.href = item.url
- }
- }
- }
- </script>
- <style scoped>
- .banner img{
- width: 100% !important;
- }
- @media screen and (min-width: 1000px){
- .bread{
- background: #fff;
- }
- .bread div{
- width: 1200px;
- margin: 0 auto;
- text-align: left;
- padding: 0.8rem 0;
- font-size: 1rem;
- }
- .smart-title{
- margin-top:3rem;
- }
- .smart-device{
- width: 1200px;
- margin: 0 auto;
- text-align: left;
- font-size: 1rem;
- }
- .smart-device span span{
- font-size: 2rem;
- display: inline-block;
- position: relative;
- padding-right: 1rem;
- margin-right: 1rem;
- font-weight: 900;
- }
- .smart-device span span:after{
- content: '';
- width: 1px;
- height: 15px;
- background: #666;
- position: absolute;
- right: 0;
- bottom: 7px;
- }
- .device-title img{
- width: 80%;
- }
- .nav-list{
- display: flex;
- justify-content: center;
- flex-wrap: nowrap;
- margin: 2rem auto;
- width: 50%;
- }
- .nav-list li{
- min-width: 33.33%;
- max-width: 33.33%;
- text-align: center;
- color: #666;
- font-size: 0.8rem;
- cursor: pointer;
- }
- .nav-list li span{
- border-bottom: 2px solid #f0f0f0;
- padding-bottom: 0.8rem;
- }
- .active span{
- display: inline-block;
- border-bottom: 2px solid #FF6A00!important;
- color: #333;
- }
- }
- @media screen and (max-width: 1000px){
- .banner{
- display: none;
- }
- .bread{
- display: none;
- }
- .smart-title{
- margin-top:2rem;
- }
- .smart-device{
- width: 90%;
- margin: 0 auto;
- text-align: left;
- font-size: 1rem;
- overflow: hidden;
- }
- .smart-device span span{
- font-size: 1.5rem;
- display: inline-block;
- position: relative;
- padding-right: 1rem;
- margin-right: 1rem;
- font-weight: 900;
- }
- .smart-device span span:after{
- content: '';
- width: 1px;
- height: 15px;
- background: #666;
- position: absolute;
- right: 0;
- bottom: 7px;
- }
- .device-title img{
- width: 100%;
- }
- .nav-list{
- display: flex;
- justify-content: center;
- flex-wrap: nowrap;
- margin: 2rem;
- }
- .nav-list li{
- min-width: 33.33%;
- max-width: 33.33%;
- text-align: center;
- color: #666;
- font-size: 0.8rem;
- cursor: pointer;
- }
- .nav-list li span{
- border-bottom: 2px solid #f0f0f0;
- padding-bottom: 0.8rem;
- }
- .active span{
- display: inline-block;
- border-bottom: 2px solid #FF6A00!important;
- color: #333;
- font-weight:800!important;
- }
- }
- .titles{
- text-align: center;
- margin: 2rem 0;
- }
- .list-content{
- min-height: 10rem;
- }
- </style>
|