9 changed files with 267 additions and 11 deletions
@ -0,0 +1,65 @@
|
||||
<template> |
||||
<view> |
||||
<view class="header"> |
||||
<cu-custom :isBack="true" :isCenter="true"> |
||||
<block slot="backText"> |
||||
<view class="backImg"> |
||||
<image src="@/static/images/back-btn.png" mode="" ></image> |
||||
</view> |
||||
</block> |
||||
<block slot="content"> |
||||
<view class="tab-title">关于我们</view> |
||||
</block> |
||||
</cu-custom> |
||||
</view> |
||||
<view class=""> |
||||
<image class="img" src="../../../static/images/guanyu.jpg" mode="widthFix"></image> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import Tabbar from '@/components/Tabbar'; |
||||
export default { |
||||
|
||||
data() { |
||||
return { |
||||
|
||||
}; |
||||
|
||||
}, |
||||
|
||||
methods: { |
||||
|
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="less" scoped> |
||||
.header { |
||||
.tab-title { |
||||
font-size: 32rpx; |
||||
font-family: PingFang SC; |
||||
font-weight: 600; |
||||
color: #2DB5AE; |
||||
line-height: 42rpx; |
||||
} |
||||
|
||||
.backImg { |
||||
width: 88rpx; |
||||
height: 62rpx; |
||||
padding-left: 26rpx; |
||||
|
||||
image { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.img{ |
||||
width: 100%; |
||||
// height: 100%; |
||||
} |
||||
|
||||
</style> |
||||
@ -0,0 +1,177 @@
|
||||
<template> |
||||
<view> |
||||
<view class="header"> |
||||
<cu-custom :isBack="true" :isCenter="true"> |
||||
<block slot="backText"> |
||||
<view class="backImg"> |
||||
<image src="@/static/images/back-btn.png" mode=""></image> |
||||
</view> |
||||
</block> |
||||
<block slot="content"> |
||||
<view class="tab-title">常见问题</view> |
||||
</block> |
||||
</cu-custom> |
||||
</view> |
||||
<view class="problem-box" v-for="(item,index) in problemList" :key="index"> |
||||
<view class="problem-item acea-row row-between row-middle" @click="tapSwitch(index)"> |
||||
<view class="text-box line2"> |
||||
Q{{index+1}}：{{item.title}} |
||||
</view> |
||||
<image class="img" :src="`../../../static/images/picker-${number==index?'up':'down'}.png`" mode=""> |
||||
</image> |
||||
</view> |
||||
|
||||
<view class="problem-list" v-if="index==number"> |
||||
<view class="item" v-for="(c,i) in item.chlidren" :key="i"> |
||||
{{c}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<!-- <Tabbar :pagePath="pagePath"></Tabbar> --> |
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import Tabbar from '@/components/Tabbar'; |
||||
export default { |
||||
components: { |
||||
Tabbar, |
||||
}, |
||||
data() { |
||||
return { |
||||
number: 0, |
||||
// problemList:[ |
||||
// { |
||||
// title:"可以在哪里买门票可以在哪里买门可以在哪里买门票可以在哪里买门可以在哪里买门票可以在哪里买门可以在哪里买门票可以在哪里买门", |
||||
// chlidren:[ |
||||
// '问题一: 可以在哪里买门票可以在哪里买门可以在哪里买门票可以在哪里买门可以在哪里买门票可以在哪里买门可以在哪里买门票可以在哪里买门', |
||||
// '问题二', |
||||
// '问题三' |
||||
// ] |
||||
// }, |
||||
// { |
||||
// title:"可以在哪里买门票可以在哪里买门", |
||||
// chlidren:[ |
||||
// '问题一', |
||||
// '问题二', |
||||
// '问题三' |
||||
// ] |
||||
// }, |
||||
// { |
||||
// title:"可以在哪里买门票可以在哪里买门", |
||||
// chlidren:[ |
||||
// '问题一', |
||||
// '问题二', |
||||
// '问题三' |
||||
// ] |
||||
// } |
||||
// ], |
||||
problemList: [{ |
||||
title: "可以在哪里买门票可以在哪里买门可以在哪里买门票可以在哪里买门可以在哪里买门票可以在哪里买门可以在哪里买门票可以在哪里买门", |
||||
chlidren: '方案一: 可以在哪里买门票可以在哪里买门可;方案二: 以在哪里买门票可以在哪里买门可以在哪里买门;方案三: 票可以在哪里买门可以在哪里买门票可以在哪里买门', |
||||
|
||||
|
||||
}, |
||||
{ |
||||
title: "可以在哪里买门票可以在哪里买门", |
||||
chlidren: '方案一: 可以在哪里买门票可以在哪里买门可;方案二: 以在哪里买门票可以在哪里买门可以在哪里买门;方案三: 票可以在哪里买门可以在哪里买门票可以在哪里买门', |
||||
}, |
||||
{ |
||||
title: "可以在哪里买门票可以在哪里买门", |
||||
chlidren: '方案一: 可以在哪里买门票可以在哪里买门可;方案二: 以在哪里买门票可以在哪里买门可以在哪里买门;方案三: 票可以在哪里买门可以在哪里买门票可以在哪里买门', |
||||
} |
||||
] |
||||
|
||||
|
||||
}; |
||||
|
||||
}, |
||||
onLoad() { |
||||
|
||||
// uni.hideTabBar(); |
||||
// let pages = getCurrentPages(); |
||||
// this.pagePath = '/' + pages[pages.length - 1].route; |
||||
this.problemList.forEach(item => { |
||||
item.chlidren = item.chlidren.split(';') |
||||
console.log(item, '---------------'); |
||||
}) |
||||
console.log(this.problemList, '============='); |
||||
}, |
||||
|
||||
methods: { |
||||
|
||||
tapSwitch(index) { |
||||
|
||||
if (this.number === index) { |
||||
this.number = -1 |
||||
return |
||||
} |
||||
this.number = index |
||||
|
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style lang="less" scoped> |
||||
.header { |
||||
.tab-title { |
||||
font-size: 32rpx; |
||||
font-family: PingFang SC; |
||||
font-weight: 600; |
||||
color: #2DB5AE; |
||||
line-height: 42rpx; |
||||
} |
||||
|
||||
.backImg { |
||||
width: 88rpx; |
||||
height: 62rpx; |
||||
padding-left: 26rpx; |
||||
|
||||
image { |
||||
width: 100%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.problem-box { |
||||
margin: 30rpx; |
||||
padding: 30rpx 30rpx 0 30rpx; |
||||
background-color: white; |
||||
border-radius: 16rpx; |
||||
|
||||
.problem-item { |
||||
flex-wrap: nowrap; |
||||
|
||||
.text-box { |
||||
width: 75%; |
||||
font-size: 30rpx; |
||||
} |
||||
|
||||
padding-bottom: 30rpx; |
||||
|
||||
.img { |
||||
width: 30rpx; |
||||
height: 20rpx; |
||||
} |
||||
|
||||
|
||||
} |
||||
|
||||
.problem-list { |
||||
border-top: 1rpx solid rgb(240, 240, 240); |
||||
|
||||
.item { |
||||
margin-top: 20rpx; |
||||
font-size: 24rpx; |
||||
color: #999; |
||||
} |
||||
} |
||||
|
||||
.problem-list:last-child { |
||||
padding-bottom: 30rpx; |
||||
} |
||||
} |
||||
</style> |
||||
|
After Width: | Height: | Size: 374 KiB |
|
After Width: | Height: | Size: 420 B |
|
After Width: | Height: | Size: 391 B |
Loading…
Reference in new issue