<template>
  <el-dialog v-dialogDrag :title="this.$t('orderAuthor.oneClickGenerationPermission')" :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="this.$t('orderAuthor.mapName')" 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';

export default {
    name: 'MapSaveAs',
    props: {
        mapList:{
            required:true,
            type:Array
        }
    },
    data() {
        return {
            dialogShow: false,
            loading: false,
            editModel: {
                mapId: ''
            },
            editRules: {
                mapId: [
                    { required: true, message: this.$t('rules.pleaseEnterMapName'), trigger: 'change' }
                ]
            }
        };
    },
    methods: {
        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.$message.success(this.$t('tip.oneKeyGeneratedSuccessfully'));
                    this.$emit('refresh');
                    this.close();
                }).catch((error) => {
                    this.loading = false;
                    this.$messageBox(`${this.$t('map.saveFailed')}, ${error.message}`);
                });
            });
        }
    }
};
</script>
