<template>
    <div>
        <div class="layout-cont-btn">
            <van-pull-refresh v-model="refreshing" @refresh="_refresh">
                <van-list
                        v-model="loading"
                        :finished="finished"
                        finished-text="没有更多了"
                        @load="_load">
                    <van-swipe-cell v-for="item in resultList" :key="item.name">
                        <div class="result-item" @click="_goto(item)">
                            <div>地点：{{item.name}}</div>
                            <div>地址：{{item.address}}</div>
                            <div>打卡时间：{{item.attendanceTime?$dateformat(item.attendanceTime,'yyyy-mm-dd'):''}}</div>
                            <div>打卡地点：{{item.attendanceAddress}}</div>
                        </div>
                        <template #right>
                            <van-button square type="info" text="打卡" class="swipe-cell-btn"
                                        @click="_getWebLoc(item.id)"></van-button>
                            <van-button square type="danger" text="删除" class="swipe-cell-btn"
                                        @click="_delCheck(item.id)"></van-button>
                        </template>
                    </van-swipe-cell>
                </van-list>
            </van-pull-refresh>

            <div id='map' v-show="false"></div>
        </div>
        <div class="bottom-btn">
            <van-button type="info" block @click="_add">添加地点</van-button>
        </div>

        <van-popup v-model="showAllLoc">
            <SelectLocation @cancel="showAllLoc=false" @refresh="_refresh" ref="allLoc"></SelectLocation>
        </van-popup>
    </div>
</template>

<script>
    import BaiduMap from '../../lib/map'
    import {samplingPlace, attendanceRecord, samplingShelf} from '../../api'
    import SelectLocation from './components/SelectLocation'

    export default {
        name: "SamplingLocation",
        components: {
            SelectLocation
        },
        data() {
            return {
                showAllLoc: false,
                resultList: [],
                page: 1,
                rows: 10,
                refreshing: false,//刷新中...
                loading: false,//加载中...
                finished: false,//没有更多数据
                planId: this.$route.query.planId,
                latitude: '',
                longitude: ''
            }
        },
        mounted() {
            this._getData()
        },
        methods: {
            _refresh() {
                this.showAllLoc = false
                this.page = 1
                this._getData()
            },
            _searchParams() {
                let data = {
                    page: this.page,
                    rows: this.rows,
                    planId: this.planId
                };
                return this.$serializeForm(data)
            },
            _getData: async function () {
                let result = await samplingPlace.pageApp(this._searchParams())
                this.resultList = [...(this.page === 1 ? [] : this.resultList), ...result.records]
                this.refreshing = false
                this.loading = false
                if (this.resultList.length === result.total) {
                    this.finished = true
                }
            },
            _load() {
                this.page = this.page + 1;
                this._getData()
            },
            _add() {
                this.showAllLoc = true
                this.$nextTick(function () {

                    this.$refs.allLoc._open(this.planId)
                })
            },
            _getWebLoc(id) {
                let that = this
                that.$nextTick(() => {
                    BaiduMap.init().then(BMap => {
                        var geolocation = new BMap.Geolocation()
                        geolocation.getCurrentPosition(function (r) {
                            /* eslint-disable */
                            if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                                that.latitude = that.$changeToDFM(r.point.lat, 'N')
                                that.longitude = that.$changeToDFM(r.point.lng, 'E')
                                that._action(id)
                            } else {
                                alert('获取不到位置信息')
                            }
                        }, {enableHighAccuracy: true})
                    })
                })
            },
            // 打卡
            _action: async function (id) {
                let result = await attendanceRecord.add({
                    placeId: id,
                    attendanceAddress: this.latitude + ',' + this.longitude
                })
                if (result) {
                    this.$toast('打卡成功！')
                    this._refresh()
                }
            },
            _goto(data) {
                this.$router.push({path: '/sampling_task/goods_shelves', query: {placeId: data.id}})
            },
            _delCheck: async function (id) {
                let result = await samplingShelf.checkPlaceDelete({placeId: id})
                if (result) {
                    let that = this;
                    this.$dialog.confirm({
                        title: '提示',
                        message: result,
                    }).then(() => {
                        that._delLoc(id)
                    }).catch(() => {
                        // on cancel
                    });
                }else{
                    this._delLoc(id)
                }
            },
            _delLoc: async function (id) {
                let result = await samplingPlace.edit({id: id, obj: {planId: this.planId, selected: 0}})
                if (result) {
                    this.$toast('操作成功！')
                    this._refresh()
                }
            },
        }
    }
</script>

<style scoped>

</style>
