<template>
  <el-dialog v-dialogDrag :title="this.$t('publish.setTheProject')" :visible.sync="dialogVisible" width="30%" center>
    <el-form ref="form" :model="formModel" label-width="100px" label-position="left">
      <el-form-item :label="this.$t('publish.mapName')">
        <span>{{ formModel.name }}</span>
      </el-form-item>
      <el-form-item :label="this.$t('publish.whetherItBelongsToTheProject')" prop="project">
        <el-radio-group v-model="formModel.project" @change="changeProject">
          <el-radio :label="booleanValue.t">{{ $t('publish.trialYes') }}</el-radio>
          <el-radio :label="booleanValue.f">{{ $t('publish.trialNo') }}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item
        v-if="formModel.project"
        :label="this.$t('publish.belongsProject')"
        prop="projectCode"
        :rules="{
          required: true, message: '归属项目不能为空', trigger: 'change'
        }"
      >
        <el-select v-model="formModel.projectCode" placeholder="请选择归属项目">
          <el-option label="西铁院" value="XTY" />
        </el-select>
      </el-form-item>
    </el-form>
    <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 { setMapProject } from '@/api/jmap/map';
export default {
    name: 'SetMapProject',
    data() {
        return {
            dialogVisible: false,
            formModel: {
                id: '',
                name: '',
                cityCode: '',
                skinCode: '',
                project: false,
                projectCode: ''
            },
            projectCodeShow: false,
            booleanValue: {
                t: true,
                f: false
            }
        };
    },
    methods: {
        doShow(row) {
            this.dialogVisible = true;
            this.formModel.id = row.id;
            this.formModel.name = row.name;
            this.formModel.cityCode = row.cityCode;
            this.formModel.skinCode = row.skinCode;
        },
        doSave() {
            this.$refs['form'].validate((valid) => {
                if (valid) {
                    setMapProject(this.formModel).then(resp =>{
                        this.$message.success('设置归属项目成功！');
                        this.dialogVisible = false;
                        this.$emit('refresh');
                    });
                } else {
                    return false;
                }
            });

        },
        changeProject(val) {
            if (!val) {
                this.formModel.projectCode = '';
            }
        }
    }
};
</script>
