rt-sim-training-client/src/views/planMonitor/editTool/menus/systermOut.vue

<template>
  <el-dialog
    v-dialogDrag
    class="planEdit__tool systerm-out"
    :title="title"
    :visible.sync="dialogShow"
    :width="width + 'px'"
    :before-close="doClose"
    :z-index="2000"
    :modal="false"
    :close-on-click-modal="false"
  >
    <el-input v-model="context" type="textarea" :rows="10" readonly />
    <span slot="footer" class="dialog-footer">
      <el-button size="medium" @click="doClose">取 消</el-button>
      <el-button type="primary" size="medium" @click="handleCommit">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>

export default {
	name: 'SystermOut',
	components: {
	},
	data() {
		return {
			dialogShow: false,
			loading: false,
			params: {
				width: 400,
				contextList: []
			}
		};
	},
	computed: {
		title() {
			return '系统输出框';
		},
		width() {
			if (this.params.width) {
				return this.params.width;
			} else {
				return 400;
			}
		},
		context() {
			return this.params.contextList.join('\n') || '';
		}
	},
	mounted() {
	},
	methods: {
		doShow(params) {
			this.params = params || {};
			this.dialogShow = true;
		},
		doClose() {
			this.loading = false;
			this.dialogShow = false;
		},
		handleCommit() {
			this.doClose();
		}
	}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
    @import "src/styles/mixin.scss";
	.systerm-out{
		/deep/ {
			.el-dialog__body{
				padding: 10px 20px;
			}
			.dialog-footer{
				display: flex;
				justify-content: center;
			}
		}
	}
</style>