• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1<!--  Copyright (c) 2023 Unionman Technology Co., Ltd.
2Licensed under the Apache License, Version 2.0 (the "License");
3you may not use this file except in compliance with the License.
4You may obtain a copy of the License at
5
6http://www.apache.org/licenses/LICENSE-2.0
7
8Unless required by applicable law or agreed to in writing, software
9distributed under the License is distributed on an "AS IS" BASIS,
10WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11See the License for the specific language governing permissions and
12limitations under the License.  -->
13
14<template>
15<el-container id="main">
16  <el-header>
17    <el-page-header content="系统升级管理系统"></el-page-header>
18  </el-header>
19  <el-main>
20    <el-row>
21      <el-col :span="12" offset=6>
22        <el-form :model="form" ref="form" label-width="120px" size="small" label-position="left">
23          <el-upload :limit="1"  :on-change="handleChange" class="upload-demo" drag action="none" multiple  :auto-upload="false" :file-list="form.fileList">
24          <i class="el-icon-upload" requried></i>
25          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
26          </el-upload>
27          <el-form-item label="版本数:" requried>
28            <el-input v-model="form.versionCode"></el-input>
29          </el-form-item>
30          <el-form-item label="版本名称" requried>
31            <el-input v-model="form.versionName"></el-input>
32          </el-form-item>
33          <el-form-item label="是否为系统升级">
34            <el-switch v-model="form.isSystem" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
35          </el-form-item>
36          <el-form-item label="更新信息">
37            <el-input v-model="form.content" :disabled="!form.isSystem"></el-input>
38          </el-form-item>
39          <el-form-item>
40            <el-button type="primary" @click="onSubmit">提交</el-button>
41          </el-form-item>
42        </el-form>
43      </el-col>
44    </el-row>
45
46  </el-main>
47
48</el-container>
49
50</template>
51
52<script>
53import axios from 'axios'
54import { Loading } from 'element-ui'
55export default {
56  name: 'UpLoad',
57  data(){
58    return{
59       form:{
60        fileList:[],
61        versionCode:"",
62        versionName:"",
63        isSystem:true,
64        content:""
65      }
66    }
67  },
68  methods:{
69    onSubmit(){
70      let mutipartFile = new FormData();
71      console.log(this.form.fileList);
72      mutipartFile.append("versionCode",this.form.versionCode);
73      mutipartFile.append("versionName",this.form.versionName);
74      mutipartFile.append("content",this.form.isSystem?this.form.content:"");
75      mutipartFile.append("file",this.form.fileList[0].raw);
76      let loading = Loading.service();
77      loading.$nextTick(()=>{
78        axios.post("/api/upload",mutipartFile,{
79          Headers:{
80            'Content-Type': 'multipart/form-data'
81          }
82        }).then(()=>{
83          loading.close();
84          this.$message({message: '上传成功！',type: 'success'});
85        });
86      })
87    },
88    handleChange(file){
89      this.form.fileList[0]=file;
90    }
91  }
92}
93</script>
94<style>
95#info {
96  background: #e0f0f0;
97  border-radius: .5em;
98  padding: 2em;
99}
100</style>