<template>
    <global-page :showNavbar="false">
        <template #top>
            <global-navbar title="应用中心">
                <template #left>
                    <view v-if="isEdit" @tap="isEdit = false" class="cancel">取消</view>
                    <uni-icons type="left" size="16" @tap="goBack" v-else></uni-icons>
                </template>
                <template #right>
                    <global-button type="primary" size="small" v-if="isEdit" style="padding: 0 32rpx">保存</global-button>
                </template>
            </global-navbar>
        </template>
        <view class="content">
            <view class="card">
                <view class="card-title">
                    <view class="card-title-txt">首页应用</view>
                    <global-button type="primary" size="small" @tap="isEdit = true">编辑</global-button>
                </view>
                <view class="menu-list">
                    <menu-item
                        class="menu-item"
                        v-for="item in menuListHome"
                        :data="item"
                        :key="item.id"
                        :showCount="false"
                        :type="isEdit ? 'minus' : 'default'"
                        @tap="goTo"
                    ></menu-item>
                </view>
            </view>
            <view class="card">
                <view class="card-title">
                    <view class="card-title-txt">全部应用</view>
                </view>
                <view class="menu-list" v-if="menuListNoHome.length > 0">
                    <menu-item
                        class="menu-item"
                        v-for="item in menuListNoHome"
                        :data="item"
                        :key="item.id"
                        :showCount="false"
                        :type="isEdit ? 'plus' : 'default'"
                        @tap="goTo"
                    ></menu-item>
                </view>
                <global-empty class="menu-empty" v-else></global-empty>
            </view>
        </view>
    </global-page>
</template>

<script setup>
import { ref } from 'vue'
import MenuItem from '../components/menu-item.vue'
import { menuListHome, menuListNoHome } from '../constants/index.compositions'

const isEdit = ref(false)

//返回
const goBack = () => {
    uni.navigateBack()
}
//跳转
const goTo = () => {
    uni.navigateTo({ url: '/pages/panel/assessment-records/list' })
}
</script>
<style lang="scss" scoped>
@import './constants/index.scss';
</style>
