Skip to content

html / zhaocaih5-wanda

Go to a project
Commit 98b40e69 by mamingqun
Options

cb

parent 7f5b259b
Showing with 122 additions and 65 deletions
public/index.html
......@@ -6,7 +6,6 @@
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>万达招采</title>
<script src="./extras/jquery.min.js"></script>
</head>
<body>
<noscript>
......
src/assets/images/02/01tc.png
src/assets/images/02/01tc.png

165 KB | W: | H:

src/assets/images/02/01tc.png

84.6 KB | W: | H:

src/assets/images/02/01tc.png
src/assets/images/02/01tc.png
src/assets/images/02/01tc.png
src/assets/images/02/01tc.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/02/02tc.png
src/assets/images/02/02tc.png

130 KB | W: | H:

src/assets/images/02/02tc.png

80.2 KB | W: | H:

src/assets/images/02/02tc.png
src/assets/images/02/02tc.png
src/assets/images/02/02tc.png
src/assets/images/02/02tc.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/02/03tc.png
src/assets/images/02/03tc.png

134 KB | W: | H:

src/assets/images/02/03tc.png

115 KB | W: | H:

src/assets/images/02/03tc.png
src/assets/images/02/03tc.png
src/assets/images/02/03tc.png
src/assets/images/02/03tc.png
  • 2-up
  • Swipe
  • Onion skin
src/components/music.vue
......@@ -8,13 +8,20 @@
</template>
<script>
import music1 from '@/assets/mp3/music.mp3';
import start1 from '@/assets/mp3/start.png';
import pause1 from '@/assets/mp3/pause.png';
export default {
data() {
return {
map3Src: require('../assets/mp3/music.mp3'),
isPlaying: true,
imgStart: require('../assets/images/01/start.png'),
imgEnd: require('../assets/images/01/pause.png')
// map3Src: require('@/assets/mp3/music.mp3'),
// imgStart: require('@/assets/images/01/start.png'),
// imgEnd: require('@/assets/images/01/pause.png'),
map3Src: music1,
imgStart: start1,
imgEnd: pause1
}
},
mounted() {
......@@ -97,13 +104,13 @@ export default {
.music-box {
position: absolute;
top: 5%;
left: 5%;
top: 3%;
left: 3%;
z-index: 100000;
.music {
width: 90 / @r;
height: 90 / @r;
width: 70 / @r;
height: 70 / @r;
img {
width: 100%;
height: 100%;
......@@ -111,12 +118,12 @@ export default {
}
.start {
background: url("../assets/images/01/start.png") no-repeat;
// background: url("../assets/images/01/start.png") no-repeat;
background-size: contain;
}
.pause {
background: url("../assets/images/01/pause.png") no-repeat;
// background: url("../assets/images/01/pause.png") no-repeat;
background-size: contain;
}
}
......
src/views/erjiye.vue
......@@ -27,7 +27,10 @@
</div>
</div>
<div class="bottom11">
<div class="laozhaos"></div>
<div class="laozhaos">
<div class="yinying"></div>
</div>
<div class="text"></div>
</div>
<div class="search-button" @click="openSearch"></div>
<div class="search-box" v-show="searchButton">
......@@ -82,7 +85,7 @@ export default {
handleDetail(id, title, item) {
if (item.module === 2) {
$eventbus.$emit('jumpPage', {pageName:'xiangqing',id:id})
$eventbus.$emit('jumpPage', { pageName: 'xiangqing', id: id })
setTimeout(() => {
$eventbus.$emit('detailData', { id, title })
});
......@@ -103,7 +106,7 @@ export default {
}
}
},
resetSearch(){
resetSearch() {
this.filterList = []
this.keyWord = ''
},
......@@ -148,7 +151,7 @@ export default {
return ele.catname.includes(newVal)
})
console.log('arr');
console.log( arr );
console.log(arr);
this.filterList = arr
}
......@@ -240,13 +243,15 @@ p:nth-child(1) {
.content {
// border: 1px solid white;
width: 600 / @r;
height: 980 / @r;
height: 825 / @r;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
flex-direction: column;
box-sizing: content-box;
// padding-bottom: 250 / @r;
.title {
height: 116 / @r;
......@@ -307,15 +312,39 @@ p:nth-child(1) {
background-size: 100% auto;
.laozhaos {
width: 500 / @r;
height: 300 / @r;
background: url("../assets/images/erjiye/laozhaos.png") no-repeat top
width: 150 / @r;
height: 230 / @r;
// background: url("../assets/images/erjiye/laozhaos.png") no-repeat top center;
background: url("../assets/images/erjiye/laozhaogif.gif") no-repeat top
right;
background-size: contain;
position: absolute;
left: 65%;
bottom: 30 / @r;
// transform: translate(-50%, 0);
}
.yinying {
width: 161 / @r;
height: 38 / @r;
background: url("../assets/images/erjiye/yinying.png") no-repeat top right;
background-size: contain;
position: absolute;
left: 60%;
transform: translate(-50%,0);
bottom: -20 / @r;
}
.text {
width: 360 / @r;
height: 150 / @r;
background: url("../assets/images/erjiye/text.png") no-repeat center
center;
background-size: contain;
position: absolute;
left: 50%;
bottom: 30 / @r;
transform: translate(-50%, 0);
bottom: 10 / @r;
transform: translate(-70%, 0);
}
}
}
......
src/views/xiangqing.vue
<template>
<!-- <div> -->
<!-- <div class="laozhao" @click="showMulu"></div> -->
<div class="book-page-box book-page-1 preserve-3d" :style="{zIndex:zIndex}" @click="handleJump">
<div class="book-page page-front">
<div class="xiangqing">
<div class="top-info"></div>
<div class="laozhao" @click="showMulu"></div>
<!-- 目录 -->
<!-- <div class="mulu-wrap" v-show="mulu">
<div class="mulu-wrap" v-show="mulu">
<div class="mulu">
<div class="title">万达招采</div>
<div class="content">
<div v-shotclick="handleClick">
<li class="main-title" @click="goFengMian">封面</li>
<li class="main-title" @click="goXu">序</li>
<li class="main-title" @click="goXu">目标</li>
<ul :id="index + 1" v-for="(item, index) in $store.state.list" :key="index">
<li class="main-title">{{item.catname}}</li>
<div v-for="(ele, num) in item.child" :key="num">
......@@ -32,12 +36,7 @@
</div>
<div class="close" @click="closeMulu"></div>
</div>
</div>-->
<div class="book-page-box book-page-1 preserve-3d" :style="{zIndex:zIndex}" @click="handleJump">
<div class="book-page page-front">
<div class="xiangqing">
<div class="top-info"></div>
</div>
<!-- 内容区 -->
<!-- <button class="btn" data-clipboard-copy="copy123" data-clipboard-target="button">Copy123</button> -->
<!-- <div class="mainTitle">{{mianTitle}}</div> -->
......@@ -84,6 +83,7 @@ export default {
methods: {
showMulu() {
this.mulu = !this.mulu
$('body').css('overflow','hidden')
},
handleClick() {
......@@ -93,7 +93,8 @@ export default {
},
watchDetail() {
$eventbus.$on('detailData', (params) => {
this.mianTitle = params.title
console.log('详情1 变96');
this.zIndex = 96
})
},
getDetail(id) {
......@@ -102,11 +103,13 @@ export default {
})
},
handleDetail(id, title, item) {
console.log('id,title详情1目录的点击')
console.log(id, title)
if (item.module === 2) {
$eventbus.$emit('jumpPage', { pageName: 'xiangqing1', id: id })
setTimeout(() => {
this.zIndex = 95
$eventbus.$emit('detailData', { id, title })
});
} else {
......@@ -128,6 +131,7 @@ export default {
},
closeMulu() {
this.mulu = false;
$('body').css('overflow','auto')
},
goFengMian() {
$eventbus.$emit('jumpPage', { pageName: 'shouye' })
......@@ -143,13 +147,14 @@ export default {
@r: 75rem;
.mulu-wrap {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
top: 50%;
left: 50%;
z-index: 502;
background: rgba(0, 0, 0, 0.7);
transform: translate(-50%,-50%);
.mulu {
width: 600 / @r;
......
src/views/xiangqing1.vue
<template>
<!-- <div> -->
<!-- <div class="laozhao" @click="showMulu"></div> -->
<div class="book-page-box book-page-1 preserve-3d" :style="{zIndex:zIndex}" @click="handleJump">
<div class="book-page page-front">
<div class="xiangqing">
<div class="top-info"></div>
<div class="laozhao" @click="showMulu"></div>
<!-- 目录 -->
<!-- <div class="mulu-wrap" v-show="mulu">
<div class="mulu-wrap" v-show="mulu">
<div class="mulu">
<div class="title">万达招采</div>
<div class="content">
<div v-shotclick="handleClick">
<li class="main-title" @click="goFengMian">封面</li>
<li class="main-title" @click="goXu">序</li>
<li class="main-title" @click="goXu">目标</li>
<ul :id="index + 1" v-for="(item, index) in $store.state.list" :key="index">
<li class="main-title">{{item.catname}}</li>
<div v-for="(ele, num) in item.child" :key="num">
......@@ -32,12 +37,7 @@
</div>
<div class="close" @click="closeMulu"></div>
</div>
</div>-->
<div class="book-page-box book-page-1 preserve-3d" :style="{zIndex:zIndex}" @click="handleJump">
<div class="book-page page-front">
<div class="xiangqing">
<div class="top-info"></div>
</div>
<!-- 内容区 -->
<!-- <button class="btn" data-clipboard-copy="copy123" data-clipboard-target="button">Copy123</button> -->
<!-- <div class="mainTitle">{{mianTitle}}</div> -->
......@@ -84,16 +84,20 @@ export default {
methods: {
showMulu() {
this.mulu = !this.mulu
if (this.mulu) {
$('body').css('overflow','hidden')
}
},
handleClick() {
},
handleJump() {
console.log(123123)
},
watchDetail() {
$eventbus.$on('detailData', (params) => {
this.mianTitle = params.title
console.log('详情2 变96');
this.zIndex = 96
})
},
getDetail(id) {
......@@ -102,11 +106,13 @@ export default {
})
},
handleDetail(id, title, item) {
console.log('id,title详情1目录的点击')
console.log(id, title)
if (item.module === 2) {
$eventbus.$emit('jumpPage', { pageName: 'xiangqing', id: id })
setTimeout(() => {
this.zIndex = 95
$eventbus.$emit('detailData', { id, title })
});
} else {
......@@ -128,6 +134,7 @@ export default {
},
closeMulu() {
this.mulu = false;
$('body').css('overflow','auto')
},
goFengMian() {
$eventbus.$emit('jumpPage', { pageName: 'shouye' })
......@@ -143,13 +150,14 @@ export default {
@r: 75rem;
.mulu-wrap {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
top: 50%;
left: 50%;
z-index: 502;
background: rgba(0, 0, 0, 0.7);
transform: translate(-50%,-50%);
.mulu {
width: 600 / @r;
......
src/views/yjml.vue
......@@ -16,7 +16,8 @@
</ul>
<div class="button01 animated tada">
<div class="num-box animated bounceInUp">
<span>阅读人数</span>：{{$store.state.yudushu}}
<span>阅读人数</span>
：{{$store.state.yudushu}}
</div>
</div>
<!-- <div class="yijian animated bounceInRight"></div> -->
......@@ -24,14 +25,17 @@
<div class="kuang kuang1" v-if="tancengIndex === 1">
<div class="close" @click="handleCloseTanCeng"></div>
<div class="buttons" @click="handleJump"></div>
<div class="laozhaos"></div>
</div>
<div class="kuang kuang2" v-if="tancengIndex === 2">
<div class="close" @click="handleCloseTanCeng"></div>
<div class="buttons" @click="handleJump"></div>
<div class="laozhaos"></div>
</div>
<div class="kuang kuang3" v-if="tancengIndex === 3">
<div class="close" @click="handleCloseTanCeng"></div>
<div class="buttons" @click="handleJump"></div>
<div class="laozhaos"></div>
</div>
</div>
</div>
......@@ -48,7 +52,7 @@ export default {
tancengIndex: null
}
},
activated(){
activated() {
this.tanceng = false
},
created() {
......@@ -64,7 +68,7 @@ export default {
},
handleJump() {
$eventbus.$emit('jumpPage', {pageName:'erjiye'})
$eventbus.$emit('jumpPage', { pageName: 'erjiye' })
setTimeout(() => {
$eventbus.$emit('maodian', this.tancengIndex)
});
......@@ -94,6 +98,16 @@ export default {
overflow: hidden;
}
.laozhaos {
width: 150 / @r;
height: 240 / @r;
background: url("../assets/images/erjiye/laozhaogif.gif") no-repeat top right;
background-size: contain;
position: absolute;
left: 65%;
bottom: 140 / @r;
}
.main-title {
width: 480 / @r;
height: 400 / @r;
......
vue.config.js
// import webpack from 'webpack'
// module.exports = {
// configureWebpack: {
// plugins: [new webpack.ProvidePlugin({
// jQuery: "jquery",
// $: "jquery"
// })]
// }
// }
\ No newline at end of file
module.exports = {
publicPath: "../dist/"
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment