Tenlion/bjmsjy-portal-new
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

样式修改1

Browse Source
This commit is contained in:
dong_bo0602 2021-07-21 16:43:45 +08:00
parent 6fb2bbb77d
commit bafc092d4b
9 changed files with 475 additions and 433 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
build/webpack.prod.conf.js
View File

@ -13,6 +13,27 @@ const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
const env = require('../config/prod.env') const env = require('../config/prod.env')
// const PrerenderSPAPlugin = require('prerender-spa-plugin');
// const Renderer = PrerenderSPAPlugin.PuppeteerRenderer;
// configureWebpack: config => {
// if (process.env.NODE_ENV !== 'production') return;
// return {
// plugins: [
// new PrerenderSPAPlugin({
// staticDir: path.join(__dirname, './dist'),
// routes: ['/','/recruit','/info','/honor','/contact','/policy','/company'], // 需要预渲染的路由
// renderer: new Renderer({
// inject: {
// foo: "bar"
// },
// headless: false,
// renderAfterDocumentEvent: 'render-event'
// })
// })
// ]
// }
// }
const webpackConfig = merge(baseWebpackConfig, { const webpackConfig = merge(baseWebpackConfig, {
module: { module: {
rules: utils.styleLoaders({ rules: utils.styleLoaders({
@ -46,7 +67,7 @@ const webpackConfig = merge(baseWebpackConfig, {
filename: utils.assetsPath('css/[name].[contenthash].css'), filename: utils.assetsPath('css/[name].[contenthash].css'),
// Setting the following option to `false` will not extract CSS from codesplit chunks. // Setting the following option to `false` will not extract CSS from codesplit chunks.
// Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack. // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
// It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`, // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`,
// increasing file size: https://github.com/vuejs-templates/webpack/issues/1110 // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
allChunks: true, allChunks: true,
}), }),

BIN
dist.zip Normal file
View File

Binary file not shown.

1
index.html
View File

@ -4,6 +4,7 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>北京明世纪元招标有限公司</title> <title>北京明世纪元招标有限公司</title>
<link rel="shortcut icon" href="static/logo.ico" type="image/x-icon">
<script src="static/laydate/laydate.js"></script> <script src="static/laydate/laydate.js"></script>
</head> </head>
<body> <body>

527
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

1
package.json
View File

@ -12,6 +12,7 @@
"dependencies": { "dependencies": {
"axios": "^0.21.1", "axios": "^0.21.1",
"babel-polyfill": "^6.26.0", "babel-polyfill": "^6.26.0",
"prerender-spa-plugin": "^3.4.0",
"stylus": "^0.54.8", "stylus": "^0.54.8",
"stylus-loader": "^3.0.2", "stylus-loader": "^3.0.2",
"vue": "^2.5.2", "vue": "^2.5.2",

129
src/assets/components/Header.vue
View File

@ -1,34 +1,38 @@
<template> <template>
<div class="header"> <div class="header">
<div class="header-container"> <div class="header-nav">
<div class="header-contact"> <div class="header-contact">
<span class="phone">010-63518887</span> <div class="logo">
<span class="email">bjmsjy@163.com</span> <router-link to="/" title="北京明世纪元招标有限公司">
</div> <img src="@/assets/images/logo.png" alt="">
<div class="nav">
<router-link to="/" class="logo" tag="div">
<img src="@/assets/images/logo.png" alt="">
</router-link>
<ul class="nav-box">
<router-link to="/" tag="li">网站首页</router-link>
<router-link to="/info" tag="li" :class="{active: this.$route.path == '/info'}">信息公告</router-link>
<router-link to="/company" tag="li" :class="{active: this.$route.path == '/company' || this.$route.path == '/honor'}">
关于我们
<div class="child">
<router-link to="/company">公司简介</router-link>
<router-link to="/honor">公司荣誉</router-link>
</div>
</router-link> </router-link>
<router-link to="/policy" tag="li" :class="{active: this.$route.path == '/policy'}">政策法规</router-link> <ul class="nav-box">
<router-link to="/contact" tag="li" :class="{active: this.$route.path == '/contact'}">联系我们</router-link> <router-link to="/" tag="li" :class="{active: this.$route.path == '/'}">网站首页</router-link>
<router-link to="/recruit" tag="li" :class="{active: this.$route.path == '/recruit'}">职位招聘</router-link> <router-link to="/info" tag="li" :class="{active: this.$route.path == '/info'}">信息公告</router-link>
</ul> <router-link to="/company" tag="li" :class="{active: this.$route.path == '/company' || this.$route.path == '/honor'}">
关于我们
<div class="child">
<router-link to="/company">公司简介</router-link>
<router-link to="/honor">公司荣誉</router-link>
</div>
</router-link>
<router-link to="/policy" tag="li" :class="{active: this.$route.path == '/policy'}">政策法规</router-link>
<router-link to="/contact" tag="li" :class="{active: this.$route.path == '/contact'}">联系我们</router-link>
<router-link to="/recruit" tag="li" :class="{active: this.$route.path == '/recruit'}">职位招聘</router-link>
</ul>
<div class="contact">
<span class="phone">010-63518887</span>
<span class="email">bjmsjy@163.com</span>
</div>
</div>
</div> </div>
</div> </div>
<div class="banner"> <div class="banner">
<swiper ref="mySwiper" :options="swiperOptions"> <swiper ref="mySwiper" :options="swiperOptions">
<swiper-slide> <swiper-slide>
<img :src="requestUrl + '/news/route/file/downloadfile/true/' + coverPhoto" alt=""> <div class="banner-box">
<img :src="requestUrl + '/news/route/file/downloadfile/true/' + coverPhoto" alt="">
</div>
</swiper-slide> </swiper-slide>
<!-- <div class="swiper-pagination" slot="pagination"></div>--> <!-- <div class="swiper-pagination" slot="pagination"></div>-->
</swiper> </swiper>
@ -63,56 +67,46 @@ export default {
<style lang="stylus" rel="stylesheet/stylus" scoped> <style lang="stylus" rel="stylesheet/stylus" scoped>
@import "~styles/public.styl" @import "~styles/public.styl"
.header .header
//background $main-blue //padding 10px 0
height 530px height 500px
overflow hidden
position relative position relative
.header-container .header-nav
width 1200px padding 15px 0
margin 0 auto background rgba(255,255,255,0.6)
margin-top 40px
.header-contact .header-contact
padding 10px 0 width 1200px
span margin 0 auto
font-size 12px .logo
display inline-block width 1200px
color #fff margin 0 auto
font-style oblique
padding 0 15px 0 20px
&.phone
background url("~@/assets/images/phone.png") no-repeat left center
border-right 1px solid #fff
margin-right 10px
&.email
background url("~@/assets/images/email.png") no-repeat left center
.nav
padding 10px 20px
background rgba(255,255,255,0.6)
border-radius 10px
&:after &:after
content '' content ''
display block display block
clear both clear both
.logo a
display block
float left float left
cursor pointer
img img
width 60px width 160px
//height 60px
.nav-box .nav-box
float right float left
margin-top 10px margin-left 130px
//margin-top 10px
&:after &:after
content '' content ''
display block display block
clear both clear both
li li
float left float left
line-height 48px line-height 44px
font-size 16px font-size 16px
color #333 color #333
margin-right 80px margin-right 30px
cursor pointer cursor pointer
position relative position relative
border-bottom 3px solid transparent border-bottom 3px solid #b2b2b2
&:last-child &:last-child
margin-right 0 margin-right 0
&.active, &:hover &.active, &:hover
@ -142,6 +136,21 @@ export default {
&:hover &:hover
font-weight bold font-weight bold
color $main-blue color $main-blue
.contact
float right
margin-top 12px
span
font-size 12px
display inline-block
color #2c367e
font-style oblique
padding 0 15px 0 20px
&.phone
background url("~@/assets/images/phone.png") no-repeat left center
border-right 1px solid #2c367e
margin-right 10px
&.email
background url("~@/assets/images/email.png") no-repeat left center
.banner .banner
position absolute position absolute
top 0 top 0
@ -149,7 +158,17 @@ export default {
right 0 right 0
bottom 0 bottom 0
z-index -1 z-index -1
img .swiper-container
height 100% !important
.banner-box
position relative
width 100% width 100%
height 530px height 100%
overflow hidden
img
position absolute
top 0
left 50%
transform translate(-50%, 0)
height 500px
</style> </style>

BIN
src/assets/images/logo.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 77 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

227
src/pages/Index/Index.vue
View File

@ -1,57 +1,44 @@
<template> <template>
<div> <div>
<div class="header"> <div class="header">
<div class="header-contact"> <div class="header-nav">
<span class="phone">010-63518887</span> <div class="header-contact">
<span class="email">bjmsjy@163.com</span> <div class="logo">
</div> <router-link to="/" title="北京明世纪元招标有限公司">
<div class="logo"> <img src="@/assets/images/logo.png" alt="">
<router-link to="/"> </router-link>
<img src="@/assets/images/logo.png" alt=""> <ul class="nav-box">
</router-link> <router-link to="/" tag="li" class="active">网站首页</router-link>
<ul class="nav-box"> <router-link to="/info" tag="li">信息公告</router-link>
<router-link to="/" tag="li" class="active">网站首页</router-link> <router-link to="/company" tag="li">
<router-link to="/info" tag="li">信息公告</router-link> 关于我们
<router-link to="/company" tag="li"> <div class="child">
关于我们 <router-link to="/company">公司简介</router-link>
<div class="child"> <router-link to="/honor">公司荣誉</router-link>
<router-link to="/company">公司简介</router-link> </div>
<router-link to="/honor">公司荣誉</router-link> </router-link>
<router-link to="/policy" tag="li">政策法规</router-link>
<router-link to="/contact" tag="li">联系我们</router-link>
<router-link to="/recruit" tag="li">职位招聘</router-link>
</ul>
<div class="contact">
<span class="phone">010-63518887</span>
<span class="email">bjmsjy@163.com</span>
</div> </div>
</router-link> </div>
<router-link to="/policy" tag="li">政策法规</router-link> </div>
<router-link to="/contact" tag="li">联系我们</router-link>
<router-link to="/recruit" tag="li">职位招聘</router-link>
</ul>
</div> </div>
<div class="banner"> <div class="banner">
<swiper ref="mySwiper" :options="swiperOptions"> <swiper ref="mySwiper" :options="swiperOptions">
<swiper-slide v-for="(banner,idx) in bannerList" :key="idx"> <swiper-slide v-for="(banner,idx) in bannerList" :key="idx">
<img :src="requestUrl + '/news/route/file/downloadfile/true/' + banner.newsContentCoverList" alt=""> <div class="banner-box">
<img :src="requestUrl + '/news/route/file/downloadfile/true/' + banner.newsContentCoverList" alt="">
</div>
</swiper-slide> </swiper-slide>
<div class="swiper-pagination" slot="pagination"></div> <div class="swiper-pagination" slot="pagination"></div>
</swiper> </swiper>
</div> </div>
</div> </div>
<!-- <banner :bannerList="bannerList"></banner>-->
<!-- <div class="nav">-->
<!-- <div class="nav-container">-->
<!-- <ul>-->
<!-- <li class="active">网站首页</li>-->
<!-- <router-link to="/info" tag="li">信息公告</router-link>-->
<!-- <router-link to="/company" tag="li">-->
<!-- 关于我们-->
<!-- <div class="child">-->
<!-- <router-link to="/company">公司简介</router-link>-->
<!-- <router-link to="/honor">公司荣誉</router-link>-->
<!-- </div>-->
<!-- </router-link>-->
<!-- <router-link to="/policy" tag="li">政策法规</router-link>-->
<!-- <router-link to="/contact" tag="li">联系我们</router-link>-->
<!-- <router-link to="/recruit" tag="li">职位招聘</router-link>-->
<!-- </ul>-->
<!-- </div>-->
<!-- </div>-->
<Intro :introContent="introContent"></Intro> <Intro :introContent="introContent"></Intro>
<Bidding :biddingList="biddingList" :winBidList="winBidList"></Bidding> <Bidding :biddingList="biddingList" :winBidList="winBidList"></Bidding>
<CompanyInfo :honorIntro="honorIntro" :policyIntro="policyIntro" :recruitIntro="recruitIntro"></CompanyInfo> <CompanyInfo :honorIntro="honorIntro" :policyIntro="policyIntro" :recruitIntro="recruitIntro"></CompanyInfo>
@ -204,97 +191,111 @@ export default {
@import "~styles/public.styl" @import "~styles/public.styl"
.header .header
//padding 10px 0 //padding 10px 0
height 520px height 650px
overflow hidden
position relative position relative
.header-contact .header-nav
width 1200px padding 15px 0
margin 0 auto
box-sizing border-box
padding 10px 0
span
font-size 12px
display inline-block
color #fff
font-style oblique
padding 0 15px 0 20px
&.phone
background url("~@/assets/images/phone.png") no-repeat left center
border-right 1px solid #fff
margin-right 10px
&.email
background url("~@/assets/images/email.png") no-repeat left center
.logo
width 1200px
margin 0 auto
background rgba(255,255,255,0.6) background rgba(255,255,255,0.6)
padding 10px 20px margin-top 40px
box-sizing border-box .header-contact
border-radius 10px width 1200px
&:after margin 0 auto
content '' .logo
display block width 1200px
clear both margin 0 auto
a
display block
float left
img
width 60px
.nav-box
float right
margin-top 10px
&:after &:after
content '' content ''
display block display block
clear both clear both
li a
float left display block
line-height 48px float left
font-size 16px img
color #333 width 160px
margin-right 80px .nav-box
cursor pointer float left
position relative margin-left 130px
border-bottom 3px solid transparent //margin-top 10px
&:last-child &:after
margin-right 0 content ''
&.active, &:hover
font-weight bold
color $main-blue
border-bottom 3px solid $main-red
&:hover
a
font-weight normal
.child
display block display block
.child clear both
position absolute li
top 100% float left
left -13px line-height 44px
padding 0 10px
width 110%
box-shadow 0 0 10px #EEE
display none
background #fff
a
display block
line-height 40px
font-size 16px font-size 16px
color #333 color #333
text-align center margin-right 30px
&:hover cursor pointer
position relative
border-bottom 3px solid #b2b2b2
&:last-child
margin-right 0
&.active, &:hover
font-weight bold font-weight bold
color $main-blue color $main-blue
border-bottom 3px solid $main-red
&:hover
a
font-weight normal
.child
display block
.child
position absolute
top 100%
left -13px
padding 0 10px
width 110%
box-shadow 0 0 10px #EEE
display none
background #fff
a
display block
line-height 40px
font-size 16px
color #333
text-align center
&:hover
font-weight bold
color $main-blue
.contact
float right
margin-top 12px
span
font-size 12px
display inline-block
color #2c367e
font-style oblique
padding 0 15px 0 20px
&.phone
background url("~@/assets/images/phone.png") no-repeat left center
border-right 1px solid #2c367e
margin-right 10px
&.email
background url("~@/assets/images/email.png") no-repeat left center
.banner .banner
position absolute position absolute
height 520px height 650px
top 0 top 0
left 0 left 0
right 0 right 0
bottom 0 bottom 0
z-index -1 z-index -1
img .swiper-container
height 100% !important
.banner-box
position relative
width 100% width 100%
height 520px height 100%
overflow hidden
img
position absolute
top 0
left 50%
transform translate(-50%, 0)
//width 100%
height 650px
.nav .nav
background #f9cd1b background #f9cd1b
.nav-container .nav-container

BIN
static/logo.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB