From 133cfa50d6429504b6c18a36c20472a6a872805a Mon Sep 17 00:00:00 2001 From: long <515897141@qq.com> Date: 星期一, 07 六月 2021 15:08:05 +0800 Subject: [PATCH] 添加规则模板页 --- src/pages/system/basic.vue | 83 +++++------------------------------------ 1 files changed, 10 insertions(+), 73 deletions(-) diff --git a/src/pages/system/basic.vue b/src/pages/system/basic.vue index ebcdc98..0a1403c 100644 --- a/src/pages/system/basic.vue +++ b/src/pages/system/basic.vue @@ -13,22 +13,11 @@ 鍒嗕韩鍥剧墖锛�<br><span>(500*400鍍忕礌)</span> </span> <!-- 涓婁紶鍥剧墖缁勪欢(鍗曞浘) --> - <el-upload - ref="refUploadShareImg" - :auto-upload="false" - list-type="picture-card" - :class="{disabled:uploadDisabled}" - action="#" - :limit="1" - :file-list="basicData.uploadShareImgs" - :on-change="addUploadFiles" - :on-remove="delUploadFiles" - :http-request="uploadFileHandle" - :on-preview="uploadPreview" - :before-upload="beforeUploadImg" - > - <i class="el-icon-plus" /> - </el-upload> + <UploadSingleImg + ref="refUploadImg" + v-model="dialogData.uploadShareImgs" + @change.capture="$refs['basicForm'].clearValidate()" + /> </el-form-item> </el-form> @@ -46,9 +35,10 @@ <script> import mixin_upload from '@/mixins/upload.js' // 閫氱敤涓婁紶鍥剧墖棰勮 +import UploadSingleImg from '@/components_simple/UploadSingleImg' export default { components: {}, - mixins: [mixin_upload], + mixins: [mixin_upload, UploadSingleImg], data() { return { basicData: { @@ -65,11 +55,6 @@ required: true, message: '璇烽�夋嫨鍥剧墖' }] } - } - }, - computed: { - uploadDisabled() { - return this.basicData.uploadShareImgs.length > 0 } }, mounted() { @@ -103,61 +88,13 @@ this.$router.go(-1) }, - // 涓婁紶鏀粯鏂囦欢 鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌 - // 涓婁紶鍓嶇‘璁ゆ牸寮� - beforeUploadImg(file) { - const isImg = file.type.indexOf('image/') > -1 - if (!isImg) { - this.$message.error('蹇呴』鏄�夋嫨鍥剧墖鏂囦欢') - } - return isImg - }, - // 澧炲姞鏂囦欢 - addUploadFiles(file) { - this.basicData.uploadShareImgs = [file] - }, - // 鍒犻櫎鏂囦欢 - delUploadFiles(file, fileList) { - this.basicData.uploadShareImgs = fileList - }, - // 鎵ц涓婁紶鍗曟枃浠� - runUploadFiles(cb) { - if (this.checkNeedUpload(this.basicData.uploadShareImgs)) { - this.$refs.refUploadShareImg.submit() - } else { - cb && cb() - } - }, - // 涓婁紶鍒嗕韩鍥� - uploadFileHandle(res) { - const file = res.file - const formData = new FormData() - formData.append('file', file) - console.log(formData) - this.postFN({ - url: 'admin/image/upload', - header: { 'Content-Type': 'multipart/form-data' }, - params: formData, - mockData: { - code: 100, - msg: '', - data: { - imgUrl: 'xxx' - } - } - }, (inf) => { - this.basicData.shareImg = inf.imgUrl - // this.$refs.refUploadShareImg.clearFiles(); - this.submitReq() - }) - }, - // 涓婁紶鏀粯鏂囦欢 鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈 - // 鎻愪氦缂栬緫 submit() { this.$refs['basicForm'].validate(valid => { if (valid) { - this.runUploadFiles(() => { + // 涓婁紶鍥剧墖 + this.$refs.refUploadImg.runUploadImg((imgUrl) => { + imgUrl && this.$set(this.dialogData, 'shareImg', imgUrl) this.submitReq() }) } -- Gitblit v1.8.0