iview 上传附件

在这里插入图片描述

<!DOCTYPE html>
<html>

<head>
    @@include('app/inc/header-auth.inc')

    <style>
        #vue-object {
				padding: 10px;
			}
			.search-file {
				padding: 5px;
				background: #ffffff;
				display: inline-block;
				width: 100%;
                height: 100px;
			}
		
		
		</style>
</head>

<body>

    <div class="main" id="vue-object">
        <div class="search-file">

            <div class="control wp100">
                <Upload type="ghost" :action="getUploadUrl()" :on-success="handleSuccess" :headers="getCookie()"
                    v-model="formValidate.flie" :on-preview="onPreview"  :format="['jpg','jpeg','png','doc','txt','xls','pdf','xlsx','docx']" :on-format-error="handleFormatError"
                    style="width:90%" :default-file-list="formValidate.mylist">
                    <i-button icon="ios-cloud-upload-outline">上传文件</i-button>
                </Upload>
            </div>

        </div>
        <div class="sub">
            <template>
                <i-button @click="close" style="width:120px">取消</i-button>

            </template>
        </div>
    </div>

</body>

<script>
    (function () {
        window.vueObject = new Vue({
            el: "#vue-object",
            data: {
                formValidate: {
                    flie: ''

                },



            },

            created: function () {

            },
            methods: {
                //上传
                getUploadUrl() {
                    return app_server + "/auth/crm/resource/importData"
                },
                handleSuccess(res, file) {
                    var that = this;
                    if (res.code == '200') {
                        msg(res.data);
                        if (parent.layer) {
                            parent.layer.close(parent.layer.getFrameIndex(window.name));
                        }
                        parent.location.reload();
                    } else {
                        errorMsg(res.data);

                    }
                },
                getCookie() {
                    var cookie = getSessionTokenFromCookie();
                    return {
                        'Session-Token': cookie
                    }
                },
                onPreview(file) {
                    window.open(file.url);
                },
                handleFormatError(file) {
                    errorMsg('文件' + file.name + "格式不正确");
                },
                close() {
                    if (parent.layer) {
                        parent.layer.close(parent.layer.getFrameIndex(window.name));
                    }
                },
            }
        });
    }());
</script>

</html>
Logo
AI 知识库会话

更多推荐

Argo CD 使用

Argo CD是用于Kubernetes的声明性GitOps持续交付工具，遵循GitOps模式，该模式使用Git仓库作为定义所需应用程序状态的真实来源。Argo CD可在指定的目标环境中自动部署所需的应用程序状态，应用程序部署可以在Git提交时跟踪对分支，标签的更新，或固定到清单的特定版本。argoCD支持的Kubernetes 配置清单包括helm charts、kustomize或纯YAML/

avatar AI 知识库会话

SpringBoot的竞争对手——Micronaut入门教程

1.Micronaut是什么？Micronaut是一个现代化的、基于JVM的、全栈的微服务框架，旨在构建模块化、易于测试的微服务应用程序。Micronaut是由Grails框架的创建者开发的，并从多年来的使用Spring、SpringBoot和Grails经验教训中吸取了灵感。构建出了一套从Monolith到微服务的现代化的应用程序。Micronaut旨在提供构建功能齐全的微服务应用程序所需...

avatar AI 知识库会话
cover

quarkus依赖注入之四：选择注入bean的高级手段

avatar AI 知识库会话