<template>
    <lj-win-index-common-list
        :title="title"
        ref="baseWin"
        api-name="PrintTemplateGet"
        :ifShowSearchbar="false"
        :data-reset-callback="handleDataReset"
        :data-loaded-callback="handleDataLoaded"
        :query-hard-parms="queryHardParms"
        :query-quick="queryQuick"
        :query-fields="queryFields"
    >
        <div slot="body_list">
            <div class="lj-card-item flex flex-start" v-for="item in allData" @click="handleCellClick(item)">
                <span><van-checkbox v-model="item.checked"></van-checkbox></span>
                <span class="aliase">{{item.aliase}}</span>
            </div>
        </div>
        <template slot="footer">
            <mu-button large color="primary" @click="chooseCommit" style="width:100%">选择</mu-button>
        </template>
    </lj-win-index-common-list>
</template>

<script>
    import LjWinIndexCommonList from "components/lj-win-index-common-list";

    export default {
        components: {
            LjWinIndexCommonList
        },
        data() {
            return {
                winMode: "",
                allData: [],
                queryHardParms: {},
                queryFields: [
                ],
                queryQuick: [
                ],
                checkboxValue: false,
                queryParams: {}
            }
        },
        created() {
            let pageParam = $lj.getPageParam();
            if (pageParam) {
                this.queryHardParms = pageParam.queryParams || {};
                // this.queryParams = pageParam.queryParams;

                // this.queryHardParms.dwname = pageParam.dwname;
            }
        },
        methods: {
            handleDataReset(response) {
                this.allData.length = 0;
                this.addList(response.list);
            },
            handleDataLoaded(response) {
                let moreItems = response.list;
                if (moreItems.length > 0) {
                    this.addList(moreItems);
                    return true;
                }
                return false;
            },
            addList(list) {
                this.allData = this.allData.concat(list);
            },
            handleCellClick(item) {
                for(let i of this.allData) {
                    if(i.checked) this.$set(i,"checked",false);
                }

                this.$set(item,"checked",true);
            },
            chooseCommit() {
                let selected = {}
                for(let i of this.allData) {
                    if(i.checked) selected = i;
                }

                $lj.sendEvent("print_template_select", {selectedItem: selected});
            }
        },
        computed: {
            title() {
                return "打印模版选择";
            }
        }
    }
</script>

<style lang="less">
.flex-start {
    justify-content: flex-start;
    align-content: center;
    align-items: center;
    gap: 10px;
}
.aliase {
    font-size: 16px;
}
</style>