<template>
    <app-layout title="其他服务">
        <view class="common-service-nav-group">
            <text class="section-title">建材安装服务</text>
            <view class="group g1">
                <view class="service-item" v-for="(item, index) in list" :key="index" @click="utils.toPage(item.page)">
                    <image class="service-icon" :src="item.cover" mode="scaleToFill" />
                    <text class="service-name limit-line clamp-1">
                        {{ item.title }}
                    </text>
                </view>
            </view>
        </view>
    </app-layout>
</template>

<script>
import AppLayout from "@/components/layout/layout";
export default {
    name: "service-other",
    data() {
        return {
            utils: this.$utils,
            list: [
                {
                    id: 1,
                    cover: require("@/static/temp/index/1.png"),
                    title: "电器安装",
                    page: "",
                },
                {
                    id: 2,
                    cover: require("@/static/temp/index/2.png"),
                    title: "卫浴吊顶安装",
                    page: "",
                },
                {
                    id: 3,
                    cover: require("@/static/temp/index/3.png"),
                    title: "水电安装",
                    page: "",
                },
                {
                    id: 4,
                    cover: require("@/static/temp/index/4.png"),
                    title: "烟道钻孔",
                    page: "",
                },
                {
                    id: 5,
                    cover: require("@/static/temp/index/5.png"),
                    title: "家具安装",
                    page: "",
                },
                {
                    id: 6,
                    cover: require("@/static/temp/index/6.png"),
                    title: "门窗五金安装",
                    page: "",
                },
                {
                    id: 7,
                    cover: require("@/static/temp/index/7.png"),
                    title: "地面墙体安装",
                    page: "",
                },
                {
                    id: 8,
                    cover: require("@/static/temp/index/8.png"),
                    title: "其他安装",
                    page: "/pages/service/more",
                },
            ],
        };
    },
    components: {
        AppLayout,
    },
    onLoad() {},
    onShow() {},
    onReady() {},
    onReachBottom() {},
    onPullDownRefresh() {},
    methods: {},
};
</script>

<style lang="less" scoped>
.common-service-nav-group {
    width: 710rpx;
    padding: 40rpx 20rpx;
    box-sizing: border-box;
    margin: 0 auto;
    background-color: #ffffff;
    border: 0;
}
</style>