handleparam.vue 3.05 KB
<template>
  <div class="paramset-box">
    <el-dialog :title="curtype === 'export'?'配置导出':'配置导入'" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
      <div class="setparams-box">
        <el-form label-width="80px" :model="paramform" v-show="curtype === 'upload'">
          <el-form-item label="类型">
             <el-select v-model="paramform.fileType">
                <el-option v-for="type in types" :key="type.type_code" :value="type.type_code" :label="type.conf_name"></el-option>
              </el-select>
          </el-form-item>
          <el-form-item label="名称">
            <el-input v-model="paramform.name"></el-input>
          </el-form-item>
          <el-form-item label="文件">
              <el-upload
                class="upload-demo"
                ref="paramsup"
                action="https://jsonplaceholder.typicode.com/posts/"
                :before-upload="handlePreview"
                multiple
                :limit="1"
                :auto-upload="false"
                :on-success="sucessfile"
                :file-list="fileList">
                <el-button size="small" slot="trigger" type="primary">点击上传</el-button>
                <div slot="tip" class="el-upload__tip">只能上传tar.gz文件.</div>
              </el-upload>
          </el-form-item>
        </el-form>
        <el-form label-width="80px" :model="exportform"  v-show="curtype === 'export'">
           <el-form-item label="类型">
             <el-select v-model="paramform.fileType">
                <el-option v-for="type in types" :key="type.type_code" :value="type.type_code" :label="type.conf_name"></el-option>
              </el-select>
          </el-form-item>
        </el-form>
      </div>

      <span slot="footer" class="dialog-footer">
        <el-button @click="handleClose()">取 消</el-button>
        <el-button type="primary" @click="uploadparams()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
      paramform:{
        fileType:''
      },
      exportform:{},
      fileList:[],
      types:[],
      curtype:''
    };
  },
  methods: {
    show(type) {
      this.curtype = type;
      this.dialogVisible = true;
      this.$store.commit("setocxstate", 1);
    },
    handlePreview(file){
      if(this.uploadFile(file,'application/x-gzip')){
        return false
      } else {
        return true
      }
    },
    uploadparams(){
      this.$refs.paramsup.submit()
    },
    sucessfile(){

    },
    submitParamSet(){
      
    },
    handleClose(done) {
      this.dialogVisible = false,
      this.$store.commit("setocxstate", 0);
    },
    getTypes(){
      let params = {
          offset: 0,
          limit: ''
      }
      this.$api.task.getConftypes(params).then(res => {
        this.types = res.list_data
      })
			}
  },
  created(){
    this.getTypes()
  }
};
</script>

<style lang="stylus" scoped>
.setparams-box{
  width 400px
  margin 0 auto
}
.paramset-box{
  overflow hidden
}
</style>