SHZHJCYJPTYWXTUI/src/views/appversion/versionupload.vue

<!--
 * @Title: 
 * @Description:  APP上传
 * @Author: swp
 * @Date: 2022-08-24 10:49:21
 * @LastEditors: 
 * @LastEditTime: 2022-08-24 10:49:21
-->
<template>
    <div>
        <el-row>
            <el-col :span="24">
                <basic-container>
                    <avue-form :option="debugOption" v-model="debugForm" />
                </basic-container>
            </el-col>
        </el-row>
        <el-row>
            <el-col :span="24">
                <basic-container>
                    <el-upload ref="upload" :action="uploadUrl" :on-preview="handlePreview" :on-remove="handleRemove"
                        :before-upload="beforeUpload" :on-error="onError" :on-success="onSuccess" :file-list="fileList"
                        :on-progress="onProgress" :auto-upload="false" :multiple="false" limit="1" accept=".apk"
                        :data="postData">
                        <el-button slot="trigger" size="small" type="primary">选择APK文件</el-button>
                        <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">开始上传
                        </el-button>
                        <div slot="tip" class="el-upload__tip">只能上传APK文件</div>
                    </el-upload>
                </basic-container>
            </el-col>
        </el-row>


    </div>
</template>

<script>

import { getToken } from "@/util/auth";
import { validatenull } from "@/util/validate";

export default {
    data() {
        return {
            fileName: '',
            editForm: {},
            editDialog: false,
            form: {},
            selectionList: [],
            query: {},
            loading: true,
            postData: {},
            uploadUrl: '',
            debugForm: {},
            debugOption: {
                labelWidth: 150,
                submitBtn: false,
                emptyBtn: false,
                column: [
                    {
                        label: 'APPID',
                        prop: 'appId',
                        type: 'input',
                        span: 24,
                    },
                    {
                        label: '版本号',
                        prop: 'version',
                        type: 'input',
                        span: 24,
                    },
                    {
                        label: '版本升级提示',
                        prop: 'versionNote',
                        type: 'input',
                        span: 24,
                    },

                ]
            }
        };
    },

    props: {
        visible: {
            tyep: [Boolean],
            default: false,
        },
        importLoading: {
            tyep: [Boolean],
            default: false,
        }
    },
    name: 'versionupload',
    created() {
        this.init();
    },
    methods: {
        init() {
            this.uploadUrl = this.getUploadUrl();
        },
        submitUpload() {
            if (validatenull(this.debugForm.appId) && validatenull(this.debugForm.version)) {
                this.$message.warning("请录入APPID和版本号！");
                return;
            }
            this.postData['appId'] = this.debugForm.appId;
            this.postData['version'] = this.debugForm.version;
            this.postData['versionNote'] = this.debugForm.versionNote;
            this.$refs.upload.submit();
            this.$message.success('已成功上传APK!')
        },
        handleRemove(file, fileList) {
            console.log(file, fileList);
            this.$message.success('handleRemove')
        },
        handlePreview(file) {
            console.log(file);
            this.$message.success('handlePreview')
        },
        beforeUpload(file) {
            console.log(file);
            this.$message.success('beforeUpload')
            return true;
        },
        getUploadUrl: function () {
            return `/api/galaxy-business/version/apk?${this.website.tokenHeader
                }=${getToken()}`;
        },
        onProgress(event, file, fileList) {
            console.log(file, fileList);
            this.$emit("update:importLoading", true);
        },
        onError(err, file, fileList) {
            console.log(file, fileList);
            this.$message.warning(err);
        },
        onSuccess(response, file, fileList) {
            console.log(response);
            console.log(file);
            console.log(fileList);
            this.$message.warning("提交成功");
            this.$refs.upload.clearFiles();
            this.$emit("update:importLoading", false);
            this.$emit("update:visible", false);
        },
    },
};
</script>
<style>
.mb0 {
    margin-top: 10;

}
</style>