173 lines
3.3 KiB
Vue
173 lines
3.3 KiB
Vue
<template>
|
|
<view class="content">
|
|
<view class="header"></view>
|
|
<table border="0" class="mian-table">
|
|
<tr class="mian-table-top">
|
|
<td>序号</td>
|
|
<td>开始日期</td>
|
|
<td>结束日期</td>
|
|
<td>金额</td>
|
|
<td>操作</td>
|
|
</tr>
|
|
<tr class="table-list">
|
|
<td>01</td>
|
|
<td>2024.01.01</td>
|
|
<td>2024.01.01</td>
|
|
<td>￥653.40</td>
|
|
<td class="mian-foot-btns" @click="detailTd">
|
|
详情
|
|
</td>
|
|
</tr>
|
|
|
|
|
|
</table>
|
|
<!-- <view class="mian">
|
|
<view class="mian-nav">
|
|
<view class="mian-nav-list xuhao">序号</view>
|
|
<view class="mian-nav-list riqi">开始日期</view>
|
|
<view class="mian-nav-list riqi">结束日期</view>
|
|
<view class="mian-nav-list jie">金额</view>
|
|
<view class="mian-nav-list caozuo">操作</view>
|
|
</view>
|
|
<view class="mian-foot">
|
|
<view class="mian-foot-view">
|
|
<view class="mian-foot-list xuhao">01</view>
|
|
<view class="mian-foot-list riqi">2024.01.01</view>
|
|
<view class="mian-foot-list riqi">2024.01.01</view>
|
|
<view class="mian-foot-list jie">￥653.40</view>
|
|
<view class="mian-foot-btn caozuo">详情</view>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default{
|
|
data(){
|
|
return{}
|
|
},
|
|
methods:{
|
|
detailTd(){//详情 跳页
|
|
uni.navigateTo({
|
|
url:'/pages/index/revenueDetails'
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.mian-foot-btns{
|
|
font-weight: 400;
|
|
font-size: 25rpx;
|
|
color: #11957C;
|
|
}
|
|
td{
|
|
text-align: center;
|
|
}
|
|
.table-list td{
|
|
border-bottom: 1px solid #E5E5E5;
|
|
}
|
|
.table-list{
|
|
height: 40px;
|
|
}
|
|
.mian-table-top{
|
|
height: 49rpx;
|
|
background: #EFEFEF;
|
|
border-radius: 14rpx;
|
|
border: 1px solid #EFEFEF;
|
|
opacity: 0.62;
|
|
}
|
|
.mian-table{
|
|
width: 95%;
|
|
background-color: #fff;
|
|
border-radius: 24rpx;
|
|
padding: 10px;
|
|
border-spacing: inherit;
|
|
position: absolute;
|
|
top: 0;
|
|
margin-top: 30px;
|
|
}
|
|
.xuhao{
|
|
width: 10%;
|
|
}
|
|
.mian-nav-list{
|
|
height: 100%;
|
|
text-align: center;
|
|
font-weight: 400;
|
|
font-size: 26rpx;
|
|
color: #333333;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
.mian-foot-btn{
|
|
width: 83rpx;
|
|
height: 40rpx;
|
|
line-height: 40rpx;
|
|
text-align: center;
|
|
font-weight: 400;
|
|
font-size: 25rpx;
|
|
color: #11957C;
|
|
border-radius: 14rpx;
|
|
border: 1px solid #007B6A;
|
|
}
|
|
.mian-foot-list{
|
|
width: 25%;
|
|
height: 100%;
|
|
text-align: center;
|
|
font-weight: 400;
|
|
font-size: 25rpx;
|
|
color: #666666;
|
|
}
|
|
.mian-foot-view{
|
|
width: 100%;
|
|
border-bottom: 1px solid #E5E5E5;
|
|
display: flex;
|
|
padding: 10px 0px;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
.mian-foot{
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.mian-nav{
|
|
width: 100%;
|
|
height: 49rpx;
|
|
background-color: rgba(239, 239, 239, 0.62);
|
|
border-radius: 14rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
.mian{
|
|
width: 95%;
|
|
height: 967rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 24rpx;
|
|
overflow-y: scroll;
|
|
padding: 10px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.header{
|
|
width: 100%;
|
|
height: 228rpx;
|
|
background: linear-gradient(-36deg, #11957C, #20A98F, #019C88, #029D88);
|
|
}
|
|
.content{
|
|
width: 100%;
|
|
height: 100vh;
|
|
background-color: #f7f7f7;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
position: relative;
|
|
}
|
|
</style> |