<template>
  <el-dialog title="一键生成权限" :visible.sync="dialogShow" width="420px" :before-close="handleClose">
    <div>
      <el-form
        ref="form"
        label-position="right"
        :model="editModel"
        label-width="100px"
        :rules="editRules"
        size="mini"
        @submit.native.prevent
      >
        <el-form-item label="地图名称" prop="mapId">
          <el-select v-model="editModel.mapId" :placeholder="$t('map.pleaseSelect')">
            <el-option
              v-for="item in mapList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
      </el-form>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogShow = false">{{ $t('map.cancel') }}</el-button>
      <el-button type="primary" :loading="loading" @click="saveAs">{{ $t('map.confirm') }}</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { postPermissonList } from '@/api/management/author';
import { listPublishMap } from '@/api/jmap/map';

export default {
	name: 'MapSaveAs',
	props: {

	},
	data() {
		return {
			dialogShow: false,
			loading: false,
			mapList: [],
			editModel: {
				mapId: ''
			},
			editRules: {
				mapId: [
					{ required: true, message: this.$t('rules.pleaseEnterMapName'), trigger: 'change' }
				]
			}
		};
	},
	watch: {

	},
	mounted() {
		this.loadInitData();
	},
	methods: {
		async loadInitData() {
			try {
				// 获取地图
				this.mapList = [];
				const res = await listPublishMap();
				res.data.forEach(elem => {
					this.mapList.push({ value: elem.id, label: elem.name });
				});
			} catch (error) {
				console.error(error, '获取发布地图');
			}
		},
		doShow() {
			this.dialogShow = true;
		},
		close() {
			this.editModel = {
				mapId: ''
			};
			this.dialogShow = false;
		},
		handleClose() {
			this.close();
		},
		saveAs() {
			this.$refs['form'].validate((valid) => {
				this.loading = true;
				postPermissonList(this.editModel.mapId).then(response => {
					this.loading = false;
					this.$emit('refresh');
					this.close();
				}).catch(() => {
					this.loading = false;
					this.$messageBox(this.$t('map.saveFailed'));
				});
			});
		}
	}
};
</script>
