<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>
                        <template #right>
                            <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>
        <div class="bottom-btn">
            <van-button type="info" block @click="showAdd=true">添加货架</van-button>
        </div>
        <van-popup v-model="showAdd" round :style="{ width:'80%'}">
            <div style="margin: 20px auto 30px;text-align: center">添加货架</div>
            <van-field v-model="name" label="货架" label-width="40px" placeholder="请输入货架"></van-field>
            <div style="text-align: center;margin: 20px">
                <van-button type="info" @click="_add">保存</van-button>
            </div>
        </van-popup>
    </div>
</template>

<script>
    import {samplingShelf,samplingSummary} from '../../api'

    export default {
        name: "GoodsShelves",
        data() {
            return {
                showAdd: false,
                resultList: [],
                page: 1,
                rows: 10,
                refreshing: false,//刷新中...
                loading: false,//加载中...
                finished: false,//没有更多数据
                placeId: this.$route.query.placeId,
                name: '',//货架名
            }
        },
        mounted() {
            this._getData()
        },
        methods: {
            _refresh() {
                this.page = 1
                this._getData()
            },
            _searchParams() {
                let data = {
                    page: this.page,
                    rows: this.rows,
                    placeId: this.placeId
                };
                return this.$serializeForm(data)
            },
            _getData: async function () {
                let result = await samplingShelf.page(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()
            },
            _delCheck:async function(id){
              let result = await samplingSummary.checkShelfDelete({shelfId:id})
                if(result){
                    let that = this;
                    this.$dialog.confirm({
                        title: '提示',
                        message: result,
                    }).then(() => {
                        that._del(id)
                    }).catch(() => {
                    });
                }else{
                    this._del(id)
                }
            },
            _del: async function (id) {
                let result = await samplingShelf.deleteByIds([id])
                if (result) {
                    this.$toast('操作成功！')
                    this._refresh()
                }
            },
            _add() {
                if (this.name === '') {
                    this.$toast('请输入货架')
                } else {
                    this._addOk()
                }
            },
            _addOk: async function () {
                let result = await samplingShelf.add({name: this.name, placeId: this.placeId})
                if (result) {
                    this.$toast('操作成功！')
                    this.showAdd = false
                    this.name = ''
                    this._refresh()
                }
            },
        }
    }
</script>

<style scoped>

</style>
