chenkainan 5 months ago
parent
commit
8011f80aab
  1. 5
      App.vue
  2. 13
      main.js
  3. 12
      pages.json
  4. 112
      pages/index/dongLing.vue
  5. 98
      pages/index/shanJuan.vue
  6. BIN
      static/3/0.png
  7. BIN
      static/3/0_content.png
  8. BIN
      static/3/1.png
  9. BIN
      static/3/1_content.png
  10. BIN
      static/3/2.png
  11. BIN
      static/3/2_content.png
  12. BIN
      static/3/3.png
  13. BIN
      static/3/3_content.png
  14. BIN
      static/3/4.png
  15. BIN
      static/3/4_content.png
  16. BIN
      static/3/5.png
  17. BIN
      static/3/5_content.png
  18. BIN
      static/3/6.png
  19. BIN
      static/3/6_content.png
  20. BIN
      static/3/concat.png
  21. BIN
      static/3/head_0.png
  22. BIN
      static/3/head_0_active.png
  23. BIN
      static/3/head_1.png
  24. BIN
      static/3/head_1_active.png
  25. BIN
      static/3/head_2.png
  26. BIN
      static/3/head_2_active.png
  27. BIN
      static/3/head_3.png
  28. BIN
      static/3/head_3_active.png
  29. BIN
      static/3/head_4.png
  30. BIN
      static/3/head_4_active.png
  31. BIN
      static/3/head_5.png
  32. BIN
      static/3/head_5_active.png
  33. BIN
      static/3/head_6.png
  34. BIN
      static/3/head_6_active.png
  35. BIN
      static/3/head_title.png
  36. BIN
      static/4/0.png
  37. BIN
      static/4/0_card.png
  38. BIN
      static/4/1.png
  39. BIN
      static/4/1_card.png
  40. BIN
      static/4/card.png
  41. BIN
      static/4/head_title.png
  42. BIN
      static/4/p0.png
  43. BIN
      static/4/p0_active.png
  44. BIN
      static/4/p1.png
  45. BIN
      static/4/p1_active.png
  46. BIN
      static/back.png

5
App.vue

@ -14,4 +14,9 @@
<style> <style>
/*每个页面公共css */ /*每个页面公共css */
.back-icon{
width: 27rpx;
height: 50rpx;
margin: 20rpx auto 0 49rpx;
}
</style> </style>

13
main.js

@ -5,6 +5,19 @@ import Vue from 'vue'
import './uni.promisify.adaptor' import './uni.promisify.adaptor'
Vue.config.productionTip = false Vue.config.productionTip = false
App.mpType = 'app' App.mpType = 'app'
Vue.prototype.goBack = function () {
getCurrentPages().length > 1 ? uni.navigateBack({}) : uni.navigateBack({delta:999})
}
Vue.prototype.concat = function () {
// let img = require("static/4/0_card.png")
// uni.previewImage({
// urls: [img],
// })
}
const app = new Vue({ const app = new Vue({
...App ...App
}) })

12
pages.json

@ -13,6 +13,18 @@
"navigationBarTitleText": "uni-app", "navigationBarTitleText": "uni-app",
"navigationStyle": "custom" "navigationStyle": "custom"
} }
},
{
"path": "pages/index/dongLing",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "pages/index/shanJuan",
"style": {
"navigationStyle": "custom"
}
} }
], ],
"globalStyle": { "globalStyle": {

112
pages/index/dongLing.vue

@ -0,0 +1,112 @@
<template>
<view class="bg">
<image class="back-icon" src="/static/back.png" @click="goBack()"></image>
<view class="content">
<image class="head-title" src="/static/4/head_title.png">
<view class="line"></view>
<view class="head-img-container">
<image :class="['head-img','head-img-'+i]" @click="changeCurrent(i)"
v-for="(item,i) in 2" :key="i" :src="currentIndex==i?`/static/4/p${i}_active.png`:`/static/4/p${i}.png`" >
</view>
<view class="line" style="background: #FCF1E6;margin-top: 24rpx;"></view>
</view>
<view style="width: 100%;position: relative;">
<image class="card" src="/static/4/card.png" @click="viewCard()"></image>
<image style="width: 100%;margin-top: 32rpx;" :src="`/static/4/${currentIndex}.png`" mode="widthFix"></image>
<image class="concat" src="/static/3/concat.png" @click="concat()"></image>
<view style="height: 150rpx;width: 100%;"></view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
headImgs: [],
currentIndex: 0
}
},
methods: {
changeCurrent (i) {
this.currentIndex = i
},
viewCard () {
let img0 = require("static/4/0_card.png")
let img1 = require("static/4/1_card.png")
let urls = [img0]
if (this.currentIndex == 1) {
urls = [img1]
}
uni.previewImage({
urls: urls,
fail: (res)=>{
console.log(res)
}
})
},
},
}
</script>
<style lang="scss" scoped>
*{
box-sizing: border-box;
}
.bg{
width: 100%;
min-height: 100vh;
position: relative;
background: black;
}
.head-title{
width: 642rpx;
height: 74rpx;
}
.content{
width: 100%;
padding: 60rpx 60rpx 0;
}
.line{
width: 100%;
height: 2rpx;
background: #FCF1E6;
margin: 32rpx 0;
}
.head-img-container{
display: flex;
justify-content:space-between;
flex-wrap: wrap;
padding: 0 50rpx;
.head-img{
width: 178rpx;
height: 260rpx;
margin: 0 20rpx;
margin-bottom: 32rpx;
}
}
.concat{
width: 569rpx;
height: 74rpx;
display: block;
margin: 84rpx auto 0;
}
.card{
width: 117rpx;
height: 116rpx;
position: absolute;
top: 434rpx;
left: 59rpx;
z-index: 20;
}
</style>

98
pages/index/shanJuan.vue

@ -0,0 +1,98 @@
<template>
<view class="bg">
<image class="back-icon" src="/static/back.png" @click="goBack()"></image>
<view class="content">
<image class="head-title" src="/static/3/head_title.png">
<view class="line"></view>
<view class="head-img-container">
<image :class="['head-img','head-img-'+i]" @click="changeCurrent(i)"
v-for="(item,i) in 7" :key="i" :src="currentIndex==i?`/static/3/head_${i}_active.png`:`/static/3/head_${i}.png`" >
</view>
<view class="line" style="background: #FCF1E6;margin-top: 24rpx;"></view>
<image style="width: 100%;margin-top: 32rpx;" :src="`/static/3/${currentIndex}.png`" mode="widthFix"></image>
<image style="width: 100%;margin-top: 32rpx;" :src="`/static/3/${currentIndex}_content.png`" mode="widthFix"></image>
<image class="concat" src="/static/3/concat.png" @click="concat()"></image>
<view style="height: 450rpx;width: 100%;"></view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
headImgs: [],
currentIndex: 0
}
},
methods: {
changeCurrent (i) {
this.currentIndex = i
}
},
}
</script>
<style lang="scss" scoped>
*{
box-sizing: border-box;
}
.bg{
width: 100%;
min-height: 100vh;
position: relative;
background: black;
}
.head-title{
width: 329rpx;
height: 74rpx;
}
.content{
width: 100%;
padding: 60rpx;
}
.line{
width: 100%;
height: 2rpx;
background: #FCF1E6;
margin: 32rpx 0;
}
.head-img-container{
display: flex;
justify-content:space-between;
flex-wrap: wrap;
padding: 0 10rpx;
.head-img{
width: 106rpx;
height: 106rpx;
margin: 0 20rpx;
margin-bottom: 32rpx;
}
.head-img.head-img-0{
margin-left: 0;
}
.head-img.head-img-3{
margin-right: 0;
}
.head-img.head-img-4{
margin-left: 76rpx;
}
.head-img.head-img-6{
margin-right: 76rpx;
}
}
.concat{
width: 569rpx;
height: 74rpx;
display: block;
margin: 84rpx auto 0;
}
</style>

BIN
static/3/0.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 586 KiB

BIN
static/3/0_content.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 361 KiB

BIN
static/3/1.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 693 KiB

BIN
static/3/1_content.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 247 KiB

BIN
static/3/2.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 624 KiB

BIN
static/3/2_content.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 274 KiB

BIN
static/3/3.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 545 KiB

BIN
static/3/3_content.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 247 KiB

BIN
static/3/4.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 524 KiB

BIN
static/3/4_content.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 146 KiB

BIN
static/3/5.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 502 KiB

BIN
static/3/5_content.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 99 KiB

BIN
static/3/6.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 598 KiB

BIN
static/3/6_content.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

BIN
static/3/concat.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.6 KiB

BIN
static/3/head_0.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
static/3/head_0_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
static/3/head_1.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
static/3/head_1_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

BIN
static/3/head_2.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

BIN
static/3/head_2_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

BIN
static/3/head_3.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
static/3/head_3_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
static/3/head_4.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
static/3/head_4_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

BIN
static/3/head_5.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
static/3/head_5_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

BIN
static/3/head_6.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
static/3/head_6_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

BIN
static/3/head_title.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

BIN
static/4/0.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 618 KiB

BIN
static/4/0_card.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 496 KiB

BIN
static/4/1.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 538 KiB

BIN
static/4/1_card.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 424 KiB

BIN
static/4/card.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

BIN
static/4/head_title.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

BIN
static/4/p0.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

BIN
static/4/p0_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 45 KiB

BIN
static/4/p1.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 37 KiB

BIN
static/4/p1_active.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 53 KiB

BIN
static/back.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 745 B

Loading…
Cancel
Save