fix: update

bak
elseif 1 year ago
parent 67842d2fcc
commit 45c6071120

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 230 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 230 KiB

@ -20,6 +20,7 @@ const actionConfig = {
3: [{ label: '查看', key: 'view' }, { label: '重置审批', key: 'reset' }], 3: [{ label: '查看', key: 'view' }, { label: '重置审批', key: 'reset' }],
4: [{ label: '查看', key: 'view' }, { label: '重置审批', key: 'reset' }], 4: [{ label: '查看', key: 'view' }, { label: '重置审批', key: 'reset' }],
2: [{ label: '通过', key: 'approval' }, { label: '不通过', key: 'reject' }, { label: '重置审批', key: 'reset' }], 2: [{ label: '通过', key: 'approval' }, { label: '不通过', key: 'reject' }, { label: '重置审批', key: 'reset' }],
5: [{ label: '通过', key: 'approval' }, { label: '不通过', key: 'reject' }, { label: '重置审批', key: 'reset' }],
} }
const actions = computed(() => { const actions = computed(() => {

@ -1,12 +1,4 @@
<script lang="ts" setup> <script lang="ts" setup>
import { getAllfieldList } from '@/api/home/filter'
import { audit } from '@/api/task/task'
import { getTaskDetailInfo, getTaskDetailPictureList } from '@/api/work/work'
import { useTask } from '@/store/modules/task'
import { useUser } from '@/store/modules/user'
import { isEmpty } from '@/utils'
import { hideDownload } from '@/utils/image'
import emitter from '@/utils/mitt'
import { chunk, clone } from 'lodash-es' import { chunk, clone } from 'lodash-es'
import { useDialog, useMessage } from 'naive-ui' import { useDialog, useMessage } from 'naive-ui'
import { computed, onUnmounted, reactive, ref, unref, watch } from 'vue' import { computed, onUnmounted, reactive, ref, unref, watch } from 'vue'
@ -15,7 +7,16 @@ import ConfrimModal from '../modal/ConfrimModal.vue'
import CustomSettingModal from '../modal/CustomSettingModal.vue' import CustomSettingModal from '../modal/CustomSettingModal.vue'
import PictureTable from './PictureTable.vue' import PictureTable from './PictureTable.vue'
import TaskTable from './TaskTable.vue' import TaskTable from './TaskTable.vue'
import { getAllfieldList } from '@/api/home/filter'
import { audit } from '@/api/task/task'
import { getTaskDetailInfo, getTaskDetailPictureList } from '@/api/work/work'
import { useTask } from '@/store/modules/task'
import { useUser } from '@/store/modules/user'
import { isEmpty } from '@/utils'
import { hideDownload } from '@/utils/image'
import emitter from '@/utils/mitt'
import type { ApprovalParam, PictureSortParam } from '/#/api' import type { ApprovalParam, PictureSortParam } from '/#/api'
import { formatToDateHMS } from '@/utils/dateUtil'
const batch = ref(false) const batch = ref(false)
const selectItems = ref<any[]>([]) const selectItems = ref<any[]>([])
@ -349,6 +350,18 @@ function getPercent(pictureid: string) {
@click.stop="rejectHandler" @click.stop="rejectHandler"
/> />
</div> </div>
<div class="check">
<n-checkbox
v-show="batch"
v-model:checked="taskDetailInfo.checked"
@click.stop
@update:checked="onCheckChange($event, taskDetailInfo)"
/>
</div>
<div class="status">
<SvgIcon v-show="taskDetailInfo?.states === 4" width="134" height="129" name="p1" />
<SvgIcon v-show="taskDetailInfo?.states === 3" width="134" height="129" name="p2" />
</div>
<div class="mark"> <div class="mark">
<SvgIcon v-show="taskDetailInfo?.iztrueorfalse === 0" size="128" name="jia" /> <SvgIcon v-show="taskDetailInfo?.iztrueorfalse === 0" size="128" name="jia" />
</div> </div>
@ -379,7 +392,7 @@ function getPercent(pictureid: string) {
</div> </div>
<div class="time"> <div class="time">
<SvgIcon color="#FFF" size="16" name="time" /> <SvgIcon color="#FFF" size="16" name="time" />
<span>2023-09-17 13:09:10</span> <span>{{ formatToDateHMS(taskDetailInfo.createdate || 0) }}</span>
</div> </div>
<div style="display: none;"> <div style="display: none;">
<n-image ref="imageRef" :img-props="{ onClick: hideDownload }" :src="taskDetailInfo?.ocrPicture?.imgurl" /> <n-image ref="imageRef" :img-props="{ onClick: hideDownload }" :src="taskDetailInfo?.ocrPicture?.imgurl" />
@ -589,6 +602,20 @@ function getPercent(pictureid: string) {
flex-direction: column; flex-direction: column;
justify-content: center justify-content: center
} }
.check{
position: absolute;
z-index: 3;
left: 2%;
top: 2%;
}
.status{
position: absolute;
z-index: 3;
left: 3%;
top: 3%;
}
} }
.right { .right {

@ -1,9 +1,10 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed, onMounted, onUpdated, reactive, ref, watch } from 'vue' import { computed, nextTick, onMounted, onUpdated, reactive, ref, watch } from 'vue'
import Masonry from 'masonry-layout' import Masonry from 'masonry-layout'
import { useInfiniteScroll } from '@vueuse/core' import { useInfiniteScroll } from '@vueuse/core'
import { debounce } from 'lodash-es' import { debounce } from 'lodash-es'
import imagesloaded from 'imagesloaded' import imagesloaded from 'imagesloaded'
import { useMessage } from 'naive-ui'
import { timeOptions, viewOptions } from '@/config/home' import { timeOptions, viewOptions } from '@/config/home'
import { off, on } from '@/utils/domUtils' import { off, on } from '@/utils/domUtils'
import { useTask } from '@/store/modules/task' import { useTask } from '@/store/modules/task'
@ -46,10 +47,10 @@ const el = ref<HTMLDivElement | null>(null)
const listData = ref<any[]>([]) const listData = ref<any[]>([])
const taskDetailInfo = ref<any>({}) const taskDetailInfo = ref<any>({})
const pagination = reactive({ const pagination = reactive({
pageNo: 1, pageNo: 0,
pageSize: 30, pageSize: 30,
}) })
let loading = false const loading = ref(false)
let _masonry: null | Masonry = null let _masonry: null | Masonry = null
const show = ref(false) const show = ref(false)
const sortBy: PictureSortParam = { const sortBy: PictureSortParam = {
@ -57,6 +58,8 @@ const sortBy: PictureSortParam = {
orderbyvalue: 'fromuptime', orderbyvalue: 'fromuptime',
} }
const batch = ref(false) const batch = ref(false)
let _imagesload: any
const message = useMessage()
const layout = debounce(() => { const layout = debounce(() => {
if (!show.value) if (!show.value)
@ -72,13 +75,18 @@ const layout = debounce(() => {
stagger: 10, stagger: 10,
}) })
imagesloaded('.grid-item', () => { _imagesload = imagesloaded('.grid-item')
_imagesload.on('done', (instance) => {
(_masonry as any).layout() (_masonry as any).layout()
const scrollHeight = el.value!.scrollHeight if (!el.value)
const clientHeight = el.value!.clientHeight return
const top = scrollHeight - clientHeight - 20 loading.value = false
el.value!.scrollTo({ top, behavior: 'instant' }) })
loading = false
_imagesload.on('fail', (instance) => {
message.error('图片错误')
loading.value = false
}) })
}, 300) }, 300)
@ -96,27 +104,8 @@ useInfiniteScroll(
{ distance: 10, canLoadMore: () => canloadMore }, { distance: 10, canLoadMore: () => canloadMore },
) )
async function featchList() {
loading = true
try {
const packageid = taskStore.getPackageid
const taskId = taskStore.getActiveId
const res = await getTaskDetailPictureList(packageid, taskId, { ...pagination, ...sortBy })
const { data, pageCount } = res
pagination.pageNo += 1
canloadMore = pageCount >= pagination.pageNo
return data
}
catch (error) {
return []
}
}
async function loadMore() { async function loadMore() {
if (loading || el.value == null) if (loading.value || el.value == null)
return return
const packageid = taskStore.getPackageid const packageid = taskStore.getPackageid
@ -127,11 +116,28 @@ async function loadMore() {
const more = await featchList() const more = await featchList()
listData.value.push(...more) listData.value.push(...more)
} nextTick(() => {
onUpdated(() => {
layout() layout()
}) })
}
async function featchList() {
loading.value = true
try {
const packageid = taskStore.getPackageid
const taskId = taskStore.getActiveId
pagination.pageNo += 1
const { data, pageCount } = await getTaskDetailPictureList(packageid, taskId, { ...pagination, ...sortBy })
canloadMore = pageCount >= pagination.pageNo && pageCount > 0
return data
}
catch (error) {
canloadMore = false
return []
}
}
let start: { x: number, y: number } | null = null let start: { x: number, y: number } | null = null
let selectionBox: HTMLDivElement | null let selectionBox: HTMLDivElement | null
@ -292,7 +298,17 @@ function getSelectItems() {
return listData.value.filter(item => selectIds.value.includes(item.id)) return listData.value.filter(item => selectIds.value.includes(item.id))
} }
function reset() {
pagination.pageNo = 0
pagination.pageSize = 30
listData.value.length = 0
loading.value = false
canloadMore = true
layout()
}
async function refreshHandler() { async function refreshHandler() {
reset()
const packageid = taskStore.getPackageid const packageid = taskStore.getPackageid
const taskId = taskStore.getActiveId const taskId = taskStore.getActiveId
@ -301,13 +317,15 @@ async function refreshHandler() {
taskDetailInfo.value = await getTaskDetailInfo(taskId, packageid) taskDetailInfo.value = await getTaskDetailInfo(taskId, packageid)
pagination.pageNo = 1 nextTick(() => {
pagination.pageSize = 30 useInfiniteScroll(
listData.value.length = 0 el as any,
() => {
const list = await featchList() loadMore()
listData.value = list },
layout() { distance: 10, canLoadMore: () => canloadMore },
)
})
} }
watch(() => taskStore.activeId, async (newValue, oldValue) => { watch(() => taskStore.activeId, async (newValue, oldValue) => {
@ -418,7 +436,7 @@ watch(() => taskStore.activeId, async (newValue, oldValue) => {
> >
<img <img
class="wrapper-content-item-img" class="wrapper-content-item-img"
:class="{ 'wrapper-content-item-img-fit': viewMode !== 'masonry' }" :src="item.imgurl" :class="{ 'wrapper-content-item-img-fit': viewMode !== 'masonry' }" :src="item.thumburl"
> >
<div class="top"> <div class="top">
<n-checkbox <n-checkbox
@ -614,7 +632,7 @@ watch(() => taskStore.activeId, async (newValue, oldValue) => {
.scroll { .scroll {
overflow-y: scroll; overflow-y: scroll;
height: calc(100vh - 320px); height: calc(100vh - 420px);
} }
} }
} }

@ -248,10 +248,6 @@ const layout = debounce(() => {
_imagesload.on('done', (instance) => { _imagesload.on('done', (instance) => {
if (!el.value) if (!el.value)
return return
// const scrollHeight = el.value!.scrollHeight
// const clientHeight = el.value!.clientHeight
// const top = scrollHeight - clientHeight - 100
// el.value!.scrollTo({ top, behavior: 'instant' })
loading.value = false loading.value = false
}) })

Loading…
Cancel
Save