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

(#37) Optimize Account page

Browse Source
This commit is contained in:
MrKBear 2022-01-20 13:26:24 +08:00
parent 87f4d220e5
commit 63300f68f8
3 changed files with 42 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -44,40 +44,25 @@
</view>
<!--主要功能-->
<view class="card main-function"><!--四个功能合在一起的容器-->
<view class="branch-funtion">
<view><!--每个功能的容器-->
<image class="icon" src="../../image/account/Account_UserInfo.svg"></image><!--每个功能的图片-->
<view>账号信息</view><!--每个功能的文字-->
</view>
</view>
<view class="card main-function">
<view class="branch-funtion">
<view>
<image class="icon" src="../../image/account/Account_DateList.svg"></image>
<view>课表缓存</view>
</view>
</view>
<view class="branch-funtion">
<view>
<image class="icon" src="../../image/account/Account_Customer.svg"></image>
<view>功能定制</view>
</view>
</view>
<view class="branch-funtion">
<view style="border-right: 0px;">
<image class="icon" src="../../image/account/Account_Settings.svg"></image>
<view>更多设置</view>
<!--每个功能的容器-->
<view class="branch-funtion" wx:for="{{ mainFunction$mainFunctionList }}" wx:key="index">
<view style="{{ index == (mainFunction$mainFunctionList - 1) ? 'border-bottom: 0px' : '' }}">
<!--每个功能的图片-->
<image class="icon" src="../../image/account/Account_{{ item.iconUrl }}.svg"></image>
<!--每个功能的文字-->
<view>{{ item.displayName }}</view>
</view>
</view>
</view>
<!-- 功能列表 -->
<view class="card function-list">
<view class="function" wx:for="{{functionList$functionList}}" wx:for-index="index" wx:key="id">
<view style="{{item.id == (functionList$functionList.length - 1) ? 'border-bottom: 0px' : ''}}">
<!-- 每一行 -->
<view class="function" wx:for="{{ functionList$functionList }}" wx:key="index">
<view style="{{ index == (functionList$functionList.length - 1) ? 'border-bottom: 0px' : '' }}">
<image class="icon func-icon" src="../../image/account/Account_{{ item.iconUrl }}.svg" />
<view>{{ item.displayName }}</view>
<image class="icon-sub arrow" src="../../image/account/Account_Arrow.svg" />

21
miniprogram/pages/Account/FunctionList.ts
View File

@ -2,11 +2,6 @@ import { Modular, Manager } from "../../core/Module";
interface IFunctionListItem {
/**
* id
*/
id?: number
/**
* 显示名称
*/
@ -18,10 +13,6 @@ interface IFunctionListItem {
iconUrl: string;
}
interface IFunctionListData {
functionList?: IFunctionListItem[];
};
class FunctionList<M extends Manager> extends Modular<M> {
public static readonly functionList: IFunctionListItem[] = [
@ -32,18 +23,12 @@ class FunctionList<M extends Manager> extends Modular<M> {
{ displayName: "联系客服", iconUrl: "Support" }
];
public data: IFunctionListData = {
functionList: undefined
public data = {
functionList: FunctionList.functionList
};
public override onLoad() {
console.log(FunctionList.functionList)
this.setData({
functionList: FunctionList.functionList.map((value, index) => {
value.id = index;
return value;
})
})
// Do something
}
}

24
miniprogram/pages/Account/MainFunction.ts
View File

@ -1,7 +1,31 @@
import { Modular, Manager } from "../../core/Module";
interface IMainFunctionItem {
/**
* 显示名称
*/
displayName: string;
/**
* 图标路径
*/
iconUrl: string;
}
class MainFunction<M extends Manager> extends Modular<M> {
public static readonly MainFunctionList: IMainFunctionItem[] = [
{ displayName: "账号信息", iconUrl: "UserInfo" },
{ displayName: "课表缓存", iconUrl: "DateList" },
{ displayName: "功能定制", iconUrl: "Customer" },
{ displayName: "更多设置", iconUrl: "Settings" }
];
public data? = {
mainFunctionList: MainFunction.MainFunctionList
}
public override onLoad() {
// Do something
}