From add1f3a47b95e4b78f25308d0134bc484f1f08dd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=9D=8E=E5=BC=BA?= <1206709430@qq.com> Date: Mon, 25 Apr 2022 15:55:23 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96:=20=E6=96=87=E4=BB=B6?= =?UTF-8?q?=E5=8F=8A=E5=9B=BE=E7=89=87=E4=B8=8A=E4=BC=A0=E5=85=A8=E5=B1=80?= =?UTF-8?q?=E9=85=8D=E7=BD=AE=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- backend/dvadmin/system/views/file_list.py | 10 +- web/src/config/d2p-extends/types.js | 118 ++++++++++++++++++++++ web/src/install.js | 13 ++- web/src/views/demo/page1/crud.js | 40 -------- web/src/views/system/fileList/crud.js | 19 +--- web/src/views/system/user/crud.js | 25 +---- 6 files changed, 130 insertions(+), 95 deletions(-) create mode 100644 web/src/config/d2p-extends/types.js diff --git a/backend/dvadmin/system/views/file_list.py b/backend/dvadmin/system/views/file_list.py index 87c4355..82fc757 100644 --- a/backend/dvadmin/system/views/file_list.py +++ b/backend/dvadmin/system/views/file_list.py @@ -1,11 +1,3 @@ -# -*- coding: utf-8 -*- - -""" -@author: 猿小天 -@contact: QQ:1638245306 -@Created on: 2021/8/9 009 20:48 -@Remark: -""" from rest_framework import serializers from dvadmin.system.models import FileList @@ -17,7 +9,7 @@ class FileSerializer(CustomModelSerializer): url = serializers.SerializerMethodField(read_only=True) def get_url(self, instance): - return 'media/'+str(instance.url) + return 'media/' + str(instance.url) class Meta: model = FileList diff --git a/web/src/config/d2p-extends/types.js b/web/src/config/d2p-extends/types.js new file mode 100644 index 0000000..aaf9622 --- /dev/null +++ b/web/src/config/d2p-extends/types.js @@ -0,0 +1,118 @@ +export default { + 'image-uploader': { + form: { component: { name: 'd2p-file-uploader', props: { elProps: { listType: 'picture-card', accept: '.png,.jpeg,.jpg,.ico,.bmp,.gif' } } } }, + component: { name: 'd2p-images-format' }, + view: { + component: { props: { height: 100, width: 100 } } + }, + align: 'center', + // 提交时,处理数据 + valueResolve (row, col) { + const value = row[col.key] + if (value != null) { + if (value.length >= 0) { + if (value instanceof Array) { + row[col.key] = value.toString() + } else { + row[col.key] = value[0] + } + } else { + row[col.key] = null + } + } + }, + // 接收时,处理数据 + valueBuilder (row, col) { + const value = row[col.key] + if (value != null) { + row[col.key] = value.split(',') + } + } + }, + 'avatar-uploader': { + form: { component: { name: 'd2p-file-uploader', props: { elProps: { limit: 1, listType: 'avatar', accept: '.png,.jpeg,.jpg,.ico,.bmp,.gif', showFileList: false } } } }, + component: { name: 'd2p-images-format' }, + view: { + component: { props: { height: 100, width: 100 } } + }, + align: 'center', + // 提交时,处理数据 + valueResolve (row, col) { + const value = row[col.key] + if (value != null) { + if (value.length >= 0) { + if (value instanceof Array) { + row[col.key] = value.toString() + } else { + row[col.key] = value[0] + } + } else { + row[col.key] = null + } + } + }, + // 接收时,处理数据 + valueBuilder (row, col) { + const value = row[col.key] + if (value != null) { + row[col.key] = value.split(',') + } + } + }, + 'file-uploader': { + form: { component: { name: 'd2p-file-uploader', props: { elProps: { listType: 'text' } } } }, + component: { name: 'd2p-files-format' }, + // 提交时,处理数据 + valueResolve (row, col) { + const value = row[col.key] + if (value != null) { + if (value.length >= 0) { + if (value instanceof Array) { + row[col.key] = value.toString() + } else { + row[col.key] = value[0] + } + } else { + row[col.key] = null + } + } + }, + // 接收时,处理数据 + valueBuilder (row, col) { + const value = row[col.key] + if (value != null) { + row[col.key] = value.split(',') + } + } + }, + 'avatar-cropper': { + form: { component: { name: 'd2p-cropper-uploader', props: { accept: '.png,.jpeg,.jpg,.ico,.bmp,.gif', cropper: { viewMode: 1 } } } }, + component: { name: 'd2p-images-format' }, + align: 'center', + view: { + component: { props: { height: 100, width: 100 } } + }, + // 提交时,处理数据 + valueResolve (row, col) { + const value = row[col.key] + if (value != null) { + if (value.length >= 0) { + if (value instanceof Array) { + row[col.key] = value.toString() + } else { + row[col.key] = value[0] + } + } else { + row[col.key] = null + } + } + }, + // 接收时,处理数据 + valueBuilder (row, col) { + const value = row[col.key] + if (value != null) { + row[col.key] = value.split(',') + } + } + } +} diff --git a/web/src/install.js b/web/src/install.js index 9254a2f..0b895d7 100644 --- a/web/src/install.js +++ b/web/src/install.js @@ -15,7 +15,8 @@ import { import { request } from '@/api/service' import util from '@/libs/util' import XEUtils from 'xe-utils' -import { urlPrefix as deptPrefix } from '@/views/system/dept/' +import { urlPrefix as deptPrefix } from '@/views/system/dept/api' +import types from '@/config/d2p-extends/types' const uploadUrl = util.baseURL() + 'api/system/file/' /** @@ -163,20 +164,22 @@ Vue.use(D2pUploader, { action: uploadUrl, name: 'file', data: {}, // 上传附加参数 - headers: { - Authorization: 'JWT ' + util.cookies.get('token') + headers () { + return { + Authorization: 'JWT ' + util.cookies.get('token') + } }, type: 'form', successHandle (ret, option) { if (ret.data === null || ret.data === '') { throw new Error('上传失败') } - return { url: util.baseURL() + 'media/' + ret.data.data.url, key: option.data.key } + return { url: util.baseURL() + ret.data.url, key: option.data.key } }, withCredentials: false // 是否带cookie } }) - +d2CrudPlus.util.columnResolve.addTypes(types) // 修改官方字段类型 const selectType = d2CrudPlus.util.columnResolve.getType('select') selectType.component.props.color = 'auto' // 修改官方的字段类型，设置为支持自动染色 diff --git a/web/src/views/demo/page1/crud.js b/web/src/views/demo/page1/crud.js index 5919f81..b373b1d 100644 --- a/web/src/views/demo/page1/crud.js +++ b/web/src/views/demo/page1/crud.js @@ -92,26 +92,6 @@ export const crudOptions = (vm) => { span: 24 }, helper: '限制文件大小不能超过50k' - }, - valueResolve (row, col) { - const value = row[col.key] - if (value != null && value instanceof Array) { - if (value.length >= 0) { - row[col.key] = value[0] - } else { - row[col.key] = null - } - } - }, - component: { - props: { - buildUrl (value, item) { - if (value && value.indexOf('http') !== 0) { - return '/api/upload/form/download?key=' + value - } - return value - } - } } }, { @@ -132,26 +112,6 @@ export const crudOptions = (vm) => { span: 24 }, helper: '限制文件大小不能超过50k' - }, - valueResolve (row, col) { - const value = row[col.key] - if (value != null && value instanceof Array) { - if (value.length >= 0) { - row[col.key] = value[0] - } else { - row[col.key] = null - } - } - }, - component: { - props: { - buildUrl (value, item) { - if (value && value.indexOf('http') !== 0) { - return '/api/upload/form/download?key=' + value - } - return value - } - } } }, { diff --git a/web/src/views/system/fileList/crud.js b/web/src/views/system/fileList/crud.js index d987be9..b4f009c 100644 --- a/web/src/views/system/fileList/crud.js +++ b/web/src/views/system/fileList/crud.js @@ -1,5 +1,3 @@ -import util from '@/libs/util' - export const crudOptions = (vm) => { return { pageOptions: { @@ -92,11 +90,7 @@ export const crudOptions = (vm) => { search: { disabled: true }, - width: 220, - valueBuilder (row, key) { - console.log(row, key) - row.url = `${util.baseURL()}media/${row.url}` - } + width: 220 }, { title: '文件MD5', @@ -107,18 +101,7 @@ export const crudOptions = (vm) => { }, form: { disabled: false - }, - valueResolve (row, col) { - const value = row[col.key] - if (value != null && value instanceof Array) { - if (value.length >= 0) { - row[col.key] = value[0] - } else { - row[col.key] = null - } - } } - }, { title: '备注', diff --git a/web/src/views/system/user/crud.js b/web/src/views/system/user/crud.js index ca46425..a105645 100644 --- a/web/src/views/system/user/crud.js +++ b/web/src/views/system/user/crud.js @@ -1,7 +1,6 @@ import { request } from '@/api/service' import { BUTTON_STATUS_BOOL } from '@/config/button' import { urlPrefix as deptPrefix } from '../dept/api' -import util from '@/libs/util' export const crudOptions = (vm) => { return { @@ -267,31 +266,11 @@ export const crudOptions = (vm) => { multiple: true, limit: 5 // 限制5个文件 }, - sizeLimit: 100 * 1024 // 不能超过限制 + sizeLimit: 500 * 1024 // 不能超过限制 }, span: 24 }, - helper: '限制文件大小不能超过50k' - }, - valueResolve (row, col) { - const value = row[col.key] - if (value != null && value instanceof Array) { - if (value.length >= 0) { - row[col.key] = value[0] - } else { - row[col.key] = null - } - } - }, - component: { - props: { - buildUrl (value, item) { - if (value && value.indexOf('http') !== 0) { - return util.baseURL() + value - } - return value - } - } + helper: '限制文件大小不能超过500k' } }, {