rt-sim-training-client/src/views/planMonitor/newEditTool/menus/editSmoothRunTime.vue

<template>
  <el-dialog
    v-dialogDrag
    class="planEdit__tool edit-smooth-run-time"
    :title="title"
    :visible.sync="dialogShow"
    width="500px"
    :before-close="doClose"
    :z-index="2000"
    :modal="false"
    :close-on-click-modal="false"
  >
    <div style="margin: 10px;">
      <div style="border: 1px solid #B9B5A7">
        <el-row>
          <span style="position: relative; top: -8px; left: 20px">{{ $t('planMonitor.editSmoothRun.trainProportion') }}</span>
          <el-col :offset="1">
            <el-checkbox v-model="model.useSame">{{ $t('planMonitor.editSmoothRun.allTheLoopTrainProportion') }}</el-checkbox>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="9" :offset="1">
            <span>{{ $t('planMonitor.editSmoothRun.sizeOfTheLoopTrainProportion') }}</span>
          </el-col>
          <el-col :span="12">
            <el-select v-model="model.scale" :placeholder="$t('planMonitor.editSmoothRun.pleaseSelect')">
              <el-option
                v-for="item in scaleList"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-col>
        </el-row>
      </div>
      <el-row style="margin-top: 20px">
        <el-table :data="model.smoothList" border :height="240">
          <el-table-column prop="startTime" :label="$t('planMonitor.editSmoothRun.startTime')" />
          <el-table-column prop="stopTime" :label="$t('planMonitor.editSmoothRun.stopTime')" />
          <el-table-column prop="runInterval" :label="$t('planMonitor.editSmoothRun.runInterval')" />
          <el-table-column prop="scale" :label="$t('planMonitor.editSmoothRun.trainProportion')" />
        </el-table>
      </el-row>
      <el-row type="flex" justify="center" class="button-group">
        <el-button @click="handleAdd">{{ $t('planMonitor.editSmoothRun.add') }}</el-button>
        <el-button @click="handleDelete">{{ $t('planMonitor.editSmoothRun.delete') }}</el-button>
        <el-button @click="handleEdit">{{ $t('planMonitor.editSmoothRun.modify') }}</el-button>
      </el-row>
    </div>
    <el-row type="flex" justify="center" class="button-group">
      <el-button style="padding: 0px; margin: 0px 30px" @click="handleCommit">{{ $t('global.confirm') }}</el-button>
      <el-button style="padding: 0px; margin: 0px 30px" @click="doClose">{{ $t('global.cancel') }}</el-button>
    </el-row>
  </el-dialog>
</template>

<script>

export default {
    name: 'EditSmoothRunTime',
    components: {
    },
    data() {
        return {
            dialogShow: false,
            loading: false,
            model: {
                useSame: false,
                smoothList: []
            },
            scaleList: []
        };
    },
    computed: {
        title() {
            return this.$t('planMonitor.editSmoothRun.editSmoothRunTime');
        }
    },
    mounted() {
    },
    methods: {
        doShow() {
            this.dialogShow = true;
        },
        doClose() {
            this.loading = false;
            this.dialogShow = false;
        },
        handleAdd() {
            this.$emit('dispatchDialog', { name: 'addSmoothRunTime', params: {} });
        },
        handleDelete() {
            this.$emit('dispatchDialog', { name: 'addSmoothRunTime', params: {} });
        },
        handleEdit() {

        },
        handleCommit() {
        }
    }
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
    @import "src/styles/mixin.scss";

    /deep/ {
        .el-row {
            margin-bottom: 10px !important;
        }

        .el-dialog .el-input__inner {
            height: 20px !important;
            line-height: 20px !important;
        }

        .el-dialog .el-input {
            width: 160px !important;
        }
    }
</style>