feat: 新增背景图文件上传保存

This commit is contained in:
奔跑的面条 2022-05-29 14:54:35 +08:00
parent b263681dda
commit d639e445eb
2 changed files with 33 additions and 11 deletions

View File

@ -130,9 +130,11 @@ import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore
import { EditCanvasConfigEnum } from '@/store/modules/chartEditStore/chartEditStore.d' import { EditCanvasConfigEnum } from '@/store/modules/chartEditStore/chartEditStore.d'
import { StylesSetting } from '@/components/Pages/ChartItemSetting' import { StylesSetting } from '@/components/Pages/ChartItemSetting'
import { UploadCustomRequestOptions } from 'naive-ui' import { UploadCustomRequestOptions } from 'naive-ui'
import { fileToUrl, loadAsyncComponent } from '@/utils' import { fileToUrl, loadAsyncComponent, fetchRouteParamsLocation } from '@/utils'
import { PreviewScaleEnum } from '@/enums/styleEnum' import { PreviewScaleEnum } from '@/enums/styleEnum'
import { ResultEnum } from '@/enums/httpEnum'
import { icon } from '@/plugins' import { icon } from '@/plugins'
import { uploadFile} from '@/api/path/project'
const { ColorPaletteIcon } = icon.ionicons5 const { ColorPaletteIcon } = icon.ionicons5
const { ZAxisIcon, ScaleIcon, FitToScreenIcon, FitToHeightIcon, FitToWidthIcon } = icon.carbon const { ZAxisIcon, ScaleIcon, FitToScreenIcon, FitToHeightIcon, FitToWidthIcon } = icon.carbon
@ -270,17 +272,30 @@ const switchSelectColorHandle = () => {
// //
const customRequest = (options: UploadCustomRequestOptions) => { const customRequest = (options: UploadCustomRequestOptions) => {
const { file } = options const { file } = options
nextTick(() => { nextTick(async () => {
if (file.file) { if (file.file) {
const ImageUrl = fileToUrl(file.file) //
const newNameFile = new File(
[file.file],
`${fetchRouteParamsLocation()}_index_background.png`,
{ type: file.file.type }
)
let uploadParams = new FormData()
uploadParams.append('object', newNameFile)
const uploadRes:any = await uploadFile(uploadParams)
if(uploadRes.code === ResultEnum.SUCCESS) {
chartEditStore.setEditCanvasConfig( chartEditStore.setEditCanvasConfig(
EditCanvasConfigEnum.BACKGROUND_IAMGE, EditCanvasConfigEnum.BACKGROUND_IAMGE,
ImageUrl uploadRes.data.objectContent.httpRequest.uri
) )
chartEditStore.setEditCanvasConfig( chartEditStore.setEditCanvasConfig(
EditCanvasConfigEnum.SELECT_COLOR, EditCanvasConfigEnum.SELECT_COLOR,
false false
) )
return
}
window['$message'].error('添加图片失败,请稍后重试!')
} else { } else {
window['$message'].error('添加图片失败,请稍后重试!') window['$message'].error('添加图片失败,请稍后重试!')
} }

View File

@ -10,7 +10,7 @@
</n-tooltip> </n-tooltip>
<n-spin <n-spin
v-show="statusDesc === statusDescObj[1]['text']" v-show="statusDesc === statusDescObj[1]['text']"
class="status-spin go-ml-2" class="go-ml-2"
size="small" size="small"
> >
<template #icon> <template #icon>
@ -25,13 +25,19 @@
<script lang="ts" setup> <script lang="ts" setup>
import { ref, toRefs, watch } from 'vue' import { ref, toRefs, watch } from 'vue'
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore' import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
import { useDesignStore } from '@/store/modules/designStore/designStore'
import { SyncEnum } from '@/enums/editPageEnum' import { SyncEnum } from '@/enums/editPageEnum'
import { icon } from '@/plugins' import { icon } from '@/plugins'
import { saveInterval } from '@/settings/designSetting' import { saveInterval } from '@/settings/designSetting'
const { ReloadIcon } = icon.ionicons5 const { ReloadIcon } = icon.ionicons5
const chartEditStore = useChartEditStore() const chartEditStore = useChartEditStore()
const designStore = useDesignStore()
const { saveStatus } = toRefs(chartEditStore.getEditCanvas) const { saveStatus } = toRefs(chartEditStore.getEditCanvas)
const themeColor = ref(designStore.getAppTheme)
const statusDesc = ref('') const statusDesc = ref('')
const descType = ref('') const descType = ref('')
let setTimeoutIns: NodeJS.Timeout = setTimeout(() => {}) let setTimeoutIns: NodeJS.Timeout = setTimeout(() => {})
@ -83,6 +89,7 @@ watch(
} }
.status-desc { .status-desc {
cursor: default; cursor: default;
color: v-bind('themeColor');
font-size: 12px; font-size: 12px;
opacity: 0.8; opacity: 0.8;
} }