<template>
    <div class='pages'>
        <div>
            <van-tabs :active="active" bind:change="onChange">
                <van-tab title="待接单">内容 1</van-tab>
                <van-tab title="待处理">内容 2</van-tab>
                <van-tab title="已完成">内容 3</van-tab>
            </van-tabs>
        </div>
        <div class="card rounded-corner">
            <div class="m-top12 flex">
                <van-tag type="primary" class="m-top12 m-top12-left">个性服务</van-tag>
                <van-tag type="warning"  class="m-top12 m-top12-left">共性需求</van-tag>
                <div class="m-top12 m-top12-left opacity5 font-size13">
                    公益事业类-社区困难群体生活帮扶
                </div>
            </div>
            <div class="m-top5 m-top12-left">
                <img src="@/assets/images/icon/address.png" class="small_img">
                张玉宝 13636520003<br>
                <div style="margin-left: 21px;" class="opacity5 font-size13 m-top5">重庆南路15号1号楼1单元101</div>
            </div>
            <div class="m-top5 m-top12-left">
                <img src="@/assets/images/icon/time.png" class="small_img">
                2024-05-0215:00
            </div>
            <div class="m-top5 m-top12-left">
                <div class="flex flex-center3">
                    <img src="@/assets/images/icon/content.png" style="vertical-align: top;" class="small_img">
                    <div>社区86岁独居老人，上下楼不方便，需要上门进行送餐服务。</div>
                </div>
            </div>

            <hr class="m-top12-left  m-top12-right opacity5">
            <div class="flex flex-fend m-top12-right">
                <van-button size="small" type="info" class="rounded-corner m-top5-bottom"
                    style="width: 60px;">接单</van-button>
            </div>

        </div>
    </div>
</template>
<script>

export default {
    data() {
        return {
            active: 1,
        };
    },
    created() {
    },
    methods: {
        onChange(event) {
            wx.showToast({
                title: `切换到标签 ${event.detail.name}`,
                icon: 'none',
            });
        },
    },
    components: {},
    computed: {},
    watch: {}
}
</script>

<style lang='less' scoped>

</style>
