rt-sim-training-client/src/views/planMonitor/newEditTool/menus/editPlanName.vue
2020-08-14 18:30:04 +08:00

117 lines
3.4 KiB
Vue

<template>
<el-dialog
v-dialogDrag
class="planEdit__tool create-empty-plan"
:title="title"
:visible.sync="dialogShow"
width="400px"
:before-close="doClose"
:z-index="3000"
:modal="false"
:close-on-click-modal="false"
>
<div>
<el-row>
<el-form ref="form" :model="editModel" label-width="140px" size="mini" :rules="rules" @submit.native.prevent>
<el-form-item :label="this.$t('planMonitor.runGraphName')+this.$t('global.colon')" prop="name">
<el-input v-model="editModel.name" autofocus />
</el-form-item>
</el-form>
</el-row>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="doClose">{{ $t('map.cancel') }}</el-button>
<el-button type="primary" :loading="loading" @click="handleEdit">{{ $t('global.modify') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { putRunPlanDetail } from '@/api/runplan';
export default {
name: 'CreateEmptyPlan',
components: {
},
data() {
return {
activeTab: 'first',
dialogShow: false,
loading: false,
publishMapList: [],
editModel: {
planId: '',
name: ''
}
};
},
computed: {
title() {
return this.$t('planMonitor.modifyRunningDiagramName');
},
rules() {
return {
name: [
{ required: true, message: this.$t('rules.enterTheNameOfTheRunGraph'), trigger: 'blur' }
]
};
}
},
mounted() {
},
methods: {
doShow(data) {
this.dialogShow = true;
if (data && data.name) {
this.editModel.name = data.name;
this.editModel.planId = data.id;
}
},
doClose() {
this.loading = false;
this.dialogShow = false;
this.editModel.name = '';
if (this.$refs.form) {
this.$refs.form.resetFields();
}
},
handleEdit() {
this.$refs['form'].validate((valid) => {
if (valid) {
this.loading = true;
putRunPlanDetail(this.editModel).then(resp => {
const params = {
dialogName: 'openRunPlan',
operate: 'loadRunPlanData',
params: { planId: resp.data, lineCode: this.$route.query.lineCode, planName: this.editModel.name, refresh: true }
};
this.$emit('dispatchOperate', params);
this.$message.success(this.$t('tip.runGraphNameModifiedSuccessfully'));
this.$emit('renewal', this.editModel.name);
this.doClose();
}).catch(error => {
this.$messageBox(this.$t('tip.modifyRunGraphNameFailed') + error.message);
this.doClose();
});
}
});
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
/deep/ {
.el-input {
width: 160px;
}
.el-input-number {
width: 120px;
}
}
</style>