MrKBear/mini-dlpu-v3
MrKBear/mini-dlpu-v3
8
10
Fork 0
Code Issues 11 Pull Requests Projects 6 Releases Wiki Activity

(#37)Add Function List

Browse Source
This commit is contained in:
MrKBear 2022-01-18 22:30:05 +08:00
parent fc8aa19c67
commit 23f46a24c9
4 changed files with 104 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
miniprogram/pages/Account/Account.scss
View File

@ -4,7 +4,7 @@
view.container{ view.container{
padding-top: 20px; padding-top: 50rpx;
} }

126
miniprogram/pages/Account/Account.wxml
View File

@ -41,75 +41,75 @@
<!--主要功能--> <!--主要功能-->
<view class="card main-function"><!--四个功能合在一起的容器--> <view class="card main-function"><!--四个功能合在一起的容器-->
<view class="branch-funtion"><view><!--每个功能的容器--> <view class="branch-funtion">
<image class="icon" src="../../image/account/Account_UserInfo.svg"></image><!--每个功能的图片--> <view><!--每个功能的容器-->
<view>账号信息</view><!--每个功能的文字--> <image class="icon" src="../../image/account/Account_UserInfo.svg"></image><!--每个功能的图片-->
</view></view> <view>账号信息</view><!--每个功能的文字-->
</view>
</view>
<view class="branch-funtion"><view> <view class="branch-funtion">
<image class="icon" src="../../image/account/Account_DateList.svg"></image> <view>
<view>课表缓存</view> <image class="icon" src="../../image/account/Account_DateList.svg"></image>
</view></view> <view>课表缓存</view>
</view>
</view>
<view class="branch-funtion"><view> <view class="branch-funtion">
<image class="icon" src="../../image/account/Account_Customer.svg"></image> <view>
<view>功能定制</view> <image class="icon" src="../../image/account/Account_Customer.svg"></image>
</view></view> <view>功能定制</view>
</view>
</view>
<view class="branch-funtion"><view style="border-right: 0px;"> <view class="branch-funtion">
<image class="icon" src="../../image/account/Account_Settings.svg"></image> <view style="border-right: 0px;">
<view>更多设置</view> <image class="icon" src="../../image/account/Account_Settings.svg"></image>
</view></view> <view>更多设置</view>
</view>
</view>
</view> </view>
<view class="user-card card"> <!-- 功能列表 -->
<table class="FuncList"> <view class="card function-list">
<view class="tabView1"> <view class="function">
<th> <view>
<td> <image class="icon func-icon" src="../../image/account/Account_Sponsor.svg" />
<image class="FuncListImg" src="../../image/account/Account_Sponsor.svg"></image> <view>赞助计划</view>
<text class="tabTxt">赞助计划</text> <image class="icon-sub arrow" src="../../image/account/Account_Arrow.svg" />
<image class="FuncListImgT"src="../../image/account/Account_PubilcAccount.svg"></image>
</td>
</th>
</view> </view>
<view class="tabView2"> </view>
<th>
<td> <view class="function">
<image class="FuncListImg" src="../../image/account/Account_PubilcAccount.svg"></image> <view>
<text class="tabTxt">公众号</text> <image class="icon func-icon" src="../../image/account/Account_PubilcAccount.svg" />
<image class="FuncListImgT"src="../../image/account/Account_PubilcAccount.svg"></image> <view>公众号</view>
</td> <image class="icon-sub arrow" src="../../image/account/Account_Arrow.svg" />
</th>
</view> </view>
<view class="tabView3"> </view>
<th>
<td> <view class="function">
<image class="FuncListImg" src="../../image/account/Account_FAQ.svg"></image> <view>
<text class="tabTxt">自助问答</text> <image class="icon func-icon" src="../../image/account/Account_FAQ.svg" />
<image class="FuncListImgT"src="../../image/account/Account_PubilcAccount.svg"></image> <view>自助问答</view>
</td> <image class="icon-sub arrow" src="../../image/account/Account_Arrow.svg" />
</view>
</th> </view>
</view>
<view class="tabView4"> <view class="function">
<th> <view>
<td> <image class="icon func-icon" src="../../image/account/Account_AboutUs.svg" />
<image class="FuncListImg" src="../../image/account/Account_AboutUs.svg"></image> <view>关于我们</view>
<text class="tabTxt">关于我们</text> <image class="icon-sub arrow" src="../../image/account/Account_Arrow.svg" />
<image class="FuncListImgT"src="../../image/account/Account_PubilcAccount.svg"></image> </view>
</td> </view>
</th>
</view> <view class="function">
<view class="tabView5"> <view style="border-bottom: 0px;">
<th> <image class="icon func-icon" src="../../image/account/Account_Support.svg" />
<td> <view>联系客服</view>
<image class="FuncListImg" src="../../image/account/Account_Support.svg"></image> <image class="icon-sub arrow" src="../../image/account/Account_Arrow.svg" />
<text class="tabTxt">联系客服</text> </view>
<image class="FuncListImgT"src="../../image/account/Account_PubilcAccount.svg"></image> </view>
</td>
</th>
</view>
</table>
</view> </view>
</view> </view>

63
miniprogram/pages/Account/FunctionList.scss
View File

@ -1,30 +1,43 @@
@import "../../app.scss"; @import "../../app.scss";
table.FuncList{ view.function-list {
width: 100%; margin-top: 50rpx;
margin-bottom: 50rpx;
image.FuncListImg{ padding: 0 0 !important;
width: 25px; width: 100% !important;
height: 25px;
float: left; view.function {
padding-right: 20px; padding: 0 20px;
} width: calc( 100% - 40px );
view.tabView1,view.tabView2,view.tabView3,view.tabView4,view.tabView5{ height: 55px;
padding-top: 20px;
padding-bottom: 20px;
> view {
height: 100%;
display: flex;
align-items: center;
border-bottom: 1px solid rgba($color: #000000, $alpha: .1);
image.func-icon {
width: 26px;
height: 26px;
}
view {
margin-left: 15px;
flex-grow: 1;
font-size: .9em;
}
image.arrow {
width: 10px;
height: 10px;
}
}
} }
view.tabView1,view.tabView2,view.tabView3,view.tabView4{ }
border-bottom:1px solid gainsboro ;
padding-top: 20px; @media (prefers-color-scheme: dark) {
padding-bottom: 20px; view.function-list view.function > view {
border-bottom: 1px solid rgba($color: #ffffff, $alpha: .1);
} }
text.tabTxt{ }
letter-spacing: 1px;
}
image.FuncListImgT{
float: right;
width: 25px;
height: 25px;
}
}

4
miniprogram/pages/Account/MainFunction.scss
View File

@ -3,7 +3,7 @@
//主要功能 //主要功能
view.main-function { view.main-function {
display: flex; display: flex;
margin-top: 20px; margin-top: 50rpx;
padding: 0 !important; padding: 0 !important;
width: 100% !important; width: 100% !important;
@ -26,7 +26,7 @@ view.main-function {
view { view {
text-align: center; text-align: center;
margin-top: 5px; margin-top: 5px;
font-size: .8em; font-size: .9em;
} }
} }
} }