乡村相册

This commit is contained in:
yanran200730
2022-05-17 14:58:10 +08:00
parent 905e487269
commit 8e3113f00d
11 changed files with 941 additions and 224 deletions

View File

@@ -0,0 +1,156 @@
<template>
<div class="AttendanceFiexdTime">
<div class="form-group">
<div class="form-group__item">
<div class="left">
<switch color="#1088F9" checked />
<div class="left-right">
<h2>大标题</h2>
<p>打卡</p>
</div>
</div>
<div class="right">
<u-icon name="arrow-right" color="#E1E2E3" size="#E1E2E3"></u-icon>
</div>
</div>
<div class="form-group__item">
<div class="left">
<switch color="#1088F9" disabled checked />
<div class="left-right">
<h2>时间</h2>
<p>2022-01-03</p>
</div>
</div>
<div class="right">
<u-icon name="arrow-right" color="#E1E2E3" size="#E1E2E3"></u-icon>
</div>
</div>
<div class="form-group__item">
<div class="left">
<switch color="#1088F9" checked />
<div class="left-right">
<h2>地点</h2>
<p>绿地蓝海</p>
</div>
</div>
<div class="right">
<u-icon name="arrow-right" color="#E1E2E3" size="#E1E2E3"></u-icon>
</div>
</div>
<div class="form-group__item">
<div class="left">
<switch color="#1088F9" checked />
<div class="left-right">
<h2>拍摄人</h2>
<p>陶白白</p>
</div>
</div>
<div class="right">
<u-icon name="arrow-right" color="#E1E2E3" size="#E1E2E3"></u-icon>
</div>
</div>
<div class="form-group__item">
<div class="left">
<switch color="#1088F9" checked />
<div class="left-right">
<h2>天气</h2>
<p>雨夹雪 北风3</p>
</div>
</div>
<div class="right">
<u-icon name="arrow-right" color="#E1E2E3" size="#E1E2E3"></u-icon>
</div>
</div>
</div>
<div class="form-btn" hover-class="text-hover">保存</div>
</div>
</template>
<script>
export default {
data () {
return {
}
},
onLoad () {
},
methods: {
linkTo (url) {
uni.navigateTo({
url
})
}
}
}
</script>
<style lang="scss" scoped>
.AttendanceFiexdTime {
padding-bottom: 130px;
* {
line-height: 1;
box-sizing: border-box;
}
.form-btn {
position: fixed;
bottom: 0;
left: 0;
z-index: 1;
width: 100%;
height: 112px;
line-height: 112px;
text-align: center;
color: #fff;
font-size: 32px;
background: #1365DD;
&:active {
opacity: 0.8;
}
}
.form-group {
margin-bottom: 16px;
padding: 0 32px;
background: #fff;
.form-group__item {
display: flex;
align-items: center;
justify-content: space-between;
height: 160px;
font-size: 32px;
color: #333333;
border-bottom: 1px solid #DDDDDD;
&:last-child {
border: none;
}
.left {
display: flex;
align-items: center;
.left-right {
margin-left: 36px;
h2 {
margin-bottom: 12px;
color: #999999;
font-size: 28px;
}
p {
font-size: 34px;
color: #333;
}
}
}
}
}
}
</style>