element 2 图片上传
一、<el-upload action="/api/common/upload" accept=".jpg,.png" :show-file-list="false" :on-success="uploadSuccess"> <el-avatar class="el-dropdown-avatar" :size="100" :src="form.imagePath === null ? require('@/assets/avatar.png') : form.imagePath"></el-avatar> </el-upload>
uploadSuccess(re, file) { this.form.imagePath = re.response this.submitForm() },二、 <el-upload class="upload-demo" action="" :http-request="uploadMethod1" :show-file-list="false" :before-upload="beforeAvatarUpload" :limit="20"> <el-button type="success">选择封面</el-button> </el-upload>
// 上传封面获取连接 async uploadMethod1 (params) { const fd = new FormData() fd.append('file', params.file) const loading = this.$loading({ lock: true, text: 'Loading', spinner: 'el-icon-loading', background: 'rgba(0, 0, 0, 0.7)' }) const res = await axios({ baseURL: process.env.VUE_APP_URL, url: '/api/common/upload', method: 'post', data: fd }) if (res.data.code === 1) { this.form.logo = res.data.response } else { this.$message({ showClose: true, message: '上传失败', type: 'error' }) } loading.close() }, beforeAvatarUpload (file) { const isJPG = [ 'image/jpeg', 'image/png', 'image/gif', 'image/bmp' ].includes(file.type) const isLt2M = file.size / 1024 / 1024 < 30 if (!isJPG) { this.$message.error('上传头像图片要求 JPG PNG GIF BNP 格式!') } if (!isLt2M) { this.$message.error('上传头像图片大小不能超过 30MB!') } return isJPG && isLt2M },
vue-print-nb 打印
<template> <el-container id="printArea" class="app-item-contain"> </el-container>
</template>
<script>
import print from 'vue-print-nb'
export default {
components: { QuestionAnswerShow },
directives: { print },
data () { return {
print: {
id: 'printArea',
popTitle: '配置页眉标题', // 打印配置页上方的标题
// extraHead: '打印', // 最上方的头部文字，附加在head标签上的额外标签，使用逗号分割
// preview: true, // 是否启动预览模式，默认是false
previewTitle: '学生成绩单', // 打印预览的标题
// previewPrintBtnLabel: '预览结束，开始打印',
// 打印预览的标题下方的按钮文本，点击可进入打印
zIndex: 20002, // 预览窗口的z-index，默认是20002，最好比默认值更高
// previewBeforeOpenCallback () { console.log('正在加载预览窗口！');
console.log(that.msg, this) }, // 预览窗口打开之前的callback
// previewOpenCallback () { console.log('已经加载完预览窗口，预览打开了！') },
// 预览窗口打开时的callback // beforeOpenCallback () { console.log('开始打印之前！') }, // 开始打印之前的callback // openCallback () { console.log('执行打印了！') }, // 调用打印时的callback // closeCallback () { console.log('关闭了打印工具！') }, // 关闭打印的callback(无法区分确认or取消) // clickMounted () { console.log('点击v-print绑定的按钮了！') }, // url: 'http://localhost:8080/', // 打印指定的URL，确保同源策略相同 // asyncUrl (reslove) { // setTimeout(() => { // reslove('http://localhost:8080/') // }, 2000) // }, standard: '', extarCss: '' }, } },}</script>
