<template>
    <div>
        <div class="flex flex-mean" style="background-color: #FFFFFF; height: 150px;">
            <!-- <van-search class=".flex flex-1" v-model="searchValue" left-icon="" shape="round" placeholder="请输入搜索关键词" />
            <van-button round type="applyList" class="custom-button font-size13 m-top10 m-right12" @click="onSearch()">查询</van-button> -->
            <!-- <van-image src="../../assets/images/servicePhone/" /> -->
            <img :src="applyList.attrs && applyList.attrs[0] && applyList.attrs[0].url ? applyList.attrs[0].url : 'https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240927/087bb3a330a6494b9b09b5341c309ced.png'" style="width: 100%; height: 150px;" />
        </div>
        <div class='' style="position: relative;top: -10px;">
            <div class="card">
                <div class=" flex flex-y p0">
                    <div class="flex flex-x  flex-center2">
                        <h2 style="margin: 0; font-size: 21px; ">{{ applyList.name }}</h2>
                        <van-tag size="medium" color="#ffefd6" style="margin-left: 10px;"
                            text-color="#ff8707">{{applyList.type}}/{{typeNames}}</van-tag>

                    </div>
                    <div class="flex flex-x flex-center2 flex-end">
                        <div>
                            <van-tag v-for=" (item,index) in tabs" round type="warning" color="#f2f2f2" size="medium"
                                text-color="#6e6e6e">{{item.tab}}</van-tag>
                            <div style="font-size: 16px;color: #999999; line-height: 30px;">
                                <img style="width: 14px; height: 14px;"
                                    src="../../assets/images/livingCircle/address1.png">
                                <span>{{ applyList.address }} </span>
                            </div>
                        </div>
                        <img style="width: 40px; height: 40px;" src="../../assets/images/livingCircle/navigation.png">
                    </div>
                    <div class="">
                        <span style="font-size: 16px;color: #999999;"> 营业时间:</span>
                        <span style="font-size: 16px;color: #000000;"> 营业时间:</span>
                    </div>
                    <div class="">
                        <span style="font-size: 16px;color: #999999;"> 联系电话:</span>
                        <span style="font-size: 16px;color: #000000;"> 营业时间:</span>
                        <img style="width: 15px ;height: 15px;" src="../../assets/images/livingCircle/tel.png">
                    </div>

                </div>
            </div>
        </div>
        <div class='container' style="position: relative;top: -10px;">
            <div class="card">
                <div class="m-top10 p0">
                    <h2 style="margin-bottom: 10px; font-size: 21px;">优惠卷</h2>
                    <div class="container" style="background:linear-gradient(0deg, #FFF9F5 65%, #FEF1E9 100%)">
                        <div class="card">
                            <div class="flex flex-x flex-center2 flex-end">
                                <div>
                                    <h2 style="margin: 0; font-size: 21px; ">{{ applyList.name }}</h2>
                                    <van-tag v-for=" (item, index) in tabs" style="  border: 1px solid #FFAA07; " round type="warning" color="#FFFFFF"
                                        size="medium" text-color="#FFAA07">{{ item.tab }}</van-tag>
                                    <div style="font-size: 16px;color: #999999; line-height: 30px;">
                                            <span>有效期至</span>  <span>{{ applyList.address }} </span>
                                    </div>
                                </div>
                                <button style="width: 40px; height: 40px;"
                                 ></button>
                            </div>
                        </div>
                    </div>
                    <div style="margin-top: 10px;">
                        <span style=" font-size: 14px;
color: #999999;">使用方法：凭当前页面进点享受优惠</span>
                    </div>
                 
                    <!--   <div style="font-size: 16px;color: #999999; line-height: 30px;"><span>招募截止: </span><span
                          style="color: black;">{{applyList.deadline}}</span></div>
                    <div style="font-size: 16px;color: #999999; line-height: 30px;"><span>签到时间: </span><span
                            style="color: black;">{{applyList.signInTime+' 至 '+applyList.signOutTime}}</span></div>
                    <div style="font-size: 16px;color: #999999; line-height: 30px;"><span>活动名额: </span><span
                            style="color: black;"><span v-if="applyList.notQuota === 1">{{applyList.quota}}</span>
                            <tspanext v-else>不限名额</tspanext>
                        </span></div>
                    <div style="font-size: 16px;color: #999999; line-height: 30px;"><span>主办方: </span><span
                            style="color: black;">{{ActName?ActName:'-'}}</span></div>
                    <div style="font-size: 16px;color: #999999; line-height: 30px;"><span>联系人: </span><span
                            style="color: black;">{{applyList.linkman}}</span></div>
                    <div style="font-size: 16px;color: #999999; line-height: 30px;"><span>联系电话: </span><span
                            style="color: black;">{{applyList.linkman}}</span></div>
                    <div style="font-size: 16px;color: #999999; line-height: 30px;"><span>活动时长: </span><span
                            style="color: black;">{{applyList.serviceTime}}小时</span></div>
                    <div style="font-size: 16px;color: #999999; line-height: 30px;"><span>积分奖励: </span><span
                            style="color: black;">{{applyList.points}}</span></div> -->
                </div>
            </div>
        </div>
        <Android @send-number="handleNumber" />
    </div>

</template>

<script>
import {sphereLifeSearcdetail } from "@/api/lingCircle"
import Share from "@/components/Share"
import registerDialog from '@/components/registerDialog';
import { setConfig } from '@/utils/jweixin'
import { Toast, Dialog } from 'vant'

export default {
    data() {
        return {
            options: [
                {
                    "children": [
                        {
                            "pv": "1",
                            "value": "11",
                            "label": "托儿所"
                        },
                        {
                            "pv": "1",
                            "value": "12",
                            "label": "幼儿园"
                        },
                        {
                            "pv": "1",
                            "value": "13",
                            "label": "小学"
                        },
                        {
                            "pv": "1",
                            "value": "14",
                            "label": "中学"
                        },
                        {
                            "pv": "1",
                            "value": "15",
                            "label": "培训机构"
                        },
                        {
                            "pv": "1",
                            "value": "16",
                            "label": "其它"
                        }
                    ],
                    "value": "1",
                    "label": "教育培训"
                },
                {
                    "children": [
                        {
                            "pv": "2",
                            "value": "21",
                            "label": "门诊"
                        },
                        {
                            "pv": "2",
                            "value": "22",
                            "label": "社区医院"
                        },
                        {
                            "pv": "2",
                            "value": "23",
                            "label": "医院"
                        },
                        {
                            "pv": "2",
                            "value": "24",
                            "label": "其它"
                        }
                    ],
                    "value": "2",
                    "label": "医疗卫生"
                },
                {
                    "children": [
                        {
                            "pv": "3",
                            "value": "31",
                            "label": "餐饮"
                        },
                        {
                            "pv": "3",
                            "value": "32",
                            "label": "超市"
                        },
                        {
                            "pv": "3",
                            "value": "33",
                            "label": "理发"
                        },
                        {
                            "pv": "3",
                            "value": "34",
                            "label": "书店"
                        },
                        {
                            "pv": "3",
                            "value": "35",
                            "label": "便利店"
                        },
                        {
                            "pv": "3",
                            "value": "36",
                            "label": "市场"
                        },
                        {
                            "pv": "3",
                            "value": "37",
                            "label": "五金"
                        },
                        {
                            "pv": "3",
                            "value": "38",
                            "label": "照相"
                        },
                        {
                            "pv": "3",
                            "value": "39",
                            "label": "综合修理"
                        },
                        {
                            "pv": "3",
                            "value": "30",
                            "label": "服务站"
                        },
                        {
                            "pv": "3",
                            "value": "330",
                            "label": "农贸市场"
                        },
                        {
                            "pv": "3",
                            "value": "331",
                            "label": "其它"
                        }
                    ],
                    "value": "3",
                    "label": "商业服务"
                },
                {
                    "children": [
                        {
                            "pv": "4",
                            "value": "41",
                            "label": "电影院"
                        },
                        {
                            "pv": "4",
                            "value": "42",
                            "label": "歌剧院"
                        },
                        {
                            "pv": "4",
                            "value": "43",
                            "label": "图书馆"
                        },
                        {
                            "pv": "4",
                            "value": "44",
                            "label": "游泳馆"
                        },
                        {
                            "pv": "4",
                            "value": "45",
                            "label": "活动中心"
                        },
                        {
                            "pv": "4",
                            "value": "46",
                            "label": "体育馆"
                        },
                        {
                            "pv": "4",
                            "value": "47",
                            "label": "其它"
                        }
                    ],
                    "value": "4",
                    "label": "文化体育"
                },
                {
                    "value": "5",
                    "label": "其它"
                }
            ],
            tabs:[],
            applyList:{},
        };
    },
    created() {

    },
   async mounted() {

        // setConfig(['updateAppMessageShareData', 'onMenuShareAppMessage', 'updateTimelineShareData'])
        if (this.$route.query.id) {
            console.log(this.$route.query.id);
            
            this.sphereLifeId= this.$route.query.id
        //    await this.detail(this.$route.query.id)
        //    if(this.$route.query.flag === 'share'){
        //    await this.getById(this.$route.query.id)
        //    }
        //    await this.share()
           this.activityApplyList( this.$route.query.id)
        //    this.activitySignIn(1)
        //    this.activitySignIn(0)
        }
    },
    methods: {
        //获取生活圈详情
        activityApplyList(id) {
            sphereLifeSearcdetail(id).then(res => {
                if (res.code === 0) {
                    this.applyList = res.data
                    this.tabs = res.data.tags.split(',').map(tag => ({ tab: tag.trim() }))
                    console.log(tabs, "sdalkjflksdf");

              
             
                }
            }).catch(err => {

            })
        },        

      

      
    },
    components: { Share, registerDialog },
    computed: {
        disabledRecord() {
            return (item) => {
                if (!item.cutOffTime || item.online != 1) return true
                let flag = new Date(item.cutOffTime.replace(/-/g, '/')).getTime() < Date.now() || item.currentParticipants >= item.participants  || item.currentParticipants >= item.participants;
                return flag || false
            }
        },
    },
    watch: {},
}
</script>

<style lang='less' scoped>
.phone{
    height: 50px;
    bottom:8vh;
}
:deep img{
    max-width: 100%;
}
:deep(.p0>.van-cell) {
    padding: 0;
}

:deep(.van-cell) {
    padding: 16px 8px;
}

:deep(.van-cell__title) {
    color: #666666;
    display: flex;

    &>span {
        flex: 1;
    }
}

:deep(.van-cell__value) {
    text-align: left;
}

:deep(.van-cell--required) {
    &::before {
        left: -5px;
    }
}
</style>
