<template>
    <!-- pages/selectShop/selectShop.wxml -->
    <view class="container">
        <view class="selected-shop-nav">
            <view class="selected-item" @tap="bindChooseParentShop" :data-parentid="item.shop_id" :data-index="index" v-for="(item, index) in selectedShopList" :key="index">
                {{ item.shop_name }} /
            </view>
        </view>
        <view class="shop-list">
            <view class="list-item" v-for="(item, index) in shopChildrenList" :key="index">
                <view class="left" @tap="bindNextChildren" :data-parentid="item.shop_id" :data-shopname="item.shop_name">{{ item.shop_name }}</view>

                <view class="right"><text class="selected-btn" @tap="bindSelected" :data-parentid="item.shop_id" :data-shopname="item.shop_name">选择</text></view>
            </view>
            <view v-if="shopChildrenList.length == 0" class="no-data">暂无数据</view>
        </view>
    </view>
</template>

<script>
// pages/selectShop/selectShop.js
var config = require('../../common/config.js');
var http = require('../../common/http.js');
var common = require('../../common/common.js');
var storage = require('../../common/storage.js');
export default {
    data() {
        return {
            parent_id: 0,
            shopChildrenList: [],
            selectedShopList: []
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
        const myInfo = storage.getUserInfo();
        const parent_id = myInfo.userInfo.user_id;
        //this.loadFirstChildren(parent_id)
        this.setData({
            selectedShopList: [
                {
                    shop_id: parent_id,
                    shop_name: '.'
                }
            ],
            shopChildrenList: [
                {
                    shop_id: parent_id,
                    shop_name: myInfo.name
                }
            ]
        });
    },
    methods: {
        loadFirstChildren: function (parent_id) {
            const that = this;
            const pData = {
                parent_id: parent_id
            };
            http.postApi(config.API_USER_FIRST_CHILDREN, pData, function (resp) {
                if (resp.data.code === 200) {
                    let _shopList = resp.data.data.children;
                    that.setData({
                        shopChildrenList: _shopList
                    });
                } else {
                    common.simpleToast(resp.data.msg);
                }
            });
        },

        bindNextChildren: function (e) {
            const parent_id = e.currentTarget.dataset.parentid;
            const shop_name = e.currentTarget.dataset.shopname;
            this.loadFirstChildren(parent_id);
            const selectedShopList = this.selectedShopList;
            selectedShopList.push({
                shop_id: parent_id,
                shop_name: shop_name
            });
            this.setData({
                selectedShopList: selectedShopList
            });
        },

        bindChooseParentShop: function (e) {
            const parent_id = e.currentTarget.dataset.parentid;
            const index = e.currentTarget.dataset.index;
            if (index === 0) {
                const myInfo = storage.getUserInfo();
                const parent_id = myInfo.userInfo.user_id;
                this.setData({
                    selectedShopList: [
                        {
                            shop_id: parent_id,
                            shop_name: '.'
                        }
                    ],
                    shopChildrenList: [
                        {
                            shop_id: parent_id,
                            shop_name: myInfo.name
                        }
                    ]
                });
                return;
            }
            this.loadFirstChildren(parent_id);
            const selectedShopList = this.selectedShopList.slice(0, index + 1);
            this.setData({
                selectedShopList: selectedShopList
            });
        },

        bindSelected: function (e) {
            console.log(e);
            const parent_id = e.currentTarget.dataset.parentid;
            const shop_name = e.currentTarget.dataset.shopname;
            storage.setSelectedShop({
                shop_id: parent_id,
                shop_name: shop_name
            });
            uni.navigateBack({
                delta: 1
            });
        }
    }
};
</script>
<style>
@import './selectShop.css';
</style>
