Commit e1b2489b by hank

merge

parents 91cdca0c 7d55b422

6.3 KB | W: | H:

2.65 KB | W: | H:

src/assets/Drinks Wave.png
src/assets/Drinks Wave.png
src/assets/Drinks Wave.png
src/assets/Drinks Wave.png
  • 2-up
  • Swipe
  • Onion skin

347 KB | W: | H:

99.2 KB | W: | H:

src/assets/Left-right.png
src/assets/Left-right.png
src/assets/Left-right.png
src/assets/Left-right.png
  • 2-up
  • Swipe
  • Onion skin

97.4 KB | W: | H:

41.7 KB | W: | H:

src/assets/New Summer.png
src/assets/New Summer.png
src/assets/New Summer.png
src/assets/New Summer.png
  • 2-up
  • Swipe
  • Onion skin

105 KB | W: | H:

39 KB | W: | H:

src/assets/Title item.png
src/assets/Title item.png
src/assets/Title item.png
src/assets/Title item.png
  • 2-up
  • Swipe
  • Onion skin

15.1 KB | W: | H:

7.24 KB | W: | H:

src/assets/bean.png
src/assets/bean.png
src/assets/bean.png
src/assets/bean.png
  • 2-up
  • Swipe
  • Onion skin

48.2 KB | W: | H:

21.3 KB | W: | H:

src/assets/code.png
src/assets/code.png
src/assets/code.png
src/assets/code.png
  • 2-up
  • Swipe
  • Onion skin

225 KB | W: | H:

70 KB | W: | H:

src/assets/decorate.png
src/assets/decorate.png
src/assets/decorate.png
src/assets/decorate.png
  • 2-up
  • Swipe
  • Onion skin

3.04 KB | W: | H:

674 Bytes | W: | H:

src/assets/frame.png
src/assets/frame.png
src/assets/frame.png
src/assets/frame.png
  • 2-up
  • Swipe
  • Onion skin

186 Bytes | W: | H:

97 Bytes | W: | H:

src/assets/line.png
src/assets/line.png
src/assets/line.png
src/assets/line.png
  • 2-up
  • Swipe
  • Onion skin

6.69 KB | W: | H:

2.23 KB | W: | H:

src/assets/logo.png
src/assets/logo.png
src/assets/logo.png
src/assets/logo.png
  • 2-up
  • Swipe
  • Onion skin

260 KB | W: | H:

103 KB | W: | H:

src/assets/mlxg.png
src/assets/mlxg.png
src/assets/mlxg.png
src/assets/mlxg.png
  • 2-up
  • Swipe
  • Onion skin

4.31 MB | W: | H:

1.01 MB | W: | H:

src/assets/picture.png
src/assets/picture.png
src/assets/picture.png
src/assets/picture.png
  • 2-up
  • Swipe
  • Onion skin

18.7 KB | W: | H:

8.27 KB | W: | H:

src/assets/price.png
src/assets/price.png
src/assets/price.png
src/assets/price.png
  • 2-up
  • Swipe
  • Onion skin

91.2 KB | W: | H:

33.5 KB | W: | H:

src/assets/table item.png
src/assets/table item.png
src/assets/table item.png
src/assets/table item.png
  • 2-up
  • Swipe
  • Onion skin

8.11 KB | W: | H:

4.25 KB | W: | H:

src/assets/textlleft.png
src/assets/textlleft.png
src/assets/textlleft.png
src/assets/textlleft.png
  • 2-up
  • Swipe
  • Onion skin

8.72 KB | W: | H:

4.58 KB | W: | H:

src/assets/textright.png
src/assets/textright.png
src/assets/textright.png
src/assets/textright.png
  • 2-up
  • Swipe
  • Onion skin
import welcome from './welcome' import retail from './retail'
import notice from './notice'
import schedule from './schedule'
export default { export default {
welcome, retail,
notice,
schedule
} }
export default {
companyLogo: {
value: 'http://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/template-culture/logo1.png'
},
companyName: {
value: '迈动互联(北京)信息科技有限公司'
},
noticeTitle: {
value: '2019年端午节放假通知'
},
noticeContent: {
value: '根据国家2019年部分节假日安排,结合公司实际情况,劳动节放假时间安排如下:2019年6月7日至6月9日放假,共3天。6月10(星期一)上班。\r\n注意事项:\r\n 1、放假期间,请各部门自行妥善安排好放假前工作,做好安全防范措施。\r\n2、放假期间外出的员工,请注意人身财产安全.\r\n \r\n \r\n \t 特此通知,请知悉。'
},
noticeNickName: {
value: 'Dear All:'
}
}
export default {
texture: {
value: "https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/texture.jpg"
},
mlxg: {
value: "https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/mlxg.png"
},
picture: {
value: "https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/picture.png"
},
decorate: {
value: "https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/decorate.png"
},
leftright: {
value: "https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/Left-right.png"
},
code: {
value: "https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/code.png"
},
price:{
value:"https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/price.png"
},
line:{
value:"https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/line.png"
},
titleitem:{
value:"https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/Title%20item.png"
},
newsummer:{
value:"https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/New%20Summer.png"
},
textleft:{
value:"https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/textlleft.png"
},
textright:{
value:"https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/textright.png"
},
drinkswave:{
value:"https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/Drinks%20Wave.png"
},
bean:{
value:"https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/bean.png"
},
tableitem:{
value:"https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/table%20item.png"
},
background:{
value:"https://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/background.jpg"
}
}
\ No newline at end of file
export default {
companyLogo: {
value: 'http://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/template-culture/logo1.png'
},
companyName: {
value: '迈动互联(北京)信息科技有限公司'
},
scheduleList: [
{
content: '龙湖地产来访',
address: '22-1会议室',
department: '智慧营销',
time: '09:30 AM -12:00 AM',
index: 1,
schemaIndex: 0
},
{
content: 'Vmatrix研发进度',
address: '21-03会议室',
department: '数字理想',
time: '09:30 AM -10:00 AM',
index: 2,
schemaIndex: 0
},
{
content: '数字理想前端面试',
address: '22-1会议室',
department: '数字理想',
time: '09:30 AM -12:00 AM',
index: 3,
schemaIndex: 0
},
{
content: '销售总监面试',
address: '22-1会议室',
department: '总经办',
time: '09:30 AM -12:00 AM',
index: 4,
schemaIndex: 0
}
]
}
export default {
companyLogo: {
value: 'http://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/template-culture/logo1.png'
},
companyName: {
value: '迈动互联(北京)信息科技有限公司'
},
companyNameEn: {
value: 'MAXROCKY'
},
welcomeWordZh: {
value: '欢迎龙湖信息中心领导参观指导'
},
welcomeWordEn: {
value: 'WELCOME'
},
imgurl: {
value: require('../../../assets/code.png')
}
}
...@@ -94,7 +94,7 @@ export default { ...@@ -94,7 +94,7 @@ export default {
}, },
beforeDestroy () {}, beforeDestroy () {},
mounted () { mounted () {
/* Scene.EventBus.on("leaveBefore", e => { Scene.EventBus.on("leaveBefore", e => {
console.log("leaveBefore"); console.log("leaveBefore");
this.$refs["child" + this.sliderActiveIndex][0].leave().then(() => { this.$refs["child" + this.sliderActiveIndex][0].leave().then(() => {
console.log("leaveBefore then"); console.log("leaveBefore then");
...@@ -108,7 +108,7 @@ export default { ...@@ -108,7 +108,7 @@ export default {
}); });
// this.$refs['child'][0].enter().then(() => { // this.$refs['child'][0].enter().then(() => {
// }) */ // })
}, },
created () { created () {
var vm = this var vm = this
......
import data from './schemaData.js' import data from './schemaData.js'
import editMethod from './editMethod.js' import editMethod from './editMethod.js'
import requireIcons from '@/icons/requireIcons' import requireIcons from '@/icons/requireIcons'
// console.log(JSON.stringify(data)) console.log(JSON.stringify(data))
export default { export default {
data: function () { data: function () {
......
<template> <template>
<div class="container"> <div class="container">
<img class="texture" :src="getValue('imgurl')" /> <img class="texture" :src="getValue('texture')" />
<img class="mlxg" ref='mlxg' src="../../../assets/mlxg.png" /> <img class="mlxg" ref='mlxg' :src="getValue('mlxg')" />
<img class="picture" fe src="../../../assets/picture.png" /> <img class="picture" :src="getValue('picture')" />
<img class="decorate" ref="decorate" src="../../../assets/decorate.png" /> <img class="decorate" ref="decorate" :src="getValue('decorate')" />
<img class="left-right" src="../../../assets/Left-right.png" /> <img class="left-right" :src="getValue('leftright')" />
<img class="code" src="../../../assets/code.png" /> <img class="code" :src="getValue('code')" />
<img class="price" src="../../../assets/price.png" /> <img class="price" :src="getValue('price')" />
<img class="line" src="../../../assets/line.png" /> <img class="line" :src="getValue('line')" />
</div> </div>
</template> </template>
<script> <script>
import methods from '../methods' import methods from '../methods'
import anime from 'animejs/lib/anime.es.js' import anime from 'animejs/lib/anime.es.js'
import Scene from '@/framework/utils/sence' import Scene from '@/framework/utils/sence'
export default { export default {
name: 'welcome', name: 'retail',
props: ['schemaData', 'page', 'isEditMode', 'cancelEdit'], props: ['schemaData', 'page', 'isEditMode', 'cancelEdit'],
mixins: [methods], mixins: [methods],
components: { components: {},
}, created() {
created () { console.log(this.schemaData)
console.log(this.schemaData) },
}, methods: {
methods: {
leave () { leave() {
console.log('leave') console.log('leave')
// anime({ // anime({
// targets: "#cd-image-1 circle", // targets: "#cd-image-1 circle",
// duration: 3000, // duration: 3000,
// r: [2920, 0], // r: [2920, 0],
// easing: "linear" // easing: "linear"
// }); // });
var PromiseAll = [ var PromiseAll = [
anime({ anime({
targets: '#cd-image-1 circle', targets: '#cd-image-1 circle',
duration: 2000, duration: 2000,
r: [2920, 0], r: [2920, 0],
easing: 'easeOutQuad' easing: 'easeOutQuad'
}).finished, }).finished,
anime({ anime({
targets: '#mask-img-1 circle', targets: '#mask-img-1 circle',
duration: 2000, duration: 2000,
r: [2920, 0], r: [2920, 0],
easing: 'easeOutQuad' easing: 'easeOutQuad'
}).finished }).finished
] ]
var enPromise = Promise.all(PromiseAll) var enPromise = Promise.all(PromiseAll)
return enPromise return enPromise
}, },
enter () { enter() {
console.log('enter anime') console.log('enter anime')
var PromiseAll = [ var PromiseAll = [
anime({ anime({
targets: this.$refs['mlxg'], targets: this.$refs['mlxg'],
translateX: 0, translateX: 0,
opacity: 1, opacity: 1,
duration: 2000 duration: 2000
}).finished, }).finished,
anime({ anime({
targets: this.$refs['title'], targets: this.$refs['title'],
translateX: 0, translateX: 0,
opacity: 1, opacity: 1,
delay: 1000, delay: 1000,
duration: 500, duration: 500,
easing: 'easeInOutQuad' easing: 'easeInOutQuad'
}).finished, }).finished,
anime({ anime({
targets: this.$refs['decorate'], targets: this.$refs['decorate'],
translateX: 0, translateX: 0,
opacity: 1, opacity: 1,
duration: 1000, duration: 1000,
delay: 1200, delay: 1200,
easing: 'easeInOutQuad' easing: 'easeInOutQuad'
}).finished, }).finished,
anime({ anime({
targets: this.$refs['surrounding'], targets: this.$refs['surrounding'],
translateX: 0, translateX: 0,
opacity: 1, opacity: 1,
duration: 1000, duration: 1000,
delay: 1800, delay: 1800,
easing: 'easeInOutQuad' easing: 'easeInOutQuad'
}).finished, }).finished,
anime({ anime({
targets: this.$refs['feature-list'], targets: this.$refs['feature-list'],
translateX: 0, translateX: 0,
opacity: 1, opacity: 1,
duration: 1000, duration: 1000,
delay: 2100, delay: 2100,
easing: 'easeInOutQuad' easing: 'easeInOutQuad'
}).finished, }).finished,
anime({ anime({
targets: '.high-light', targets: '.high-light',
translateX: 0, translateX: 0,
opacity: 1, opacity: 1,
duration: 1000, duration: 1000,
// delay: anime.stagger(1000), // delay: anime.stagger(1000),
delay: 1500, delay: 1500,
easing: 'easeInOutQuad' easing: 'easeInOutQuad'
}).finished }).finished
] ]
Promise.all(PromiseAll).then(() => { Promise.all(PromiseAll).then(() => {
this.enterAfter() this.enterAfter()
}) })
return Promise.all(PromiseAll) return Promise.all(PromiseAll)
}, },
enterBefore () { enterBefore() {
console.log('enterBefore') console.log('enterBefore')
anime({ anime({
targets: '#cd-image-1 circle', targets: '#cd-image-1 circle',
duration: 0, duration: 0,
r: [0, 2920] r: [0, 2920]
}) })
anime({ anime({
targets: this.$refs['mlxg'], targets: this.$refs['mlxg'],
translateX: -1500, translateX: -1500,
opacity: 0, opacity: 0,
duration: 0 duration: 0
}) })
anime({ anime({
targets: this.$refs['decorate'], targets: this.$refs['decorate'],
translateX: 2000, translateX: 2000,
opacity: 0, opacity: 0,
duration: 0 duration: 0
}) })
anime({ anime({
targets: this.$refs['price'], targets: this.$refs['price'],
translateX: 2000, translateX: 2000,
opacity: 0, opacity: 0,
duration: 0 duration: 0
}) })
anime({ anime({
targets: this.$refs['surrounding'], targets: this.$refs['surrounding'],
translateX: 2000, translateX: 2000,
opacity: 0, opacity: 0,
duration: 0 duration: 0
}) })
anime({ anime({
targets: this.$refs['feature-list'], targets: this.$refs['feature-list'],
translateX: 2000, translateX: 2000,
opacity: 0, opacity: 0,
duration: 0 duration: 0
}) })
anime({ anime({
targets: '.high-light', targets: '.high-light',
translateX: 1000, translateX: 1000,
opacity: 0, opacity: 0,
duration: 0 duration: 0
}) })
// setTimeout(() => { // setTimeout(() => {
// this.enter(); // this.enter();
// }, 1000); // }, 1000);
}, },
enterAfter () { enterAfter() {
this.timer = setTimeout(() => { this.timer = setTimeout(() => {
Scene.leaveBefore() Scene.leaveBefore()
clearTimeout(this.timer) clearTimeout(this.timer)
}, 10000) }, 10000)
} }
}, },
mounted () { mounted() {
console.log('mounted') console.log('mounted')
this.enterBefore() this.enterBefore()
}, },
data () { data() {
return { return {
currentIndex: '' currentIndex: ''
} }
} }
} }
</script> </script>
<style> <style>
.container{background: #FCD333;width: 1080px;height: 1920px;} .container {
.texture{display: block;width: 100%;height: 100%;} background: #FCD333;
.mlxg{width: 800px;height: 800px;display: block;position: absolute;top: 40px;left: 50%;margin-left: -440px;} width: 1080px;
.picture{width: 88%;height: 900px;display: block;position: absolute;top: 800px;left: 50%;margin-left: -44%;} height: 1920px;
.decorate{width: 30%;height: 450px;position: absolute;right: 0;display: block;top: 650px;} }
.left-right{width: 100%;height: 500px;display: block;position: absolute;top: 1000px;}
.code{width: 200px;height: 200px;display: block;position: absolute;bottom: 80px;left: 6%;} .texture {
.price{width: 300px;height: 200px;display: block;position: absolute;bottom: 80px;right: 6%;} display: block;
.line{width: 90%;height: 5px;display: block;position: absolute;bottom: 45px;left: 5%;} width: 100%;
</style> height: 100%;
}
.mlxg {
width: 800px;
height: 800px;
display: block;
position: absolute;
top: 40px;
left: 50%;
margin-left: -440px;
}
.picture {
width: 88%;
height: 900px;
display: block;
position: absolute;
top: 800px;
left: 50%;
margin-left: -44%;
}
.decorate {
width: 30%;
height: 450px;
position: absolute;
right: 0;
display: block;
top: 650px;
}
.left-right {
width: 100%;
height: 500px;
display: block;
position: absolute;
top: 1000px;
}
.code {
width: 200px;
height: 200px;
display: block;
position: absolute;
bottom: 80px;
left: 6%;
}
.price {
width: 300px;
height: 200px;
display: block;
position: absolute;
bottom: 80px;
right: 6%;
}
.line {
width: 90%;
height: 5px;
display: block;
position: absolute;
bottom: 45px;
left: 5%;
}
</style>
\ No newline at end of file
<template> <template>
<div class="container2"> <div class="container2">
<img class="titleitem" src="../../../assets/Title item.png" /> <img class="titleitem" :src="getValue('titleitem')" />
<img class="newsummer" ref='newsummer' src="../../../assets/New Summer.png" /> <img class="newsummer" ref='newsummer' :src="getValue('newsummer')" />
<img class="textleft" src="../../../assets/textlleft.png" /> <img class="textleft" :src="getValue('textleft')" />
<img class="textright" src="../../../assets/textright.png" /> <img class="textright" :src="getValue('textright')" />
<img class="drinkswave" src="../../../assets/Drinks Wave.png" /> <img class="drinkswave" ref="drinkswave" :src="getValue('drinkswave')" />
<img class="bean" src="../../../assets/bean.png" /> <img class="bean" :src="getValue('bean')" />
<img class="tableitem" ref="tableitem" src="../../../assets/table item.png" /> <img class="tableitem" ref="tableitem" :src="getValue('tableitem')" />
</div> </div>
</template> </template>
...@@ -15,7 +15,7 @@ import methods from '../methods' ...@@ -15,7 +15,7 @@ import methods from '../methods'
import anime from 'animejs/lib/anime.es.js' import anime from 'animejs/lib/anime.es.js'
import Scene from '@/framework/utils/sence' import Scene from '@/framework/utils/sence'
export default { export default {
name: 'welcome', name: 'retail',
props: ['schemaData', 'page', 'isEditMode', 'cancelEdit'], props: ['schemaData', 'page', 'isEditMode', 'cancelEdit'],
mixins: [methods], mixins: [methods],
components: { components: {
...@@ -67,7 +67,7 @@ export default { ...@@ -67,7 +67,7 @@ export default {
easing: 'easeInOutQuad' easing: 'easeInOutQuad'
}).finished, }).finished,
anime({ anime({
targets: this.$refs['decorate'], targets: this.$refs['drinkswave'],
translateX: 0, translateX: 0,
opacity: 1, opacity: 1,
duration: 1000, duration: 1000,
...@@ -126,7 +126,7 @@ export default { ...@@ -126,7 +126,7 @@ export default {
duration: 0 duration: 0
}) })
anime({ anime({
targets: this.$refs['price'], targets: this.$refs['drinkswave'],
translateX: 2000, translateX: 2000,
opacity: 0, opacity: 0,
duration: 0 duration: 0
...@@ -172,7 +172,7 @@ export default { ...@@ -172,7 +172,7 @@ export default {
} }
</script> </script>
<style> <style>
.container2{background: url(../../../assets/background.png) no-repeat;background-size: 100% 100%;width: 100%;height: 100%;} .container2{background: url(http://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/background.jpg) no-repeat;background-size: 100% 100%;width: 100%;height: 100%;}
.titleitem{width: 80%;height: 63%;display: block;position: absolute;top: 60px;left: 50%;margin-left: -40%;} .titleitem{width: 80%;height: 63%;display: block;position: absolute;top: 60px;left: 50%;margin-left: -40%;}
.newsummer{width: 546px;height: 470px;display: block;position: absolute;top: 106px;margin-left: 156px;} .newsummer{width: 546px;height: 470px;display: block;position: absolute;top: 106px;margin-left: 156px;}
.textleft{width: 50px;height: 420px;display: block;position: absolute;top: 700px;margin-left: 80px;} .textleft{width: 50px;height: 420px;display: block;position: absolute;top: 700px;margin-left: 80px;}
......
...@@ -9,21 +9,30 @@ export default { ...@@ -9,21 +9,30 @@ export default {
pageList: [ pageList: [
{ {
name: '零售1', name: '零售1',
<<<<<<< HEAD
thumb: thumb:
'http://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/template-culture/thumb1.jpg', 'http://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/template-culture/thumb1.jpg',
=======
thumb: 'http://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/retailone.jpg',
>>>>>>> 7d55b422b8cb91ab3d6ad025c67ddeacc8e73281
component: 'retail1', component: 'retail1',
defaultData: defaultData.welcome, defaultData: defaultData.retail,
schemaData: defaultData.welcome, schemaData: defaultData.retail,
itemList: itemList.welcome itemList: itemList.retail
}, },
{ {
<<<<<<< HEAD
name: '零售1', name: '零售1',
thumb: thumb:
'http://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/template-culture/thumb1.jpg', 'http://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/template-culture/thumb1.jpg',
=======
name: '零售2',
thumb: 'http://visual-clouds.oss-cn-beijing.aliyuncs.com/resource/retail/retailtwo.jpg',
>>>>>>> 7d55b422b8cb91ab3d6ad025c67ddeacc8e73281
component: 'retail2', component: 'retail2',
defaultData: defaultData.welcome, defaultData: defaultData.retail,
schemaData: defaultData.welcome, schemaData: defaultData.retail,
itemList: itemList.welcome itemList: itemList.retail
} }
] ]
} }
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