rt-sim-training-client/src/views/orderauthor/author/create.vue

<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';
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' }
                ]
            }
        };
    },
    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.$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>