rt-sim-training-client/src/views/lesson/trainingRule/addBatch.vue

<template>
  <el-dialog :title="title" :visible.sync="dialogVisible" width="25%" :before-close="handleClose" center>
    <data-form ref="dataform" :form="form" :form-model="formModel" :rules="rules" />
    <span slot="footer" class="dialog-footer">
      <el-button v-loading="loading" type="primary" @click="doSave">确 定</el-button>
      <el-button @click="handleClose">取 消</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { addTrainingRulesList } from '@/api/management/operation';
import { OperationList } from '@/scripts/OperationConfig';
import { getSkinStyleList } from '@/api/management/mapskin';

export default {
	name: 'AddBatch',
	data() {
		return {
			loading: false,
			dialogVisible: false,
			formModel: {
				skinStyle: ''
			},
			skinStyleList: [],
			isShow: false
		};
	},
	computed: {
		form() {
			this.type === 'ADD';
			const form = {
				labelWidth: '120px',
				items: [
					{ prop: 'skinStyle', label: '皮肤类型', type: 'select', required: true, options: this.skinStyleList }
				]
			};
			return form;
		},
		rules() {
			const crules = {
				skinStyle: [
					{ required: true, message: '请选择皮肤类型', trigger: 'change' }
				]
			};
			return crules;
		},
		title() {
			return '自动生成操作';
		}
	},
	mounted() {
		this.init();
	},
	methods: {
		init() {
			// 获取皮肤列表
			this.skinStyleList = [];
			getSkinStyleList().then(response => {
				this.skinStyleList = response.data.map(item => {
					const params = {};
					params.label = item.name;
					params.value = item.code;
					return params;
				});
			});
		},
		show(total) {
			if (total) {
				this.isShow = true;
			}

			this.loading = false;
			this.dialogVisible = true;
		},
		doSave() {
			const self = this;
			this.$refs.dataform.validateForm(() => {
				if (this.isShow) {
					this.$confirm('此操作将清空改皮肤下所有操作定义, 是否继续?', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					}).then(() => {
						self.create();
					}).catch(() => { });
				} else {
					self.create();
				}
			});
		},
		create() {
			const self = this;
			this.loading = true;
			addTrainingRulesList(this.formModel.skinStyle, OperationList[this.formModel.skinStyle].list).then(response => {
				self.loading = false;
				self.$message.success('批量生成操作定义成功');
				self.handleClose();
				self.$emit('reloadTable'); // 刷新列表
			}).catch(error => {
				self.loading = false;
				self.$message.error('批量生成操作定义失败：' + error.message);
			});
		},
		handleClose() {
			this.formModel = {
				skinStyle: ''
			};
			this.$refs.dataform.resetForm();
			this.isShow = false;
			this.dialogVisible = false;
		}
	}
};
</script>