<template>
  <div style="height: 100%;">
    <route-draft
      ref="routeEdit"
      :selected="selected"
      :map-info="mapInfo"
      :route-data="routeData"
      @setCenter="setCenter"
    />
    <route-detail ref="routeDetail" :map-info="mapInfo" @routeSelected="routeSelected" />
  </div>
</template>
<script>
import RouteDraft from './route';
import RouteDetail from './detail';

export default {
    name: 'RouteOperate',
    components: {
        RouteDraft,
        RouteDetail
    },
    props: {
        mapInfo: {
            type: Object,
            default() {
                return null;
            }
        },
        selected: {
            type: Object,
            default() {
                return null;
            }
        }
    },
    data() {
        return {
            enabledTab: 'Route',
            routeData: null
        };
    },
    methods: {
        clickEvent(e, model) {
            this.onSelect(model);
        },
        onSelect(model) {
            if (model) {
                this.selected = model;
            } else {
                this.selected = null;
            }
        },
        setDelayUnlockStatus(data, status) {
            if (data && data.delayShowList) {
                data.delayShowList.forEach(elem => {
                    elem.status = status;
                });
            }
        },
        routeSelected: function (data) {
            this.routeData = data;
            if (this.$refs && this.$refs.routeEdit) {
                this.$refs.routeEdit.isSave = !data.id;
            }
        },
        previewRouteEvent: function () {
            if (this.$refs && this.$refs.routeDetail) {
                this.$refs.routeDetail.doShow();
            }
        },
        initLoad() {
            this.$refs.routeEdit && this.$refs.routeEdit.initLoad();
        },
        createRouteEvent: function () {
            if (this.$refs && this.$refs.routeEdit) {
                this.$refs.routeEdit.clear();
            }
        },
        setSelected(selected) {
            this.$refs.routeEdit.setSelected(selected);
        },
        setCenter(code) {
            this.$emit('setCenter', code);
        },
        batchSectionListFocus(flag) {
            this.$refs.routeEdit.batchSectionListFocus(flag);
        }
    }
};
</script>
