自定义还上传动态壁纸白屏;历史反馈弹窗显示异常
This commit is contained in:
parent
e5d031e56c
commit
eac8854337
|
@ -165,6 +165,7 @@ export default defineComponent(() => {
|
|||
<div
|
||||
onClick={() => {
|
||||
layout.changeBackground(item.url)
|
||||
background.state.isCustom = false
|
||||
}}
|
||||
class="h-[156px] relative cursor-pointer group w-full flex-grow-0 rounded-xl overflow-hidden"
|
||||
>
|
||||
|
|
|
@ -1,16 +1,18 @@
|
|||
import upload, { localPrefix, uploadLocal } from '@/utils/upload'
|
||||
import clsx from 'clsx'
|
||||
import { defineComponent, ref, toRef } from 'vue'
|
||||
import { computed, defineComponent, ref, toRef } from 'vue'
|
||||
import useBackgroundStore from './useBackgroundStore'
|
||||
import useResource from './useResource'
|
||||
import useLayoutStore from '../useLayoutStore'
|
||||
import { message } from 'ant-design-vue'
|
||||
import { BgContent } from '.'
|
||||
|
||||
export default defineComponent(() => {
|
||||
const dragging = ref(false)
|
||||
const fileInput = ref<HTMLInputElement | null>(null)
|
||||
const backgroundStore = useBackgroundStore()
|
||||
const tempFile = ref<File | null>(null)
|
||||
const layout = useLayoutStore()
|
||||
const tempBackground = ref('')
|
||||
const handleDrop = (e: DragEvent) => {
|
||||
e.preventDefault()
|
||||
|
@ -21,6 +23,15 @@ export default defineComponent(() => {
|
|||
tempBackground.value = URL.createObjectURL(file)
|
||||
tempFile.value = file
|
||||
}
|
||||
const showImg = computed(() => {
|
||||
if (tempBackground.value) {
|
||||
return tempBackground.value
|
||||
}
|
||||
if (backgroundStore.state.isCustom) {
|
||||
return layout.background.video? layout.background.video: layout.background.image
|
||||
}
|
||||
return ''
|
||||
})
|
||||
return () => (
|
||||
<div class={'w-full h-full flex flex-col items-center pt-5 pb-10 gap-y-4'}>
|
||||
<div class="flex flex-col text-center gap-y-1">
|
||||
|
@ -47,16 +58,28 @@ export default defineComponent(() => {
|
|||
|
||||
dragging.value ? 'border-[#3f80ff] bg-[#6b9dff1a]' : 'border-transparent bg-[#ebebeb]'
|
||||
)}
|
||||
style={
|
||||
tempBackground.value
|
||||
? {
|
||||
backgroundImage: `url(${tempBackground.value})`,
|
||||
backgroundSize: 'cover',
|
||||
backgroundRepeat: 'no-repeat'
|
||||
}
|
||||
: {}
|
||||
}
|
||||
// style={
|
||||
// tempBackground.value
|
||||
// ? {
|
||||
// backgroundImage: `url(${tempBackground.value})`,
|
||||
// backgroundSize: 'cover',
|
||||
// backgroundRepeat: 'no-repeat'
|
||||
// }
|
||||
// : backgroundStore.state.isCustom
|
||||
// ? {
|
||||
// backgroundImage: `url(${backgroundStore.tag})`,
|
||||
// backgroundSize: 'cover',
|
||||
// backgroundRepeat: 'no-repeat'
|
||||
// }
|
||||
// : null
|
||||
// }
|
||||
>
|
||||
<div class={'absolute top-0 left-0 w-full h-full'}>
|
||||
<BgContent
|
||||
image={showImg.value}
|
||||
video={showImg.value.split('.').pop() === 'mp4' ? tempBackground.value : undefined}
|
||||
></BgContent>
|
||||
</div>
|
||||
<div class={'w-full h-full absolute left-0 top-0 bottom-0 right-0 group'}>
|
||||
<div
|
||||
class={clsx(
|
||||
|
@ -96,7 +119,7 @@ export default defineComponent(() => {
|
|||
if (tempFile.value) {
|
||||
uploadLocal(tempFile.value).then((res) => {
|
||||
useLayoutStore().changeBackground(res)
|
||||
|
||||
backgroundStore.state.isCustom = true
|
||||
tempFile.value = null
|
||||
tempBackground.value = ''
|
||||
message.success('应用成功')
|
||||
|
|
|
@ -2,7 +2,7 @@ import { defineComponent, nextTick, reactive, ref, Transition, watch } from 'vue
|
|||
import useLayoutStore from '../useLayoutStore'
|
||||
import useSettingsStore from '@/settings/useSettingsStore'
|
||||
|
||||
const BgContent = defineComponent({
|
||||
export const BgContent = defineComponent({
|
||||
props: {
|
||||
image: {
|
||||
type: String,
|
||||
|
|
|
@ -3,6 +3,9 @@ import { reactive, ref, watch } from 'vue'
|
|||
|
||||
export default defineStore('background', () => {
|
||||
const tag = ref(localStorage.getItem('backgroundTag') || '')
|
||||
const state = reactive({
|
||||
isCustom: false,
|
||||
})
|
||||
const resource = reactive({
|
||||
type: 'image',
|
||||
brief: '',
|
||||
|
@ -29,6 +32,9 @@ export default defineStore('background', () => {
|
|||
)
|
||||
return {
|
||||
tag,
|
||||
resource
|
||||
resource,
|
||||
state
|
||||
}
|
||||
}, {
|
||||
persist: true
|
||||
})
|
||||
|
|
|
@ -81,7 +81,9 @@ export default defineComponent(() => {
|
|||
{
|
||||
title: '问题描述',
|
||||
customRender: ({ record }) => (
|
||||
<div class="w-[200px] break-all">{record.description}</div>
|
||||
<div class="w-[200px] break-all overflow-hidden text-ellipsis whitespace-nowrap" title={record.description}>
|
||||
{record.description}
|
||||
</div>
|
||||
)
|
||||
},
|
||||
{
|
||||
|
@ -169,9 +171,11 @@ export default defineComponent(() => {
|
|||
<input
|
||||
v-model={data.qq}
|
||||
placeholder="QQ号"
|
||||
maxlength={15}
|
||||
class={'p-2 rounded-lg ' + (isGame.value ? 'bg-white/10' : 'bg-black/5')}
|
||||
/>
|
||||
<input
|
||||
maxlength={12}
|
||||
v-model={data.phone}
|
||||
placeholder="手机号"
|
||||
class={'p-2 rounded-lg ' + (isGame.value ? 'bg-white/10' : 'bg-black/5')}
|
||||
|
|
|
@ -90,7 +90,7 @@ export default defineComponent(() => {
|
|||
)}
|
||||
>
|
||||
<OhVueIcon name="md-stars-twotone" fill="white" scale={1.3} />
|
||||
轻闲
|
||||
轻娱
|
||||
</div>
|
||||
<svg
|
||||
width="200"
|
||||
|
|
|
@ -31,7 +31,7 @@ export default defineComponent(() => {
|
|||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
store.state.list.filter(val => val.title.includes(searchText.value)).sort((a, _) => {
|
||||
return !a.isCompleted ? -1 : 1
|
||||
}).map((item, idx) => (
|
||||
}).map((item, _) => (
|
||||
<div
|
||||
key={item.id}
|
||||
onClick={() => {
|
||||
|
@ -47,7 +47,11 @@ export default defineComponent(() => {
|
|||
)}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation()
|
||||
store.state.list[idx].isCompleted = !item.isCompleted
|
||||
const idx = store.state.list.findIndex(val => val.id === item.id)
|
||||
if (idx !== -1) {
|
||||
store.state.list[idx].isCompleted = !item.isCompleted
|
||||
|
||||
}
|
||||
}}>
|
||||
{
|
||||
!item.isCompleted &&
|
||||
|
|
|
@ -53,7 +53,7 @@ export default defineStore("work", () => {
|
|||
const time = useTimeStore()
|
||||
const remainingTime = computed(() => {
|
||||
|
||||
return dayjs(state.beginTime).add(1, 'minute').diff(dayjs(time.date), 'second')
|
||||
return dayjs(state.beginTime).add(15, 'minute').diff(dayjs(time.date), 'second')
|
||||
})
|
||||
|
||||
const stopTomatoTime = () => {
|
||||
|
|
Loading…
Reference in New Issue