样式修改1

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

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({

BIN
dist.zip Normal file

Binary file not shown.

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

File diff suppressed because it is too large Load Diff

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",

View File

@ -1,16 +1,13 @@
<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>
<div class="nav">
<router-link to="/" class="logo" tag="div">
<img src="@/assets/images/logo.png" alt=""> <img src="@/assets/images/logo.png" alt="">
</router-link> </router-link>
<ul class="nav-box"> <ul class="nav-box">
<router-link to="/" tag="li">网站首页</router-link> <router-link to="/" tag="li" :class="{active: this.$route.path == '/'}">网站首页</router-link>
<router-link to="/info" tag="li" :class="{active: this.$route.path == '/info'}">信息公告</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'}"> <router-link to="/company" tag="li" :class="{active: this.$route.path == '/company' || this.$route.path == '/honor'}">
关于我们 关于我们
@ -23,12 +20,19 @@
<router-link to="/contact" tag="li" :class="{active: this.$route.path == '/contact'}">联系我们</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> <router-link to="/recruit" tag="li" :class="{active: this.$route.path == '/recruit'}">职位招聘</router-link>
</ul> </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>
<div class="banner-box">
<img :src="requestUrl + '/news/route/file/downloadfile/true/' + coverPhoto" alt=""> <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
padding 15px 0
background rgba(255,255,255,0.6)
margin-top 40px
.header-contact
width 1200px
margin 0 auto
.logo
width 1200px width 1200px
margin 0 auto margin 0 auto
.header-contact
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
.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>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 77 KiB

After

Width:  |  Height:  |  Size: 3.9 KiB

View File

@ -1,12 +1,10 @@
<template> <template>
<div> <div>
<div class="header"> <div class="header">
<div class="header-nav">
<div class="header-contact"> <div class="header-contact">
<span class="phone">010-63518887</span>
<span class="email">bjmsjy@163.com</span>
</div>
<div class="logo"> <div class="logo">
<router-link to="/"> <router-link to="/" title="北京明世纪元招标有限公司">
<img src="@/assets/images/logo.png" alt=""> <img src="@/assets/images/logo.png" alt="">
</router-link> </router-link>
<ul class="nav-box"> <ul class="nav-box">
@ -23,35 +21,24 @@
<router-link to="/contact" tag="li">联系我们</router-link> <router-link to="/contact" tag="li">联系我们</router-link>
<router-link to="/recruit" tag="li">职位招聘</router-link> <router-link to="/recruit" tag="li">职位招聘</router-link>
</ul> </ul>
<div class="contact">
<span class="phone">010-63518887</span>
<span class="email">bjmsjy@163.com</span>
</div>
</div>
</div>
</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">
<div class="banner-box">
<img :src="requestUrl + '/news/route/file/downloadfile/true/' + banner.newsContentCoverList" alt=""> <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,32 +191,19 @@ 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-nav
padding 15px 0
background rgba(255,255,255,0.6)
margin-top 40px
.header-contact .header-contact
width 1200px width 1200px
margin 0 auto 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 .logo
width 1200px width 1200px
margin 0 auto margin 0 auto
background rgba(255,255,255,0.6)
padding 10px 20px
box-sizing border-box
border-radius 10px
&:after &:after
content '' content ''
display block display block
@ -238,23 +212,24 @@ export default {
display block display block
float left float left
img img
width 60px width 160px
.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
@ -284,17 +259,43 @@ 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
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

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB