<template>
  <el-dialog v-dialogDrag title="导出地图" :visible.sync="dialogVisible" width="20%" center>
    <el-select v-model="selectMapList" multiple placeholder="请选择地图" style="width: 60%; position: relative; left: 20%;">
      <el-option
        v-for="item in publishMapList"
        :key="item.id"
        :label="item.name"
        :value="item.id"
      />
    </el-select>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="doSave">{{ $t('global.confirm') }}</el-button>
      <el-button @click="dialogVisible = false">{{ $t('global.cancel') }}</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { localExportMap, getPublishMapList } from '@/api/jmap/map';
export default {
    name: 'LocalSelectMap',
    data() {
        return {
            dialogVisible: false,
            publishMapList: [],
            selectMapList: [],
            formModel: {
                name: '',
                copyOtherData: false
            }
        };
    },
    computed: {

    },
    methods: {
        doShow(row) {
            this.dialogVisible = true;
            getPublishMapList({pageSize:999, pageNum:1}).then(res =>{
                if (res.code === 200) {
                    this.publishMapList = res.data.list;
                }
            }).catch(error => { this.$message.error(error.msg); });
        },
        async doSave() {
            const list = [];
            this.selectMapList.forEach(item => {
                list.push( Number(item));
            });
            const res = await localExportMap(list);
            const resultData = res.data;
            if (resultData === false) {
                return;
            }
            const content = new Blob([JSON.stringify(resultData)]);
            const urlObject = window.URL || window.webkitURL || window;
            const url = urlObject.createObjectURL(content);
            const el = document.createElement('a');
            el.href = url;
            el.download = `mapList.json`;
            el.click();
            urlObject.revokeObjectURL(url);
        }
    }
};
</script>
